Very roughly implement a 3 column grid on the <main> element
This commit is contained in:
parent
0504ba54e3
commit
4a647e854f
5 changed files with 28 additions and 5 deletions
15
assets/styles/page.css
Normal file
15
assets/styles/page.css
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
/* Eryn Wells <eryn@erynwells.me> */
|
||||||
|
|
||||||
|
@layer template {
|
||||||
|
|
||||||
|
main {
|
||||||
|
display: grid;
|
||||||
|
gap: var(--body-item-spacing) 0;
|
||||||
|
grid-template-columns: var(--body-item-spacing) var(--content-width) var(--body-item-spacing);
|
||||||
|
margin: var(--body-item-spacing) auto 0 auto;
|
||||||
|
}
|
||||||
|
main > * {
|
||||||
|
grid-column: 2 / 3;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
|
@ -94,6 +94,7 @@
|
||||||
|
|
||||||
.photos.page > figure.carousel {
|
.photos.page > figure.carousel {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
grid-column: 1 / 4;
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
|
@ -384,16 +384,11 @@ img.circular {
|
||||||
main {
|
main {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
max-width: calc(var(--content-width) + 2 * var(--body-item-spacing));
|
max-width: calc(var(--content-width) + 2 * var(--body-item-spacing));
|
||||||
margin: var(--body-item-spacing) auto;
|
|
||||||
padding-inline: var(--body-item-spacing);
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
main > :first-child,
|
|
||||||
main > article > :first-child { margin-block-start: 0; }
|
main > article > :first-child { margin-block-start: 0; }
|
||||||
main > :not(:last-child),
|
|
||||||
main > article > :not(:last-child) { margin-block-end: var(--body-item-spacing); }
|
main > article > :not(:last-child) { margin-block-end: var(--body-item-spacing); }
|
||||||
main > :last-child,
|
|
||||||
main > article > :last-child { margin-block-end: 0; }
|
main > article > :last-child { margin-block-end: 0; }
|
||||||
|
|
||||||
nav.bulleted > li:first-child::before {
|
nav.bulleted > li:first-child::before {
|
||||||
|
|
9
layouts/partials/resources/type_css.html
Normal file
9
layouts/partials/resources/type_css.html
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
{{ $typeCSS := dict }}
|
||||||
|
{{ $stylesheet := "" }}
|
||||||
|
{{ if not .IsHome }}
|
||||||
|
{{ $stylesheet = printf "styles/%s.css" .Kind }}
|
||||||
|
{{ with resources.Get $stylesheet }}
|
||||||
|
{{ $typeCSS = . | fingerprint "md5" }}
|
||||||
|
{{ end }}
|
||||||
|
{{ end }}
|
||||||
|
{{ return $typeCSS }}
|
|
@ -1,3 +1,6 @@
|
||||||
|
{{ with resources.Get "styles/page.css" | fingerprint "md5" }}
|
||||||
|
<link rel="stylesheet" href="{{ .RelPermalink }}">
|
||||||
|
{{ end }}
|
||||||
{{- range .Resources.Match "*.css" -}}
|
{{- range .Resources.Match "*.css" -}}
|
||||||
{{- $stylesheet := . | fingerprint "md5" }}
|
{{- $stylesheet := . | fingerprint "md5" }}
|
||||||
<link rel="stylesheet" href="{{ $stylesheet.RelPermalink }}">
|
<link rel="stylesheet" href="{{ $stylesheet.RelPermalink }}">
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue