mirror of
https://github.com/next-theme/hexo-theme-next.git
synced 2026-01-17 18:22:33 +00:00
Adjust back2top style
This commit is contained in:
parent
25eb0bce33
commit
29cb5ebf39
@ -11,7 +11,7 @@
|
||||
|
||||
{%- if theme.back2top.enable and not theme.back2top.sidebar %}
|
||||
<div class="back-to-top" role="button" aria-label="{{ __('accessibility.back_to_top') }}">
|
||||
<i class="fa fa-arrow-up"></i>
|
||||
<i class="fa fa-arrow-up fa-lg"></i>
|
||||
<span>0%</span>
|
||||
</div>
|
||||
{%- endif %}
|
||||
|
||||
@ -2,14 +2,21 @@ if (hexo-config('back2top.enable')) {
|
||||
.back-to-top {
|
||||
font-size: $b2t-font-size;
|
||||
|
||||
if (not hexo-config('back2top.scrollpercent')) {
|
||||
span {
|
||||
span {
|
||||
margin-right: 8px;
|
||||
if (not hexo-config('back2top.scrollpercent')) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.fa {
|
||||
text-align: center;
|
||||
width: $sidebar-toggle-size;
|
||||
}
|
||||
|
||||
if (hexo-config('back2top.sidebar')) {
|
||||
margin: 20px - $sidebar-offset -10px -20px;
|
||||
// FIXME: opacity override by motion
|
||||
opacity: 0;
|
||||
transition: opacity $transition-ease;
|
||||
|
||||
@ -22,17 +29,14 @@ if (hexo-config('back2top.enable')) {
|
||||
}
|
||||
}
|
||||
} else {
|
||||
align-items: center;
|
||||
bottom: $b2t-position-bottom;
|
||||
box-sizing: border-box;
|
||||
color: $b2t-color;
|
||||
padding: 0 6px;
|
||||
display: flex;
|
||||
height: $sidebar-toggle-size;
|
||||
transition: bottom $transition-ease;
|
||||
sidebar-toggle();
|
||||
|
||||
if (not hexo-config('back2top.scrollpercent')) {
|
||||
width: 24px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: $sidebar-highlight;
|
||||
}
|
||||
|
||||
@ -1,8 +1,8 @@
|
||||
.sidebar-toggle {
|
||||
bottom: 45px;
|
||||
height: 12px;
|
||||
padding: 6px 5px;
|
||||
width: 14px;
|
||||
bottom: $b2t-position-bottom-on + $sidebar-toggle-size + 5px;
|
||||
height: $sidebar-toggle-inner-size;
|
||||
padding: $sidebar-toggle-padding;
|
||||
width: $sidebar-toggle-inner-size;
|
||||
sidebar-toggle();
|
||||
}
|
||||
|
||||
|
||||
@ -11,8 +11,12 @@
|
||||
transition: all .4s;
|
||||
width: 100%;
|
||||
|
||||
&:first-child {
|
||||
margin-top: 1px;
|
||||
}
|
||||
|
||||
&:not(:first-child) {
|
||||
margin-top: 3px;
|
||||
margin-top: 4px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -197,22 +197,22 @@ toggle-close($position) {
|
||||
|
||||
if ($position == 'right') {
|
||||
.toggle-line:first-child {
|
||||
top: 5px;
|
||||
top: 6px;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
|
||||
.toggle-line:last-child {
|
||||
top: -5px;
|
||||
top: -6px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
} else {
|
||||
.toggle-line:first-child {
|
||||
top: 5px;
|
||||
top: 6px;
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
|
||||
.toggle-line:last-child {
|
||||
top: -5px;
|
||||
top: -6px;
|
||||
transform: rotate(-45deg);
|
||||
}
|
||||
}
|
||||
|
||||
@ -64,5 +64,3 @@ $btn-default-hover-color = white;
|
||||
// Back to top
|
||||
$b2t-opacity = .6;
|
||||
$b2t-opacity-hover = .8;
|
||||
$b2t-position-bottom = -100px;
|
||||
$b2t-position-bottom-on = 30px;
|
||||
|
||||
@ -265,13 +265,17 @@ $site-state-item-name-color = inherit;
|
||||
$b2t-opacity = .8;
|
||||
$b2t-opacity-hover = 1;
|
||||
$b2t-position-bottom = -100px;
|
||||
$b2t-position-bottom-on = 19px;
|
||||
$b2t-position-bottom-on = 30px;
|
||||
$b2t-position-right = 30px;
|
||||
$b2t-position-right-mobile = 20px;
|
||||
$b2t-font-size = 12px;
|
||||
$b2t-color = white;
|
||||
$b2t-bg-color = $black-deep;
|
||||
|
||||
$sidebar-toggle-inner-size = 16px;
|
||||
$sidebar-toggle-padding = 5px;
|
||||
$sidebar-toggle-size = $sidebar-toggle-inner-size + $sidebar-toggle-padding * 2;
|
||||
|
||||
// .post-expand .post-eof
|
||||
// In Muse scheme, margin above and below the post separator
|
||||
$post-eof-margin-top = 80px; // or 160px for more white space;
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user