Initial commit

2018-06-29 00:00:48 -07:00
commit f72587d80e
59 changed files with 10681 additions and 0 deletions
@@ -0,0 +1,113 @@
+/* Header */
+
+	$accent: accent2;
+
+	body {
+		
+		padding-top: _size(header-height);
+
+		&:before {
+			content: ' ';
+			background-image: url(../../images/bg.jpg);
+			background-size: cover;
+			background-repeat: no-repeat;
+			background-attachment: fixed;
+		    display: block;
+		    position: fixed;
+		    left: 0;
+		    top: 0;
+		    width: 100%;
+		    height: 100%;
+		    z-index: -1;
+		    opacity: 0.05;
+		}
+	}
+
+	#header {
+		@include vendor('align-items', 'center');
+		@include vendor('display', 'flex');
+		@include vendor('justify-content', 'space-between');
+		background: _palette($accent, bg);
+		color: _palette($accent, fg);
+		cursor: default;
+		height: _size(header-height);
+		left: 0;
+		line-height: _size(header-height);
+		position: fixed;
+		top: 0;
+		width: 100%;
+		z-index: _misc(z-index-base) + 1;
+
+		> .logo {
+			color: _palette($accent, fg-bold);
+			font-size: 1rem;
+			font-weight: _font(weight-bold);
+			height: inherit;
+			line-height: inherit;
+			padding: 0 1.25rem;
+			text-decoration: none;
+		}
+
+		> nav {
+			> a {
+				color: inherit;
+				display: inline-block;
+				padding: 0 0.75rem;
+				text-decoration: none;
+
+				&:hover {
+					color: _palette($accent, fg-bold);
+				}
+
+				&[href="#menu"] {
+					@include icon;
+					-webkit-tap-highlight-color: rgba(0,0,0,0);
+
+					&:before {
+						content: '\f0c9';
+						margin: 0 0.5rem 0 0;
+					}
+				}
+
+				& + a[href="#menu"]:last-child {
+					border-left: solid 1px _palette($accent, border);
+					margin-left: 0.5rem;
+					padding-left: 1.25rem;
+				}
+
+				&:last-child {
+					padding-right: 1.25rem;
+				}
+
+				@include breakpoint('<=small') {
+					padding: 0 0.5rem;
+
+					& + a[href="#menu"]:last-child {
+						margin-left: 0.25rem;
+						padding-left: 1rem;
+					}
+
+					&:last-child {
+						padding-right: 1rem;
+					}
+				}
+			}
+		}
+	}
+
+	@include breakpoint('<=medium') {
+		body {
+			padding-top: 44px;
+		}
+
+		#header {
+			height: 44px;
+			line-height: 44px;
+		}
+	}
+
+	@include breakpoint('<=xsmall') {
+		#header {
+			min-width: 320px;
+		}
+	}