jinql
/
Simpic
mirror of https://github.com/xinyewl/Simpic
1
0
Fork 0
Code Issues Releases Wiki Activity

微调首页样式

master
notte 2018-07-19 16:54:35 +08:00
parent 2d767a4a30
commit c54b21440e
6 changed files with 287 additions and 124 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/admin/view/login/index.html
View File

@ -3,7 +3,7 @@
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>兰空- 后台管理</title>
<title>Simpic - 登录</title>
{css href="_layui_css/layui.css" /}
</head>
<style type="text/css">
@ -20,7 +20,7 @@
</style>
<body>
<div class="login shadow">
<h1 class="text-center">兰 空</h1>
<h1 class="text-center">Simpic</h1>
<form class="layui-form" action="" method="post">
<div class="layui-form-item">
<input type="text" name="user" required lay-verify="required" placeholder="请输入账号" autocomplete="off" class="layui-input">

2
app/admin/view/system/index.html
View File

@ -175,7 +175,7 @@
<form class="form-horizontal setScheme" role="form" action="" method="post">
<div class="scheme scheme-1{if condition="$conf.upload_scheme_id neq 1"} none{/if}">
<blockquote class="layui-elem-quote">本地</blockquote>
<p class="text-danger">本地默认无需配置，文件路径所在目录 /public/pic</p>
<p class="text-danger">本地默认无需配置，文件路径所在目录 /public</p>
<div class="form-group">
<div class="col-sm-9">
<input type="hidden" name="id" value="1">

4
app/index/view/theme/default/common/footer.html
View File

@ -1,7 +1,7 @@
<footer>
<div class="container">
<p class="text-muted">Copyright &copy; 2017 <a href="http://www.lskys.cc">兰空</a> Powered by <a href="http://www.xlogs.cn">WispX</a>. All rights reserved. 请勿上传违反中国大陆和香港法律的图片，违者后果自负。</p>
<p class="text-muted">Copyright &copy; 2018 <a href="https://github.com/xinyewl/Simpic">Simpic</a> Powered by <a href="https://www.ikxin.com">Notte</a>. All rights reserved. </p>
</div>
</footer>
</body>
</body>
</html>

6
app/index/view/theme/default/common/header.html
View File

@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="en">
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<title>{$conf.web_title}</title>
@ -24,7 +24,7 @@
{$conf.custom_style}
</style>
<body>
<nav class="header navbar navbar-default navbar-inverse navbar-fixed-top" role="navigation">
<nav class="header navbar navbar-default navbar-inverse navbar-fixed-top layui-nav layui-bg-cyan" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#menu">
@ -33,7 +33,7 @@
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/"><i class="fa fa-leaf fa-fw"></i> 兰空</a>
<a class="navbar-brand" href="/"><i class="fa fa-leaf fa-fw"></i> Simpic</a>
</div>
<div class="collapse navbar-collapse" id="menu">
<ul class="nav navbar-nav navbar-left">

2
app/index/view/theme/default/index/index.html
View File

