lsm/sa-token
1
0
Fork 0
mirror of https://gitee.com/dromara/sa-token.git synced 2026-02-27 16:50:24 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

优化文档样式

Browse Source
This commit is contained in:
click33
2021-12-24 12:35:08 +08:00
parent 1fa72d32f2
commit f2d0fae8a4
4 changed files with 89 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
sa-token-doc/doc/index.html
View File

@@ -19,7 +19,7 @@
<h1 class="logo-text">Sa-Token</h1>
</div>
</a>
<nav>
<nav class="a-box">
<select onchange="location.href=this.value">
<option value="http://sa-token.dev33.cn/doc/index.html">最新版</option>
<option value="http://sa-token.dev33.cn/v/v1.27.0/doc/index.html">v1.27.0</option>
@@ -53,10 +53,27 @@
<option value="http://sa-token.dev33.cn/v/v1.0.0/doc/index.html">v1.0.0</option>
</select>
<a href="../index.html">🔨️️ 首页</a>
<!-- <a href="http://sa-app.dev33.cn/wall.html?name=sa-token" target="_blank">需求墙</a> -->
<a href="#/more/link">🌱 生态</a>
<a class="p-none" href="#/more/link">🌱 生态</a>
<a class="p-none" href="#/more/sa-token-donate">❤️ 赞助</a>
<a href="#/more/update-log"><span style="transform: rotateY(180deg); display: inline-block;">🧾</span> 更新日志</a>
<div class="zk-box">
<a href="javascript:;">
<span>🔖 相关资源 </span>
<span class="zk-icon"></span>
</a>
<div style="height: 10px;"></div>
<div class="zk-context">
<div>
<!-- <a href="#/more/sa-token-donate">❤️ &nbsp;赞助</a> -->
<a href="#/more/update-log"><span style="transform: rotateY(180deg); display: inline-block;">🧾</span> &nbsp;更新日志</a>
<a href="#/more/common-questions">💥️ &nbsp;常见报错</a>
<a href="#/more/tj-gzh">🚩️ &nbsp;推荐公众号</a>
<a href="#/fun/sa-token-test">🗞️ &nbsp;在线考试 ++</a>
<div class="zk-fengexian"></div>
<a href="http://sa-app.dev33.cn/wall.html?name=sa-token" target="_blank">🧱 &nbsp;需求墙</a>
<a href="https://wj.qq.com/s2/8475114/2f6a/" target="_blank">📝 &nbsp;问卷调查</a>
</div>
</div>
</div>
</nav>
<div class="main-box">
<div id="app">加载中...</div>

21
sa-token-doc/doc/lib/index.css
View File

