gil/site
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Update layouts again

Browse source
This commit is contained in:
gil 2024-06-20 00:45:23 -05:00
parent 8e4011b02c
commit 115a00b8fc
20 changed files with 123 additions and 116 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
src/_data/meta.js
View file

@ -2,4 +2,5 @@ module.exports = {
siteName: "Gil's Nexus", siteName: "Gil's Nexus",
siteDescription: "", siteDescription: "",
authorName: "Gil", authorName: "Gil",
homepage: "/home/",
}; };

6
src/_includes/layouts/base.njk
View file

@ -1,11 +1,7 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> {% include "partials/meta.njk" %}
<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"> <link rel="stylesheet" href="/css/global.css">
</head> </head>
<body> <body>

3
src/_includes/layouts/default.njk
View file

@ -3,9 +3,6 @@ layout: layouts/base.njk
--- ---
{% include "partials/header.njk" %} {% include "partials/header.njk" %}
<main class="page markup"> <main class="page markup">
<header>
<h1>{{ title }}</h1>
</header>
{{ content | safe }} {{ content | safe }}
</main> </main>
{% include "partials/footer.njk" %} {% include "partials/footer.njk" %}

8
src/_includes/layouts/landing.njk
View file

@ -1,15 +1,11 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> {% include "partials/meta.njk" %}
<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/landing.css"> <link rel="stylesheet" href="/css/landing.css">
</head> </head>
<body> <body>
<nav><a href="{{ entry }}" class="enter-link">Enter</a></nav> <nav><a href="{{ meta.homepage }}" class="enter-link">Enter</a></nav>
<main> <main>
<article class="markup">{{ content | safe }}</article> <article class="markup">{{ content | safe }}</article>
</main> </main>

2
src/_includes/partials/header.njk
View file

@ -1,4 +1,4 @@
<header class="banner"> <header class="banner">
<a class="logo" href="/main/">{{ meta.siteName }}</a> <a class="logo" href="{{ meta.homepage }}">{{ meta.siteName }}</a>
<nav class="navbar">{{ collections.all | eleventyNavigation | eleventyNavigationToHtml | safe }}</nav> <nav class="navbar">{{ collections.all | eleventyNavigation | eleventyNavigationToHtml | safe }}</nav>
</header> </header>

5
src/_includes/partials/meta.njk Normal file
View file

@ -0,0 +1,5 @@
<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">

4
src/about.md
View file

@ -1,11 +1,11 @@
--- ---
title: About
date: Last Modified date: Last Modified
eleventyNavigation: eleventyNavigation:
key: About key: About
order: 1
--- ---
<img class="gba-portrait" src="/img/gba-gil.png" alt="Me, a brown-haired, brown-eyed man with round glasses, smiling. The picture is filtered to mimic the Game Boy Camera and create a retro vibe." /> # About
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. 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.

58
src/css/global.css
View file

