dlstatic / seven-piece · Commits

Commit ba8d5483afc0fe51806420409566e8a7fbf23f26

Authored by linksgo2011
1 parent fb0326e4

image

Inline Side-by-side
Showing 7 changed files with 1181 additions and 34 deletions
css/admin.css
  View file @ba8d548
... ... @@ -200,7 +200,12 @@ header .btns .btn:hover{
200 200 display: inline-block;
201 201 position: absolute;
202 202 right: 10px;
203   - top: 10px;
  203 +}
  204 +.simulator .wrap .inner .title{
  205 + display: inline-block;
  206 + position: absolute;
  207 + left: 10px;
  208 + line-height:30px;
204 209 }
205 210 .simulator .holder .m-btn{
206 211 display: inline-block;
... ... @@ -258,14 +263,16 @@ header .btns .btn:hover{
258 263 text-indent: 9999px;
259 264 display: inline-block;
260 265 background-image: url(../images/dist/admin_sprite.png);
261   - background-position: -58px -186px;
  266 + background-position: -138px -186px;
262 267 width: 8px;
263 268 height: 8px;
264 269 }
265 270  
266 271 .flexslider .flex-control-nav a.flex-active {
267 272 background-image: url(../images/dist/admin_sprite.png);
268   - background-position: -44px -186px;
  273 + background-position: -124px -186px;
  274 + width: 8px;
  275 + height: 8px;
269 276 }
270 277  
271 278 .flexslider .flex-direction-nav .flex-prev {
... ... @@ -274,17 +281,17 @@ header .btns .btn:hover{
274 281 left: 0;
275 282 display: inline-block;
276 283 background-image: url(../images/dist/admin_sprite.png);
277   - background-position: 0px -186px;
  284 + background-position: -22px -186px;
278 285 width: 16px;
279 286 height: 20px;
280 287 }
281 288 .flexslider .flex-direction-nav .flex-next {
282 289 display: inline-block;
283 290 position: absolute;
284   - width: 16px;
285   - height: 20px;
286   - background-image: url(../images/dist/admin_sprite.png);
287   - background-position: -22px -186px;
288 291 bottom: 12px;
289 292 right: 0px;
  293 + background-image: url(../images/dist/admin_sprite.png);
  294 + background-position: 0px -186px;
  295 + width: 16px;
  296 + height: 20px;
290 297 }
... ...
css/common.css
  View file @ba8d548
1   -@import "icon.css";@import "icon_admin.css";*{-moz-tap-highlight-color:transparent;-o-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent}html{height:100%}abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;vertical-align:baseline;background:0 0}body{font:12px/1.5 sans-serif;background-color:#F5F5F5;position:relative;color:#333;min-height:100%;overflow-x:hidden}article,aside,details,figcaption,figure,footer,header,menu,nav,section{display:block}nav ul{list-style:none}li{list-style:none}em{font-style:normal}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:0;padding:0}input,select{vertical-align:middle}button:focus,input:focus{outline:0}a{color:#333;text-decoration:none;margin:0;padding:0;vertical-align:baseline;background:0 0}a:active,a:visited{color:#333}img,input{border:0;vertical-align:middle}a,input,textarea{-webkit-tap-highlight-color:transparent}.clear,.clearfix{display:inline-table;zoom:1}* html .clear,* html .clearfix{height:1%}* html .clear,* html .clearfix{zoom:1}.clear,.clearfix{display:block}.clear{clear:both}.clear:after,.clearfix:after{content:" ";display:block;height:0;clear:both;visibility:hidden;line-height:0}.border-1px{position:relative}.border-1px:after,.border-1px:before{border-top:1px solid #e2e2e2;content:'';display:block;width:100%;position:absolute;left:0;z-index:1}.border-1px:before{top:0}.border-1px:after{bottom:0}.border-1px.border-top:after{display:none}.border-1px.border-bottom:before{display:none}.border-1px-full{position:relative}.border-1px-full:after{content:'';position:absolute;top:0;left:0;z-index:1;border:1px solid #e2e2e2;-webkit-box-sizing:border-box;box-sizing:border-box;width:200%;height:200%;-webkit-transform:scale(.5);transform:scale(.5);-webkit-transform-origin:left top;transform-origin:left top}@media (-webkit-min-device-pixel-ratio:1.5),(min-device-pixel-ratio:1.5){.border-1px::after,.border-1px::before{-webkit-transform:scaleY(.7);-webkit-transform-origin:0 0;transform:scaleY(.7)}.border-1px::after{-webkit-transform-origin:left bottom}}@media (-webkit-min-device-pixel-ratio:2),(min-device-pixel-ratio:2){.border-1px::after,.border-1px::before{-webkit-transform:scaleY(.5);transform:scaleY(.5)}}.m-header{z-index:5;color:#FFF;color:#fff;background-color:#23AC38;position:relative}.m-header .head{padding:0 50px;box-sizing:border-box;height:44px;text-align:center}.m-header .head h1{display:inline-block;vertical-align:middle;line-height:44px;font-weight:400;font-size:18px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.m-header .lt-bar,.m-header .rt-bar{position:absolute;left:0;top:0;bottom:0;min-width:44px;line-height:44px;height:100%;text-align:center;cursor:pointer;z-index:1}.m-header .lt-bar{float:left}.m-header .lt-bar.text{padding-left:10px;text-align:left}.m-header .rt-bar{float:right;left:auto;right:0}.m-header .rt-bar.text{padding-right:10px;text-align:right}.m-header .text{text-align:center;line-height:44px;font-size:15px;color:#FFF}.m-header.header-light{background-color:#FFF;color:#666}.m-header.header-light .text{color:#666}.m-header.header-light .m-input{color:#333}.m-header.header-light .m-input::-webkit-input-placeholder{color:#999}.swiper-container{margin:0 auto;position:relative;overflow:hidden;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;-ms-backface-visibility:hidden;-o-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-wrapper{position:relative;width:100%;-webkit-transition-property:-webkit-transform,left,top;-webkit-transition-duration:0s;-webkit-transform:translate3d(0,0,0);-webkit-transition-timing-function:ease;-moz-transition-property:-moz-transform,left,top;-moz-transition-duration:0s;-moz-transform:translate3d(0,0,0);-moz-transition-timing-function:ease;-o-transition-property:-o-transform,left,top;-o-transition-duration:0s;-o-transform:translate3d(0,0,0);-o-transition-timing-function:ease;-o-transform:translate(0,0);-ms-transition-property:-ms-transform,left,top;-ms-transition-duration:0s;-ms-transform:translate3d(0,0,0);-ms-transition-timing-function:ease;transition-property:transform,left,top;transition-duration:0s;transform:translate3d(0,0,0);transition-timing-function:ease;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.swiper-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-moz-transition-timing-function:ease-out;-ms-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{float:left;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box}.swiper-wp8-horizontal{-ms-touch-action:pan-y}.swiper-wp8-vertical{-ms-touch-action:pan-x}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:300ms;-moz-transition:300ms;-o-transition:300ms;transition:300ms;-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination{bottom:10px;left:0;width:100%}.swiper-pagination .swiper-pagination-switch{margin:0 5px}.swiper-pagination-switch{width:8px;height:8px;display:inline-block;background:0 0;-webkit-box-shadow:inset 0 0 0 2px #ddd;box-shadow:inset 0 0 0 2px #ddd;-webkit-box-shadow:inset hoff voff blur color;box-shadow:inset hoff voff blur color;border-radius:100%}.swiper-active-switch{opacity:1;-webkit-box-shadow:inset 0 0 0 4px #23AC38;box-shadow:inset 0 0 0 4px #23AC38}.m-slider{height:120px;position:relative;overflow:hidden;font-size:0}.m-slider a{display:block;width:100%;height:100%}.m-slider img{display:inline-block;width:100%;height:100%;float:left}.m-slider .swiper-container{height:100%}.m-slider .swiper-wrapper{height:100%}.m-section .section-head{line-height:45px;padding:0 10px;background-color:#fff;font-size:14px;color:#666;text-align:left;font-weight:700;margin-bottom:10px}.m-section .section-head:first-letter{font-size:18px;color:#23ac38}.section-items{margin-bottom:10px}.section-items .section-item{display:block;margin-bottom:5px;width:100%}.section-items .section-item img{width:100%;max-width:100%}.product-items{background-color:#FFF;margin-bottom:10px}.product-items .items .item{width:33.33%;float:left;font-size:13px;text-align:center;padding:8px 0}.product-items .items .item a{display:block;position:relative;z-index:2}.product-items .items .item h3{font-size:13px;padding:0 5px;font-weight:700;color:#333;line-height:16px;padding:0 10px;text-align:left;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.product-items .items .item p{padding:0 10px;text-align:left}.product-items .items .item em{text-align:left;display:block;font-size:13px;font-weight:700;font-style:normal;color:#FA4535;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.product-items .items .item span{display:block;text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.product-items .items .item .pic{max-width:100%;height:60px;display:inline-block;vertical-align:middle}.product-items .items .item:after{border-left:none;border-top:none}.m-list-view{margin-bottom:10px}.m-list-view .cell{font-size:14px;padding:0 0 0 15px;background-color:#FFF;overflow:hidden;position:relative;text-align:left}.m-list-view .cell-header{background-color:#f8f8f8;padding:0 10px}.m-list-view .cell-header .title{font-size:13px;color:#333;line-height:35px;width:auto}.m-list-view .cell-header .text{font-size:13px;line-height:35px;float:right;color:#9e9e9e;text-align:right;margin:0}.m-list-view .cell-basic{padding:11px 10px}.m-list-view .cell-basic .text,.m-list-view .cell-basic .title{float:none;display:inline-block;vertical-align:middle;margin:0 10px 0 0;line-height:1.5}.m-list-view .cell-basic .sub-title{padding-top:10px;font-size:13px;color:#999}.m-list-view .cell-radio{text-align:right;padding:0 10px;margin-bottom:10px;background-color:#eee}.m-list-view .cell-radio .title{color:#333;width:auto;text-align:left}.m-list-view .cell-radio .text{float:none;text-align:right}.m-list-view .cell-radio .m-radio{margin-left:8px}.m-list-view .cell-radio .m-table-view{margin:0 -10px}.m-list-view .cell-radio .m-table-view .cell-radio{margin:0;background-color:#FFF}.m-list-view .cell-block{padding:8px 10px}.m-list-view .cell-block h3{font-size:16px;font-weight:400;padding-right:60px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.m-list-view .cell-block p{font-size:14px;color:#666}.m-list-view .cell-block .bottom{margin-top:10px;padding-top:8px;line-height:30px}.m-list-view .cell-extend .m-table-view{margin:0 0 0 45px}.m-list-view .cell-extend .m-table-view .cell{padding:0}.m-list-view .cell-extend .m-table-view .text{margin-left:0}.m-list-view .cell-pic{padding:15px}.m-list-view .cell-pic .pic{float:left}.m-list-view .cell-pic .cont{margin-left:90px}.m-list-view .cell-pic h3{font-size:14px;font-weight:400}.m-list-view .cell-pic em{font-size:16px;font-weight:400}.m-list-view .cell-pic p{color:#9b9b9b;font-size:12px}.m-list-view .acc-icon{position:relative;padding-right:30px}.m-list-view .acc-icon .acc{position:absolute;right:0;top:0;min-width:30px;height:100%;line-height:44px;text-align:left;color:#999;text-align:right}.m-list-view .acc-icon .acc .m-icon{margin-right:4px}.m-list-view .title{font-size:15px;color:#999;float:left;font-weight:400;line-height:44px}.m-list-view .text{display:block;font-size:15px;color:#333;line-height:44px;position:relative;white-space:nowrap;word-break:break-all;text-overflow:ellipsis;overflow:hidden}.m-list-view .text .m-input{font-size:15px}.m-goods-items{padding:0 5px 5px;overflow-x:scroll;overflow-y:hidden;-webkit-overflow-scrolling:touch}.m-goods-items li{float:left;width:110px;padding:0 5px 10px;box-sizing:border-box}.m-goods-items a{display:block;background-color:#fff;padding-bottom:5px;position:relative}.m-goods-items .hot{position:absolute;top:-1px;right:10px;width:20px;height:56px;background:url(../images/icon_mark.png)0 0 no-repeat;background-size:100%;font-size:0;overflow:hidden}.m-goods-items .pic{display:block;width:100%;height:110px;margin:0 auto 5px;background-position:center center;background-repeat:no-repeat;background-size:cover}.m-goods-items h3{font-size:13px;padding:0 5px;font-weight:700;color:#333;text-align:left;line-height:16px;height:32px;overflow:hidden}.m-goods-items em{text-align:left;display:block;padding:0 5px;font-size:13px;font-weight:700;font-style:normal;color:#FA4535}.m-goods-items .origin-price{font-size:12px;color:#bbb;text-decoration:line-through}.photo-wall{width:100%;padding-left:5px;box-sizing:border-box;margin-bottom:5px}.photo-wall .photo-item{float:left;box-sizing:border-box;padding:0 5px 5px 0;height:105px}.photo-wall .photo-item img{width:100%;height:100%;max-width:100%;max-height:100%}.photo-wall .photo-1p{width:33.33%}.photo-wall .photo-2p{width:66.66%}.m-nav{width:100%;background-color:#444;font-size:14px;color:#999;overflow:hidden;box-sizing:border-box}.m-nav a{color:#999;padding:0 10px;min-width:70px}.m-nav li{float:left;line-height:40px;text-align:center;position:relative}.m-nav li:last-child{padding-right:0}.m-nav .on a{color:#FFF;background-color:#23ac38;display:block;position:relative}.m-tab{width:100%;background-color:#FFF;font-size:14px;color:#999;border-width:1px 0;overflow:hidden;box-sizing:border-box;margin-bottom:10px}.m-tab a{display:block;color:#999;padding:0 10px;min-width:70px}.m-tab li{float:left;line-height:45px;text-align:center;position:relative}.m-tab li:last-child{padding-right:0}.m-tab .on a{color:#23ac38;display:block;position:relative}.m-tab .on a:after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background-color:#23ac38}.text-left{text-align:left!important}.text-center{text-align:center!important}.text-right{text-align:right!important}.text-nowrap{white-space:nowrap!important}.text-overflow{overflow:hidden;text-overflow:ellipsis}.text-lowercase{text-transform:lowercase}.text-uppercase{text-transform:uppercase}.text-capitalize{text-transform:capitalize}.text-indent{text-indent:-999em}.float-left{float:left!important}.float-right{float:right!important}.float-none{float:none!important}.display-block{display:block!important}.clearfix:after{content:'';display:block;height:0;overflow:hidden;font-size:0;clear:both}.m-hide{display:none!important;visibility:hidden;opacity:0;z-index:-1}.m-hidden{visibility:hidden;opacity:0;z-index:-1}.m-show{display:block!important;visibility:visible}.m-separate{position:relative;width:100%;line-height:50px;text-align:center;font-size:12px;color:#666;overflow:visible}.m-more,a.m-more{display:block;font-size:12px;text-align:center;color:#999;line-height:45px;background-color:#FFF}.m-animate-hide{-webkit-transform:translate(0,100%) translateZ(0)!important;-ms-transform:translate(0,100%) translateZ(0)!important;-o-transform:translate(0,100%) translateZ(0)!important;transform:translate(0,100%) translateZ(0)!important}.m-animate-show{-webkit-transform:translate(0,0) translateZ(0)!important;-ms-transform:translate(0,0) translateZ(0)!important;-o-transform:translate(0,0) translateZ(0)!important;transform:translate(0,0) translateZ(0)!important}.hidden{opacity:0;z-index:-1}.mask-hidden{opacity:0}.font-white{color:#FFF!important}.font-white-opacity{color:rgba(255,255,255,.8)!important}.font-deep{color:#333!important}.font-gray{color:#666!important}.font-light{color:#999!important}.font-yellow{color:#FF9D2C!important}.font-orange{color:#FF6B00!important}.font-red{color:#fa4535!important}.font-green{color:#23ac38!important}.background-white{background-color:#FFF}.background-gray{background-color:#666!important}.background-yellow{background-color:#FF9D2C!important}.background-orange{background-color:#FF6B00!important}.background-red{background-color:#fa4535!important}.background-green{background-color:#23ac38!important}.position-relative{position:relative}.z-index2{z-index:2}.width-auto{width:auto!important}.width-200p{width:200%}.m-col-1{width:100%!important}.m-col-2{width:50%!important}.m-col-3{width:33.33%!important}.m-col-4{width:25%!important}.scroll-wrap{overflow-y:hidden;overflow-x:scroll;-webkit-overflow-scrolling:touch}.scroll-wrap .m-goods-items{white-space:nowrap}.scroll-wrap .m-goods-items li{float:none;display:inline;width:110px!important}.scroll-wrap .m-goods-items li a{display:inline-block;width:100px}.scroll-wrap .m-tab{white-space:nowrap;overflow:visible;width:auto}.scroll-wrap .m-tab li{float:none;display:inline;width:90px}.scroll-wrap .m-tab li a{display:inline-block}
2 1 \ No newline at end of file
  2 +@import "icon.css";
  3 +@import "icon_admin.css";
  4 +* {
  5 + -moz-tap-highlight-color: rgba(0, 0, 0, 0);
  6 + -o-tap-highlight-color: rgba(0, 0, 0, 0);
  7 + -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  8 +}
  9 +html {
  10 + height: 100%;
  11 +}
  12 +html,
  13 +body,
  14 +div,
  15 +span,
  16 +object,
  17 +iframe,
  18 +h1,
  19 +h2,
  20 +h3,
  21 +h4,
  22 +h5,
  23 +h6,
  24 +p,
  25 +blockquote,
  26 +pre,
  27 +abbr,
  28 +address,
  29 +cite,
  30 +code,
  31 +del,
  32 +dfn,
  33 +em,
  34 +img,
  35 +ins,
  36 +kbd,
  37 +q,
  38 +samp,
  39 +small,
  40 +strong,
  41 +sub,
  42 +sup,
  43 +var,
  44 +b,
  45 +i,
  46 +dl,
  47 +dt,
  48 +dd,
  49 +ol,
  50 +ul,
  51 +li,
  52 +fieldset,
  53 +form,
  54 +label,
  55 +legend,
  56 +table,
  57 +caption,
  58 +tbody,
  59 +tfoot,
  60 +thead,
  61 +tr,
  62 +th,
  63 +td,
  64 +article,
  65 +aside,
  66 +canvas,
  67 +details,
  68 +figcaption,
  69 +figure,
  70 +footer,
  71 +header,
  72 +menu,
  73 +nav,
  74 +section,
  75 +summary,
  76 +time,
  77 +mark,
  78 +audio,
  79 +video {
  80 + margin: 0;
  81 + padding: 0;
  82 + border: 0;
  83 + outline: 0;
  84 + vertical-align: baseline;
  85 + background: transparent;
  86 +}
  87 +body {
  88 + font: 12px/1.5 sans-serif;
  89 + background-color: #F5F5F5;
  90 + position: relative;
  91 + color: #333;
  92 + min-height: 100%;
  93 + overflow-x: hidden;
  94 +}
  95 +article,
  96 +aside,
  97 +details,
  98 +figcaption,
  99 +figure,
  100 +footer,
  101 +header,
  102 +menu,
  103 +nav,
  104 +section {
  105 + display: block;
  106 +}
  107 +nav ul {
  108 + list-style: none;
  109 +}
  110 +li {
  111 + list-style: none;
  112 +}
  113 +em {
  114 + font-style: normal;
  115 +}
  116 +ins {
  117 + background-color: #ff9;
  118 + color: #000;
  119 + text-decoration: none;
  120 +}
  121 +mark {
  122 + background-color: #ff9;
  123 + color: #000;
  124 + font-style: italic;
  125 + font-weight: bold;
  126 +}
  127 +table {
  128 + border-collapse: collapse;
  129 + border-spacing: 0;
  130 +}
  131 +hr {
  132 + display: block;
  133 + height: 1px;
  134 + border: 0;
  135 + border-top: 1px solid #cccccc;
  136 + margin: 0;
  137 + padding: 0;
  138 +}
  139 +input,
  140 +select {
  141 + vertical-align: middle;
  142 +}
  143 +input:focus,
  144 +button:focus {
  145 + outline: none;
  146 +}
  147 +a {
  148 + color: #333;
  149 + text-decoration: none;
  150 + margin: 0;
  151 + padding: 0;
  152 + vertical-align: baseline;
  153 + background: transparent;
  154 +}
  155 +a:active,
  156 +a:visited {
  157 + color: #333;
  158 +}
  159 +input,
  160 +img {
  161 + border: 0;
  162 + vertical-align: middle;
  163 +}
  164 +textarea,
  165 +input,
  166 +a {
  167 + -webkit-tap-highlight-color: transparent;
  168 +}
  169 +/* 清除浮动 */
  170 +.clearfix,
  171 +.clear {
  172 + display: inline-table;
  173 + zoom: 1;
  174 +}
  175 +* html .clearfix,
  176 +* html .clear {
  177 + height: 1%;
  178 +}
  179 +* html .clearfix,
  180 +* html .clear {
  181 + zoom: 1;
  182 +}
  183 +.clearfix,
  184 +.clear {
  185 + display: block;
  186 +}
  187 +.clear {
  188 + clear: both;
  189 +}
  190 +.clearfix:after,
  191 +.clear:after {
  192 + content: " ";
  193 + display: block;
  194 + height: 0;
  195 + clear: both;
  196 + visibility: hidden;
  197 + line-height: 0px;
  198 +}
  199 +.border-1px {
  200 + position: relative;
  201 +}
  202 +.border-1px:before,
  203 +.border-1px:after {
  204 + border-top: 1px solid #e2e2e2;
  205 + content: '';
  206 + display: block;
  207 + width: 100%;
  208 + position: absolute;
  209 + left: 0;
  210 + z-index: 1;
  211 +}
  212 +.border-1px:before {
  213 + top: 0;
  214 +}
  215 +.border-1px:after {
  216 + bottom: 0;
  217 +}
  218 +.border-1px.border-top:after {
  219 + display: none;
  220 +}
  221 +.border-1px.border-bottom:before {
  222 + display: none;
  223 +}
  224 +.border-1px-full {
  225 + position: relative;
  226 +}
  227 +.border-1px-full:after {
  228 + content: '';
  229 + position: absolute;
  230 + top: 0;
  231 + left: 0;
  232 + z-index: 1;
  233 + border: 1px solid #e2e2e2;
  234 + -webkit-box-sizing: border-box;
  235 + box-sizing: border-box;
  236 + width: 200%;
  237 + height: 200%;
  238 + -webkit-transform: scale(0.5);
  239 + transform: scale(0.5);
  240 + -webkit-transform-origin: left top;
  241 + transform-origin: left top;
  242 +}
  243 +@media (-webkit-min-device-pixel-ratio: 1.5), (min-device-pixel-ratio: 1.5) {
  244 + .border-1px::after,
  245 + .border-1px::before {
  246 + -webkit-transform: scaleY(0.7);
  247 + -webkit-transform-origin: 0 0;
  248 + transform: scaleY(0.7);
  249 + }
  250 + .border-1px::after {
  251 + -webkit-transform-origin: left bottom;
  252 + }
  253 +}
  254 +@media (-webkit-min-device-pixel-ratio: 2), (min-device-pixel-ratio: 2) {
  255 + .border-1px::after,
  256 + .border-1px::before {
  257 + -webkit-transform: scaleY(0.5);
  258 + transform: scaleY(0.5);
  259 + }
  260 +}
  261 +/***************************************************
  262 +* feature : 全局头部，提供默认 深色(绿底白字) & 浅色(白底黑字)主题;
  263 +* update : 2015/02/03;
  264 +* use : .m-header;
  265 +* extend : .header-*;
  266 +* example : <header class="m-header header-light"></header>;
  267 +* desc : 默认为深色主题, 通过 .header-light 来引用浅色主题;
  268 +* feedback : 此处填入 issue, 并请附带以下信息[os_version, browser_version, page_path, issue_description]
  269 +* - demo => [windows 7, IE 8, http://diligrp.com/icon.html, 在不定height下未能垂直居中];
  270 +****************************************************/
  271 +.m-header {
  272 + z-index: 5;
  273 + color: #FFF;
  274 + color: #ffffff;
  275 + background-color: #23AC38;
  276 + position: relative;
  277 +}
  278 +.m-header .head {
  279 + padding: 0 50px;
  280 + box-sizing: border-box;
  281 + height: 44px;
  282 + text-align: center;
  283 +}
  284 +.m-header .head h1 {
  285 + display: inline-block;
  286 + vertical-align: middle;
  287 + line-height: 44px;
  288 + font-weight: normal;
  289 + font-size: 18px;
  290 + white-space: nowrap;
  291 + text-overflow: ellipsis;
  292 + overflow: hidden;
  293 +}
  294 +.m-header .lt-bar,
  295 +.m-header .rt-bar {
  296 + position: absolute;
  297 + left: 0;
  298 + top: 0;
  299 + bottom: 0;
  300 + min-width: 44px;
  301 + line-height: 44px;
  302 + height: 100%;
  303 + text-align: center;
  304 + cursor: pointer;
  305 + z-index: 1;
  306 +}
  307 +.m-header .lt-bar {
  308 + float: left;
  309 +}
  310 +.m-header .lt-bar.text {
  311 + padding-left: 10px;
  312 + text-align: left;
  313 +}
  314 +.m-header .rt-bar {
  315 + float: right;
  316 + left: auto;
  317 + right: 0;
  318 +}
  319 +.m-header .rt-bar.text {
  320 + padding-right: 10px;
  321 + text-align: right;
  322 +}
  323 +.m-header .text {
  324 + text-align: center;
  325 + line-height: 44px;
  326 + font-size: 15px;
  327 + color: #FFF;
  328 +}
  329 +.m-header.header-light {
  330 + background-color: #FFF;
  331 + color: #666;
  332 +}
  333 +.m-header.header-light .text {
  334 + color: #666;
  335 +}
  336 +.m-header.header-light .m-input {
  337 + color: #333;
  338 +}
  339 +.m-header.header-light .m-input::-webkit-input-placeholder {
  340 + color: #999;
  341 +}
  342 +/*
  343 + * Swiper 2.7.0
  344 + * Mobile touch slider and framework with hardware accelerated transitions
  345 + *
  346 + * http://www.idangero.us/sliders/swiper/
  347 + *
  348 + * Copyright 2010-2014, Vladimir Kharlampidi
  349 + * The iDangero.us
  350 + * http://www.idangero.us/
  351 + *
  352 + * Licensed under GPL & MIT
  353 + *
  354 + * Released on: August 30, 2014
  355 +*/
  356 +/* ===============================================================
  357 +Basic Swiper Styles
  358 +================================================================*/
  359 +.swiper-container {
  360 + margin: 0 auto;
  361 + position: relative;
  362 + overflow: hidden;
  363 + -webkit-backface-visibility: hidden;
  364 + -moz-backface-visibility: hidden;
  365 + -ms-backface-visibility: hidden;
  366 + -o-backface-visibility: hidden;
  367 + backface-visibility: hidden;
  368 + /* Fix of Webkit flickering */
  369 + z-index: 1;
  370 +}
  371 +.swiper-wrapper {
  372 + position: relative;
  373 + width: 100%;
  374 + -webkit-transition-property: -webkit-transform, left, top;
  375 + -webkit-transition-duration: 0s;
  376 + -webkit-transform: translate3d(0px, 0, 0);
  377 + -webkit-transition-timing-function: ease;
  378 + -moz-transition-property: -moz-transform, left, top;
  379 + -moz-transition-duration: 0s;
  380 + -moz-transform: translate3d(0px, 0, 0);
  381 + -moz-transition-timing-function: ease;
  382 + -o-transition-property: -o-transform, left, top;
  383 + -o-transition-duration: 0s;
  384 + -o-transform: translate3d(0px, 0, 0);
  385 + -o-transition-timing-function: ease;
  386 + -o-transform: translate(0px, 0px);
  387 + -ms-transition-property: -ms-transform, left, top;
  388 + -ms-transition-duration: 0s;
  389 + -ms-transform: translate3d(0px, 0, 0);
  390 + -ms-transition-timing-function: ease;
  391 + transition-property: transform, left, top;
  392 + transition-duration: 0s;
  393 + transform: translate3d(0px, 0, 0);
  394 + transition-timing-function: ease;
  395 + -webkit-box-sizing: content-box;
  396 + -moz-box-sizing: content-box;
  397 + box-sizing: content-box;
  398 +}
  399 +.swiper-free-mode > .swiper-wrapper {
  400 + -webkit-transition-timing-function: ease-out;
  401 + -moz-transition-timing-function: ease-out;
  402 + -ms-transition-timing-function: ease-out;
  403 + -o-transition-timing-function: ease-out;
  404 + transition-timing-function: ease-out;
  405 + margin: 0 auto;
  406 +}
  407 +.swiper-slide {
  408 + float: left;
  409 + -webkit-box-sizing: content-box;
  410 + -moz-box-sizing: content-box;
  411 + box-sizing: content-box;
  412 +}
  413 +/* IE10 Windows Phone 8 Fixes */
  414 +.swiper-wp8-horizontal {
  415 + -ms-touch-action: pan-y;
  416 +}
  417 +.swiper-wp8-vertical {
  418 + -ms-touch-action: pan-x;
  419 +}
  420 +/* ===============================================================
  421 +Your custom styles, here you need to specify container's and slide's
  422 +sizes, pagination, etc.
  423 +================================================================*/
  424 +.swiper-container {
  425 + /* Specify Swiper's Size: */
  426 + /*width:200px;
  427 + height: 100px;*/
  428 +}
  429 +.swiper-slide {
  430 + /* Specify Slides's Size: */
  431 + /*width: 100%;
  432 + height: 100%;*/
  433 +}
  434 +.swiper-slide-active {
  435 + /* Specific active slide styling: */
  436 +}
  437 +.swiper-slide-visible {
  438 + /* Specific visible slide styling: */
  439 +}
  440 +/* ===============================================================
  441 +Pagination Styles
  442 +================================================================*/
  443 +.swiper-pagination-switch {
  444 + /* Stylize pagination button: */
  445 +}
  446 +.swiper-active-switch {
  447 + /* Specific active button style: */
  448 +}
  449 +.swiper-visible-switch {
  450 + /* Specific visible button style: */
  451 +}
  452 +.swiper-pagination {
  453 + position: absolute;
  454 + text-align: center;
  455 + -webkit-transition: 300ms;
  456 + -moz-transition: 300ms;
  457 + -o-transition: 300ms;
  458 + transition: 300ms;
  459 + -webkit-transform: translate3d(0, 0, 0);
  460 + -ms-transform: translate3d(0, 0, 0);
  461 + -o-transform: translate3d(0, 0, 0);
  462 + transform: translate3d(0, 0, 0);
  463 + z-index: 10;
  464 +}
  465 +.swiper-pagination {
  466 + bottom: 10px;
  467 + left: 0;
  468 + width: 100%;
  469 +}
  470 +.swiper-pagination .swiper-pagination-switch {
  471 + margin: 0 5px;
  472 +}
  473 +.swiper-pagination-switch {
  474 + width: 8px;
  475 + height: 8px;
  476 + display: inline-block;
  477 + /*background: #FFF;*/
  478 + background: none;
  479 + -webkit-box-shadow: inset 0 0 0 2px #ddd;
  480 + box-shadow: inset 0 0 0 2px #ddd;
  481 + -webkit-box-shadow: inset hoff voff blur color;
  482 + box-shadow: inset hoff voff blur color;
  483 + border-radius: 100%;
  484 + /* -webkit-transition: all ease-in-out .15s;
  485 + -o-transition: all ease-in-out .15s;
  486 + transition: all ease-in-out .15s;*/
  487 +}
  488 +.swiper-active-switch {
  489 + opacity: 1;
  490 + -webkit-box-shadow: inset 0 0 0 4px #23AC38;
  491 + box-shadow: inset 0 0 0 4px #23AC38;
  492 + /*background: #23AC38;*/
  493 + /*-webkit-box-shadow: none;*/
  494 + /*box-shadow: none;*/
  495 +}
  496 +.m-slider {
  497 + height: 120px;
  498 + position: relative;
  499 + overflow: hidden;
  500 + font-size: 0;
  501 +}
  502 +.m-slider a {
  503 + display: block;
  504 + width: 100%;
  505 + height: 100%;
  506 +}
  507 +.m-slider img {
  508 + display: inline-block;
  509 + width: 100%;
  510 + height: 100%;
  511 + float: left;
  512 +}
  513 +.m-slider .swiper-container {
  514 + height: 100%;
  515 +}
  516 +.m-slider .swiper-wrapper {
  517 + height: 100%;
  518 +}
  519 +.m-section .section-head {
  520 + line-height: 45px;
  521 + padding: 0 10px;
  522 + background-color: #fff;
  523 + font-size: 14px;
  524 + color: #666;
  525 + text-align: left;
  526 + font-weight: bold;
  527 + margin-bottom: 10px;
  528 +}
  529 +.m-section .section-head:first-letter {
  530 + font-size: 18px;
  531 + color: #23ac38;
  532 +}
  533 +.section-items {
  534 + margin-bottom: 10px;
  535 +}
  536 +.section-items .section-item {
  537 + display: block;
  538 + margin-bottom: 5px;
  539 + width: 100%;
  540 +}
  541 +.section-items .section-item img {
  542 + width: 100%;
  543 + max-width: 100%;
  544 +}
  545 +.product-items {
  546 + background-color: #FFF;
  547 + margin-bottom: 10px;
  548 +}
  549 +.product-items .items .item {
  550 + width: 33.33%;
  551 + float: left;
  552 + font-size: 13px;
  553 + text-align: center;
  554 + padding: 8px 0;
  555 +}
  556 +.product-items .items .item a {
  557 + display: block;
  558 + position: relative;
  559 + z-index: 2;
  560 +}
  561 +.product-items .items .item h3 {
  562 + font-size: 13px;
  563 + padding: 0 5px;
  564 + font-weight: 700;
  565 + color: #333;
  566 + line-height: 16px;
  567 + padding: 0 10px;
  568 + text-align: left;
  569 + text-overflow: ellipsis;
  570 + overflow: hidden;
  571 + white-space: nowrap;
  572 +}
  573 +.product-items .items .item p {
  574 + padding: 0 10px;
  575 + text-align: left;
  576 +}
  577 +.product-items .items .item em {
  578 + text-align: left;
  579 + display: block;
  580 + font-size: 13px;
  581 + font-weight: 700;
  582 + font-style: normal;
  583 + color: #FA4535;
  584 + text-overflow: ellipsis;
  585 + overflow: hidden;
  586 + white-space: nowrap;
  587 +}
  588 +.product-items .items .item span {
  589 + display: block;
  590 + text-align: center;
  591 + overflow: hidden;
  592 + white-space: nowrap;
  593 + text-overflow: ellipsis;
  594 +}
  595 +.product-items .items .item .pic {
  596 + max-width: 100%;
  597 + height: 60px;
  598 + display: inline-block;
  599 + vertical-align: middle;
  600 +}
  601 +.product-items .items .item:after {
  602 + border-left: none;
  603 + border-top: none;
  604 +}
  605 +.m-list-view {
  606 + margin-bottom: 10px;
  607 +}
  608 +.m-list-view .cell {
  609 + font-size: 14px;
  610 + padding: 0 0 0 15px;
  611 + background-color: #FFF;
  612 + overflow: hidden;
  613 + position: relative;
  614 + text-align: left;
  615 +}
  616 +.m-list-view .cell-header {
  617 + background-color: #f8f8f8;
  618 + padding: 0 10px;
  619 +}
  620 +.m-list-view .cell-header .title {
  621 + font-size: 13px;
  622 + color: #333;
  623 + line-height: 35px;
  624 + width: auto;
  625 +}
  626 +.m-list-view .cell-header .text {
  627 + font-size: 13px;
  628 + line-height: 35px;
  629 + float: right;
  630 + color: #9e9e9e;
  631 + text-align: right;
  632 + margin: 0;
  633 +}
  634 +.m-list-view .cell-basic {
  635 + padding: 11px 10px;
  636 +}
  637 +.m-list-view .cell-basic .title,
  638 +.m-list-view .cell-basic .text {
  639 + float: none;
  640 + display: inline-block;
  641 + vertical-align: middle;
  642 + margin: 0 10px 0 0;
  643 + line-height: 1.5;
  644 +}
  645 +.m-list-view .cell-basic .sub-title {
  646 + padding-top: 10px;
  647 + font-size: 13px;
  648 + color: #999;
  649 +}
  650 +.m-list-view .cell-radio {
  651 + text-align: right;
  652 + padding: 0 10px;
  653 + margin-bottom: 10px;
  654 + background-color: #eee;
  655 +}
  656 +.m-list-view .cell-radio .title {
  657 + color: #333;
  658 + width: auto;
  659 + text-align: left;
  660 +}
  661 +.m-list-view .cell-radio .text {
  662 + float: none;
  663 + text-align: right;
  664 +}
  665 +.m-list-view .cell-radio .m-radio {
  666 + margin-left: 8px;
  667 +}
  668 +.m-list-view .cell-radio .m-table-view {
  669 + margin: 0 -10px;
  670 +}
  671 +.m-list-view .cell-radio .m-table-view .cell-radio {
  672 + margin: 0;
  673 + background-color: #FFF;
  674 +}
  675 +.m-list-view .cell-block {
  676 + padding: 8px 10px;
  677 +}
  678 +.m-list-view .cell-block h3 {
  679 + font-size: 16px;
  680 + font-weight: normal;
  681 + padding-right: 60px;
  682 + white-space: nowrap;
  683 + text-overflow: ellipsis;
  684 + overflow: hidden;
  685 +}
  686 +.m-list-view .cell-block p {
  687 + font-size: 14px;
  688 + color: #666;
  689 +}
  690 +.m-list-view .cell-block .bottom {
  691 + margin-top: 10px;
  692 + padding-top: 8px;
  693 + line-height: 30px;
  694 +}
  695 +.m-list-view .cell-extend .m-table-view {
  696 + margin: 0 0 0 45px;
  697 +}
  698 +.m-list-view .cell-extend .m-table-view .cell {
  699 + padding: 0;
  700 +}
  701 +.m-list-view .cell-extend .m-table-view .text {
  702 + margin-left: 0;
  703 +}
  704 +.m-list-view .cell-pic {
  705 + padding: 15px;
  706 +}
  707 +.m-list-view .cell-pic .pic {
  708 + float: left;
  709 +}
  710 +.m-list-view .cell-pic .cont {
  711 + margin-left: 90px;
  712 +}
  713 +.m-list-view .cell-pic h3 {
  714 + font-size: 14px;
  715 + font-weight: normal;
  716 +}
  717 +.m-list-view .cell-pic em {
  718 + font-size: 16px;
  719 + font-weight: normal;
  720 +}
  721 +.m-list-view .cell-pic p {
  722 + color: #9b9b9b;
  723 + font-size: 12px;
  724 +}
  725 +.m-list-view .acc-icon {
  726 + position: relative;
  727 + padding-right: 30px;
  728 +}
  729 +.m-list-view .acc-icon .acc {
  730 + position: absolute;
  731 + right: 0;
  732 + top: 0;
  733 + min-width: 30px;
  734 + height: 100%;
  735 + line-height: 44px;
  736 + text-align: left;
  737 + color: #999;
  738 + text-align: right;
  739 +}
  740 +.m-list-view .acc-icon .acc .m-icon {
  741 + margin-right: 4px;
  742 +}
  743 +.m-list-view .title {
  744 + font-size: 15px;
  745 + color: #999;
  746 + float: left;
  747 + font-weight: 400;
  748 + line-height: 44px;
  749 +}
  750 +.m-list-view .text {
  751 + display: block;
  752 + font-size: 15px;
  753 + color: #333;
  754 + line-height: 44px;
  755 + position: relative;
  756 + white-space: nowrap;
  757 + word-break: break-all;
  758 + text-overflow: ellipsis;
  759 + overflow: hidden;
  760 +}
  761 +.m-list-view .text .m-input {
  762 + font-size: 15px;
  763 +}
  764 +.m-goods-items {
  765 + padding: 0 5px 5px;
  766 + overflow-x: scroll;
  767 + overflow-y: hidden;
  768 + -webkit-overflow-scrolling: touch;
  769 +}
  770 +.m-goods-items li {
  771 + float: left;
  772 + width: 110px;
  773 + padding: 0 5px 10px;
  774 + box-sizing: border-box;
  775 +}
  776 +.m-goods-items a {
  777 + display: block;
  778 + background-color: #fff;
  779 + padding-bottom: 5px;
  780 + position: relative;
  781 +}
  782 +.m-goods-items .hot {
  783 + position: absolute;
  784 + top: -1px;
  785 + right: 10px;
  786 + width: 20px;
  787 + height: 56px;
  788 + background: url(../images/icon_mark.png) 0 0 no-repeat;
  789 + background-size: 100%;
  790 + font-size: 0;
  791 + overflow: hidden;
  792 +}
  793 +.m-goods-items .pic {
  794 + display: block;
  795 + width: 100%;
  796 + height: 110px;
  797 + margin: 0 auto 5px;
  798 + background-position: center center;
  799 + background-repeat: no-repeat;
  800 + background-size: cover;
  801 +}
  802 +.m-goods-items h3 {
  803 + font-size: 13px;
  804 + padding: 0 5px;
  805 + font-weight: 700;
  806 + color: #333;
  807 + text-align: left;
  808 + line-height: 16px;
  809 + height: 32px;
  810 + overflow: hidden;
  811 +}
  812 +.m-goods-items em {
  813 + text-align: left;
  814 + display: block;
  815 + padding: 0 5px;
  816 + font-size: 13px;
  817 + font-weight: 700;
  818 + font-style: normal;
  819 + color: #FA4535;
  820 +}
  821 +.m-goods-items .origin-price {
  822 + font-size: 12px;
  823 + color: #bbb;
  824 + text-decoration: line-through;
  825 +}
  826 +.photo-wall {
  827 + width: 100%;
  828 + padding-left: 5px;
  829 + box-sizing: border-box;
  830 + margin-bottom: 5px;
  831 +}
  832 +.photo-wall .photo-item {
  833 + float: left;
  834 + box-sizing: border-box;
  835 + padding: 0 5px 5px 0;
  836 + height: 105px;
  837 +}
  838 +.photo-wall .photo-item img {
  839 + width: 100%;
  840 + height: 100%;
  841 + max-width: 100%;
  842 + max-height: 100%;
  843 +}
  844 +.photo-wall .photo-1p {
  845 + width: 33.33%;
  846 +}
  847 +.photo-wall .photo-2p {
  848 + width: 66.66%;
  849 +}
  850 +.m-nav {
  851 + width: 100%;
  852 + background-color: #444;
  853 + font-size: 14px;
  854 + color: #999;
  855 + overflow: hidden;
  856 + box-sizing: border-box;
  857 +}
  858 +.m-nav a {
  859 + color: #999;
  860 + padding: 0 10px;
  861 + min-width: 70px;
  862 +}
  863 +.m-nav li {
  864 + float: left;
  865 + line-height: 40px;
  866 + text-align: center;
  867 + position: relative;
  868 +}
  869 +.m-nav li:last-child {
  870 + padding-right: 0;
  871 +}
  872 +.m-nav .on a {
  873 + color: #FFF;
  874 + background-color: #23ac38;
  875 + display: block;
  876 + position: relative;
  877 +}
  878 +.m-tab {
  879 + width: 100%;
  880 + background-color: #FFF;
  881 + font-size: 14px;
  882 + color: #999;
  883 + border-width: 1px 0;
  884 + overflow: hidden;
  885 + box-sizing: border-box;
  886 + margin-bottom: 10px;
  887 +}
  888 +.m-tab a {
  889 + display: block;
  890 + color: #999;
  891 + padding: 0 10px;
  892 + min-width: 70px;
  893 +}
  894 +.m-tab li {
  895 + float: left;
  896 + line-height: 45px;
  897 + text-align: center;
  898 + position: relative;
  899 +}
  900 +.m-tab li:last-child {
  901 + padding-right: 0;
  902 +}
  903 +.m-tab .on a {
  904 + color: #23ac38;
  905 + display: block;
  906 + position: relative;
  907 +}
  908 +.m-tab .on a:after {
  909 + content: '';
  910 + position: absolute;
  911 + bottom: 0;
  912 + left: 0;
  913 + right: 0;
  914 + height: 2px;
  915 + background-color: #23ac38;
  916 +}
  917 +/***************************************************
  918 +* feature : 工具类class，提供浮动清除、文本对齐、显示隐藏等;
  919 +* update : 2015/02/03;
  920 +* use : 按需使用对应class即可;
  921 +* desc : ;
  922 +* feedback : 此处填入 issue, 并请附带以下信息[os_version, browser_version, page_path, issue_description]
  923 +* - demo => [windows 7, IE 8, http://diligrp.com/icon.html, 在不定height下未能垂直居中];
  924 +****************************************************/
  925 +.text-left {
  926 + text-align: left !important;
  927 +}
  928 +.text-center {
  929 + text-align: center !important;
  930 +}
  931 +.text-right {
  932 + text-align: right !important;
  933 +}
  934 +.text-nowrap {
  935 + white-space: nowrap !important;
  936 +}
  937 +.text-overflow {
  938 + overflow: hidden;
  939 + text-overflow: ellipsis;
  940 +}
  941 +.text-lowercase {
  942 + text-transform: lowercase;
  943 +}
  944 +.text-uppercase {
  945 + text-transform: uppercase;
  946 +}
  947 +.text-capitalize {
  948 + text-transform: capitalize;
  949 +}
  950 +.text-indent {
  951 + text-indent: -999em;
  952 +}
  953 +.float-left {
  954 + float: left !important;
  955 +}
  956 +.float-right {
  957 + float: right !important;
  958 +}
  959 +.float-none {
  960 + float: none !important;
  961 +}
  962 +.display-block {
  963 + display: block !important;
  964 +}
  965 +.clearfix:after {
  966 + content: '';
  967 + display: block;
  968 + height: 0;
  969 + overflow: hidden;
  970 + font-size: 0;
  971 + clear: both;
  972 +}
  973 +.m-hide {
  974 + display: none !important;
  975 + visibility: hidden;
  976 + opacity: 0;
  977 + z-index: -1;
  978 +}
  979 +.m-hidden {
  980 + visibility: hidden;
  981 + opacity: 0;
  982 + z-index: -1;
  983 +}
  984 +.m-show {
  985 + display: block !important;
  986 + visibility: visible;
  987 +}
  988 +.m-separate {
  989 + position: relative;
  990 + width: 100%;
  991 + line-height: 50px;
  992 + text-align: center;
  993 + font-size: 12px;
  994 + color: #666;
  995 + overflow: visible;
  996 +}
  997 +.m-more,
  998 +a.m-more {
  999 + display: block;
  1000 + font-size: 12px;
  1001 + text-align: center;
  1002 + color: #999;
  1003 + line-height: 45px;
  1004 + background-color: #FFF;
  1005 +}
  1006 +.m-animate-hide {
  1007 + -webkit-transform: translate(0, 100%) translateZ(0) !important;
  1008 + -ms-transform: translate(0, 100%) translateZ(0) !important;
  1009 + -o-transform: translate(0, 100%) translateZ(0) !important;
  1010 + transform: translate(0, 100%) translateZ(0) !important;
  1011 +}
  1012 +.m-animate-show {
  1013 + -webkit-transform: translate(0, 0) translateZ(0) !important;
  1014 + -ms-transform: translate(0, 0) translateZ(0) !important;
  1015 + -o-transform: translate(0, 0) translateZ(0) !important;
  1016 + transform: translate(0, 0) translateZ(0) !important;
  1017 +}
  1018 +.hidden {
  1019 + opacity: 0;
  1020 + z-index: -1;
  1021 +}
  1022 +.mask-hidden {
  1023 + opacity: 0;
  1024 +}
  1025 +.font-white {
  1026 + color: #FFF !important;
  1027 +}
  1028 +.font-white-opacity {
  1029 + color: rgba(255, 255, 255, 0.8) !important;
  1030 +}
  1031 +.font-deep {
  1032 + color: #333 !important;
  1033 +}
  1034 +.font-gray {
  1035 + color: #666 !important;
  1036 +}
  1037 +.font-light {
  1038 + color: #999 !important;
  1039 +}
  1040 +.font-yellow {
  1041 + color: #FF9D2C !important;
  1042 +}
  1043 +.font-orange {
  1044 + color: #FF6B00 !important;
  1045 +}
  1046 +.font-red {
  1047 + color: #fa4535 !important;
  1048 +}
  1049 +.font-green {
  1050 + color: #23ac38 !important;
  1051 +}
  1052 +.background-white {
  1053 + background-color: #FFF;
  1054 +}
  1055 +.background-gray {
  1056 + background-color: #666 !important;
  1057 +}
  1058 +.background-yellow {
  1059 + background-color: #FF9D2C !important;
  1060 +}
  1061 +.background-orange {
  1062 + background-color: #FF6B00 !important;
  1063 +}
  1064 +.background-red {
  1065 + background-color: #fa4535 !important;
  1066 +}
  1067 +.background-green {
  1068 + background-color: #23ac38 !important;
  1069 +}
  1070 +.position-relative {
  1071 + position: relative;
  1072 +}
  1073 +.z-index2 {
  1074 + z-index: 2;
  1075 +}
  1076 +.width-auto {
  1077 + width: auto !important;
  1078 +}
  1079 +.width-200p {
  1080 + width: 200%;
  1081 +}
  1082 +.m-col-1 {
  1083 + width: 100% !important;
  1084 +}
  1085 +.m-col-2 {
  1086 + width: 50% !important;
  1087 +}
  1088 +.m-col-3 {
  1089 + width: 33.33% !important;
  1090 +}
  1091 +.m-col-4 {
  1092 + width: 25% !important;
  1093 +}
  1094 +.scroll-wrap {
  1095 + overflow-y: hidden;
  1096 + overflow-x: scroll;
  1097 + -webkit-overflow-scrolling: touch;
  1098 +}
  1099 +.scroll-wrap .m-goods-items {
  1100 + white-space: nowrap;
  1101 +}
  1102 +.scroll-wrap .m-goods-items li {
  1103 + float: none;
  1104 + display: inline;
  1105 + width: 110px !important;
  1106 +}
  1107 +.scroll-wrap .m-goods-items li a {
  1108 + display: inline-block;
  1109 + width: 100px;
  1110 +}
  1111 +.scroll-wrap .m-tab {
  1112 + white-space: nowrap;
  1113 + overflow: visible;
  1114 + width: auto;
  1115 +}
  1116 +.scroll-wrap .m-tab li {
  1117 + float: none;
  1118 + display: inline;
  1119 + width: 90px;
  1120 +}
  1121 +.scroll-wrap .m-tab li a {
  1122 + display: inline-block;
  1123 +}
... ...
css/icon_admin.css
  View file @ba8d548
... ... @@ -72,19 +72,25 @@ This must be run when you have at least 2 sprites.
72 72 }
73 73 .icon-admin_16 {
74 74 background-image: url(../images/dist/admin_sprite.png);
75   - background-position: -64px -186px;
  75 + background-position: -104px -186px;
76 76 width: 14px;
77 77 height: 14px;
78 78 }
79 79 .icon-admin_17 {
80 80 background-image: url(../images/dist/admin_sprite.png);
81   - background-position: -84px -186px;
  81 + background-position: -44px -186px;
82 82 width: 14px;
83 83 height: 14px;
84 84 }
85 85 .icon-admin_18 {
86 86 background-image: url(../images/dist/admin_sprite.png);
87   - background-position: -44px -186px;
  87 + background-position: -64px -186px;
  88 + width: 14px;
  89 + height: 14px;
  90 +}
  91 +.icon-admin_19 {
  92 + background-image: url(../images/dist/admin_sprite.png);
  93 + background-position: -84px -186px;
88 94 width: 14px;
89 95 height: 14px;
90 96 }
... ... @@ -108,13 +114,13 @@ This must be run when you have at least 2 sprites.
108 114 }
109 115 .icon-admin_5 {
110 116 background-image: url(../images/dist/admin_sprite.png);
111   - background-position: -118px -186px;
  117 + background-position: -138px -186px;
112 118 width: 8px;
113 119 height: 8px;
114 120 }
115 121 .icon-admin_6 {
116 122 background-image: url(../images/dist/admin_sprite.png);
117   - background-position: -104px -186px;
  123 + background-position: -124px -186px;
118 124 width: 8px;
119 125 height: 8px;
120 126 }
... ... @@ -132,7 +138,7 @@ This must be run when you have at least 2 sprites.
132 138 }
133 139 .icon-angle {
134 140 background-image: url(../images/dist/admin_sprite.png);
135   - background-position: -132px -186px;
  141 + background-position: -152px -186px;
136 142 width: 8px;
137 143 height: 8px;
138 144 }
... ...
css/sprite_admin.less
  View file @ba8d548
