mirrors/thebadspace
1
0
Fork 0
mirror of https://koodu.h-i.works/projects/thebadspace synced 2025-06-25 16:04:37 -05:00
Code Packages Releases Activity

Responsive Part 2, environment changes

Browse Source 
Hit the major friction points in the responsive UI. Still have some
polishing to do but there shouldn't be any show stoppers at this points.

Also moved some variable to the env so they can be changed easily when
necessary
This commit is contained in:
ro
2024-02-08 13:07:49 -06:00
parent cbf2dcb450
commit 09442e6d4a
8 changed files with 149 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
public/assets/css/global/frame.css
View File

@ -205,9 +205,6 @@ footer > div:nth-child(1) {
*/
@media only screen and (max-width: 960px) {
header > div:nth-child(1) {
}
header > div nav {
bottom: 17px;
}
@ -224,5 +221,29 @@ footer > div:nth-child(1) {
}
}
@media only screen and (max-width: 800px) {
@media only screen and (max-width: 650px) {
header > div:nth-child(1) {
grid-template-columns: 150px 65% 1fr;
grid-template-rows: 75% 1fr;
height: auto;
gap: 15px;
}
header > div > div.header-left {
grid-row: 1/2;
position: relative;
width: 100px;
}
header > div > div.header-center {
grid-row: 2/3;
grid-column: 1/4;
position: relative;
}
}
@media only screen and (max-width: 440px) {
header > div:nth-child(1) {
grid-template-columns: 150px 40% 1fr;
}
}

20
public/assets/css/global/typography.css
View File

@ -66,3 +66,23 @@ h3 {
font-size: 1em;
font-weight: 500;
}
@media only screen and (max-width: 800px) {
h1 {
font-size: 2em;
}
}
@media only screen and (max-width: 650px) {
h1 {
font-size: 1.5em;
letter-spacing: -3px;
width: 100%;
position: relative;
}
}
@media only screen and (max-width: 480px) {
font-size: 1.5em;
letter-spacing: -3px;
}