minor style stuff

This commit is contained in:
Alexander 2025-06-09 15:39:31 -04:00
parent c175437b55
commit 7ccb524efa
13 changed files with 134 additions and 82 deletions

View file

@ -1,24 +1,55 @@
@font-face {
/* @font-face {
font-family: 'Heading';
src: url('../assets/fonts/LiterataTT/LiterataTT-DisplayRegular.woff2') format('woff2');
src: url('../assets/fonts/Besley/Besley-Book.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Heading';
src: url('../assets/fonts/LiterataTT/LiterataTT-DisplayItalic.woff2') format('woff2');
src: url('../assets/fonts/Besley/Besley-BookItalic.ttf') format('truetype');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'Heading';
src: url('../assets/fonts/LiterataTT/LiterataTT-DisplayBold.woff2') format('woff2');
src: url('../assets/fonts/Besley/Besley-Fatface.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Heading';
src: url('../assets/fonts/LiterataTT/LiterataTT-DisplayBoldItalic.woff2') format('woff2');
src: url('../assets/fonts/Besley/Besley-FatfaceItalic.ttf') format('truetype');
font-weight: bold;
font-style: italic;
} */
@font-face {
font-family: 'Heading';
src: url('../assets/fonts/LiterataTT/LiterataTT-SubheadRegular.woff2') format('woff2');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Heading';
src: url('../assets/fonts/LiterataTT/LiterataTT-SubheadItalic.woff2') format('woff2');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'Heading';
src: url('../assets/fonts/LiterataTT/LiterataTT-SubheadBold.woff2') format('woff2');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Heading';
src: url('../assets/fonts/LiterataTT/LiterataTT-SubheadBoldItalic.woff2') format('woff2');
font-weight: bold;
font-style: italic;
}
@ -29,18 +60,21 @@
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Subheading';
src: url('../assets/fonts/LiterataTT/LiterataTT-SubheadItalic.woff2') format('woff2');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'Subheading';
src: url('../assets/fonts/LiterataTT/LiterataTT-SubheadBold.woff2') format('woff2');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Subheading';
src: url('../assets/fonts/LiterataTT/LiterataTT-SubheadBoldItalic.woff2') format('woff2');
@ -54,18 +88,21 @@
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'BodySerif';
src: url('../assets/fonts/STIXTwoText/STIXTwoText_Italic.otf') format('opentype');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'BodySerif';
src: url('../assets/fonts/STIXTwoText/STIXTwoText_Bold.otf') format('opentype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'BodySerif';
src: url('../assets/fonts/STIXTwoText/STIXTwoText_BoldItalic.otf') format('opentype');
@ -79,18 +116,21 @@
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'BodySans';
src: url('../assets/fonts/Source_Sans_3/static/SourceSans3-Italic.ttf') format('truetype');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'BodySans';
src: url('../assets/fonts/Source_Sans_3/static/SourceSans3-Bold.ttf') format('truetype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'BodySans';
src: url('../assets/fonts/Source_Sans_3/static/SourceSans3-BoldItalic.ttf') format('truetype');
@ -104,21 +144,82 @@
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'Mono';
src: url('../assets/fonts/CommitMonoUnfancyDevNV143/CommitMonoUnfancyDevN-350-Italic.otf') format('opentype');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'Mono';
src: url('../assets/fonts/CommitMonoUnfancyDevNV143/CommitMonoUnfancyDevN-700-Regular.otf') format('opentype');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Mono';
src: url('../assets/fonts/CommitMonoUnfancyDevNV143/CommitMonoUnfancyDevN-700-Italic.otf') format('opentype');
font-weight: bold;
font-style: italic;
}
:root {
--base-font-size: 1.1rem;
}
body {
font-size: var(--base-font-size);
}
.font-body-serif body {
font-family: "BodySerif", sans-serif;
}
.font-body-sans body {
font-family: "BodySans", serif;
}
h1 {
font-family: "Heading";
font-style: italic;
}
h2,
h3,
h4,
h5,
h6 {
font-family: "Subheading";
}
h1 {
font-size: calc(2.4 * var(--base-font-size));
}
h2 {
font-size: calc(1.8 * var(--base-font-size));
}
h3 {
font-size: calc(1.6 * var(--base-font-size));
}
h4 {
font-size: calc(1.4 * var(--base-font-size));
}
h5 {
font-size: calc(1.2 * var(--base-font-size));
}
h6 {
font-size: calc(1.0 * var(--base-font-size))
}
code {
font-family: "Mono";
font-size: calc(0.9 * var(--base-font-size));
}

View file

@ -1,68 +1,5 @@
@import url(fonts.css);
:root {
--base-font-size: 1.1rem;
}
@import url(looks.css);
body {
font-size: var(--base-font-size);
}
.font-body-serif body {
font-family: "BodySerif", sans-serif;
}
.font-body-sans body {
font-family: "BodySans", serif;
}
h1 {
font-family: "Subheading";
}
h2,
h3,
h4,
h5,
h6 {
font-family: "Subheading";
}
h1 {
font-size: calc(2.1 * var(--base-font-size));
}
h2 {
font-size: calc(1.8 * var(--base-font-size));
}
h3 {
font-size: calc(1.6 * var(--base-font-size));
}
h4 {
font-size: calc(1.4 * var(--base-font-size));
}
h5 {
font-size: calc(1.2 * var(--base-font-size));
}
h6 {
font-size: calc(1.0 * var(--base-font-size))
}
code {
font-family: "Mono";
font-size: calc(0.9 * var(--base-font-size));
}
code:not(pre code) {
font-weight: bold;
}
.container {
max-width: 800px;
margin-left: auto;
margin-right: auto;
}
@import url(layout.css);

5
site/css/layout.css Normal file
View file

@ -0,0 +1,5 @@
.container {
max-width: 900px;
margin-left: auto;
margin-right: auto;
}

21
site/css/looks.css Normal file
View file

@ -0,0 +1,21 @@
code:not(pre code) {
font-weight: bold;
}
pre {
background-color: white;
color: black;
overflow-x: auto;
border-style: solid;
border-radius: 3px;
border-width: 2px;
border-color: gainsboro;
padding-left: 0.35em;
padding-top: 0.1em;
padding-bottom: 0.2em;
}
body {
background-color: rgb(255, 255, 255);
color: rgb(0.9, 0.8, 0.8);
}