... ... @@ -78,38 +78,49 @@ At the bottom of this section, we provide information about the spritesheet itse
78 78 @icon-admin-15-image: '../images/dist/admin_sprite.png';
79 79 @icon-admin-15: 0px 124px 0px -124px 100px 56px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_15';
80 80 @icon-admin-16-name: 'icon-admin_16';
81   -@icon-admin-16-x: 64px;
  81 +@icon-admin-16-x: 104px;
82 82 @icon-admin-16-y: 186px;
83   -@icon-admin-16-offset-x: -64px;
  83 +@icon-admin-16-offset-x: -104px;
84 84 @icon-admin-16-offset-y: -186px;
85 85 @icon-admin-16-width: 14px;
86 86 @icon-admin-16-height: 14px;
87 87 @icon-admin-16-total-width: 313px;
88 88 @icon-admin-16-total-height: 206px;
89 89 @icon-admin-16-image: '../images/dist/admin_sprite.png';
90   -@icon-admin-16: 64px 186px -64px -186px 14px 14px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_16';
  90 +@icon-admin-16: 104px 186px -104px -186px 14px 14px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_16';
91 91 @icon-admin-17-name: 'icon-admin_17';
92   -@icon-admin-17-x: 84px;
  92 +@icon-admin-17-x: 44px;
