Fix/optimizations (#3)
* revamped js/css asset build * update favicon compilation and color; cleanup package.json * fix spacing * update social media display and references * adjust about page sizing and mobile display * update jobs and page titles * abstract links to single source, small style fixes * adjust footer * update pro viddeo page and seo * seo and video fixes * fix seo display * move tor link to footer * sizing adjustments and add hosted video * video and sizing adjustments * wip video * final video * update pro link * temp fix for ticker start * update link, add auto orient, remove video border * fix contact form submission and mobile submit
54
.eleventy.js
@@ -1,61 +1,23 @@
|
||||
const eleventySass = require("eleventy-sass");
|
||||
const faviconPlugin = require("eleventy-favicon");
|
||||
const faviconPlugin = require("eleventy-plugin-gen-favicons");
|
||||
const format = require('date-fns/format')
|
||||
|
||||
// https://github.com/artstorm/eleventy-plugin-seo
|
||||
const pluginSEO = require("eleventy-plugin-seo");
|
||||
|
||||
// https://github.com/saneef/eleventy-plugin-img2picture
|
||||
const img2picture = require("eleventy-plugin-img2picture");
|
||||
|
||||
// https://www.npmjs.com/package/@sardine/eleventy-plugin-tinysvg
|
||||
const tinysvg = require('@sardine/eleventy-plugin-tinysvg');
|
||||
|
||||
// https://www.npmjs.com/package/@sardine/eleventy-plugin-tinyhtml
|
||||
const tinyHTML = require('@sardine/eleventy-plugin-tinyhtml');
|
||||
const slinkity = require('slinkity')
|
||||
|
||||
module.exports = function (eleventyConfig) {
|
||||
|
||||
eleventyConfig.addPassthroughCopy('src/assets/fonts');
|
||||
eleventyConfig.addPassthroughCopy("./src/assets/js");
|
||||
|
||||
|
||||
if (process.env.ELEVENTY_ENV === "enable-image-optim") {
|
||||
// img2picture (recommend not enabling)
|
||||
////// this plugin smartly optimizes images on build, such as converting pngs to smaller jpegs.
|
||||
////// did not see noticable speed gains when enabled, but it did cause rendering issues on older versions of Safari (e.g. on Calalina).
|
||||
////// specifially, jpeg masking (as a replacement for alpha pngs) doesn't seem to work for all browsers.
|
||||
eleventyConfig.addPlugin(img2picture, {
|
||||
// Should be same as Eleventy input folder set using `dir.input`.
|
||||
eleventyInputDir: "src",
|
||||
|
||||
// Output folder for optimized images.
|
||||
imagesOutputDir: "_site/assets/images",
|
||||
|
||||
// URL prefix for images src URLS.
|
||||
// It should match with path suffix in `imagesOutputDir`.
|
||||
// Eg: imagesOutputDir with `_site/images` likely need urlPath as `/images/`
|
||||
urlPath: "/assets/images/",
|
||||
sharpPngOptions: { pallette: true },
|
||||
sharpJpegOptions: { quality: 100 }
|
||||
});
|
||||
} else {
|
||||
// During development, copy the files to Eleventy's `dir.output`
|
||||
eleventyConfig.addPassthroughCopy('./src/assets/images/');
|
||||
}
|
||||
eleventyConfig.addPassthroughCopy('./src/assets/images/');
|
||||
eleventyConfig.addPassthroughCopy('./src/assets/videos/');
|
||||
eleventyConfig.addPassthroughCopy('public')
|
||||
|
||||
//plugins
|
||||
eleventyConfig.addPlugin(eleventySass);
|
||||
eleventyConfig.addPlugin(faviconPlugin, { destination: './_site' });
|
||||
eleventyConfig.addPlugin(faviconPlugin, { outputDir: './public' });
|
||||
eleventyConfig.addPlugin(slinkity.plugin, slinkity.defineConfig({}))
|
||||
eleventyConfig.addPlugin(pluginSEO, require("./src/_data/seo.json"));
|
||||
eleventyConfig.addPlugin(tinyHTML);
|
||||
eleventyConfig.addPlugin(tinysvg, {
|
||||
baseUrl: 'src/_includes/svgs/',
|
||||
});
|
||||
|
||||
eleventyConfig.addWatchTarget('./src/assets/styles/**/*')
|
||||
|
||||
// add date filter for human readability
|
||||
//filters
|
||||
eleventyConfig.addFilter('date', function (date, dateFormat) {
|
||||
return format(date, dateFormat)
|
||||
})
|
||||
|
||||
3
.gitignore
vendored
@@ -9,4 +9,5 @@
|
||||
|
||||
**/.DS_Store
|
||||
deploy_staging.sh
|
||||
deploy_prod.sh
|
||||
deploy_prod.sh
|
||||
**/*.mp4
|
||||
6
index.js
@@ -1,6 +0,0 @@
|
||||
// Set options as a parameter, environment variable, or rc file.
|
||||
// eslint-disable-next-line no-global-assign
|
||||
require = require("esm")(module/* , options */)
|
||||
|
||||
gsap.registerPlugin(DrawSVGPlugin);
|
||||
gsap.registerPlugin(CustomEase);
|
||||
6572
package-lock.json
generated
53
package.json
@@ -1,36 +1,39 @@
|
||||
{
|
||||
"name": "start9-landing",
|
||||
"name": "start9-website",
|
||||
"version": "1.0.0",
|
||||
"description": "The Start9 company landing page featuring embassyOS products",
|
||||
"main": "index.js",
|
||||
"module": "main.js",
|
||||
"scripts": {
|
||||
"start": "eleventy --watch --serve",
|
||||
"build": "eleventy"
|
||||
"start": "slinkity --serve --incremental",
|
||||
"build": "slinkity"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"keywords": [
|
||||
"open-source",
|
||||
"sovereign-computing",
|
||||
"personal-server",
|
||||
"bitcoin",
|
||||
"self-hosting",
|
||||
"federation",
|
||||
"bitcoin-node",
|
||||
"lightning-node",
|
||||
"p2p"
|
||||
],
|
||||
"author": "Start9",
|
||||
"license": "START9 NON-COMMERCIAL LICENSE v1",
|
||||
"devDependencies": {
|
||||
"@11ty/eleventy": "^1.0.1",
|
||||
"@11ty/eleventy": "^1.0.2",
|
||||
"@11ty/eleventy-img": "^2.0.1",
|
||||
"@sardine/eleventy-plugin-tinysvg": "^1.2.0",
|
||||
"date-fns": "^2.29.3",
|
||||
"eleventy-plugin-lazyimages": "^2.1.2"
|
||||
"eleventy-plugin-gen-favicons": "^1.1.1",
|
||||
"eleventy-plugin-lazyimages": "^2.1.2",
|
||||
"eleventy-plugin-seo": "^0.5.2",
|
||||
"slinkity": "^0.8.3"
|
||||
},
|
||||
"dependencies": {
|
||||
"@11ty/eleventy-fetch": "^3.0.0",
|
||||
"@11ty/eleventy-img": "^2.0.1",
|
||||
"@sardine/eleventy-plugin-tinycss": "^2.0.0",
|
||||
"@sardine/eleventy-plugin-tinyhtml": "^0.2.0",
|
||||
"@sardine/eleventy-plugin-tinysvg": "^1.2.0",
|
||||
"css-declaration-sorter": "^6.3.1",
|
||||
"eleventy-favicon": "^1.1.3",
|
||||
"eleventy-plugin-img2picture": "^3.0.0",
|
||||
"eleventy-plugin-seo": "^0.5.2",
|
||||
"eleventy-sass": "^1.3.1",
|
||||
"esm": "^3.2.25",
|
||||
"gsap": "^3.10.4",
|
||||
"list.js": "^2.3.1",
|
||||
"rss-parser": "^3.12.0",
|
||||
"webpack": "^5.72.1"
|
||||
}
|
||||
"rss-parser": "^3.12.0"
|
||||
},
|
||||
"browserslist": [
|
||||
"defaults"
|
||||
]
|
||||
}
|
||||
|
||||
BIN
public/apple-touch-icon.png
Normal file
|
After Width: | Height: | Size: 3.4 KiB |
BIN
public/favicon.ico
Normal file
|
After Width: | Height: | Size: 22 KiB |
@@ -1,5 +1,5 @@
|
||||
<svg width="400" height="400" viewBox="0 0 400 400" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="400" height="400" fill="#333333"/>
|
||||
<rect width="400" height="400" fill="#0F0F0F"/>
|
||||
<path d="M165.227 168.164C165.227 169.765 165.7 171.039 166.646 171.985C167.665 172.859 168.83 173.296 170.14 173.296C171.595 173.296 172.796 172.823 173.743 171.876C174.689 170.857 175.162 169.402 175.162 167.509V139.887C175.162 137.121 174.798 135.156 174.07 133.991C173.415 132.826 172.323 132.244 170.795 132.244C168.757 132.244 167.301 133.081 166.428 134.755C165.554 136.429 165.117 138.941 165.117 142.289C161.697 138.504 157.147 135.883 151.47 134.428C145.866 132.972 139.861 132.244 133.455 132.244C126.468 132.244 120.099 133.554 114.349 136.175C108.672 138.722 104.159 142.507 100.811 147.529C97.4627 152.552 95.7886 158.593 95.7886 165.653C95.7886 171.985 97.0987 177.19 99.719 181.266C102.412 185.269 105.906 188.472 110.2 190.874C114.495 193.203 120.063 195.532 126.905 197.861L144.81 203.975C150.706 206.013 155.401 208.015 158.894 209.98C162.461 211.945 165.19 214.42 167.083 217.404C168.975 220.388 169.921 224.137 169.921 228.65C169.921 237.457 167.192 243.935 161.733 248.083C156.274 252.232 149.214 254.307 140.552 254.307C134.656 254.307 128.87 253.324 123.193 251.359C117.588 249.394 113.003 246.883 109.436 243.825C105.869 240.696 104.086 237.602 104.086 234.545V221.553C104.086 219.879 103.577 218.569 102.558 217.622C101.611 216.676 100.447 216.203 99.064 216.203C97.681 216.203 96.5164 216.64 95.5702 217.513C94.6968 218.387 94.2601 219.66 94.2601 221.335V255.617C94.2601 258.674 94.6604 260.785 95.461 261.949C96.2617 263.114 97.6082 263.696 99.5007 263.696C101.175 263.696 102.449 262.532 103.322 260.202C104.195 257.873 104.632 254.598 104.632 250.376C108.49 254.452 113.84 257.691 120.681 260.093C127.523 262.495 134.038 263.696 140.225 263.696C147.649 263.696 154.382 262.495 160.423 260.093C166.464 257.691 171.304 253.834 174.944 248.52C178.583 243.207 180.403 236.438 180.403 228.213C180.403 222.172 179.129 217.077 176.581 212.928C174.034 208.706 170.358 205.176 165.554 202.337C160.823 199.426 154.636 196.66 146.994 194.04L132.145 188.908C124.867 186.361 119.626 184.323 116.423 182.794C113.221 181.266 110.71 179.155 108.89 176.462C107.143 173.769 106.27 169.984 106.27 165.107C106.27 157.829 108.89 152.115 114.131 147.966C119.371 143.744 126.65 141.634 135.967 141.634C140.479 141.634 144.883 142.252 149.177 143.49C153.544 144.727 157.184 146.619 160.095 149.167C163.079 151.642 164.79 154.662 165.227 158.229V168.164Z" fill="white"/>
|
||||
<path d="M266.873 215.002C273.132 215.002 279.283 213.619 285.324 210.853C291.365 208.087 296.387 204.011 300.391 198.625C297.188 221.043 284.014 241.897 260.868 261.185C259.994 261.986 259.558 262.859 259.558 263.805C259.558 265.043 260.067 266.171 261.086 267.19C262.105 268.282 263.27 268.828 264.58 268.828C265.672 268.828 266.691 268.391 267.637 267.517C276.517 259.511 284.087 251.504 290.346 243.498C296.679 235.491 301.81 226.284 305.741 215.876C309.744 205.394 311.745 193.639 311.745 180.611C311.745 165.617 308.142 153.825 300.937 145.237C293.804 136.575 283.177 132.244 269.056 132.244C260.904 132.244 253.698 133.918 247.439 137.266C241.179 140.615 236.302 145.382 232.809 151.569C229.388 157.683 227.677 164.852 227.677 173.077C227.677 181.302 229.242 188.581 232.372 194.913C235.502 201.246 240.015 206.195 245.91 209.762C251.806 213.255 258.793 215.002 266.873 215.002ZM301.264 173.842C301.264 179.592 299.845 184.941 297.006 189.891C294.24 194.768 290.201 198.698 284.887 201.682C279.647 204.594 273.533 206.049 266.545 206.049C260.14 206.049 254.79 204.521 250.496 201.464C246.274 198.334 243.144 194.258 241.106 189.236C239.141 184.214 238.158 178.718 238.158 172.75C238.158 167 239.359 161.723 241.761 156.919C244.163 152.115 247.693 148.294 252.352 145.455C257.083 142.616 262.651 141.197 269.056 141.197C276.408 141.197 282.485 142.689 287.289 145.673C292.093 148.585 295.623 152.515 297.88 157.465C300.136 162.341 301.264 167.8 301.264 173.842Z" fill="#FF4961"/>
|
||||
</svg>
|
||||
|
Before Width: | Height: | Size: 3.9 KiB After Width: | Height: | Size: 3.9 KiB |
BIN
public/icon-192.png
Normal file
|
After Width: | Height: | Size: 4.2 KiB |
BIN
public/icon-512.png
Normal file
|
After Width: | Height: | Size: 16 KiB |
1
public/manifest.webmanifest
Normal file
@@ -0,0 +1 @@
|
||||
{"icons":[{"src":"/icon-192.png","type":"image/png","sizes":"192x192"},{"src":"/icon-512.png","type":"image/png","sizes":"512x512"}]}
|
||||
BIN
public/thumbnail-pro.jpg
Normal file
|
After Width: | Height: | Size: 126 KiB |
|
Before Width: | Height: | Size: 87 KiB After Width: | Height: | Size: 87 KiB |
@@ -1,7 +1,7 @@
|
||||
---
|
||||
title: Not Found | Start9
|
||||
title: Not Found
|
||||
layout: layouts/peripheral.njk
|
||||
permalink: 404.html
|
||||
permalink: /public/404.html
|
||||
---
|
||||
|
||||
<section id="hero">
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
[
|
||||
{
|
||||
"title": "Social Media and Content Marketing Lead",
|
||||
"blurb": "The goal is omnipresence: Twitter threads, TikTok skits, YouTube videos, blog posts, podcasts. Any thread, conversation, or debate about Bitcoin/Lightning nodes, data privacy, or sovereign technology - Start9 is there. From shit posting on Twitter to extended essays on the moral justification for Stateless money, Start9 is a voice for freedom and for the sovereign individual.",
|
||||
"title": "Senior Backend Developer (Rust)",
|
||||
"blurb": "We are seeking an experienced Rust developer to contribute to the embassyOS backend codebase. The embassyOS backend is a novel and highly performant container management system that affords users granular control over applications running on their personal server.",
|
||||
"description": [
|
||||
"Work with CEO on content strategy",
|
||||
"Identify opportunities to grow and foster the Start9 community",
|
||||
@@ -11,12 +11,10 @@
|
||||
"Manage content pipelines of Start9 team members and coordinate publication for optimal engagement"
|
||||
],
|
||||
"requirements": [
|
||||
"Passion for Bitcoin and sovereign technology",
|
||||
"Excellent written communication skills",
|
||||
"Good sense of humor",
|
||||
"Organized",
|
||||
"Familiarity with various platforms and how to optimize visibility and engagement on them",
|
||||
"In tune with the cultures and trends of Start9's markets"
|
||||
"Familiarity with Rust's async model and the tokio runtime",
|
||||
"Familiarity with Linux kernel intrinsics",
|
||||
"Computer science / computer engineering degree or equivalent experience",
|
||||
"Bonus: Familiarity with the Linux FUSE apis"
|
||||
],
|
||||
"benefits": [
|
||||
"Competitive salary",
|
||||
@@ -28,6 +26,6 @@
|
||||
"Attend conferences",
|
||||
"Team retreats!"
|
||||
],
|
||||
"how": "Email us at jobs@start9labs.com with your resume and any other information you think we should know about you."
|
||||
"how": "Email us at jobs@start9.com with your resume and any other information you think we should know about you."
|
||||
}
|
||||
]
|
||||
|
||||
@@ -1,4 +1,6 @@
|
||||
[
|
||||
const site = require('./site')
|
||||
|
||||
module.exports = [
|
||||
{
|
||||
"inHeader": true,
|
||||
"inFlyout": false,
|
||||
@@ -7,14 +9,14 @@
|
||||
{
|
||||
"name": "Store",
|
||||
"slug": "store",
|
||||
"url": "https://store.start9.com/",
|
||||
"url": site.products.buyUrl,
|
||||
"target": "_blank",
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Developers",
|
||||
"slug": "dev",
|
||||
"url": "https://docs.start9.com/latest/developer-docs",
|
||||
"name": "Docs",
|
||||
"slug": "docs",
|
||||
"url": site.docs.url,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": "hide-on-mobile"
|
||||
@@ -22,7 +24,7 @@
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "Our Company",
|
||||
"name": "Company",
|
||||
"slug": "company",
|
||||
"order": 0,
|
||||
"size": "full",
|
||||
@@ -38,6 +40,76 @@
|
||||
"order": 0,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Jobs",
|
||||
"slug": "jobs",
|
||||
"url": "/jobs",
|
||||
"target": "",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Contribute",
|
||||
"slug": "contribute",
|
||||
"url": site.contribute.url,
|
||||
"target": "_blank",
|
||||
"order": 2,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Contact",
|
||||
"slug": "contact",
|
||||
"url": "/contact",
|
||||
"target": "",
|
||||
"order": 3,
|
||||
"class": ""
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "Products",
|
||||
"slug": "products",
|
||||
"order": 1,
|
||||
"size": "half",
|
||||
"inHeader": false,
|
||||
"inFlyout": true,
|
||||
"inFooter": true,
|
||||
"items": [
|
||||
{
|
||||
"name": "Embassy One",
|
||||
"slug": "embassy-one",
|
||||
"url": site.products.one,
|
||||
"target": "_blank",
|
||||
"order": 0,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Embassy Pro",
|
||||
"slug": "embassy-pro",
|
||||
"url": site.products.pro,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Gear",
|
||||
"slug": "gear",
|
||||
"url": site.products.gear,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "Media",
|
||||
"slug": "media",
|
||||
"order": 3,
|
||||
"size": "half",
|
||||
"inHeader": false,
|
||||
"inFlyout": true,
|
||||
"inFooter": true,
|
||||
"items": [
|
||||
{
|
||||
"name": "Podcasts",
|
||||
"slug": "news",
|
||||
@@ -49,74 +121,23 @@
|
||||
{
|
||||
"name": "Videos",
|
||||
"slug": "videos",
|
||||
"url": "https://www.youtube.com/channel/UCGEw4HJDvOn3Oy8ykR36P7Q",
|
||||
"url": site.media.youtube,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Contact",
|
||||
"slug": "contact",
|
||||
"url": "/contact",
|
||||
"target": "",
|
||||
"order": 2,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Jobs",
|
||||
"slug": "jobs",
|
||||
"url": "/jobs",
|
||||
"target": "",
|
||||
"order": 4,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Privacy",
|
||||
"slug": "privacy",
|
||||
"url": "/privacy",
|
||||
"target": "",
|
||||
"order": 5,
|
||||
"name": "Blog",
|
||||
"slug": "blog",
|
||||
"url": site.media.medium,
|
||||
"target": "_blank",
|
||||
"order": 3,
|
||||
"class": ""
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "Our Products",
|
||||
"slug": "products",
|
||||
"order": 1,
|
||||
"size": "full",
|
||||
"inHeader": false,
|
||||
"inFlyout": true,
|
||||
"inFooter": true,
|
||||
"items": [
|
||||
{
|
||||
"name": "Embassy One",
|
||||
"slug": "embassy-one",
|
||||
"url": "https://store.start9.com/collections/embassy/products/embassy-one",
|
||||
"target": "_blank",
|
||||
"order": 0,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Embassy Pro",
|
||||
"slug": "embassy-pro",
|
||||
"url": "https://store.start9.com/collections/embassy/products/embassy-2",
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Store",
|
||||
"slug": "store",
|
||||
"url": "https://store.start9.com/",
|
||||
"target": "_blank",
|
||||
"order": 2,
|
||||
"class": "highlight"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "EmbassyOS",
|
||||
"name": "embassyOS",
|
||||
"slug": "embassyos",
|
||||
"order": 2,
|
||||
"size": "half",
|
||||
@@ -127,15 +148,7 @@
|
||||
{
|
||||
"name": "Support",
|
||||
"slug": "support",
|
||||
"url": "https://docs.start9.com/latest/support/",
|
||||
"target": "_blank",
|
||||
"order": 0,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "FAQ",
|
||||
"slug": "faq",
|
||||
"url": "https://docs.start9.com/latest/support/faq/",
|
||||
"url": site.support.url,
|
||||
"target": "_blank",
|
||||
"order": 0,
|
||||
"class": ""
|
||||
@@ -143,7 +156,7 @@
|
||||
{
|
||||
"name": "Docs",
|
||||
"slug": "docs",
|
||||
"url": "https://docs.start9.com",
|
||||
"url": site.docs.url,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
@@ -151,7 +164,7 @@
|
||||
{
|
||||
"name": "Marketplace",
|
||||
"slug": "marketplace",
|
||||
"url": "https://marketplace.start9.com/",
|
||||
"url": site.dev.marketplace,
|
||||
"target": "_blank",
|
||||
"order": 2,
|
||||
"class": ""
|
||||
@@ -167,18 +180,10 @@
|
||||
"inFlyout": true,
|
||||
"inFooter": true,
|
||||
"items": [
|
||||
{
|
||||
"name": "Contribute",
|
||||
"slug": "contribute",
|
||||
"url": "https://docs.start9.com/latest/contribute/index",
|
||||
"target": "_blank",
|
||||
"order": 0,
|
||||
"class": ""
|
||||
},
|
||||
{
|
||||
"name": "Dev Docs",
|
||||
"slug": "dev-docs",
|
||||
"url": "https://docs.start9.com/latest/developer-docs",
|
||||
"url": site.dev.docs,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
@@ -186,7 +191,7 @@
|
||||
{
|
||||
"name": "Github",
|
||||
"slug": "github",
|
||||
"url": "https://github.com/Start9Labs",
|
||||
"url": site.dev.github,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": "",
|
||||
@@ -201,12 +206,12 @@
|
||||
"size": "half",
|
||||
"inHeader": false,
|
||||
"inFlyout": false,
|
||||
"inFooter": true,
|
||||
"inFooter": false,
|
||||
"items": [
|
||||
{
|
||||
"name": "Matrix",
|
||||
"slug": "matrix",
|
||||
"url": "https://matrix.to/#/!lMnRwPWnyQvOfAoEnD:matrix.start9labs.com",
|
||||
"url": site.media.matrix,
|
||||
"target": "_blank",
|
||||
"order": 0,
|
||||
"class": ""
|
||||
@@ -214,7 +219,7 @@
|
||||
{
|
||||
"name": "YouTube",
|
||||
"slug": "youtube",
|
||||
"url": "https://www.youtube.com/channel/UCGEw4HJDvOn3Oy8ykR36P7Q",
|
||||
"url": site.media.youtube,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
@@ -222,7 +227,7 @@
|
||||
{
|
||||
"name": "Telegram",
|
||||
"slug": "telegram",
|
||||
"url": "https://t.me/start9_labs",
|
||||
"url": site.media.telegram,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
@@ -230,7 +235,7 @@
|
||||
{
|
||||
"name": "Twitter",
|
||||
"slug": "twitter",
|
||||
"url": "https://twitter.com/start9labs",
|
||||
"url": site.media.twitter,
|
||||
"target": "_blank",
|
||||
"order": 1,
|
||||
"class": ""
|
||||
@@ -6,25 +6,27 @@ const parser = new Parser();
|
||||
let medium_feed = 'https://medium.com/feed/@Start9Labs';
|
||||
let twitter_feed = 'https://nitter.it/start9labs/rss';
|
||||
|
||||
module.exports = async function() {
|
||||
async function getFeeds() {
|
||||
|
||||
let md = await parser.parseURL(medium_feed);
|
||||
let tw = await parser.parseURL(twitter_feed);
|
||||
|
||||
let data = await Promise.all([md,tw]).then((values)=>{
|
||||
let data = await Promise.all([md, tw]).then((values) => {
|
||||
let all = [];
|
||||
|
||||
|
||||
values.forEach(item => {
|
||||
all = [...all, ...item.items];
|
||||
});
|
||||
|
||||
all.sort(function(a,b){
|
||||
all.sort(function (a, b) {
|
||||
return new Date(b.pubDate) - new Date(a.pubDate);
|
||||
});
|
||||
});
|
||||
|
||||
return all;
|
||||
});
|
||||
|
||||
return data;
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
// module.exports = getFeeds()
|
||||
@@ -1,8 +1,12 @@
|
||||
{
|
||||
"title": "Start9",
|
||||
"description": "Sovereign computing for a free future.",
|
||||
"description": "Sovereign computing for a free future",
|
||||
"url": "https://start9.com",
|
||||
"author": "Start9 Labs",
|
||||
"author": "Start9",
|
||||
"twitter": "start9labs",
|
||||
"image": "https://start9.com/assets/images/thumbnail.jpg"
|
||||
"image": "https://start9.com/thumbnail.jpg",
|
||||
"ogtype": "website",
|
||||
"options": {
|
||||
"titleDivider": "|"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,31 +1,52 @@
|
||||
module.exports = {
|
||||
url: 'https://start9.com',
|
||||
torUrl: 'http://privacy34kn4ez3y3nijweec6w4g54i3g54sdv7r5mr6soma3w4begyd.onion',
|
||||
pitch: {
|
||||
url: "#infographics" //"https://start9.com/latest/learn/index"
|
||||
url: '#infographics' //'https://start9.com/latest/learn/index'
|
||||
},
|
||||
products: {
|
||||
buyUrl: "https://store.start9.com/",
|
||||
diyUrl: "https://docs.start9.com/latest/diy",
|
||||
buyUrl: 'https://store.start9.com',
|
||||
diyUrl: 'https://docs.start9.com/latest/diy',
|
||||
one: 'https://store.start9.com/collections/embassy/products/embassy-one',
|
||||
pro: 'https://store.start9.com/products/embassy-pro-presale',
|
||||
gear: 'https://store.start9.com/collections/apparel'
|
||||
},
|
||||
bitcoin: {
|
||||
whyRunBitcoinUrl: "https://bitcoinmagazine.com/culture/six-reasons-you-should-run-bitcoin-node",
|
||||
whyRunLightningUrl: "",
|
||||
whyRunBitcoinUrl: 'https://bitcoinmagazine.com/culture/six-reasons-you-should-run-bitcoin-node',
|
||||
whyRunLightningUrl: '',
|
||||
},
|
||||
beYourOwn: {
|
||||
url: "https://marketplace.start9.com/"
|
||||
url: 'https://marketplace.start9.com'
|
||||
},
|
||||
poweredBy: {
|
||||
url: "https://github.com/Start9Labs/embassy-os"
|
||||
url: 'https://github.com/Start9Labs/embassy-os'
|
||||
},
|
||||
support: {
|
||||
url: "https://docs.start9.com/latest/support/index"
|
||||
url: 'https://docs.start9.com/latest/support'
|
||||
},
|
||||
docs: {
|
||||
url: 'https://docs.start9.com'
|
||||
},
|
||||
dev: {
|
||||
url: "https://docs.start9.com/latest/developer-docs"
|
||||
docs: 'https://docs.start9.com/latest/developer-docs',
|
||||
github: 'https://github.com/Start9Labs',
|
||||
marketplace: 'https://marketplace.start9.com'
|
||||
},
|
||||
contribute: {
|
||||
url: 'https://start9.com/latest/contribute'
|
||||
},
|
||||
footer: {
|
||||
copyright: "© " + new Date().getFullYear() + " by START9 LABS, INC.",
|
||||
canary: "WE HAVE NEVER RECEIVED A SECRET GOVERNMENT REQUEST TO HAND OVER USER INFORMATION.",
|
||||
copyright: '© ' + new Date().getFullYear() + ' by Start9 Labs, Inc',
|
||||
canary: 'We have never received a secret government request to hand over user information.',
|
||||
donate: 'https://btcpay.start9.com/apps/2Et1JUmJnDwzKncfVBXvspeXiFsa/crowdfund'
|
||||
},
|
||||
media: {
|
||||
// NOTE: the keys here correspond to the name of the svg logo
|
||||
matrix: 'https://matrix.to/#/!lMnRwPWnyQvOfAoEnD:matrix.start9labs.com',
|
||||
twitter: 'https://twitter.com/start9labs',
|
||||
telegram: 'https://t.me/start9_labs',
|
||||
youtube: 'https://www.youtube.com/channel/UCGEw4HJDvOn3Oy8ykR36P7Q',
|
||||
discourse: 'https://community.start9.com',
|
||||
medium: 'https://start9labs.medium.com',
|
||||
}
|
||||
};
|
||||
|
||||
@@ -1,14 +1,4 @@
|
||||
// if you uncomment these sections, you can fetch data from the github api on build
|
||||
//const EleventyFetch = require("@11ty/eleventy-fetch");
|
||||
|
||||
module.exports = async function() {
|
||||
// let url = "https://api.github.com/orgs/start9labs/public_members";
|
||||
|
||||
// /* This returns a promise */
|
||||
// return EleventyFetch(url, {
|
||||
// duration: "1d", // save for 1 day
|
||||
// type: "json"
|
||||
// });
|
||||
|
||||
return [
|
||||
{
|
||||
|
||||
@@ -3,7 +3,9 @@
|
||||
<div class="header">
|
||||
{% include "svgs/logo.svg" %}
|
||||
<div class="footer__copyright">{{ site.footer.copyright }}</div>
|
||||
<div class="footer__donate">
|
||||
{# <p>{% include 'components/encoded-email.njk' %}</p> #}
|
||||
<div class="footer__btns">
|
||||
<a target="_blank" rel="noopener noreferrer" href="{{ site.torUrl }}">{% include "svgs/tor.svg" %}</a>
|
||||
<a href="{{ site.footer.donate }}" class="btn" rel="noopener noreferrer" target="_blank">Donate</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -1,22 +0,0 @@
|
||||
<ul
|
||||
class="community__icons">
|
||||
{# {% for group in menu.filter(e => e.slug == 'contact') %}
|
||||
{% for item in group.items|sort(false, false, 'order') %}
|
||||
<li>
|
||||
<a {{'class=' + item.class + '' if item.class}} {{'target=' + item.target + '' if item.target}} href="/{{item.url}}">{{item.name}}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% endfor %} #}
|
||||
<li>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://matrix.to/#/!lMnRwPWnyQvOfAoEnD:matrix.start9labs.com">{% include "svgs/matrix.svg" %}</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://www.youtube.com/channel/UCGEw4HJDvOn3Oy8ykR36P7Q">{% include "svgs/youtube.svg" %}</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://t.me/start9_labs">{% include "svgs/telegram.svg" %}</a>
|
||||
</li>
|
||||
<li>
|
||||
<a target="_blank" rel="noopener noreferrer" href="https://twitter.com/start9labs">{% include "svgs/twitter.svg" %}</a>
|
||||
</li>
|
||||
</ul>
|
||||
@@ -1,7 +1,5 @@
|
||||
<section id="community">
|
||||
<h1>Get <em>updates</em></h1>
|
||||
<p>We will <em>never</em> share your email with anyone.</p>
|
||||
|
||||
{% include "components/landing/_contact.njk" %}
|
||||
|
||||
<h1>Get <em>updates</em></h1>
|
||||
<p>We will <em>never</em> share your email with anyone.</p>
|
||||
{% include "components/landing/contact.njk" %}
|
||||
</section>
|
||||
@@ -10,4 +10,4 @@
|
||||
</form>
|
||||
<div id="emailError" class="form-alert form-alert--error"></div>
|
||||
<div id="emailSuccess" class="form-alert form-alert--success"></div>
|
||||
{% include "components/landing/_social-media.njk" %}
|
||||
{% include "components/landing/social-media.njk" %}
|
||||
@@ -9,7 +9,7 @@
|
||||
<p>Unleash your favorite open source project!</p>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<a class="btn" href="{{ site.dev.url }}" rel="noopener noreferrer" target="_blank">View the docs</a>
|
||||
<a class="btn" href="{{ site.dev.docs }}" rel="noopener noreferrer" target="_blank">View the docs</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -19,7 +19,7 @@
|
||||
</div>
|
||||
<div class="skills">
|
||||
<p>
|
||||
Have other skills? <a href="https://start9.com/latest/contribute/index" rel="noopener noreferrer" target="_blank">We need your help</a>.
|
||||
<p>
|
||||
Have other skills? <a href="{{ site.contribute.url }}" rel="noopener noreferrer" target="_blank">We need your help</a>.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,10 +1,10 @@
|
||||
<section id="hero">
|
||||
<div id="hero-image" class="image-with-shadow">
|
||||
<img src="/assets/images/explosion.png" alt="start9 hero; voxel explosion" title="start9 hero; voxel explosion">
|
||||
<img as="image" class="img-shadow" src="/assets/images/explosion.png" alt="">
|
||||
</div>
|
||||
<div id="logo">
|
||||
{% include "svgs/logo.svg" %}
|
||||
<span>sovereign computing</span>
|
||||
</div>
|
||||
<div id="hero-image" class="image-with-shadow">
|
||||
<img src="/assets/images/explosion.png" alt="start9 hero; voxel explosion" title="start9 hero; voxel explosion">
|
||||
<img as="image" class="img-shadow" src="/assets/images/explosion.png" alt="">
|
||||
</div>
|
||||
<div id="logo">
|
||||
{% include "svgs/logo.svg" %}
|
||||
<span>sovereign computing</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
@@ -1,20 +1,20 @@
|
||||
<section id="highlights">
|
||||
<aside>
|
||||
<h1>Take back control of your digital life</h1>
|
||||
<div class="content">
|
||||
<div class="spacer"></div>
|
||||
<div class="blurb">
|
||||
<p>We built an operating system from the ground up so you can run your own server and own your data.</p>
|
||||
<p><strong>This is your <em>personal cloud</em>.</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<ul>
|
||||
{% for highlight in highlights %}
|
||||
<li>
|
||||
<div class="highlight-icon">{% include "svgs/" + highlight.slug + ".njk" %}</div>
|
||||
<h3>{{highlight.name|safe}}</h3>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<aside>
|
||||
<h1>Take back control of your digital life</h1>
|
||||
<div class="content">
|
||||
<div class="spacer"></div>
|
||||
<div class="blurb">
|
||||
<p>We built an operating system from the ground up so you can run your own server and own your data.</p>
|
||||
<p><strong>This is your <em>personal cloud</em>.</strong></p>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
<ul>
|
||||
{% for highlight in highlights %}
|
||||
<li>
|
||||
<div class="highlight-icon">{% include "svgs/" + highlight.slug + ".njk" %}</div>
|
||||
<h3>{{highlight.name|safe}}</h3>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</section>
|
||||
@@ -1,24 +1,23 @@
|
||||
<section id="how">
|
||||
<h2>How does it work?</h2>
|
||||
<div class="cols">
|
||||
<div class="col">
|
||||
<h3>Simple & Fast</h3>
|
||||
<div class="path-node">
|
||||
<h4>For Everyone</h4>
|
||||
<p>No assembly required.</p>
|
||||
<p>No coding.</p>
|
||||
<p>No command line.</p>
|
||||
<p>Just plug it in.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<h3>DIY</h3>
|
||||
<div class="path-node">
|
||||
<h4>For the Tinkerer</h4>
|
||||
<p>You assemble the hardware.</p>
|
||||
<p>You download the OS or build from source.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<h2>How does it work?</h2>
|
||||
<div class="cols">
|
||||
<div class="col">
|
||||
<h3>Simple & Fast</h3>
|
||||
<div class="path-node">
|
||||
<h4>For Everyone</h4>
|
||||
<p>No assembly required.</p>
|
||||
<p>No coding.</p>
|
||||
<p>No command line.</p>
|
||||
<p>Just plug it in.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col">
|
||||
<h3>DIY</h3>
|
||||
<div class="path-node">
|
||||
<h4>For the Tinkerer</h4>
|
||||
<p>You assemble the hardware.</p>
|
||||
<p>You download the OS or build from source.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -4,5 +4,4 @@
|
||||
<p><em>Opt out</em> by running a private server.</p>
|
||||
<p>Previously, it was only available to the tech saavy and the wealthy. Start9 levels the playing field by making it possible for everyone else.</p>
|
||||
{# <a class="btn" href="{{ site.pitch.url }}">learn more</a> #}
|
||||
{# <iframe id="odysee-iframe" width="560" height="315" src="https://odysee.com/$/embed/@purism:8/introducing-pureboot-basic:d?r=B2sJWhwiPNQDy457RV1NjAYxDb6uiHGm" allowfullscreen></iframe> #}
|
||||
</section>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<section id="powered-by">
|
||||
<h1>Powered by <em>embassyOS</em></h1>
|
||||
<p>Just as Windows and MacOS made it possible for anyone to own a personal computer, embassyOS makes it possible for anyone to own a personal server.</p>
|
||||
<p>Just as Windows and macOS made it possible for anyone to own a personal computer, embassyOS makes it possible for anyone to own a personal server.</p>
|
||||
<p>embassyOS facilitates the entire process of discovering, installing, configuring, and using any variety of open-source software from anywhere in the world without trusting anyone.</p>
|
||||
<p>
|
||||
embassyOS is the distribution platform open source software has been waiting for.
|
||||
|
||||
7
src/_includes/components/landing/social-media.njk
Normal file
@@ -0,0 +1,7 @@
|
||||
<ul class="community__icons">
|
||||
{% for name, item in site.media %}
|
||||
<li>
|
||||
<a target="_blank" rel="noopener noreferrer" href="{{ item }}">{% include "svgs/" + name + ".svg" %}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
@@ -1,38 +1,38 @@
|
||||
<section id="why">
|
||||
<h2>Why run your own server?</h2>
|
||||
<div class="nodes">
|
||||
<div class="row">
|
||||
<div class="path-node path-node-text">
|
||||
<p>Right now, your favorite apps send your personal data off to live on a server somewhere else - where it can be analyzed, censored, sold or worse.</p>
|
||||
</div>
|
||||
<div class="path-node path-node-img">
|
||||
<img src="/assets/images/big-tech-theft.gif" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="path-node path-node-text">
|
||||
<p>But when you run your own server, you control your data. Your data never has to leave the privacy of your own home.</p>
|
||||
</div>
|
||||
<div class="path-node path-node-img">
|
||||
<img src="/assets/images/big-tech-fail.gif" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<h2>Why run your own server?</h2>
|
||||
<div class="nodes">
|
||||
<div class="row">
|
||||
<div class="path-node path-node-text">
|
||||
<p>Right now, your favorite apps send your personal data off to live on a server somewhere else - where it can be analyzed, censored, sold or worse.</p>
|
||||
</div>
|
||||
<div class="path-node path-node-img">
|
||||
<img src="/assets/images/big-tech-theft.gif" alt="">
|
||||
</div>
|
||||
</div>
|
||||
<div class="cols">
|
||||
<div class="col">
|
||||
<h3>When you run your own server, you are your <em>own cloud</em>.</h3>
|
||||
</div>
|
||||
<div class="col" id='ticker'>
|
||||
<div id="ticker__selected-frame">
|
||||
be your own
|
||||
</div>
|
||||
<div id="ticker__window">
|
||||
<ul class='pseudoservices'>
|
||||
{% for pseudoservice in pseudoservices %}
|
||||
<li class="pseudoservice">{{pseudoservice.name}}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="path-node path-node-text">
|
||||
<p>But when you run your own server, you control your data. Your data never has to leave the privacy of your own home.</p>
|
||||
</div>
|
||||
<div class="path-node path-node-img">
|
||||
<img src="/assets/images/big-tech-fail.gif" alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="cols">
|
||||
<div class="col">
|
||||
<h3>When you run your own server, you are your <em>own cloud</em>.</h3>
|
||||
</div>
|
||||
<div class="col" id='ticker'>
|
||||
<div id="ticker__selected-frame">
|
||||
be your own
|
||||
</div>
|
||||
<div id="ticker__window">
|
||||
<ul class='pseudoservices'>
|
||||
{% for pseudoservice in pseudoservices %}
|
||||
<li class="pseudoservice">{{pseudoservice.name}}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,5 +1,5 @@
|
||||
---
|
||||
title: License | Start9
|
||||
title: License
|
||||
layout: layouts/peripheral.njk
|
||||
---
|
||||
|
||||
|
||||
@@ -1,18 +1,18 @@
|
||||
<section id="menu">
|
||||
<div class="menu-content">
|
||||
<ul class="groups">
|
||||
{% for group in menu|selectattr("inFlyout")|sort(false, false, 'order') %}
|
||||
<li class="{{group.size}}">
|
||||
<h1>{{group.name}}</h1>
|
||||
<ul>
|
||||
{% for item in group.items|sort(false, false, 'order') %}
|
||||
<li>
|
||||
<a {{'class=' + item.class + '' if item.class}} {{'target=' + item.target + '' if item.target}} href="{{item.url}}">{{item.name}}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</li>
|
||||
{% endfor %}
|
||||
<div class="menu-content">
|
||||
<ul class="groups">
|
||||
{% for group in menu|selectattr("inFlyout")|sort(false, false, 'order') %}
|
||||
<li class="{{group.size}}">
|
||||
<h1>{{group.name}}</h1>
|
||||
<ul>
|
||||
{% for item in group.items|sort(false, false, 'order') %}
|
||||
<li>
|
||||
<a {{'class=' + item.class + '' if item.class}} {{'target=' + item.target + '' if item.target}} href="{{item.url}}">{{item.name}}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,14 +1,11 @@
|
||||
<!DOCTYPE html>
|
||||
{# <html lang="en" style="--scrollbarWidth: 0px; --viewportWidth: calc(100vw - var(--scrollbarWidth));"> #}
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
{# <meta name="description" content="{{ description }}">
|
||||
<title>{{ title }}</title> #}
|
||||
{% favicon './favicon.svg' %}
|
||||
<link rel="stylesheet" href="/assets/styles/main.css">
|
||||
{% favicons './public/favicon.svg' %}
|
||||
<link rel="stylesheet" href="/@root/src/assets/styles/main.scss">{{ __slinkity.head | safe }}
|
||||
{% seo "" %}
|
||||
</head>
|
||||
<body>
|
||||
@@ -22,30 +19,5 @@
|
||||
</main>
|
||||
|
||||
{% include "components/footer.njk" %}
|
||||
|
||||
{# <script>
|
||||
window.onload = setScrollbarVariable;
|
||||
document.onload = setScrollbarVariable;
|
||||
window.onresize = setScrollbarVariable;
|
||||
|
||||
function setScrollbarVariable() {
|
||||
|
||||
const viewportDependantWidth = (typeof window.orientation !== "undefined") ? screen.width : window.innerWidth;
|
||||
|
||||
const scrollbarWidth = viewportDependantWidth - document.body.clientWidth;
|
||||
document.documentElement.style.setProperty("--scrollbarWidth", `${scrollbarWidth}px`);
|
||||
|
||||
console.log(scrollbarWidth);
|
||||
}
|
||||
|
||||
</script> #}
|
||||
|
||||
<style>
|
||||
:root{
|
||||
--viewportWidth: calc(100vw - var(--scrollbarWidth));
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@@ -2,25 +2,16 @@
|
||||
layout: layouts/base.njk
|
||||
---
|
||||
|
||||
<link rel="stylesheet" href="/assets/styles/peripheral.css"/>
|
||||
<link rel="stylesheet" href="/@root/src/assets/styles/peripheral.scss"/>{{ __slinkity.head | safe }}
|
||||
|
||||
{{ content | safe }}
|
||||
|
||||
<script defer src="{{ '/assets/js/libraries/gsap.min.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/libraries/ScrollTrigger.min.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/libraries/DrawSVGPlugin.min.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/libraries/CustomEase.min.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/_header.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/_menu.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/_hero.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/peripheral.js' | url }}"></script>
|
||||
|
||||
{# <script defer>
|
||||
|
||||
var options = {
|
||||
valueNames: [ 'name', 'city' ]
|
||||
};
|
||||
|
||||
var hackerList = new List('hacker-list', options);
|
||||
|
||||
</script> #}
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/gsap.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/CustomEase.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/ScrollTrigger.min.js"></script>
|
||||
<script src="{{ '/libs/DrawSVGPlugin.min.js' }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/main.js' }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/header.js' }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/menu.js' }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/hero.js' }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/peripheral.js' }}"></script>
|
||||
1
src/_includes/svgs/discourse.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="var(--c-text-primary)" d="M225.9 32C103.3 32 0 130.5 0 252.1 0 256 .1 480 .1 480l225.8-.2c122.7 0 222.1-102.3 222.1-223.9C448 134.3 348.6 32 225.9 32zM224 384c-19.4 0-37.9-4.3-54.4-12.1L88.5 392l22.9-75c-9.8-18.1-15.4-38.9-15.4-61 0-70.7 57.3-128 128-128s128 57.3 128 128-57.3 128-128 128z"/></svg>
|
||||
|
After Width: | Height: | Size: 372 B |
3
src/_includes/svgs/medium.svg
Normal file
@@ -0,0 +1,3 @@
|
||||
<svg fill="var(--c-text-primary)" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 30" width="480px">
|
||||
<path d="M8.5 7A8.5 8.5 0 108.5 24 8.5 8.5 0 108.5 7zM22 8A4 7.5 0 1022 23 4 7.5 0 1022 8zM28.5 9A1.5 6.5 0 1028.5 22 1.5 6.5 0 1028.5 9z"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 254 B |
@@ -1,4 +1,3 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
class="menu-icon"
|
||||
viewBox="0 0 13.414213 13.414213"
|
||||
|
||||
|
Before Width: | Height: | Size: 381 B After Width: | Height: | Size: 326 B |
@@ -1,4 +1,3 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<svg
|
||||
class="menu-icon"
|
||||
viewBox="0 0 26.999994 17.999969"
|
||||
|
||||
|
Before Width: | Height: | Size: 301 B After Width: | Height: | Size: 246 B |
5
src/_includes/svgs/tor.svg
Normal file
@@ -0,0 +1,5 @@
|
||||
<svg viewBox="0 0 180 180" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
||||
<g id="tor-glyph" stroke="none" stroke-width="1" fill="var(--c-text-primary)" fill-rule="evenodd">
|
||||
<path d="M90.1846205,163.631147 L90.1846205,152.721073 C124.743583,152.621278 152.726063,124.581416 152.726063,89.9975051 C152.726063,55.4160892 124.743583,27.3762266 90.1846205,27.2764318 L90.1846205,16.366358 C130.768698,16.4686478 163.633642,49.3909741 163.633642,89.9975051 C163.633642,130.606531 130.768698,163.531352 90.1846205,163.631147 Z M90.1846205,125.444642 C109.677053,125.342352 125.454621,109.517381 125.454621,89.9975051 C125.454621,70.4801242 109.677053,54.6551533 90.1846205,54.5528636 L90.1846205,43.6452847 C115.704663,43.7450796 136.364695,64.4550091 136.364695,89.9975051 C136.364695,115.542496 115.704663,136.252426 90.1846205,136.35222 L90.1846205,125.444642 Z M90.1846205,70.9167267 C100.640628,71.0165216 109.090758,79.5165493 109.090758,89.9975051 C109.090758,100.480956 100.640628,108.980984 90.1846205,109.080778 L90.1846205,70.9167267 Z M0,89.9975051 C0,139.705328 40.2921772,180 90,180 C139.705328,180 180,139.705328 180,89.9975051 C180,40.2921772 139.705328,0 90,0 C40.2921772,0 0,40.2921772 0,89.9975051 Z" id="tor-glyph" fill="var(--c-text-primary)"></path>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
284
src/about.njk
@@ -1,181 +1,143 @@
|
||||
---
|
||||
title: About | Start9
|
||||
title: About
|
||||
layout: layouts/peripheral.njk
|
||||
---
|
||||
|
||||
<section id="hero" class="hero--about">
|
||||
<div id="hero-image" class="image-with-shadow">
|
||||
<img src="/assets/images/about-hero.png" alt="about page hero image: a robot emerging from the embasssy" title="about page hero image: a robot emerging from the embasssy"/>
|
||||
<img class="img-shadow" src="/assets/images/about-hero.png" alt=""/>
|
||||
</div>
|
||||
<div id="logo">
|
||||
<h1>
|
||||
{% include "svgs/about-start9.svg" %}
|
||||
<span style="display: none;">About Start9</span>
|
||||
</h1>
|
||||
<ul id="sub-menu">
|
||||
<li>
|
||||
<a href="#mission">mission</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#values">values</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#virtues">virtues</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#origin">origin story</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div id="hero-image" class="image-with-shadow">
|
||||
<img src="/assets/images/about-hero.png" alt="about page hero image: a robot emerging from the embasssy" title="about page hero image: a robot emerging from the embasssy"/>
|
||||
<img class="img-shadow" src="/assets/images/about-hero.png" alt=""/>
|
||||
</div>
|
||||
<div id="logo">
|
||||
<h1>
|
||||
{% include "svgs/about-start9.svg" %}
|
||||
<span style="display: none;">About Start9</span>
|
||||
</h1>
|
||||
<ul id="sub-menu">
|
||||
<li>
|
||||
<a href="#mission">mission</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#values">values</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#virtues">virtues</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#origin">origin story</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<section id="blurb">
|
||||
<h2>Privacy and<br/> free speech are fundamental human rights and essential ingredients for a free society.</h2>
|
||||
<p>Human history demonstrates that, when entrusted to others, these rights are invariably denied, resulting in great
|
||||
suffering. As such, it is necessary for individuals to protect their own privacy and right to speak freely.
|
||||
</p>
|
||||
<p>Fortunately, modern technologies, in the form of personal computers, encryption, and open, decentralized network
|
||||
protocols such as the Internet and Bitcoin, make this a real possibility.
|
||||
</p>
|
||||
<p>What is needed is a revolution in personal computing away from the current, hosted, custodial model that breeds
|
||||
dependency and corruption, towards a decentralized model, where individuals have absolute control over their data and
|
||||
communications.</p>
|
||||
<h2>Privacy and free speech are fundamental human rights and essential ingredients for a free society.</h2>
|
||||
<p>Human history demonstrates that, when entrusted to others, these rights are invariably denied, resulting in great suffering. As such, it is necessary for individuals to protect their own privacy and right to speak freely.</p>
|
||||
<p>Fortunately, modern technologies, in the form of personal computers, encryption, and open, decentralized network protocols such as the Internet and Bitcoin, make this a real possibility.</p>
|
||||
<p>What is needed is a revolution in personal computing away from the current, hosted, custodial model that breeds dependency and corruption, towards a decentralized model, where individuals have absolute control over their data and communications.</p>
|
||||
</section>
|
||||
<section id="mission">
|
||||
<h2>Mission</h2>
|
||||
<div class="section__double-image">
|
||||
<div class="section__image section__image--left">
|
||||
<img src="/assets/images/mission-left-header.png" alt="mission section hero: a rocketship trail" title="mission section hero: a rocketship trail"/>
|
||||
<img class="img-shadow" src="/assets/images/mission-left-header.png" alt=""/>
|
||||
</div>
|
||||
<h3>To eliminate the need for trusted third parties in the human/computer relationship.</h3>
|
||||
<div class="section__image section__image--right">
|
||||
<img src="/assets/images/mission-right-header.png" alt="mission section hero: a rocketship with trail" title="mission section hero: a rocketship with trail"/>
|
||||
<img class="img-shadow" src="/assets/images/mission-right-header.png" alt=""/>
|
||||
</div>
|
||||
<h2>Mission</h2>
|
||||
<div class="section__double-image">
|
||||
<div class="section__image section__image--left">
|
||||
<img src="/assets/images/mission-left-header.png" alt="mission section hero: a rocketship trail" title="mission section hero: a rocketship trail"/>
|
||||
<img class="img-shadow" src="/assets/images/mission-left-header.png" alt=""/>
|
||||
</div>
|
||||
{# <img src="" alt="" class="section__img section__img--bkg"/> #}
|
||||
<h3>To eliminate the need for trusted third parties in the human/computer relationship.</h3>
|
||||
<div class="section__image section__image--right">
|
||||
<img src="/assets/images/mission-right-header.png" alt="mission section hero: a rocketship with trail" title="mission section hero: a rocketship with trail"/>
|
||||
<img class="img-shadow" src="/assets/images/mission-right-header.png" alt=""/>
|
||||
</div>
|
||||
</div>
|
||||
{# <img src="" alt="" class="section__img section__img--bkg"/> #}
|
||||
</section>
|
||||
<section id="values">
|
||||
<h2>Values</h2>
|
||||
<div class="section__image">
|
||||
<img src="/assets/images/values-header.png" alt="values section hero: an eye with a slash through it" title="values section hero: an eye with a slash through it"/>
|
||||
<img class="img-shadow" src="/assets/images/values-header.png" alt=""/>
|
||||
</div>
|
||||
<p>
|
||||
<strong>This list of values is not comprehensive. It does not encapsulate all the values of all the members of Start9.
|
||||
Instead, we attempt to enumerate those values which represent the fulfillment of our mission and which are practically
|
||||
within our ability to achieve.</strong>
|
||||
</p>
|
||||
<h4>decentralization</h4>
|
||||
<p>Centralized systems act as single points of failure and are susceptible to corruption. Decentralized systems afford
|
||||
greater robustness and soundness guarantees.</p>
|
||||
<H4>openness</H4>
|
||||
<p>Everyone should have permissionless access to computing resources and tools, unrestricted by geography, ethnicity, or
|
||||
belief.</p>
|
||||
<H4>community</H4>
|
||||
<p>The human experience is richest when shared amongst individuals who possessing common beliefs, values, and
|
||||
activities, and that computers should facilitate the formation of communities.</p>
|
||||
<H4>privacy</H4>
|
||||
<p>There are four reasons that privacy is necessary for a free society and proper human existence: privacy (1) promotes
|
||||
creativity and experimentation by minimizing the risk of embarrassment; (2) protects valuable information from theft and
|
||||
extortion; (3) enables the diffusion of contrarian ideals and ideas; (4) serves as an insurance policy against the
|
||||
future, in the event that what is acceptable today becomes unacceptable tomorrow.</p>
|
||||
<h4>independence</h4>
|
||||
<p>Being dependent means being unable to survive on your own. Like a child, it means needing others and relying on them
|
||||
to provide for you, thus granting them power over you. A free and dignified human existence demands self-reliance: the
|
||||
ability to think and act with efficacy to obtain one's needs.</p>
|
||||
<h2>Values</h2>
|
||||
<div class="section__image">
|
||||
<img src="/assets/images/values-header.png" alt="values section hero: an eye with a slash through it" title="values section hero: an eye with a slash through it"/>
|
||||
<img class="img-shadow" src="/assets/images/values-header.png" alt=""/>
|
||||
</div>
|
||||
<p><strong>This list of values is not comprehensive. It does not encapsulate all the values of all the members of Start9. Instead, we attempt to enumerate those values which represent the fulfillment of our mission and which are practically within our ability to achieve.</strong></p>
|
||||
|
||||
<h4>decentralization</h4>
|
||||
<p>Centralized systems act as single points of failure and are susceptible to corruption. Decentralized systems afford greater robustness and soundness guarantees.</p>
|
||||
|
||||
<h4>openness</h4>
|
||||
<p>Everyone should have permissionless access to computing resources and tools, unrestricted by geography, ethnicity, or belief.</p>
|
||||
|
||||
<h4>community</h4>
|
||||
<p>The human experience is richest when shared amongst individuals who possessing common beliefs, values, and activities, and that computers should facilitate the formation of communities.</p>
|
||||
|
||||
<h4>privacy</h4>
|
||||
<p>There are four reasons that privacy is necessary for a free society and proper human existence: privacy (1) promotes creativity and experimentation by minimizing the risk of embarrassment; (2) protects valuable information from theft and extortion; (3) enables the diffusion of contrarian ideals and ideas; (4) serves as an insurance policy against the future, in the event that what is acceptable today becomes unacceptable tomorrow.</p>
|
||||
|
||||
<h4>independence</h4>
|
||||
<p>Being dependent means being unable to survive on your own. Like a child, it means needing others and relying on them to provide for you, thus granting them power over you. A free and dignified human existence demands self-reliance: the ability to think and act with efficacy to obtain one's needs.</p>
|
||||
</section>
|
||||
<section id="virtues">
|
||||
<h2>Virtues</h2>
|
||||
<div class="section__image">
|
||||
<img src="/assets/images/virtues-header.png" alt="virtues section hero: a sunrise between mountains" title="virtues section hero: a sunrise between mountains"/>
|
||||
<img class="img-shadow" src="/assets/images/virtues-header.png" alt=""/>
|
||||
</div>
|
||||
<p>
|
||||
<strong>Below are the virtues or qualities of character needed to achieve our values and accomplish our mission.</strong>
|
||||
</p>
|
||||
<h4>Audacity</h4>
|
||||
<p>A willingness to take bold risks.</p>
|
||||
<h4>Tenacity</h4>
|
||||
<p>Fierce determination and relentless effort.</p>
|
||||
<h4>Excellence</h4>
|
||||
<p>Setting high standards and never settling for less.</p>
|
||||
<h4>courtesy</h4>
|
||||
<p>Treating others politely, with kindness and due respect.</p>
|
||||
<h4>generocity</h4>
|
||||
<p>providing beyond what is necessary or expected.</p>
|
||||
<h4>fortitude</h4>
|
||||
<p>Having courage in the face of pain or adversity.</p>
|
||||
<h4>integrity</h4>
|
||||
<p>The virtue that underlies all others. The quality of being whole and genuine, intact and unbroken, internally
|
||||
consistent, and adhering to principle in all cases.</p>
|
||||
<h2>Virtues</h2>
|
||||
<div class="section__image">
|
||||
<img src="/assets/images/virtues-header.png" alt="virtues section hero: a sunrise between mountains" title="virtues section hero: a sunrise between mountains"/>
|
||||
<img class="img-shadow" src="/assets/images/virtues-header.png" alt=""/>
|
||||
</div>
|
||||
<p><strong>Below are the virtues or qualities of character needed to achieve our values and accomplish our mission.</strong></p>
|
||||
|
||||
<h4>Audacity</h4>
|
||||
<p>A willingness to take bold risks.</p>
|
||||
|
||||
<h4>Tenacity</h4>
|
||||
<p>Fierce determination and relentless effort.</p>
|
||||
|
||||
<h4>Excellence</h4>
|
||||
<p>Setting high standards and never settling for less.</p>
|
||||
|
||||
<h4>courtesy</h4>
|
||||
<p>Treating others politely, with kindness and due respect.</p>
|
||||
|
||||
<h4>generocity</h4>
|
||||
<p>Providing beyond what is necessary or expected.</p>
|
||||
|
||||
<h4>fortitude</h4>
|
||||
<p>Having courage in the face of pain or adversity.</p>
|
||||
|
||||
<h4>integrity</h4>
|
||||
<p>The virtue that underlies all others. The quality of being whole and genuine, intact and unbroken, internally consistent, and adhering to principle in all cases.</p>
|
||||
|
||||
</section>
|
||||
<section id="origin">
|
||||
<h2>Origin Story</h2>
|
||||
<div class="section__image">
|
||||
<img src="/assets/images/origin-header.png" alt="origin section hero: pikachu" title="origin section hero: pikachu"/>
|
||||
<img class="img-shadow" src="/assets/images/origin-header.png" alt=""/>
|
||||
</div>
|
||||
<p>
|
||||
<strong>Pokemon is a game for Gameboy.</strong>
|
||||
Twitch is a live video streaming app. “Twitch Plays Pokemon” was a popular phenomenon where Twitch users would
|
||||
collaborate to play a SHARED game of Pokemon on Gameboy. Here's how it worked:</p>
|
||||
<p>Participants would use the Twitch message board to enter commands that then got executed in the gameplay. For
|
||||
example, if someone entered the command “right”, that would cause the player to move 1 space to the right. Commands
|
||||
would execute immediately after they were received, and anyone could enter a valid command at any time. You can think of
|
||||
Twitch Plays Pokemon as the more practical equivalent of placing a Gameboy in the middle of a crowded room and telling
|
||||
everyone to push buttons at the same time. As you might expect, the gameplay of Twitch Plays Pokemon was quite
|
||||
“twitchy”, but in a very “infinite monkey theory” way, progress could eventually be made.</p>
|
||||
<p>
|
||||
<strong>In an effort to streamline play</strong>, a new game mode was devised in which players would “vote” for the next
|
||||
command and, every 4 seconds, whatever command received the most votes over the previous 4 seconds would execute in the
|
||||
game. Also introduced in this mode was the ability to attach multipliers to a command, such that the command would
|
||||
execute that number of times. For example, “right2” would cause the player to move 2 spaces to the right. “right3” would
|
||||
cause the player to move 3 spaces to the right, and so on. The highest number any participant could place after a
|
||||
command was 9, meaning whatever command they entered would execute 9 times. As you might expect, gameplay in this mode
|
||||
was less chaotic, more efficient, but it also meant each participant had less direct and immediate influence over the
|
||||
game. If a group of even 5-10 got together and colluded on their votes, they could practically take over the game and
|
||||
make contrarian ideas irrelevant. The new game mode was called “Democracy”, and the original game mode became known as
|
||||
“Anarchy”. Which game mode was engaged was itself governed by a democratic process: if more participants wanted to play
|
||||
in Democracy mode, then Democracy mode engaged; if more wanted to play in Anarchy mode, then Anarchy mode engaged.</p>
|
||||
<p>To summarize:
|
||||
<strong>in Anarchy mode, everyone had equal influence over the game</strong>, but progress was slow and clunky. In
|
||||
Democracy mode, progress was fast and efficient, but colluding groups could marginalize individual participants and ruin
|
||||
the game for them.</p>
|
||||
<p>So… individual participants
|
||||
<strong>discovered a means of effective protest</strong>
|
||||
whenever Democracy mode became suffocating, but they could not garner enough votes to switch back to Anarchy mode.
|
||||
Someone would type the command “start9” into the comments. This command meant “open the start menu 9 times in a row”,
|
||||
which, as you might imagine, would be enormously disruptive if executed. The entire screen would be blocked by the start
|
||||
menu, over and over. Typing “start9” was a participant's way of signaling to other participants that they felt
|
||||
marginalized by Democracy mode, and they were ready to fight back. If others felt the same, they could also begin typing
|
||||
“start9” - then, sure enough, “start9” would finally receive more votes than the colluding group's command, and the menu
|
||||
opening would begin. Every 4 seconds, the menu would open 9 times…again, and again, and again…until finally, the
|
||||
colluding group would be forced to either cooperate in reverting the game mode back to Anarchy mode or quit altogether.</p>
|
||||
<p>Playing in Anarchy mode was impractical, but people did not want to play a game where they had no voice, where a
|
||||
group of insiders had taken total control. And so
|
||||
<strong>“start9” became the battle cry of the individual</strong>, the out-group, a means of signaling to other
|
||||
individuals that it was time to fight back against the usurpers - to use their own rules against them, until there was
|
||||
no alternative but to return control to the individual participants.</p>
|
||||
<h2>Origin Story</h2>
|
||||
<div class="section__image">
|
||||
<img src="/assets/images/origin-header.png" alt="origin section hero: pikachu" title="origin section hero: pikachu"/>
|
||||
<img class="img-shadow" src="/assets/images/origin-header.png" alt=""/>
|
||||
</div>
|
||||
<p>
|
||||
<strong>Pokemon is a game for Gameboy.</strong>
|
||||
Twitch is a live video streaming app. “Twitch Plays Pokemon” was a popular phenomenon where Twitch users would collaborate to play a SHARED game of Pokemon on Gameboy. Here's how it worked:
|
||||
</p>
|
||||
<p>Participants would use the Twitch message board to enter commands that then got executed in the gameplay. For example, if someone entered the command “right”, that would cause the player to move 1 space to the right. Commands would execute immediately after they were received, and anyone could enter a valid command at any time. You can think of Twitch Plays Pokemon as the more practical equivalent of placing a Gameboy in the middle of a crowded room and telling everyone to push buttons at the same time. As you might expect, the gameplay of Twitch Plays Pokemon was quite “twitchy”, but in a very “infinite monkey theory” way, progress could eventually be made.</p>
|
||||
<p>
|
||||
<strong>In an effort to streamline play</strong>, a new game mode was devised in which players would “vote” for the next command and, every 4 seconds, whatever command received the most votes over the previous 4 seconds would execute in the game. Also introduced in this mode was the ability to attach multipliers to a command, such that the command would execute that number of times. For example, “right2” would cause the player to move 2 spaces to the right. “right3” would cause the player to move 3 spaces to the right, and so on. The highest number any participant could place after a command was 9, meaning whatever command they entered would execute 9 times. As you might expect, gameplay in this mode was less chaotic, more efficient, but it also meant each participant had less direct and immediate influence over the game. If a group of even 5-10 got together and colluded on their votes, they could practically take over the game and make contrarian ideas irrelevant. The new game mode was called “Democracy”, and the original game mode became known as “Anarchy”. Which game mode was engaged was itself governed by a democratic process: if more participants wanted to play in Democracy mode, then Democracy mode engaged; if more wanted to play in Anarchy mode, then Anarchy mode engaged.</p>
|
||||
<p>To summarize:
|
||||
<strong>in Anarchy mode, everyone had equal influence over the game</strong>, but progress was slow and clunky. In Democracy mode, progress was fast and efficient, but colluding groups could marginalize individual participants and ruin the game for them.</p>
|
||||
<p>So… individual participants <strong>discovered a means of effective protest</strong> whenever Democracy mode became suffocating, but they could not garner enough votes to switch back to Anarchy mode. Someone would type the command “start9” into the comments. This command meant “open the start menu 9 times in a row”, which, as you might imagine, would be enormously disruptive if executed. The entire screen would be blocked by the start menu, over and over. Typing “start9” was a participant's way of signaling to other participants that they felt marginalized by Democracy mode, and they were ready to fight back. If others felt the same, they could also begin typing “start9” - then, sure enough, “start9” would finally receive more votes than the colluding group's command, and the menu opening would begin. Every 4 seconds, the menu would open 9 times…again, and again, and again…until finally, the colluding group would be forced to either cooperate in reverting the game mode back to Anarchy mode or quit altogether.</p>
|
||||
<p>Playing in Anarchy mode was impractical, but people did not want to play a game where they had no voice, where a group of insiders had taken total control. And so <strong>“start9” became the battle cry of the individual</strong>, the out-group, a means of signaling to other individuals that it was time to fight back against the usurpers - to use their own rules against them, until there was no alternative but to return control to the individual participants.</p>
|
||||
</section>
|
||||
{# <section id="team">
|
||||
<h2>Our Team</h2>
|
||||
<div class="section__image">
|
||||
<img src="/assets/images/team-header.png" alt="team section hero: robots being printed" title="team section hero: robots being printed"/>
|
||||
<img class="img-shadow" src="/assets/images/team-header.png" alt=""/>
|
||||
</div>
|
||||
<h2>Our Team</h2>
|
||||
<div class="section__image">
|
||||
<img src="/assets/images/team-header.png" alt="team section hero: robots being printed" title="team section hero: robots being printed"/>
|
||||
<img class="img-shadow" src="/assets/images/team-header.png" alt=""/>
|
||||
</div>
|
||||
|
||||
<ul class="members">
|
||||
{% for member in team %}
|
||||
<li class="member">
|
||||
<img class="member__avatar" src="{{ member.avatar_url }}" alt="{{ member.name }}'s avatar" title="{{ member.name }}'s avatar"/>
|
||||
<div class="member__content">
|
||||
<h4>{{ member.name }}</h4>
|
||||
<h5>{{ member.position }}</h5>
|
||||
<p>{{ member.blurb }}</p>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<ul class="members">
|
||||
{% for member in team %}
|
||||
<li class="member">
|
||||
<img class="member__avatar" src="{{ member.avatar_url }}" alt="{{ member.name }}'s avatar" title="{{ member.name }}'s avatar"/>
|
||||
<div class="member__content">
|
||||
<h4>{{ member.name }}</h4>
|
||||
<h5>{{ member.position }}</h5>
|
||||
<p>{{ member.blurb }}</p>
|
||||
</div>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</section> #}
|
||||
@@ -1,26 +0,0 @@
|
||||
//////////////////////////////////////////
|
||||
// HEADER
|
||||
|
||||
gsap.to("header", {
|
||||
duration: 0.5,
|
||||
backgroundColor: "rgba(0,0,0,0.1)",
|
||||
backdropFilter: "blur(10px)",
|
||||
scrollTrigger: {
|
||||
trigger: "#hero-image",
|
||||
scrub: true,
|
||||
start: "center top", // "triggerElement page"
|
||||
end: "bottom top", // "triggerElement page"
|
||||
},
|
||||
});
|
||||
|
||||
gsap.to(".header__logo", {
|
||||
duration: 0.5,
|
||||
opacity: "1",
|
||||
filter: "blur(0px)",
|
||||
scrollTrigger: {
|
||||
trigger: "#hero-image",
|
||||
scrub: true,
|
||||
start: "center top", // "triggerElement page"
|
||||
end: "bottom top", // "triggerElement page"
|
||||
},
|
||||
});
|
||||
@@ -1,11 +1,13 @@
|
||||
/************************************************/
|
||||
/* SECTION, LINE, AND TEXT APPEARANCE ANIMATION */
|
||||
/************************************************/
|
||||
|
||||
import { gsap } from "gsap";
|
||||
|
||||
//////////////////////////////////////////
|
||||
// HERO
|
||||
|
||||
const defaultActions = "play none none none";
|
||||
|
||||
// line animation
|
||||
gsap.from("#hero-to-pitch path:first-child", {
|
||||
drawSVG: 0,
|
||||
@@ -101,29 +103,31 @@ gsap.from("#products-to-info path:first-child", {
|
||||
//////////////////////////////////////////
|
||||
// INFOGRAPHICS
|
||||
|
||||
// object animation
|
||||
gsap.from("#infographics .subsection--trust", {
|
||||
duration: 0.5,
|
||||
opacity: 0,
|
||||
outline: "1px solid rgba(255,255,255,1)",
|
||||
scrollTrigger: {
|
||||
trigger: "#infographics .subsection--trust",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
if (document.querySelector("#infographics .subsection--control")) {
|
||||
// object animation
|
||||
gsap.from("#infographics .subsection--trust", {
|
||||
duration: 0.5,
|
||||
opacity: 0,
|
||||
outline: "1px solid rgba(255,255,255,1)",
|
||||
scrollTrigger: {
|
||||
trigger: "#infographics .subsection--trust",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
|
||||
// object animation
|
||||
gsap.from("#infographics .subsection--control", {
|
||||
duration: 0.5,
|
||||
opacity: 0,
|
||||
outline: "1px solid rgba(255,255,255,1)",
|
||||
scrollTrigger: {
|
||||
trigger: "#infographics .subsection--control",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
// object animation
|
||||
gsap.from("#infographics .subsection--control", {
|
||||
duration: 0.5,
|
||||
opacity: 0,
|
||||
outline: "1px solid rgba(255,255,255,1)",
|
||||
scrollTrigger: {
|
||||
trigger: "#infographics .subsection--control",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
//////////////////////////////////////////
|
||||
// BITCOIN
|
||||
@@ -221,52 +225,55 @@ gsap.from("#be-to-powered path", {
|
||||
//////////////////////////////////////////
|
||||
// POWERED
|
||||
|
||||
gsap.from("#powered-by h1", {
|
||||
duration: 0.5,
|
||||
y: "-5rem",
|
||||
opacity: 0,
|
||||
scrollTrigger: {
|
||||
trigger: "#powered-by h1",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
if (document.querySelector("#powered-by") && document.querySelector("#powered-by svg")) {
|
||||
gsap.from("#powered-by h1", {
|
||||
duration: 0.5,
|
||||
y: "-5rem",
|
||||
opacity: 0,
|
||||
scrollTrigger: {
|
||||
trigger: "#powered-by h1",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
|
||||
// object animation
|
||||
gsap.from("#powered-by p", {
|
||||
duration: 0.5,
|
||||
filter: "blur(10px)",
|
||||
opacity: 0,
|
||||
scrollTrigger: {
|
||||
trigger: "#powered-by h1",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
|
||||
// object animation
|
||||
gsap.from("#powered-by p", {
|
||||
duration: 0.5,
|
||||
filter: "blur(10px)",
|
||||
opacity: 0,
|
||||
scrollTrigger: {
|
||||
trigger: "#powered-by h1",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
// object animation
|
||||
gsap.from("#powered-by svg", {
|
||||
duration: 1,
|
||||
filter: "blur(20px)",
|
||||
opacity: 0,
|
||||
scrollTrigger: {
|
||||
trigger: "#powered-by svg",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
|
||||
// line animation
|
||||
gsap.from("#powered-to-support path", {
|
||||
drawSVG: 0,
|
||||
ease: "none",
|
||||
scrollTrigger: {
|
||||
trigger: "#powered-to-support path",
|
||||
scrub: true,
|
||||
start: "top 75%",
|
||||
end: "bottom 75%",
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
// object animation
|
||||
gsap.from("#powered-by svg", {
|
||||
duration: 1,
|
||||
filter: "blur(20px)",
|
||||
opacity: 0,
|
||||
scrollTrigger: {
|
||||
trigger: "#powered-by svg",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
|
||||
// line animation
|
||||
gsap.from("#powered-to-support path", {
|
||||
drawSVG: 0,
|
||||
ease: "none",
|
||||
scrollTrigger: {
|
||||
trigger: "#powered-to-support path",
|
||||
scrub: true,
|
||||
start: "top 75%",
|
||||
end: "bottom 75%",
|
||||
},
|
||||
});
|
||||
|
||||
//////////////////////////////////////////
|
||||
// SUPPORT
|
||||
@@ -1,24 +1,25 @@
|
||||
/********************************************/
|
||||
/* BITCOIN SECTION FLOATING ICONS ANIMATION */
|
||||
/********************************************/
|
||||
import { gsap } from "gsap";
|
||||
|
||||
//////////////////////////////////////////
|
||||
// DATA
|
||||
// TODO: pull this from data js instead
|
||||
const bitcoinServices = [
|
||||
"bitcoind",
|
||||
"btcpay",
|
||||
"cln",
|
||||
"electrs",
|
||||
"lnd",
|
||||
"lit",
|
||||
"mempool",
|
||||
"rtl",
|
||||
"spark",
|
||||
"specter",
|
||||
"sphinx",
|
||||
"thunderhub",
|
||||
];
|
||||
"bitcoind",
|
||||
"btcpay",
|
||||
"cln",
|
||||
"electrs",
|
||||
"lnd",
|
||||
"lit",
|
||||
"mempool",
|
||||
"rtl",
|
||||
"spark",
|
||||
"specter",
|
||||
"sphinx",
|
||||
"thunderhub",
|
||||
];
|
||||
|
||||
function getRandomInt(min, max) {
|
||||
min = Math.ceil(min);
|
||||
@@ -30,7 +31,7 @@ function getRandomNumber(min, max) {
|
||||
return Math.random() * (max - min) + min;
|
||||
}
|
||||
|
||||
function positionServiceIcons() {
|
||||
export function positionServiceIcons() {
|
||||
bitcoinServices.forEach((service, i) => {
|
||||
var serviceClass = ".service-icon--" + service;
|
||||
|
||||
79
src/assets/js/contact.js
Normal file
@@ -0,0 +1,79 @@
|
||||
/********************************************/
|
||||
/* CONTACT POST */
|
||||
/********************************************/
|
||||
|
||||
const emailError = document.getElementById("emailError")
|
||||
const emailSuccess = document.getElementById("emailSuccess")
|
||||
const errorMsg = "Something's not working. If you keep getting this error, try us at <a href='https://t.me/start9_lab' rel='noopener noreferrer' target='_blank'>Telegram</a> instead."
|
||||
|
||||
function showSuccess(message) {
|
||||
hideError();
|
||||
emailSuccess.classList.add("form-alert--visible");
|
||||
emailSuccess.innerHTML = message
|
||||
}
|
||||
|
||||
function hideSuccess() {
|
||||
emailError.classList.remove("form-alert--visible");
|
||||
}
|
||||
|
||||
function showError(message) {
|
||||
hideSuccess();
|
||||
emailError.classList.add("form-alert--visible");
|
||||
emailError.innerHTML = message;
|
||||
}
|
||||
|
||||
function hideError() {
|
||||
emailError.classList.remove("form-alert--visible");
|
||||
}
|
||||
|
||||
function clear(){
|
||||
document.getElementById("subscribeForm").reset()
|
||||
}
|
||||
|
||||
document.getElementById("contactSubmit").addEventListener("click", function (e) {
|
||||
const fromEmail = document.getElementById("fromEmail");
|
||||
e.preventDefault()
|
||||
if (
|
||||
/(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9]))\.){3}(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9])|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/.test(
|
||||
fromEmail.value
|
||||
)
|
||||
) {
|
||||
hideError();
|
||||
|
||||
try {
|
||||
var body = {
|
||||
customer: {
|
||||
email: fromEmail.value,
|
||||
accepts_marketing: true,
|
||||
verified_email: true,
|
||||
},
|
||||
};
|
||||
fetch("https://start9.com/api/subscribe", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify(body),
|
||||
}).then((response) => {
|
||||
clear()
|
||||
if (response.ok) {
|
||||
showSuccess("Thanks for subscribing!");
|
||||
} else {
|
||||
if (response.status === 422) {
|
||||
showError("Already subscribed!")
|
||||
} else {
|
||||
console.error(`Error code: ${response.status} - Details: ${response.statusText}`)
|
||||
showError(errorMsg);
|
||||
}
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
clear()
|
||||
console.error(error)
|
||||
showError(errMsg);
|
||||
}
|
||||
} else {
|
||||
showError("Sorry, you must use a valid email address.");
|
||||
}
|
||||
});
|
||||
|
||||
@@ -1,10 +0,0 @@
|
||||
const fetch = require("node-fetch");
|
||||
module.exports = async function() {
|
||||
return fetch(url)
|
||||
.then(res => res.json()) // node-fetch option to transform to json
|
||||
.then(json => {
|
||||
return {
|
||||
teamMembers: json
|
||||
};
|
||||
}).then(json => console.log(json));;
|
||||
}
|
||||
27
src/assets/js/header.js
Normal file
@@ -0,0 +1,27 @@
|
||||
//////////////////////////////////////////
|
||||
// HEADER
|
||||
import { gsap } from "gsap";
|
||||
|
||||
gsap.to("header", {
|
||||
duration: 0.5,
|
||||
backgroundColor: "rgba(0,0,0,0.1)",
|
||||
backdropFilter: "blur(10px)",
|
||||
scrollTrigger: {
|
||||
trigger: "#hero-image",
|
||||
scrub: true,
|
||||
start: "center top", // "triggerElement page"
|
||||
end: "bottom top", // "triggerElement page"
|
||||
},
|
||||
});
|
||||
|
||||
gsap.to(".header__logo", {
|
||||
duration: 0.5,
|
||||
opacity: "1",
|
||||
filter: "blur(0px)",
|
||||
scrollTrigger: {
|
||||
trigger: "#hero-image",
|
||||
scrub: true,
|
||||
start: "center top", // "triggerElement page"
|
||||
end: "bottom top", // "triggerElement page"
|
||||
},
|
||||
});
|
||||
@@ -1,5 +1,6 @@
|
||||
//////////////////////////////////////////
|
||||
// HERO
|
||||
import { gsap } from "gsap";
|
||||
|
||||
gsap.to("#hero-image", {
|
||||
duration: 1,
|
||||
@@ -9,6 +10,7 @@ gsap.to("#hero-image", {
|
||||
filter: "blur(0px)",
|
||||
delay: 0.5,
|
||||
});
|
||||
|
||||
gsap.to("#logo", {
|
||||
duration: 0.5,
|
||||
y: 0,
|
||||
@@ -1,10 +1,6 @@
|
||||
//////////////////////////////////////////
|
||||
// GSAP ACTIONS
|
||||
// options: "play", "pause", "resume", "reset", "restart", "complete", "reverse", and "none"
|
||||
// arguments: onEnter, onLeave, onEnterBack, and onLeaveBack
|
||||
const defaultActions = "play none none none";
|
||||
|
||||
|
||||
import { gsap } from "gsap";
|
||||
import { positionServiceIcons } from '/@root/src/assets/js/bitcoin-animation.js'
|
||||
import { initializeSizes, tick, next } from '/@root/src/assets/js/ticker-animation.js'
|
||||
|
||||
//////////////////////////////////////////
|
||||
// RE-RENDER COMPLEX ANIMATIONS ON WINDOW RESIZE
|
||||
@@ -12,53 +8,16 @@ const defaultActions = "play none none none";
|
||||
function onResizeComplete() {
|
||||
positionServiceIcons();
|
||||
initializeSizes();
|
||||
// initialize ticker
|
||||
gsap.delayedCall(next, tick);
|
||||
}
|
||||
|
||||
var resizeTimeout = setTimeout(onResizeComplete, 400);
|
||||
let resizeTimeout = setTimeout(onResizeComplete, 400);
|
||||
window.onresize = function () {
|
||||
clearTimeout(resizeTimeout);
|
||||
resizeTimeout = setTimeout(onResizeComplete, 400);
|
||||
};
|
||||
|
||||
|
||||
|
||||
//////////////////////////////////////////
|
||||
// AUTO APPLY URL ANCHORS
|
||||
|
||||
// // TODO: pull this from data js instead
|
||||
// const sections = [
|
||||
// "pitch",
|
||||
// "products",
|
||||
// "infographics",
|
||||
// "bitcoin",
|
||||
// "be-your-own",
|
||||
// "powered-by",
|
||||
// "support",
|
||||
// "dev",
|
||||
// "community",
|
||||
// ];
|
||||
|
||||
// setTimeout(function () {
|
||||
// // timeout to allow initial load to redirect to anchor
|
||||
// // TODO: maybe apply the scroll-behavior: smooth to HTML after a timeout
|
||||
|
||||
// sections.forEach((slug) => {
|
||||
// ScrollTrigger.create({
|
||||
// trigger: "#" + slug,
|
||||
// start: "top 25%",
|
||||
// end: "bottom 25%",
|
||||
// //markers: { startColor: "white", endColor: "white" },
|
||||
// onEnter: () => {
|
||||
// window.location.href = "#" + slug;
|
||||
// },
|
||||
// onEnterBack: () => {
|
||||
// window.location.href = "#" + slug;
|
||||
// },
|
||||
// });
|
||||
// });
|
||||
// }, 2000);
|
||||
|
||||
|
||||
//////////////////////////////////////////
|
||||
// SHADOW PARALLAX
|
||||
|
||||
|
||||
@@ -1,81 +0,0 @@
|
||||
/********************************************/
|
||||
/* CONTACT POST */
|
||||
/********************************************/
|
||||
|
||||
const emailError = document.getElementById("emailError")
|
||||
const emailSuccess = document.getElementById("emailSuccess")
|
||||
function showSuccess(message) {
|
||||
hideError();
|
||||
emailSuccess.classList.add("form-alert--visible");
|
||||
emailSuccess.innerHTML = message
|
||||
}
|
||||
|
||||
function hideSuccess() {
|
||||
emailError.classList.remove("form-alert--visible");
|
||||
}
|
||||
|
||||
function showError(message) {
|
||||
hideSuccess();
|
||||
emailError.classList.add("form-alert--visible");
|
||||
emailError.innerHTML = message;
|
||||
}
|
||||
|
||||
function hideError() {
|
||||
emailError.classList.remove("form-alert--visible");
|
||||
}
|
||||
|
||||
function clear(){
|
||||
document.getElementById("subscribeForm").reset()
|
||||
}
|
||||
|
||||
document.getElementById("contactSubmit").addEventListener("click", function (e) {
|
||||
const fromEmail = document.getElementById("fromEmail");
|
||||
e.preventDefault()
|
||||
if (
|
||||
/(?:[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*|"(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21\x23-\x5b\x5d-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])*")@(?:(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?|\[(?:(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9]))\.){3}(?:(2(5[0-5]|[0-4][0-9])|1[0-9][0-9]|[1-9]?[0-9])|[a-z0-9-]*[a-z0-9]:(?:[\x01-\x08\x0b\x0c\x0e-\x1f\x21-\x5a\x53-\x7f]|\\[\x01-\x09\x0b\x0c\x0e-\x7f])+)\])/.test(
|
||||
fromEmail.value
|
||||
)
|
||||
) {
|
||||
hideError();
|
||||
|
||||
try {
|
||||
var body = {
|
||||
customer: {
|
||||
email: fromEmail.value,
|
||||
accepts_marketing: true,
|
||||
verified_email: true,
|
||||
},
|
||||
};
|
||||
fetch("https://start9.com/api/subscribe", {
|
||||
method: "POST",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
body: JSON.stringify(body),
|
||||
}).then((response) => {
|
||||
clear()
|
||||
if (response.ok) {
|
||||
showSuccess("Thanks for subscribing!");
|
||||
} else {
|
||||
if (response.status = 422) {
|
||||
showError("Already subscribed!")
|
||||
} else {
|
||||
console.error(`Error code: ${response.status} - Details: ${response.statusText}`)
|
||||
showError(
|
||||
"Something's not working. If you keep getting this error, try us at <a href='https://twitter.com/start9labs' rel='noopener noreferrer' target='_blank'>Twitter</a> instead."
|
||||
);
|
||||
}
|
||||
}
|
||||
});
|
||||
} catch (error) {
|
||||
clear()
|
||||
console.error(error)
|
||||
showError(
|
||||
"Something's not working. If you keep getting this error, try us at <a href='https://twitter.com/start9labs' rel='noopener noreferrer' target='_blank'>Twitter</a> instead."
|
||||
);
|
||||
}
|
||||
} else {
|
||||
showError("Sorry, you must use a valid email address.");
|
||||
}
|
||||
});
|
||||
|
||||
7
src/assets/js/libs/DrawSVGPlugin.min.js
vendored
Normal file
@@ -0,0 +1,7 @@
|
||||
/*!
|
||||
* DrawSVGPlugin 3.9.1
|
||||
* https://greensock.com
|
||||
*/
|
||||
|
||||
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):t((e=e||self).window=e.window||{})}(this,function(e){"use strict";function i(){return"undefined"!=typeof window}function j(){return a||i()&&(a=window.gsap)&&a.registerPlugin&&a}function m(e){return Math.round(1e4*e)/1e4}function n(e){return parseFloat(e)||0}function o(e,t){var r=n(e);return~e.indexOf("%")?r/100*t:r}function p(e,t){return n(e.getAttribute(t))}function r(e,t,r,i,s,o){return P(Math.pow((n(r)-n(e))*s,2)+Math.pow((n(i)-n(t))*o,2))}function s(e){return console.warn(e)}function t(e){return"non-scaling-stroke"===e.getAttribute("vector-effect")}function w(e){if(!(e=v(e)[0]))return 0;var n,i,o,a,f,h,d,l=e.tagName.toLowerCase(),u=e.style,c=1,g=1;t(e)&&(g=e.getScreenCTM(),c=P(g.a*g.a+g.b*g.b),g=P(g.d*g.d+g.c*g.c));try{i=e.getBBox()}catch(e){s("Some browsers won't measure invisible elements (like display:none or masks inside defs).")}var _=i||{x:0,y:0,width:0,height:0},y=_.x,w=_.y,x=_.width,m=_.height;if(i&&(x||m)||!k[l]||(x=p(e,k[l][0]),m=p(e,k[l][1]),"rect"!==l&&"line"!==l&&(x*=2,m*=2),"line"===l&&(y=p(e,"x1"),w=p(e,"y1"),x=Math.abs(x-y),m=Math.abs(m-w))),"path"===l)a=u.strokeDasharray,u.strokeDasharray="none",n=e.getTotalLength()||0,c!==g&&s("Warning: <path> length cannot be measured when vector-effect is non-scaling-stroke and the element isn't proportionally scaled."),n*=(c+g)/2,u.strokeDasharray=a;else if("rect"===l)n=2*x*c+2*m*g;else if("line"===l)n=r(y,w,y+x,w+m,c,g);else if("polyline"===l||"polygon"===l)for(o=e.getAttribute("points").match(b)||[],"polygon"===l&&o.push(o[0],o[1]),n=0,f=2;f<o.length;f+=2)n+=r(o[f-2],o[f-1],o[f],o[f+1],c,g)||0;else"circle"!==l&&"ellipse"!==l||(h=x/2*c,d=m/2*g,n=Math.PI*(3*(h+d)-P((3*h+d)*(h+3*d))));return n||0}function x(e,t){if(!(e=v(e)[0]))return[0,0];t=t||w(e)+1;var r=h.getComputedStyle(e),i=r.strokeDasharray||"",s=n(r.strokeDashoffset),o=i.indexOf(",");return o<0&&(o=i.indexOf(" ")),t<(i=o<0?t:n(i.substr(0,o)))&&(i=t),[-s||0,i-s||0]}function y(){i()&&(h=window,l=a=j(),v=a.utils.toArray,d=-1!==((h.navigator||{}).userAgent||"").indexOf("Edge"))}var a,v,h,d,l,b=/[-+=\.]*\d+[\.e\-\+]*\d*[e\-\+]*\d*/gi,k={rect:["width","height"],circle:["r","r"],ellipse:["rx","ry"],line:["x2","y2"]},P=Math.sqrt,f={version:"3.9.1",name:"drawSVG",register:function register(e){a=e,y()},init:function init(e,r){if(!e.getBBox)return!1;l||y();var i,s,a,f=w(e);return this._style=e.style,this._target=e,r+""=="true"?r="0 100%":r?-1===(r+"").indexOf(" ")&&(r="0 "+r):r="0 0",s=function _parse(e,t,n){var r,i,s=e.indexOf(" ");return i=s<0?(r=void 0!==n?n+"":e,e):(r=e.substr(0,s),e.substr(s+1)),r=o(r,t),(i=o(i,t))<r?[i,r]:[r,i]}(r,f,(i=x(e,f))[0]),this._length=m(f),this._dash=m(i[1]-i[0]),this._offset=m(-i[0]),this._dashPT=this.add(this,"_dash",this._dash,m(s[1]-s[0])),this._offsetPT=this.add(this,"_offset",this._offset,m(-s[0])),d&&(a=h.getComputedStyle(e)).strokeLinecap!==a.strokeLinejoin&&(s=n(a.strokeMiterlimit),this.add(e.style,"strokeMiterlimit",s,s+.01)),this._live=t(e)||~(r+"").indexOf("live"),this._nowrap=~(r+"").indexOf("nowrap"),this._props.push("drawSVG"),1},render:function render(e,t){var n,r,i,s,o=t._pt,a=t._style;if(o){for(t._live&&(n=w(t._target))!==t._length&&(r=n/t._length,t._length=n,t._offsetPT&&(t._offsetPT.s*=r,t._offsetPT.c*=r),t._dashPT?(t._dashPT.s*=r,t._dashPT.c*=r):t._dash*=r);o;)o.r(e,o.d),o=o._next;i=t._dash||e&&1!==e&&1e-4||0,n=t._length-i+.1,s=t._offset,i&&s&&i+Math.abs(s%t._length)>t._length-.2&&(s+=s<0?.1:-.1)&&(n+=.1),a.strokeDashoffset=i?s:s+.001,a.strokeDasharray=n<.2?"none":i?i+"px,"+(t._nowrap?999999:n)+"px":"0px, 999999px"}},getLength:w,getPosition:x};j()&&a.registerPlugin(f),e.DrawSVGPlugin=f,e.default=f;if (typeof(window)==="undefined"||window!==e){Object.defineProperty(e,"__esModule",{value:!0})} else {delete e.default}});
|
||||
|
||||
4
src/assets/js/main.js
Normal file
@@ -0,0 +1,4 @@
|
||||
import { gsap } from "gsap";
|
||||
import { CustomEase } from "gsap/CustomEase";
|
||||
|
||||
gsap.registerPlugin(CustomEase, window.DrawSVGPlugin, ScrollTrigger);
|
||||
@@ -1,5 +1,6 @@
|
||||
//////////////////////////////////////////
|
||||
// MENU
|
||||
import { gsap } from "gsap";
|
||||
|
||||
let menuOpen = document.getElementById("menu-open"),
|
||||
menuClose = document.getElementById("menu-close"),
|
||||
@@ -9,7 +10,7 @@ let menuOpen = document.getElementById("menu-open"),
|
||||
menuOpen.addEventListener("click", (e) => openMenu(e));
|
||||
menuClose.addEventListener("click", (e) => closeMenu(e));
|
||||
|
||||
function openMenu(e) {
|
||||
export default function openMenu(e) {
|
||||
e.preventDefault();
|
||||
gsap.to("#menu", { y: "0vh" });
|
||||
gsap.to("main", { y: "100vh" });
|
||||
@@ -1,21 +1,19 @@
|
||||
//////////////////////////////////////////
|
||||
// GSAP ACTIONS
|
||||
// options: "play", "pause", "resume", "reset", "restart", "complete", "reverse", and "none"
|
||||
// arguments: onEnter, onLeave, onEnterBack, and onLeaveBack
|
||||
import { gsap } from "gsap";
|
||||
|
||||
const defaultActions = "play none none none";
|
||||
|
||||
gsap.from("section#hero+section", {
|
||||
duration: 0.5,
|
||||
y: "5rem",
|
||||
opacity: 0,
|
||||
delay: 1,
|
||||
filter: "blur(10px)",
|
||||
scrollTrigger: {
|
||||
trigger: "section#hero+section",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
duration: 0.5,
|
||||
y: "5rem",
|
||||
opacity: 0,
|
||||
delay: 1,
|
||||
filter: "blur(10px)",
|
||||
scrollTrigger: {
|
||||
trigger: "section#hero+section",
|
||||
start: "top 75%", // "triggerElement page"
|
||||
toggleActions: defaultActions,
|
||||
},
|
||||
});
|
||||
|
||||
const sections = document.querySelectorAll("section:not(#hero):not(#blurb):not(#menu)");
|
||||
|
||||
|
||||
@@ -5,14 +5,17 @@
|
||||
const tickerTL = gsap.timeline();
|
||||
|
||||
let pseudoserviceArray = gsap.utils.toArray(".pseudoservice"),
|
||||
next = 4,
|
||||
itemHeight,
|
||||
listHeight,
|
||||
windowHeight,
|
||||
kerplunk,
|
||||
kerplunk2;
|
||||
windowHeight;
|
||||
|
||||
function initializeSizes() {
|
||||
export const next = 4
|
||||
const kerplunk2 = CustomEase.create(
|
||||
"custom",
|
||||
"M0,0 C0.126,0.382 0.178,0.802 0.288,1.052 0.303,1.088 0.372,0.99 0.434,0.99 0.502,0.99 0.497,1 0.524,1 0.664,1 0.863,1 1,1 "
|
||||
);
|
||||
|
||||
export function initializeSizes() {
|
||||
itemHeight = document
|
||||
.querySelector(".pseudoservice")
|
||||
.getBoundingClientRect().height;
|
||||
@@ -24,18 +27,8 @@ function initializeSizes() {
|
||||
windowHeight = document.getElementById("ticker__window").clientHeight;
|
||||
}
|
||||
|
||||
kerplunk = CustomEase.create(
|
||||
"custom",
|
||||
"M0,0 C0.126,0.382 0.066,0.863 0.198,1.036 0.25,1.104 0.264,0.982 0.326,0.982 0.344,0.982 0.489,0.998 0.516,1 0.65,1.007 0.863,1 1,1 "
|
||||
);
|
||||
|
||||
kerplunk2 = CustomEase.create(
|
||||
"custom",
|
||||
"M0,0 C0.126,0.382 0.178,0.802 0.288,1.052 0.303,1.088 0.372,0.99 0.434,0.99 0.502,0.99 0.497,1 0.524,1 0.664,1 0.863,1 1,1 "
|
||||
);
|
||||
|
||||
|
||||
function tick() {
|
||||
// init()
|
||||
export function tick() {
|
||||
let action = tickerTL
|
||||
.to(pseudoserviceArray, {
|
||||
id: "thunk",
|
||||
@@ -48,39 +41,49 @@ function tick() {
|
||||
|
||||
pseudoserviceArray.push(pseudoserviceArray.shift());
|
||||
|
||||
const startIndex = window.screen.width < 1300 ? 1 : 2
|
||||
|
||||
let thisPseudoservice = pseudoserviceArray[startIndex].innerHTML
|
||||
let thisServiceElement = document.querySelector(".service-container--" + thisPseudoservice.toLowerCase().replace(" ", "-"));
|
||||
|
||||
if (thisServiceElement) {
|
||||
document.querySelectorAll(".service-container").forEach(a => a.style.display = "none")
|
||||
thisServiceElement.style.display = "flex";
|
||||
}
|
||||
|
||||
// start endless run
|
||||
gsap.delayedCall(next, tick);
|
||||
}
|
||||
|
||||
function init() {
|
||||
// initially start ticker at i=2, which is where bar is positioned to start
|
||||
let thisPseudoservice = pseudoserviceArray[2].innerHTML
|
||||
let thisElement = document.querySelector(
|
||||
".service-container--" + thisPseudoservice.toLowerCase().replace(" ", "-")
|
||||
);
|
||||
let thisServiceElement = document.querySelector(".service-container--" + thisPseudoservice.toLowerCase().replace(" ", "-"));
|
||||
|
||||
var slidesContainerArray = document.querySelectorAll(".service-container");
|
||||
slidesContainerArray.forEach((thisContainer) => {
|
||||
thisContainer.style.display = "none";
|
||||
});
|
||||
|
||||
if (thisElement) {
|
||||
thisElement.style.display = "flex";
|
||||
if (thisServiceElement) {
|
||||
document.querySelectorAll(".service-container").forEach(a => a.style.display = "none")
|
||||
thisServiceElement.style.display = "flex";
|
||||
}
|
||||
}
|
||||
|
||||
// initialize
|
||||
gsap.delayedCall(next, tick);
|
||||
|
||||
|
||||
// @NOTE in progress implementation - do not remove
|
||||
function moveTick(service) {
|
||||
|
||||
let thisPseudoservice = pseudoserviceArray.slice().filter(a => a.innerHTML === service)[0].innerHTML
|
||||
let thisElement = document.querySelector(".service-container--" + thisPseudoservice.toLowerCase().replace(" ", "-"));
|
||||
|
||||
// get index of current tick
|
||||
// let current = Array.from(Array.from(document.querySelectorAll(".service-container")).filter(a => a.style.display === 'flex')[0].classList).filter(a => a.includes("--"))[0].split("--")[1]
|
||||
// let currentIndex = pseudoserviceArray.findIndex(a => a.innerHTML.toLowerCase() === current)
|
||||
|
||||
let current = pseudoserviceArray[2].innerHTML
|
||||
let currentIndex = 2
|
||||
|
||||
// get index of current tick
|
||||
const item = Array.from(document.querySelectorAll(".service-container")).filter(a => a.style.display === 'flex')
|
||||
if (item.length > 0) {
|
||||
current = Array.from(item[0].classList).filter(a => a.includes("--"))[0].split("--")[1]
|
||||
currentIndex = pseudoserviceArray.findIndex(a => a.innerHTML.toLowerCase() === current)
|
||||
thisPseudoservice = pseudoserviceArray[currentIndex].innerHTML
|
||||
}
|
||||
|
||||
let i = pseudoserviceArray.findIndex(a => a.innerHTML === service)
|
||||
console.log(i)
|
||||
let diff = Math.abs(currentIndex - i)
|
||||
@@ -107,5 +110,4 @@ function moveTick(service) {
|
||||
if (thisElement) {
|
||||
thisElement.style.display = "flex";
|
||||
}
|
||||
|
||||
}
|
||||
@@ -82,12 +82,21 @@ section#community {
|
||||
a {
|
||||
&:hover svg path{
|
||||
fill: var(--c-text-accent);
|
||||
transform: scale(0.9);
|
||||
}
|
||||
svg {
|
||||
width: 3rem;
|
||||
path{
|
||||
transition: var(--t-simple);
|
||||
path {
|
||||
transition: var(--t-simple);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
section#community {
|
||||
input[type=email] {
|
||||
width: 23rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -7,6 +7,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -16,6 +17,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -25,6 +27,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -34,6 +37,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -43,6 +47,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -52,6 +57,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -61,6 +67,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -70,6 +77,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -79,6 +87,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -88,6 +97,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -97,6 +107,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -106,6 +117,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -115,6 +127,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -124,6 +137,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -133,6 +147,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -142,6 +157,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -151,6 +167,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -160,6 +177,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -169,6 +187,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -178,6 +197,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -187,6 +207,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -196,6 +217,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -205,6 +227,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -214,6 +237,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -223,6 +247,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -232,6 +257,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -241,6 +267,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -250,6 +277,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -259,6 +287,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -268,6 +297,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -277,6 +307,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -286,6 +317,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -295,6 +327,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -304,6 +337,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -313,6 +347,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -322,6 +357,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -331,6 +367,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -340,6 +377,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -349,6 +387,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -358,6 +397,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -367,6 +407,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxC7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -376,6 +417,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRzS7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -385,6 +427,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxi7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -394,6 +437,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRxy7mw9c.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -403,6 +447,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUQjIg1_i6t8kCHKm459WxRyS7m.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -412,6 +457,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -421,6 +467,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -430,6 +477,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -439,6 +487,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -448,6 +497,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -457,6 +507,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -466,6 +517,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -475,6 +527,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -484,6 +537,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -493,6 +547,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -502,6 +557,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -511,6 +567,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -520,6 +577,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -529,6 +587,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -538,6 +597,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -547,6 +607,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -556,6 +617,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -565,6 +627,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -574,6 +637,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -584,6 +648,56 @@
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
font-style: normal;
|
||||
font-weight: 500;
|
||||
font-display: swap;
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -593,6 +707,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -602,6 +717,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -611,6 +727,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -620,6 +737,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -629,6 +747,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -638,6 +757,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -647,6 +767,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -656,6 +777,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -665,6 +787,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -674,6 +797,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -683,6 +807,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -692,6 +817,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -701,6 +827,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -710,6 +837,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -719,6 +847,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
|
||||
/* cyrillic-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -728,6 +857,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WRhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
|
||||
}
|
||||
|
||||
/* cyrillic */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -737,6 +867,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459W1hyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
|
||||
}
|
||||
|
||||
/* vietnamese */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -746,6 +877,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459WZhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB;
|
||||
}
|
||||
|
||||
/* latin-ext */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -755,6 +887,7 @@
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wdhyzbi.woff2) format('woff2');
|
||||
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
|
||||
}
|
||||
|
||||
/* latin */
|
||||
@font-face {
|
||||
font-family: 'Montserrat';
|
||||
@@ -763,4 +896,4 @@
|
||||
font-display: swap;
|
||||
src: url(../fonts/montserrat/v25/JTUSjIg1_i6t8kCHKm459Wlhyw.woff2) format('woff2');
|
||||
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
||||
}
|
||||
}
|
||||
@@ -4,28 +4,38 @@ footer {
|
||||
font-weight: 400;
|
||||
color: gray;
|
||||
background-color: black;
|
||||
.footer__copyright, .footer__donate {
|
||||
font-size: max(10px, 0.8rem);
|
||||
.footer__copyright {
|
||||
font-size: max(8px, 0.6rem);
|
||||
}
|
||||
.footer__content {
|
||||
display: flex;
|
||||
.header {
|
||||
align-self: flex-start;
|
||||
margin: 1.8rem 0 0 5rem;
|
||||
flex-direction: column;
|
||||
svg {
|
||||
width: 12rem;
|
||||
width: 10rem;
|
||||
}
|
||||
p {
|
||||
font-size: max(12px, 0.9rem);
|
||||
}
|
||||
}
|
||||
.footer__donate {
|
||||
margin-top: 3rem;
|
||||
.footer__btns {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
align-self: center;
|
||||
gap: 0.7rem;
|
||||
margin-top: 1.2rem;
|
||||
|
||||
.btn {
|
||||
padding: 0.5rem 1.5rem;
|
||||
padding: 0.5rem 1.2rem;
|
||||
color: var(--c-text-bright);
|
||||
background-color: var(--c-accent);
|
||||
border: 0;
|
||||
font-family: var(--f-accent);
|
||||
font-weight: 300;
|
||||
font-size: 1rem;
|
||||
font-size: max(13px, 1rem);
|
||||
text-decoration: none;
|
||||
box-shadow: 0 1rem 1rem -0.5rem var(--c-shadow-3);
|
||||
border-radius: 34px;
|
||||
@@ -35,9 +45,22 @@ footer {
|
||||
filter: brightness(120%);
|
||||
}
|
||||
}
|
||||
a {
|
||||
&:hover svg path {
|
||||
fill: var(--c-text-accent);
|
||||
}
|
||||
svg {
|
||||
width: 2.3rem !important;
|
||||
|
||||
path {
|
||||
transition: var(--t-simple);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.groups{
|
||||
margin-left: 10%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
@@ -105,18 +128,18 @@ footer {
|
||||
.footer__canary{
|
||||
text-align: center;
|
||||
padding: 2rem;
|
||||
color: var(--c-gray3)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (max-width: 1200px) {
|
||||
footer .groups li > a {
|
||||
font-size: 2vw;
|
||||
font-size: 1.6vw;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 650px) {
|
||||
|
||||
footer .footer__content {
|
||||
flex-direction: column;
|
||||
.header {
|
||||
@@ -132,8 +155,9 @@ footer {
|
||||
}
|
||||
.groups li > a {
|
||||
font-size: 3.5vmin;
|
||||
}
|
||||
}
|
||||
.groups {
|
||||
margin-left: 0;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr 1fr;
|
||||
|
||||
@@ -74,7 +74,7 @@ section#infographics{
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
@media only screen and (max-width: 400px) and (min-width: 375px) {
|
||||
.subsction:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
@@ -399,6 +399,10 @@ nav {
|
||||
align-self: center;
|
||||
}
|
||||
|
||||
.text-center {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
.header__logo img {
|
||||
width: 11rem !important;
|
||||
@@ -449,3 +453,7 @@ nav {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.pb1 {
|
||||
padding-bottom: 1rem;
|
||||
}
|
||||
@@ -1,103 +1,103 @@
|
||||
#menu{
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
padding: 0;
|
||||
width: 100vw;
|
||||
height:100vh;
|
||||
transform: translateY(-100vh);
|
||||
.menu-content{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
.header{
|
||||
align-self: flex-start;
|
||||
margin: 5rem 0 0 5rem;
|
||||
svg{
|
||||
width: 12rem;
|
||||
}
|
||||
}
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
padding: 0;
|
||||
width: 100vw;
|
||||
height:100vh;
|
||||
transform: translateY(-100vh);
|
||||
.menu-content{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 100vh;
|
||||
.header{
|
||||
align-self: flex-start;
|
||||
margin: 5rem 0 0 5rem;
|
||||
svg{
|
||||
width: 12rem;
|
||||
}
|
||||
}
|
||||
background-color: var(--c-bkg);
|
||||
.groups{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
.half {
|
||||
grid-row: span 1;
|
||||
}
|
||||
.full {
|
||||
grid-row: span 2;
|
||||
}
|
||||
& > li {
|
||||
padding: 2.5rem 2.5rem;
|
||||
&:nth-child(-n+2){
|
||||
border-right: var(--b-secondary);
|
||||
}
|
||||
}
|
||||
}
|
||||
background-color: var(--c-bkg);
|
||||
.groups{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
.half {
|
||||
grid-row: span 1;
|
||||
// to keep border from overlapping
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
h1{
|
||||
font-family: var(--f-accent-bold);
|
||||
font-size: 1rem;
|
||||
color: var(--c-text-primary);
|
||||
margin-bottom: 1.7rem;
|
||||
.full {
|
||||
grid-row: span 2;
|
||||
}
|
||||
.groups li > a {
|
||||
font-family: var(--f-accent);
|
||||
font-size: 1.9rem;
|
||||
line-height: 1.5;
|
||||
font-weight: 100;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .1em;
|
||||
color: var(--c-text-primary);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
--hover-padding: .5rem;
|
||||
--hover-width: calc(100% + (2 * var(--hover-padding)));
|
||||
--hover-nudge: calc(-1 * var(--hover-padding));
|
||||
|
||||
&::after{
|
||||
content: '';
|
||||
position: absolute;
|
||||
transition: var(--t-simple);
|
||||
display: inline-block;
|
||||
width:0;
|
||||
height: 84%;
|
||||
top: 6%;
|
||||
left: 50%;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover {
|
||||
|
||||
&::after{
|
||||
border: var(--b-primary);
|
||||
width: var(--hover-width);
|
||||
left: var(--hover-nudge);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&.highlight{
|
||||
color: var(--c-text-bright);
|
||||
font-weight: 300;
|
||||
&::before{
|
||||
content: '';
|
||||
z-index: -1;
|
||||
//border: var(--b-primary);
|
||||
background-color: var(--c-text-accent);
|
||||
width: var(--hover-width);
|
||||
left: var(--hover-nudge);
|
||||
top: 6%;
|
||||
display: inline-block;
|
||||
height: 85%;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
& > li {
|
||||
padding: 2.5rem 2.5rem;
|
||||
&:nth-child(-n+2),&:nth-child(4){
|
||||
border-right: var(--b-secondary);
|
||||
}
|
||||
}
|
||||
}
|
||||
h1{
|
||||
font-family: var(--f-accent-bold);
|
||||
font-size: 1rem;
|
||||
color: var(--c-text-primary);
|
||||
margin-bottom: 1.7rem;
|
||||
}
|
||||
.groups li > a {
|
||||
font-family: var(--f-accent);
|
||||
font-size: 1.9rem;
|
||||
line-height: 1.5;
|
||||
font-weight: 100;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: .1em;
|
||||
color: var(--c-text-primary);
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
--hover-padding: .5rem;
|
||||
--hover-width: calc(100% + (2 * var(--hover-padding)));
|
||||
--hover-nudge: calc(-1 * var(--hover-padding));
|
||||
|
||||
&::after{
|
||||
content: '';
|
||||
position: absolute;
|
||||
transition: var(--t-simple);
|
||||
display: inline-block;
|
||||
width:0;
|
||||
height: 84%;
|
||||
top: 6%;
|
||||
left: 50%;
|
||||
opacity: 0;
|
||||
}
|
||||
&:hover {
|
||||
&::after{
|
||||
border: var(--b-primary);
|
||||
width: var(--hover-width);
|
||||
left: var(--hover-nudge);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
&.highlight{
|
||||
color: var(--c-text-bright);
|
||||
font-weight: 300;
|
||||
&::before{
|
||||
content: '';
|
||||
z-index: -1;
|
||||
//border: var(--b-primary);
|
||||
background-color: var(--c-text-accent);
|
||||
width: var(--hover-width);
|
||||
left: var(--hover-nudge);
|
||||
top: 6%;
|
||||
display: inline-block;
|
||||
height: 85%;
|
||||
position: absolute;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1200px) {
|
||||
@@ -106,28 +106,28 @@
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 650px) {
|
||||
#menu .groups li > a {
|
||||
font-size: 3.5vmin;
|
||||
}
|
||||
#menu .groups{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr 1fr;
|
||||
}
|
||||
|
||||
#menu .groups li {
|
||||
border: 0 !important;
|
||||
}
|
||||
@media only screen and (max-width: 650px) {
|
||||
#menu .groups li > a {
|
||||
font-size: 3.5vmin;
|
||||
}
|
||||
#menu .groups{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr 1fr 1fr;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
#menu .groups li > a {
|
||||
font-size: 4vmin;
|
||||
}
|
||||
#menu .groups{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: auto;
|
||||
}
|
||||
}
|
||||
#menu .groups li {
|
||||
border: 0 !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
#menu .groups li > a {
|
||||
font-size: 4vmin;
|
||||
}
|
||||
#menu .groups{
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: auto;
|
||||
}
|
||||
}
|
||||
@@ -19,12 +19,12 @@ main {
|
||||
}
|
||||
|
||||
section {
|
||||
--width: 42ch;
|
||||
--width: 60ch;
|
||||
--width-full: calc(100vw - (2 * var(--side-padding)));
|
||||
--side-padding: 3rem;
|
||||
font-family: "Montserrat";
|
||||
font-weight: 300;
|
||||
font-size: 1rem;
|
||||
font-size: 1.1rem;
|
||||
width: var(--width);
|
||||
padding: 7rem var(--side-padding);
|
||||
position: relative;
|
||||
@@ -55,7 +55,7 @@ section {
|
||||
margin: 2rem 0 4rem 0;
|
||||
position: relative;
|
||||
img {
|
||||
width: 50%;
|
||||
width: 30%;
|
||||
}
|
||||
.img-shadow {
|
||||
top: 3rem;
|
||||
@@ -88,16 +88,16 @@ section#hero {
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1245px) {
|
||||
section#hero {
|
||||
flex-direction: column;
|
||||
margin-bottom: 6rem;
|
||||
section#mission {
|
||||
--width: 38ch;
|
||||
img {
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
section#virtues {
|
||||
.section__image img {
|
||||
width: 75%;
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -178,7 +178,8 @@ h3 {
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-weight: 800;
|
||||
font-weight: 700;
|
||||
font-size: 1.3rem;
|
||||
}
|
||||
|
||||
h3,
|
||||
@@ -208,7 +209,7 @@ p {
|
||||
font-family: "Montserrat";
|
||||
font-weight: 300;
|
||||
line-height: 1.9rem;
|
||||
font-size: 1rem;
|
||||
font-size: 1.1rem;
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 2.5rem;
|
||||
|
||||
@@ -312,7 +313,7 @@ section#news {
|
||||
background-color: var(--c-text-accent);
|
||||
color: var(--c-text-primary);
|
||||
padding: 0.2em 0.5em;
|
||||
font-size: 0.8rem;
|
||||
font-size: 1rem;
|
||||
font-weight: 500;
|
||||
opacity: 0.6;
|
||||
}
|
||||
@@ -369,20 +370,21 @@ section#news {
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: max(28px, 1.6rem);
|
||||
font-size: max(26px, 1.4rem);
|
||||
}
|
||||
p {
|
||||
color: var(--c-gray5);
|
||||
margin-top: -1.5rem;
|
||||
margin-bottom: 2rem;
|
||||
line-height: 1.4;
|
||||
font-size: max(14px, 0.8rem);
|
||||
font-size: max(18px, 0.9rem);
|
||||
}
|
||||
|
||||
time {
|
||||
margin-top: -1.5rem;
|
||||
color: var(--c-text-accent);
|
||||
font-weight: 600;
|
||||
color: var(--c-accent);
|
||||
font-weight: 500;
|
||||
font-size: 0.9rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
}
|
||||
@@ -399,3 +401,93 @@ section#contact {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
#pro-tagline {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
gap: 1rem;
|
||||
|
||||
.btn {
|
||||
text-align: center;
|
||||
padding: 1rem 1.3rem;
|
||||
color: var(--c-text-bright);
|
||||
background-color: var(--c-accent);
|
||||
border: 0;
|
||||
font-family: var(--f-accent);
|
||||
font-weight: 300;
|
||||
font-size: 1.2rem;
|
||||
text-decoration: none;
|
||||
box-shadow: 0 1rem 1rem -0.5rem var(--c-shadow-3);
|
||||
border-radius: 34px;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.03);
|
||||
filter: brightness(120%);
|
||||
}
|
||||
}
|
||||
p {
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
font-size: 1.4rem;
|
||||
}
|
||||
}
|
||||
|
||||
section#pro-video {
|
||||
width: 80vw;
|
||||
height: 80vh;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.flowplayer {
|
||||
width: 63vw;
|
||||
// border-radius: 2px;
|
||||
// border: 2px solid var(--c-gray5);
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1245px) {
|
||||
section#hero {
|
||||
flex-direction: column;
|
||||
margin-bottom: 6rem;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 500px) {
|
||||
section {
|
||||
--width: 40ch;
|
||||
--width-full: calc(100vw - (2 * var(--side-padding)));
|
||||
}
|
||||
|
||||
section#mission {
|
||||
--width: 32ch;
|
||||
img {
|
||||
width: 36%;
|
||||
}
|
||||
.section__double-image .section__image--left {
|
||||
left: -94%;
|
||||
}
|
||||
.section__double-image .section__image--right {
|
||||
right: -91%;
|
||||
}
|
||||
.section__double-image .section__image {
|
||||
top: -148%;
|
||||
}
|
||||
}
|
||||
|
||||
#pro-tagline {
|
||||
.btn {
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 1.7rem;
|
||||
}
|
||||
}
|
||||
|
||||
section#pro-video {
|
||||
width: 90vw;;
|
||||
height: 20vh;
|
||||
}
|
||||
}
|
||||
@@ -76,7 +76,7 @@ section#powered-by {
|
||||
background-color: var(--c-text-accent);
|
||||
border-radius: 999px;
|
||||
padding: .15em .6em;
|
||||
transition: var(--t-simple);
|
||||
transition: var(--t-simple);
|
||||
white-space: nowrap;
|
||||
}
|
||||
&:hover{
|
||||
@@ -92,9 +92,8 @@ section#powered-by {
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
svg|a:link,
|
||||
svg|a:visited {
|
||||
svg a:link,
|
||||
svg a:visited {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
@@ -67,8 +67,6 @@ section#products {
|
||||
h1 {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.product__subheader {
|
||||
}
|
||||
background: var(--c-glass);
|
||||
svg {
|
||||
width: var(--img-width);
|
||||
@@ -110,14 +108,4 @@ section#products {
|
||||
}
|
||||
}
|
||||
}
|
||||
// &::after{
|
||||
// content: '';
|
||||
// left:0;
|
||||
// right:0;
|
||||
// display: block;
|
||||
// background-color: blue;
|
||||
// transform: rotateX(90deg);
|
||||
// height: 4rem;
|
||||
// z-index: -1;
|
||||
// }
|
||||
}
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
---
|
||||
title: Contact | Start9
|
||||
title: Contact
|
||||
layout: layouts/peripheral.njk
|
||||
---
|
||||
|
||||
@@ -17,9 +17,9 @@ layout: layouts/peripheral.njk
|
||||
|
||||
<section id="contact">
|
||||
<p class="p--standalone center">Reach out anytime to<br/>
|
||||
{% include 'components/_encoded-email.njk' %},</br>
|
||||
{% include 'components/encoded-email.njk' %},<br/>
|
||||
or find us on social media.
|
||||
</p>
|
||||
|
||||
{% include "components/landing/_social-media.njk" %}
|
||||
{% include "components/landing/social-media.njk" %}
|
||||
</section>
|
||||
@@ -1,5 +1,5 @@
|
||||
---
|
||||
title: Developers | Start9
|
||||
title: Developers
|
||||
layout: layouts/peripheral.njk
|
||||
---
|
||||
|
||||
|
||||
31
src/embassy-pro.njk
Normal file
@@ -0,0 +1,31 @@
|
||||
---
|
||||
title: Embassy Pro
|
||||
excerpt: Introducting our new flagship personal server product for sovereign computing
|
||||
image: https://start9.com/thumbnail-pro.jpg
|
||||
ogtype: summary
|
||||
layout: layouts/peripheral.njk
|
||||
---
|
||||
|
||||
<section id="hero">
|
||||
<div id="hero-image" class="image-with-shadow">
|
||||
<img src="/assets/images/news-hero.png" alt="news page hero: html tag emerging from an embassy" title="news page hero: tv emerging from an embassy"/>
|
||||
<img class="img-shadow" src="/assets/images/news-hero.png" alt=""/>
|
||||
</div>
|
||||
<div id="logo">
|
||||
<h1 class="text-center pb1">
|
||||
<span>Embassy Pro</span>
|
||||
</h1>
|
||||
<div id="pro-tagline">
|
||||
<p class="pb1">Introducting our new flagship product</p>
|
||||
<a href="{{ site.products.pro }}" class="btn" rel="noopener noreferrer" target="_blank">Get yours</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="pro-video">
|
||||
<div data-player-id="dd03b0e0-e64c-4a3b-aef5-69195ab2aa61" >
|
||||
<script src="//cdn.flowplayer.com/players/21e0a777-b621-48d2-9f92-701c1e1fc844/native/flowplayer.async.js">
|
||||
{ "src": "https://customer-g9m9y1yjgqx9eniu.cloudflarestream.com/733ce92ef09cba3eeb9c4d0a06370b24/manifest/video.m3u8", "poster": "https://start9.com/thumbnail-pro.jpg", "auto_orient": true }
|
||||
</script>
|
||||
</div>
|
||||
</section>
|
||||
@@ -1,14 +1,14 @@
|
||||
---
|
||||
title: Start9 | Sovereign Computing
|
||||
title: Sovereign Computing
|
||||
layout: layouts/base.njk
|
||||
---
|
||||
|
||||
<link rel="stylesheet" href="/assets/styles/landing.css">
|
||||
<link rel="stylesheet" href="/@root/src/assets/styles/landing.scss">{{ __slinkity.head | safe }}
|
||||
|
||||
{% include "components/landing/hero.njk" %}
|
||||
|
||||
<div class="line" id="hero-to-pitch">
|
||||
{% include "svgs/lines/hero-to-pitch.svg" %}
|
||||
{% include "svgs/lines/hero-to-pitch.svg" %}
|
||||
</div>
|
||||
|
||||
{% include "components/landing/pitch.njk" %}
|
||||
@@ -16,19 +16,19 @@ layout: layouts/base.njk
|
||||
{% include "components/landing/products.njk" %}
|
||||
|
||||
<div class="line" id="products-to-info">
|
||||
{% include "svgs/lines/products-to-info.svg" %}
|
||||
{% include "svgs/lines/products-to-info.svg" %}
|
||||
</div>
|
||||
|
||||
{% include "components/landing/powered-by.njk" %}
|
||||
|
||||
<div class="line" id="be-to-powered">
|
||||
{% include "svgs/lines/be-to-powered.svg" %}
|
||||
{% include "svgs/lines/be-to-powered.svg" %}
|
||||
</div>
|
||||
|
||||
{% include "components/landing/infographics.njk" %}
|
||||
|
||||
<div class="line" id="powered-to-support">
|
||||
{% include "svgs/lines/powered-to-support.svg" %}
|
||||
{% include "svgs/lines/powered-to-support.svg" %}
|
||||
</div>
|
||||
|
||||
{% include "components/landing/be-your-own.njk" %}
|
||||
@@ -36,33 +36,33 @@ layout: layouts/base.njk
|
||||
{% include "components/landing/bitcoin.njk" %}
|
||||
|
||||
<div class="line" id="bitcoin-to-be">
|
||||
{% include "svgs/lines/bitcoin-to-be.svg" %}
|
||||
{% include "svgs/lines/bitcoin-to-be.svg" %}
|
||||
</div>
|
||||
|
||||
|
||||
{% include "components/landing/support.njk" %}
|
||||
|
||||
<div class="line" id="support-to-dev">
|
||||
{% include "svgs/lines/support-to-dev.svg" %}
|
||||
{% include "svgs/lines/support-to-dev.svg" %}
|
||||
</div>
|
||||
|
||||
{% include "components/landing/dev.njk" %}
|
||||
|
||||
<div class="line" id="dev-to-contact">
|
||||
{% include "svgs/lines/dev-to-contact.svg" %}
|
||||
{% include "svgs/lines/dev-to-contact.svg" %}
|
||||
</div>
|
||||
|
||||
{% include "components/landing/community.njk" %}
|
||||
|
||||
<script defer src="{{ '/assets/js/libraries/gsap.min.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/libraries/ScrollTrigger.min.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/libraries/DrawSVGPlugin.min.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/libraries/CustomEase.min.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/_header.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/_menu.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/_hero.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/landing.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/landing/_appearance-animation.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/landing/_bitcoin-animation.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/landing/_ticker-animation.js' | url }}"></script>
|
||||
<script defer src="{{ '/assets/js/landing/_contact-post.js' | url }}"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/gsap.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/CustomEase.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/3.11.3/ScrollTrigger.min.js"></script>
|
||||
<script src="{{ '/libs/DrawSVGPlugin.min.js' }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/main.js' | url }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/appearance-animation.js' | url }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/bitcoin-animation.js' | url }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/contact.js' | url }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/header.js' | url }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/hero.js' | url }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/menu.js' | url }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/landing.js' | url }}"></script>
|
||||
<script defer type="module" src="{{ '/@root/src/assets/js/ticker-animation.js' | url }}"></script>
|
||||
98
src/jobs.njk
@@ -1,60 +1,60 @@
|
||||
---
|
||||
title: Jobs | Start9
|
||||
title: Jobs
|
||||
layout: layouts/peripheral.njk
|
||||
---
|
||||
|
||||
<section id="hero">
|
||||
<div id="hero-image" class="image-with-shadow">
|
||||
<img src="/assets/images/jobs-hero.png" alt="jobs page hero: laptop emerging from an embassy" title="jobs page hero: laptop emerging from an embassy"/>
|
||||
<img class="img-shadow" src="/assets/images/jobs-hero.png" alt=""/>
|
||||
</div>
|
||||
<div id="logo">
|
||||
<h1>
|
||||
<span>Jobs</span>
|
||||
</h1>
|
||||
</div>
|
||||
<div id="hero-image" class="image-with-shadow">
|
||||
<img src="/assets/images/jobs-hero.png" alt="jobs page hero: laptop emerging from an embassy" title="jobs page hero: laptop emerging from an embassy"/>
|
||||
<img class="img-shadow" src="/assets/images/jobs-hero.png" alt=""/>
|
||||
</div>
|
||||
<div id="logo">
|
||||
<h1>
|
||||
<span>Jobs</span>
|
||||
</h1>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section id="jobs">
|
||||
{% set jobs = [] %}
|
||||
{% if jobs|length > 0 %}
|
||||
<h2>{{ jobs|length }} {{ "Open Position" if jobs|length == 1 else "Open Positions" }}</h2>
|
||||
{# {% set jobs = [] %} #}
|
||||
{% if jobs|length > 0 %}
|
||||
{# <h2>{{ jobs|length }} {{ "Open Position" if jobs|length == 1 else "Open Positions" }}</h2> #}
|
||||
<ul class="jobs">
|
||||
{% for job in jobs %}
|
||||
<li class="job">
|
||||
<h3>{{ job.title }}</h3>
|
||||
<p>{{ job.blurb }}</p>
|
||||
<h4>Job Description</h4>
|
||||
<ul>
|
||||
{% for item in job.description %}
|
||||
<li>{{ item }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<h4>Requirements</h4>
|
||||
<ul>
|
||||
{% for requirement in job.requirements %}
|
||||
<li>{{ requirement }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<h4>Benefits</h4>
|
||||
<ul>
|
||||
{% for benefit in job.benefits %}
|
||||
<li>{{ benefit }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<h4>How to Apply</h4>
|
||||
<p>{{ job.how }}</p>
|
||||
</li>
|
||||
{% endfor %}
|
||||
{% for job in jobs %}
|
||||
<li class="job">
|
||||
<h3>{{ job.title }}</h3>
|
||||
<p>{{ job.blurb }}</p>
|
||||
<h4>Job Description</h4>
|
||||
<ul>
|
||||
{% for item in job.description %}
|
||||
<li>{{ item }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<h4>Requirements</h4>
|
||||
<ul>
|
||||
{% for requirement in job.requirements %}
|
||||
<li>{{ requirement }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<h4>Benefits</h4>
|
||||
<ul>
|
||||
{% for benefit in job.benefits %}
|
||||
<li>{{ benefit }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<h4>How to Apply</h4>
|
||||
<p>{{ job.how }}</p>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% endif %}
|
||||
{% if jobs|length == 0 %}
|
||||
<h3>
|
||||
As of <time datetime="{{ buildInfo.time.raw }}">{{ buildInfo.time.dateOnly }}</time> there are no open positions at Start9.
|
||||
</h3>
|
||||
<br/>
|
||||
<h3>
|
||||
Check back soon!
|
||||
</h3>
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
{% if jobs|length == 0 %}
|
||||
<h3>
|
||||
There are no open positions at Start9 at this time.
|
||||
</h3>
|
||||
<br/>
|
||||
<h3>
|
||||
Check back soon!
|
||||
</h3>
|
||||
{% endif %}
|
||||
</section>
|
||||
@@ -1,5 +1,5 @@
|
||||
---
|
||||
title: Podcasts | Start9
|
||||
title: Podcasts
|
||||
layout: layouts/peripheral.njk
|
||||
---
|
||||
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
---
|
||||
title: Privacy | Start9
|
||||
title: Privacy
|
||||
layout: layouts/peripheral.njk
|
||||
---
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
eleventyExcludeFromCollections: true
|
||||
permalink: /robots.txt
|
||||
permalink: /public/robots.txt
|
||||
---
|
||||
User-agent: *
|
||||
Allow: /
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
---
|
||||
eleventyExcludeFromCollections: true
|
||||
permalink: /sitemap.xml
|
||||
permalink: /public/sitemap.xml
|
||||
---
|
||||
<?xml version="1.0" encoding="UTF-8"?>
|
||||
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
|
||||
|
||||