@ -1,7 +1,7 @@
{include file="/common/header"}
<div class="container">
<div class="fileinput lk-panel">
<h1>请选择图片上传 <small>最大限制 {$conf.upload_max_filesize / 1024|round=###, 2}M</small></h1>
<h1>Image Upload</h1>
<form enctype="multipart/form-data">
<div class="form-group">
<input id="img" type="file" multiple class="file" data-overwrite-initial="false" data-min-file-count="1" data-max-file-count="10" name="img" accept="image/*">

393
public/static/css/main.css
View File

@ -1,154 +1,317 @@
body { font-family: -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; background-color: #eee; padding-top: 100px; word-wrap:break-word; }
a { bblr:expression(this.onFocus=this.blur()); outline-style:none; text-decoration: none; }
a:hover, a:focus, a:active, a:visited { text-decoration: none; }
a { -webkit-transition: all 0.2s; -moz-transition: all 0.2s; -ms-transition: all 0.2s; -o-transition: all 0.2s; transition: all 0.2s; }
.navbar-brand { color: #fff!important; }
.none { display: none; }
.login, .reg { margin:0 auto; float: none; }
.login h1, .reg h1 { margin-bottom: 20px; }
#link { margin-top: 20px; }
body {
/*font-family: -apple-system,system-ui,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;*/
/*background-color: #eee;*/
padding-top: 100px;
word-wrap: break-word
}
a {
bblr: expression(this.onFocus=this.blur());
outline-style: none;
text-decoration: none
}
a:active,a:focus,a:hover,a:visited {
text-decoration: none
}
a {
-webkit-transition: all .2s;
-moz-transition: all .2s;
-ms-transition: all .2s;
-o-transition: all .2s;
transition: all .2s
}
.navbar-brand {
color: #fff!important
}
.none {
display: none
}
.login,.reg {
margin: 0 auto;
float: none
}
.login h1,.reg h1 {
margin-bottom: 20px
}
#link {
margin-top: 20px
}
.lk-panel {
background-color: #fff;
padding: 15px;
-webkit-box-shadow: 0 8px 7px 0 rgba(0,0,0,.2), 0 0px 10px 0 rgba(0,0,0,.19);
box-shadow: 0 8px 7px 0 rgba(0,0,0,.2), 0 0px 10px 0 rgba(0,0,0,.19);
border-radius: 2px;
background-color: #fff;
padding: 15px;
-webkit-box-shadow: 0 8px 7px 0 rgba(0,0,0,.2),0 0 10px 0 rgba(0,0,0,.19);
box-shadow: 0 8px 7px 0 rgba(0,0,0,.2),0 0 10px 0 rgba(0,0,0,.19);
border-radius: 2px
}
.user {
padding: 10px;background-color: #fff;
-webkit-box-shadow: 0px 0px 1px 0 rgba(0,0,0,.2), 0 0px 8px 0 rgba(0,0,0,.19);
box-shadow: 0px 0px 1px 0 rgba(0,0,0,.2), 0 0px 8px 0 rgba(0,0,0,.19);
padding: 10px;
background-color: #fff;
-webkit-box-shadow: 0 0 1px 0 rgba(0,0,0,.2),0 0 8px 0 rgba(0,0,0,.19);
box-shadow: 0 0 1px 0 rgba(0,0,0,.2),0 0 8px 0 rgba(0,0,0,.19)
}
.list {
margin-top: 20px;
margin-top: 20px
}
.img {
position: relative;
cursor: pointer;
padding: 10px;
background-color: #f4f4f4;
border-radius: 2px;
overflow: hidden;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.28);
position: relative;
cursor: pointer;
padding: 10px;
background-color: #f4f4f4;
border-radius: 2px;
overflow: hidden;
box-shadow: 0 1px 2px rgba(0,0,0,.28)
}
.img img {
width: 100%;
height: 140px;
width: 100%;
height: 140px
}
.img-per {
margin-top: 8px;
margin-top: 8px
}
.list-per {
border-bottom: 1px solid #f4f4f4;
padding-bottom: 10px;
border-bottom: 1px solid #f4f4f4;
padding-bottom: 10px
}
.picture {
margin-bottom: 10px;
margin-bottom: 10px
}
.layui-flow-more { clear: both; padding-top: 30px; }
.list-per .layui-input, .list-per .layui-select, .list-per .layui-textarea { height: 30px; width: 150px; }
.layui-flow-more {
clear: both;
padding-top: 30px
}
.list-per .layui-input,.list-per .layui-select,.list-per .layui-textarea {
height: 30px;
width: 150px
}
.pic-del {
position: relative;
top: 50px;
left: 20px;
font-size: 30px;
cursor: pointer;
z-index: 9;
position: relative;
top: 50px;
left: 20px;
font-size: 30px;
cursor: pointer;
z-index: 9
}
.forgot .input-group {
margin-bottom: 10px;
margin-bottom: 10px
}
.m-b-10 {
margin-bottom: 10px;
margin-bottom: 10px
}
/* ------- BootStarp ------- */
.form-control { border-radius: 2px; }
/* ------- FileInput ------- */
.form-control {
border-radius: 2px
}
.fileinput h1 {
padding: 20px 0;
font-weight: 400;
font-size: 30px;
margin-bottom: 20px;
border-bottom: 1px solid lavender;
text-shadow: -5px 5px 0 rgba(0,0,0,.1);
padding: 20px 0;
font-weight: 400;
font-size: 30px;
margin-bottom: 20px;
border-bottom: 1px solid #e6e6fa;
text-shadow: -5px 5px 0 rgba(0,0,0,.1)
}
.file-input .btn {
padding: 10px 18px;
padding: 10px 18px
}
.file-input .form-control {
height: 42px;
padding: 10px 12px;
height: 42px;
padding: 10px 12px
}
.file-input .btn-file {
border-top-right-radius: 0;
border-bottom-right-radius: 0;
border-top-right-radius: 0;
border-bottom-right-radius: 0
}
.file-input .file-caption {
border-top-left-radius: 0;
border-bottom-left-radius: 0;
border-top-left-radius: 0;
border-bottom-left-radius: 0
}
/**
.file-input .file-preview {
border-radius: 0px;
}
**/
footer {
margin-top: 50px;
width: 100%;
margin-top: 50px;
width: 100%
}
footer .container .text-muted { margin: 20px 0; }
.text-muted { color: #999999; }
@media screen and (max-width: 768px) {
.layui-layer-iframe { width: 100%!important; height: 100%!important; }
.batchDel { display: none; }
.list-per .layui-input-inline, .list-per .layui-inline, .list-per .search_btn { display: grid; margin-top: 5px; }
.list-per .layui-input, .list-per .layui-select, .list-per .layui-textarea { width: 100%; }
.pic-del { display: none; }
footer .container .text-muted {
margin: 20px 0
}
.text-muted {
color: #999
}
@media screen and (max-width:768px) {
.layui-layer-iframe {
width: 100%!important;
height: 100%!important
}
.batchDel {
display: none
}
.list-per .layui-inline,.list-per .layui-input-inline,.list-per .search_btn {
display: grid;
margin-top: 5px
}
.list-per .layui-input,.list-per .layui-select,.list-per .layui-textarea {
width: 100%
}
.pic-del {
display: none
}
}
.animated {
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode: both;
-ms-animation-fill-mode: both;
-o-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-duration: 1s;
-moz-animation-duration: 1s;
-ms-animation-duration: 1s;
-o-animation-duration: 1s;
animation-duration: 1s;
}
.fadeInDown {
-webkit-animation-name: fadeInDown;
-moz-animation-name: fadeInDown;
-o-animation-name: fadeInDown;
animation-name: fadeInDown;
}
@-webkit-keyframes fadeIn{50%{opacity:.6}
100%{opacity:1}
}
@-webkit-keyframes fadeInDown{0%{opacity:0;-webkit-transform:translateY(-20px)}
100%{opacity:1;-webkit-transform:translateY(0)}
}
@-moz-keyframes fadeInDown{0%{opacity:0;-moz-transform:translateY(-20px)}
100%{opacity:1;-moz-transform:translateY(0)}
}
@-o-keyframes fadeInDown{0%{opacity:0;-o-transform:translateY(-20px)}
100%{opacity:1;-o-transform:translateY(0)}
}
@keyframes fadeInDown{0%{opacity:0;transform:translateY(-20px)}
100%{opacity:1;transform:translateY(0)}
-webkit-animation-fill-mode: both;
-moz-animation-fill-mode: both;
-ms-animation-fill-mode: both;
-o-animation-fill-mode: both;
animation-fill-mode: both;
-webkit-animation-duration: 1s;
-moz-animation-duration: 1s;
-ms-animation-duration: 1s;
-o-animation-duration: 1s;
animation-duration: 1s
}
::selection{color:#fff;background:#207cc7}
::-moz-selection{color:#fff;background:#207cc7;}
:window-inactive {display: none;}
::-webkit-scrollbar{width:5px;height:5px;}
::-webkit-scrollbar-track{background:#ccc;}
::-webkit-scrollbar-track:hover{background:#ff0;}
::-webkit-scrollbar-track:window-inactive{background:#f6f6f6;}
::-webkit-scrollbar-thumb{background:#888;}
::-webkit-scrollbar-thumb:window-inactive{background:#f6f6f6;}
::-webkit-scrollbar-thumb:hover{background:#666;}
::-webkit-scrollbar-button {background:#333;}
::-webkit-scrollbar-button:window-inactive {background:#f6f6f6;}
.fadeInDown {
-webkit-animation-name: fadeInDown;
-moz-animation-name: fadeInDown;
-o-animation-name: fadeInDown;
animation-name: fadeInDown
}
@-webkit-keyframes fadeIn {
50% {
opacity: .6
}
100% {
opacity: 1
}
}
@-webkit-keyframes fadeInDown {
0% {
opacity: 0;
-webkit-transform: translateY(-20px)
}
100% {
opacity: 1;
-webkit-transform: translateY(0)
}
}
@-moz-keyframes fadeInDown {
0% {
opacity: 0;
-moz-transform: translateY(-20px)
}
100% {
opacity: 1;
-moz-transform: translateY(0)
}
}
@-o-keyframes fadeInDown {
0% {
opacity: 0;
-o-transform: translateY(-20px)
}
100% {
opacity: 1;
-o-transform: translateY(0)
}
}
@keyframes fadeInDown {
0% {
opacity: 0;
transform: translateY(-20px)
}
100% {
opacity: 1;
transform: translateY(0)
}
}
::selection {
color: #fff;
background: #207cc7
}
::-moz-selection {
color: #fff;
background: #207cc7
}
:window-inactive {
display: none
}
::-webkit-scrollbar {
width: 5px;
height: 5px
}
::-webkit-scrollbar-track {
background: #ccc
}
::-webkit-scrollbar-track:hover {
background: #ff0
}
::-webkit-scrollbar-track:window-inactive {
background: #f6f6f6
}
::-webkit-scrollbar-thumb {
background: #888
}
::-webkit-scrollbar-thumb:window-inactive {
background: #f6f6f6
}
::-webkit-scrollbar-thumb:hover {
background: #666
}
::-webkit-scrollbar-button {
background: #333
}
::-webkit-scrollbar-button:window-inactive {
background: #f6f6f6
}