Procházet zdrojové kódy

Home and shopping cart pages

ananthvijay před 2 roky
rodič
revize
6c21a9aeab

+ 9
- 2
dist/html/pages/index.html Zobrazit soubor

31
                             <h5 class="mb-4">AIO24 - 1700N</h5>
31
                             <h5 class="mb-4">AIO24 - 1700N</h5>
32
                             <h1 class="banner_heading_4 mb-4">All-in-One</h1>
32
                             <h1 class="banner_heading_4 mb-4">All-in-One</h1>
33
                             <h6 class="subtitle_1 mb-4">Extraordinary Performance and Unparalleled Flexibility</h6>
33
                             <h6 class="subtitle_1 mb-4">Extraordinary Performance and Unparalleled Flexibility</h6>
34
-                            <a class="btn btn-dark button_dark" href="#">Learn
34
+                            <a class="btn btn-dark button_dark" href="#">Know
35
                                     More</a>
35
                                     More</a>
36
                         </div>
36
                         </div>
37
+                        <div class="col-md-12 d-block d-sm-none">
38
+                            <img src="../../assets/imgs/Home/all-in-one-mobile.png" class="img-fluid" alt="mobile-all-in-one">
39
+                        </div>
37
                     </div>
40
                     </div>
38
                 </section>
41
                 </section>
39
                 <section class="offer-main-sec py-2 mb-3">
42
                 <section class="offer-main-sec py-2 mb-3">
40
                     <div class="offer-sec bg-white shadow rounded ms-auto
43
                     <div class="offer-sec bg-white shadow rounded ms-auto
41
                             col-md-4">
44
                             col-md-4">
42
-                        <p class="py-3 text-center satoshi_font">Flat <span class="fw-bold"> 4,500</span> Instant Discount with HDFC credit card</p>
45
+                        <p class="py-3 text-center satoshi_font">Flat <span class="fw-bold"> 4,500</span> Instant Discount with HDFC Credit Card</p>
43
                     </div>
46
                     </div>
44
                 </section>
47
                 </section>
48
+                <div class="col-5 d-block d-sm-none">
49
+                    <a class="btn btn-dark button_dark mb-4" href="#">Know
50
+                        More</a>
51
+                    </div>
45
             </div>
52
             </div>
46
         </section>
53
         </section>
47
         <!-- end-banner -->
54
         <!-- end-banner -->

+ 10
- 11
dist/html/pages/shopping-cart.html Zobrazit soubor

45
             <div class="container pt-4">
45
             <div class="container pt-4">
46
                 <div class="row align-items-center bg-white rounded d-none d-sm-flex shopping-cart-details-row-1 ">
46
                 <div class="row align-items-center bg-white rounded d-none d-sm-flex shopping-cart-details-row-1 ">
47
                     <div class="col-md-2">
47
                     <div class="col-md-2">
48
-                        <h6>All</h6>
48
+                        <h6 class="text-center">All</h6>
49
                     </div>
49
                     </div>
50
                     <div class="col-md-4">
50
                     <div class="col-md-4">
51
-                        <h6>Product Name</h6>
51
+                        <h6 class="text-center">Product Name</h6>
52
                     </div>
52
                     </div>
53
                     <div class="col-md-2">
53
                     <div class="col-md-2">
54
                         <h6>Price</h6>
54
                         <h6>Price</h6>
111
                         </div>
111
                         </div>
112
                     </div>
112
                     </div>
113
                 </div>
113
                 </div>
114
-                <div class="row bg-white rounded  d-block d-sm-none ">
114
+                <div class="bg-white rounded  d-block d-sm-none ">
115
                     <div class="card mb-3" style="max-width: 540px;">
115
                     <div class="card mb-3" style="max-width: 540px;">
116
+                        <div class="mx-auto mobile-cart-img">
117
+                            <img src="../../assets/imgs/Home/Shopping-cart-item-img.png" alt="shopping-cart-item-img" class="img-fluid">
118
+                        </div>
116
                         <div class="d-flex align-items-center g-0">
119
                         <div class="d-flex align-items-center g-0">
117
-                            <div class="col-md-4">
118
-                                <img src="../../assets/imgs/Home/Shopping-cart-item-img.png" alt="shopping-cart-item-img" class="img-fluid">
119
-                            </div>
120
                             <div class="col-md-8">
120
                             <div class="col-md-8">
121
                                 <div class="card-body">
121
                                 <div class="card-body">
122
                                     <p class="mb-0"> Mi NoteBook Pro Lustrous Gray i5 11th Gen + Iris Xe Graphics 16GB RAM + 512GB NVMe SSD.</p>
122
                                     <p class="mb-0"> Mi NoteBook Pro Lustrous Gray i5 11th Gen + Iris Xe Graphics 16GB RAM + 512GB NVMe SSD.</p>
