|
|
@@ -13,7 +13,7 @@ include(DEDEDATA.'/mark/inc_photowatermark_config.php'); |
|
|
|
<meta name="format-detection" content="telephone=no"> |
|
|
|
<title>插入多图</title> |
|
|
|
<link rel="stylesheet" href="../../static/web/font/css/font-awesome.min.css"> |
|
|
|
<style>body{margin:0;line-height:1.6;font:12px Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif;color:#545b62;background:#fff}ul{margin:0;padding:0;list-style:none}input[type=radio],input[type=checkbox]{margin:0;height:auto;outline:none;box-shadow:none;vertical-align:text-top}button+button{margin-left:10px}#wrap{padding:10px}#topbar{padding:10px 0;border-bottom:1px solid #ccc;text-align:right}#topbar button{display:inline-block;padding:.25rem .65rem;line-height:1.6;font-size:12px;color:#fff;background:#1eb867;border-color:#1eb867;border-radius:.5rem;border:0;transition:all .5s;text-align:center}.topbar button+.topbar button{margin-left:10px}#topbar button:focus{background:#006829;border-color:#005b24;box-shadow:0 .125rem .25rem rgba(0,0,0,.075);outline:none}#file_list{display:grid;grid-gap:10px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));padding-top:10px}#file_list:empty:after{content:'拖拽图片到此处上传'}#file_list li{display:block;position:relative;padding:10px;vertical-align:top;border-radius:.5rem}#file_list li.up-now:after{content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,0.8) url(../../static/web/img/loadinglit.gif)center center no-repeat;border-radius:.5rem;z-index:999}#file_list li:hover{background:#f5f5f5}#file_list li .picbox{display:flex;flex:0 0 auto;position:relative;padding-top:90%;width:100%;align-items:center;justify-content:center;overflow:hidden}#file_list li .picbox img{display:block;max-width:100%;max-height:100%;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);border-radius:.5rem}#file_list li .namebox{display:flex;padding:10px;justify-content:center;align-items:flex-start}#file_list li.up-over .picbox:after{position:absolute;bottom:10px;right:0;font-family:'FontAwesome';font-size:18px;color:#1eb867;content:'\f058';z-index:9}#file_list li .tools{display:none;position:absolute;bottom:12px;right:10px;z-index:99}#file_list li:hover .tools{display:block}#file_list li .tools .remove{cursor:pointer}#file_list li .tools .remove:after{font-family:'FontAwesome';font-size:18px;color:#dc3545;content:'\f1f8'}</style> |
|
|
|
<style>body{margin:0;line-height:1.6;font-size:14px;font-family:Helvetica Neue,Helvetica,PingFang SC,Tahoma,Arial,sans-serif;color:#545b62;background:#fff}ul{margin:0;padding:0;list-style:none}input[type=radio],input[type=checkbox]{margin:0;height:auto;outline:none;box-shadow:none;vertical-align:text-top}button+button{margin-left:10px}#wrap{padding:10px}#topbar{padding:10px 0;border-bottom:1px solid #ccc;text-align:right}#topbar button{display:inline-block;padding:.25rem .65rem;line-height:1.6;font-size:12px;color:#fff;background:#1eb867;border-color:#1eb867;border-radius:.5rem;border:0;transition:all .5s;text-align:center}.topbar button+.topbar button{margin-left:10px}#topbar button:focus{background:#006829;border-color:#005b24;box-shadow:0 .125rem .25rem rgba(0,0,0,.075);outline:none}#file_list{display:grid;grid-gap:10px;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));padding-top:10px}#file_list:empty:after{content:'拖拽图片到此处上传'}#file_list li{display:block;position:relative;padding:10px;vertical-align:top;border-radius:.5rem}#file_list li.up-now:after{content:'';display:block;position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(255,255,255,0.8) url(../../static/web/img/loadinglit.gif)center center no-repeat;border-radius:.5rem;z-index:999}#file_list li:hover{background:#f5f5f5}#file_list li .picbox{display:flex;flex:0 0 auto;position:relative;padding-top:90%;width:100%;align-items:center;justify-content:center;overflow:hidden}#file_list li .picbox img{display:block;max-width:100%;max-height:100%;position:absolute;top:50%;left:50%;transform:translateX(-50%) translateY(-50%);border-radius:.5rem}#file_list li .namebox{display:flex;padding:10px;justify-content:center;align-items:flex-start}#file_list li.up-over .picbox:after{position:absolute;bottom:10px;right:0;font-family:'FontAwesome';font-size:18px;color:#1eb867;content:'\f058';z-index:9}#file_list li .tools{display:none;position:absolute;bottom:12px;right:10px;z-index:99}#file_list li:hover .tools{display:block}#file_list li .tools .remove{cursor:pointer}#file_list li .tools .remove:after{font-family:'FontAwesome';font-size:18px;color:#dc3545;content:'\f1f8'}</style> |
|
|
|
</head> |
|
|
|
<body> |
|
|
|
<div id="wrap"> |
|
|
|