Fix column size and start with something kind of like a vertical rhythm

This commit is contained in:
heyarne 2021-07-30 12:19:45 +02:00
commit 3c1d0625db
2 changed files with 18 additions and 7 deletions

View file

@ -2,7 +2,7 @@ $font-path: 'ibm-plex';
// the base size of the header svg is 500 * 500, strokes will need to be // the base size of the header svg is 500 * 500, strokes will need to be
// adjusted for exact pixel sizes // adjusted for exact pixel sizes
$logo-size: 208; $logo-size: 216;
$factor: 1 / ($logo-size / 500); $factor: 1 / ($logo-size / 500);
@import 'ibm-plex/css/ibm-plex.scss'; @import 'ibm-plex/css/ibm-plex.scss';
@ -29,12 +29,14 @@ h1, h2, h3, h4, h5, h6 {
} }
h1 { h1 {
font-size: 32px; font-size: 24px;
padding: 0 0 24px; line-height: 24px;
padding: 0 0 32px;
} }
h2 { h2 {
font-size: 24px; font-size: 20px;
line-height: 16px;
padding: 0 0 16px; padding: 0 0 16px;
} }
@ -45,6 +47,7 @@ p {
.ten-print { .ten-print {
width: $logo-size * 1px; width: $logo-size * 1px;
height: $logo-size * 1px; height: $logo-size * 1px;
display: block;
path { path {
stroke: #ff005f; stroke: #ff005f;
@ -60,7 +63,7 @@ main {
margin: 48px auto 48px 48px; margin: 48px auto 48px 48px;
grid-gap: 32px; grid-gap: 32px;
// grid-auto-rows: 1fr; // grid-auto-rows: 1fr;
// grid-template-columns: repeat(4, 1fr); grid-template-columns: repeat(4, 1fr);
grid-template-areas: grid-template-areas:
"header header header header" "header header header header"
"nav content content content"; "nav content content content";
@ -104,4 +107,6 @@ article {
margin: 0 0 32px; margin: 0 0 32px;
} }
} }
article { display: none; }
} }

View file

@ -1,6 +1,12 @@
title: Let There Be Light title: Let There Be Light
some: frontmatter some: frontmatter
--- ---
# Hello World # Let There Be Light
This is an example post. Hi! My name is Arne and for the first time in over ten years I figured that it is a good idea to put content on my own personal website. I want this to be a home for my interests and projects that I started. Maybe talking about them more will help me get some of them finished.
## Guiding Principles
To make it clear for myself that this is not just *something I do on the web*, I'd like to establish guiding principles on what kind of content should be published here. Feel free to throw rocks at me if I don't follow these principles.
This paragraph only exists for layouting purposes.