jekyll-theme-dusk 0.4.1 → 0.5.2

data/_sass/base.scss

@@ -1,112 +1,213 @@
-@use "sass:math";
 @import "css-reset";
-@import "fonts";
-@import "include";
-@import "layout";
+@import "text";
 @import "device-support";
+@import "variables.scss";
 
-/* Colours */
-$primary-colour: #c7bc87;			// Light Gold
-$background-colour: #171717;		// Dark Gray
-
-/* Templates */
-@mixin display {
-	font-family: 'Chivo Mono', monospace;
-	color: $primary-colour;
+h1, h2, h3, h4, h5, h6 {
+    @include display;
 }
 
-@mixin content {
-	font-family: 'Titillium Web', sans-serif;
-	color: white;
+a, a:hover, a:active, a:visited {
+    color: white;
+    text-decoration: none;
 }
 
+/* Base Formatting */
 html {
-	@include content;
-	transition: 0.5s;
-	font-size: min(max(1rem, 2vw), 18px);
-}
-
-h1 {
-	font-size: min(max(3rem, 9vw), 50px);
-	font-weight: 700;
+    @include content;
+    background-color: $background-colour;
+    transition: 0.5s;
 }
 
-h2 {
-	font-size: min(max(2.7rem, 8vw), 30px);
-	font-weight: 400;
-}
+header {
+    display: block;
+    height: 30vh;
+    flex-shrink: 0; /* this is so that the flex layout doesnt shrink the header when the window isn't tall enough to fit everything */
 
-h3 {
-	font-size: min(max(2.4rem, 7vw), 25px);
-	font-weight: 200;
-}
+    /* parallax effect in background */
+    background-image: url("/assets/images/dusk-gray.jpg");
+    background-repeat: no-repeat;
+    background-attachment: fixed;
+    background-position: center;
+    background-size: cover;
 
-h4 {
-	font-size: min(max(2.1rem, 6vw), 20px);
-	font-weight: 200;
+    /* center content in header */
+    position: relative;
 }
 
-h5 {
-	font-size: min(max(1.5rem, 4vw), 18px);
-	font-weight: 200;
-	font-style: italic;
+#header--home {
+    height: 50vh;
+    text-align: center;
 }
 
-h6 {
-	font-size: min(max(0.9rem, 3vw), 16px);
-	font-weight: 200;
-	font-style: italic;
+#header__content {
+    display: block;
+    width: 80vw;
+    /* center content in header */
+    margin: 0;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
 }
 
-h1, h2, h3, h4, h5, h6 {
-	@include display;
+body {
+    display: flex;
+    flex-direction: column;
+    align-items: stretch;
+    justify-content: space-between;
 }
 
-a, a:hover, a:active, a:visited {
-	color: white;
-	text-decoration: none;
+main {
+    width: 80vw;
+    margin:  30px auto 0 auto;
 }
 
-/* Base Formatting */
-html {
-	@include content;
-	background-color: $background-colour;
+article {
+    margin: 20px 0;
 }
 
-main {
-	width: 80vw;
-	margin:  30px auto 0 auto;
-}
 hr {
-	margin: 20px;
-}
-
-article {
-	margin: 20px 0;
+    margin: 20px;
 }
 
+/* Custom Classes */
 .image-gallery {
-	ul {
-		display: flex;
-		flex-wrap: wrap;
-		list-style: none;
-		padding-left: 0;
-
-		&:after {
-			content:'';
-			display:block;
-			flex-grow: 10;
-		}
-	}
-
-	li {
-		flex-grow: 1;
-	}
-
-	img {
-		max-height: 100%;
-		min-width: 100%;
-		object-fit: cover;
-		vertical-align: bottom;
-	}
+    margin: 10px 0;
+	
+    ul {
+        display: flex;
+        flex-wrap: wrap;
+        list-style: none;
+        padding-left: 0;
+        margin: 0.75vmin;
+
+        &:after {
+            content: "";
+            display: block;
+            flex-grow: 10;
+        }
+    }
+
+    li {
+        border: 1px solid rgba($primary-colour, 0.2);
+        border-radius: 0.5vmin;
+        padding: 3px;
+        flex-grow: 1;
+        margin: 0.75vmin;
+    }
+
+    img {
+        max-height: 100%;
+        min-width: 100%;
+        object-fit: cover;
+        vertical-align: bottom;
+        border-radius: 0.5vmin;
+    }
+}
+
+.b2b-container {
+    display: inline-flex;
+    justify-content: center;
+    width: 120px;
+    margin: 0;
+    padding: 2px;
+    background-color: rgba(0, 0, 0, 0.6);
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    border-radius: 4px;
+    transition: 0.5s;
+}
+
+.b2b-container:hover {
+    background: rgba(199, 188, 135, 0.2) url(/assets/images/noise.png);
+}
+
+/* navigation.html */
+nav {
+    height: 100%;
+    width: 0; /* changed with JavaScript */
+    position: fixed;
+    z-index: 2;
+    top: 0;
+    right: 0;
+    overflow-x: hidden;
+    transition: 0.5s;
+
+    text-align: center;
+    background-color: rgba(0, 0, 0, 0.6);
+}
+
+.nav__links {
+    display: flex;
+    justify-content: space-between;
+	
+    padding: 11px;
+    transition: 0.5s;
+    height: 45px;
+    width: 100%;
+}
+
+#nav__closebtn {
+    transition: 0.5s;
+    padding: 11px;
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 45px;
+}
+
+.nav__links:hover, #nav__closebtn:hover {
+    background: rgba(199, 188, 135, 0.2) url(/assets/images/noise.png);
+}
+
+.nav__links__icon {
+    width: 24px;
+    display: inline-block;
+}
+
+#nav__openbtn {
+    background-color: rgba(0, 0, 0, 0.6);
+    position: fixed;
+    top: 7px;
+    right: 7px;
+    z-index: 1;
+    display: block;
+
+    transition: 0.5s;
+    cursor: pointer;
+    border: 1px solid rgba(255, 255, 255, 0.2);
+    border-radius: 4px;
+    padding: 3px 10px;
+}
+
+#nav__openbtn:hover {
+    background: rgba(199, 188, 135, 0.2) url(/assets/images/noise.png);
+}
+
+/* footer.html */
+footer {
+    display: flex;
+    justify-content: space-between;
+    background: linear-gradient(100deg, #202020, #323232);
+    padding: 3% 10%;
+    margin-top: 5%;
+}
+
+#footer__links {
+    display: inline-flex;
+    flex-direction: column;
+    a:hover {
+        transition: 0.5s;
+        color: $primary_colour;
+    }
+}
+
+#footer__watermark {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-end;
+    text-align: right;
+    font-size: 85%;
+    width: 50%;
+    opacity: 50%;
 }

data/_sass/css-reset.scss

@@ -1,38 +1,38 @@
 /* CSS Reset - https://www.joshwcomeau.com/css/custom-css-reset/ */
 /* 1. Use a more-intuitive box-sizing model. */
 *, *::before, *::after {
-  box-sizing: border-box;
+    box-sizing: border-box;
 }
 /* 2. Remove default margin */
 * {
-  margin: 0;
+    margin: 0;
 }
 /* 3. Allow percentage-based heights in the application */
 html, body {
-  height: 100%;
+    height: 100%;
 }
 /* Typographic tweaks!
   4. Add accessible line-height
   5. Improve text rendering
 */
 body {
-  line-height: 1.5;
-  -webkit-font-smoothing: antialiased;
+    line-height: 1.5;
+    -webkit-font-smoothing: antialiased;
 }
 /* 6. Improve media defaults */
 img, picture, video, canvas, svg {
-  display: block;
-  max-width: 100%;
+    display: block;
+    max-width: 100%;
 }
 /* 7. Remove built-in form typography styles */
 input, button, textarea, select {
-  font: inherit;
+    font: inherit;
 }
 /* 8. Avoid text overflows */
 p, h1, h2, h3, h4, h5, h6 {
-  overflow-wrap: break-word;
+    overflow-wrap: break-word;
 }
 /* 9. Create a root stacking context */
 #root, #__next {
-  isolation: isolate;
+    isolation: isolate;
 }

