diff --git a/assets/fonts/ComicNeue-Bold.woff b/assets/fonts/ComicNeue-Bold.woff deleted file mode 100644 index 6e1eff3..0000000 Binary files a/assets/fonts/ComicNeue-Bold.woff and /dev/null differ diff --git a/assets/fonts/ComicNeue-Bold.woff2 b/assets/fonts/ComicNeue-Bold.woff2 deleted file mode 100644 index 7c92d80..0000000 Binary files a/assets/fonts/ComicNeue-Bold.woff2 and /dev/null differ diff --git a/assets/fonts/ComicNeue-BoldItalic.woff b/assets/fonts/ComicNeue-BoldItalic.woff deleted file mode 100644 index 99cf152..0000000 Binary files a/assets/fonts/ComicNeue-BoldItalic.woff and /dev/null differ diff --git a/assets/fonts/ComicNeue-BoldItalic.woff2 b/assets/fonts/ComicNeue-BoldItalic.woff2 deleted file mode 100644 index 1289df5..0000000 Binary files a/assets/fonts/ComicNeue-BoldItalic.woff2 and /dev/null differ diff --git a/assets/fonts/ComicNeue-Italic.woff b/assets/fonts/ComicNeue-Italic.woff deleted file mode 100644 index 7fcc96c..0000000 Binary files a/assets/fonts/ComicNeue-Italic.woff and /dev/null differ diff --git a/assets/fonts/ComicNeue-Italic.woff2 b/assets/fonts/ComicNeue-Italic.woff2 deleted file mode 100644 index a97f992..0000000 Binary files a/assets/fonts/ComicNeue-Italic.woff2 and /dev/null differ diff --git a/assets/fonts/ComicNeue-Regular.woff b/assets/fonts/ComicNeue-Regular.woff deleted file mode 100644 index 5479f73..0000000 Binary files a/assets/fonts/ComicNeue-Regular.woff and /dev/null differ diff --git a/assets/fonts/ComicNeue-Regular.woff2 b/assets/fonts/ComicNeue-Regular.woff2 deleted file mode 100644 index 04a82fb..0000000 Binary files a/assets/fonts/ComicNeue-Regular.woff2 and /dev/null differ diff --git a/assets/fonts/FiraCode-Medium.woff b/assets/fonts/FiraCode-Medium.woff deleted file mode 100644 index 921caab..0000000 Binary files a/assets/fonts/FiraCode-Medium.woff and /dev/null differ diff --git a/assets/fonts/FiraCode-Medium.woff2 b/assets/fonts/FiraCode-Medium.woff2 deleted file mode 100644 index b3999e1..0000000 Binary files a/assets/fonts/FiraCode-Medium.woff2 and /dev/null differ diff --git a/assets/fonts/FiraCode-Regular.woff b/assets/fonts/FiraCode-Regular.woff deleted file mode 100644 index 498175b..0000000 Binary files a/assets/fonts/FiraCode-Regular.woff and /dev/null differ diff --git a/assets/fonts/FiraCode-Regular.woff2 b/assets/fonts/FiraCode-Regular.woff2 deleted file mode 100644 index 9ef6c65..0000000 Binary files a/assets/fonts/FiraCode-Regular.woff2 and /dev/null differ diff --git a/assets/fonts/mukta-bold-webfont.woff b/assets/fonts/mukta-bold-webfont.woff new file mode 100644 index 0000000..6128858 Binary files /dev/null and b/assets/fonts/mukta-bold-webfont.woff differ diff --git a/assets/fonts/mukta-bold-webfont.woff2 b/assets/fonts/mukta-bold-webfont.woff2 new file mode 100644 index 0000000..d06667a Binary files /dev/null and b/assets/fonts/mukta-bold-webfont.woff2 differ diff --git a/assets/fonts/mukta-extrabold-webfont.woff b/assets/fonts/mukta-extrabold-webfont.woff new file mode 100644 index 0000000..6d39154 Binary files /dev/null and b/assets/fonts/mukta-extrabold-webfont.woff differ diff --git a/assets/fonts/mukta-extrabold-webfont.woff2 b/assets/fonts/mukta-extrabold-webfont.woff2 new file mode 100644 index 0000000..207d9b4 Binary files /dev/null and b/assets/fonts/mukta-extrabold-webfont.woff2 differ diff --git a/assets/fonts/mukta-extralight-webfont.woff b/assets/fonts/mukta-extralight-webfont.woff new file mode 100644 index 0000000..a786faa Binary files /dev/null and b/assets/fonts/mukta-extralight-webfont.woff differ diff --git a/assets/fonts/mukta-extralight-webfont.woff2 b/assets/fonts/mukta-extralight-webfont.woff2 new file mode 100644 index 0000000..f6cb7cb Binary files /dev/null and b/assets/fonts/mukta-extralight-webfont.woff2 differ diff --git a/assets/fonts/mukta-light-webfont.woff b/assets/fonts/mukta-light-webfont.woff new file mode 100644 index 0000000..07730f1 Binary files /dev/null and b/assets/fonts/mukta-light-webfont.woff differ diff --git a/assets/fonts/mukta-light-webfont.woff2 b/assets/fonts/mukta-light-webfont.woff2 new file mode 100644 index 0000000..ae59842 Binary files /dev/null and b/assets/fonts/mukta-light-webfont.woff2 differ diff --git a/assets/fonts/mukta-medium-webfont.woff b/assets/fonts/mukta-medium-webfont.woff new file mode 100644 index 0000000..c2128e5 Binary files /dev/null and b/assets/fonts/mukta-medium-webfont.woff differ diff --git a/assets/fonts/mukta-medium-webfont.woff2 b/assets/fonts/mukta-medium-webfont.woff2 new file mode 100644 index 0000000..54ed82f Binary files /dev/null and b/assets/fonts/mukta-medium-webfont.woff2 differ diff --git a/assets/fonts/mukta-regular-webfont.woff b/assets/fonts/mukta-regular-webfont.woff new file mode 100644 index 0000000..154d3c7 Binary files /dev/null and b/assets/fonts/mukta-regular-webfont.woff differ diff --git a/assets/fonts/mukta-regular-webfont.woff2 b/assets/fonts/mukta-regular-webfont.woff2 new file mode 100644 index 0000000..8517f88 Binary files /dev/null and b/assets/fonts/mukta-regular-webfont.woff2 differ diff --git a/assets/fonts/mukta-semibold-webfont.woff b/assets/fonts/mukta-semibold-webfont.woff new file mode 100644 index 0000000..603e1e7 Binary files /dev/null and b/assets/fonts/mukta-semibold-webfont.woff differ diff --git a/assets/fonts/mukta-semibold-webfont.woff2 b/assets/fonts/mukta-semibold-webfont.woff2 new file mode 100644 index 0000000..ca30b51 Binary files /dev/null and b/assets/fonts/mukta-semibold-webfont.woff2 differ diff --git a/assets/images/background.png b/assets/images/background.png deleted file mode 100644 index f42b300..0000000 Binary files a/assets/images/background.png and /dev/null differ diff --git a/assets/js/page.js b/assets/js/page.js index fc35532..06fbd37 100644 --- a/assets/js/page.js +++ b/assets/js/page.js @@ -1,43 +1,11 @@ -import Cookies from 'js-cookie'; import '/assets/scss/page.scss'; document.addEventListener("readystatechange", event => { if(event.target.readyState === 'complete') { - initOverflow(); initExternalLinks(); - initNinetiesToggle(); } }); -function initOverflow() { - let body = document.querySelector('body'); - let nineties = document.querySelector('.nineties-toggle'); - let container = document.querySelector('.container'); - container.style.height = (body.scrollHeight > window.outerHeight) ? 'auto' : body.scrollHeight - nineties.scrollHeight + 'px'; -} - -function initNinetiesToggle() { - let nineties = document.querySelector('.nineties-toggle'); - let container = document.querySelector('.container'); - nineties.addEventListener('click', function() { - let body = document.querySelector('body'); - if (body.classList.contains('nineties')) { - body.classList.remove('nineties'); - Cookies.remove('nineties'); - } else { - body.classList.add('nineties'); - Cookies.set('nineties', true, { sameSite: 'strict' }); - } - }) - - if( - nineties.getBoundingClientRect().left < container.getBoundingClientRect().right && - nineties.getBoundingClientRect().bottom > container.getBoundingClientRect().top - ) { - nineties.style.position = 'initial'; - nineties.style.textAlign = 'right'; - } -} function initExternalLinks() { document.querySelectorAll('a').forEach(elem => { diff --git a/assets/scss/base.scss b/assets/scss/base.scss index 1f8f9ef..f03adfc 100644 --- a/assets/scss/base.scss +++ b/assets/scss/base.scss @@ -7,83 +7,54 @@ $orange: #d6972a; $font: 'Fira Code', monospace; html { - height: 100%; + position: relative; + min-height: 100%; } body { + margin-bottom: 60px; /* Margin bottom by footer height */ + font-family: 'Mukta', sans-serif; +} +.footer { + position: absolute; + bottom: 0; + width: 100%; + height: 60px; /* Set the fixed height of the footer here */ + line-height: 60px; /* Vertically center the text there */ +} + +nav { background-color: $black; - background-image: url("../images/background.png"); - color: $orange; - font-family: $font; - height: 100%; - &.nineties { - color: $black; - -webkit-animation: background 2s linear infinite; - -moz-animation: background 2s linear infinite; - animation: background 2s linear infinite; - background: linear-gradient(to right, red, orange, yellow, green, aqua, blue, violet, red, orange, yellow, green, aqua, blue, violet, red); - background-size: 200% 100%; - font-family: 'Comic Sans MS', 'Chalkboard SE', 'Comic Neue', cursive; - - @-webkit-keyframes background { - 0%{background-position:100% 50%} - 100%{background-position:0% 50%} - } - @-moz-keyframes background { - 0%{background-position:100% 50%} - 100%{background-position:0% 50%} - } - @keyframes background { - 0%{background-position:100% 50%} - 100%{background-position:0% 50%} - } - - a { - color: $black; - } - - .nineties-toggle { - background: none; - color: $black; - } - } - - .nineties-toggle { - cursor: pointer; - position: absolute; - top: 0; - right: 0; - background: linear-gradient(to right, red, orange, yellow, green, aqua, blue, violet); - background-clip: text; - -webkit-background-clip: text; - color: transparent; - font-family: 'Comic Sans MS', 'Chalkboard SE', 'Comic Neue', cursive; - } - - a { - color: $orange; - } - - .container { + ul { display: flex; - height: 100%; - width: 100%; - justify-content: center; - align-items: center; - flex-direction: column; - padding: 10px; - } + justify-content: end; + list-style: none; + padding: 0; + margin: 0; - header { - text-align: center; - - ul { - display: flex; - flex-direction: row; - flex-wrap: wrap; - justify-content: space-around; - list-style: none; - padding: 0; + li { + width: 150px; + text-align: right; } } +} + +header { + background-color: $black; + color: $orange; +} + +main { + h1 { + background-color: $orange; + padding: 5px; + } + h2 { + background-color: $orange; + padding: 2px; + } +} + +a { + color: $orange; } \ No newline at end of file diff --git a/assets/scss/fonts.scss b/assets/scss/fonts.scss index 83fbfcc..48dce47 100644 --- a/assets/scss/fonts.scss +++ b/assets/scss/fonts.scss @@ -1,54 +1,64 @@ +/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on March 21, 2023 */ + @font-face { - font-family: 'Fira Code'; - src: url('../fonts/FiraCode-Regular.woff2') format('woff2'), - url('../fonts/FiraCode-Regular.woff') format('woff'); - font-weight: normal; + font-family: 'Mukta'; + src: url('../fonts/mukta-extrabold-webfont.woff2') format('woff2'), + url('../fonts/mukta-extrabold-webfont.woff') format('woff'); + font-weight: 800; font-style: normal; - font-display: swap; + } @font-face { - font-family: 'Fira Code'; - src: url('../fonts/FiraCode-Medium.woff2') format('woff2'), - url('../fonts/FiraCode-Medium.woff') format('woff'); + font-family: 'Mukta'; + src: url('../fonts/mukta-bold-webfont.woff2') format('woff2'), + url('../fonts/mukta-bold-webfont.woff') format('woff'); + font-weight: 700; + font-style: normal; + +} + +@font-face { + font-family: 'Mukta'; + src: url('../fonts/mukta-semibold-webfont.woff2') format('woff2'), + url('../fonts/mukta-semibold-webfont.woff') format('woff'); + font-weight: 600; + font-style: normal; + +} + +@font-face { + font-family: 'Mukta'; + src: url('../fonts/mukta-medium-webfont.woff2') format('woff2'), + url('../fonts/mukta-medium-webfont.woff') format('woff'); font-weight: 500; font-style: normal; - font-display: swap; + } @font-face { - font-family: 'Comic Neue'; - src: url('../fonts/ComicNeue-Bold.woff2') format('woff2'), - url('../fonts/ComicNeue-Bold.woff') format('woff'); - font-weight: bold; + font-family: 'Mukta'; + src: url('../fonts/mukta-regular-webfont.woff2') format('woff2'), + url('../fonts/mukta-regular-webfont.woff') format('woff'); + font-weight: 400; font-style: normal; - font-display: swap; + } @font-face { - font-family: 'Comic Neue'; - src: url('../fonts/ComicNeue-BoldItalic.woff2') format('woff2'), - url('../fonts/ComicNeue-BoldItalic.woff') format('woff'); - font-weight: bold; - font-style: italic; - font-display: swap; -} - -@font-face { - font-family: 'Comic Neue'; - src: url('../fonts/ComicNeue-Regular.woff2') format('woff2'), - url('../fonts/ComicNeue-Regular.woff') format('woff'); - font-weight: normal; + font-family: 'Mukta'; + src: url('../fonts/mukta-light-webfont.woff2') format('woff2'), + url('../fonts/mukta-light-webfont.woff') format('woff'); + font-weight: 300; font-style: normal; - font-display: swap; + } @font-face { - font-family: 'Comic Neue'; - src: url('../fonts/ComicNeue-Italic.woff2') format('woff2'), - url('../fonts/ComicNeue-Italic.woff') format('woff'); - font-weight: normal; - font-style: italic; - font-display: swap; -} + font-family: 'Mukta'; + src: url('../fonts/mukta-extralight-webfont.woff2') format('woff2'), + url('../fonts/mukta-extralight-webfont.woff') format('woff'); + font-weight: 200; + font-style: normal; +} \ No newline at end of file diff --git a/src/Controller/DefaultController.php b/src/Controller/DefaultController.php index 3f85379..2aad571 100644 --- a/src/Controller/DefaultController.php +++ b/src/Controller/DefaultController.php @@ -15,6 +15,7 @@ class DefaultController extends AbstractController $return = $page->getPage($kernel, $slug); $response = new Response('', (int)$return['status']); return $this->render('/page.html.twig', [ + 'nav' => $return['nav'], 'header' => $return['header'], 'content' => $return['content'], 'title' => $return['title'], diff --git a/src/Repository/Page.php b/src/Repository/Page.php index 0b37f37..f009075 100644 --- a/src/Repository/Page.php +++ b/src/Repository/Page.php @@ -11,6 +11,7 @@ class Page public function getPage(KernelInterface $kernel, string $page) { $return['header'] = file_get_contents($kernel->getCacheDir() . '/pages/_main.md'); + $return['nav'] = file_get_contents($kernel->getCacheDir() . '/pages/_nav.md'); $titles = json_decode(file_get_contents($kernel->getCacheDir() . '/pages/titles.json'), true); if(file_exists($kernel->getCacheDir() . '/pages/' . $page . '.md')) { $return['title'] = $titles[$page] ?? ''; diff --git a/templates/base.html.twig b/templates/base.html.twig index 6cda52d..4300e3a 100644 --- a/templates/base.html.twig +++ b/templates/base.html.twig @@ -23,12 +23,14 @@ - -
{% if nineties %}My eyes hurt{% else %}Take me back in time{% endif %}
-
- {% block content %}{% endblock %} - {% block extrahtml %}{% endblock %} -
+ + {% block content %}{% endblock %} + {% block extrahtml %}{% endblock %} + diff --git a/templates/page.html.twig b/templates/page.html.twig index f29a1c5..3751901 100755 --- a/templates/page.html.twig +++ b/templates/page.html.twig @@ -1,8 +1,21 @@ {% extends "base.html.twig" %} {% block title %}{{ title }}{% endblock %} {% block content %} -
{{ header | markdown | raw }}
-
{{ content | markdown | raw }}
+ +
+
+ {{ header | markdown | raw }} +
+
+
+
+ {{ content | markdown | raw }} +
+
{% endblock %} {% block styles %}