jfmonty2/blog
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

change font of drop caps

Browse Source
This commit is contained in:
Joseph Montanaro 2023-08-15 11:06:54 -07:00
parent 1a77127979
commit da72464f9a
4 changed files with 13 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app.html
View File

@ -3,6 +3,7 @@
<head> <head>
<meta charset="utf-8" /> <meta charset="utf-8" />
<link rel="preload" href="/Tajawal-Regular.woff2" as="font" type="font/woff2" /> <link rel="preload" href="/Tajawal-Regular.woff2" as="font" type="font/woff2" />
<link rel="preload" href="/Baskerville-Regular.woff2" as="font" type="font/woff2" />
<link rel="icon" href="/favicon.png" /> <link rel="icon" href="/favicon.png" />
<link rel="stylesheet" href="/style.css" /> <link rel="stylesheet" href="/style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1" /> <meta name="viewport" content="width=device-width, initial-scale=1" />

5
src/lib/Dropcap.svelte
View File

@ -20,9 +20,9 @@
text-transform: uppercase; text-transform: uppercase;
color: #8c0606; color: #8c0606;
/* box-sizing: border-box;*/ /* box-sizing: border-box;*/
font-size: calc(var(--content-size) * var(--content-line-height) * 1.9); font-size: calc(var(--content-size) * var(--content-line-height) * 1.75);
float: left; float: left;
font-family: serif; font-family: 'Baskerville';
line-height: 0.8; line-height: 0.8;
margin-right: 0.1em; margin-right: 0.1em;
display: block; display: block;
@ -30,6 +30,7 @@
.first-word { .first-word {
margin-left: var(--shift); margin-left: var(--shift);
font-variant: petite-caps;
} }
</style> </style>

BIN
static/Baskerville-Regular.woff2 Normal file
View File

Binary file not shown.

9
static/style.css
View File

@ -7,10 +7,19 @@
font-display: block; font-display: block;
} }
@font-face {
font-family: 'Baskerville';
font-style: normal;
font-weight: 400;
src: url(/Baskerville-Regular.woff2) format('woff2');
font-display: block;
}
:root { :root {
--content-size: 1.25rem; --content-size: 1.25rem;
--content-line-height: 1.3; --content-line-height: 1.3;
--content-color: #1e1e1e; --content-color: #1e1e1e;
--accent-color: #8c0606;
} }
html { html {