data/_sass/device-support.scss

@@ -1,32 +1,47 @@
  /* Extra small devices (phones, 600px and down) */
 @media only screen and (max-width: 600px) {
-	.image-gallery {
-		li {
-			height: 15vh;
-		}
-	}
+    .image-gallery {
+        li {
+            height: 15vh;
+        }
+    }
+
+    #header__content {
+        width: 80vw;
+    }
 }
 
 /* Small devices (portrait tablets and large phones, 600px and up) */
 @media only screen and (min-width: 600px) {
-	.image-gallery {
-		li {
-			height: 20vh;
-		}
-	}
+    .image-gallery {
+        li {
+            height: 20vh;
+        }
+    }
+
+    #header__content {
+        width: 80vw;
+    }
 }
 
 /* Medium devices (landscape tablets, 768px and up) */
 @media only screen and (min-width: 768px) {
-	.image-gallery {
-		li {
-			height: 30vh;
-		}
-	}
+    .image-gallery {
+        li {
+            height: 30vh;
+        }
+    }
+
+    #header__content {
+        width: 80vw;
+    }
 }
 
 /* Large devices (laptops/desktops, 992px and up) */
 @media only screen and (min-width: 992px) {
+    #header__content {
+        width: 50vw;
+    }
 }
 
 /* Extra large devices (large laptops and desktops, 1200px and up) */

