naive-ui/styles/BackTop.scss

39 lines
968 B
SCSS
Raw Normal View History

2019-08-08 16:02:27 +08:00
@import './mixins/mixins.scss';
@import './themes/vars.scss';
2019-08-08 16:02:27 +08:00
2019-10-16 11:33:49 +08:00
@include themes-mixin {
@include b(back-top) {
@include fade-in-transition(back-top);
@include once {
position: fixed;
right: 40px;
bottom: 40px;
border-radius: 20px;
width: 40px;
height: 40px;
overflow: hidden;
transition: box-shadow .3s $default-cubic-bezier;
cursor: pointer;
svg {
pointer-events: none;
}
2019-08-08 16:02:27 +08:00
}
2019-10-25 17:53:41 +08:00
box-shadow: map-get($--back-top-box-shadow, 'default');
@include e(button) {
2019-10-16 11:33:49 +08:00
transition: fill .3s $default-cubic-bezier;
fill: $--back-top-button-fill;
}
&:hover {
2019-10-25 17:53:41 +08:00
box-shadow: map-get($--back-top-box-shadow, 'hover');
@include e(button) {
2019-10-16 11:33:49 +08:00
fill: $--back-top-button-fill-hover;
}
}
&:active {
2019-10-25 17:53:41 +08:00
box-shadow: map-get($--back-top-box-shadow, 'active');
@include e(button) {
fill: $--back-top-button-fill-active;
2019-10-16 11:33:49 +08:00
}
2019-08-08 16:02:27 +08:00
}
}
}