mirror of
https://github.com/next-theme/hexo-theme-next.git
synced 2026-01-17 18:22:33 +00:00
Refactor sidebar-toggle, sidebar-dimmer & back-to-top
This commit is contained in:
parent
0c35aeb729
commit
c7b92c3af8
@ -24,8 +24,6 @@
|
|||||||
{%- endif %}
|
{%- endif %}
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
{{ partial('_partials/widgets.njk', {}, {cache: theme.cache.enable}) }}
|
|
||||||
|
|
||||||
<div class="main-inner {% block class %}{% endblock %}">
|
<div class="main-inner {% block class %}{% endblock %}">
|
||||||
{%- include '_partials/header/sub-menu.njk' -%}
|
{%- include '_partials/header/sub-menu.njk' -%}
|
||||||
{% block content %}{% endblock %}
|
{% block content %}{% endblock %}
|
||||||
@ -40,6 +38,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|
||||||
|
{{ partial('_partials/widgets.njk', {}, {cache: theme.cache.enable}) }}
|
||||||
|
|
||||||
{{ partial('_scripts/index.njk', {}, {cache: theme.cache.enable}) }}
|
{{ partial('_scripts/index.njk', {}, {cache: theme.cache.enable}) }}
|
||||||
{{ partial('_third-party/index.njk', {}, {cache: theme.cache.enable}) }}
|
{{ partial('_third-party/index.njk', {}, {cache: theme.cache.enable}) }}
|
||||||
{{ partial('_third-party/statistics/index.njk', {}, {cache: theme.cache.enable}) }}
|
{{ partial('_third-party/statistics/index.njk', {}, {cache: theme.cache.enable}) }}
|
||||||
|
|||||||
@ -1,10 +1,4 @@
|
|||||||
{% macro render(display_toc) %}
|
{% macro render(display_toc) %}
|
||||||
<div class="toggle sidebar-toggle" role="button">
|
|
||||||
<span class="toggle-line"></span>
|
|
||||||
<span class="toggle-line"></span>
|
|
||||||
<span class="toggle-line"></span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<aside class="sidebar">
|
<aside class="sidebar">
|
||||||
{%- set display_toc = page.toc.enable and display_toc %}
|
{%- set display_toc = page.toc.enable and display_toc %}
|
||||||
{%- if display_toc %}
|
{%- if display_toc %}
|
||||||
@ -46,5 +40,4 @@
|
|||||||
{%- endif %}
|
{%- endif %}
|
||||||
</div>
|
</div>
|
||||||
</aside>
|
</aside>
|
||||||
<div class="sidebar-dimmer"></div>
|
|
||||||
{% endmacro %}
|
{% endmacro %}
|
||||||
|
|||||||
@ -1,3 +1,14 @@
|
|||||||
|
{# Widgets with fixed position #}
|
||||||
|
|
||||||
|
{%- if theme.sidebar.display !== 'remove' and (theme.scheme === 'Muse' or theme.scheme === 'Mist') %}
|
||||||
|
<div class="toggle sidebar-toggle" role="button">
|
||||||
|
<span class="toggle-line"></span>
|
||||||
|
<span class="toggle-line"></span>
|
||||||
|
<span class="toggle-line"></span>
|
||||||
|
</div>
|
||||||
|
<div class="sidebar-dimmer"></div>
|
||||||
|
{%- endif %}
|
||||||
|
|
||||||
{%- if theme.back2top.enable and not theme.back2top.sidebar %}
|
{%- if theme.back2top.enable and not theme.back2top.sidebar %}
|
||||||
<div class="back-to-top" role="button" aria-label="{{ __('accessibility.back_to_top') }}">
|
<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"></i>
|
||||||
|
|||||||
@ -31,7 +31,6 @@
|
|||||||
@import 'sidebar-author-links';
|
@import 'sidebar-author-links';
|
||||||
@import 'sidebar-button';
|
@import 'sidebar-button';
|
||||||
@import 'sidebar-blogroll';
|
@import 'sidebar-blogroll';
|
||||||
@import 'sidebar-dimmer';
|
|
||||||
@import 'sidebar-nav';
|
@import 'sidebar-nav';
|
||||||
@import 'sidebar-toggle';
|
@import 'sidebar-toggle';
|
||||||
@import 'sidebar-toc';
|
@import 'sidebar-toc';
|
||||||
|
|||||||
@ -1,24 +0,0 @@
|
|||||||
.sidebar-dimmer {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
+tablet-mobile() {
|
|
||||||
.sidebar-dimmer {
|
|
||||||
background: black;
|
|
||||||
display: block;
|
|
||||||
height: 100%;
|
|
||||||
left: 0;
|
|
||||||
opacity: 0;
|
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
transition: visibility .4s, opacity .4s;
|
|
||||||
visibility: hidden;
|
|
||||||
width: 100%;
|
|
||||||
z-index: $zindex-1;
|
|
||||||
|
|
||||||
.sidebar-active & {
|
|
||||||
opacity: .7;
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@ -92,3 +92,28 @@ if (hexo-config('sidebar.position') == 'right') {
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.sidebar-dimmer {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
+tablet-mobile() {
|
||||||
|
.sidebar-dimmer {
|
||||||
|
background: black;
|
||||||
|
display: block;
|
||||||
|
height: 100%;
|
||||||
|
left: 0;
|
||||||
|
opacity: 0;
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
transition: visibility .4s, opacity .4s;
|
||||||
|
visibility: hidden;
|
||||||
|
width: 100%;
|
||||||
|
z-index: $zindex-1;
|
||||||
|
|
||||||
|
.sidebar-active & {
|
||||||
|
opacity: .7;
|
||||||
|
visibility: visible;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|||||||
@ -15,10 +15,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar-toggle {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.sidebar-inner {
|
.sidebar-inner {
|
||||||
background: var(--content-bg-color);
|
background: var(--content-bg-color);
|
||||||
border-radius: $border-radius;
|
border-radius: $border-radius;
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user