93 93 @icon-admin-17-y: 186px;
94   -@icon-admin-17-offset-x: -84px;
  94 +@icon-admin-17-offset-x: -44px;
95 95 @icon-admin-17-offset-y: -186px;
96 96 @icon-admin-17-width: 14px;
97 97 @icon-admin-17-height: 14px;
98 98 @icon-admin-17-total-width: 313px;
99 99 @icon-admin-17-total-height: 206px;
100 100 @icon-admin-17-image: '../images/dist/admin_sprite.png';
101   -@icon-admin-17: 84px 186px -84px -186px 14px 14px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_17';
  101 +@icon-admin-17: 44px 186px -44px -186px 14px 14px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_17';
102 102 @icon-admin-18-name: 'icon-admin_18';
103   -@icon-admin-18-x: 44px;
  103 +@icon-admin-18-x: 64px;
104 104 @icon-admin-18-y: 186px;
105   -@icon-admin-18-offset-x: -44px;
  105 +@icon-admin-18-offset-x: -64px;
106 106 @icon-admin-18-offset-y: -186px;
107 107 @icon-admin-18-width: 14px;
108 108 @icon-admin-18-height: 14px;
109 109 @icon-admin-18-total-width: 313px;
110 110 @icon-admin-18-total-height: 206px;
111 111 @icon-admin-18-image: '../images/dist/admin_sprite.png';
112   -@icon-admin-18: 44px 186px -44px -186px 14px 14px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_18';
  112 +@icon-admin-18: 64px 186px -64px -186px 14px 14px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_18';
  113 +@icon-admin-19-name: 'icon-admin_19';
  114 +@icon-admin-19-x: 84px;
  115 +@icon-admin-19-y: 186px;
  116 +@icon-admin-19-offset-x: -84px;
  117 +@icon-admin-19-offset-y: -186px;
  118 +@icon-admin-19-width: 14px;
  119 +@icon-admin-19-height: 14px;
  120 +@icon-admin-19-total-width: 313px;
  121 +@icon-admin-19-total-height: 206px;
  122 +@icon-admin-19-image: '../images/dist/admin_sprite.png';
  123 +@icon-admin-19: 84px 186px -84px -186px 14px 14px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_19';
