X-Git-Url: https://git.danix.xyz/?a=blobdiff_plain;f=assets%2Fsass%2Fmain.scss;h=6d26e38b0a669ba60a46b09a5135e9cdea5aa337;hb=84032966f14fb3c9269b570b1d4fc16452c601c4;hp=55e11c4e797eb91fb58ccdd2a5bce7365138ab49;hpb=c7bc4983e9325c8091a9c26a054d3be63acaf4c1;p=theme-danix.xyz.git

diff --git a/assets/sass/main.scss b/assets/sass/main.scss
index 55e11c4..6d26e38 100644
--- a/assets/sass/main.scss
+++ b/assets/sass/main.scss
@@ -1,94 +1,82 @@
-// various imports for our styling
-
-// BOURBON 
-@import "bourbon/bourbon";
-// FONT-AWESOME v6.2.1
-@import "fa-v6/fontawesome";
-@import "fa-v6/brands";
-// MY COLOR DEFINITIONS
-@import "colors";
+// HTML5UP
+@import 'libs/vars';
+@import 'libs/functions';
+@import 'libs/mixins';
+@import 'libs/my-mixins';
+@import 'libs/vendor';
+@import 'libs/breakpoints';
+@import 'libs/html-grid';
 // GOOGLE FONTS
-@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,400;0,600;1,400;1,600&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,400;0,600;1,400;1,600&family=Red+Hat+Mono&display=swap');
 
-html {
-	margin: 0;
-	padding: 0;
-	font-family: 'Montserrat', sans-serif;
-	color: $dark-grey;
-	a {
-		color: $dark-accent;
-		text-decoration: none;
-		&:visited {
-			color: $light-accent;
-		}
-		&:hover {
-			color: $dark-orange;
-		}
-	}
+// Breakpoints.
 
-	body {
-		background-color: $base-bg;
-		margin: 0;
-		padding: 0;
+	@include breakpoints((
+		xlarge:    (1281px,   1680px   ),
+		large:     (981px,    1280px   ),
+		medium:    (737px,    980px    ),
+		small:     (481px,    736px    ),
+		xsmall:    (361px,    480px    ),
+		xxsmall:   (null,     360px    )
+	));
 
-		div#page {
-			header#masthead,
-			footer#colophon {
-				color: $base-bg;
-				background-color: $dark-grey;
-				margin: 0;
-				padding: 1em;
-			}
-			header#masthead {
-				h1.site-title {
-					font-size: 5em;
-					font-weight: 200;
-					margin: 0;
-					padding: 0;
-					a {
-						color: $dark-orange;
-					}
-				}
-			}
-			footer#colophon {
-				div#social-menu {
-					ul.social-links {
-						margin: 0;
-						padding: 0;
-					}
-				}
-			}
-			div#content {
-				line-height: 1.5;
-				font-weight: 400;
-				padding: 1em 3em;
-				div#secondary {
-					div#home-social-links {
-						margin: 1em auto;
-						ul.social-links-list {
-							list-style: none;
-							li {
-								display: inline-block;
-								float: none;
-								font-size: 4em;
-								width: 2em;
-								text-align: center;
-								a {
-									color: $dark-orange;
-									&:hover {
-										animation-name: fa-bounce;
-										color: shade($dark-orange, 60%);
-									}
-								}
-							}
-						}
-					}
-				}
+// Mixins.
+
+	@mixin inner {
+		> .inner {
+			@include padding(4em, 0);
+			margin: 0 auto;
+			max-width: _size(inner);
+			width: calc(100% - 6em);
+
+			@include breakpoint('<=small') {
+				@include padding(3em, 0);
+				width: calc(100% - 3em);
 			}
 		}
 	}
+
+// Base.
+
+	@import 'base/reset';
+	@import 'base/page';
+	@import 'base/typography';
+
+// Component.
+
+	@import 'components/row';
+	@import 'components/section';
+	@import 'components/form';
+	@import 'components/box';
+	@import 'components/icon';
+	@import 'components/image';
+	@import 'components/list';
+	@import 'components/actions';
+	@import 'components/icons';
+	@import 'components/pagination';
+	@import 'components/breadcrumbs';
+	@import 'components/table';
+	@import 'components/button';
+	@import 'components/tiles';
+	@import 'components/contact-method';
+	@import 'components/spotlights';
+	@import 'components/search';
+
+// Layout.
+
+	@import 'layout/header';
+	@import 'layout/banner';
+	@import 'layout/main';
+	@import 'layout/contact';
+	@import 'layout/footer';
+	@import 'layout/wrapper';
+	@import 'layout/menu';
+
+// darken images in dark mode
+@media screen and (prefers-color-scheme: dark) {
+	$image-filter: grayscale(50%);
+
+	img:not([src*='.svg']) {
+	  filter: $image-filter;
+	}
 }
-.screen-reader-text,
-.hidden {
-	@include hide-visually;
-}
\ No newline at end of file