diff --git a/assets/css/joe.global.css b/assets/css/joe.global.css new file mode 100644 index 0000000..9dcccce --- /dev/null +++ b/assets/css/joe.global.css @@ -0,0 +1 @@ +.joe_header{position:-webkit-sticky;position:sticky;top:0;z-index:1000;background:var(--background);box-shadow:0 2px 10px 0 rgba(0,0,0,0.1)}.joe_header__above-logo{position:relative;display:flex;align-items:center;height:60px;padding-right:15px;margin-right:15px}.joe_header__above-logo img{max-width:150px;max-height:50px;-o-object-fit:cover;object-fit:cover}.joe_header__above-logo::after{content:'';position:absolute;top:50%;right:0;width:1px;height:20px;background:var(--classC);-webkit-transform:translateY(-50%);transform:translateY(-50%)} diff --git a/assets/css/joe.global.scss b/assets/css/joe.global.scss new file mode 100644 index 0000000..39a175f --- /dev/null +++ b/assets/css/joe.global.scss @@ -0,0 +1,32 @@ +.joe_header { + position: sticky; + top: 0; + z-index: 1000; + background: var(--background); + box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.1); + &__above { + &-logo { + position: relative; + display: flex; + align-items: center; + height: 60px; + padding-right: 15px; + margin-right: 15px; + img { + max-width: 150px; + max-height: 50px; + object-fit: cover; + } + &::after { + content: ''; + position: absolute; + top: 50%; + right: 0; + width: 1px; + height: 20px; + background: var(--classC); + transform: translateY(-50%); + } + } + } +} diff --git a/assets/css/joe.normalize.css b/assets/css/joe.normalize.css new file mode 100644 index 0000000..626ca6e --- /dev/null +++ b/assets/css/joe.normalize.css @@ -0,0 +1 @@ +*{margin:0;padding:0;box-sizing:border-box;outline:none;-webkit-tap-highlight-color:transparent}body{font-size:14px;background:#f5f5f5;font-family:'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif}input[type='text']{-webkit-appearance:none;border-radius:0;font-size:13px;font-weight:500}textarea{resize:none;-webkit-appearance:none}li{list-style:none}a{text-decoration:none}h1,h2,h3,h4,h5,h6{font-weight:500}img{border:0;vertical-align:middle}img[src=''],img:not([src]){border:0;opacity:0}svg,canvas{vertical-align:middle}button{cursor:pointer;-webkit-appearance:none;font-size:13px}table{border-collapse:collapse;border-spacing:0}.joe_container{display:flex;max-width:1140px;margin:0 auto;padding:0 15px}.joe_main{min-width:0;flex:1;padding:15px 0}@media (max-width: 1200px){.joe_container{max-width:960px}}@media (max-width: 992px){.joe_container{max-width:720px}}@media (max-width: 768px){.joe_container{max-width:540px}}@media (max-width: 576px){.joe_container{max-width:100%}}html{--background: #fff;--theme: #f24e4e;--main: #303133;--routine: #606266;--minor: #909399;--seat: #c0c4cc;--classA: #dcdfe6;--classB: #e4e7ed;--classC: #ebeef5;--classD: #f2f6fc;--text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);--box-shadow: 0px 0px 20px -5px rgba(158, 158, 158, 0.22)}html[dark='true']{--background: #303133;--box-shadow: none} diff --git a/assets/css/joe.normalize.scss b/assets/css/joe.normalize.scss new file mode 100644 index 0000000..1de9afe --- /dev/null +++ b/assets/css/joe.normalize.scss @@ -0,0 +1,128 @@ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + outline: none; + -webkit-tap-highlight-color: transparent; +} + +body { + font-size: 14px; + background: #f5f5f5; + font-family: 'Helvetica Neue', Helvetica, 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', '微软雅黑', Arial, sans-serif; +} + +input[type='text'] { + -webkit-appearance: none; + border-radius: 0; + font-size: 13px; + font-weight: 500; +} + +textarea { + resize: none; + -webkit-appearance: none; +} + +li { + list-style: none; +} + +a { + text-decoration: none; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + font-weight: 500; +} + +img { + border: 0; + vertical-align: middle; +} + +img[src=''], +img:not([src]) { + border: 0; + opacity: 0; +} + +svg, +canvas { + vertical-align: middle; +} + +button { + cursor: pointer; + -webkit-appearance: none; + font-size: 13px; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +.joe_container { + display: flex; + max-width: 1140px; + margin: 0 auto; + padding: 0 15px; +} + +.joe_main { + min-width: 0; + flex: 1; + padding: 15px 0; +} + +@media (max-width: 1200px) { + .joe_container { + max-width: 960px; + } +} +@media (max-width: 992px) { + .joe_container { + max-width: 720px; + } +} +@media (max-width: 768px) { + .joe_container { + max-width: 540px; + } +} +@media (max-width: 576px) { + .joe_container { + max-width: 100%; + } +} + +html { + --background: #fff; + + --theme: #f24e4e; + + --main: #303133; + --routine: #606266; + --minor: #909399; + --seat: #c0c4cc; + + --classA: #dcdfe6; + --classB: #e4e7ed; + --classC: #ebeef5; + --classD: #f2f6fc; + + --text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); + + --box-shadow: 0px 0px 20px -5px rgba(158, 158, 158, 0.22); +} + +html[dark='true'] { + --background: #303133; + --box-shadow: none; +} diff --git a/assets/img/logo.png b/assets/img/logo.png new file mode 100644 index 0000000..aa6873d Binary files /dev/null and b/assets/img/logo.png differ diff --git a/assets/js/joe.config.js b/assets/js/joe.config.js index 6083db7..58552e1 100644 --- a/assets/js/joe.config.js +++ b/assets/js/joe.config.js @@ -9,10 +9,8 @@ document.addEventListener("DOMContentLoaded", function () { _item.classList.remove("active"); }); item.classList.add("active"); - let current = item.getAttribute("data-current"); sessionStorage.setItem("joe_config_current", current); - if (current === "joe_notice") { Notice.style.display = "block"; Form.style.display = "none"; @@ -20,7 +18,6 @@ document.addEventListener("DOMContentLoaded", function () { Notice.style.display = "none"; Form.style.display = "block"; } - Content.forEach(function (_item) { _item.style.display = "none"; let flag = _item.classList.contains(current); diff --git a/assets/js/joe.global.js b/assets/js/joe.global.js new file mode 100644 index 0000000..7e7d7c8 --- /dev/null +++ b/assets/js/joe.global.js @@ -0,0 +1 @@ +document.addEventListener('DOMContentLoaded', function () {}); diff --git a/functions.php b/functions.php index 39ad655..d60799d 100644 --- a/functions.php +++ b/functions.php @@ -38,7 +38,7 @@ function themeConfig($form) $JFavicon = new Typecho_Widget_Helper_Form_Element_Textarea( 'JFavicon', NULL, - "https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/img/favicon.ico", + 'https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/img/favicon.ico', '网站 Favicon 设置（非必填）', '介绍：用于设置网站 Favicon，一个好的 Favicon 可以给用户一种很专业的观感
格式：图片 URL地址 或 Base64 地址
@@ -46,4 +46,16 @@ function themeConfig($form) ); $JFavicon->setAttribute('class', 'joe_content joe_image'); $form->addInput($JFavicon); + + $JLogo = new Typecho_Widget_Helper_Form_Element_Textarea( + 'JLogo', + NULL, + 'https://cdn.jsdelivr.net/gh/HaoOuBa/Joe@master/assets/img/logo.png', + '网站 Logo 设置（非必填）', + '介绍：用于设置网站 Logo，一个好的 Logo 能为网站带来有效的流量
+ 格式：图片 URL地址 或 Base64 地址
+ 其他：免费制作 logo 网站 www.uugai.com' + ); + $JLogo->setAttribute('class', 'joe_content joe_image'); + $form->addInput($JLogo); } ?> \ No newline at end of file diff --git a/index.php b/index.php index 68f740d..de1b723 100644 --- a/index.php +++ b/index.php @@ -6,3 +6,22 @@ * @author Joe * @link https://ae.js.cn */ + +?> + + + + + + need('public/include.php'); ?> + + + +
+ need('public/header.php'); ?> + + need('public/footer.php'); ?> +
+ + + \ No newline at end of file diff --git a/public/footer.php b/public/footer.php new file mode 100644 index 0000000..e69de29 diff --git a/public/header.php b/public/header.php new file mode 100644 index 0000000..222fb74 --- /dev/null +++ b/public/header.php @@ -0,0 +1,11 @@ +
+ + +
+
+ +
+
+
\ No newline at end of file diff --git a/public/include.php b/public/include.php new file mode 100644 index 0000000..3e5b8c1 --- /dev/null +++ b/public/include.php @@ -0,0 +1,11 @@ + + + + + + +header(); ?> +<?php $this->options->title(); ?> + + + \ No newline at end of file