站点前台设置面板（切换字体、选择滤镜、夜间模式的开关）

3 files changed, 41 insertions, 10 deletions

diff --git a/includes/footer.php b/includes/footer.php
index 671ee49..b7f5ec4 100644
--- a/includes/footer.php
+++ b/includes/footer.php
@@ -10,8 +10,7 @@
     </footer>
 	<!-- 悬浮按钮 -->
 	<div class="fixed-tools">
-	  <button onclick="GoTop()" title="返回顶部" class="gotop-button"  style="color:white;"><i class="iconfont icon-chevron-up"></i></button>
-	  <button onclick="Dark()" title="护眼模式" class="dark-button"><i class="iconfont icon-envira"></i></button>
+	  <button onclick="GoTop()" title="返回顶部" class="fixed-button gotop-button"  style="color:white;"><i class="iconfont icon-chevron-up"></i></button>
 	</div>
 	<!-- JavaScript -->
 	<?php if($this->options->CDN && $this->options->CDN=1): ?>
@@ -42,4 +41,4 @@
 	<script>LazyLoad();PrismLoad();owoLoad();<?php $this->options->jsEcho(); ?></script>
 	<?php $this->footer(); ?>
   </body>
-</html>
+</html>
\ No newline at end of file
diff --git a/includes/head.php b/includes/head.php
index 725841a..34d2ece 100644
--- a/includes/head.php
+++ b/includes/head.php
@@ -62,7 +62,7 @@ if (isset($_POST['action'])) {
 	<link rel="stylesheet" href="<?php Utils::indexTheme('assets/css/dark.miracles.css'); ?>" />
 	<?php endif; ?>
 	<!-- icon font -->
-	<link rel="stylesheet" href="//at.alicdn.com/t/font_1165190_q4ccniy74h.css" />
+	<link rel="stylesheet" href="//at.alicdn.com/t/font_1165190_oo2f2wsibld.css" />
 	<!-- Google Fonts -->
 	<link href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:300|Noto+Serif+SC:300&display=swap" rel="stylesheet">
 	<style>.body-dark .pio-action .pio-home{background-image: url(<?php Utils::indexTheme('images/icons/home.png'); ?>);}.body-dark .pio-action .pio-close{background-image: url(<?php Utils::indexTheme('images/icons/remove.png'); ?>);}.body-dark .pio-action .pio-skin{background-image: url(<?php Utils::indexTheme('images/icons/skin.png'); ?>);}.body-dark .pio-action .pio-info{background-image: url(<?php Utils::indexTheme('images/icons/info.png'); ?>);}.body-dark .pio-action .pio-night{background-image: url(<?php Utils::indexTheme('images/icons/night.png'); ?>);}@media (min-width:992px) {.search{background-image:url(<?php Utils::indexTheme('images/search.png'); ?>);}.login{background-image:url(<?php Utils::indexTheme('images/login.png'); ?>)}}.search {background-position: bottom right;background-repeat: no-repeat}.login {background-position: bottom left;background-repeat:no-repeat}<?php $this->options->cssEcho(); ?></style>
diff --git a/includes/header.php b/includes/header.php
index 2fca1a0..0c1adc3 100644
--- a/includes/header.php
+++ b/includes/header.php
@@ -41,9 +41,42 @@
 		  <p>&copy; <?php echo date('Y'); ?> <a href="<?php $this->options->SiteUrl(); ?>"><?php $this->options->title(); ?></a> | Theme <a href="https://github.com/BigCoke233/miracles">Miracles</a></p>
 		</div>
 	  </div>
-	  
+	  <!-- 前台设置 -->
+	  <div class="options ready">
+	    <div class="options-content">
+	      <div class="options-family container-fluid">
+		    <div class="row">
+			  <div class="col-6 options-family-serif">
+			    <button onclick="ChangeToSerif()" class="<?php if($this->options->bodyFonts && $this->options->bodyFonts=1): ?>options-button-active <?php endif; ?>options-family-button options-serif-button body-serif">Serif</button>
+			  </div>
+			  <div class="col-6 options-family-sans">
+			    <button onclick="ChangeToSansSerif()" class="<?php if($this->options->bodyFonts && $this->options->bodyFonts=1): ?><?php else: ?>options-button-active <?php endif; ?>options-family-button options-sans-button" style="font-family: 'Noto Sans SC',sans-serif">Sans Serif</button>
+			  </div>
+		    </div>
+		  </div>
+	    </div>
+		<hr>
+		<div class="options-content">
+		  <div class="options-themes container-fluid">
+		    <div class="row">
+			  <div class="col-4 options-theme-item">
+			    <button class="options-theme-button options-theme-dark" onclick="Dark()"></button>
+				<span class="options-theme-label">黑夜模式</span>
+			  </div>
+			  <div class="col-4 options-theme-item">
+			    <button class="options-theme-button options-theme-sepia" onclick="Sepia()"></button>
+				<span class="options-theme-label">日落模式</span>
+			  </div>
+		      <div class="col-4 options-theme-item">
+			    <button class="options-theme-button options-theme-normal" onclick="Gray()"></button>
+				<span class="options-theme-label">黑白滤镜</span>
+			  </div>
+			</div>
+		  </div>
+		</div>
+	  </div>
 	  <!-- 导航 -->
-	  <!-- > 大屏幕导航 -->
+	  <!-- -大屏幕导航 -->
       <nav class="large-screen nav<?php if($this->options->nav_position && $this->options->nav_position=1): ?> nav-fixed<?php endif; ?>">
 	    <div class="container">
 		  <p class="nav-content">
@@ -55,9 +88,10 @@
 		  </p>
 		  <button class="nav-icon-button search-button" onclick="Search()"><i class="iconfont icon-chaxun"></i></button>
 		  <button class="nav-icon-button login-button" onclick="Login()"><i class="iconfont icon-user"></i></button>
+		  <button class="nav-icon-button setting-button" onclick="toggleOptions()"><i class="iconfont icon-settings"></i></button>
 		</div>
 	  </nav>
-	  <!--> 小屏幕导航 -->
+	  <!-- -小屏幕导航 -->
 	  <nav class="small-screen nav nav-mobile<?php if($this->options->nav_position && $this->options->nav_position=1): ?> nav-fixed<?php endif; ?>">
         <div class="nav-mobile-content">
 		  <a href="<?php $this->options->SiteUrl(); ?>" style="float:left"><i class="iconfont icon-xuanzhongshangcheng"></i></a>
@@ -83,9 +117,7 @@
 				<?php elseif($this->is('post') || $this->is('page')): ?>
 				<h1><?php $this->title(); ?></h1>
 		        <p class="header-meta"><?php if($this->is('post')): ?><i class="iconfont icon-block"></i> <?php $this->category(','); ?>&emsp;<?php endif; ?><i class="iconfont icon-comments"></i> <?php $this->commentsNum('None', 'Only 1', '%d'); ?>&emsp;<i class="iconfont icon-clock"></i> <?php $this->date(); ?></p>
-				<?php else: ?>
-				
-				<?php endif; ?>
+				<?php else: ?><?php endif; ?>
 			  </div>
 			</div>
 		  </div>