1
mirror of https://github.com/jakejarvis/jarv.is.git synced 2025-04-26 17:28:27 -04:00
jarv.is/components/Menu/Menu.module.css

72 lines
1.0 KiB
CSS

.menu {
display: inline-flex;
padding: 0;
margin: 0;
}
.menu li {
list-style: none;
display: inline-flex;
margin-left: 1.8em;
}
.menu li .link {
display: inline-flex;
align-items: center;
color: var(--medium-dark);
background: none;
padding-bottom: 0;
}
.menu li .link:hover {
color: var(--link);
}
.menu li .icon {
width: 1.6em;
height: 1.6em;
}
.menu li span {
font-size: 0.95em;
font-weight: 500;
margin-left: 0.8em;
line-height: 1;
}
.menu li.theme_toggle {
margin-left: 1.25em;
}
@media screen and (max-width: 768px) {
.menu {
width: 100%;
justify-content: space-between;
}
.menu li {
margin-left: 0;
}
.menu li .icon {
width: 1.8em;
height: 1.8em;
}
/* hide text next to emojis on mobile */
.menu li span {
display: none;
}
.menu li.theme_toggle {
margin-left: -0.3em;
}
}
/* the home icon is redundant when space is SUPER tight */
@media screen and (max-width: 380px) {
.menu li:first-of-type {
display: none;
}
}