initial commit, yay

assets/css/app.css

@@ -0,0 +1,5 @@
+@import "tailwindcss/base";
+@import "tailwindcss/components";
+@import "tailwindcss/utilities";
+@import "whitelist/whitelist.css";
+@import "conditional/conditional.css";

assets/css/conditional/article.css

@@ -0,0 +1,41 @@
+.post-title {
+	@apply text-4xl mb-0;
+
+	@screen lg {
+		@apply text-5xl;
+	}
+}
+
+.article {
+	@apply mt-8;
+
+	> p:first-of-type {
+		@apply text-lg;
+	}
+
+	h2,
+	h3,
+	h4,
+	h5,
+	h6 {
+		@apply font-bold;
+	}
+
+	h4,
+	h5,
+	h6 {
+		text-transform: uppercase;
+	}
+
+	@screen lg {
+		p,
+		ul,
+		ol {
+			@apply mt-4 mb-8 leading-normal;
+		}
+
+		p.text-sm {
+			@apply text-sm;
+		}
+	}
+}

assets/css/conditional/conditional.css

@@ -0,0 +1,2 @@
+@import "header";
+@import "article";

assets/css/conditional/header.css

@@ -0,0 +1,12 @@
+.header {
+	@apply py-2 z-10 bg-gray-100;
+
+	@screen lg {
+		@apply py-6;
+	}
+
+	.container {
+		@apply flex justify-between items-center;
+	}
+}
+

assets/css/whitelist/buttons.css

@@ -0,0 +1,55 @@
+.button {
+	@apply font-sans not-italic font-light rounded bg-gray-800 border-2 border-gray-800 leading-normal inline-block no-underline text-gray-200 px-6 py-4 shadow-lg text-center;
+	transform: translateY(0);
+
+	@screen lg {
+		@apply px-12 py-4;
+	}
+
+	&:focus,
+	&:hover {
+		@apply text-white border-gray-800 bg-gray-800 no-underline shadow;
+		transform: translate3d(1px, 2px, 0);
+		cursor: pointer;
+	}
+}
+
+.button-white {
+	@extend .button;
+	@apply bg-gray-100 text-gray-800;
+
+	&:focus,
+	&:hover {
+		@apply bg-white text-gray-600;
+	}
+}
+
+.button-primary {
+	@extend .button;
+	@apply bg-primary-100 text-white border-none;
+
+	&:focus,
+	&:hover {
+		@apply border-primary-100 bg-primary-100 text-white bg-primary-200;
+	}
+}
+
+.button-link {
+	@apply font-bold font-serif not-italic;
+}
+
+.highlight {
+	@apply font-bold font-sans not-italic text-primary-100;
+}
+
+.button-sm {
+	@apply px-4 py-2 text-sm;
+}
+
+.button-lg {
+	@apply px-12 py-4;
+
+	@screen lg {
+		@apply py-6;
+	}
+}

assets/css/whitelist/forms.css

@@ -0,0 +1,44 @@
+label {
+	@apply text-sm font-sans uppercase font-bold;
+}
+
+input,
+textarea,
+select {
+	@apply border-2 bg-gray-100 leading-normal rounded w-full py-3 px-4 mb-2 italic text-base w-full border-gray-300;
+	@extend .transition;
+
+	&[aria-invalid="true"] {
+		@apply border-primary-100;
+	}
+
+	&:focus {
+		@apply shadow-lg bg-gray-100 border-gray-200;
+		transform: translate3d(-1px, -1px, 0);
+		outline: 0;
+	}
+}
+
+input,
+textarea {
+	&:focus {
+		@apply border-gray-800;
+	}
+}
+
+textarea {
+	@apply h-24;
+}
+
+select {
+	@apply h-12 bg-gray-100;
+
+	option {
+		@apply bg-white;
+	}
+
+	&:focus {
+		@apply shadow-none border-gray-300;
+		transform: none;
+	}
+}

assets/css/whitelist/icons.css

@@ -0,0 +1,17 @@
+.svg-icon {
+	width: 1em;
+	height: 1em;
+
+	path,
+	polygon,
+	rect {
+		@apply fill-current;
+	}
+
+	circle {
+		@apply stroke-current;
+		stroke-width: 1;
+	}
+}
+
+

assets/css/whitelist/navigation.css