113 124 @icon-admin-2-name: 'icon-admin_2';
114 125 @icon-admin-2-x: 0px;
115 126 @icon-admin-2-y: 0px;
... ... @@ -144,27 +155,27 @@ At the bottom of this section, we provide information about the spritesheet itse
144 155 @icon-admin-4-image: '../images/dist/admin_sprite.png';
145 156 @icon-admin-4: 0px 186px 0px -186px 16px 20px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_4';
146 157 @icon-admin-5-name: 'icon-admin_5';
147   -@icon-admin-5-x: 118px;
  158 +@icon-admin-5-x: 138px;
148 159 @icon-admin-5-y: 186px;
149   -@icon-admin-5-offset-x: -118px;
  160 +@icon-admin-5-offset-x: -138px;
150 161 @icon-admin-5-offset-y: -186px;
151 162 @icon-admin-5-width: 8px;
152 163 @icon-admin-5-height: 8px;
153 164 @icon-admin-5-total-width: 313px;
154 165 @icon-admin-5-total-height: 206px;
155 166 @icon-admin-5-image: '../images/dist/admin_sprite.png';
156   -@icon-admin-5: 118px 186px -118px -186px 8px 8px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_5';
  167 +@icon-admin-5: 138px 186px -138px -186px 8px 8px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_5';
