mirror of https://github.com/helloxz/imgurl.git
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
614 lines
12 KiB
614 lines
12 KiB
body{ |
|
background-image:url('/static/images/bg.jpg'); |
|
background-size: cover; |
|
/*width: 100%; |
|
color:#232323;*/ |
|
} |
|
@media screen and (max-width:640px) { |
|
body{ |
|
background-color: #330033; |
|
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%23404' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%23505'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E"); |
|
background-size: cover; |
|
width: 100%; |
|
color:#232323; |
|
} |
|
} |
|
.layui-input{ |
|
background-color:rgba(255,255,255,0.3); |
|
} |
|
.header{ |
|
/* background-color:#393D49; */ |
|
/* background-color: #888888; */ |
|
|
|
background-color:rgba(0,0,0,0.5); |
|
width:100%; |
|
} |
|
.left-menu{ |
|
float: left; |
|
padding-top:15px; |
|
} |
|
.left-menu a{ |
|
color:#E1E1E1; |
|
} |
|
.right-menu{ |
|
float: right; |
|
} |
|
.menu{ |
|
float: right; |
|
/* margin-top: 15px; */ |
|
margin-top:1px; |
|
|
|
|
|
} |
|
.menu .layui-nav{ |
|
background-color:rgba(136,136,136,0); |
|
} |
|
.footer{ |
|
width:100%; |
|
position:fixed; |
|
left:0; |
|
bottom:0; |
|
/* background: #2F4056; */ |
|
color:#FFFFFF; |
|
padding:14px; |
|
text-align: center; |
|
/* border-top:1px solid #BBBBBB; */ |
|
background-color:rgba(0,0,0,0.5); |
|
} |
|
.footer a{ |
|
color:#FFFFFF; |
|
} |
|
.login{ |
|
margin-top:100px; |
|
} |
|
.login button{ |
|
width:100%; |
|
} |
|
#upimg{ |
|
margin-left:auto; |
|
margin-right:auto; |
|
margin-top:0.6em; |
|
/*width:94.6%;*/ |
|
width:100%; |
|
-moz-box-sizing: border-box; /*Firefox3.5+*/ |
|
-webkit-box-sizing: border-box; /*Safari3.2+*/ |
|
-o-box-sizing: border-box; /*Opera9.6*/ |
|
-ms-box-sizing: border-box; /*IE8*/ |
|
box-sizing: border-box; |
|
left:0%; |
|
|
|
|
|
background-color:rgba(0,0,0,0.3); |
|
/* background-color:#FFFFFF; */ |
|
border-radius: 5px; |
|
box-shadow: 2px 2px 10px #888888; |
|
} |
|
.layui-upload-drag{ |
|
border:0px; |
|
} |
|
|
|
#upimg i{ |
|
font-size:80px; |
|
margin-left:auto; |
|
margin-right:auto; |
|
} |
|
#upimg p{ |
|
margin-bottom:20px; |
|
color:#FFFFFF; |
|
} |
|
#upok{ |
|
margin-top:4em; |
|
display: none; |
|
} |
|
|
|
#showpic img{ |
|
max-width: 100%; |
|
max-height: 100%; |
|
border:1px solid #ECECEC; |
|
border-radius:5px; |
|
margin-top:1em; |
|
margin-left:auto; |
|
margin-right:auto; |
|
} |
|
#found-img{ |
|
margin-top:1em; |
|
|
|
} |
|
#found-img img{ |
|
max-width: 100%; |
|
max-height:100%; |
|
/*border:1px solid #ECECEC;*/ |
|
border-radius:5px; |
|
/*margin-top:1em;*/ |
|
margin-left:auto; |
|
margin-right:auto; |
|
margin:0 auto; |
|
display: block; |
|
} |
|
.msg{ |
|
/* width:100%; */ |
|
background-color:#f2f2f2; |
|
line-height: 1em; |
|
padding:12px; |
|
margin-top:2em; |
|
color:#009688; |
|
} |
|
#left-menu{ |
|
top:4em; |
|
} |
|
.picadmin{ |
|
/* display:table; */ |
|
margin:0 auto; |
|
height:200px; |
|
border:1px solid #ECECEC; |
|
margin-top:1em; |
|
} |
|
.picadmin img{ |
|
max-width: 100%; |
|
max-height:100%; |
|
/*border:1px solid #ECECEC;*/ |
|
border-radius:5px; |
|
margin:0 auto; |
|
display: block; |
|
} |
|
.page{ |
|
margin-bottom:100px; |
|
margin-top:60px; |
|
} |
|
#about{ |
|
margin-top:4em; |
|
color:#353535; |
|
|
|
} |
|
#about p{ |
|
margin-top:1em; |
|
margin-bottom:1em; |
|
} |
|
#about h3{ |
|
font-weight: bold; |
|
} |
|
#about a{ |
|
color:#01AAED; |
|
} |
|
#about ul li{ |
|
list-style-type:disc; |
|
line-height:1.6em; |
|
margin-left:2em; |
|
} |
|
#about ul{ |
|
margin-top:1em; |
|
margin-bottom:1em; |
|
} |
|
|
|
.smfile{ |
|
width:100%; |
|
height:188px; |
|
border: 1px dashed #e2e2e2; |
|
margin-top:2em; |
|
} |
|
.smfile .file { |
|
position: relative; |
|
display: inline-block; |
|
/* background: #D0EEFF; */ |
|
/* border: 1px solid #99D3F5; |
|
border-radius: 4px; |
|
padding: 4px 12px; */ |
|
overflow: hidden; |
|
color: #009688; |
|
text-decoration: none; |
|
text-indent: 0; |
|
line-height: 188px; |
|
display: block; |
|
height: 100%; |
|
text-align: center; |
|
margin-left:auto; |
|
margin-right:auto; |
|
background-color: #F9F9F9; |
|
} |
|
.smfile .file input { |
|
position: absolute; |
|
font-size: 100px; |
|
right: 0; |
|
top: 0; |
|
opacity: 0; |
|
} |
|
.smfile .file:hover { |
|
/* background: #AADFFD; |
|
border-color: #78C3F3; */ |
|
color:#009688; |
|
text-decoration: none; |
|
} |
|
.showimg{ |
|
display:none; |
|
position:absolute; |
|
max-width:460px; |
|
top:3em; |
|
z-index:99; |
|
border:1px solid #e2e2e2; |
|
border-radius:5px; |
|
} |
|
.layui-table img { |
|
max-width: 460px; |
|
} |
|
.viewimg{ |
|
position: absolute; |
|
display:none; |
|
border:1px solid #F0F0F0; |
|
border-radius:5px; |
|
z-index:99; |
|
top:3em; |
|
} |
|
.viewimg img{ |
|
max-width:660px; |
|
} |
|
|
|
#adminshow{ |
|
display: none; |
|
} |
|
#adminshow img{ |
|
max-width:680px; |
|
max-height: 400px; |
|
text-align:center; |
|
|
|
} |
|
#copy{ |
|
width:680px; |
|
margin-left:auto; |
|
margin-right:auto; |
|
} |
|
.urltext{ |
|
margin-top:2em; |
|
} |
|
#tongji .item{ |
|
/*height:8em;*/ |
|
background-color: #F0F0F0; |
|
/*border:1px solid #e2e2e2;*/ |
|
border-radius: 2px; |
|
background-color: #99CCCC; |
|
color:#FFFFFF; |
|
text-align:center; |
|
margin-bottom:1em; |
|
line-height:3em; |
|
|
|
} |
|
#tongji .item:hover{ |
|
-webkit-box-shadow: 2px 2px 8px 1px rgba(20, 20, 20, 0.15); -moz-box-shadow: 2px 2px 8px 1px rgba(20, 20, 20, 0.15);box-shadow: 2px 2px 8px 1px rgba(20, 20, 20, 0.15); |
|
cursor:pointer; |
|
} |
|
#tongji a{ |
|
color:#FFFFFF; |
|
} |
|
/* 图片控制 */ |
|
.imgcon{ |
|
position: absolute; |
|
z-index: 99; |
|
right:5px; |
|
bottom: 5px; |
|
display: none; |
|
} |
|
#pic-right .layui-tab{ |
|
margin:0 0; |
|
} |
|
.sidebar{ |
|
height: auto; |
|
/* border:1px solid #ccc; */ |
|
border-radius: 3px; |
|
/* margin-bottom: 2em; */ |
|
background-color:#FFFFFF; |
|
box-shadow: 2px 2px 10px #888888; |
|
} |
|
.sidebar img{ |
|
max-width: 100%; |
|
} |
|
.sidebar-top{ |
|
margin-top: 2em; |
|
} |
|
.alert { |
|
margin: 0; |
|
} |
|
.alert:not(.alert-secondary) { |
|
color: #fff; |
|
} |
|
.alert { |
|
position: relative; |
|
font-size: .875rem; |
|
padding: 1rem 1.5rem; |
|
border: 0; |
|
border-radius: .25rem; |
|
margin-top:1em; |
|
} |
|
.alert-warning { |
|
color: #fff; |
|
border-color: #fc7c5f; |
|
border:1px solid #fc7c5f; |
|
/* background-color: #fc7c5f; */ |
|
/* background-color: rgba(252,124,95,0.5); */ |
|
} |
|
.alert-warning a{ |
|
color:#5FB878; |
|
} |
|
#storage{ |
|
margin-top:1em; |
|
} |
|
#imgshow{ |
|
box-shadow: 2px 2px 10px #888888; |
|
border-radius: 5px; |
|
height:auto; |
|
/* background-color:rgba(136,136,136,0.0); */ |
|
background-color: rgba(0,0,0,0.3); |
|
/* background-color: #FFFFFF; */ |
|
display: none; |
|
margin-top:1em; |
|
} |
|
#imgshow tr{ |
|
color:#FFFFFF; |
|
} |
|
#imgshow tr:nth-child(even) { |
|
background-color: rgba(0,0,0,0); |
|
} |
|
#imgshow tr:hover{ |
|
background-color: rgba(0,0,0,0); |
|
} |
|
|
|
#img-thumb img{ |
|
display: block; |
|
max-width: 100%; |
|
max-height: 100%; |
|
margin-top:2em; |
|
margin-left:auto; |
|
margin-right:auto; |
|
|
|
/*border: 1px solid #ECECEC;*/ |
|
border-radius: 5px; |
|
max-height: 175px; |
|
} |
|
#links{ |
|
background-color: rgba(0,0,0,0); |
|
} |
|
#links .layui-table{ |
|
background-color: rgba(255,255,255,0); |
|
} |
|
.img-main{ |
|
margin-top:1em; |
|
} |
|
#onepic{ |
|
background-color:#FFFFFF; |
|
padding:1em; |
|
border-radius: 3px; |
|
box-shadow: 2px 2px 10px #888888; |
|
} |
|
#onepic img{ |
|
max-width: 100%; |
|
} |
|
.sidebar h2{ |
|
padding:0.6em; |
|
} |
|
.picinfo{ |
|
margin-top:2em; |
|
margin-bottom: 1em; |
|
} |
|
.onepic .title{ |
|
margin-bottom: 1em; |
|
} |
|
.picinfo span{ |
|
padding-right:1.5em; |
|
} |
|
#logo img{ |
|
width:180px; |
|
height:60px; |
|
|
|
} |
|
#logo{ |
|
margin-top:-1em; |
|
|
|
} |
|
.img_thumb{ |
|
|
|
/* border:1px solid #666666; */ |
|
/* border-radius: 5px; */ |
|
text-align:center; |
|
height:169.72px; |
|
background: #F6F6F6; |
|
display: block; |
|
/* display: flex; |
|
align-items: center; */ |
|
|
|
} |
|
.img_thumb img{ |
|
/* width:290px; |
|
height:175px; */ |
|
max-width: 100%; |
|
max-height: 100%; |
|
} |
|
.imgcon{ |
|
position: absolute; |
|
z-index: 99; |
|
right:5px; |
|
bottom: 5px; |
|
display: none; |
|
} |
|
|
|
/* .layui-layer-imgprev{ |
|
position:fixed; |
|
} |
|
|
|
.layui-layer-imguide{ |
|
display:block; |
|
} */ |
|
#imglink{ |
|
display: none; |
|
} |
|
.statement{ |
|
margin-top:1em; |
|
background-color:#F0F0F0; |
|
padding: 0.6em; |
|
font-weight: bold; |
|
color:#3A3A3A; |
|
} |
|
.statement i{ |
|
color:#FF5722; |
|
} |
|
.htmlcontent{ |
|
background-color:#FFFFFF; |
|
padding-left:2em; |
|
padding-right:2em; |
|
} |
|
.htmlcontent img{ |
|
max-width: 100%; |
|
} |
|
.htmlcontent h1, h2, h3, h4, h5, h6 ,p{ |
|
color:#393D49; |
|
} |
|
.htmlcontent h1{ |
|
font-size:2.2em; |
|
line-height:2em; |
|
|
|
} |
|
.htmlcontent h2{ |
|
font-size:1.8em; |
|
line-height:2em; |
|
} |
|
.htmlcontent h3{ |
|
font-size:1.6em; |
|
line-height:2em; |
|
} |
|
.htmlcontent h4{ |
|
font-size:1.4em; |
|
line-height:2em; |
|
} |
|
.htmlcontent p{ |
|
line-height: 1.6em; |
|
} |
|
.htmlcontent a{ |
|
color:#01AAED; |
|
} |
|
.md ul ol{ |
|
margin-top:0.5em; |
|
margin-bottom:0.5em; |
|
} |
|
.htmlcontent ul li{ |
|
list-style-type:disc; |
|
line-height:1.6em; |
|
margin-left:2em; |
|
} |
|
.htmlcontent ol li{ |
|
list-style-type:decimal; |
|
line-height:1.6em; |
|
margin-left:2em; |
|
} |
|
.htmlcontent code{ |
|
font-family: Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace; |
|
color: #b94a48; |
|
padding: 2px 4px; |
|
background: #f3f3f0 none repeat scroll 0 0; |
|
margin-left:0.3em; |
|
margin-right:0.3em; |
|
} |
|
.htmlcontent{ |
|
color:#393D49; |
|
} |
|
#page-sidebar{ |
|
background-color:#FFFFFF; |
|
} |
|
#multiple{ |
|
margin-left:auto; |
|
margin-right:auto; |
|
margin-top:0.6em; |
|
/*width:94.6%;*/ |
|
width:100%; |
|
-moz-box-sizing: border-box; /*Firefox3.5+*/ |
|
-webkit-box-sizing: border-box; /*Safari3.2+*/ |
|
-o-box-sizing: border-box; /*Opera9.6*/ |
|
-ms-box-sizing: border-box; /*IE8*/ |
|
box-sizing: border-box; |
|
left:0%; |
|
background-color:rgba(0,0,0,0.3); |
|
/* background-color:#FFFFFF; */ |
|
border-radius: 5px; |
|
box-shadow: 2px 2px 10px #888888; |
|
} |
|
#multiple-re{ |
|
display: none; |
|
} |
|
#multiple p{ |
|
color:#FFFFFF; |
|
} |
|
#multiple-re{ |
|
width:100%; |
|
color:#FFFFFF; |
|
background-color:rgba(0,0,0,0.5); |
|
} |
|
.multiple-btn{ |
|
position: absolute; |
|
bottom: 0.6em; |
|
} |
|
#multiple i{ |
|
font-size:80px; |
|
margin-left:auto; |
|
margin-right:auto; |
|
} |
|
#multiple p{ |
|
margin-bottom:20px; |
|
color:#FFFFFF; |
|
} |
|
/* 分页CSS样式 */ |
|
#paging .paging{ |
|
padding:0.6em; |
|
background: #eeeeee; |
|
margin-right: 0.5em; |
|
} |
|
#paging strong{ |
|
padding:0.6em; |
|
background: #5FB878; |
|
margin-right: 0.5em; |
|
color:#FFFFFF; |
|
} |
|
#timeline .layui-timeline ul>li{ |
|
color:#FFFFFF; |
|
} |
|
#timeline .layui-timeline p{ |
|
color:#FFFFFF; |
|
} |
|
#timeline .layui-text h3 { |
|
font-weight: 500; |
|
color: #FFFFFF; |
|
} |
|
#timeline{ |
|
margin-top:1.5em; |
|
margin-bottom: 3.5em; |
|
padding-left:1em; |
|
padding-top:1em; |
|
background-color:rgba(0,0,0,0.5); |
|
} |
|
#left-gg{ |
|
position:fixed; |
|
left:10px; |
|
top:80px; |
|
width:100%; |
|
max-width: 120px; |
|
} |
|
#left-gg img{ |
|
width:100%; |
|
max-width: 120px; |
|
} |
|
#right-gg{ |
|
position:fixed; |
|
top:80px; |
|
right:10px; |
|
} |
|
#right-gg img{ |
|
width:100%; |
|
max-width: 120px; |
|
} |
|
@media screen and (max-width: 1366px) { |
|
#left-gg,#right-gg{ |
|
display: none; |
|
} |
|
} |
|
.title h2{ |
|
overflow: hidden; |
|
text-overflow:ellipsis; |
|
} |
|
#links .layui-input{ |
|
height:32px; |
|
} |