mirrors/sakura
1
0
Fork 0
mirror of https://github.com/mashirozx/sakura.git synced 2024-11-22 06:48:12 +08:00
Code Issues Projects Releases Wiki Activity

侧栏样式

Browse Source
This commit is contained in:
spirit 2019-11-16 22:08:20 +08:00
parent f02fd4e6c1
commit b31953cecb
6 changed files with 64 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
footer.php
View File

@ -38,17 +38,6 @@
</div>
</div><!-- .site-info -->
</footer><!-- #colophon -->
<?php if (akina_option('sakura_widget')) : ?>
<aside id="secondary" class="widget-area" role="complementary" style="left: -400px;">
<button class="show_hide faa-parent animated-hover">
<i class="fa fa-magic faa-vertical" aria-hidden="true"></i>
</button>
<div class="heading"><?php _e('Widgets') /*小工具*/ ?></div>
<div class="sakura_widget">
<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('sakura_widget')) : endif; ?>
</div>
</aside>
<?php endif; ?>
<div class="openNav no-select">
<div class="iconflat no-select">
<div class="icon"></div>
@ -150,16 +139,25 @@
</div>
</div>
<canvas id="night-mode-cover"></canvas>
<?php if (akina_option('sakura_widget')) : ?>
<aside id="secondary" class="widget-area" role="complementary" style="left: -400px;">
<div class="heading"><?php _e('Widgets') /*小工具*/ ?></div>
<div class="sakura_widget">
<?php if (function_exists('dynamic_sidebar') && dynamic_sidebar('sakura_widget')) : endif; ?>
</div>
<div class="show-hide-wrap"><button class="show-hide"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 32 32"><path d="M22 16l-10.105-10.6-1.895 1.987 8.211 8.613-8.211 8.612 1.895 1.988 8.211-8.613z"></path></svg></button></div>
</aside>
<?php endif; ?>
<?php if (akina_option('playlist_id', '')): ?>
<div id="aplayer-float" style="z-index: 100;"
<div id="aplayer-float" style="z-index: 100;"
class="aplayer"
data-id="<?php echo akina_option('playlist_id', ''); ?>"
data-server="netease"
data-type="playlist"
data-fixed="true"
data-theme="orange">
</div>
<style>.skin-menu{left:auto;right:10px;}.changeSkin-gear{left:auto;right:5px;}</style>
</div>
<style>.skin-menu{left:auto;right:10px;}.changeSkin-gear{left:auto;right:5px;}</style>
<?php endif; ?>
</body>
</html>

4
js/sakura-app.js
View File

@ -798,12 +798,14 @@ if (mashiro_option.float_player_on) {
maxHeight: '250px'
});
$(".aplayer.aplayer-fixed .aplayer-body").removeClass("ap-hover");
$("#secondary").addClass("active");
apSwitchTag = 1;
} else {
aplayerlist.css({
maxHeight: '0px'
});
$(".aplayer.aplayer-fixed .aplayer-body").addClass("ap-hover");
$("#secondary").removeClass("active");
apSwitchTag = 0;
}
});
@ -978,7 +980,7 @@ function mail_me() {
function activate_widget(){
if (document.body.clientWidth > 860) {
$('.show_hide').on('click', function() {
$('.show-hide').on('click', function() {
$("#secondary").toggleClass("active")
});
}else{

2
languages/en_US.po
View File

@ -130,7 +130,7 @@ msgstr ""
msgid "Site"
msgstr ""
#: footer.php:46
#: footer.php:144
msgid "Widgets"
msgstr ""

2
languages/sakura.pot
View File

@ -130,7 +130,7 @@ msgstr ""
msgid "Site"
msgstr ""
#: footer.php:46
#: footer.php:144
msgid "Widgets"
msgstr ""

2
languages/zh_CN.po
View File

@ -130,7 +130,7 @@ msgstr "禁止小广告😀"
msgid "Site"
msgstr "网站"
#: footer.php:46
#: footer.php:144
msgid "Widgets"
msgstr "小工具"

52
style.css
View File

@ -8502,8 +8502,8 @@ h1[id*=toc-head]::before,h2[id*=toc-head]::before,h3[id*=toc-head]::before,h4[id
.widget-area {
position: fixed;
top: calc(100% - 132px);
bottom: 10%;
top: 100px;
bottom: 66px;
left: -400px;
z-index: 3;
width: 400px;
@ -8513,9 +8513,8 @@ h1[id*=toc-head]::before,h2[id*=toc-head]::before,h3[id*=toc-head]::before,h4[id
box-shadow: 0 1px 20px -8px rgba(0,0,0,.5);
z-index: 50;
}
.widget-area.active{
top: 100px;
bottom: 80px;
left: -1px !important;
}
@ -8545,18 +8544,47 @@ h1[id*=toc-head]::before,h2[id*=toc-head]::before,h3[id*=toc-head]::before,h4[id
border-color: #ddd;
}
.widget-area .show_hide{
.widget-area .show-hide-wrap{
position: absolute;
right: -42px;
height: 30px;
background: #f5f5f5;
border-color: #ddd;
background: #e6e6e6;
right: -18px;
width: 18px;
height: 66px;
border-radius: 0 6px 6px 0;
z-index: 50;
}
.active .show-hide-wrap {
width: 100%;
right: 0;
transition: all .3s ease;
}
.widget-area .show-hide{
display: inline-block;
width: 100%;
height: 100%;
font-size: 12px;
outline:none;
box-shadow: none;
border: none;
border-left-width: 0;
opacity: .8;
vertical-align: middle;
padding: 0;
margin: 0;
-webkit-transform: rotateY(0);
transform: rotateY(0);
cursor: pointer;
border-radius: 0 6px 6px 0;
transition: all .3s ease;
}
.widget-area .show_hide .fa{
font-size: 20px;
.widget-area.active .show-hide{
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}
.widget-area .show-hide svg{
width: 100%;
height: 100%;
}