Blame view

app/views/main.html 7.26 KB
87c93a029   Dang YoungWorld   add modal
1
  <div ng-controller="MainCtrl" class="col-sm-10 col-sm-offset-1" id="tshirt-container">
862daa8a4   DANG   commit theme
2
3
4
    <div class="row">
      <header>
        <div class="logo">
990a1e38d   DANG   Edit css
5
6
          <img src="images/logo_mobile_world.png" alt="Logo Mobile World" />
          MOBILE WORLD
862daa8a4   DANG   commit theme
7
8
9
10
11
12
        </div>
      </header>
      <nav class="clearfix">
        <div class="col-sm-12">
          <h2 class="pull-left">加工箇所を選択してデザインしてください。</h2>
          <ul class="pull-right">
a56541cf9   DANG   add css
13
14
            <li><a href="#">商品に戻る</a><i class="fa fa-caret-left" aria-hidden="true"></i></li>
            <li><a href="#">加工方法に戻る</a><i class="fa fa-caret-left" aria-hidden="true"></i></li>
862daa8a4   DANG   commit theme
15
16
17
18
            <li class="action">デザインする</li>
          </ul>
        </div>
      </nav>
a56541cf9   DANG   add css
19
      <article class="clearfix">
862daa8a4   DANG   commit theme
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
          <aside class="col-sm-5">
            <div class="step">
              <div class="title">
                1. デザインを作る
              </div>
              <div class="step-box">
                <div class="tshirt-design clearfix">
                  <div class="icon">
                    <img src="images/t-shirt_icon/tshirt1.gif" alt="icon t-shirt" />
                  </div>
                  <div class="name">
                    背中背中 (28x22)
                  </div>
                  <div class="action">
                    <button class="red" ng-click="modalTShirtDesign()">
                      <i class="fa fa-caret-right" aria-hidden="true"></i> デザインを作る
                    </button>
                  </div>
8f087d204   DANG   Theme + add bower...
38
39
40
                </div>
              </div>
            </div>
e7c9c7707   DANG   Commit theme
41

862daa8a4   DANG   commit theme
42
43
44
            <!--  BREAK DOWN-->
            <div class="text-center break-down">
              <img src="images/bg_step_arrow.gif" alt="arrow" />
e7c9c7707   DANG   Commit theme
45
            </div>
862daa8a4   DANG   commit theme
46
47
48
49
50
51
52
53
54
  
            <!-- STEP 2-->
            <div class="step">
              <div class="title">
                2.アイテムカラーを変更する
              </div>
              <div class="step-box clearfix">
                <div class="tshirt-color">
                  <ul class="choice-color clearfix">
422e7837d   DANG   Change color t-shirt
55
56
57
                    <li ng-repeat="(key,color) in tShirtColor" ng-click="choiceTShirtColor(key)" ng-class="key == tShirtColorKey ? 'action' : ''">
                      <div ng-style="{'background-color' : color.code}"></div>
                    </li>
862daa8a4   DANG   commit theme
58
                  </ul>
422e7837d   DANG   Change color t-shirt
59
                  <div class="color-name" ng-bind="tShirtColorName"></div>
862daa8a4   DANG   commit theme
60
61
62
                  <div class="view-more">
                    在庫確認 <i class="fa fa-chevron-circle-right" aria-hidden="true"></i>
                  </div>
e7c9c7707   DANG   Commit theme
63
64
65
                </div>
              </div>
            </div>
e7c9c7707   DANG   Commit theme
66

862daa8a4   DANG   commit theme
67
68
69
70
            <!--  BREAK DOWN-->
            <div class="text-center break-down">
              <img src="images/bg_step_arrow.gif" alt="arrow" />
            </div>
e7c9c7707   DANG   Commit theme
71

862daa8a4   DANG   commit theme
72
73
74
75
76
77
78
79
80
81
82
            <!-- STEP 3-->
            <div class="step">
              <div class="step-box clearfix">
                <div class="tshirt-saveorder">
                  <div class="clearfix">
                    <div class="action">
                      <button class="white">
                        <div class="text">
                          このデザインを保存する
                        </div>
                        <div class="arrow">
e7c9c7707   DANG   Commit theme
83
                          <i class="fa fa-chevron-circle-right" aria-hidden="true"></i>
862daa8a4   DANG   commit theme
84
85
86
87
88
89
90
91
92
93
94
95
96
                        </div>
                      </button>
                    </div>
                    <div class="action">
                      <button class="red">
                        <div class="text">
                          このデザインで注文する
                        </div>
                        <div class="arrow clearfix">
                          <i class="fa fa-chevron-circle-right" aria-hidden="true"></i>
                        </div>
                      </button>
                    </div>
e7c9c7707   DANG   Commit theme
97
                  </div>
862daa8a4   DANG   commit theme
98
99
                  <div class="notice">
                    デザインを保存するには、ログインしてください
e7c9c7707   DANG   Commit theme
100
101
                  </div>
                </div>
e7c9c7707   DANG   Commit theme
102
              </div>
