edit 30/10

AQuadic · Oct 30, 2023 · 9ab1140 · 9ab1140
1 parent cd01c52
commit 9ab1140
Show file tree

Hide file tree

Showing 4 changed files with 95 additions and 34 deletions.
diff --git a/css/style.css b/css/style.css
@@ -280,7 +280,12 @@ li.r-title,
   color: #ae0028;
   display: none;
 }
-
+ .allItem  .add {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  flex-wrap: wrap;
+}
 .testimonials .item .item-details .add p.salary,
 .show .item .item-details .add p.salary,
 .perfect .main-about .item .item-details .add p.salary {
@@ -289,7 +294,13 @@ li.r-title,
   margin: 0;
   font-family: "Dubair";
 }
-
+ .add .salarySall{
+  color: #a4a4a4;
+  font-weight: 400 !important;
+  font-size: 1.4rem;
+  white-space: nowrap !important;
+  text-decoration: line-through;
+}
 .fav {
   position: absolute;
   top: 28px;
@@ -303,21 +314,26 @@ li.r-title,
   position: relative;
   direction: ltr;
 }
-
+.testimonials:hover button.owl-prev,.testimonials:hover button.owl-next {
+  transform: scale(1);
+}
 .testimonials button.owl-prev,
 .testimonials button.owl-next {
   position: absolute;
   top: calc(50% - 60px);
-  left: -64px;
+  left: -0px;
   height: 54px;
   width: 54px;
   box-shadow: 1px 1px 13px #9393939c;
   border-radius: 50%;
   z-index: 100;
+  transition: 0.3s;
+  transform: scale(0);
 }
 
 .testimonials button.owl-next {
-  left: calc(100% - -10px);
+  left: auto;
+  right: -22px;
 }
 
 .testimonials button.owl-prev img,
@@ -337,7 +353,6 @@ li.r-title,
   z-index: 50;
 }
 
-button.tsok,
 button.tsok,
 .tv-about .tv-details .add-to,
 .btn-shopping {
@@ -347,11 +362,11 @@ button.tsok,
   height: 50px;
   border: none;
   background-color: #e23734;
-  border-radius: 50px;
+  border-radius:14px;
   font-size: 16px;
   color: white;
   font-family: Dubair;
-  margin: 40px auto;
+  margin: 12px auto 40px;
   transition: 0.5s;
 }
 
@@ -394,16 +409,17 @@ button.tsok,
   .perfect .main-about .item .item-details .add p.salary {
     font-size: 18px;
   }
-}
-
-@media (max-width: 390px) {
   button.tsok,
   .tv-about .tv-details .add-to {
-    width: 70%;
-    height: 40px;
+    width: 180px;
+    height: 42px;
+    margin: 12px auto 20px;
+    border-radius: 8px;
   }
 }
 
