Compare commits
2 commits
a25850a146
...
d7635bd6f1
| Author | SHA1 | Date | |
|---|---|---|---|
 gil
|
d7635bd6f1 | ||
|
gil
|
94338fbab6 |
|
|
@ -25,3 +25,9 @@
|
|||
- Switch to [include-media](https://github.com/eduardoboucas/include-media) to simplify media queries
|
||||
- Add blog/lib sections (empty for now)
|
||||
- Partial reorganizing of SCSS files
|
||||
|
||||
## 0.0.3
|
||||
|
||||
- Add pagination to blog
|
||||
- Add `home` layout
|
||||
- Refactored base template
|
||||
|
|
|
|||
|
|
@ -2,5 +2,5 @@ module.exports = {
|
|||
siteName: "Gil's Nexus",
|
||||
siteDescription: "",
|
||||
authorName: "Gil",
|
||||
homepage: "/home/",
|
||||
homepage: "/",
|
||||
};
|
||||
|
|
|
|||
|
|
@ -1,10 +1,12 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
{% include "partials/meta.njk" %}
|
||||
<link rel="stylesheet" href="/css/global.css">
|
||||
</head>
|
||||
<body>
|
||||
<div class="site">
|
||||
{% include "partials/header.njk" %}
|
||||
{% include "partials/navbar.njk" %}
|
||||
{{ content | safe }}
|
||||
{% include "partials/footer.njk" %}
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,7 @@
|
|||
---
|
||||
layout: layouts/base.njk
|
||||
---
|
||||
{% include "partials/header.njk" %}
|
||||
|
||||
<main class="page markup">
|
||||
{{ content | safe }}
|
||||
</main>
|
||||
{% include "partials/footer.njk" %}
|
||||
21
src/_includes/layouts/home.njk
Normal file
21
src/_includes/layouts/home.njk
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
---
|
||||
layout: layouts/base.njk
|
||||
---
|
||||
|
||||
<main class="page markup">
|
||||
<h1>Blurb</h1>
|
||||
{{ content | safe }}
|
||||
</main>
|
||||
<aside class="markup">
|
||||
<h1>Status</h1>
|
||||
<p>Writing posts</p>
|
||||
</aside>
|
||||
<aside class="markup">
|
||||
<h1>Latest posts</h1>
|
||||
<ul>
|
||||
<li>Post 1</li>
|
||||
<li>Post 2</li>
|
||||
<li>Post 3</li>
|
||||
</ul>
|
||||
<p><a href="/rss.xml">Feed</a></p>
|
||||
</aside>
|
||||
|
|
@ -1,16 +0,0 @@
|
|||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
{% include "partials/meta.njk" %}
|
||||
<link rel="stylesheet" href="/css/landing.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav><a href="{{ meta.homepage }}" class="enter-link">Enter</a></nav>
|
||||
<main>
|
||||
<article class="markup">{{ content | safe }}</article>
|
||||
</main>
|
||||
<aside>
|
||||
<img src="/img/landing.png" alt="A sigil-esque drawing" title="A sigil-esque drawing">
|
||||
</aside>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
<footer class="footer-main"><p>
|
||||
<footer class="footer"><p>
|
||||
Made with <a href="https://www.11ty.dev/">11ty</a>.
|
||||
{% if page.date %}<i>
|
||||
Last updated on <time datetime="{{ page.date | formatDate }}">{{ page.date | formatDate }}</time>.
|
||||
|
|
|
|||
|
|
@ -1,4 +1,3 @@
|
|||
<header class="banner">
|
||||
<a class="logo" href="{{ meta.homepage }}">{{ meta.siteName }}</a>
|
||||
<nav class="navbar">{{ collections.all | eleventyNavigation | eleventyNavigationToHtml | safe }}</nav>
|
||||
</header>
|
||||
|
|
@ -1,5 +1,8 @@
|
|||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="{{ eleventy.generator }}">
|
||||
<title>{% if title %}{{ title }} | {% endif %}{{ meta.siteName }}</title>
|
||||
<link rel="stylesheet" href="/css/reset.css">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="{{ eleventy.generator }}">
|
||||
<title>{% if title %}{{ title }} | {% endif %}{{ meta.siteName }}</title>
|
||||
<link rel="stylesheet" href="/css/reset.css">
|
||||
<link rel="stylesheet" href="/css/global.css">
|
||||
</head>
|
||||
3
src/_includes/partials/navbar.njk
Normal file
3
src/_includes/partials/navbar.njk
Normal file
|
|
@ -0,0 +1,3 @@
|
|||
<nav class="navbar">
|
||||
{{ collections.all | eleventyNavigation | eleventyNavigationToHtml | safe }}
|
||||
</nav>
|
||||
|
|
@ -25,4 +25,4 @@ Hey. I'm Gil ([he/they](https://en.pronouns.page/@kalanggam)). I'm a software de
|
|||
|
||||
I first started building this site in mid 2023, and I've been gradually tweaking it since then.
|
||||
|
||||
This site is generated with [Eleventy](https://www.11ty.dev). Most (all) pages are originally written in Markdown and then built into plain HTML. I used [Sass](https://sass-lang.com/) to build the CSS. Source files are available at [ide.ogra.ph/gil/site](https://ide.ogra.ph/gil/site).
|
||||
This site is generated with [Eleventy](https://www.11ty.dev). Most (all) pages are originally written in Markdown and then parsed into plain HTML, using templates I created for Eleventy. I used [Sass](https://sass-lang.com/) to create some stylesheets. The source files for this website are available at [ide.ogra.ph/gil/site](https://ide.ogra.ph/gil/site).
|
||||
|
|
|
|||
|
|
@ -129,74 +129,70 @@ Full license texts:
|
|||
color-scheme: light dark;
|
||||
}
|
||||
|
||||
body {
|
||||
.site {
|
||||
display: grid;
|
||||
padding: 2em;
|
||||
}
|
||||
.site > .banner {
|
||||
text-align: center;
|
||||
}
|
||||
.site > .navbar {
|
||||
text-align: center;
|
||||
}
|
||||
.site > .navbar li {
|
||||
display: inline-flex;
|
||||
}
|
||||
@media (min-width: 769px) {
|
||||
body {
|
||||
.site {
|
||||
grid-template-columns: repeat(10, 1fr);
|
||||
grid-template-rows: 3;
|
||||
column-gap: 1em;
|
||||
height: 100%;
|
||||
padding: 2em 0;
|
||||
}
|
||||
body > header {
|
||||
.site > .banner {
|
||||
grid-row: 1;
|
||||
grid-column: 1/-1;
|
||||
}
|
||||
body > footer {
|
||||
grid-row: 3;
|
||||
.site > .navbar {
|
||||
grid-row: 2;
|
||||
grid-column: 1/-1;
|
||||
}
|
||||
.site > .footer {
|
||||
grid-row: 4;
|
||||
grid-column: 1/-1;
|
||||
margin: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1025px) {
|
||||
body {
|
||||
.site {
|
||||
grid-template-columns: repeat(12, 1fr);
|
||||
}
|
||||
}
|
||||
|
||||
main,
|
||||
article {
|
||||
.page {
|
||||
font-size: 1rem;
|
||||
margin: 0 1em;
|
||||
}
|
||||
@media (min-width: 769px) {
|
||||
main,
|
||||
article {
|
||||
.page {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
grid-row: 2;
|
||||
grid-row: 3;
|
||||
grid-column: 2/span 8;
|
||||
margin: 0;
|
||||
}
|
||||
main *,
|
||||
article * {
|
||||
.page * {
|
||||
grid-column: 2/span 6;
|
||||
}
|
||||
}
|
||||
@media (min-width: 1025px) {
|
||||
main,
|
||||
article {
|
||||
.page {
|
||||
grid-column: 2/span 10;
|
||||
}
|
||||
main *,
|
||||
article * {
|
||||
.page * {
|
||||
grid-column: 4/span 4;
|
||||
}
|
||||
}
|
||||
|
||||
header.banner {
|
||||
text-align: center;
|
||||
}
|
||||
header.banner nav {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
header.banner nav li {
|
||||
display: inline-flex;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=global.css.map */
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../scss/global.scss","../scss/_markup.scss","../scss/_vars.scss","../scss/_fonts.scss","../scss/modules/_include-media.scss"],"names":[],"mappings":"AAEA;ACAA;EACE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOE;;AAGF;AAAA;EAEE;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;;AAGF;AAAA;AAAA;EAGE;;AAGF;EACE;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;;ACjFJ;AAAA;AAAA;AAIA;AAGA;AAGA;AAGA;ACbA;AAAA;AAAA;AAIA;;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAWA;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;AHvCF;EAEI,WEPa;EFQb,aEPe;EFSjB;;;AAGF;EACE;EACA;;AIskBE;EJxkBJ;IAII;IACA;IACA,YEzBK;IF0BL;IACA;;EAEA;IACE;IACA;;EAGF;IACE;IACA;;;AIujBF;EJxkBJ;IAsBI;;;;AAIJ;AAAA;EAEE;;AI4iBE;EJ9iBJ;AAAA;IAKI;IACA;IACA;IACA;;EAEA;AAAA;IACE;;;AImiBF;EJ9iBJ;AAAA;IAgBI;;EAEA;AAAA;IACE;;;;AAKN;EACE;;AACA;EACE;;AAEA;EACE;;;AAKN;EACE;EACA","file":"global.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["../scss/global.scss","../scss/_markup.scss","../scss/_vars.scss","../scss/_fonts.scss","../scss/modules/_include-media.scss"],"names":[],"mappings":"AAEA;ACAA;EACE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOE;;AAGF;AAAA;EAEE;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;;AAGF;AAAA;AAAA;EAGE;;AAGF;EACE;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;;ACjFJ;AAAA;AAAA;AAIA;AAGA;AAGA;AAGA;ACbA;AAAA;AAAA;AAIA;;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAWA;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;AHvCF;EAEI,WEPa;EFQb,aEPe;EFSjB;;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;AAEA;EACE;;AI6jBF;EJxkBJ;IAgBI;IACA;IACA,YErCK;IFsCL;IACA;;EAEA;IACE;IACA;;EAGF;IACE;IACA;;EAGF;IACE;IACA;IACA;IACA;;;AIoiBF;EJxkBJ;IAyCI;;;;AAIJ;EACE;EACA;;AIyhBE;EJ3hBJ;IAKI;IACA;IACA;IACA;IACA;;EAEA;IACE;;;AI+gBF;EJ3hBJ;IAiBI;;EAEA;IACE","file":"global.css"}
|
||||
|
|
@ -1,194 +0,0 @@
|
|||
/* IMPORTS ================================================================= */
|
||||
.markup {
|
||||
word-wrap: break-word;
|
||||
line-height: 1.7;
|
||||
padding: 0;
|
||||
}
|
||||
.markup p,
|
||||
.markup blockquote,
|
||||
.markup ul,
|
||||
.markup ol,
|
||||
.markup dl,
|
||||
.markup table,
|
||||
.markup pre {
|
||||
margin: 1em 0;
|
||||
}
|
||||
.markup ul,
|
||||
.markup ol {
|
||||
list-style-type: revert;
|
||||
padding-left: 30px;
|
||||
}
|
||||
.markup h1 {
|
||||
font-size: 2.5em;
|
||||
}
|
||||
.markup h2 {
|
||||
font-size: 2em;
|
||||
}
|
||||
.markup h3 {
|
||||
font-size: 1.5em;
|
||||
}
|
||||
.markup h4 {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
.markup h5 {
|
||||
font-size: 1em;
|
||||
}
|
||||
.markup h6 {
|
||||
font-size: 1em;
|
||||
}
|
||||
.markup h1,
|
||||
.markup h2,
|
||||
.markup h3,
|
||||
.markup h4,
|
||||
.markup h5,
|
||||
.markup h6 {
|
||||
margin: 0.5em 0 0.25em 0;
|
||||
}
|
||||
.markup h1 + p,
|
||||
.markup h2 + p,
|
||||
.markup h3 + p {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
.markup img {
|
||||
max-width: 100%;
|
||||
}
|
||||
.markup code,
|
||||
.markup pre {
|
||||
background-color: #f8f8f8;
|
||||
border-radius: 3px;
|
||||
border: 1px solid #ddd;
|
||||
font-family: monospace;
|
||||
font-size: 12px;
|
||||
margin: 0 2px;
|
||||
padding: 0 5px;
|
||||
white-space: pre;
|
||||
}
|
||||
.markup pre code {
|
||||
border: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
white-space: pre;
|
||||
}
|
||||
|
||||
/* ============================================================================
|
||||
GLOBAL VARIABLES
|
||||
============================================================================ */
|
||||
/* Media breakpoints ------------------------------------------------------- */
|
||||
/* Spacing ----------------------------------------------------------------- */
|
||||
/* Typography -------------------------------------------------------------- */
|
||||
/* -- Font ----------------------------------------------------------------- */
|
||||
/* ============================================================================
|
||||
FONT SOURCES
|
||||
============================================================================ */
|
||||
/* Linux Libertine ------------------------------------------------------------
|
||||
|
||||
Licensed under GPL and OFL 1.1
|
||||
|
||||
Full license texts:
|
||||
- https://gils.nexus/font/GPL.txt
|
||||
- https://gils.nexus/font/OFL-1.1.txt
|
||||
|
||||
---------------------------------------------------------------------------- */
|
||||
@font-face {
|
||||
font-family: "Linux Libertine";
|
||||
font-style: normal;
|
||||
src: local("Linux Libertine"), url("../font/LinLibertine_Rah.ttf");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Linux Libertine";
|
||||
font-style: normal;
|
||||
font-weight: 600;
|
||||
src: local("Linux Libertine Semibold"), url("../font/LinLibertine_RZah.ttf");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Linux Libertine";
|
||||
font-style: normal;
|
||||
font-weight: 700;
|
||||
src: local("Linux Libertine Bold"), url("../font/LinLibertine_RBah.ttf");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Linux Libertine";
|
||||
font-style: italic;
|
||||
src: local("Linux Libertine Italic"), url("../font/LinLibertine_RIah.ttf");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Linux Libertine";
|
||||
font-style: italic;
|
||||
font-weight: 600;
|
||||
src: local("Linux Libertine Semibold Italic"), url("../font/LinLibertine_RZIah.ttf");
|
||||
}
|
||||
@font-face {
|
||||
font-family: "Linux Libertine";
|
||||
font-style: italic;
|
||||
font-weight: 700;
|
||||
src: local("Linux Libertine Bold Italic"), url("../font/LinLibertine_RBIah.ttf");
|
||||
}
|
||||
html {
|
||||
font-size: 12pt;
|
||||
font-family: "Linux Libertine", "Times New Roman", Times, serif;
|
||||
}
|
||||
|
||||
body {
|
||||
display: grid;
|
||||
padding: 2em;
|
||||
}
|
||||
@media (min-width: 769px) {
|
||||
body {
|
||||
grid-template-columns: 2fr 3fr 2fr;
|
||||
gap: 1em;
|
||||
height: 100%;
|
||||
padding: 2em 0;
|
||||
}
|
||||
}
|
||||
|
||||
nav {
|
||||
grid-row: 1;
|
||||
grid-column: 1;
|
||||
justify-self: right;
|
||||
align-self: end;
|
||||
font-size: 1.5em;
|
||||
font-weight: bold;
|
||||
}
|
||||
@media (min-width: 769px) {
|
||||
nav {
|
||||
grid-column: 2;
|
||||
}
|
||||
}
|
||||
nav a:hover {
|
||||
font-style: italic;
|
||||
}
|
||||
nav a::after {
|
||||
content: " >>";
|
||||
font-style: normal;
|
||||
}
|
||||
|
||||
@media (min-width: 769px) {
|
||||
main {
|
||||
grid-row: 2;
|
||||
grid-column: 2;
|
||||
justify-self: center;
|
||||
}
|
||||
}
|
||||
main article {
|
||||
padding: 0;
|
||||
font-size: 1rem;
|
||||
}
|
||||
main article h1 {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
aside {
|
||||
grid-row: 1;
|
||||
grid-column: 1;
|
||||
max-width: 192px;
|
||||
}
|
||||
@media (min-width: 769px) {
|
||||
aside {
|
||||
grid-column: 2;
|
||||
}
|
||||
}
|
||||
aside img {
|
||||
image-rendering: pixelated;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=landing.css.map */
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../scss/landing.scss","../scss/_markup.scss","../scss/_vars.scss","../scss/_fonts.scss","../scss/modules/_include-media.scss"],"names":[],"mappings":"AAEA;ACAA;EACE;EACA;EACA;;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;EAOE;;AAGF;AAAA;EAEE;EACA;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;EAME;;AAGF;AAAA;AAAA;EAGE;;AAGF;EACE;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;;ACjFJ;AAAA;AAAA;AAIA;AAGA;AAGA;AAGA;ACbA;AAAA;AAAA;AAIA;;AAAA;;AAAA;AAAA;AAAA;;AAAA;AAWA;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;;AAKF;EACE;EACA;EACA;EACA;;AH/CF;EAEI,WECa;EFAb,aECe;;;AFGnB;EACE;EACA;;AI+kBE;EJjlBJ;IAII;IACA,KEfK;IFgBL;IACA;;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AIgkBE;EJtkBJ;IAQI;;;AAIA;EACE;;AAGF;EACE;EACA;;;AIojBF;EJ/iBJ;IAEI;IACA;IACA;;;AAGF;EACE;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;EACA;;AI2hBE;EJ9hBJ;IAKI;;;AAGF;EACE","file":"landing.css"}
|
||||
19
src/home.md
19
src/home.md
|
|
@ -1,19 +0,0 @@
|
|||
---
|
||||
date: Last Modified
|
||||
eleventyNavigation:
|
||||
key: Home
|
||||
---
|
||||
|
||||
# Home
|
||||
|
||||
## Status
|
||||
|
||||
Latest status here...
|
||||
|
||||
## Blog
|
||||
|
||||
- Post 1
|
||||
- Post 2
|
||||
- Post 3
|
||||
|
||||
[feed](/rss) (not actual yet)
|
||||
19
src/index.md
19
src/index.md
|
|
@ -1,21 +1,8 @@
|
|||
---
|
||||
layout: layouts/landing.njk
|
||||
layout: layouts/home.njk
|
||||
date: Last Modified
|
||||
eleventyNavigation:
|
||||
key: Landing
|
||||
order: 200
|
||||
key: Home
|
||||
---
|
||||
|
||||
# Gil's Nexus
|
||||
|
||||
Hey. I'm Gil ([he/they](https://en.pronouns.page/@kalanggam)). I'm a software developer, game developer, and writer based in Texas. I'm one of the sysadmins for the [ogra.ph collective](https://ogra.ph/), an online collective of folk building an inclusive community centered around digital rights and liberation.
|
||||
|
||||
This landing page hosts links for where I can be found online. Use the button at the top to view my full website.
|
||||
|
||||
## Links
|
||||
|
||||
- Microblog: <a href="https://hol.ogra.ph/@gil" rel="me">@gil@hol.ogra.ph</a>
|
||||
- Code: [ide.ogra.ph/gil](https://ide.ogra.ph/gil)
|
||||
- Matrix: [@kalanggam:matrix.org](https://matrix.to/#/@kalanggam:matrix.org)
|
||||
- Photos: [pixelfed.social/kalanggam](https://pixelfed.social/kalanggam)
|
||||
- Reading: [bookwyrm.social/user/kalanggam](https://bookwyrm.social/user/kalanggam)
|
||||
Custom blurb
|
||||
|
|
|
|||
|
|
@ -7,9 +7,11 @@ eleventyNavigation:
|
|||
order: 2
|
||||
---
|
||||
|
||||
# Poetry
|
||||
|
||||
<ul>
|
||||
{%- for poem in collections.poems reversed -%}
|
||||
{% if forloop.first == true %}<ul>{% endif %}
|
||||
<li><a href="{{ poem.url }}">{{ poem.data.title }}</a>
|
||||
— <i>updated <time datetime="{{ poem.date | formatDate }}">{{ poem.date | formatDate }}</time></i></li>
|
||||
{% if forloop.last == true %}</ul>{% endif %}
|
||||
{%- endfor -%}
|
||||
</ul>
|
||||
|
|
|
|||
|
|
@ -26,9 +26,21 @@
|
|||
color-scheme: light dark;
|
||||
}
|
||||
|
||||
body {
|
||||
.site {
|
||||
display: grid;
|
||||
padding: $gutter * 2;
|
||||
|
||||
& > .banner {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
& > .navbar {
|
||||
text-align: center;
|
||||
|
||||
li {
|
||||
display: inline-flex;
|
||||
}
|
||||
}
|
||||
|
||||
@include media(">md") {
|
||||
grid-template-columns: repeat(10, 1fr);
|
||||
grid-template-rows: 3;
|
||||
|
|
@ -36,15 +48,22 @@ body {
|
|||
height: 100%;
|
||||
padding: ($gutter * 2) 0;
|
||||
|
||||
& > header {
|
||||
& > .banner {
|
||||
grid-row: 1;
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
& > footer {
|
||||
grid-row: 3;
|
||||
& > .navbar {
|
||||
grid-row: 2;
|
||||
grid-column: 1 / -1;
|
||||
}
|
||||
|
||||
& > .footer {
|
||||
grid-row: 4;
|
||||
grid-column: 1 / -1;
|
||||
margin: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
|
||||
@include media(">lg") {
|
||||
|
|
@ -52,15 +71,16 @@ body {
|
|||
}
|
||||
}
|
||||
|
||||
main,
|
||||
article {
|
||||
.page {
|
||||
font-size: 1rem;
|
||||
margin: 0 $gutter;
|
||||
|
||||
@include media(">md") {
|
||||
display: grid;
|
||||
grid-template-columns: subgrid;
|
||||
grid-row: 2;
|
||||
grid-row: 3;
|
||||
grid-column: 2 / span 8;
|
||||
margin: 0;
|
||||
|
||||
* {
|
||||
grid-column: 2 / span 6;
|
||||
|
|
@ -75,19 +95,3 @@ article {
|
|||
}
|
||||
}
|
||||
}
|
||||
|
||||
header.banner {
|
||||
text-align: center;
|
||||
nav {
|
||||
margin-bottom: 1em;
|
||||
|
||||
li {
|
||||
display: inline-flex;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
footer {
|
||||
margin: 1em;
|
||||
text-align: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,82 +0,0 @@
|
|||
// landing.scss
|
||||
|
||||
/* IMPORTS ================================================================= */
|
||||
@use "sass:math";
|
||||
|
||||
@use "modules/include-media" as *;
|
||||
|
||||
@use "markup" as *;
|
||||
@use "vars" as *;
|
||||
@use "colors";
|
||||
@use "fonts";
|
||||
|
||||
html {
|
||||
font: {
|
||||
size: $font-base-size;
|
||||
family: $font-stack-serif;
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
display: grid;
|
||||
padding: $gutter * 2;
|
||||
@include media(">md") {
|
||||
grid-template-columns: 2fr 3fr 2fr;
|
||||
gap: $gutter;
|
||||
height: 100%;
|
||||
padding: ($gutter * 2) 0;
|
||||
}
|
||||
}
|
||||
|
||||
nav {
|
||||
grid-row: 1;
|
||||
grid-column: 1;
|
||||
justify-self: right;
|
||||
align-self: end;
|
||||
font-size: 1.5em;
|
||||
font-weight: bold;
|
||||
@include media(">md") {
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
a {
|
||||
&:hover {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
&::after {
|
||||
content: " >>";
|
||||
font-style: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
@include media(">md") {
|
||||
grid-row: 2;
|
||||
grid-column: 2;
|
||||
justify-self: center;
|
||||
}
|
||||
|
||||
article {
|
||||
padding: 0;
|
||||
font-size: 1rem;
|
||||
|
||||
h1 {
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
aside {
|
||||
grid-row: 1;
|
||||
grid-column: 1;
|
||||
max-width: 192px;
|
||||
@include media(">md") {
|
||||
grid-column: 2;
|
||||
}
|
||||
|
||||
img {
|
||||
image-rendering: pixelated;
|
||||
}
|
||||
}
|
||||
Loading…
Reference in a new issue