@@ -0,0 +1,113 @@
+.nav-primary {
+	@apply hidden;
+
+	a {
+		@apply text-gray-800 italic no-underline font-normal;
+
+		&:focus,
+		&:hover {
+			@apply underline;
+		}
+	}
+
+	li {
+		@apply leading-tight;
+	}
+
+	.highlight {
+		@apply text-primary-100 not-italic font-bold;
+	}
+
+	.button {
+		@apply text-white;
+	}
+
+	.current-menu-item a {
+		@apply font-bold not-italic;
+	}
+
+	@screen md {
+		@apply block;
+
+		.dark-header & {
+			transform: none;
+		}
+
+		li {
+			@apply mb-0;
+
+			&:last-child a {
+				@apply mr-0;
+			}
+		}
+
+		a {
+			@apply mx-4;
+		}
+
+		.button {
+			@extend .button-sm;
+		}
+
+		.sub-menu {
+			@apply hidden absolute bg-white shadow-lg;
+			@extend .list-reset;
+
+			a {
+				@apply text-gray-200;
+			}
+		}
+
+		.menu-item-has-children {
+			@apply relative;
+
+			&:hover {
+				.sub-menu {
+					@apply block;
+				}
+			}
+		}
+	}
+}
+
+.nav-mobile {
+	@extend .nav-primary, .transition;
+	@apply fixed left-0 top-0 h-full bg-white p-4 z-50 w-full overflow-scroll block z-50 text-center;
+	transform: translate3d(-100%, 0, 0);
+
+	&.active {
+		transform: translate3d(0, 0, 0);
+	}
+
+	a {
+		@apply block w-full text-2xl;
+	}
+
+	@screen md {
+		@apply hidden;
+	}
+
+	.admin-bar & {
+		top: 46px;
+
+		@screen md {
+			top: 32px;
+		}
+	}
+}
+
+
+@screen md {
+	.toggle {
+		@apply hidden;
+	}
+}
+
+.footer-menu {
+	@apply pl-0 ml-0;
+	@extend .list-reset;
+
+	a {
+		@apply text-white not-italic;
+	}
+}

assets/css/whitelist/transitions.css

@@ -0,0 +1,13 @@
+.transition {
+	transition: all .25s cubic-bezier(0.165, 0.84, 0.44, 1);
+}
+
+a,
+.button,
+.button-large,
+.button-lg,
+.button-primary,
+.button-bg-primary-200,
+.button-bg-primary-200 .icon {
+	@extend .transition;
+}

assets/css/whitelist/type.css

@@ -0,0 +1,111 @@
+html {
+	font-size: 18px;
+}
+
+body {
+	@apply bg-gray-100 font-serif text-base font-light leading-normal antialiased;
+}
+
+strong,
+b {
+	@apply font-bold;
+}
+
+p {
+	@apply mt-2 mb-4;
+}
+
+a {
+	@apply text-primary-100 underline font-bold;
+
+	&:focus,
+	&:hover {
+		@apply text-gray-600;
+	}
+}
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+	@apply mt-8 mb-4 font-sans font-light;
+
+	@screen lg {
+		@apply mt-12;
+	}
+}
+
+h1,
+h2,
+h3 {
+	@apply leading-tight;
+}
+
+h4,
+h5,
+h6 {
+	@apply leading-normal;
+}
+
+h1 {
+	@apply text-5xl;
+}
+
+h2 {
+	@apply text-4xl;
+}
+
+h3 {
+	@apply text-3xl;
+}
+
+h4 {
+	@apply text-2xl;
+}
+
+h5 {
+	@apply text-xl;
+}
+
+h6 {
+	@apply text-xl tracking-wide;
+}
+
+ul,
+ol {
+	@apply mt-4 mb-10 ml-2;
+
+	@screen lg {
+		@apply ml-8;
+	}
+}
+
+li {
+	@apply mb-2;
+
+	.sidebar &,
+	.article & {
+		list-style-type: disc;
+	}
+}
+
+blockquote {
+	@apply text-center italic m-10;
+
+	@screen lg {
+		@apply m-16 text-lg;
+	}
+}
+
+.list-reset {
+	display: inline-block;
+	list-style: none;
+	margin: 0;
+	padding: 0;
+}
+
+::selection {
+	@apply bg-primary-100 text-gray-200;
+}