e7c9c7707   DANG   Commit theme
103

862daa8a4   DANG   commit theme
104
105
106
107
              <!-- BREAL LINE-->
              <div class="text-center break-line">
                <hr />
              </div>
e7c9c7707   DANG   Commit theme
108

862daa8a4   DANG   commit theme
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
              <!-- STEP 4-->
              <div class="step">
                <div class="title-notice">
                  商品・デザインの変更はこちら <span class="require">作業中のデザインは破棄されます</span>
                </div>
                <div class="step-box">
                  <div class="change-design">
                    <table>
                      <tr>
                        <td class="text-center">商品</td>
                        <td>MENドライカノコポロシャツ・ポケツキ半袖(ホワイト)</td>
                        <td class="text-right">
                          <button class="brown"><i class="fa fa-caret-right" aria-hidden="true"></i> 変更</button>
                        </td>
                      </tr>
                      <tr>
                        <td width="10%" class="text-center">加工方法</td>
                        <td width="70%">シルク:胸中央 (27×27)</td>
                        <td width="20%" class="text-right">
                          <button class="brown"><i class="fa fa-caret-right" aria-hidden="true"></i> 変更</button>
                        </td>
                      </tr>
                    </table>
                  </div>
                </div>
e7c9c7707   DANG   Commit theme
134
              </div>
862daa8a4   DANG   commit theme
135
136
137
138
139
140
              <!-- STEP 5- finish-->
              <div class="step">
                <div class="finish-design">
                  <button class="white">
                    自分で保存したデザインを呼び出す <i class="fa fa-chevron-circle-right" aria-hidden="true"></i>
                  </button>
e7c9c7707   DANG   Commit theme
141
                </div>
862daa8a4   DANG   commit theme
142

e7c9c7707   DANG   Commit theme
143
144
              </div>
            </div>
862daa8a4   DANG   commit theme
145
146
147
          </aside>
          <section id="tshirt-content" class="col-sm-7 text-center">
            <div class="switch-border-design">
19a110aef   DANG   add css
148
              <i class="fa fa-square-o" aria-hidden="true"></i> 枠線を消す
862daa8a4   DANG   commit theme
149
150
            </div>
            <div class="tshirt-image">
422e7837d   DANG   Change color t-shirt
151
              <img ng-src="{{ tShirtImg }}" alt="" />
7e14f1786   Dang YoungWorld   Fix reponsive
152
              <div class="{{ placeTshirt.place }}" id="preview-design" ng-show="placeTshirt.face === tShirtChoiceBackFrontKey" ng-click="modalTShirtDesign()">
80ff9bbd4   TRUONG   fix bugs and optimal
153
154
                <img ng-src="{{outputImage}}" ng-show="outputImage"/>
              </div>
862daa8a4   DANG   commit theme
155
156
157
            </div>
            <div class="tshirt-choice">
              <ul>
422e7837d   DANG   Change color t-shirt
158
                <li ng-class="'front' === tShirtChoiceBackFrontKey ? 'focus' : ''">
862daa8a4   DANG   commit theme
159
                  <div>前</div>
422e7837d   DANG   Change color t-shirt
160
161
                  <div class="image" ng-click="choiceTShirtBackFront('front')">
                    <img ng-src="{{ tShirtImgFront }}" alt="" />
862daa8a4   DANG   commit theme
162
163
164
                  </div>
  
                </li>
422e7837d   DANG   Change color t-shirt
165
                <li ng-class="'back' === tShirtChoiceBackFrontKey ? 'focus' : ''">
862daa8a4   DANG   commit theme
166
                  <div>後</div>
422e7837d   DANG   Change color t-shirt
167
168
                  <div class="image"  ng-click="choiceTShirtBackFront('back')">
                    <img ng-src="{{ tShirtImgBack }}" alt="" />
862daa8a4   DANG   commit theme
169
                  </div>
e7c9c7707   DANG   Commit theme
170

862daa8a4   DANG   commit theme
171
172
                </li>
              </ul>
e7c9c7707   DANG   Commit theme
173
            </div>
862daa8a4   DANG   commit theme
174
          </section>
862daa8a4   DANG   commit theme
175
      </article>
a56541cf9   DANG   add css
176
177
178
179
180
181
182
183
184
      <footer class="clearfix">
        <ul class="nav-footer">
          <li><a href="#">店舗検索</a></li>
          <li><a href="#">お客様窓口</a></li>
          <li><a href="#">企業情報</a></li>
          <li><a href="#">採用情報</a></li>
          <li><a href="#">プライバシーポリシー</a></li>
        </ul>
      </footer>
c87bc1f33   TRUONG   first commit: ini...
185

862daa8a4   DANG   commit theme
186
      <!--MODAL CONTENT-->
c9d8b2fe3   Truong LD   update version
187
      <div ng-include="designFrameView"></div>
862daa8a4   DANG   commit theme
188
    </div>
87c93a029   Dang YoungWorld   add modal
189

87c93a029   Dang YoungWorld   add modal
190

8f087d204   DANG   Theme + add bower...
191
  </div>