andrew/personal-website
1
0
Fork 0
mirror of https://github.com/Alee14/personal-website.git synced 2025-01-22 19:02:12 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions

Update font sizes and padding in Default layout and Navbar

Browse source
This commit is contained in:
Andrew Lee 2024-01-22 18:21:16 +00:00
parent 4b953d0c3b
commit 7604592b7a
3 changed files with 14 additions and 23 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
src/layouts/Default.astro
View file

@ -42,7 +42,7 @@ import Navbar from '../components/Navbar.astro';
footer {
text-align: center;
font-size: 2.4vh;
font-size: 1.3em;
}
h1, h2, h3, h4, h5, h6 {
@ -50,7 +50,7 @@ import Navbar from '../components/Navbar.astro';
}
h2 {
font-size: 2.5vh;
font-size: 1.5em;
}
a {

21
src/styles/Navbar.css
View file

@ -1,7 +1,7 @@
nav {
font-weight: 300;
padding-top: 2vh;
padding-bottom: 4.5vh;
padding-top: 1.5em;
padding-bottom: 2.2em;
}
ul.nav-list {
list-style-type: none;
@ -10,11 +10,11 @@ ul.nav-list {
display: flex;
flex-direction: row;
justify-content: center;
gap: 4vh;
gap: 2.2em;
}
a.nav-link {
font-size: 2vh;
font-size: 1.1em;
}
a.nav-link:hover {
@ -26,14 +26,6 @@ a.nav-link:active {
color: #609460;
}
@media (max-width: 768px) {
ul.nav-list {
flex-direction: column;
align-items: center;
gap: 2vh;
}
}
.nav-toggle {
background: transparent;
border: none;
@ -72,11 +64,10 @@ a.nav-link:active {
padding: 20px;
}
ul.nav-list {
flex-direction: column;
align-items: center;
gap: 2vh;
gap: 1em;
display: none;
}
@ -96,4 +87,4 @@ a.nav-link:active {
.nav-list.show a.nav-link {
animation: fadeIn 0.5s ease-in-out forwards;
}
}
}

12
src/styles/index.css
View file

@ -9,7 +9,7 @@
}
#title {
font-size: 4vh;
font-size: 2.3em;
}
ul {
@ -29,13 +29,13 @@ p {
display: flex;
flex-direction: row;
justify-content: center;
font-size: 6vh;
gap: 7vh;
font-size: 3.2em;
gap: 1.4em;
}
.email-contact {
font-weight: 300;
font-size: 2.2vh;
font-size: 1.2em;
}
.information {
@ -65,8 +65,8 @@ p {
/* Mobile view */
@media (max-width: 768px) {
.social {
font-size: 5vh;
gap: 3vh;
font-size: 2.6em;
gap: 1em;
}
.information {