assets/css/whitelist/whitelist.css

@@ -0,0 +1,7 @@
+@import "type.css";
+@import "navigation.css";
+@import "buttons.css";
+@import "transitions.css";
+@import "icons.css";
+@import "forms.css";
+@import "wordpress.css";

assets/css/whitelist/wordpress.css

@@ -0,0 +1,28 @@
+.alignright {
+	@apply float-right ml-4 mb-4;
+}
+
+.alignleft {
+	@apply float-left mr-4 mb-4;
+}
+
+.aligncenter {
+	@apply mx-auto;
+}
+
+img {
+	@apply rounded;
+}
+
+.screen-reader-text {
+	border: 0;
+	clip: rect(1px, 1px, 1px, 1px);
+	clip-path: inset(50%);
+	height: 1px;
+	margin: -1px;
+	overflow: hidden;
+	padding: 0;
+	position: absolute;
+	width: 1px;
+	word-wrap: normal !important;
+}

assets/images/svg/icon-chart.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path d="M10.281,1.781C5.75,1.781,2.062,5.469,2.062,10s3.688,8.219,8.219,8.219S18.5,14.531,18.5,10S14.812,1.781,10.281,1.781M10.714,2.659c3.712,0.216,6.691,3.197,6.907,6.908h-6.907V2.659z M10.281,17.354c-4.055,0-7.354-3.298-7.354-7.354c0-3.911,3.067-7.116,6.921-7.341V10c0,0.115,0.045,0.225,0.127,0.305l5.186,5.189C13.863,16.648,12.154,17.354,10.281,17.354M15.775,14.882l-4.449-4.449h6.295C17.522,12.135,16.842,13.684,15.775,14.882"></path>
+</svg>