@ -2,7 +2,7 @@
.markup { .markup {
word-wrap: break-word; word-wrap: break-word;
line-height: 1.7; line-height: 1.7;
padding: 0 1.5em; padding: 0;
} }
.markup p, .markup p,
.markup blockquote, .markup blockquote,
@ -15,7 +15,7 @@
} }
.markup ul, .markup ul,
.markup ol { .markup ol {
all: revert; list-style-type: revert;
padding-left: 30px; padding-left: 30px;
} }
.markup h1 { .markup h1 {
@ -123,9 +123,10 @@ Full license texts:
font-weight: 700; font-weight: 700;
src: local("Linux Libertine Bold Italic"), url("../font/LinLibertine_RBIah.ttf"); src: local("Linux Libertine Bold Italic"), url("../font/LinLibertine_RBIah.ttf");
} }
html { :root {
font-size: 12pt; font-size: 12pt;
font-family: "Linux Libertine", "Times New Roman", Times, serif; font-family: "Linux Libertine", "Times New Roman", Times, serif;
color-scheme: light dark;
} }
body { body {
@ -134,17 +135,24 @@ body {
} }
@media (min-width: 769px) { @media (min-width: 769px) {
body { body {
grid-template-columns: 2fr 3fr 2fr; grid-template-columns: repeat(10, 1fr);
grid-template-rows: 3;
column-gap: 1em;
height: 100%; height: 100%;
padding: 2em 0; padding: 2em 0;
} }
body > header { body > header {
grid-row: 1; grid-row: 1;
grid-column: 2; grid-column: 1/-1;
} }
body > footer { body > footer {
grid-row: 3; grid-row: 3;
grid-column: 2; grid-column: 1/-1;
}
}
@media (min-width: 1025px) {
body {
grid-template-columns: repeat(12, 1fr);
} }
} }
@ -155,39 +163,39 @@ article {
@media (min-width: 769px) { @media (min-width: 769px) {
main, main,
article { article {
display: grid;
grid-template-columns: subgrid;
grid-row: 2; grid-row: 2;
grid-column: 2; grid-column: 2/span 8;
}
main *,
article * {
grid-column: 2/span 6;
} }
} }
main .gba-portrait, @media (min-width: 1025px) {
article .gba-portrait { main,
margin: auto; article {
margin-bottom: 1em; grid-column: 2/span 10;
width: 100%; }
height: auto; main *,
max-width: 192px; article * {
} grid-column: 4/span 4;
@media (min-width: 769px) {
main .gba-portrait,
article .gba-portrait {
float: right;
margin: 1em;
} }
} }
header.banner { header.banner {
text-align: center; text-align: center;
} }
header.banner nav {
nav.navbar {
margin-bottom: 1em; margin-bottom: 1em;
} }
nav.navbar li { header.banner nav li {
display: inline-flex; display: inline-flex;
} }
footer.footer-main { footer {
margin: 2em 1em 1em 1em; margin: 1em;
text-align: center; text-align: center;
} }

2
src/css/global.css.map
View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../scss/global.scss","../scss/_classes.scss","../scss/_vars.scss","../scss/_fonts.scss","../scss/modules/_include-media.scss"],"names":[],"mappings":"AAEA;ACFA;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;;;AC/EJ;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;;;AFWnB;EACE;EACA;;AIokBE;EJtkBJ;IAII;IACA;IACA;;EAEA;IACE;IACA;;EAGF;IACE;IACA;;;;AAKN;AAAA;EAEE;;AIgjBE;EJljBJ;AAAA;IAII;IACA;;;AAGF;AAAA;EACE;EACA;EACA;EACA;EACA;;AIqiBA;EJ1iBF;AAAA;IAOI;IACA;;;;AAKN;EACE;;;AAGF;EACE;;AAEA;EACE;;;AAIJ;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;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"}

4
src/css/landing.css
View file

@ -2,7 +2,7 @@
.markup { .markup {
word-wrap: break-word; word-wrap: break-word;
line-height: 1.7; line-height: 1.7;
padding: 0 1.5em; padding: 0;
} }
.markup p, .markup p,
.markup blockquote, .markup blockquote,
@ -15,7 +15,7 @@
} }
.markup ul, .markup ul,
.markup ol { .markup ol {
all: revert; list-style-type: revert;
padding-left: 30px; padding-left: 30px;
} }
.markup h1 { .markup h1 {

2
src/css/landing.css.map
View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../scss/landing.scss","../scss/_classes.scss","../scss/_vars.scss","../scss/_fonts.scss","../scss/modules/_include-media.scss"],"names":[],"mappings":"AAEA;ACFA;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;;;AC/EJ;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;;AHtCF;EAEI,WERa;EFSb,aERe;;;AFYnB;EACE;EACA;;AImkBE;EJrkBJ;IAII;IACA,KExBK;IFyBL;IACA;;;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AIojBE;EJ1jBJ;IAQI;;;AAIA;EACE;;AAGF;EACE;EACA;;;AIwiBF;EJniBJ;IAEI;IACA;IACA;;;AAGF;EACE;EACA;;AAEA;EACE;;;AAKN;EACE;EACA;EACA;;AI+gBE;EJlhBJ;IAKI;;;AAGF;EACE","file":"landing.css"} {"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 Normal file
View file

@ -0,0 +1,19 @@
---
date: Last Modified
eleventyNavigation:
key: Home
---
# Home
## Status
Latest status here...
## Blog
- Post 1
- Post 2
- Post 3
[feed](/rss) (not actual yet)

1
src/index.md
View file

@ -1,7 +1,6 @@
--- ---
layout: layouts/landing.njk layout: layouts/landing.njk
date: Last Modified date: Last Modified
entry: /main/
eleventyNavigation: eleventyNavigation:
key: Landing key: Landing
order: 200 order: 200

17
src/main.md
View file

@ -1,17 +0,0 @@
---
date: Last Modified
eleventyNavigation:
key: Main
---
<img class="gba-portrait" src="/img/gba-gil.png" alt="Me, a brown-haired, brown-eyed man with round glasses, smiling. The picture is filtered to mimic the Game Boy Camera and create a retro vibe." />
# Home
Another test
## Support me
Let's give this one more go.
<a href="https://www.buymeacoffee.com/gilcaley" target="_blank"><img src="https://cdn.buymeacoffee.com/buttons/v2/default-violet.png" alt="Buy Me A Coffee" style="height: 60px !important;width: 217px !important; display: inline;"></a>

13
src/ograph.md
View file

@ -1,13 +0,0 @@
---
title: Ograph Collective
date: Last Modified
eleventyNavigation:
key: Ograph
order: 1
---
The Ograph Collective aims to build an online community focused on digital liberation, through the use of free, libre, and open-source software. I co-manage the Ograph Collective with [Kersed](https://kersed.net/), and together we operate three projects: a federated microblogging platform, a Git repository service, and a Keyoxide instance; however, we plan to offer other services in the future.
- Microblog on [hol.ogra.ph](https://hol.ogra.ph/@gil)
- Git projects hosted on [ide.ogra.ph](https://ide.ogra.ph/gil)
- Keyoxide profile on [aut.ogra.ph](https://aut.ogra.ph/aspe:keyoxide.org:7IW4QEA4DIBL3YORQH3HTEGDKM)

11
src/scss/_colors.scss
View file

@ -1 +1,12 @@
// _colors.scss // _colors.scss
// Palette
// Red, green, white, black, etc.
// Semantic/admonition/callout etc.
// Primary, secondary, tertiary, emphasis info, warning, shadow, quote,
// success, danger, etc...
// $text-normal: black;
// $text-primary: blue;
// $text-secondary: purple;

6
src/scss/_classes.scss → src/scss/_markup.scss
View file

@ -1,7 +1,9 @@
@use "modules/include-media" as *;
.markup { .markup {
word-wrap: break-word; word-wrap: break-word;
line-height: 1.7; line-height: 1.7;
padding: 0 1.5em; padding: 0;
p, p,
blockquote, blockquote,
@ -15,7 +17,7 @@
ul, ul,
ol { ol {
all: revert; list-style-type: revert;
padding-left: 30px; padding-left: 30px;
} }

49
src/scss/global.scss
View file

@ -14,71 +14,80 @@
) )
); );
@use "classes" as *; @use "markup";
@use "vars" as *; @use "vars" as *;
@use "fonts"; @use "fonts";
html { :root {
font: { font: {
size: $font-base-size; size: $font-base-size;
family: $font-stack-serif; family: $font-stack-serif;
} }
color-scheme: light dark;
} }
body { body {
display: grid; display: grid;
padding: $gutter * 2; padding: $gutter * 2;
@include media(">md") { @include media(">md") {
grid-template-columns: 2fr 3fr 2fr; grid-template-columns: repeat(10, 1fr);
grid-template-rows: 3;
column-gap: $gutter;
height: 100%; height: 100%;
padding: ($gutter * 2) 0; padding: ($gutter * 2) 0;
& > header { & > header {
grid-row: 1; grid-row: 1;
grid-column: 2; grid-column: 1 / -1;
} }
& > footer { & > footer {
grid-row: 3; grid-row: 3;
grid-column: 2; grid-column: 1 / -1;
} }
} }
@include media(">lg") {
grid-template-columns: repeat(12, 1fr);
}
} }
main, main,
article { article {
font-size: 1rem; font-size: 1rem;
@include media(">md") { @include media(">md") {
display: grid;
grid-template-columns: subgrid;
grid-row: 2; grid-row: 2;
grid-column: 2; grid-column: 2 / span 8;
* {
grid-column: 2 / span 6;
}
} }
.gba-portrait { @include media(">lg") {
margin: auto; grid-column: 2 / span 10;
margin-bottom: 1em;
width: 100%; * {
height: auto; grid-column: 4 / span 4;
max-width: 192px;
@include media(">md") {
float: right;
margin: 1em;
} }
} }
} }
header.banner { header.banner {
text-align: center; text-align: center;
} nav {
nav.navbar {
margin-bottom: 1em; margin-bottom: 1em;
li { li {
display: inline-flex; display: inline-flex;
} }
}
} }
footer.footer-main { footer {
margin: 2em 1em 1em 1em; margin: 1em;
text-align: center; text-align: center;
} }

13
src/scss/landing.scss
View file

@ -3,18 +3,9 @@
/* IMPORTS ================================================================= */ /* IMPORTS ================================================================= */
@use "sass:math"; @use "sass:math";
@use "modules/include-media" as * with ( @use "modules/include-media" as *;
$breakpoints: (
xs: 0,
sm: 640px,
md: 768px,
lg: 1024px,
xl: 1280px,
2xl: 1536px,
)
);
@use "classes" as *; @use "markup" as *;
@use "vars" as *; @use "vars" as *;
@use "colors"; @use "colors";
@use "fonts"; @use "fonts";

9
src/scss/modules/_include-media.scss
View file

@ -34,9 +34,12 @@
/// $breakpoints: ('phone': 320px); /// $breakpoints: ('phone': 320px);
/// ///
$breakpoints: ( $breakpoints: (
'phone': 320px, xs: 0,
'tablet': 768px, sm: 640px,
'desktop': 1024px, md: 768px,
lg: 1024px,
xl: 1280px,
2xl: 1536px,
) !default; ) !default;
/// ///