From 6716a135ebb11e437224077b34b2b079b677670b Mon Sep 17 00:00:00 2001 From: Henry-Hiles Date: Wed, 31 May 2023 16:01:46 -0400 Subject: [PATCH] Styling changes --- src/layouts/Layout.astro | 2 +- src/projects.json | 8 ++++---- src/styles/ButtonLink.module.css | 22 ++++++++++------------ src/styles/Home.css | 2 +- src/styles/Layout.css | 12 ++++++------ src/styles/Nav.module.css | 2 +- src/styles/Portfolio.module.css | 9 +++++++++ 7 files changed, 32 insertions(+), 25 deletions(-) diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 2598186..55201b9 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -14,7 +14,7 @@ const { page } = Astro.props - + :is(h1, h2) { - font-size: 2.5em; + font-size: 2.5rem; margin: 0; text-align: center; text-transform: uppercase; diff --git a/src/styles/Layout.css b/src/styles/Layout.css index 18f6d18..a3cc4f0 100644 --- a/src/styles/Layout.css +++ b/src/styles/Layout.css @@ -4,7 +4,7 @@ --primary: hsl(211 26% 39%); --secondary: hsl(209 28% 29%); - --secondary-hover: hsl(209 28% 19%); + --secondary-hover: hsl(209 28% 25%); --text-primary: hsl(0 0% 100%); --secondary-text: hsl(211 26% 39%); } @@ -15,7 +15,6 @@ body { margin: 0; background-attachment: fixed; background-image: url("/images/background.jpg"); - backdrop-filter: blur(10px); color: var(--text-primary); } @@ -27,7 +26,6 @@ body { svg { vertical-align: middle; - font-size: 0.75rem; } img { @@ -36,20 +34,22 @@ img { main { display: flex; - gap: 2rem; + gap: 5rem; flex-direction: column; align-items: center; - padding-bottom: 2em; + padding-bottom: 10em; } main > section { - scroll-margin-top: 8rem; + scroll-margin-top: 9rem; display: flex; flex-direction: column; border-radius: 1rem; background: rgba(0 0 0 / 0.3); padding: 2rem; + margin: 1rem; width: 90%; + min-height: 80vh; transition: scale 0.2s; } diff --git a/src/styles/Nav.module.css b/src/styles/Nav.module.css index d4cece3..f860ec2 100644 --- a/src/styles/Nav.module.css +++ b/src/styles/Nav.module.css @@ -1,7 +1,7 @@ .nav { padding: 0.5rem; display: flex; - font-size: 1.3em; + font-size: 1.3rem; overflow-y: auto; font-weight: bold; background: hsl(0 0% 0% / 0.4); diff --git a/src/styles/Portfolio.module.css b/src/styles/Portfolio.module.css index dcb8fd0..52a9735 100644 --- a/src/styles/Portfolio.module.css +++ b/src/styles/Portfolio.module.css @@ -8,6 +8,11 @@ .portfolioItems a { color: var(--text-primary); + transition: scale 0.2s; +} + +.portfolioItems a:not(:hover) { + filter: brightness(90%); } .portfolioItems a:not(:hover) { @@ -37,6 +42,10 @@ width: 100%; } +.portfolioItems a:hover { + scale: 1.1; +} + .projectName { display: flex; justify-content: center;