assets/images/svg/icon-gear.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path d="M17.498,11.697c-0.453-0.453-0.704-1.055-0.704-1.697c0-0.642,0.251-1.244,0.704-1.697c0.069-0.071,0.15-0.141,0.257-0.22c0.127-0.097,0.181-0.262,0.137-0.417c-0.164-0.558-0.388-1.093-0.662-1.597c-0.075-0.141-0.231-0.22-0.391-0.199c-0.13,0.02-0.238,0.027-0.336,0.027c-1.325,0-2.401-1.076-2.401-2.4c0-0.099,0.008-0.207,0.027-0.336c0.021-0.158-0.059-0.316-0.199-0.391c-0.503-0.274-1.039-0.498-1.597-0.662c-0.154-0.044-0.32,0.01-0.416,0.137c-0.079,0.106-0.148,0.188-0.22,0.257C11.244,2.956,10.643,3.207,10,3.207c-0.642,0-1.244-0.25-1.697-0.704c-0.071-0.069-0.141-0.15-0.22-0.257C7.987,2.119,7.821,2.065,7.667,2.109C7.109,2.275,6.571,2.497,6.07,2.771C5.929,2.846,5.85,3.004,5.871,3.162c0.02,0.129,0.027,0.237,0.027,0.336c0,1.325-1.076,2.4-2.401,2.4c-0.098,0-0.206-0.007-0.335-0.027C3.001,5.851,2.845,5.929,2.77,6.07C2.496,6.572,2.274,7.109,2.108,7.667c-0.044,0.154,0.01,0.32,0.137,0.417c0.106,0.079,0.187,0.148,0.256,0.22c0.938,0.936,0.938,2.458,0,3.394c-0.069,0.072-0.15,0.141-0.256,0.221c-0.127,0.096-0.181,0.262-0.137,0.416c0.166,0.557,0.388,1.096,0.662,1.596c0.075,0.143,0.231,0.221,0.392,0.199c0.129-0.02,0.237-0.027,0.335-0.027c1.325,0,2.401,1.076,2.401,2.402c0,0.098-0.007,0.205-0.027,0.334C5.85,16.996,5.929,17.154,6.07,17.23c0.501,0.273,1.04,0.496,1.597,0.66c0.154,0.047,0.32-0.008,0.417-0.137c0.079-0.105,0.148-0.186,0.22-0.256c0.454-0.453,1.055-0.703,1.697-0.703c0.643,0,1.244,0.25,1.697,0.703c0.071,0.07,0.141,0.15,0.22,0.256c0.073,0.098,0.188,0.152,0.307,0.152c0.036,0,0.073-0.004,0.109-0.016c0.558-0.164,1.096-0.387,1.597-0.66c0.141-0.076,0.22-0.234,0.199-0.393c-0.02-0.129-0.027-0.236-0.027-0.334c0-1.326,1.076-2.402,2.401-2.402c0.098,0,0.206,0.008,0.336,0.027c0.159,0.021,0.315-0.057,0.391-0.199c0.274-0.5,0.496-1.039,0.662-1.596c0.044-0.154-0.01-0.32-0.137-0.416C17.648,11.838,17.567,11.77,17.498,11.697 M16.671,13.334c-0.059-0.002-0.114-0.002-0.168-0.002c-1.749,0-3.173,1.422-3.173,3.172c0,0.053,0.002,0.109,0.004,0.166c-0.312,0.158-0.64,0.295-0.976,0.406c-0.039-0.045-0.077-0.086-0.115-0.123c-0.601-0.6-1.396-0.93-2.243-0.93s-1.643,0.33-2.243,0.93c-0.039,0.037-0.077,0.078-0.116,0.123c-0.336-0.111-0.664-0.248-0.976-0.406c0.002-0.057,0.004-0.113,0.004-0.166c0-1.75-1.423-3.172-3.172-3.172c-0.054,0-0.11,0-0.168,0.002c-0.158-0.312-0.293-0.639-0.405-0.975c0.044-0.039,0.085-0.078,0.124-0.115c1.236-1.236,1.236-3.25,0-4.486C3.009,7.719,2.969,7.68,2.924,7.642c0.112-0.336,0.247-0.664,0.405-0.976C3.387,6.668,3.443,6.67,3.497,6.67c1.75,0,3.172-1.423,3.172-3.172c0-0.054-0.002-0.11-0.004-0.168c0.312-0.158,0.64-0.293,0.976-0.405C7.68,2.969,7.719,3.01,7.757,3.048c0.6,0.6,1.396,0.93,2.243,0.93s1.643-0.33,2.243-0.93c0.038-0.039,0.076-0.079,0.115-0.123c0.336,0.112,0.663,0.247,0.976,0.405c-0.002,0.058-0.004,0.114-0.004,0.168c0,1.749,1.424,3.172,3.173,3.172c0.054,0,0.109-0.002,0.168-0.004c0.158,0.312,0.293,0.64,0.405,0.976c-0.045,0.038-0.086,0.077-0.124,0.116c-0.6,0.6-0.93,1.396-0.93,2.242c0,0.847,0.33,1.645,0.93,2.244c0.038,0.037,0.079,0.076,0.124,0.115C16.964,12.695,16.829,13.021,16.671,13.334 M10,5.417c-2.528,0-4.584,2.056-4.584,4.583c0,2.529,2.056,4.584,4.584,4.584s4.584-2.055,4.584-4.584C14.584,7.472,12.528,5.417,10,5.417 M10,13.812c-2.102,0-3.812-1.709-3.812-3.812c0-2.102,1.71-3.812,3.812-3.812c2.102,0,3.812,1.71,3.812,3.812C13.812,12.104,12.102,13.812,10,13.812"></path>
+</svg>

assets/images/svg/icon-growth.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path d="M17.431,2.156h-3.715c-0.228,0-0.413,0.186-0.413,0.413v6.973h-2.89V6.687c0-0.229-0.186-0.413-0.413-0.413H6.285c-0.228,0-0.413,0.184-0.413,0.413v6.388H2.569c-0.227,0-0.413,0.187-0.413,0.413v3.942c0,0.228,0.186,0.413,0.413,0.413h14.862c0.228,0,0.413-0.186,0.413-0.413V2.569C17.844,2.342,17.658,2.156,17.431,2.156 M5.872,17.019h-2.89v-3.117h2.89V17.019zM9.587,17.019h-2.89V7.1h2.89V17.019z M13.303,17.019h-2.89v-6.651h2.89V17.019z M17.019,17.019h-2.891V2.982h2.891V17.019z"></path>
+</svg>