@@ -134,3 +134,24 @@ body {
#main .un-dec-a-pre+p a,
#main p[align=center] a{border-bottom:0px;}
/* 工具栏超链接 展开、收缩div */
body .a-box a{font-size: 16px; display: inline-block;}
.zk-box{display: inline-block;}
/* 外层盒 */
.zk-box .zk-context{max-height: 0px; position: absolute; overflow: hidden;}
.zk-box:hover .zk-context{max-height: 300px;}
/* 内层盒 */
.zk-context>div{padding: 1em 0; border: 1px #ccc solid; border-radius: 2px; background-color: #FFF; font-size: 12px; transition: all 0.2s; opacity: 0;}
.zk-box:hover .zk-context>div{opacity: 1;}
/* 小链接 */
.zk-box .zk-context a{font-size: 14px; display: block; line-height: 32px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.zk-box .zk-context a{text-align: left; padding: 0 1.5em 0 1em;}
.zk-box .zk-context .zk-fengexian{border-bottom: 1px #d9d9d9 solid; margin: 10px 0;}
/* 下三角小图标 */
.zk-icon{display: inline-block; width: 0px; height: 0px; position: relative;top: 3px; margin-left: 4px;}
.zk-icon{border-style: solid; border-width: 5px; border-color: #aaa transparent transparent transparent; }
/* .a-box a{font-family: "Helvetica Neue", Helvetica, "PingFang SC", Tahoma, Arial, sans-serif;}
.a-box a{color: var(--a-color); }
.a-box a:hover{color: var(--a-hover-color) !important; border-bottom: 1px var(--a-hover-color) solid;} */

33
sa-token-doc/index.css
View File

@@ -24,6 +24,9 @@ body{font-size: 16px; color: #34495E; font-family: "Source Sans Pro","Helvetica
.nav-right a{padding: 0px 1em; color: #34495E; text-decoration: none; transition: all 0.2s;}
.nav-right a:hover{color: #42B983;}
/* 手机端不显示广告，和一些其它东西 */
@media (max-width: 576px) {.wwads-cn,.p-none{display:none!important}}
/* -------- 海报部分 --------- */
.main-box{width: 100%; min-height: 100vh;; /* height: 80vh; */ text-align: center; background-image: url(https://oss.dev33.cn/sa-token/home-bg.jpg); }
.main-box{display: flex; align-items: center; text-align: center; }
@@ -85,6 +88,7 @@ body{font-size: 16px; color: #34495E; font-family: "Source Sans Pro","Helvetica
.sa-token-js-box img{max-width: 100%;}
.sa-token-js-box:hover{cursor: pointer; box-shadow: 0 0 20px #ccc;} */
.re-text{padding: 0 1em;}
.re-text a{color: #0969da; text-decoration: none;}
.re-text a:hover{border-bottom: 1px #0969da solid;}
@@ -131,7 +135,7 @@ body{font-size: 16px; color: #34495E; font-family: "Source Sans Pro","Helvetica
.s-title{padding: 0 16px;}
.s-width{width: 100%;}
.logo-box,.copyright {display: none;}
.logo-box .logo-text,.copyright {display: none;}
.main-box{ height: auto;}
.content-box{ padding: 2em 1em;}
.content-box h1{font-size: 50px;}
@@ -154,15 +158,20 @@ body{font-size: 16px; color: #34495E; font-family: "Source Sans Pro","Helvetica
}
/* 闪光背景 */
/* .main-box{
background-size: 500%;
background-image: linear-gradient(125deg,#BFFEBE,#F6F8B5,#FCD0B3,#BFB6F8,#E8D8B3);
animation: bganimation 15s infinite;
}
@keyframes bganimation{
0%{background-position: 0% 50%;}
50%{background-position: 100% 50%;}
100%{background-position: 0% 50%;}
} */
/* 工具栏超链接 展开、收缩div */
.zk-box{display: inline-block; padding-right: 0px; margin-right: -25px;}
/* 外层盒 */
.zk-box .zk-context{max-height: 0px; position: absolute; overflow: hidden;}
.zk-box:hover .zk-context{max-height: 300px;}
/* 内层盒 */
.zk-context>div{padding: 1em 0; border: 1px #ccc solid; border-radius: 2px; background-color: #FFF; font-size: 12px; transition: all 0.2s; opacity: 0;}
.zk-box:hover .zk-context>div{opacity: 1;}
/* 小链接 */
.zk-box .zk-context a{font-size: 14px; display: block; line-height: 32px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.zk-box .zk-context a{text-align: left; padding: 0 1.5em 0 1em;}
.zk-box .zk-context .zk-fengexian{border-bottom: 1px #d9d9d9 solid; margin: 10px 0;}
/* 下三角小图标 */
.zk-icon{display: inline-block; width: 0px; height: 0px; position: relative;top: 3px; margin-left: 4px;}
.zk-icon{border-style: solid; border-width: 5px; border-color: #aaa transparent transparent transparent; }

70
sa-token-doc/index.html
View File

@@ -23,13 +23,33 @@
<span class="logo-text">Sa-Token</span>
</div>
</a>
<nav class="nav-right">
<a href="index.html">首页</a>
<a href="doc/index.html">文档</a>
<a href="http://sa-app.dev33.cn/wall.html?name=sa-token" target="_blank">需求墙</a>
<a href="doc/#/more/update-log">更新日志</a>
<nav class="nav-right a-box">
<!-- <a href="index.html">首页</a> -->
<a href="doc/index.html">🔨️️ 文档</a>
<a class="p-none" href="doc/index.html#/more/link">🌱 生态</a>
<a class="p-none" href="doc/index.html#/more/sa-token-donate">❤️ 赞助</a>
<div class="zk-box">
<a href="javascript:;">
<span>🔖 相关资源 </span>
<span class="zk-icon"></span>
</a>
<!-- <div style="height: 10px;"></div> -->
<div class="zk-context">
<div>
<!-- <a href="#/more/sa-token-donate">❤️ &nbsp;赞助</a> -->
<a href="doc/index.html#/more/update-log"><span style="transform: rotateY(180deg); display: inline-block;">🧾</span> &nbsp;更新日志</a>
<a href="doc/index.html#/more/common-questions">💥️ &nbsp;常见报错</a>
<a href="doc/index.html#/more/tj-gzh">🚩️ &nbsp;推荐公众号</a>
<a href="doc/index.html#/fun/sa-token-test">🗞️ &nbsp;在线考试 ++</a>
<div class="zk-fengexian"></div>
<a href="http://sa-app.dev33.cn/wall.html?name=sa-token" target="_blank">🧱 &nbsp;需求墙</a>
<a href="https://wj.qq.com/s2/8475114/2f6a/" target="_blank">📝 &nbsp;问卷调查</a>
</div>
</div>
</div>
<!-- github小章鱼图标 -->
<a href="https://github.com/dromara/sa-token" target="_blank" class="github-corner" aria-label="View source on Github" style="position: fixed; right: -16px;">
<a href="https://github.com/dromara/sa-token" target="_blank" class="github-corner" aria-label="View source on Github"
style="position: fixed; right: -16px; padding-left: 0px;">
<svg viewBox="0 0 250 250" aria-hidden="true">
<path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path>
<path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2"
@@ -45,14 +65,11 @@
<div class="main-box">
<div class="content-box">
<div class="fenge"></div>
<!-- <img class="title-logo" src="./doc/logo.png" onclick="alert('别点我, 快去点star！')"> -->
<h1>Sa-Token<small>v1.28.0</small></h1>
<div class="sub-title">一个轻量级 java 权限认证框架，让鉴权变得简单、优雅！</div>
<div class="btn-box">
<a href="https://github.com/dromara/sa-token" target="_blank">GitHub</a>
<a href="https://gitee.com/dromara/sa-token" target="_blank">码云</a>
<!-- <a href="https://jq.qq.com/?_wv=1027&k=45H977HM" target="_blank">加QQ群</a> -->
<!-- <a href="http://sa-app.dev33.cn/wall.html?name=sa-token" target="_blank">需求墙</a> -->
<a href="doc/index.html" target="_self" class="doc-btn">开发文档</a>
</div>
<h4 align="center" class="badge-box">
@@ -77,19 +94,6 @@
</div>
</div>
<!-- <div>
<div class="feature-z stj-z s-width">
<h2 class="s-title">支持 ⚡ 特性</h2>
<br><br>
<div class="sa-token-js-box">
<img src="https://color-test.oss-cn-qingdao.aliyuncs.com/sa-token/x/sa-token-js4.png" >
</div>
<div class="re-text">有了Sa-Token，你所有的权限认证问题，都不再是问题！</div>
</div>
</div> -->
<!-- ------------ 支持特性 ------------- -->
<div>
<div class="feature-z s-width">
@@ -135,7 +139,6 @@
<div class="re-text">
<span>有了Sa-Token，你所有的权限认证问题，都不再是问题！</span>
<a href="https://oss.dev33.cn/sa-token/art/sa-token-js4.png" target="_blank">点击查看功能结构图</a>
<!-- <a href="javascript: showStjs();">点击查看功能结构图</a> -->
</div>
</div>
</div>
@@ -436,27 +439,6 @@
</script>
<!-- <script type="text/javascript">
// 大窗显示一个图片
// 参数: src=地址、w=宽度(默认80%)、h=高度(默认80%)
layer.ready()
function showStjs() {
let src = 'https://oss.dev33.cn/sa-token/art/sa-token-js4.png';
// let w = 'auto';
// let h = '95%';
var content = '<div style="height: 100%; overflow: hidden !important;">' +
'<img src="' + src + ' " style="width: 100%; height: 100%;" />' +
'</div>';
layer.open({
type: 1,
title: false,
shadeClose: true,
closeBtn: 0,
area: ['75%', '95%'], //宽高
content: content
});
}
</script> -->
</body>
</html>