andrew
/
homepage
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Redid title sizing for smaller screens.

This commit is contained in:
Andrew Lalis 2024-08-26 13:47:10 -04:00
parent a2e8571acb
commit bd942f2b49
1 changed files with 11 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
app/src/App.vue
View File

@ -43,12 +43,22 @@ import NavLink from './components/NavLink.vue'
.site-header-text {
font-family: Sacramento;
font-size: 60px;
container-type: inline-size;
font-size: calc(min(60px, max(5cqw, 42px)));
text-align: right;
margin-top: 1rem;
margin-bottom: 0;
}
.page-enter-active {
transition: all 0.5s ease;
}
.page-enter-from {
opacity: 0;
transform: translateX(30px);
}
/*
Activates once the left and right half of the page stack due to width constraints.
We remove a lot of the vertical spacing to make things fit better.
@ -70,13 +80,4 @@ Once the device width is smaller than one of the halves, sync the page half to t
width: calc(100% - 2rem);
}
}
.page-enter-active {
transition: all 0.5s ease;
}
.page-enter-from {
opacity: 0;
transform: translateX(30px);
}
</style>