assets/images/svg/icon-instagram.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path fill="none" d="M14.52,2.469H5.482c-1.664,0-3.013,1.349-3.013,3.013v9.038c0,1.662,1.349,3.012,3.013,3.012h9.038c1.662,0,3.012-1.35,3.012-3.012V5.482C17.531,3.818,16.182,2.469,14.52,2.469 M13.012,4.729h2.26v2.259h-2.26V4.729z M10,6.988c1.664,0,3.012,1.349,3.012,3.012c0,1.664-1.348,3.013-3.012,3.013c-1.664,0-3.012-1.349-3.012-3.013C6.988,8.336,8.336,6.988,10,6.988 M16.025,14.52c0,0.831-0.676,1.506-1.506,1.506H5.482c-0.831,0-1.507-0.675-1.507-1.506V9.247h1.583C5.516,9.494,5.482,9.743,5.482,10c0,2.497,2.023,4.52,4.518,4.52c2.494,0,4.52-2.022,4.52-4.52c0-0.257-0.035-0.506-0.076-0.753h1.582V14.52z"></path>
+</svg>

assets/images/svg/icon-knowledge.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path d="M14.68,12.621c-0.9,0-1.702,0.43-2.216,1.09l-4.549-2.637c0.284-0.691,0.284-1.457,0-2.146l4.549-2.638c0.514,0.661,1.315,1.09,2.216,1.09c1.549,0,2.809-1.26,2.809-2.808c0-1.548-1.26-2.809-2.809-2.809c-1.548,0-2.808,1.26-2.808,2.809c0,0.38,0.076,0.741,0.214,1.073l-4.55,2.638c-0.515-0.661-1.316-1.09-2.217-1.09c-1.548,0-2.808,1.26-2.808,2.809s1.26,2.808,2.808,2.808c0.9,0,1.702-0.43,2.217-1.09l4.55,2.637c-0.138,0.332-0.214,0.693-0.214,1.074c0,1.549,1.26,2.809,2.808,2.809c1.549,0,2.809-1.26,2.809-2.809S16.229,12.621,14.68,12.621M14.68,2.512c1.136,0,2.06,0.923,2.06,2.06S15.815,6.63,14.68,6.63s-2.059-0.923-2.059-2.059S13.544,2.512,14.68,2.512M5.319,12.061c-1.136,0-2.06-0.924-2.06-2.06s0.923-2.059,2.06-2.059c1.135,0,2.06,0.923,2.06,2.059S6.454,12.061,5.319,12.061M14.68,17.488c-1.136,0-2.059-0.922-2.059-2.059s0.923-2.061,2.059-2.061s2.06,0.924,2.06,2.061S15.815,17.488,14.68,17.488"></path>
+</svg>

assets/images/svg/icon-mark-white.svg

@@ -0,0 +1,4 @@
+<svg class="svg-icon" width="51" height="51" viewBox="0 0 51 51" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="25.5" cy="25.5" r="23.5" stroke="white" stroke-width="4"/>
+<path d="M36.5755 14L24.9174 22.7789C24.7517 22.7652 24.5859 22.7515 24.4201 22.7515C21.9753 22.7515 20 24.7069 20 27.1273C20 29.5476 21.9753 31.503 24.4201 31.503C26.865 31.503 28.8403 29.5476 28.8403 27.1273C28.8403 26.9632 28.8265 26.7991 28.8127 26.635L37.6806 15.0939L36.5755 14Z" fill="white"/>
+</svg>

assets/images/svg/icon-person.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path fill="none" d="M12.443,9.672c0.203-0.496,0.329-1.052,0.329-1.652c0-1.969-1.241-3.565-2.772-3.565S7.228,6.051,7.228,8.02c0,0.599,0.126,1.156,0.33,1.652c-1.379,0.555-2.31,1.553-2.31,2.704c0,1.75,2.128,3.169,4.753,3.169c2.624,0,4.753-1.419,4.753-3.169C14.753,11.225,13.821,10.227,12.443,9.672z M10,5.247c1.094,0,1.98,1.242,1.98,2.773c0,1.531-0.887,2.772-1.98,2.772S8.02,9.551,8.02,8.02C8.02,6.489,8.906,5.247,10,5.247z M10,14.753c-2.187,0-3.96-1.063-3.96-2.377c0-0.854,0.757-1.596,1.885-2.015c0.508,0.745,1.245,1.224,2.076,1.224s1.567-0.479,2.076-1.224c1.127,0.418,1.885,1.162,1.885,2.015C13.961,13.689,12.188,14.753,10,14.753z M10,0.891c-5.031,0-9.109,4.079-9.109,9.109c0,5.031,4.079,9.109,9.109,9.109c5.031,0,9.109-4.078,9.109-9.109C19.109,4.969,15.031,0.891,10,0.891z M10,18.317c-4.593,0-8.317-3.725-8.317-8.317c0-4.593,3.724-8.317,8.317-8.317c4.593,0,8.317,3.724,8.317,8.317C18.317,14.593,14.593,18.317,10,18.317z"></path>
+</svg>

