changed font to atkinson hyperlegible

This commit is contained in:
Pagwin 2024-11-06 17:28:19 -05:00
parent 36c0f47786
commit d4ab483fc1
No known key found for this signature in database
GPG key ID: 81137023740CA260
3 changed files with 13 additions and 7 deletions

View file

@ -83,7 +83,7 @@ a:visited {
} }
#content { #content {
border: 0.5rem solid var(--content-border-color); border: 0.7rem solid var(--content-border-color);
} }
blockquote { blockquote {

View file

@ -3,12 +3,12 @@
@layer baseline { @layer baseline {
:root { :root {
--base-text-size: 1.75vh; --base-text-size: 2vh;
} }
body { body {
padding: 0px; padding: 0px;
margin: 0px; margin: 0px;
font-family: Georgia, serif; font-family: "Atkinson Hyperlegible", Georgia, serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }
@ -30,10 +30,10 @@ a:hover {
/*font sizes*/ /*font sizes*/
h1 { h1 {
font-size:3vh; font-size:3.5vh;
} }
h2 { h2 {
font-size: 2.4vh; font-size: 3vh;
} }
p{ p{
font-size: var(--base-text-size); font-size: var(--base-text-size);
@ -167,7 +167,7 @@ p {
/* we really want to make sure this doesn't stick around when colors load in regardless of when/how colors get loaded in*/ /* we really want to make sure this doesn't stick around when colors load in regardless of when/how colors get loaded in*/
@layer pre-load{ @layer pre-load{
#content { #content {
border: 0.5rem solid white; border: 0.7rem solid white;
} }
} }
/* I mean why not? */ /* I mean why not? */

View file

@ -6,13 +6,19 @@
<!-- not sure if this is good or bad for mobile <!-- not sure if this is good or bad for mobile
<!--<meta name="viewport" content="width=device-width, initial-scale=1">--> <!--<meta name="viewport" content="width=device-width, initial-scale=1">-->
<title>{{{title}}} · Pagwin's website</title> <title>{{{title}}} · Pagwin's website</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link
href="https://fonts.googleapis.com/css2?family=Atkinson+Hyperlegible:ital,wght@0,400;0,700;1,400;1,700&family=Noto+Serif:ital,wght@0,100..900;1,100..900&display=swap"
rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/static/css/layout.css" /> <link rel="stylesheet" type="text/css" href="/static/css/layout.css" />
<link rel="stylesheet" type="text/css" href="/static/css/colors.css" /> <link rel="stylesheet" type="text/css" href="/static/css/colors.css" />
<link rel="alternate" type="application/rss+xml" title="RSS" href="/index.xml"> <link rel="alternate" type="application/rss+xml" title="RSS" href="/index.xml">
<script type="module" src="/static/js/code_highlighting.mjs"></script> <script type="module" src="/static/js/code_highlighting.mjs"></script>
</head> </head>
<body class="light"> <body>
<!-- originally handled dark v light via js but decided it would be better to just do it all in css and have no toggle 8a7917a0cd34bd7637d9a9a8ad327e4b847cdeed is the last commit where I had the system setup --> <!-- originally handled dark v light via js but decided it would be better to just do it all in css and have no toggle 8a7917a0cd34bd7637d9a9a8ad327e4b847cdeed is the last commit where I had the system setup -->
<div id="header"> <div id="header">
<a class="nav-link" href="/">Home</a> <a class="nav-link" href="/">Home</a>