filesite
/
machete
1
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

优化，修改，增加音乐

master
wen 2 years ago
parent
495b6e50e3
commit
dd16343204
7 changed files with 135 additions and 81 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 19
      themes/beauty/views/layout/main.php
  2. 44
      themes/beauty/views/site/index.php
  3. 18
      www/css/beauty.css
  4. 2
      www/img/beauty/contactUs.svg
  5. 2
      www/img/beauty/music.svg
  6. 25
      www/js/beauty.js
  7. 4
      www/js/jquery-3.1.1.min.js

19
themes/beauty/views/layout/main.php
Unescape View File

@ -2,8 +2,10 @@
//常用方法 //常用方法
require_once __DIR__ . '/../../../../plugins/Html.php'; require_once __DIR__ . '/../../../../plugins/Html.php';
?><!DocType html> ?>
<!DocType html>
<html> <html>
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<title><?php echo $pageTitle; ?></title> <title><?php echo $pageTitle; ?></title>
@ -12,11 +14,12 @@ require_once __DIR__ . '/../../../../plugins/Html.php';
<link rel="icon" type="image/x-icon" href="/favicon.ico?v1.0"> <link rel="icon" type="image/x-icon" href="/favicon.ico?v1.0">
<link href="/css/main.css?v.1.1" rel="stylesheet"> <link href="/css/main.css?v.1.1" rel="stylesheet">
<!--for theme beauty--> <!--for theme beauty-->
<link href="/css/github-markdown-light.css" rel="stylesheet" id="markdowncss">
<link href="/css/bootstrap.min.css" rel="stylesheet"> <link href="/css/bootstrap.min.css" rel="stylesheet">
<link href="/css/fubox.min.css" rel="stylesheet"> <link href="/css/fubox.min.css" rel="stylesheet">
<link href="/css/beauty.css?v<?= Html::getStaticFileVersion('beauty.css', 'css') ?>" rel="stylesheet"> <link href="/css/beauty.css?v<?= Html::getStaticFileVersion('beauty.css', 'css') ?>" rel="stylesheet">
<link href="/css/github-markdown-light.css" rel="stylesheet" id="markdowncss">
</head> </head>
<body> <body>
<div id="image_site" class="main_style"> <div id="image_site" class="main_style">
@ -67,18 +70,26 @@ eof;
<li class="scroll_top scroll_topJS"> <li class="scroll_top scroll_topJS">
<img class="icon svg" src="/img/beauty/huojian.svg" alt="回到顶部" title="点击回到顶部" /> <img class="icon svg" src="/img/beauty/huojian.svg" alt="回到顶部" title="点击回到顶部" />
</li> </li>
<li class="music_switch musicJS">
<img class="icon svg verMiddle" src="/img/beauty/music.svg" alt="音乐" title="开启关闭音乐" />
</li>
<li class="connectmeJS"> <li class="connectmeJS">
<img class="icon svg verMiddle" src="/img/beauty/scrolltop.svg" alt="联系我们" title="联系我们" /> <img class="icon3 svg verMiddle" src="/img/beauty/contactUs.svg" alt="联系我们" title="联系我们" />
</li> </li>
</ul> </ul>
</div> </div>
<!-- 音乐 -->
<audio class="music_main musicMJS" id="music_main" src="/girls/Unchained_Melody.mp3?ver=1667213175" preload autoplay controls loop>
你的浏览器不支持<code>audio</code>标签
</audio>
</div> </div>
<!--for theme googleimage--> <!--for theme googleimage-->
<script src="/js/jquery-3.6.0.min.js"></script> <script src="/js/jquery-3.1.1.min.js"></script>
<script src="/js/bootstrap.min.js"></script> <script src="/js/bootstrap.min.js"></script>
<script src="/js/lazyload.js"></script> <script src="/js/lazyload.js"></script>
<script src="/js/fubox.min.js"></script> <script src="/js/fubox.min.js"></script>
<script src="/js/beauty.js?v<?= Html::getStaticFileVersion('beauty.js', 'js') ?>"></script> <script src="/js/beauty.js?v<?= Html::getStaticFileVersion('beauty.js', 'js') ?>"></script>
</body> </body>
</html> </html>