data/_sass/text.scss

@@ -0,0 +1,63 @@
+/* Fonts */
+/* Display */
+@import url("https://fonts.googleapis.com/css2?family=Chivo+Mono:ital,wght@0,200;0,400;0,700;1,200;1,400;1,700&display=swap");
+@font-face {
+	font-family: "Chivo Mono";
+	font-style: normal;
+	font-display: swap;
+	src:
+		url("/assets/fonts/Chivo_Mono/ChivoMono-VariableFont_wght.woff2") format("woff2"),
+		url("/assets/fonts/Chivo_Mono/ChivoMono-VariableFont_wght.woff") format("woff"),
+		url("/assets/fonts/Chivo_Mono/ChivoMono-Italic-VariableFont_wght.woff2") format("woff2"),
+		url("/assets/fonts/Chivo_Mono/ChivoMono-Italic-VariableFont_wght.woff") format("woff");
+}
+
+/* Content */
+@import url("https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,400;0,700;1,200;1,400;1,700&display=swap");
+@font-face {
+	font-family: "Titillium Web";
+	font-style: normal;
+	font-display: swap;
+	src:
+		url("/assets/fonts/Titillium_Web/TitilliumWeb-VF.woff2") format("woff2"),
+		url("/assets/fonts/Titillium_Web/TitilliumWeb-VF.woff") format("woff"),
+		url("/assets/fonts/Titillium_Web/TitilliumWeb-Italic-VF.woff2") format("woff2"),
+		url("/assets/fonts/Titillium_Web/TitilliumWeb-Italic-VF.woff") format("woff");
+}
+
+/* Text formatting */
+html {
+    font-size: min(max(16px, 2vw), 18px);
+}
+
+h1 {
+    font-size: min(max(2.5rem, 9vw), 50px);
+    font-weight: 700;
+}
+
+h2 {
+    font-size: min(max(2rem, 6vw), 25px);
+    font-weight: 400;
+}
+
+h3 {
+    font-size: min(max(1.8rem, 5vw), 22px);
+    font-weight: 200;
+}
+
+h4 {
+    font-size: min(max(1.6rem, 4vw), 19px);
+    font-weight: 200;
+}
+
+h5 {
+    font-size: min(max(1.4rem, 3vw), 17.5px);
+    font-weight: 200;
+    font-style: italic;
+}
+
+h6 {
+    font-size: min(max(1.1rem, 2vw), 16px);
+    font-weight: 200;
+    font-style: italic;
+}

data/_sass/variables.scss

@@ -0,0 +1,14 @@
+/* Colours */
+$primary-colour: #c7bc87;           // Light Gold
+$background-colour: #171717;        // Dark Gray
+
+/* Templates */
+@mixin display {
+    font-family: "Chivo Mono", monospace;
+    color: $primary-colour;
+}
+
+@mixin content {
+    font-family: "Titillium Web", sans-serif;
+    color: white;
+}

data/assets/css/styles.scss

@@ -1,3 +1,3 @@
 ---
 ---
-@import "base";
+@import "base";

data/assets/fonts/Chivo_Mono/OFL.txt

@@ -0,0 +1,93 @@
+Copyright 2019 The Chivo Project Authors (https://github.com/Omnibus-Type/Chivo)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

data/assets/fonts/Titillium_Web/OFL.txt

@@ -0,0 +1,93 @@
+Copyright (c) 2009-2011 by Accademia di Belle Arti di Urbino and students of MA course of Visual design. Some rights reserved.
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded, 
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.