JustalK/PORTFOLIO

View on GitHub
src/assets/less/links.less

Summary

Maintainability
Test Coverage
@import (reference) "libs/constants.less";
@import (reference) "libs/mixins.less";
 
#LINKS {
font-family: 'Lato-Light', sans-serif;
position: absolute;
right: -75px;
top: 100px;
font-weight: bold;
color: #fff;
text-transform: uppercase;
font-size: 4rem;
transform: translateX(100%) translateY(-12.5px) rotateZ(90deg);
transform-origin: left;
.transition(transform 0.25s ease 0.75s);
 
display: flex;
 
& a {
margin-right: 20px;
display: flex;
.transition(all 0.25s ease);
 
&:hover {
color: @text-color;
}
 
& span:hover {
color: @background-bloc-2;
.transition(all 0.25s ease);
}
}
 
&.is_animated,
&.invisible {
transform: translateX(100%) translateY(-450px) rotateZ(90deg);
}
}
 
@media screen and (max-width: @SCREEN_1200) {
#LINKS {
right: -55px;
}
}
 
@media screen and (max-width: @SCREEN_900) {
#LINKS {
display: none;
}
}