diff --git a/footer.php b/footer.php index 383c2a5..4303f6f 100644 --- a/footer.php +++ b/footer.php @@ -38,17 +38,6 @@ - - -
@@ -150,16 +139,25 @@
+ + + -
-
- +
+
+ diff --git a/js/sakura-app.js b/js/sakura-app.js index 51bf1e8..c96d6b6 100644 --- a/js/sakura-app.js +++ b/js/sakura-app.js @@ -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{ diff --git a/languages/en_US.po b/languages/en_US.po index d17da4b..8cf2e3c 100644 --- a/languages/en_US.po +++ b/languages/en_US.po @@ -130,7 +130,7 @@ msgstr "" msgid "Site" msgstr "" -#: footer.php:46 +#: footer.php:144 msgid "Widgets" msgstr "" diff --git a/languages/sakura.pot b/languages/sakura.pot index 2a78768..4c51f51 100644 --- a/languages/sakura.pot +++ b/languages/sakura.pot @@ -130,7 +130,7 @@ msgstr "" msgid "Site" msgstr "" -#: footer.php:46 +#: footer.php:144 msgid "Widgets" msgstr "" diff --git a/languages/zh_CN.po b/languages/zh_CN.po index 7d5c135..b9cd753 100644 --- a/languages/zh_CN.po +++ b/languages/zh_CN.po @@ -130,7 +130,7 @@ msgstr "禁止小广告😀" msgid "Site" msgstr "网站" -#: footer.php:46 +#: footer.php:144 msgid "Widgets" msgstr "小工具" diff --git a/style.css b/style.css index edb07d8..d73ba44 100644 --- a/style.css +++ b/style.css @@ -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%; }