nelson
/
beeblog
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity
Browse Source

自适应手机

master
nelson 3 years ago
parent
2b6998470c
commit
31b51ea2dd
8 changed files with 91 additions and 45 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. 57
      static/css/common.css
  2. 4
      static/css/common.min.css
  3. 17
      views/T.footer.tpl
  4. 2
      views/T.header.tpl
  5. 8
      views/T.nav.tpl
  6. 20
      views/blog.html
  7. 20
      views/blogs.html
  8. 8
      views/index.html

57
static/css/common.css
View File

@ -146,6 +146,7 @@ a{
} }
.blog-root a{ .blog-root a{
color: #28a3ef !important; color: #28a3ef !important;
text-decoration: none;
} }
.blog-root .blog-title{ .blog-root .blog-title{
display: block; display: block;
@ -322,12 +323,16 @@ img {
line-height: 1.5; line-height: 1.5;
} }
.blog-root a {
text-decoration: none;
}
.blog-root p { .blog-root p {
margin: 1px 0 9px; margin: 1px 0 9px;
font-size: 17px;
line-height: 28px;
color: #555;
}
.index-root p{
font-size: 15px !important;
line-height: 18px !important;
} }
.login-root { .login-root {
@ -635,3 +640,47 @@ img {
height: 30px; height: 30px;
line-height: 30px; line-height: 30px;
} }
.home-container-list{
display: flex;
flex-wrap: wrap;
}
@media screen and (max-width: 1000px) {
.comms-left-root{
display: none;
}
.blog-root{
width: 80%;
}
}
@media screen and (max-width: 678px) {
.comms-left-root{
display: none;
}
.blog-root{
width: 98%;
}
.auto-item{
display: none !important;
}
.home-container-list-item{
min-width: 260px;
}
.friend-link{
display: none;
}
.footer-friend{
text-align: center;
height: 50px;
line-height: 25px;
}
.copyright{
display: block;
}
.auto-screen{
width: 98%;
}
}

4
static/css/common.min.css
View File

File diff suppressed because one or more lines are too long

17
views/T.footer.tpl
View File

@ -3,23 +3,28 @@
<div style="flex: 1"> <div style="flex: 1">
<div class="footer-friend"> <div class="footer-friend">
<a href="https://gitea.aiprose.com/nelson" target="_blank" style="padding: 0 5px">码农笔录Git仓库</a> <a href="https://gitea.aiprose.com/nelson" target="_blank" style="padding: 0 5px">码农笔录Git仓库</a>
{{/* <a href="http://pan.aiprose.com/" target="_blank" style="padding: 0 5px">码农笔录网盘</a>*/}} <a href="http://pan.aiprose.com/" target="_blank" style="padding: 0 5px">码农笔录私有云</a>
<a href="http://maven.aiprose.com/nexus" target="_blank" style="padding: 0 5px">maven私服</a> <a href="http://maven.aiprose.com/nexus" target="_blank" style="padding: 0 5px">maven私服</a>
<a href="https://blog.csdn.net/yp090416" target="_blank" style="padding: 0 5px">码农笔录-CSDN</a> <a href="https://blog.csdn.net/yp090416" target="_blank" style="padding: 0 5px">码农笔录-CSDN</a>
<a href="https://www.jianshu.com/u/6baf4cdc7ce1" target="_blank" style="padding: 0 5px">码农笔录-简书</a> <a href="https://www.jianshu.com/u/6baf4cdc7ce1" target="_blank" style="padding: 0 5px">码农笔录-简书</a>
</div> </div>
<div class="footer-friend"> <div class="footer-friend">
<span>© 2018 - © 2021 <span class="copyright">
<a href="https://www.aiprose.com/">码农随笔</a> </span> <span>© 2018 - 2021 <a href="https://www.aiprose.com/">码农随笔</a> </span>
<span>版权所有&nbsp;&nbsp;&nbsp; ICP证：</span> <span>版权所有&nbsp;&nbsp;&nbsp; </span>
<a href="https://beian.miit.gov.cn/" target="_blank">陕ICP备18016846号-1</a> </span>
<span>
ICP证： <a href="https://beian.miit.gov.cn/" target="_blank">陕ICP备18016846号-1</a>
</span>
</div> </div>
<div class="footer-friend"> <div class="footer-friend friend-link">
<span>前端QQ群: 128806068</span> <span>前端QQ群: 128806068</span>
<span>/</span> <span>/</span>
<span>golang QQ群: 189663710</span> <span>golang QQ群: 189663710</span>
</div> </div>
<div class="friend-link">
<script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? "https://" : "http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1277992374'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s4.cnzz.com/z_stat.php%3Fid%3D1277992374%26online%3D1%26show%3Dline' type='text/javascript'%3E%3C/script%3E"));</script> <script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? "https://" : "http://");document.write(unescape("%3Cspan id='cnzz_stat_icon_1277992374'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s4.cnzz.com/z_stat.php%3Fid%3D1277992374%26online%3D1%26show%3Dline' type='text/javascript'%3E%3C/script%3E"));</script>
</div>
</div> </div>
<div class="wxcode"> <div class="wxcode">
<img src="/static/img/wxcode.png" alt="" width="80" height="80"> <img src="/static/img/wxcode.png" alt="" width="80" height="80">

