chimchooree/blessfrey-bottle
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

too big nav

Browse Source
This commit is contained in:
chimchooree
2022-10-25 23:43:04 -05:00
parent 26103117f5
commit 1e2656b6d9
2 changed files with 19 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/static/css/all.css
+4 -4
View File
@@ -127,17 +127,17 @@ pre,code {
grid-row-gap: 0px;
background-color: transparent;
width: 100vw;
/*min-width: 636px;*/
min-width: 636px;
}
.nav {
grid-area: 1 / 1 / 2 / 2;
background-color: transparent;
/* width: 60vw;*/
width: 60vw;
display: grid;
grid-template-columns: 26% 51% 23%;
grid-template-rows: auto;
grid-template-rows: 1fr;
grid-column-gap: 0px;
grid-row-gap: 0px;
margin: auto;
/* min-width: 636px;*/
min-width: 636px;
}
src/static/css/nav.css
+15 -13
View File
@@ -1,5 +1,10 @@
/*set heart and star to 0px if viewport too small*/
@media (max-width: 625px) {
.heart {
width: auto;
}
}
.heart {
grid-area: 1 / 1 / 2 / 2;
background-color: transparent;
@@ -17,13 +22,11 @@
background-size: contain;
display: grid;
grid-template-columns: auto; /*repeat(4, minmax(5ch,128px))*/
grid-template-rows: repeat(4, minmax(0px,auto));
grid-template-rows: repeat(4, auto);
/*grid-template-columns: minmax(0%,10%) repeat(6, minmax(7ch,96px)) minmax(0%,10%);*/
grid-column-gap: 0px;
grid-row-gap: 0px;
align-items: center;
font-size: 2vw;
margin-bottom: 0px;
}
.star {
grid-area: 1 / 3 / 2 / 4;
@@ -37,42 +40,42 @@
.nav-diary {
grid-area: 1 / 1 / 2 / 2;
display: grid;
grid-template-columns: auto;
grid-template-columns: 100%;
grid-template-rows: 80% 20%;
grid-column-gap: 0px;
grid-row-gap: 0px;
flex-direction: column;
/*min-width: 48px;*/
min-width: 48px;
}
.nav-play {
grid-area: 1 / 2 / 2 / 3;
display: grid;
grid-template-columns: auto;
grid-template-columns: 100%;
grid-template-rows: 80% 20%;
grid-column-gap: 0px;
grid-row-gap: 0px;
flex-direction: column;
/*min-width: 48px;*/
min-width: 48px;
}
.nav-about {
grid-area: 1 / 3 / 2 / 4;
display: grid;
grid-template-columns: auto;
grid-template-columns: 100%;
grid-template-rows: 80% 20%;
grid-column-gap: 0px;
grid-row-gap: 0px;
flex-direction: column;
/*min-width: 48px;*/
min-width: 48px;
}
.nav-dev {
grid-area: 1 / 4 / 2 / 5;
display: grid;
grid-template-columns: auto;
grid-template-columns: 100%;
grid-template-rows: 80% 20%;
grid-column-gap: 0px;
grid-row-gap: 0px;
flex-direction: column;
/*min-width: 48px;*/
min-width: 48px;
}
.navlink {
font-size: 110%;
@@ -92,8 +95,7 @@
}
.nav-grid img {
height: auto;
max-width:100%;
max-height:100%;
width: 100%;
}
.links {
grid-area: 2 / 1 / 3 / 2;