assets/images/svg/icon-ribbon.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path d="M15.94,10.179l-2.437-0.325l1.62-7.379c0.047-0.235-0.132-0.458-0.372-0.458H5.25c-0.241,0-0.42,0.223-0.373,0.458l1.634,7.376L4.06,10.179c-0.312,0.041-0.446,0.425-0.214,0.649l2.864,2.759l-0.724,3.947c-0.058,0.315,0.277,0.554,0.559,0.401l3.457-1.916l3.456,1.916c-0.419-0.238,0.56,0.439,0.56-0.401l-0.725-3.947l2.863-2.759C16.388,10.604,16.254,10.22,15.94,10.179M10.381,2.778h3.902l-1.536,6.977L12.036,9.66l-1.655-3.546V2.778z M5.717,2.778h3.903v3.335L7.965,9.66L7.268,9.753L5.717,2.778zM12.618,13.182c-0.092,0.088-0.134,0.217-0.11,0.343l0.615,3.356l-2.938-1.629c-0.057-0.03-0.122-0.048-0.184-0.048c-0.063,0-0.128,0.018-0.185,0.048l-2.938,1.629l0.616-3.356c0.022-0.126-0.019-0.255-0.11-0.343l-2.441-2.354l3.329-0.441c0.128-0.017,0.24-0.099,0.295-0.215l1.435-3.073l1.435,3.073c0.055,0.116,0.167,0.198,0.294,0.215l3.329,0.441L12.618,13.182z"></path>
+</svg>

assets/images/svg/icon-search.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path d="M18.125,15.804l-4.038-4.037c0.675-1.079,1.012-2.308,1.01-3.534C15.089,4.62,12.199,1.75,8.584,1.75C4.815,1.75,1.982,4.726,2,8.286c0.021,3.577,2.908,6.549,6.578,6.549c1.241,0,2.417-0.347,3.44-0.985l4.032,4.026c0.167,0.166,0.43,0.166,0.596,0l1.479-1.478C18.292,16.234,18.292,15.968,18.125,15.804 M8.578,13.99c-3.198,0-5.716-2.593-5.733-5.71c-0.017-3.084,2.438-5.686,5.74-5.686c3.197,0,5.625,2.493,5.64,5.624C14.242,11.548,11.621,13.99,8.578,13.99 M16.349,16.981l-3.637-3.635c0.131-0.11,0.721-0.695,0.876-0.884l3.642,3.639L16.349,16.981z"></path>
+</svg>

assets/images/svg/icon-toolbox.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path d="M17.283,5.549h-5.26V4.335c0-0.222-0.183-0.404-0.404-0.404H8.381c-0.222,0-0.404,0.182-0.404,0.404v1.214h-5.26c-0.223,0-0.405,0.182-0.405,0.405v9.71c0,0.223,0.182,0.405,0.405,0.405h14.566c0.223,0,0.404-0.183,0.404-0.405v-9.71C17.688,5.731,17.506,5.549,17.283,5.549 M8.786,4.74h2.428v0.809H8.786V4.74z M16.879,15.26H3.122v-4.046h5.665v1.201c0,0.223,0.182,0.404,0.405,0.404h1.618c0.222,0,0.405-0.182,0.405-0.404v-1.201h5.665V15.26z M9.595,9.583h0.81v2.428h-0.81V9.583zM16.879,10.405h-5.665V9.19c0-0.222-0.183-0.405-0.405-0.405H9.191c-0.223,0-0.405,0.183-0.405,0.405v1.215H3.122V6.358h13.757V10.405z"></path>
+</svg>

assets/images/svg/icon-twitter.svg

