Authored by 郭成尧

logistic-style

1 <div class="logistic-page yoho-page"> 1 <div class="logistic-page yoho-page">
2 <div class="overview"> 2 <div class="overview">
3 - <div class="left" >  
4 - <a href="{{logisticUrl}}"><img class="icon" src="{{logisticImg}}" /></a>  
5 - </div> 3 + {{#if logisticImg}}
  4 + <div class="left" >
  5 + <a href="{{logisticUrl}}"><img class="icon" src="{{logisticImg}}" /></a>
  6 + </div>
  7 + {{/if}}
6 <div class="right"> 8 <div class="right">
7 <div> 9 <div>
8 <span class='info'>物流公司:</span> 10 <span class='info'>物流公司:</span>
@@ -2,6 +2,11 @@ $logistic_gray: #f0f0f0; @@ -2,6 +2,11 @@ $logistic_gray: #f0f0f0;
2 $border_color_strong: #e5e5e5; 2 $border_color_strong: #e5e5e5;
3 $border_color_light: #eee; 3 $border_color_light: #eee;
4 4
  5 +@define-extend padding-left-right {
  6 + padding-left: 30px;
  7 + padding-right: 30px;
  8 +}
  9 +
5 .logistic-page { 10 .logistic-page {
6 background-color: $logistic_gray; 11 background-color: $logistic_gray;
7 12
@@ -14,6 +19,8 @@ $border_color_light: #eee; @@ -14,6 +19,8 @@ $border_color_light: #eee;
14 color: #464646; 19 color: #464646;
15 border-bottom: 1px solid $border_color_strong; 20 border-bottom: 1px solid $border_color_strong;
16 21
  22 + @extend padding-left-right;
  23 +
17 .left { 24 .left {
18 width: 19%; 25 width: 19%;
19 float: left; 26 float: left;
@@ -55,13 +62,17 @@ $border_color_light: #eee; @@ -55,13 +62,17 @@ $border_color_light: #eee;
55 height: 112px; 62 height: 112px;
56 line-height: 112px; 63 line-height: 112px;
57 background-color: #fff; 64 background-color: #fff;
58 - font-size: 40px; 65 + font-size: 28px;
  66 +
  67 + @extend padding-left-right;
59 } 68 }
60 69
61 .detail { 70 .detail {
62 background-color: #fff; 71 background-color: #fff;
63 padding-left: 80px; 72 padding-left: 80px;
64 margin-bottom: 40px; 73 margin-bottom: 40px;
  74 +
  75 + @extend padding-left-right;
65 } 76 }
66 77
67 .timeline-box { 78 .timeline-box {