Showing
6 changed files
with
191 additions
and
1 deletions
static/img/logo-bottom.png
0 → 100644
5.81 KB
static/sass/product/_limit.scss
0 → 100644
1 | +.limit-good-page { | ||
2 | + background-color: #f4f4f4; | ||
3 | + color: #444; | ||
4 | + | ||
5 | + .top { | ||
6 | + font-size: 0.6rem; | ||
7 | + height: 2rem; | ||
8 | + line-height: 2.2rem; | ||
9 | + margin-bottom: 0.1rem; | ||
10 | + background-color: #fff; | ||
11 | + padding: 0.2rem 0; | ||
12 | + | ||
13 | + | ||
14 | + div { | ||
15 | + width: 20%; | ||
16 | + display: inline-block; | ||
17 | + float: left; | ||
18 | + img { | ||
19 | + width: 1.5rem; | ||
20 | + border: 1px solid #ccc; | ||
21 | + border-radius: 100%; | ||
22 | + position: relative; | ||
23 | + top: 0.25rem; | ||
24 | + } | ||
25 | + } | ||
26 | + | ||
27 | + p { | ||
28 | + display: inline-block; | ||
29 | + float: left; | ||
30 | + width: 80%; | ||
31 | + } | ||
32 | + } | ||
33 | + | ||
34 | + .detail { | ||
35 | + background-color: #fff; | ||
36 | + padding: 0.6rem 0.8rem; | ||
37 | + border-bottom: 1px solid #e6e6e6; | ||
38 | + | ||
39 | + .name { | ||
40 | + font-size: 0.9rem; | ||
41 | + margin-bottom: 0.5rem; | ||
42 | + } | ||
43 | + .sale-info { | ||
44 | + height: 1rem; | ||
45 | + line-height: 1rem; | ||
46 | + } | ||
47 | + .price { | ||
48 | + font-size: 0.8rem; | ||
49 | + color: #d0021b; | ||
50 | + float: left; | ||
51 | + } | ||
52 | + | ||
53 | + .date { | ||
54 | + font-size: 0.6rem; | ||
55 | + float: right; | ||
56 | + | ||
57 | + .text { | ||
58 | + position: relative; | ||
59 | + top: 0.08rem; | ||
60 | + } | ||
61 | + } | ||
62 | + } | ||
63 | + | ||
64 | + .goodDesc { | ||
65 | + margin-top: 1rem; | ||
66 | + } | ||
67 | + | ||
68 | + .bottom { | ||
69 | + background-color: #fff; | ||
70 | + border-top: 1px solid #e6e6e6; | ||
71 | + padding: 0.5rem 2rem 2rem 2rem; | ||
72 | + height: 3rem; | ||
73 | + position: absolute; | ||
74 | + bottom: 0; | ||
75 | + width: 12rem; | ||
76 | + margin: 0 auto; | ||
77 | + | ||
78 | + .logo { | ||
79 | + width: 100; | ||
80 | + height: 2.5rem; | ||
81 | + | ||
82 | + background-image: image-url('logo-bottom.png'); | ||
83 | + background-size: 100%; | ||
84 | + background-repeat: no-repeat; | ||
85 | + background-position: center; | ||
86 | + } | ||
87 | + | ||
88 | + .btn { | ||
89 | + font-size: 0.8rem; | ||
90 | + background-color: #fff; | ||
91 | + border: 1px solid #444; | ||
92 | + border-radius: 0.2rem; | ||
93 | + padding: 0.3rem 0.6rem; | ||
94 | + } | ||
95 | + | ||
96 | + .btn:active { | ||
97 | + background-color: #ccc; | ||
98 | + } | ||
99 | + | ||
100 | + .left, .right { | ||
101 | + display: inline-block; | ||
102 | + float: left; | ||
103 | + } | ||
104 | + | ||
105 | + .left { | ||
106 | + width: 39%; | ||
107 | + } | ||
108 | + | ||
109 | + .right { | ||
110 | + width: 60%; | ||
111 | + font-size: 0.65rem; | ||
112 | + | ||
113 | + span { | ||
114 | + display: block; | ||
115 | + width: 95%; | ||
116 | + margin: 0 auto; | ||
117 | + } | ||
118 | + } | ||
119 | + } | ||
120 | +} |
1 | +{{> layout/header}} | ||
2 | +<div class="limit-good-page yoho-page"> | ||
3 | + <div class="top clearfix"> | ||
4 | + <div> | ||
5 | + <img src="{{profile}}" alt=""> | ||
6 | + </div> | ||
7 | + <p>我在Yoho!Buy有货发现了一个限定发售商品</p> | ||
8 | + </div> | ||
9 | + <div class="banner"> | ||
10 | + <a href="{{bannerSrc}}"> | ||
11 | + <img src="{{banner}}" alt=""> | ||
12 | + </a> | ||
13 | + </div> | ||
14 | + <div class="detail clearfix"> | ||
15 | + <p class="name">{{name}}</p> | ||
16 | + <div class="sale-info"> | ||
17 | + <span class="price">¥{{price}}</span> | ||
18 | + <span class="date"> | ||
19 | + <span class="iconfont"></span> | ||
20 | + <span class="text">{{releaseDate}}</span> | ||
21 | + </span> | ||
22 | + </div> | ||
23 | + </div> | ||
24 | + | ||
25 | + <div class="goodDesc"></div> | ||
26 | + | ||
27 | + <div class="bottom"> | ||
28 | + <div class="logo"></div> | ||
29 | + <div class="left"> | ||
30 | + <a href="{{appSrc}}"> | ||
31 | + <button class="btn"> | ||
32 | + 立即下载 | ||
33 | + </button> | ||
34 | + </a> | ||
35 | + </div> | ||
36 | + <div class="right"> | ||
37 | + <span>下载Yoho!Buy有货APP</span> | ||
38 | + <span>抢购超级限量款</span> | ||
39 | + </div> | ||
40 | + </div> | ||
41 | + | ||
42 | +</div> | ||
43 | +{{> layout/footer}} |
@@ -229,4 +229,26 @@ class IndexController extends AbstractAction | @@ -229,4 +229,26 @@ class IndexController extends AbstractAction | ||
229 | $this->_view->display('index', $data); | 229 | $this->_view->display('index', $data); |
230 | } | 230 | } |
231 | 231 | ||
232 | + public function limitDetailAction() | ||
233 | + { | ||
234 | + $data = array(); | ||
235 | + $this->_view->display('limit-detail', $data); | ||
236 | + } | ||
237 | + | ||
238 | + public function limitAction() | ||
239 | + { | ||
240 | + $data = array( | ||
241 | + 'profile' => 'http://cdn.yoho.cn/myohobuy/assets/img/me/index/user-avatar.png?1455719653', | ||
242 | + 'banner' => 'http://img11.static.yhbimg.com/yhb-img01/2016/02/25/02/016ed5a17fb9d9bc7542174c22dccb4acf.jpg?imageView/2/w/640/h/240', | ||
243 | + 'bannerSrc' => './', | ||
244 | + 'name' => '潮流尖端商品啊啊啊啊', | ||
245 | + 'price' => '1999', | ||
246 | + 'releaseDate' => '2016年12月发售', | ||
247 | + 'appSrc' => './' | ||
248 | + ); | ||
249 | + | ||
250 | + | ||
251 | + | ||
252 | + $this->_view->display('limit', $data); | ||
253 | + } | ||
232 | } | 254 | } |
-
Please register or login to post a comment