reuterShawn/shawn-reuter-blog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added fonts

Browse Source
This commit is contained in:
Maxi Ferreira 2021-11-30 21:52:32 -08:00
parent 6f7ba84e18
commit 00de7a5d00
7 changed files with 15 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
TODO
View File

@ -1,9 +1,10 @@
[ ] Update README [ ] Update README
[ ] Install Fonts [ ] Install Fonts
[ ] Style Code blocks [x] Style Code blocks
[x] Highlight current navigation item [x] Highlight current navigation item
[ ] Use css variables [ ] Use css variables
[ ] Dark mode [ ] Dark mode
[x] Resize Logo [x] Resize Logo
[ ] Reading time [ ] Reading time
[x] Bio component [x] Bio component
[ ] Add social image

5
src/components/BaseHead.astro
View File

@ -33,8 +33,9 @@ const { title, description, permalink } = Astro.props;
<meta property="twitter:image" content="https://astro.build/social.jpg?v=1" /> <meta property="twitter:image" content="https://astro.build/social.jpg?v=1" />
<!-- Fonts --> <!-- Fonts -->
<link rel="preconnect" href="https://fonts.gstatic.com" /> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&family=IBM+Plex+Sans:wght@400;700&display=swap"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Fira+Sans:wght@400;600;700&family=Merriweather:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet">
<!-- Styles --> <!-- Styles -->
<link rel="stylesheet" href={Astro.resolve('../styles/global.css')} /> <link rel="stylesheet" href={Astro.resolve('../styles/global.css')} />

2
src/components/Footer.astro
View File

@ -10,7 +10,7 @@
footer { footer {
color: #AAA; color: #AAA;
font-size: 1em; font-size: 1em;
font-family: Rubik, sans-serif; font-family: var(--font-family-sans);
margin: 1em auto; margin: 1em auto;
max-width: 1400px; max-width: 1400px;
padding: 1em 2em; padding: 1em 2em;

2
src/components/Nav.astro
View File

@ -7,7 +7,7 @@ const { current = '' } = Astro.props;
align-items: flex-end; align-items: flex-end;
display: flex; display: flex;
flex: 1; flex: 1;
font-family: Rubik, sans-serif; font-family: var(--font-family-sans);
font-weight: 700; font-weight: 700;
justify-content: flex-end; justify-content: flex-end;
text-transform: uppercase; text-transform: uppercase;

2
src/layouts/BlogPostLayout.astro
View File

@ -33,7 +33,7 @@ const {title, description, publishDate, author, heroImage, permalink, alt} = con
header p { header p {
color: #AAA; color: #AAA;
text-transform: uppercase; text-transform: uppercase;
font-family: Rubik, sans-serif; font-family: var(--font-family-sans);
font-weight: 600; font-weight: 600;
} }

6
src/pages/blog/index.astro
View File

@ -1,10 +1,6 @@
--- ---
import BaseLayout from '../../layouts/BaseLayout.astro'; import BaseLayout from '../../layouts/BaseLayout.astro';
interface MarkdownFrontmatter {
publishDate: number;
}
const title = 'Blog'; const title = 'Blog';
const description = 'Latest articles.'; const description = 'Latest articles.';
const permalink = 'https://example.com/blog'; const permalink = 'https://example.com/blog';
@ -36,7 +32,7 @@ allPosts = allPosts.sort((a, b) => new Date(b.publishDate).valueOf() - new Date(
<style> <style>
h2, h2,
.post-item-footer { .post-item-footer {
font-family: Rubik, sans-serif; font-family: var(--font-family-sans);
font-weight: 700; font-weight: 700;
} }

10
src/styles/global.css
View File

@ -2,6 +2,8 @@
--background-body: #fff; --background-body: #fff;
--text-main: #36393b; --text-main: #36393b;
--primary-color: #548E9B; --primary-color: #548E9B;
--font-family-serif: Merriweather, serif;
--font-family-sans: 'Fira Sans', sans-serif;
} }
/* :root { /* :root {
@ -16,7 +18,7 @@
body { body {
margin: 0; margin: 0;
font-family: Merriweather, serif; font-family: var(--font-family-serif);
font-size: 16px; font-size: 16px;
line-height: 1.6; line-height: 1.6;
background-color: var(--background-body); background-color: var(--background-body);
@ -24,14 +26,14 @@ body {
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
font-family: Rubik, sans-serif; font-family: var(--font-family-sans);
font-weight: 700; font-weight: 700;
line-height: 1.2; line-height: 1.2;
margin: 0 0 0.5em 0; margin: 0 0 0.5em 0;
} }
h1 { h1 {
font-family: Merriweather, serif; font-family: var(--font-family-serif);
font-size: 4em; font-size: 4em;
margin: 0 0 1em 0; margin: 0 0 1em 0;
} }
@ -162,7 +164,7 @@ figure {
table { table {
border-collapse: collapse; border-collapse: collapse;
font-family: Rubik, sans-serif; font-family: var(--font-family-sans);
font-size: 1.125em; font-size: 1.125em;
margin: 2em 0; margin: 2em 0;
} }