more prominent navbar icons
This commit is contained in:
parent
d017196245
commit
8c62bdb860
@ -58,11 +58,10 @@
|
|||||||
|
|
||||||
/* links */
|
/* links */
|
||||||
.navbar__link-wrapper {
|
.navbar__link-wrapper {
|
||||||
position: relative;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
align-items: flex-start;
|
align-items: center;
|
||||||
height: 80px;
|
height: 80px;
|
||||||
min-width: 90px;
|
min-width: 90px;
|
||||||
color: var(--color-lightwhite);
|
color: var(--color-lightwhite);
|
||||||
@ -71,14 +70,17 @@
|
|||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: var(--color-lightwhite);
|
color: var(--color-lightwhite);
|
||||||
|
|
||||||
|
.navbar__link-icon {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar__link-icon {
|
.navbar__link-icon {
|
||||||
position: absolute;
|
opacity: 0.7;
|
||||||
right: 4px;
|
transition: opacity 0.2s ease;
|
||||||
top: 4px;
|
margin-bottom: 7px;
|
||||||
opacity: 0.3;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.navbar__link-label {
|
.navbar__link-label {
|
||||||
@ -90,7 +92,7 @@
|
|||||||
@media (min-width: 769px) {
|
@media (min-width: 769px) {
|
||||||
|
|
||||||
.navbar__link-wrapper {
|
.navbar__link-wrapper {
|
||||||
border: 1px solid var(--color-lmu-box-border);
|
border: 1px solid rgba(255, 255, 255, 0.7);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -106,6 +108,11 @@
|
|||||||
.navbar__link-label {
|
.navbar__link-label {
|
||||||
padding: 0 7px;
|
padding: 0 7px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.navbar__link-icon {
|
||||||
|
transform: scale(0.65);
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/* navbar list */
|
/* navbar list */
|
||||||
@ -142,21 +149,6 @@
|
|||||||
&:not(.navbar__list-item--favorite) + .navbar__list-item {
|
&:not(.navbar__list-item--favorite) + .navbar__list-item {
|
||||||
margin-left: 12px;
|
margin-left: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.fas {
|
|
||||||
height: 20px;
|
|
||||||
margin-left: 8px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
|
|
||||||
.navbar__list-item {
|
|
||||||
|
|
||||||
.fas {
|
|
||||||
margin-left: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 500px) {
|
@media (max-width: 500px) {
|
||||||
|
|||||||
Reference in New Issue
Block a user