hugo-theme-next/assets/css/_common/components/tool-buttons.scss

92 lines
1.7 KiB
SCSS
Raw Normal View History

.tool-buttons {
@include sidebar-toggle();
background: none;
bottom: 58px;
filter: alpha(opacity=0);
font-size: $font-size-smaller;
@include mobile() {
font-size: $font-size-smallest;
}
.button {
display: block;
margin-bottom: 5px;
width: 36px;
height: 36px;
border-radius: 5px;
background-color: $tool-btn-bg;
color: $tool-btn-color;
text-align: center;
line-height: 35px;
padding: 0;
outline: 0;
border: none;
text-transform: none;
cursor: pointer;
opacity: $tool-btn-opacity;
touch-action: manipulation;
@include mobile() {
width: 24px;
height: 24px;
line-height: 24px;
border-radius: 3px;
}
&:hover {
color: $tool-btn-hover-fore-color;
opacity: $tool-btn-opacity-hover;
}
}
.goto-comments {
display: none;
}
}
@if $back2top_enable {
.back-to-top {
@if not $back2top_scrollpercent {
span {
display: none;
}
}
@if $back2top_sidebar {
margin: 20px -$sidebar-offset -10px -20px;
opacity: 0;
transition: opacity $transition-ease;
&.back-to-top-on {
cursor: pointer;
opacity: $b2t-opacity;
&:hover {
opacity: $b2t-opacity-hover;
}
}
} @else {
bottom: $b2t-position-bottom;
box-sizing: border-box;
color: $b2t-color;
padding: 0 6px;
transition: bottom $transition-ease;
@include sidebar-toggle();
@if not $back2top_scrollpercent {
width: 24px;
}
&:hover {
color: $sidebar-highlight;
}
&.back-to-top-on {
bottom: $b2t-position-bottom-on;
}
}
}
}