2019-08-08 16:02:27 +08:00
|
|
|
@import './mixins/mixins.scss';
|
2019-09-17 19:21:07 +08:00
|
|
|
@import './themes/vars.scss';
|
2019-08-08 16:02:27 +08:00
|
|
|
|
|
|
|
@include b(back-top) {
|
|
|
|
@include fade-in-transition(back-top);
|
|
|
|
position: fixed;
|
|
|
|
right: 40px;
|
|
|
|
bottom: 40px;
|
|
|
|
border-radius: 20px;
|
|
|
|
width: 40px;
|
|
|
|
height: 40px;
|
|
|
|
overflow: hidden;
|
|
|
|
transition: box-shadow .3s $default-cubic-bezier;
|
|
|
|
box-shadow: 0 2px 10px 0px rgba(238, 238, 238, .45);
|
|
|
|
cursor: pointer;
|
|
|
|
svg {
|
|
|
|
pointer-events: none;
|
|
|
|
}
|
|
|
|
.n-back-top__button {
|
|
|
|
transition: fill .3s $default-cubic-bezier;
|
|
|
|
fill: rgba(255, 255, 255, 0.45);
|
|
|
|
}
|
|
|
|
&:hover {
|
|
|
|
box-shadow: 0 2px 10px 0px rgb(77, 177, 153);
|
|
|
|
.n-back-top__button {
|
|
|
|
fill: rgba(99, 226, 183, 1);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
&:active {
|
|
|
|
box-shadow: 0 2px 10px 0px rgb(77, 177, 153);
|
|
|
|
.n-back-top__button {
|
|
|
|
fill: rgba(77, 177, 153, 1);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|