157 168 @icon-admin-6-name: 'icon-admin_6';
158   -@icon-admin-6-x: 104px;
  169 +@icon-admin-6-x: 124px;
159 170 @icon-admin-6-y: 186px;
160   -@icon-admin-6-offset-x: -104px;
  171 +@icon-admin-6-offset-x: -124px;
161 172 @icon-admin-6-offset-y: -186px;
162 173 @icon-admin-6-width: 8px;
163 174 @icon-admin-6-height: 8px;
164 175 @icon-admin-6-total-width: 313px;
165 176 @icon-admin-6-total-height: 206px;
166 177 @icon-admin-6-image: '../images/dist/admin_sprite.png';
167   -@icon-admin-6: 104px 186px -104px -186px 8px 8px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_6';
  178 +@icon-admin-6: 124px 186px -124px -186px 8px 8px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_6';
168 179 @icon-admin-7-name: 'icon-admin_7';
169 180 @icon-admin-7-x: 213px;
170 181 @icon-admin-7-y: 124px;
... ... @@ -188,20 +199,20 @@ At the bottom of this section, we provide information about the spritesheet itse
188 199 @icon-admin-9-image: '../images/dist/admin_sprite.png';
189 200 @icon-admin-9: 213px 62px -213px -62px 100px 56px 313px 206px '../images/dist/admin_sprite.png' 'icon-admin_9';
190 201 @icon-angle-name: 'icon-angle';
191   -@icon-angle-x: 132px;
  202 +@icon-angle-x: 152px;