@@ -0,0 +1,3 @@
+<svg class="svg-icon" viewBox="0 0 20 20">
+	<path fill="none" d="M18.258,3.266c-0.693,0.405-1.46,0.698-2.277,0.857c-0.653-0.686-1.586-1.115-2.618-1.115c-1.98,0-3.586,1.581-3.586,3.53c0,0.276,0.031,0.545,0.092,0.805C6.888,7.195,4.245,5.79,2.476,3.654C2.167,4.176,1.99,4.781,1.99,5.429c0,1.224,0.633,2.305,1.596,2.938C2.999,8.349,2.445,8.19,1.961,7.925C1.96,7.94,1.96,7.954,1.96,7.97c0,1.71,1.237,3.138,2.877,3.462c-0.301,0.08-0.617,0.123-0.945,0.123c-0.23,0-0.456-0.021-0.674-0.062c0.456,1.402,1.781,2.422,3.35,2.451c-1.228,0.947-2.773,1.512-4.454,1.512c-0.291,0-0.575-0.016-0.855-0.049c1.588,1,3.473,1.586,5.498,1.586c6.598,0,10.205-5.379,10.205-10.045c0-0.153-0.003-0.305-0.01-0.456c0.7-0.499,1.308-1.12,1.789-1.827c-0.644,0.28-1.334,0.469-2.06,0.555C17.422,4.782,17.99,4.091,18.258,3.266"></path>
+</svg>

assets/images/svg/monitor-window.svg

