sookie/blog-web
1
0
Fork 0
Code Issues 12 Pull Requests Projects Releases Wiki Activity

移动端加入夜间模式开关

Browse Source
This commit is contained in:
结发受长生 2019-05-23 11:08:31 +08:00
parent 9fe33ed376
commit d6c8ad854b
4 changed files with 16 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
themes/yilia/layout/layout.ejs
View File

@ -7,7 +7,12 @@
<%- partial('_partial/live2d') %> <%- partial('_partial/live2d') %>
</div> </div>
<div class="btnctn js-mobile-btnctn"> <div class="btnctn js-mobile-btnctn">
<div class="slider-trigger list" @click="openSlider($event, 'innerArchive', true)"><i class="icon icon-list"></i></div> <div class="slider-trigger" @click="openSlider($event, 'innerArchive', true)">
<i class="icon icon-list"></i>
</div>
<div class="slider-trigger" @click="toolsClick('tools.eye')">
<i class="icon icon-eye"></i>
</div>
</div> </div>
<div class="mid-col" :class="{show: isShow,hide: isShow!==undefined && !isShow}"> <div class="mid-col" :class="{show: isShow,hide: isShow!==undefined && !isShow}">
<%- partial('_partial/mobile-nav', null, {cache: !config.relative_link}) %> <%- partial('_partial/mobile-nav', null, {cache: !config.relative_link}) %>

10
themes/yilia/source-src/css/grid.scss
View File

@ -20,15 +20,13 @@ html, body, #container {
#container{ #container{
position:relative; position:relative;
min-height:100%; min-height:100%;
background: linear-gradient(200deg,#5aa5c6,#a4854b);
.anm-canvas { .anm-canvas {
display: none; display: none;
} }
&.show { &.show .anm-canvas {
background: linear-gradient(200deg,#5aa5c6,#a4854b); display: block;
.anm-canvas { position: fixed;
display: block;
position: fixed;
}
} }
} }
.body-wrap{ .body-wrap{

20
themes/yilia/source-src/css/mobile.scss
View File

@ -55,25 +55,15 @@
} }
.btnctn{ .btnctn{
position: fixed; position: fixed;
width: 50px;
height: 50px;
z-index: 4; z-index: 4;
.slider-trigger{ .slider-trigger{
position: absolute; width: 35px;
z-index: 101; height: 35px;
width: 42px;
height: 42px;
text-align: center; text-align: center;
line-height: 50px; line-height: 40px;
&.back { background-color: rgba(100,100,100,0.7);
top: 0;
left: 0;
}
&.list {
background-color: rgba(100,100,100,0.7)
}
.icon{ .icon{
font-size: 24px; font-size: 20px;
color: #fff; color: #fff;
} }
} }

2
themes/yilia/source-src/css/night.scss
View File

@ -41,7 +41,7 @@ $textColor_night: #d5d5d5; // 文字颜色
body.night { body.night {
background: $mainBg_night; background: $mainBg_night;
// 展开菜单之后的背景 // 展开菜单之后的背景
#container.show { #container {
background: none; background: none;
} }
// 主背景 // 主背景