feat: added basic responsive design

This commit is contained in:
moonleay 2023-10-19 00:00:25 +02:00
parent 1749f7f3b1
commit 4caf4eede9
3 changed files with 54 additions and 15 deletions

View file

@ -1,19 +1,38 @@
.navMenu {
display: flex;
flex-direction: column;
background-color: rgba(0, 0, 0, 0.4);
backdrop-filter: blur(5px);
position: sticky;
background-color: #5d5d61;
border-radius: 5px;
}
.logo {
width: 32px;
height: 32px;
border-radius: 10%;
border-radius: 100%;
max-width: initial;
max-height: initial;
}
.navElem {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
.logoWtxt {
display: flex;
align-items: center;
margin: 0;
padding: 0;
}
.pad3px {
padding: 3px;
}
.footer {
align-items: center;
margin: 100px 1px 0 0;
@ -24,6 +43,10 @@
padding: 5px;
}
.footerImageNote {
font-size: 0.75rem;
}
.footerIcon {
display: block;
text-align: center;
@ -99,6 +122,17 @@
margin: 0 auto;
}
.grid {
display: grid;
grid-template-columns: repeat(6, 1fr);
}
.navElem {
grid-column: span 1;
margin: 0.5rem 0.5rem 0.5rem 0.5rem;
align-items: center;
}
.footerIcon {
grid-column: span 1;
justify-self: center;