Browse Source

theme beauty improved

master
filesite 5 months ago
parent
commit
716a8a8c77
  1. 17
      themes/beauty/controller/ListController.php
  2. 7
      themes/beauty/views/site/index.php
  3. 17
      themes/googleimage/controller/ListController.php
  4. 152
      www/css/beauty.css
  5. 9
      www/js/beauty.js

17
themes/beauty/controller/ListController.php

@ -80,6 +80,21 @@ Class ListController extends Controller { @@ -80,6 +80,21 @@ Class ListController extends Controller {
return $this->render($viewName, $params, $pageTitle);
}
//实现php 5.5开始支持的array_column方法
protected function array_column($arr, $col) {
$out = array();
if (!empty($arr) && is_array($arr) && !empty($col)) {
foreach ($arr as $index => $item) {
if (!empty($item[$col])) {
array_push($out, $item[$col]);
}
}
}
return $out;
}
//根据目录结构以及当前目录获取面包屑
protected function getBreadcrumbs($menus, $subcate) {
$breads = array();
@ -90,7 +105,7 @@ Class ListController extends Controller { @@ -90,7 +105,7 @@ Class ListController extends Controller {
'url' => $subcate['path'],
]);
$foundKey = array_search($subcate['pid'], array_column($menus, 'id'));
$foundKey = array_search($subcate['pid'], $this->array_column($menus, 'id'));
if ($foundKey !== false) {
array_unshift($breads, [
'id' => $menus[$foundKey]['id'],

7
themes/beauty/views/site/index.php

@ -13,8 +13,8 @@ @@ -13,8 +13,8 @@
</div>
<a class="navbar-brand" href="/">
<img class="verMiddle" src="/content/machete_icon.png" alt="logo图片">
<span class="verMiddle">FileSite图片站</span>
<!--img class="verMiddle" src="/content/machete_icon.png" alt="logo图片"-->
<span class="verMiddle">家庭相册</span>
</a>
</div>
<!-- Collect the nav links, forms, and other content for toggling -->
@ -41,10 +41,9 @@ eof; @@ -41,10 +41,9 @@ eof;
<button type="submit" class="btn btn-default">Submit</button>
</form>
*/ ?>
<div class="nb_right nav navbar-nav navbar-right">
<div class="nb_right nav navbar-nav navbar-right hidden-xs">
<img class="svg icon1 svgimg lampJS verMiddle" src="/img/beauty/buld.svg" alt="点击关灯/开灯" title="点击关灯/开灯">
<img class="icon1 svg connectmeJS svgimg iconr2 verMiddle" src="/img/beauty/contactUs.svg" alt="联系我们" title="联系我们" />
</div>
</div><!-- /.navbar-collapse -->
</div><!-- /.container-fluid -->

17
themes/googleimage/controller/ListController.php

@ -80,6 +80,21 @@ Class ListController extends Controller { @@ -80,6 +80,21 @@ Class ListController extends Controller {
return $this->render($viewName, $params, $pageTitle);
}
//实现php 5.5开始支持的array_column方法
protected function array_column($arr, $col) {
$out = array();
if (!empty($arr) && is_array($arr) && !empty($col)) {
foreach ($arr as $index => $item) {
if (!empty($item[$col])) {
array_push($out, $item[$col]);
}
}
}
return $out;
}
//根据目录结构以及当前目录获取面包屑
protected function getBreadcrumbs($menus, $subcate) {
$breads = array();
@ -90,7 +105,7 @@ Class ListController extends Controller { @@ -90,7 +105,7 @@ Class ListController extends Controller {
'url' => $subcate['path'],
]);
$foundKey = array_search($subcate['pid'], array_column($menus, 'id'));
$foundKey = array_search($subcate['pid'], $this->array_column($menus, 'id'));
if ($foundKey !== false) {
array_unshift($breads, [
'id' => $menus[$foundKey]['id'],

152
www/css/beauty.css

@ -1,29 +1,29 @@ @@ -1,29 +1,29 @@
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0;font-size:14px;}
.clearfix{zoom:1;}
.clearfix:after{content:'.';display:block;visibility:hidden;clear:both;overflow:hidden;height:0px;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,select,p,blockquote,th,td{margin:0;padding:0;font-size:14px}
.clearfix{zoom:1}
.clearfix:after{content:'.';display:block;visibility:hidden;clear:both;overflow:hidden;height:0px}
body{position:relative;font-family: ;
word-break: break-all;
word-wrap: break-word;background-color:#FFF;font-size:14px;line-height:1.428571429;}
ul,li{list-style:none;margin:0;padding:0;}
img,span{display:inline-block;max-width:100%;}
a{color:#464c5c;}
.img-responsive{max-width:100%;display:block;}
.elementBlock{display:block !important;}
.elementNone{display:none !important;}
.elementhidden{visibility:hidden !important;}
.verMiddle{vertical-align:middle !important;}
.vercenter{text-align:center !important;}
.verbold{font-weight:bold !important;}
.opacityshow{opacity:1 !important;}
.qcmargin{margin:0 !important;}
a:hover{text-decoration:none;}
a:active{text-decoration:none;}
a:visited{text-decoration:none;}
a:link{text-decoration:none;}
word-wrap: break-word;background-color:#FFF;font-size:14px;line-height:1.428571429}
ul,li{list-style:none;margin:0;padding:0}
img,span{display:inline-block;max-width:100%}
a{color:#464c5c}
.img-responsive{max-width:100%;display:block}
.elementBlock{display:block !important}
.elementNone{display:none !important}
.elementhidden{visibility:hidden !important}
.verMiddle{vertical-align:middle !important}
.vercenter{text-align:center !important}
.verbold{font-weight:bold !important}
.opacityshow{opacity:1 !important}
.qcmargin{margin:0 !important}
a:hover{text-decoration:none}
a:active{text-decoration:none}
a:visited{text-decoration:none}
a:link{text-decoration:none}
.lampshow{background-color:#222}
.main_style{padding-top:64px;}
.main_style{padding-top:64px}
.navbar-default {
background-color:#FFF;
}
@ -39,66 +39,67 @@ a:link{text-decoration:none;} @@ -39,66 +39,67 @@ a:link{text-decoration:none;}
text-shadow:1px 1px 0 rgb(122 122 122),
1px 1px 5px rgb(183 183 183 / 80%);
}
.navbar .navbar-brand img{width:30px;display:inline-block;}
/* .navbar{box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, .6);} */
.navbar .navbar-toggle{padding:0;border:none;margin-top:10px;}
.navbar .mr_button{border:none;background:none;}
.svgimg{width:2em;height:2em;vertical-align:middle;fill: currentColor;overflow: hidden;}
.svgimg2{width: 1.8em;height: 1.8em;}
.navbar .svg{cursor:pointer;color: #6c6c6c;}
.navbar .svg:hover{color:#000;}
.navbar .navbar-brand img{width:30px;display:inline-block}
/* .navbar{box-shadow: 0px 0px 5px 1px rgba(0, 0, 0, .6)} */
.navbar .navbar-toggle{padding:0;border:none;margin-top:10px}
.navbar .mr_button{border:none;background:none}
.svgimg{width:2em;height:2em;vertical-align:middle;fill: currentColor;overflow: hidden}
.svgimg2{width: 1.8em;height: 1.8em}
.navbar .svg{cursor:pointer;color: #6c6c6c}
.navbar .svg:hover{color:#000}
.navbar .navbar-toggle:focus,
.navbar .navbar-toggle:hover{background:none;}
.nb_right{padding:10px 2% 0 0;}
.nb_right .iconr2{margin:3px 0 0 10px;}
.im_mainl{margin:0 10px 12px 10px;}
.bor_radius{border-radius:10px;}
.im_img{transform:scale(1);transition:all 0.5s ease;object-fit:cover;display:block;width:100%;height:100%;}
.im_img:hover{transform:scale(1.03);}
.im_item{padding:5px;height:16vw;overflow:hidden;}
.im_item>a{overflow: hidden;display:block;position:relative;width: 100%;height: 100%;}
.im_img_title{background:rgba(7, 7, 7, .3);position:absolute;left:0;right:0;bottom:0;top:0;color:#FFF;border-radius:10px;}
.im_item:hover .im_img{transform:scale(1.03);}
.im_img_title span{position:absolute;bottom:10px;left:10px;margin-right:10px;font-weight:bold;padding:5px;border:solid 2px #FFF;border-radius:10px;}
.web_info{padding:10px 0 42px 0;margin-top:15px;border-top:solid 1px #f5f5f5;}
.web_info p{color:#808080;font-size:13px;margin:5px 0;}
.web_info a{text-decoration: underline;color:#808080;}
.web_info a:hover{color:#000;}
.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:hover{background:rgba(209, 209, 209, 1);color:#3e3d3d;}
.scroll_top{display:none;}
.btrt_side_ul .svg{width:18px;cursor:pointer;}
.btrt_side_ul .icon3{width:26px;}
.navbar .navbar-toggle:hover{background:none}
.nb_right{padding:10px 2% 0 0}
.nb_right .iconr2{margin:3px 0 0 10px}
.img_main{min-height:510px}
.im_mainl{margin:0 10px 12px 10px}
.bor_radius{border-radius:10px}
.im_img{transform:scale(1);transition:all 0.5s ease;object-fit:cover;display:block;width:100%;height:100%}
.im_img:hover{transform:scale(1.03)}
.im_item{padding:5px;height:16vw;overflow:hidden}
.im_item>a{overflow: hidden;display:block;position:relative;width: 100%;height: 100%}
.im_img_title{background:rgba(7, 7, 7, .3);position:absolute;left:0;right:0;bottom:0;top:0;color:#FFF;border-radius:10px}
.im_item:hover .im_img{transform:scale(1.03)}
.im_img_title span{position:absolute;bottom:10px;left:10px;margin-right:10px;font-weight:bold;padding:5px;border:solid 2px #FFF;border-radius:10px}
.web_info{padding:10px 0 42px 0;margin-top:15px;border-top:solid 1px #f5f5f5}
.web_info p{color:#808080;font-size:13px;margin:5px 0}
.web_info a{text-decoration: underline;color:#808080}
.web_info a:hover{color:#000}
.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:hover{background:rgba(209, 209, 209, 1);color:#3e3d3d}
.scroll_top{display:none}
.btrt_side_ul .svg{width:18px;cursor:pointer}
.btrt_side_ul .icon3{width:26px}
/* 音乐相关 */
.music_put{animation:musicTurn 3s linear infinite;}
.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}
.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>h5{display:flex;padding:15px 0 10px 0;border-bottom:solid 1px #e9e2e2;margin-bottom:20px;}
.right_sidebox>h5 span{font-size:20px;font-weight:bold;flex: 1;}
.right_sidebox .link{text-decoration: underline;color:#457fc1;}
.right_sidebox .sort1{font-size:16px;font-weight:bold;margin-top:10px;}
.right_sidebox p{margin:5px 0;}
.right_sidebox .codeimg{width:48%;}
.sideboxShow{animation:bounceInRight 0.5s ease forwards;}
.page_meta{padding:10px 0 0 0;}
.page_meta .breadcrumb{background:none;display: inline-block;padding:8px 0 8px 0;margin:0;}
.breadcrumbs{padding-left:1.5em;padding-bottom:10px;font-size:13px;}
.breadcrumbs small{font-size:13px;}
.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>h5{display:flex;padding:15px 0 10px 0;border-bottom:solid 1px #e9e2e2;margin-bottom:20px}
.right_sidebox>h5 span{font-size:20px;font-weight:bold;flex: 1}
.right_sidebox .link{text-decoration: underline;color:#457fc1}
.right_sidebox .sort1{font-size:16px;font-weight:bold;margin-top:10px}
.right_sidebox p{margin:5px 0}
.right_sidebox .codeimg{width:48%}
.sideboxShow{animation:bounceInRight 0.5s ease forwards}
.page_meta{padding:10px 0 0 0}
.page_meta .breadcrumb{background:none;display: inline-block;padding:8px 0 8px 0;margin:0}
.breadcrumbs{padding-left:1.5em;padding-bottom:10px;font-size:13px}
.breadcrumbs small{font-size:13px}
/* 主题切换 */
.lampshow .web_info{border-color:#363636;}
.lampshow .btrt_side_ul li{background-color:#181818;}
.lampshow .right_sidebox{background-color:#222;color:#FFF;}
.lampshow .right_sidebox>h5{border-color: #363636;}
.lampshow .text_dark{color:#808080;}
.lampshow .text_dark a{color:#f4f7fd;}
.lampshow .web_info{border-color:#363636}
.lampshow .btrt_side_ul li{background-color:#181818}
.lampshow .right_sidebox{background-color:#222;color:#FFF}
.lampshow .right_sidebox>h5{border-color: #363636}
.lampshow .text_dark{color:#808080}
.lampshow .text_dark a{color:#f4f7fd}
@media screen and (max-width: 1199px) {
@ -117,6 +118,7 @@ a:link{text-decoration:none;} @@ -117,6 +118,7 @@ a:link{text-decoration:none;}
.im_item {
height: 45vw;
}
.hidden-xs{display:none}
}
@keyframes musicTurn {

9
www/js/beauty.js

@ -25,13 +25,20 @@ if ($('#image_site').get(0)) { @@ -25,13 +25,20 @@ if ($('#image_site').get(0)) {
// 返回顶部
var scrolltop = $('#image_site .scroll_topJS');
var timer_icon_fade = null;
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
if (timer_icon_fade) {clearTimeout(timer_icon_fade);}
timer_icon_fade = setTimeout(function() {
if ($(window).scrollTop() > 100) {
scrolltop.fadeIn();
} else {
scrolltop.fadeOut();
}
}, 100);
});
scrolltop.on('touchstart click', function () {
$('html, body').animate({ scrollTop: 0 }, 380);
return false;

Loading…
Cancel
Save