evan/ewpratten.com
1
Fork 0
Code Actions

Typographical improvements

Browse Source
This commit is contained in:
Evan Pratten 2024-01-13 16:06:30 -05:00
parent a01a62b64e
commit f59662d95a
6 changed files with 41 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
sass/elements/code.scss
View File

@ -24,6 +24,7 @@ del {
border-radius: 5px;
padding: 0 5px;
font-size: 85%;
white-space: nowrap;
}
kbd {

14
sass/elements/header.scss
View File

@ -1,4 +1,4 @@
header {
header.intro-card {
display: flex;
flex-wrap: wrap;
flex-direction: row;
@ -10,6 +10,8 @@ header {
margin: 2em auto;
font-family: "IBM Plex Serif", serif;
// Image Controls
&[data-size="large"] {
img {
@ -80,3 +82,13 @@ header {
}
}
}
header.page-header {
margin-bottom: 1em;
.subtitle {
font-family: "IBM Plex Serif", serif;
font-size: 1.25em;
color: gray;
}
}

5
sass/elements/headings.scss
View File

@ -1,3 +1,4 @@
h1,
h2,
h3,
@ -12,6 +13,10 @@ h6 {
border-bottom: 1px solid #d7dde3;
font-family: "IBM Plex Serif", serif;
font-kerning: normal;
font-variant-ligatures: normal;
code {
padding: 0 0.2em;
font-size: inherit;

9
sass/elements/text.scss
View File

@ -1,15 +1,14 @@
p,
li,
span {
font-family: sans-serif;
}
p {
margin-top: 0;
margin-bottom: 16px;
padding: 0 0.25em;
text-align: justify;
hyphens: auto;
font-kerning: normal;
font-variant-ligatures: normal;
// font-variant-ligatures: common-ligatures contextual discretionary-ligatures historical-ligatures;
}

10
sass/styles.scss
View File

@ -1,12 +1,17 @@
// Note: Some things are broken out into smaller files
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Serif:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap');
$content-max-width: 800px;
@import "elements/header.scss";
body {
margin: 1em;
font-family: serif;
// font-family: serif;
font-family: "Noto Sans", sans-serif;
font-optical-sizing: auto;
}
a {
@ -25,6 +30,9 @@ nav {
margin: 0 auto;
text-align: center;
font-family: "IBM Plex Serif", serif;
font-weight: 500;
ul {
max-width: 100%;
display: flex;

17
templates/base.html
View File

@ -73,7 +73,7 @@
<body>
{# Heading section (profile photo & name) #}
<header data-size="{% if path == '/' %}large{% else %}small{% endif %}">
<header data-size="{% if path == '/' %}large{% else %}small{% endif %}" class="intro-card">
<img src="{{config.extra.profile_photo}}" alt="Evan Pratten">
<div class="header-text">
<span class="header-name">Evan Pratten</span><br>
@ -131,13 +131,14 @@
<main>
{% block content %}
<article>
{% if not extra.no_auto_title %}
<h1 class="title">{{title}}</h1>
{% endif %}
{% if page.description %}
<em class="subtitle">{{page.description}}</em><br>
{% endif %}
<br>
<header class="page-header">
{% if not extra.no_auto_title %}
<h1 class="title">{{title}}</h1>
{% endif %}
{% if page.description %}
<span class="subtitle">{{page.description}}</span>
{% endif %}
</header>
{{ content | safe }}
</article>