2
views/T.header.tpl
View File

@ -8,7 +8,7 @@
{{else}} {{else}}
<meta name="description" content="码农随笔,个人随笔是一个面向IT技术人员,提供个人平时工作总结和在线记录学习笔记,个人技术博客,在线云笔记,码农笔录,最新的技术博客,www.aiprose.com"> <meta name="description" content="码农随笔,个人随笔是一个面向IT技术人员,提供个人平时工作总结和在线记录学习笔记,个人技术博客,在线云笔记,码农笔录,最新的技术博客,www.aiprose.com">
{{end}} {{end}}
<link type="text/css" rel="styleSheet" href="/static/css/common.css"/> <link type="text/css" rel="styleSheet" href="/static/css/common.min.css"/>
<script type="text/javascript" src="/static/js/vue.min.js"></script> <script type="text/javascript" src="/static/js/vue.min.js"></script>
<link rel="stylesheet" href="/static/layui/css/layui.css"> <link rel="stylesheet" href="/static/layui/css/layui.css">
<script type="text/javascript" src="/static/layui/layui.js"></script> <script type="text/javascript" src="/static/layui/layui.js"></script>

8
views/T.nav.tpl
View File

@ -6,7 +6,7 @@
<li class="layui-nav-item"> <li class="layui-nav-item">
<a href="/search"><i class="layui-icon">&#xe615;</i><span style="padding-left:8px">搜索</span></a> <a href="/search"><i class="layui-icon">&#xe615;</i><span style="padding-left:8px">搜索</span></a>
</li> </li>
<li class="layui-nav-item"> <li class="layui-nav-item auto-item">
<a href="/blog/new"><i class="layui-icon">&#xe642;</i>写文章</a> <a href="/blog/new"><i class="layui-icon">&#xe642;</i>写文章</a>
</li> </li>
<li class="layui-nav-item"> <li class="layui-nav-item">
@ -15,11 +15,11 @@
<li class="layui-nav-item"> <li class="layui-nav-item">
<a href="https://note.aiprose.com" target="_blank">免费笔记</a> <a href="https://note.aiprose.com" target="_blank">免费笔记</a>
</li> </li>
<li class="layui-nav-item"> <li class="layui-nav-item auto-item">
<a href="/me/info">个人中心</span></a> <a href="/me/info">个人中心</span></a>
</li> </li>
{{if .IsLogin }} {{if .IsLogin }}
<li class="layui-nav-item"> <li class="layui-nav-item auto-item">
<a href=""><img src="{{.HeadImg}}" class="layui-nav-img"></a> <a href=""><img src="{{.HeadImg}}" class="layui-nav-img"></a>
<dl class="layui-nav-child layui-anim layui-anim-upbit"> <dl class="layui-nav-child layui-anim layui-anim-upbit">
<dd><a href="/me/info">个人中心</a></dd> <dd><a href="/me/info">个人中心</a></dd>
@ -28,7 +28,7 @@
</dl> </dl>
</li> </li>
{{else}} {{else}}
<li class="layui-nav-item"> <li class="layui-nav-item auto-item">
<a href="/login">登录 <span class="layui-badge-dot"></span></a> <a href="/login">登录 <span class="layui-badge-dot"></span></a>
</li> </li>
{{end}} {{end}}

20
views/blog.html
View File

@ -42,16 +42,16 @@
<div id="vcomments" style="margin-top: 20px"></div> <div id="vcomments" style="margin-top: 20px"></div>
</div> </div>
</div> </div>
<div class="comms-right-root"> <!-- <div class="comms-right-root">-->
<div class="_tjgyl4x3spj"></div> <!-- <div class="_tjgyl4x3spj"></div>-->
<script type="text/javascript"> <!-- <script type="text/javascript">-->
(window.slotbydup = window.slotbydup || []).push({ <!-- (window.slotbydup = window.slotbydup || []).push({-->
id: "u6636367", <!-- id: "u6636367",-->
container: "_tjgyl4x3spj", <!-- container: "_tjgyl4x3spj",-->
async: true <!-- async: true-->
}); <!-- });-->
</script> <!-- </script>-->
</div> <!-- </div>-->
<div class="comms-left-root"> <div class="comms-left-root">
<div class="_8g649xzayfg"></div> <div class="_8g649xzayfg"></div>
<script type="text/javascript"> <script type="text/javascript">

