完善移动端兼容

This commit is contained in:
augushong
2020-04-20 21:54:42 +08:00
parent aa0b9b1207
commit 3a8fd0b7d7
5 changed files with 119 additions and 90 deletions

View File

@@ -1,32 +1,4 @@
@media screen and (max-width: 768px){
.layui-body{
left: 0;
}
.layui-layout-admin .layui-footer{
left: 0;
}
.layui-layout-admin .layui-logo{
width: 115px;
}
.layui-layout-admin .layui-side{
width: 100%;
overflow-x: hidden;
height: 100%;
position: unset;
}
.layui-layer-content .layui-hide-xs{
display: unset !important;
}
.layui-nav-tree{
width: 100%;
height: 100%;
}
}
.left-bottom-options{
position: fixed;
@@ -105,4 +77,35 @@
.ul-flex{
display: flex;
}
@media screen and (max-width: 768px){
.layui-body{
left: 0;
}
.layui-layout-admin .layui-footer{
left: 0;
}
.layui-layout-admin .layui-logo{
width: 115px;
}
.layui-layout-admin .layui-side{
width: 100%;
overflow-x: hidden;
height: 100%;
position: unset;
}
.layui-layer-content .layui-hide-xs{
display: unset !important;
}
.layui-nav-tree{
width: 100%;
height: 100%;
}
}

View File

@@ -1,3 +1,4 @@
.main-container{
margin-top: 15px;
}
@@ -14,7 +15,7 @@
display: block;
padding: 10px 15px;
border-radius: 5px;
margin: 5px 40px;
margin: 5px 20px;
}
.nav-left-list a:hover,.nav-left-list a.current{
@@ -127,4 +128,17 @@
.content-container .title{
font-size: 22px;
font-weight: 600;
}
@media screen and (max-width: 768px){
.nav-left-list{
text-align: left;
}
.nav-left-list a{
display: inline-block;
margin: 5px;
}
}

View File

@@ -14,6 +14,5 @@
<a href="{:url('Index/index',['category_id'=>$category.id])}" {eq name='$Request.param.category_id|default=0' value='$category.id'} class="current"{/eq} >{$category.title}</a>
{/volist}
</div>
</div>
</div>

View File

@@ -13,62 +13,71 @@
<div class="layui-row layui-col-space4">
{include file='common/_articles_left'/}
<div class="layui-col-md7">
{eq name='$Request.param.category_id|default="0"' value='0'}
<div class="main-container">
<div>
<div class="layui-carousel" id="banner">
<div carousel-item>
{volist name='list_nav_slide' id='nav'}
{eq name='$Request.param.category_id|default="0"' value='0'}
<a href="{$nav.value|default='javascript:;'}" target="{$nav.target}">
<img src="{$nav.img}">
<div class="panel">
<p class="title">{$nav.title}</p>
<p>{$nav.desc}</p>
</div>
</a>
{/volist}
</div>
</div>
</div>
{/eq}
{notempty name='$sub_category'}
<div class="tab-list">
<a href="{:url('Index/index',['category_id'=>$Request.param.category_id])}" {eq name='$Request.param.sub_category_id|default=0' value='0'} class="current" {/eq}>全部</a>
{volist name='$sub_category' id='category'}
<a href="{:url('Index/index',['category_id'=>$Request.param.category_id,'sub_category_id'=>$category.id])}" {eq name='$Request.param.sub_category_id|default=0' value='$category.id'} class="current" {else/}{/eq}>{$category.title}</a>
{/volist}
</div>
{/notempty}
<div class="post-container">
<div class="post-list">
{volist name='list_post' id='post'}
<a href="{:url('Post/read',['id'=>$post.id])}" class="post-item" onmouseover="$(this).find('.poster').addClass('layui-anim-scale')" onmouseout="$(this).find('.poster').removeClass('layui-anim-scale')" >
{notempty name='$post->getData("poster")'}
<div class="poster layui-anim" style="background-image: url('{$post.poster}');"></div>
{/notempty}
<div class="info">
<div class="title">{$post.title}</div>
<div class="plus-info">
<span>{$post.hits}访问</span>
<span>{$post.comment_count}评论</span>
</div>
<div style="">
<div class="layui-carousel" id="banner">
<div carousel-item>
{volist name='list_nav_slide' id='nav'}
<a href="{$nav.value|default='javascript:;'}" target="{$nav.target}">
<img src="{$nav.img}">
<div class="panel">
<p class="title">{$nav.title}</p>
<p>{$nav.desc}</p>
</div>
</a>
{/volist}
</div>
</a>
</div>
</div>
{/eq}
{notempty name='$sub_category'}
<div class="tab-list">
<a href="{:url('Index/index',['category_id'=>$Request.param.category_id])}" {eq
name='$Request.param.sub_category_id|default=0' value='0' } class="current" {/eq}>全部</a>
{volist name='$sub_category' id='category'}
<a href="{:url('Index/index',['category_id'=>$Request.param.category_id,'sub_category_id'=>$category.id])}"
{eq name='$Request.param.sub_category_id|default=0' value='$category.id' } class="current"
{else/}{/eq}>{$category.title}</a>
{/volist}
{empty name='list_post'}
</div>
{/notempty}
<div class="post-container">
<div class="post-list">
{volist name='list_post' id='post'}
<a href="{:url('Post/read',['id'=>$post.id])}" class="post-item"
onmouseover="$(this).find('.poster').addClass('layui-anim-scale')"
onmouseout="$(this).find('.poster').removeClass('layui-anim-scale')">
{notempty name='$post->getData("poster")'}
<div class="poster layui-anim" style="background-image: url('{$post.poster}');"></div>
{/notempty}
<div class="info">
<div class="title">{$post.title}</div>
<div class="plus-info">
<span>{$post.hits}访问</span>
<span>{$post.comment_count}评论</span>
</div>
</div>
</a>
{/volist}
{empty name='list_post'}
<img class="nodata" src="/static/images/nodata.png" alt="">
{/empty}
{/empty}
</div>
</div>
</div>
</div>

View File

@@ -1,5 +1,6 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
@@ -7,27 +8,30 @@
{include file='common/_articles_require'/}
<link rel="stylesheet" href="/static/lib/quill/quill.snow.css">
</head>
<body>
<div class="layui-container main-container">
<div class="layui-row layui-col-space4">
{include file='common/_articles_left'/}
<div class="layui-col-md7">
<div class="content-container">
<div class="title">
{$post.title}
</div>
<div class="info">
<span>{$post->publish_time_text}</span>
</div>
<div class="ql-snow">
<div class="ql-editor">{$post->content_html|raw}</div>
<div class="main-container">
<div class="content-container">
<div class="title">
{$post.title}
</div>
<div class="info">
<span>{$post->publish_time_text}</span>
</div>
<div class="ql-snow">
<div class="ql-editor">{$post->content_html|raw}</div>
</div>
</div>
</div>
</div>
{include file='common/_articles_right'/}
</div>
</div>
</body>
</html>