+
+
 @media (max-width: 620px) {
   .testimonials button.owl-prev,
   .testimonials button.owl-next {
@@ -1441,6 +1457,7 @@ li.mt {
 .tv-product ol.breadcrumb a {
   color: #b63b4d;
   font-family: "Dubair";
+  font-size: 14px;
 }
 
 .breadcrumb-item {
@@ -1892,7 +1909,8 @@ h1 a {
 
 .tv .breadcrumb-item.active,
 .tv-product .breadcrumb-item.active {
-  font-size: 18px;
+  font-size: 14px;
+  line-height: normal;
 }
 
 @media (max-width: 772px) {
@@ -4310,7 +4328,7 @@ input.add_comment {
 }
 .allItem:hover {
   background-color: white;
-  box-shadow: 0px 0px 5px #eee;
+  box-shadow: 0px 0px 5px #d7d6d6ad;
 }
 .allItem:hover .itemNew {
 }
@@ -4323,22 +4341,22 @@ input.add_comment {
   width: 90%;
   padding: 11px 5%;
   height: auto;
-  background: #03c109;
+  background: #fd4a44;
   white-space: nowrap;
   font-size: 1.4rem;
   display: inline-block;
   box-sizing: border-box;
   vertical-align: middle;
   border: navajowhite;
   color: white;
-  margin: 10px auto;
+  margin: 2px auto;
   transition: 0.5s;
   display: block;
   opacity: 0;
   transition: 0.4s;
 }
 .allItem .btnAdd:hover {
-  background-color: #004b9e;
+  background-color: #03c109;
 }
 .allItem .fav {
   top: 20px;
@@ -4350,9 +4368,9 @@ input.add_comment {
   top: 16px;
   opacity: 1;
 }
-body {
+/* body {
   background-color: #f5f9f9;
-}
+} */
 
 @media (max-width: 992px) {
   .allItem .btnAdd {
@@ -4409,14 +4427,14 @@ margin-bottom: 20px;
     height: 25px;
     line-height: 6px;
     border: 1px solid #f28140;
-    border-radius: 7px 0px 0px 0px;
+    border-radius: 0px 0px 0px 7px;
     color: #434343;
     font-size: 20px;
     width: 36px;
     border-left: none;
 }
 .tv-about .tv-details .AddCount .btnCount button.tv-add{
-    border-radius: 0px 0px 0px 7px;
+    border-radius: 7px 0px 0px 0px;
 }
 .EndProduct {
     display: flex;
@@ -4456,4 +4474,40 @@ font-weight: 300;
         height: 44px;
 
     }
-}
+}
+.owl-carousel .owl-item{
+  margin-top: 2px;
+}
+/* .newfooter{
+  background-image: url('../images/Backfooter.png');
+} */
+.ratItem{
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: #f58726;
+  width: fit-content;
+  padding: 2px 4px;
+  border-radius: 4px;
+  margin: 8px 0px 10px;
+}
+.ratItem .retNum{
+    display: inline-flex;
+    color: #fff;
+    padding: 3px;
+    font-size: 1.2rem;
+    border-radius: 2px;
+    align-items: center;
+    line-height: normal;
+    font-family: 'HelveticaNeueLTArabic';
+    font-weight: 500;
+}
+.ratItem .star:after {
+  content: "\f005";
+  font-family: "Font Awesome 5 Free";
+  font-weight: 900;
+  margin-left: 4px;
+  font-size: .8rem;
+  color: white;
+}
+.ratItem .star{}
diff --git a/images/Backfooter.png b/images/Backfooter.png
diff --git a/index.html b/index.html
@@ -616,6 +616,12 @@ <h5>
                   class="fav"
                   alt=""
                 />
+                <img
+                src="./images/Group 45.svg"
+                class="sal"
+                style="width: 66px"
+                alt=""
+              />
                 <a href="tv.html" class="itemNew">
                   <div class="contentItem">
                     <img class="imgItem" src="./images/testImg.jpg" alt="" />
@@ -626,6 +632,7 @@ <h5>
                       </h5>
                       <div class="add">
                         <p class="salary">EGP21,099</p>
+                        <p class="salarySall">EGP20,099</p>
                       </div>
                     </div>
                   </div>
@@ -1200,7 +1207,7 @@ <h4>الوطنية 2022 جميع الحقوق محفوظة</h4>
           loop: true,
           center: false,
           items: 3,
-          margin: 35,
+          margin: 0,
           autoplay: false,
           dots: true,
           nav: true,
@@ -1214,14 +1221,8 @@ <h4>الوطنية 2022 جميع الحقوق محفوظة</h4>
             0: {
               items: 1.3,
             },
-            300: {
-              items: 1.5,
-            },
-            525: {
-              items: 1.5,
-            },
-            600: {
-              items: 1.5,
+            460: {
+              items: 1.8,
             },
             768: {
               items: 3,

diff --git a/tvproduct.html b/tvproduct.html
@@ -505,6 +505,11 @@ <h1>
                 HOOVER Built-In Hob 90 x 60, 5 Gas Burners, Stainless
                 HG953/1SXGH-EGY
               </h1>
+              <div class="ratItem">
+                <span class="retNum">5.0</span>
+                <span class="star"></span>
+                <!-- <img src="" alt="star"/> -->
+              </div>
               <div class="price">
                 <h2>EGP21,099</h2>
               </div>
@@ -536,8 +541,9 @@ <h2 class="tv-data">
                     value="1"
                   />
                   <div class="btnCount">
-                    <button class="tv-del" type="button" id="tv-del">-</button>
                     <button class="tv-add" type="button" id="tv-add">+</button>
+                    <button class="tv-del" type="button" id="tv-del">-</button>
+
                   </div>
 
                 </div>
@@ -563,7 +569,7 @@ <h2 class="tv-data">
                   alt=""
                 />
                   <p>Add to Wish List</p>
-                </button>
+                </button> 
               </div>
             </div>
           </div>