192 203 @icon-angle-y: 186px;
193   -@icon-angle-offset-x: -132px;
  204 +@icon-angle-offset-x: -152px;
194 205 @icon-angle-offset-y: -186px;
195 206 @icon-angle-width: 8px;
196 207 @icon-angle-height: 8px;
197 208 @icon-angle-total-width: 313px;
198 209 @icon-angle-total-height: 206px;
199 210 @icon-angle-image: '../images/dist/admin_sprite.png';
200   -@icon-angle: 132px 186px -132px -186px 8px 8px 313px 206px '../images/dist/admin_sprite.png' 'icon-angle';
  211 +@icon-angle: 152px 186px -152px -186px 8px 8px 313px 206px '../images/dist/admin_sprite.png' 'icon-angle';
201 212 @spritesheet-width: 313px;
202 213 @spritesheet-height: 206px;
203 214 @spritesheet-image: '../images/dist/admin_sprite.png';
204   -@spritesheet-sprites: @icon-admin-10 @icon-admin-11 @icon-admin-12 @icon-admin-13 @icon-admin-14 @icon-admin-15 @icon-admin-16 @icon-admin-17 @icon-admin-18 @icon-admin-2 @icon-admin-3 @icon-admin-4 @icon-admin-5 @icon-admin-6 @icon-admin-7 @icon-admin-9 @icon-angle;
  215 +@spritesheet-sprites: @icon-admin-10 @icon-admin-11 @icon-admin-12 @icon-admin-13 @icon-admin-14 @icon-admin-15 @icon-admin-16 @icon-admin-17 @icon-admin-18 @icon-admin-19 @icon-admin-2 @icon-admin-3 @icon-admin-4 @icon-admin-5 @icon-admin-6 @icon-admin-7 @icon-admin-9 @icon-angle;
205 216 @spritesheet: 313px 206px '../images/dist/admin_sprite.png' @spritesheet-sprites;
206 217  
207 218 /*
... ...
html/admin.html
  View file @ba8d548
... ... @@ -49,7 +49,9 @@
49 49 <div class="wrap">
50 50 <div class="inner">
51 51 <div class="holder">
  52 + <span class="title" style="flat">轮播图</span>
52 53 <div class="ops">
  54 + <a href="" class="m-btn btn-down"><i class="m-icon icon-admin_19"></i>下移</a>
53 55 <a href="" class="m-btn btn-up"><i class="m-icon icon-admin_16"></i>上移</a>
54 56 <a href="" class="m-btn btn-setting"><i class="m-icon icon-admin_17"></i> 设置</a>
55 57 <a href="" class="m-btn btn-del"><i class="m-icon icon-admin_18"></i> 删除</a>
... ...
images/dist/admin_sprite.png
View file @ba8d548

3.47 KB | W: | H:

3.54 KB | W: | H:

  • 2-up
  • Swipe
  • Onion skin
images/src/admin/admin_19.png 0 → 100644
View file @ba8d548

1.12 KB