muerwre/vault-frontend
1
0
Fork 0
mirror of https://github.com/muerwre/vault-frontend.git synced 2025-04-25 12:56:41 +07:00
Code Packages Activity Actions

fixed attach icons

Browse source
This commit is contained in:
Fedor Katurov 2019-12-03 17:36:34 +07:00
parent 1eb0fa7be6
commit 5b7077d256
3 changed files with 78 additions and 59 deletions
Download patch file Download diff file Expand all files Collapse all files

108
src/components/main/Header/style.scss
View file

@ -46,55 +46,6 @@
user-select: none;
text-transform: uppercase;
align-items: center;
& > a.item,
& > div.item {
font: $font_16_medium;
display: flex;
align-items: center;
position: relative;
padding: $gap;
cursor: pointer;
transition: color 0.25s;
text-decoration: none;
color: white;
white-space: nowrap;
&:hover {
color: $red;
}
&:first-child {
padding-left: $spc + $gap;
}
&::after {
content: ' ';
margin-left: $spc;
background: white;
width: 4px;
height: $gap;
display: block;
opacity: 0.2;
border-radius: 4px;
}
&:last-child {
// padding-right: 0;
// &::after {
// display: none;
// }
}
@include tablet {
padding: $gap / 2;
&::after {
margin-left: $gap;
}
}
}
}
.profile {
@ -108,3 +59,62 @@
padding-left: $gap / 2;
cursor: pointer;
}
.item {
font: $font_16_medium;
display: flex;
align-items: center;
position: relative;
padding: $gap $gap * 2;
cursor: pointer;
transition: color 0.25s;
text-decoration: none;
color: white;
white-space: nowrap;
&:hover {
color: $red;
}
&::after {
content: ' ';
margin-left: $spc;
background: white;
width: 4px;
height: $gap;
display: block;
opacity: 0.2;
border-radius: 4px;
position: absolute;
right: -2px;
}
&::before {
content: ' ';
position: absolute;
bottom: 0;
height: 3px;
width: 50%;
right: 50%;
background: white;
transform: translate(50%, 0) scaleX(0);
opacity: 0;
border-radius: 3px;
transition: transform 0.5s, opacity 0.25s;
}
&.is_active {
&::before {
transform: translate(50%, 0) scaleX(1);
opacity: 1;
}
}
@include tablet {
padding: $gap;
&::after {
margin-left: $gap;
}
}
}