Merge branch 'develop' of git.dev.yoho.cn:web/yohobuy into develop
Showing
20 changed files
with
69 additions
and
195 deletions
assets/reg.html
deleted
100644 → 0
| 1 | -<!DOCTYPE html> | ||
| 2 | -<html> | ||
| 3 | -<head> | ||
| 4 | -<meta charset="utf-8"> | ||
| 5 | -<title>注册 | YOHO!有货</title> | ||
| 6 | -<meta name="keywords" content="Yoho! 有货官网,潮流志,潮流男装,潮牌,美国潮牌,日本潮牌,香港潮牌,潮牌店,新品首发,欧美潮流,全球购,代购,时尚,流行,特卖,B2C,正品,购物网站,网上购物,货到付款"> | ||
| 7 | -<meta name="description" content="YOHO! 有货，年轻人潮流购物中心，中国最大的潮流商品购物网站。100%品牌正品保证，支持货到付款。作为YOHO!旗下的购物平台，汇集了全球潮流时尚商品和中国最流行的商品，也是国内最大的原创文化商品平台，也是香港，台湾地区流行商品的集中地。同时包含日本、韩国等众多国外潮流品牌，带给您全新潮流购物体验。"> | ||
| 8 | -<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no"> | ||
| 9 | -<meta http-equiv="cleartype" content="on"> | ||
| 10 | -<meta name="apple-mobile-web-app-status-bar-style" content="black" /> | ||
| 11 | -<meta content="telephone=no" name="format-detection" /> | ||
| 12 | -<meta content="email=no" name="format-detection" /> | ||
| 13 | -<script type="text/javascript"> | ||
| 14 | - (function(doc, win) { | ||
| 15 | - var docEl = doc.documentElement; | ||
| 16 | - (function() { | ||
| 17 | - var clientWidth = docEl.clientWidth; | ||
| 18 | - if (!clientWidth) { | ||
| 19 | - return; | ||
| 20 | - } | ||
| 21 | - docEl.style.fontSize = 20 * (clientWidth / 320) + 'px'; | ||
| 22 | - }()); | ||
| 23 | - })(document, window); | ||
| 24 | -</script> | ||
| 25 | -<link rel="stylesheet" href="http://static.buy.test.yoho.cn/dist/myohobuy/0.0.6/index.css"> | ||
| 26 | -</head> | ||
| 27 | -<body class=passport-body> | ||
| 28 | - <div class="reg-page passport-page yoho-page"> | ||
| 29 | - <div class="header"> | ||
| 30 | - <a class="go-back" href=/></a> | ||
| 31 | - <p class="title">注册</p> | ||
| 32 | - </div> <div class="content"> | ||
| 33 | - <div class="select-container row"> | ||
| 34 | - <span class="select-title">国家和地区</span> | ||
| 35 | - <select id="country-select" class="country-select select in-android-uc"> | ||
| 36 | - <option value=+61 >澳大利亚</option> | ||
| 37 | - <option value=+82 >韩国</option> | ||
| 38 | - <option value=+1 >加拿大</option> | ||
| 39 | - <option value=+60 >马来西亚</option> | ||
| 40 | - <option value=+1 >美国</option> | ||
| 41 | - <option value=+81 >日本</option> | ||
| 42 | - <option value=+65 >新加坡</option> | ||
| 43 | - <option value=+44 >英国</option> | ||
| 44 | - <option value=+86 selected>中国</option> | ||
| 45 | - <option value=+853 >中国澳门</option> | ||
| 46 | - <option value=+886 >中国台湾</option> | ||
| 47 | - <option value=+852 >中国香港</option> | ||
| 48 | - </select> | ||
| 49 | - <div class="arrow-right"></div> | ||
| 50 | - </div> <div class="input-container phone-container row has-clear"> | ||
| 51 | - <span id="area-code" class="area-code">+86</span> | ||
| 52 | - <input id="phone-num" class="input phone-num" type="text" placeholder="手机号"> | ||
| 53 | - </div> | ||
| 54 | - <span id="btn-next" class="btn btn-next disable row">下一步</span> | ||
| 55 | - <p class="register-tip">YOHO!Family账号可登录YOHO!有货、YOHO!Boys、YOHO!Girls及SHOW</p> | ||
| 56 | - </div> | ||
| 57 | -</div> | ||
| 58 | -<script src="http://static.buy.test.yoho.cn/dist/myohobuy/0.0.6/lib.js"></script> | ||
| 59 | -<script src="http://static.buy.test.yoho.cn/dist/myohobuy/0.0.6/index.js"></script> | ||
| 60 | -<script> | ||
| 61 | - seajs.use('js/common'); | ||
| 62 | -</script> | ||
| 63 | -<script> | ||
| 64 | - seajs.use('js/passport/register/register'); | ||
| 65 | -</script> | ||
| 66 | -</body> | ||
| 67 | -</html> |
| @@ -11,21 +11,16 @@ var $ = require('jquery'), | @@ -11,21 +11,16 @@ var $ = require('jquery'), | ||
| 11 | 11 | ||
| 12 | var swiper, | 12 | var swiper, |
| 13 | $fixTitleBar, | 13 | $fixTitleBar, |
| 14 | - $brandText, | ||
| 15 | - $brandHref, | ||
| 16 | $brandList = $('.brand-list'); | 14 | $brandList = $('.brand-list'); |
| 17 | 15 | ||
| 18 | var searchH = $('.newbrand-search').outerHeight(), | 16 | var searchH = $('.newbrand-search').outerHeight(), |
| 19 | headerH = $('.yoho-header').outerHeight(), | 17 | headerH = $('.yoho-header').outerHeight(), |
| 20 | brandSwipe = parseInt(searchH) + parseInt(headerH) - 1, | 18 | brandSwipe = parseInt(searchH) + parseInt(headerH) - 1, |
| 21 | - searchArray = []; | 19 | + minBrandListTop; |
| 22 | 20 | ||
| 23 | var brandsData, | 21 | var brandsData, |
| 24 | $keyword, | 22 | $keyword, |
| 25 | - clearTextHammer, | ||
| 26 | - removeHistory, | ||
| 27 | - searchList, | ||
| 28 | - yohoHistory; | 23 | + clearTextHammer; |
| 29 | 24 | ||
| 30 | swiper = new Swiper('.swiper-container', { | 25 | swiper = new Swiper('.swiper-container', { |
| 31 | lazyLoading: true, | 26 | lazyLoading: true, |
| @@ -42,13 +37,15 @@ $('.yoho-header').css({ | @@ -42,13 +37,15 @@ $('.yoho-header').css({ | ||
| 42 | }); | 37 | }); |
| 43 | 38 | ||
| 44 | $fixTitleBar = $('<div class="title-bar fixed-title-bar"><h2></h2></div>'); | 39 | $fixTitleBar = $('<div class="title-bar fixed-title-bar"><h2></h2></div>'); |
| 45 | -$fixTitleBar.hide(); | 40 | +$fixTitleBar.css({ |
| 41 | + position: 'fixed', | ||
| 42 | + top: brandSwipe | ||
| 43 | +}).hide(); | ||
| 44 | +minBrandListTop = brandSwipe + $('.hot-brand').outerHeight() + $('.banner-top').outerHeight(); | ||
| 46 | $('.brand-list').last().append($fixTitleBar); | 45 | $('.brand-list').last().append($fixTitleBar); |
| 47 | 46 | ||
| 48 | $(window).scroll(function() { | 47 | $(window).scroll(function() { |
| 49 | - var scrTop = $(window).scrollTop(), | ||
| 50 | - minBrandListTop = brandSwipe + $('.hot-brand').outerHeight() + | ||
| 51 | - $('.banner-top').outerHeight(); | 48 | + var scrTop = $(window).scrollTop(); |
| 52 | 49 | ||
| 53 | if ($brandList.eq(0).offset().top < minBrandListTop) { | 50 | if ($brandList.eq(0).offset().top < minBrandListTop) { |
| 54 | $fixTitleBar.hide(); | 51 | $fixTitleBar.hide(); |
| @@ -59,9 +56,7 @@ $(window).scroll(function() { | @@ -59,9 +56,7 @@ $(window).scroll(function() { | ||
| 59 | 56 | ||
| 60 | if (scrTop >= offTop) { | 57 | if (scrTop >= offTop) { |
| 61 | $fixTitleBar.css({ | 58 | $fixTitleBar.css({ |
| 62 | - display: 'block', | ||
| 63 | - position: 'fixed', | ||
| 64 | - top: brandSwipe | 59 | + display: 'block' |
| 65 | }).find('h2').html($(this).find('.title-bar').text()); | 60 | }).find('h2').html($(this).find('.title-bar').text()); |
| 66 | } | 61 | } |
| 67 | 62 | ||
| @@ -70,10 +65,12 @@ $(window).scroll(function() { | @@ -70,10 +65,12 @@ $(window).scroll(function() { | ||
| 70 | 65 | ||
| 71 | function rightBarBindClick() { | 66 | function rightBarBindClick() { |
| 72 | $('#right-bar .con').find('b').unbind().on('touchstart', function(e) { | 67 | $('#right-bar .con').find('b').unbind().on('touchstart', function(e) { |
| 73 | - var index = $(this).index(); | 68 | + var index = $(this).index(), |
| 69 | + top; | ||
| 74 | 70 | ||
| 75 | if ($('.bar-' + index).size() > 0) { | 71 | if ($('.bar-' + index).size() > 0) { |
| 76 | - document.body.scrollTop = parseInt($('.bar-' + index)[0].offsetTop) - parseInt(brandSwipe - 1); | 72 | + top = parseInt($('.bar-' + index)[0].offsetTop) - parseInt(brandSwipe - 1); |
| 73 | + $(document).scrollTop(top); | ||
| 77 | } | 74 | } |
| 78 | e.stopPropagation(); | 75 | e.stopPropagation(); |
| 79 | }); | 76 | }); |
| @@ -146,21 +143,6 @@ function searchResult() { | @@ -146,21 +143,6 @@ function searchResult() { | ||
| 146 | if (Object.keys(result).length > 0) { | 143 | if (Object.keys(result).length > 0) { |
| 147 | rightBarBindClick(); | 144 | rightBarBindClick(); |
| 148 | } | 145 | } |
| 149 | - $('.search-result .brand-list p').each(function (index) { | ||
| 150 | - searchList = new Hammer($('.search-result .brand-list p').eq(index)[0]); | ||
| 151 | - searchList.on('tap', function() { | ||
| 152 | - $brandText = $('.search-result .brand-list p').eq(index).find('a').html(); | ||
| 153 | - $brandHref = $('.search-result .brand-list p').eq(index).find('a').attr('href'); | ||
| 154 | - if (localStorage.getItem('yohoHistory')) { | ||
| 155 | - yohoHistory = localStorage.getItem('yohoHistory'); | ||
| 156 | - searchArray.push(yohoHistory); | ||
| 157 | - } | ||
| 158 | - if (searchArray.toString().split($brandText).length < 2) { | ||
| 159 | - searchArray.push('{"searchName":"' + $brandText + '","searchHref":"' + $brandText + '"}'); | ||
| 160 | - } | ||
| 161 | - localStorage.setItem('yohoHistory', searchArray); | ||
| 162 | - }); | ||
| 163 | - }); | ||
| 164 | } | 146 | } |
| 165 | 147 | ||
| 166 | if ($('.brand-search-page').length) { | 148 | if ($('.brand-search-page').length) { |
| @@ -168,7 +150,6 @@ if ($('.brand-search-page').length) { | @@ -168,7 +150,6 @@ if ($('.brand-search-page').length) { | ||
| 168 | $keyword = $('#keyword'); | 150 | $keyword = $('#keyword'); |
| 169 | 151 | ||
| 170 | $keyword.on('input', function() { | 152 | $keyword.on('input', function() { |
| 171 | - $('.history').css('display', 'none'); | ||
| 172 | if ($keyword.val().length) { | 153 | if ($keyword.val().length) { |
| 173 | searchResult(); | 154 | searchResult(); |
| 174 | $(this).closest('.search-box').css('width', '11.25rem'); | 155 | $(this).closest('.search-box').css('width', '11.25rem'); |
| @@ -182,6 +163,7 @@ if ($('.brand-search-page').length) { | @@ -182,6 +163,7 @@ if ($('.brand-search-page').length) { | ||
| 182 | clearTextHammer = new Hammer($('.clear-text')[0]); | 163 | clearTextHammer = new Hammer($('.clear-text')[0]); |
| 183 | clearTextHammer.on('tap', function(e) { | 164 | clearTextHammer.on('tap', function(e) { |
| 184 | e.preventDefault(); | 165 | e.preventDefault(); |
| 166 | + $('.search-result').html(''); | ||
| 185 | $('#keyword').val('').trigger('input'); | 167 | $('#keyword').val('').trigger('input'); |
| 186 | e.srcEvent.stopPropagation(); | 168 | e.srcEvent.stopPropagation(); |
| 187 | }); | 169 | }); |
| @@ -189,18 +171,4 @@ if ($('.brand-search-page').length) { | @@ -189,18 +171,4 @@ if ($('.brand-search-page').length) { | ||
| 189 | $('form.search-box').on('submit', function() { | 171 | $('form.search-box').on('submit', function() { |
| 190 | return false; | 172 | return false; |
| 191 | }); | 173 | }); |
| 192 | - if (localStorage && localStorage.getItem('yohoHistory')) { | ||
| 193 | - yohoHistory = $.parseJSON('[' + localStorage.getItem('yohoHistory') + ']'); | ||
| 194 | - if (yohoHistory) { | ||
| 195 | - $.each(yohoHistory, function(index, content) { | ||
| 196 | - $('<a href="' + content.searchHref + '">' + content.searchName + '</a>').appendTo('.historyList'); | ||
| 197 | - }); | ||
| 198 | - } | ||
| 199 | - } | ||
| 200 | - | ||
| 201 | - removeHistory = new Hammer($('.removeHistory')[0]); | ||
| 202 | - removeHistory.on('tap', function(e) { | ||
| 203 | - $('.historyList').html(' '); | ||
| 204 | - localStorage.clear(); | ||
| 205 | - }); | ||
| 206 | } | 174 | } |
| @@ -26,7 +26,7 @@ var requestFrame, | @@ -26,7 +26,7 @@ var requestFrame, | ||
| 26 | $logotrans = $('.home-header .logo'), | 26 | $logotrans = $('.home-header .logo'), |
| 27 | isen = true; | 27 | isen = true; |
| 28 | 28 | ||
| 29 | -var navHammer, mobileWrapHammer; | 29 | +var navHammer; |
| 30 | 30 | ||
| 31 | require('./maybe-like'); | 31 | require('./maybe-like'); |
| 32 | 32 | ||
| @@ -53,23 +53,18 @@ navHammer.on('tap', function(event) { | @@ -53,23 +53,18 @@ navHammer.on('tap', function(event) { | ||
| 53 | function hideSideBar() { | 53 | function hideSideBar() { |
| 54 | if ($mobileWrap.hasClass('menu-open')) { | 54 | if ($mobileWrap.hasClass('menu-open')) { |
| 55 | $mobileWrap.removeClass('menu-open'); | 55 | $mobileWrap.removeClass('menu-open'); |
| 56 | - $overlay.css('opacity', 0); | 56 | + $('.overlay').hide(); |
| 57 | $('.sub-nav').removeClass('show'); | 57 | $('.sub-nav').removeClass('show'); |
| 58 | $sideNav.removeClass('on'); | 58 | $sideNav.removeClass('on'); |
| 59 | $('body').css({ | 59 | $('body').css({ |
| 60 | height: 'auto', | 60 | height: 'auto', |
| 61 | overflow: 'auto' | 61 | overflow: 'auto' |
| 62 | }); | 62 | }); |
| 63 | - setTimeout(function() { | ||
| 64 | - $('.overlay').hide(); | ||
| 65 | - }, 300); | ||
| 66 | } | 63 | } |
| 67 | } | 64 | } |
| 68 | 65 | ||
| 69 | -mobileWrapHammer = new Hammer($('.mobile-wrap')[0]); | ||
| 70 | -mobileWrapHammer.on('tap', function(e) { | 66 | +$('.overlay').on('touchend', function(e) { |
| 71 | hideSideBar(); | 67 | hideSideBar(); |
| 72 | - e.srcEvent.stopPropagation(); | ||
| 73 | return false; | 68 | return false; |
| 74 | }); | 69 | }); |
| 75 | 70 |
| @@ -6,7 +6,7 @@ | @@ -6,7 +6,7 @@ | ||
| 6 | padding: 14rem / $pxConvertRem 3.125%; | 6 | padding: 14rem / $pxConvertRem 3.125%; |
| 7 | background-color: #f8f8f8; | 7 | background-color: #f8f8f8; |
| 8 | left: 0; | 8 | left: 0; |
| 9 | - top: 88rem / $pxConvertRem; | 9 | + top: 90rem / $pxConvertRem; |
| 10 | position: fixed; | 10 | position: fixed; |
| 11 | z-index: 2; | 11 | z-index: 2; |
| 12 | 12 | ||
| @@ -55,11 +55,14 @@ | @@ -55,11 +55,14 @@ | ||
| 55 | right: -74rem / $pxConvertRem; | 55 | right: -74rem / $pxConvertRem; |
| 56 | font-size: 32rem / $pxConvertRem; | 56 | font-size: 32rem / $pxConvertRem; |
| 57 | line-height: 60rem / $pxConvertRem; | 57 | line-height: 60rem / $pxConvertRem; |
| 58 | - color: #666; | 58 | + color: #bdbdbd; |
| 59 | } | 59 | } |
| 60 | 60 | ||
| 61 | .cancel-btn { | 61 | .cancel-btn { |
| 62 | display: inline; | 62 | display: inline; |
| 63 | + color: #bdbdbd; | ||
| 64 | + font-size: 32rem / $pxConvertRem; | ||
| 65 | + vertical-align: middle; | ||
| 63 | } | 66 | } |
| 64 | 67 | ||
| 65 | .clear-text { | 68 | .clear-text { |
| @@ -86,9 +89,15 @@ | @@ -86,9 +89,15 @@ | ||
| 86 | .img-box { | 89 | .img-box { |
| 87 | display: table-cell; | 90 | display: table-cell; |
| 88 | vertical-align: middle; | 91 | vertical-align: middle; |
| 89 | - width: 100%; | 92 | + text-align: center; |
| 93 | + width: 158rem / $pxConvertRem; | ||
| 90 | height: 158rem / $pxConvertRem; | 94 | height: 158rem / $pxConvertRem; |
| 91 | } | 95 | } |
| 96 | + | ||
| 97 | + img { | ||
| 98 | + max-width: 140rem / $pxConvertRem; | ||
| 99 | + max-height: 140rem / $pxConvertRem; | ||
| 100 | + } | ||
| 92 | } | 101 | } |
| 93 | } | 102 | } |
| 94 | } | 103 | } |
| @@ -132,15 +141,15 @@ | @@ -132,15 +141,15 @@ | ||
| 132 | display: inline-block; | 141 | display: inline-block; |
| 133 | margin-top: -4rem / $pxConvertRem; | 142 | margin-top: -4rem / $pxConvertRem; |
| 134 | margin-left: 24rem / $pxConvertRem; | 143 | margin-left: 24rem / $pxConvertRem; |
| 135 | - width: 58rem / $pxConvertRem; | ||
| 136 | - height: 38rem / $pxConvertRem; | 144 | + width: 108rem / $pxConvertRem; |
| 145 | + height: 42rem / $pxConvertRem; | ||
| 137 | text-align: center; | 146 | text-align: center; |
| 138 | vertical-align: middle; | 147 | vertical-align: middle; |
| 139 | - font-size: 18rem / $pxConvertRem; | ||
| 140 | - line-height: 38rem / $pxConvertRem; | 148 | + font-size: 28rem / $pxConvertRem; |
| 149 | + line-height: 44rem / $pxConvertRem; | ||
| 141 | color: #fff; | 150 | color: #fff; |
| 142 | border-radius: 50rem / $pxConvertRem; | 151 | border-radius: 50rem / $pxConvertRem; |
| 143 | - ; | 152 | + @include scale(.8) |
| 144 | } | 153 | } |
| 145 | 154 | ||
| 146 | .icon-hot { | 155 | .icon-hot { |
| @@ -186,49 +195,4 @@ | @@ -186,49 +195,4 @@ | ||
| 186 | padding-top: 176rem / $pxConvertRem; | 195 | padding-top: 176rem / $pxConvertRem; |
| 187 | } | 196 | } |
| 188 | 197 | ||
| 189 | - .history{ | ||
| 190 | - width: 100%; | ||
| 191 | - height: auto; | ||
| 192 | - overflow: hidden; | ||
| 193 | - position: absolute; | ||
| 194 | - left: 0; | ||
| 195 | - top: 176rem / $pxConvertRem; | ||
| 196 | - > h6{ | ||
| 197 | - width: 100%; | ||
| 198 | - height: 88rem / $pxConvertRem; | ||
| 199 | - line-height: 88rem / $pxConvertRem; | ||
| 200 | - color: #999; | ||
| 201 | - text-indent: .6rem; | ||
| 202 | - font-size: 36em / $pxConvertRem; | ||
| 203 | - } | ||
| 204 | - .historyList{ | ||
| 205 | - width: 100%; | ||
| 206 | - height: auto; | ||
| 207 | - overflow: hidden; | ||
| 208 | - display: block; | ||
| 209 | - > a{ | ||
| 210 | - width: auto; | ||
| 211 | - height: 58rem / $pxConvertRem; | ||
| 212 | - overflow: hidden; | ||
| 213 | - line-height: 58rem / $pxConvertRem; | ||
| 214 | - margin: 0 0 20rem / $pxConvertRem .6rem; | ||
| 215 | - padding: 0 20rem / $pxConvertRem; | ||
| 216 | - float: left; | ||
| 217 | - background-color:#f8f8f8; | ||
| 218 | - color: #444; | ||
| 219 | - } | ||
| 220 | - } | ||
| 221 | - > span{ | ||
| 222 | - width: auto; | ||
| 223 | - height: 68rem / $pxConvertRem; | ||
| 224 | - overflow: hidden; | ||
| 225 | - display: inline-block; | ||
| 226 | - line-height: 68rem / $pxConvertRem; | ||
| 227 | - border:1px solid #e6e6e6; | ||
| 228 | - padding: 0 28rem / $pxConvertRem; | ||
| 229 | - font-size: 48em / $pxConvertRem; | ||
| 230 | - margin-left: .6rem; | ||
| 231 | - color: #000; | ||
| 232 | - } | ||
| 233 | - } | ||
| 234 | } | 198 | } |
| @@ -11,11 +11,16 @@ | @@ -11,11 +11,16 @@ | ||
| 11 | } | 11 | } |
| 12 | } | 12 | } |
| 13 | 13 | ||
| 14 | + .classify-list { | ||
| 15 | + border-top: 1px solid #e0e0e0; | ||
| 16 | + border-bottom: 1px solid #e0e0e0; | ||
| 17 | + } | ||
| 18 | + | ||
| 14 | .classify-list > li { | 19 | .classify-list > li { |
| 15 | float: left; | 20 | float: left; |
| 16 | width: 212rem / $pxConvertRem; | 21 | width: 212rem / $pxConvertRem; |
| 17 | height: 192rem / $pxConvertRem; | 22 | height: 192rem / $pxConvertRem; |
| 18 | - border-bottom: 1px solid #e0e0e0; | 23 | + border-top: 1px solid #e0e0e0; |
| 19 | border-right: 1px solid #e0e0e0; | 24 | border-right: 1px solid #e0e0e0; |
| 20 | } | 25 | } |
| 21 | 26 |
| @@ -17,14 +17,15 @@ | @@ -17,14 +17,15 @@ | ||
| 17 | overflow: hidden; | 17 | overflow: hidden; |
| 18 | 18 | ||
| 19 | .brand-logo { | 19 | .brand-logo { |
| 20 | - width: 100%; | 20 | + display: table-cell; |
| 21 | + width: 158rem / $pxConvertRem; | ||
| 21 | height: 128rem / $pxConvertRem; | 22 | height: 128rem / $pxConvertRem; |
| 22 | line-height: 128rem / $pxConvertRem; | 23 | line-height: 128rem / $pxConvertRem; |
| 23 | text-align: center; | 24 | text-align: center; |
| 24 | font-size: 0; | 25 | font-size: 0; |
| 26 | + vertical-align: middle; | ||
| 25 | 27 | ||
| 26 | img { | 28 | img { |
| 27 | - vertical-align: middle; | ||
| 28 | max-width: 100%; | 29 | max-width: 100%; |
| 29 | max-height: 100%; | 30 | max-height: 100%; |
| 30 | } | 31 | } |
| 1 | .maybe-like { | 1 | .maybe-like { |
| 2 | + position: relative; | ||
| 2 | background: #fff; | 3 | background: #fff; |
| 3 | padding-left: 15rem / $pxConvertRem; | 4 | padding-left: 15rem / $pxConvertRem; |
| 4 | border-top: 1px solid #ccc; | 5 | border-top: 1px solid #ccc; |
| 5 | // border-bottom: 1px solid #ccc; | 6 | // border-bottom: 1px solid #ccc; |
| 6 | margin-top: 30rem / $pxConvertRem; | 7 | margin-top: 30rem / $pxConvertRem; |
| 7 | 8 | ||
| 9 | + &:before { | ||
| 10 | + content: ''; | ||
| 11 | + position: absolute; | ||
| 12 | + border-top: 1px solid #ccc; | ||
| 13 | + left: 0; | ||
| 14 | + top: 80rem / $pxConvertRem; | ||
| 15 | + width: 640rem / $pxConvertRem; | ||
| 16 | + height: 0; | ||
| 17 | + } | ||
| 18 | + | ||
| 8 | .title { | 19 | .title { |
| 9 | height: 104rem / $pxConvertRem; | 20 | height: 104rem / $pxConvertRem; |
| 10 | font-size: 38rem / $pxConvertRem; | 21 | font-size: 38rem / $pxConvertRem; |
| @@ -36,8 +36,9 @@ | @@ -36,8 +36,9 @@ | ||
| 36 | height: 44px; | 36 | height: 44px; |
| 37 | text-align: center; | 37 | text-align: center; |
| 38 | color: #fff; | 38 | color: #fff; |
| 39 | - background-image: linear-gradient(#323232, #0f0f0f); | ||
| 40 | border-radius: 10px; | 39 | border-radius: 10px; |
| 40 | + @include background(linear-gradient(#323232, #0f0f0f)); | ||
| 41 | + // background-image: linear-gradient(#323232, #0f0f0f); | ||
| 41 | } | 42 | } |
| 42 | } | 43 | } |
| 43 | 44 |
| @@ -98,7 +98,7 @@ | @@ -98,7 +98,7 @@ | ||
| 98 | min-height: 800rem / $pxConvertRem; | 98 | min-height: 800rem / $pxConvertRem; |
| 99 | 99 | ||
| 100 | .index-channel-list { | 100 | .index-channel-list { |
| 101 | - margin-top: -50%; | 101 | + margin-top: -300rem / $pxConvertRem; |
| 102 | width: 100%; | 102 | width: 100%; |
| 103 | position: absolute; | 103 | position: absolute; |
| 104 | top: 50%; | 104 | top: 50%; |
| @@ -27,7 +27,7 @@ | @@ -27,7 +27,7 @@ | ||
| 27 | .clear-input { | 27 | .clear-input { |
| 28 | position: absolute; | 28 | position: absolute; |
| 29 | top: 24rem / $pxConvertRem; | 29 | top: 24rem / $pxConvertRem; |
| 30 | - right: 110rem / $pxConvertRem; | 30 | + right: 100rem / $pxConvertRem; |
| 31 | font-size: 32rem / $pxConvertRem; | 31 | font-size: 32rem / $pxConvertRem; |
| 32 | color: #b2b2b2; | 32 | color: #b2b2b2; |
| 33 | } | 33 | } |
| @@ -35,9 +35,10 @@ | @@ -35,9 +35,10 @@ | ||
| 35 | .search { | 35 | .search { |
| 36 | position: absolute; | 36 | position: absolute; |
| 37 | top: 20rem / $pxConvertRem; | 37 | top: 20rem / $pxConvertRem; |
| 38 | - right: 0; | 38 | + right: 12rem / $pxConvertRem; |
| 39 | border: none; | 39 | border: none; |
| 40 | background: transparent; | 40 | background: transparent; |
| 41 | + color: #b2b2b2; | ||
| 41 | font-size: 32rem / $pxConvertRem; | 42 | font-size: 32rem / $pxConvertRem; |
| 42 | } | 43 | } |
| 43 | } | 44 | } |
| @@ -3,8 +3,7 @@ | @@ -3,8 +3,7 @@ | ||
| 3 | <div class="newbrand-search"> | 3 | <div class="newbrand-search"> |
| 4 | <div class="search-box clearfix"> | 4 | <div class="search-box clearfix"> |
| 5 | <a href="{{searchUrl}}" > | 5 | <a href="{{searchUrl}}" > |
| 6 | - <!-- <input type="text" class="search-input" placeholder="查找品牌"> --> | ||
| 7 | - <span>查找品牌</span> | 6 | + <input type="text" class="search-input" placeholder="查找品牌" readonly="true"> |
| 8 | <i class="search-icon iconfont"></i> | 7 | <i class="search-icon iconfont"></i> |
| 9 | </a> | 8 | </a> |
| 10 | </div> | 9 | </div> |
| @@ -10,12 +10,6 @@ | @@ -10,12 +10,6 @@ | ||
| 10 | </div> | 10 | </div> |
| 11 | </form> | 11 | </form> |
| 12 | </div> | 12 | </div> |
| 13 | - <div class="history"> | ||
| 14 | - <h6>历史纪录</h6> | ||
| 15 | - <div class="historyList"> | ||
| 16 | - </div> | ||
| 17 | - <span class='removeHistory'>清空搜索历史</span> | ||
| 18 | - </div> | ||
| 19 | <div class="search-result"> | 13 | <div class="search-result"> |
| 20 | </div> | 14 | </div> |
| 21 | </div> | 15 | </div> |
| @@ -7,7 +7,7 @@ | @@ -7,7 +7,7 @@ | ||
| 7 | <a href="javascript:void(0);" class="no-search">取消</a> | 7 | <a href="javascript:void(0);" class="no-search">取消</a> |
| 8 | <div class="search-box"> | 8 | <div class="search-box"> |
| 9 | <input type="hidden" name="from" value="search"> | 9 | <input type="hidden" name="from" value="search"> |
| 10 | - <input type="text" name="query" placeholder="搜索"> | 10 | + <input type="text" name="query" placeholder="搜索" autocomplete="off"> |
| 11 | <span class="iconfont clear-text"></span> | 11 | <span class="iconfont clear-text"></span> |
| 12 | <span class="iconfont search-icon"></span> | 12 | <span class="iconfont search-icon"></span> |
| 13 | </div> | 13 | </div> |
| @@ -6,7 +6,7 @@ | @@ -6,7 +6,7 @@ | ||
| 6 | <i class="search-icon iconfont"></i> | 6 | <i class="search-icon iconfont"></i> |
| 7 | <input type="text" placeholder="搜索商品" name="query"> | 7 | <input type="text" placeholder="搜索商品" name="query"> |
| 8 | <i class="clear-input iconfont hide"></i> | 8 | <i class="clear-input iconfont hide"></i> |
| 9 | - <button id="search" class="search" type="submit">搜索</button> | 9 | + <span id="search" class="search" type="submit">搜索</span> |
| 10 | </form> | 10 | </form> |
| 11 | </div> | 11 | </div> |
| 12 | <div class="search-items"> | 12 | <div class="search-items"> |
| @@ -3,7 +3,7 @@ | @@ -3,7 +3,7 @@ | ||
| 3 | {{> passport/header}} | 3 | {{> passport/header}} |
| 4 | <div class="content"> | 4 | <div class="content"> |
| 5 | <div class="input-container row has-eye"> | 5 | <div class="input-container row has-eye"> |
| 6 | - <input id="pwd" class="input pwd" type="text" placeholder="请输入密码" autocomplete="off" maxlength="20"> | 6 | + <input id="pwd" class="input pwd" type="password" placeholder="请输入密码" autocomplete="off" maxlength="20"> |
| 7 | </div> | 7 | </div> |
| 8 | <span id="btn-sure" class="btn btn-sure disable row">确定</span> | 8 | <span id="btn-sure" class="btn btn-sure disable row">确定</span> |
| 9 | </div> | 9 | </div> |
| @@ -9,7 +9,6 @@ | @@ -9,7 +9,6 @@ | ||
| 9 | <a href="javascript:;"> | 9 | <a href="javascript:;"> |
| 10 | {{/ url}} | 10 | {{/ url}} |
| 11 | {{# img}} | 11 | {{# img}} |
| 12 | - <!-- <img class="nav-img" src="{{.}}" alt=""> --> | ||
| 13 | <span class="nav-img" style="background-image: url({{.}})"></span> | 12 | <span class="nav-img" style="background-image: url({{.}})"></span> |
| 14 | {{/ img}} | 13 | {{/ img}} |
| 15 | {{^ img}} | 14 | {{^ img}} |
-
Please register or login to post a comment