164
                     </div>
164
                     </div>
165
                 </div>
165
                 </div>
166
             </div>
166
             </div>
167
-            <div class="alert-display-sec position-fixed w-100 bottom-0">
168
-                <div class="alert alert-white bg-white border
167
+            <div class="alert-display-sec position-fixed w-100 bottom-0 ">
168
+                <div class="alert alert-white border
169
                                 border-end-0 border-start-0 mb-0 rounded-0
169
                                 border-end-0 border-start-0 mb-0 rounded-0
170
                                 alert-dismissible fade show" role="alert">
170
                                 alert-dismissible fade show" role="alert">
171
                     <div class="container">
171
                     <div class="container">
182
                                     <h2 class="fw-bold"><svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" fill="currentColor" class="bi bi-currency-rupee" viewBox="0 0 16 16">
182
                                     <h2 class="fw-bold"><svg xmlns="http://www.w3.org/2000/svg" width="35" height="35" fill="currentColor" class="bi bi-currency-rupee" viewBox="0 0 16 16">
183
                                         <path d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z"/>
183
                                         <path d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z"/>
184
                                       </svg> 54,999.00</h01>
184
                                       </svg> 54,999.00</h01>
185
-                                        <a class="btn btn-dark
186
-                                                        button_dark" href="#">Check
185
+                                        <a class="btn btn-dark button_dark" href="#">Check
187
                                             Out</a>
186
                                             Out</a>
188
                                 </div>
187
                                 </div>
189
                             </div>
188
                             </div>
304
             </div>
303
             </div>
305
             <div class=" delivery-to-sec sec-space-3 d-none d-sm-block">
304
             <div class=" delivery-to-sec sec-space-3 d-none d-sm-block">
306
                 <div class=" container ">
305
                 <div class=" container ">
307
-                    <div class=" col-md-5 ">
306
+                    <div class="col-md-7 col-lg-5">
308
                         <div class=" d-flex align-items-center justify-content-around ">
307
                         <div class=" d-flex align-items-center justify-content-around ">
309
                             <div class=" px-0 ">
308
                             <div class=" px-0 ">
310
                                 <h6>Delivery to
309
                                 <h6>Delivery to

+ 19
- 2
styles/pages/_home.scss Zobrazit soubor

128
             margin-top: 40px;
128
             margin-top: 40px;
129
         }
129
         }
130
         .banner-main-container {
130
         .banner-main-container {
131
-            height: 275px;
131
+ 
132
             text-align: center;
132
             text-align: center;
133
             .col-md-6 {
133
             .col-md-6 {
134
                 margin-top: 0px;
134
                 margin-top: 0px;
135
+                .button_dark{
136
+                    display: none;
137
+                }
135
             }
138
             }
136
             h1 {
139
             h1 {
137
                 font-size: 2rem;
140
                 font-size: 2rem;
138
             }
141
             }
139
         }
142
         }
140
         .hero-banner {
143
         .hero-banner {
141
-            background: #cccccc;
144
+            // background: url(../../dist/assets/imgs/Home/All-in-one.png);
145
+            // background-size: cover;
146
+            background-position: 0;
147
+        }
148
+        .aw-main-features{
149
+            display: none;
142
         }
150
         }
143
         .mobile-text-center {
151
         .mobile-text-center {
144
             text-align: center;
152
             text-align: center;
186
                 padding: 0 !important;
194
                 padding: 0 !important;
187
             }
195
             }
188
         }
196
         }
197
+        .offer-main-sec{
198
+            margin-bottom: 0 !important;
199
+            padding: 0 !important;
200
+        }
201
+        .offer-sec{
202
+            p{
203
+                font-size: 0.85rem;
204
+            }
205
+        }
189
     }
206
     }
190
     .footer-wrapper {
207
     .footer-wrapper {
191
         .accordion-button,
208
         .accordion-button,

+ 9
- 1
styles/pages/_shopping-cart.scss Zobrazit soubor

16
     }
16
     }
17
     .alert-display-sec {
17
     .alert-display-sec {
18
         z-index: 1;
18
         z-index: 1;
19
+        .alert-dismissible{
20
+       background:rgb(255 255 255 / 66%)
21
+        }
19
     }
22
     }
20
 }
23
 }
21
-
24
+.warrenty-sec img{
25
+    width: 40px;
26
+}
22
 #footer-head {
27
 #footer-head {
23
     .footer-wrapper.sec-space-1 {
28
     .footer-wrapper.sec-space-1 {
24
         margin-top: 0;
29
         margin-top: 0;
42
             padding: 10px;
47
             padding: 10px;
43
         }
48
         }
44
     }
49
     }
50
+    .mobile-cart-img img{
51
+        width: 200px;
52
+    }
45
 }
53
 }

Loading…
Zrušit
Uložit