44
themes/beauty/views/site/index.php
Unescape View File

@ -5,8 +5,8 @@
<div class="navbar-header"> <div class="navbar-header">
<div class="navbar-toggle"> <div class="navbar-toggle">
<img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯"> <img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯">
<button type="button" class="collapsed mr_button" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" <img class="icon1 svg connectmeJS svgimg iconr2 verMiddle" src="/img/beauty/contactUs.svg" alt="联系我们" title="联系我们" />
aria-expanded="false"> <button type="button" class="collapsed mr_button" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<span class="sr-only">Toggle navigation</span> <span class="sr-only">Toggle navigation</span>
<img class="svg icon1 svgimg verMiddle" src="/img/beauty/navshow.svg" alt="展开列表" title="展开列表"> <img class="svg icon1 svgimg verMiddle" src="/img/beauty/navshow.svg" alt="展开列表" title="展开列表">
</button> </button>
@ -43,7 +43,7 @@ eof;
*/ ?> */ ?>
<div class="nb_right nav navbar-nav navbar-right"> <div class="nb_right nav navbar-nav navbar-right">
<img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯"> <img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯">
<img class="icon1 svg connectmeJS svgimg svgimg2 iconr2 verMiddle" src="/img/beauty/scrolltop.svg" alt="联系我们" title="联系我们"> <img class="icon1 svg connectmeJS svgimg iconr2 verMiddle" src="/img/beauty/contactUs.svg" alt="联系我们" title="联系我们" />
</div> </div>
</div><!-- /.navbar-collapse --> </div><!-- /.navbar-collapse -->
@ -82,19 +82,19 @@ eof;
$imgExts = !empty(FSC::$app['config']['supportedImageExts']) ? FSC::$app['config']['supportedImageExts'] : array('jpg', 'jpeg', 'png', 'webp', 'gif'); $imgExts = !empty(FSC::$app['config']['supportedImageExts']) ? FSC::$app['config']['supportedImageExts'] : array('jpg', 'jpeg', 'png', 'webp', 'gif');
$category = !empty($viewData['scanResults'][$selectedId]) ? $viewData['scanResults'][$selectedId] : []; $category = !empty($viewData['scanResults'][$selectedId]) ? $viewData['scanResults'][$selectedId] : [];
//当前目录的描述介绍 // //当前目录的描述介绍
if (!empty($category['description'])) { // if (!empty($category['description'])) {
echo <<<eof // echo <<<eof
<p class="modal-body">{$category['description']}</p> // <p class="modal-body">{$category['description']}</p>
eof; // eof;
} // }
//当前目录的readme详细介绍 // //当前目录的readme详细介绍
if (!empty($viewData['htmlCateReadme'])) { // if (!empty($viewData['htmlCateReadme'])) {
echo <<<eof // echo <<<eof
<div class="modal-body markdown-body">{$viewData['htmlCateReadme']}</div> // <div class="modal-body markdown-body">{$viewData['htmlCateReadme']}</div>
eof; // eof;
} // }
if (!empty($category['directories'])) { //两级目录支持 if (!empty($category['directories'])) { //两级目录支持
$index = 0; $index = 0;
@ -107,7 +107,7 @@ eof;
if (!empty($dir['snapshot'])) { if (!empty($dir['snapshot'])) {
if ($index > 0) { if ($index > 0) {
echo <<<eof echo <<<eof
<img data-original="{$dir['snapshot']}" class="bor_radius im_img lazy" alt="{$dir['directory']}"> <img src="/img/beauty/lazy.svg" data-original="{$dir['snapshot']}" class="bor_radius im_img lazy" alt="{$dir['directory']}">
eof; eof;
} else { } else {
echo <<<eof echo <<<eof
@ -128,11 +128,11 @@ eof;
if (in_array($first_img['extension'], $imgExts)) { if (in_array($first_img['extension'], $imgExts)) {
if ($index > 0) { if ($index > 0) {
echo <<<eof echo <<<eof
<img data-original="{$first_img['path']}" class="bor_radius im_img lazy" alt="{$first_img['filename']}"> <img src="/img/beauty/lazy.svg" data-original="{$first_img['path']}" class="bor_radius im_img lazy" alt="{$first_img['filename']}">
eof; eof;
} else { } else {
echo <<<eof echo <<<eof
<img src="{$first_img['path']}" class="bor_radius im_img" alt="{$first_img['filename']}"> <img src="/img/beauty/lazy.svg" data-original="{$first_img['path']}" class="bor_radius im_img lazy" alt="{$first_img['filename']}">
eof; eof;
} }
} else { } else {
@ -157,7 +157,9 @@ eof;
if (!empty($category['files'])) { //一级目录支持 if (!empty($category['files'])) { //一级目录支持
$index = 0; $index = 0;
foreach ($category['files'] as $file) { foreach ($category['files'] as $file) {
if (!in_array($file['extension'], $imgExts)) {continue;} if (!in_array($file['extension'], $imgExts)) {
continue;
}
$title = !empty($file['title']) ? $file['title'] : $file['filename']; $title = !empty($file['title']) ? $file['title'] : $file['filename'];
@ -165,7 +167,7 @@ eof;
echo <<<eof echo <<<eof
<div class="im_item bor_radius col-xs-6 col-sm-4 col-md-3 col-lg-2"> <div class="im_item bor_radius col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a href="javascript:;" class="bor_radius" data-fancybox="gallery" data-src="{$file['path']}" data-caption="图片{$title}"> <a href="javascript:;" class="bor_radius" data-fancybox="gallery" data-src="{$file['path']}" data-caption="图片{$title}">
<img src="img/beauty/lazy.svg" data-original="{$file['path']}" class="bor_radius im_img lazy" alt="{$file['filename']}"> <img src="/img/beauty/lazy.svg" data-original="{$file['path']}" class="bor_radius im_img lazy" alt="{$file['filename']}">
</a> </a>
</div> </div>
eof; eof;
@ -173,7 +175,7 @@ eof;
echo <<<eof echo <<<eof
<div class="im_item bor_radius col-xs-6 col-sm-4 col-md-3 col-lg-2"> <div class="im_item bor_radius col-xs-6 col-sm-4 col-md-3 col-lg-2">
<a href="javascript:;" class="bor_radius" data-fancybox="gallery" data-src="{$file['path']}" data-caption="图片{$title}"> <a href="javascript:;" class="bor_radius" data-fancybox="gallery" data-src="{$file['path']}" data-caption="图片{$title}">
<img src="{$file['path']}" class="bor_radius im_img" alt="{$file['filename']}"> <img src="/img/beauty/lazy.svg" class="bor_radius im_img lazy" alt="{$file['filename']}">
</a> </a>
</div> </div>
eof; eof;

18
www/css/beauty.css
Unescape View File

@ -67,11 +67,15 @@ a:link{text-decoration:none;}
.web_info a{text-decoration: underline;color:#808080;} .web_info a{text-decoration: underline;color:#808080;}
.web_info a:hover{color:#000;} .web_info a:hover{color:#000;}
.btrt_side{position:fixed;bottom:46px;right:16px;transition:all 0.5s ease;} .btrt_side{position:fixed;bottom:48px;right:16px;transition:all 0.5s ease;}
.btrt_side_ul li{margin-top:4px;color:#878686;cursor:pointer;width:38px;height: 38px;line-height:38px;border-radius:50%;text-align:center;background-color:#f5f5f5;} .btrt_side_ul li{margin-top:4px;color:#878686;cursor:pointer;width:38px;height: 38px;line-height:38px;border-radius:50%;text-align:center;background-color:#f5f5f5;}
.btrt_side_ul li:hover{background:rgba(209, 209, 209, 1);color:#3e3d3d;} .btrt_side_ul li:hover{background:rgba(209, 209, 209, 1);color:#3e3d3d;}
.scroll_top{display:none;} .scroll_top{display:none;}
.btrt_side_ul li .svg{width:18px;cursor:pointer;} .btrt_side_ul .svg{width:18px;cursor:pointer;}
.btrt_side_ul .icon3{width:26px;}
/* 音乐相关 */
.music_put{animation:musicTurn 3s linear infinite;}
.blank_cover{transition: all 0.5s ease;position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(0, 0, 0, .7);opacity:0;z-index: 1099} .blank_cover{transition: all 0.5s ease;position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(0, 0, 0, .7);opacity:0;z-index: 1099}
.right_sidebox{padding:15px 10px 15px 18px;opacity:0;transform:translateX(101%);background-color:#FFF;position:fixed;right:0;top:0;bottom:0;color:#333;width:396px;overflow-y:auto;max-width:100%;z-index:1100;} .right_sidebox{padding:15px 10px 15px 18px;opacity:0;transform:translateX(101%);background-color:#FFF;position:fixed;right:0;top:0;bottom:0;color:#333;width:396px;overflow-y:auto;max-width:100%;z-index:1100;}
@ -85,13 +89,13 @@ a:link{text-decoration:none;}
.page_meta{padding:10px 0 0 0;} .page_meta{padding:10px 0 0 0;}
.page_meta .breadcrumb{background:none;display: inline-block;padding:8px 0 8px 0;margin:0;} .page_meta .breadcrumb{background:none;display: inline-block;padding:8px 0 8px 0;margin:0;}
.breadcrumbs{padding-left:1.5em;padding-bottom:10px}
/* 主题切换 */ /* 主题切换 */
.lampshow .web_info{border-color:#363636;} .lampshow .web_info{border-color:#363636;}
.lampshow .btrt_side_ul li{background-color:#181818;} .lampshow .btrt_side_ul li{background-color:#181818;}
.lampshow .right_sidebox{background-color:#222;color:#FFF;} .lampshow .right_sidebox{background-color:#222;color:#FFF;}
.lampshow .right_sidebox>h5{border-color: #363636;} .lampshow .right_sidebox>h5{border-color: #363636;}
.lampshow .text_dark{color:#808080;}
@media screen and (max-width: 1199px) { @media screen and (max-width: 1199px) {
.im_item { .im_item {
@ -111,7 +115,15 @@ a:link{text-decoration:none;}
} }
} }
@keyframes musicTurn {
0% {
-webkit-transform: rotate(0deg)
}
100% {
-webkit-transform: rotate(360deg)
}
}
@keyframes bounceInRight { @keyframes bounceInRight {
0%, 0%,
60%, 60%,

2
www/img/beauty/contactUs.svg
Unescape View File

@ -0,0 +1,2 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg class="icon verMiddle" style="color:#6c6c6c;width:2em;height:2em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3661"><path d="M364.5 488.8m-33.8 0a33.8 33.8 0 1 0 67.6 0 33.8 33.8 0 1 0-67.6 0Z" fill="#27A27D" p-id="3662"></path><path d="M512 488.8m-33.8 0a33.8 33.8 0 1 0 67.6 0 33.8 33.8 0 1 0-67.6 0Z" fill="#27A27D" p-id="3663"></path><path d="M659.5 488.8m-33.8 0a33.8 33.8 0 1 0 67.6 0 33.8 33.8 0 1 0-67.6 0Z" fill="#27A27D" p-id="3664"></path><path d="M897.8 488.8C897.8 276.1 724.7 103 512 103S126.2 276.1 126.2 488.8c0 83.4 26.2 162.7 75.7 229.5 7.4 10 21.5 12.1 31.5 4.7s12.1-21.5 4.7-31.5c-43.7-59-66.8-129.1-66.8-202.7C171.2 300.9 324.1 148 512 148s340.8 152.9 340.8 340.8c0 182-143.5 330.7-323.2 339.9-9.9-25-34.2-42.7-62.6-42.7-37.2 0-67.5 30.3-67.5 67.5S429.8 921 467 921c30.2 0 55.5-20 64.1-47.4 203.8-10 366.7-178.5 366.7-384.8zM467 876c-12.4 0-22.5-10.1-22.5-22.5S454.6 831 467 831s22.5 10.1 22.5 22.5S479.4 876 467 876z" p-id="3665"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

2
www/img/beauty/music.svg
Unescape View File

@ -0,0 +1,2 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg class="icon1" style="color:#6c6c6c;width: 2em;height: 2em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2212"><path d="M875.52 433.152q-7.168-1.024-12.8-10.24t-8.704-33.792q-5.12-39.936-26.112-58.88t-65.024-27.136q-46.08-9.216-81.408-37.376t-58.88-52.736q-22.528-21.504-34.816-15.36t-12.288 22.528l0 44.032 0 96.256q0 57.344-0.512 123.904t-0.512 125.952l0 104.448 0 58.368q1.024 24.576-7.68 54.784t-32.768 56.832-64 45.568-99.328 22.016q-60.416 3.072-109.056-21.504t-75.264-61.952-26.112-81.92 38.4-83.456 81.92-54.272 84.992-16.896 73.216 5.632 47.616 13.312l0-289.792q0-120.832 1.024-272.384 0-29.696 15.36-48.64t40.96-22.016q21.504-3.072 35.328 8.704t28.16 32.768 35.328 47.616 56.832 52.224q30.72 23.552 53.76 33.792t43.008 18.944 39.424 20.992 43.008 39.936q23.552 26.624 28.672 55.296t0.512 52.224-14.848 38.4-17.408 13.824z" p-id="2213"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 995 B

25
www/js/beauty.js
Unescape View File

@ -63,12 +63,10 @@ if ($('#image_site').get(0)) {
var lanpnum = 0; var lanpnum = 0;
$('#image_site .lampJS').click(function () { $('#image_site .lampJS').click(function () {
if (lanpnum == 0) { if (lanpnum == 0) {
$('#markdowncss').attr('href', '/css/github-markdown-dark.css');
$(document.body).addClass('lampshow'); $(document.body).addClass('lampshow');
$('#image_site .navbarJS').removeClass('navbar-default').addClass('navbar-inverse'); // 导航栏用bootstrap主题切换 $('#image_site .navbarJS').removeClass('navbar-default').addClass('navbar-inverse'); // 导航栏用bootstrap主题切换
lanpnum = 1; lanpnum = 1;
} else if (lanpnum == 1) { } else if (lanpnum == 1) {
$('#markdowncss').attr('href', '/css/github-markdown-light.css');
$(document.body).removeClass('lampshow'); $(document.body).removeClass('lampshow');
$('#image_site .navbarJS').addClass('navbar-default').removeClass('navbar-inverse'); $('#image_site .navbarJS').addClass('navbar-default').removeClass('navbar-inverse');
lanpnum = 0; lanpnum = 0;
@ -76,4 +74,27 @@ if ($('#image_site').get(0)) {
return; return;
}); });
// 音乐播放
var musicState = 0;
$('#music_main').get(0).volume = 0.5; // 控制音量
$('.musicJS').click(function () {
if (musicState == 0) {
$('#music_main').get(0).play();
$('.musicJS').addClass('music_put');
musicState = 1;
} else {
$('#music_main').get(0).pause();
$('.musicJS').removeClass('music_put');
musicState = 0;
}
return;
})
$(document).one('touchstart mousedown', function () {
$('#music_main').get(0).play();
$('.musicJS').addClass('music_put');
musicState = 1;
});
} }

4
www/js/jquery-3.1.1.min.js vendored
View File

File diff suppressed because one or more lines are too long
Write Preview
Loading…
Cancel
Save