styles and fonts updates

PaulineNemchak · Aug 11, 2024 · 3b69892 · 3b69892
1 parent 90c02e7
commit 3b69892
Show file tree

Hide file tree

Showing 6 changed files with 21 additions and 23 deletions.
diff --git a/astro.config.mjs b/astro.config.mjs
@@ -2,5 +2,5 @@ import { defineConfig } from 'astro/config';
 
 
 export default defineConfig({
-    site: 'https://paulinenemchak.dev/',
-  })
+    site: 'https://paulinenemchak.dev/'
+});
diff --git a/src/components/Capybara.astro b/src/components/Capybara.astro
@@ -3,8 +3,8 @@
 
 <style>
     @media all and (max-width: 600px) {
-        .container {
-            font-size: 8px;
+        .capybara {
+            font-size: 0.4rem;
         }
     }
 
@@ -15,7 +15,7 @@
 </style>
 
 <figure class='textImage'>
-    <pre class='container' role="img" aria-label="ASCII image of a Capybara">
+    <pre class='capybara' role="img" aria-label="ASCII image of a Capybara">
         {
     `
                                  .;o,

diff --git a/src/components/Footer.astro b/src/components/Footer.astro
@@ -24,7 +24,7 @@ import Container from './Container.astro';
         fill: var(--purple);
     }
 
-    .icon:hover {
+    .link:hover .icon {
         fill: var(--purple-light);
     }
 

diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
@@ -7,14 +7,6 @@ import Footer from '../components/Footer.astro';
 const { pageTitle } = Astro.props;
 ---
 
-<style>
-    body {
-        display: flex;
-        flex-direction: column;
-        min-height: 100%;
-    }
-</style>
-
 <html lang="en">
   <head>
     <meta charset="utf-8" />
@@ -25,6 +17,13 @@ const { pageTitle } = Astro.props;
     <meta name="viewport" content="width=device-width" />
     <meta name="generator" content={Astro.generator} />
     <title>{pageTitle}</title>
+    <style>
+      body {
+          display: flex;
+          flex-direction: column;
+          min-height: 100%;
+      }
+    </style>
   </head>
   <body>
     <Header />

diff --git a/src/layouts/MarkdownPostLayout.astro b/src/layouts/MarkdownPostLayout.astro
@@ -9,7 +9,6 @@ const date = formatDate(frontmatter.pubDate);
 <BaseLayout pageTitle={frontmatter.title}>
     <article>
         <h1>{frontmatter.title}</h1>
-        <p><em>{frontmatter.description}</em></p>
         <slot />
         <time datetime={frontmatter.pubDate}>{date}</time>
         <TagList tags={tags} />

diff --git a/src/styles/global.css b/src/styles/global.css
@@ -5,7 +5,7 @@ body {
     padding: 0;
     margin: 0;
     font-family: system-ui, sans-serif; 
-    font-size: 18px;
+    font-size: 22px;
     background: var(--white);
     color: var(--purple);
     overflow-x: hidden;
@@ -29,7 +29,7 @@ a:visited {
 }
 
 h1 {
-    font-size: 80px;
+    font-size: 3.25rem;
     margin-top: 0;
     margin-left: -20px;
     line-height: 1em;
@@ -39,11 +39,11 @@ h1 {
 h3 {
     margin-top: 30px;
     margin-bottom: 10px;
-    font-size: 22px;
+    font-size: 1.5rem;
 }
 
 p {
-    margin: 5px;
+    margin: 0.75rem 0;
 }
 
 .visually-hidden:not(:focus):not(:active) {
@@ -69,15 +69,15 @@ img {
 }
 
 @media all and (max-width: 600px) {
-    .capybara {
-        font-size: 10px;
+    body {
+        font-size: 18px;
     }
 
     h1 {
-        font-size: 50px;
+        font-size: 2rem;
     }
 
     h3  {
-        font-size: 16px;
+        font-size: 1.5rem;
     }
 }