ashpie/swaf-boilerplate
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Boilerplate icon only menu #3

Merged
ArisuOngaku merged 1 commits from boilerplate-icon-only-menu into master 2020-07-06 12:51:46 +02:00
Conversation 2 Commits 1 Files Changed 1 +27 -19
1 changed files with 27 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

46
assets/sass/layout.scss
View File

@ -150,26 +150,34 @@ header {
}
@media (min-width: $menuLayoutSwitchTreshold) {
nav ul li a .tip {
visibility: hidden;
position: absolute;
display: block;
width: max-content;
height: 30px;
padding: 4px 8px;
line-height: 22px;
top: calc(100% + 8px);
left: 50%;
transform: translateX(-50%);
nav ul li {
a .tip {
visibility: hidden;
position: absolute;
display: block;
width: max-content;
height: 30px;
padding: 4px 8px;
line-height: 22px;
top: calc(100% + 8px);
left: 50%;
transform: translateX(-50%);
text-align: center;
font-size: 18px;
color: $defaultTextColor;
opacity: 0;
transition: opacity ease-out 100ms, visibility step-end 150ms;
transition-delay: 0ms;
background-color: #000;
border-radius: 5px;
text-align: center;
font-size: 18px;
color: $defaultTextColor;
opacity: 0;
transition: opacity ease-out 100ms, visibility step-end 150ms;
transition-delay: 0ms;
background-color: #000;
border-radius: 5px;
}
&:last-child a .tip {
left: unset;
right: 4px;
transform: none;
}
}
}
}