@@ -0,0 +1,40 @@
+<svg class="z-0 lg:absolute pin-r pin-b w-1/2 lg:opacity-25 xl:opacity-100 lg:w-auto" width="600px" height="385" viewBox="0 0 398 257" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 53.2 (72643) - https://sketchapp.com -->
+    <title>monitor-window</title>
+    <desc>Created with Sketch.</desc>
+    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <g id="monitor-window" transform="translate(1.000000, 1.000000)">
+            <path d="M20.7272727,201.954545 L375.272727,201.954545" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M0.272727273,201.954545 L11.6363636,201.954545" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M384.363636,201.954545 L395.727273,201.954545" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M81.8272727,60.4090909 L294.172727,60.4090909 C296.160952,60.4090909 297.772727,62.0208658 297.772727,64.0090909 L297.772727,189.809091 C297.772727,191.797316 296.160952,193.409091 294.172727,193.409091 L81.8272727,193.409091 C79.8390476,193.409091 78.2272727,191.797316 78.2272727,189.809091 L78.2272727,128.686189 L78.2272727,64.0090909 C78.2272727,62.0208658 79.8390476,60.4090909 81.8272727,60.4090909 Z" id="Rectangle" fill="#F5DDDC" fill-rule="nonzero"></path>
+            <path d="M211,60.4090909 L97.0454545,60.4090909 C93.717068,60.4090909 87.4443407,60.4090909 78.2272727,60.4090909 C78.2272727,69.3542688 78.2272727,75.6269961 78.2272727,79.2272727 L78.2272727,193.181818 L211,60.4090909 Z" id="Path" fill="#FFFFFF" fill-rule="nonzero"></path>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" x="78.2272727" y="60.4090909" width="219.545455" height="133" rx="3.6"></rect>
+            <path d="M278.954545,217.227273 C283.984699,217.288028 288.829771,215.332257 292.408173,211.796557 C295.986575,208.260857 298.000367,203.439611 298,198.409091 L298,192.136364 L78.2272727,192.136364 L78.2272727,198.409091 C78.2272727,208.802086 86.6524597,217.227273 97.0454545,217.227273 L278.954545,217.227273 Z" id="Path" stroke="#282828" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round"></path>
+            <polygon id="Path" fill="#FFFFFF" fill-rule="nonzero" points="206.818182 242.318182 169.181818 242.318182 172.318182 217.227273 203.681818 217.227273"></polygon>
+            <polygon id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" points="206.818182 242.318182 169.181818 242.318182 172.318182 217.227273 203.681818 217.227273"></polygon>
+            <path d="M228.772727,254.863636 L147.227273,254.863636 C147.227273,247.934973 152.844064,242.318182 159.772727,242.318182 L216.181818,242.318182 C223.117873,242.318137 228.747687,247.927627 228.772727,254.863636 L228.772727,254.863636 Z" id="Path" stroke="#282828" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M128.409091,38.4545455 L310.227273,38.4545455 L310.227273,146.727273 C310.227273,152.752197 305.343106,157.636364 299.318182,157.636364 L139.318182,157.636364 C133.293257,157.636364 128.409091,152.752197 128.409091,146.727273 L128.409091,38.4545455 Z" id="Path" stroke="#282828" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M139.318182,0.818181818 L299.409091,0.818181818 C305.434015,0.818181818 310.318182,5.70234818 310.318182,11.7272727 L310.318182,38.4545455 L128.5,38.4545455 L128.5,11.7272727 C128.499792,5.73767257 133.32879,0.868095149 139.318182,0.818181818 Z" id="Path" stroke="#282828" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round"></path>
+            <circle id="Oval" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" cx="147.227273" cy="19.6363636" r="6.27272727"></circle>
+            <circle id="Oval" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" cx="172.318182" cy="19.6363636" r="6.27272727"></circle>
+            <circle id="Oval" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" cx="197.409091" cy="19.6363636" r="6.27272727"></circle>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" x="184.863636" y="76.0909091" width="25.0909091" height="25.0909091" rx="1"></rect>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" x="225.636364" y="76.0909091" width="25.0909091" height="25.0909091" rx="1"></rect>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" x="266.409091" y="76.0909091" width="25.0909091" height="25.0909091" rx="1"></rect>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" x="184.863636" y="113.727273" width="25.0909091" height="25.0909091" rx="1"></rect>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" x="225.636364" y="113.727273" width="25.0909091" height="25.0909091" rx="1"></rect>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" x="266.409091" y="113.727273" width="25.0909091" height="25.0909091" rx="1"></rect>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linecap="round" stroke-linejoin="round" x="147.227273" y="51" width="25.0909091" height="12.5454545" rx="1"></rect>
+            <rect id="Rectangle" stroke="#282828" stroke-width="2" fill="#F5DDDC" fill-rule="nonzero" stroke-linejoin="round" x="184.863636" y="51" width="106.636364" height="12.5454545" rx="1"></rect>
+            <path d="M147.227273,76.0909091 L172.318182,76.0909091" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M147.227273,88.6363636 L172.318182,88.6363636" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M147.227273,101.181818 L172.318182,101.181818" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M147.227273,113.727273 L172.318182,113.727273" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M147.227273,126.272727 L172.318182,126.272727" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M147.227273,138.818182 L162.909091,138.818182" id="Path" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"></path>
+            <path d="M351.090909,207.5 C350.181818,210.818182 348.363636,210.909091 347.045455,207.5 L326.454545,158.363636 C325.136364,155.181818 326.454545,153.818182 329.863636,155 L379.227273,175.545455 C382.409091,176.909091 382.272727,178.727273 378.954545,179.636364 L363.136364,184.181818 C359.502812,185.396001 356.64469,188.237311 355.409091,191.863636 L351.090909,207.5 Z" id="Path" stroke="#282828" stroke-width="2" fill="#FFFFFF" fill-rule="nonzero" stroke-linejoin="round"></path>
+            <circle id="Oval" stroke="#282828" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" cx="188" cy="204.681818" r="2.63636364"></circle>
+        </g>
+    </g>
+</svg>

assets/js/main.js

@@ -0,0 +1,8 @@
+// Build CSS
+import '../css/app.css'
+
+// Import JS Modules
+import menu_init from './modules/menu'
+
+// Load Menu Script
+document.addEventListener( 'DOMContentLoaded', menu_init );

assets/js/modules/menu.js

@@ -0,0 +1,30 @@
+export default () => {
+	const toggles = document.querySelectorAll('.toggle')
+	const menu   = document.querySelector('.nav-mobile')
+
+	if ( ! toggles || ! menu ) {
+		return;
+	}
+
+	let active = false
+
+	toggles.forEach(toggle => {
+		toggle.addEventListener( 'click', () => {
+			if ( active ) {
+				open();
+			} else {
+				close();
+			}
+		})
+	})
+
+	function open() {
+		menu.classList.remove('active')
+		active = false
+	}
+
+	function close() {
+		menu.classList.add('active')
+		active = true
+	}
+}