20
views/blogs.html
View File

@ -8,20 +8,12 @@
<div class="home-container"> <div class="home-container">
<div class="home-hearder"> <div class="home-hearder">
<div style="flex: 1"> <div style="flex: 1">
<span> <el-select v-model="cateId" placeholder="请选择文章分类" @change="catChange" clearable class="auto-screen">
<el-select v-model="cateId" placeholder="请选择文章分类" @change="catChange" clearable> <el-option v-for="item in cats" :key="item.Id" :label="item.Title" :value="item.Id"/>
<el-option v-for="item in cats" :key="item.Id" :label="item.Title" :value="item.Id"/> </el-select>
</el-select>
</span>
<!-- <div class="layui-btn-group" style="display: inline-block;margin-top: -5px">-->
<!-- <button class="layui-btn layui-btn-sm {{if eq 0 .Flag}}active{{end}}"><a-->
<!-- href="/blogs?num=1&flag=0&cat={{.Cat}}">最新</a></button>-->
<!-- <button class="layui-btn layui-btn-sm {{if eq 1 .Flag}}active{{end}}"><a-->
<!-- href="/blogs?num=1&flag=1&cat={{.Cat}}">最热</a></button>-->
<!-- </div>-->
</div> </div>
<button type="button" onclick="window.open('/blog/new')" <button type="button" onclick="window.open('/blog/new')"
class="layui-btn layui-btn-radius layui-btn-danger layui-btn-sm " style="border-radius: 12px"> class="layui-btn layui-btn-radius layui-btn-danger layui-btn-sm auto-item" style="border-radius: 12px">
写文章 写文章
</button> </button>
</div> </div>
@ -30,7 +22,7 @@
<div class="home-content-title cursor" style="font-size: 14px"> <div class="home-content-title cursor" style="font-size: 14px">
文章标题 文章标题
</div> </div>
<div style="display: inline-block;width: 300px"> <div style="display: inline-block;width: 300px" class="auto-item">
<div class="home-content-desc"> <div class="home-content-desc">
<span style="width: 100px;font-size: 14px">类型</span> <span style="width: 100px;font-size: 14px">类型</span>
<span style="width: 50px"> 用户</span> <span style="width: 50px"> 用户</span>
@ -47,7 +39,7 @@
<div class="home-content-title cursor"> <div class="home-content-title cursor">
<a href="/blog/{{.Id}}" target="_blank">{{.Title}}</a> <a href="/blog/{{.Id}}" target="_blank">{{.Title}}</a>
</div> </div>
<div style="display: inline-block;width: 300px"> <div style="display: inline-block;width: 300px" class="auto-item">
<div class="home-content-desc"> <div class="home-content-desc">
<span style="width: 100px;font-size: 12px">{{.CateName}}</span> <span style="width: 100px;font-size: 12px">{{.CateName}}</span>
<span style="width: 50px;text-align: center"> <span style="width: 50px;text-align: center">

8
views/index.html
View File

@ -5,19 +5,19 @@
<body> <body>
<div id="vue-app" style="height: 100%"> <div id="vue-app" style="height: 100%">
{{template "nav" .}} {{template "nav" .}}
<div class="blog-root"> <div class="blog-root index-root">
<div class="jumbotron" style="margin-top: 50px;margin-bottom: 10px"> <div class="jumbotron" style="margin-top: 50px;margin-bottom: 10px">
<blockquote class="layui-elem-quote">码农随笔 3.0(golang + vue)版本正式上线</blockquote> <blockquote class="layui-elem-quote">码农随笔 3.0(golang + vue)版本正式上线</blockquote>
</div> </div>
<div style="display: flex"> <div class="home-container-list">
<div style="flex: 1"> <div style="flex: 1" class="home-container-list-item">
<h5>最新发布</h5> <h5>最新发布</h5>
{{range .TimeBlog}} {{range .TimeBlog}}
<p><a href="/blog/{{.Id}}" target="_blank">{{.Title}}</a></p> <p><a href="/blog/{{.Id}}" target="_blank">{{.Title}}</a></p>
{{end}} {{end}}
<p><a href="https://www.aiprose.com/blogs">查看更多...</a></p> <p><a href="https://www.aiprose.com/blogs">查看更多...</a></p>
</div> </div>
<div style="flex: 1"> <div style="flex: 1" class="home-container-list-item">
<h5>流量王者</h5> <h5>流量王者</h5>
{{range .BrowsBlog}} {{range .BrowsBlog}}
<p><a href="/blog/{{.Id}}" target="_blank">{{.Title}}</a></p> <p><a href="/blog/{{.Id}}" target="_blank">{{.Title}}</a></p>

Write Preview
Loading…
Cancel
Save