Refactor code structure for improved readability and maintainability

themes/InterBlue/assets/css/custom.scss

@@ -1125,6 +1125,24 @@ body.high-contrast {
       background: #000 !important;
       border: 0 !important;
 
+      .product-flags {
+        display: flex;
+        gap: 5px;
+
+        li {
+          position: static !important;
+          padding: 10px !important;
+          display: flex;
+          width: fit-content !important;
+          height: fit-content !important;
+          margin: 0 !important;
+        }
+
+        .discount {
+          display: block;
+        }
+      }
+
       .product-description {
         background: #000 !important;
 
@@ -1141,6 +1159,10 @@ body.high-contrast {
           * {
             color: #FFF !important;
           }
+
+          .discount-percentage {
+            display: none;
+          }
         }
 
         button {
@@ -1353,4 +1375,212 @@ body.high-contrast {
       color: #FFF !important;
     }
   }
+
+  #category-description {
+    background: #000;
+    color: #FFF !important;
+    border: 0;
+    padding-left: 0;
+    padding-right: 0;
+
+    p,
+    a {
+      color: #FFF !important;
+    }
+  }
+
+  .pagination {
+    ul {
+      background: transparent;
+
+      li {
+        background: #FFF;
+        color: #000;
+        border: 0 !important;
+
+        a {
+          color: #000 !important;
+          text-decoration: underline;
+        }
+
+        &.current {
+          background: $cYellow !important;
+          color: #000 !important;
+
+          a {
+            color: #000 !important;
+          }
+        }
+      }
+    }
+  }
+
+  div[itemprop="offers"] {
+    .product-sku {
+
+      label,
+      .label {
+        color: #FFF !important;
+      }
+
+      span {
+        color: #FFF !important;
+        font-weight: 600;
+      }
+    }
+
+    .product-prices {
+      .tax-shipping-delivery-label {
+        color: $cYellow
+      }
+
+      .current-price {
+        span {
+          color: $cYellow;
+        }
+      }
+    }
+
+    div[itemprop="description"] {
+      span {
+        background: transparent !important;
+        color: #FFF !important;
+      }
+    }
+  }
+
+  .product-quantity {
+    #quantity_wanted {
+      border: 0 !important;
+    }
+
+    .bootstrap-touchspin .btn-touchspin {
+      background: $cYellow !important;
+      color: #000 !important;
+      border: 0 !important;
+      width: 30px !important;
+      text-align: center;
+
+      i {
+        left: 8px;
+        color: #000 !important;
+      }
+    }
+  }
+
+  .add {
+    .btn.btn-primary.add-to-cart {
+      background: $cYellow !important;
+      color: #000 !important;
+      border: 0 !important;
+      padding: 10px 20px !important;
+
+      i {
+        color: #000 !important;
+      }
+    }
+  }
+
+  #product-availability,
+  .delivery-info {
+    background: transparent !important;
+    color: #FFF !important;
+  }
+
+  .tabs {
+    background: #000 !important;
+    color: #FFF !important;
+
+    .tab-content {
+      .tab-pane {
+        border: 1px solid #FFF !important;
+        background: transparent !important;
+        color: #FFF !important;
+        display: none;
+
+        &.active {
+          display: block;
+        }
+
+        ul,
+        ol {
+          margin-left: 25px;
+        }
+
+        h2 {
+          color: #FFF !important;
+        }
+
+        .h5,
+        .h6 {
+          color: #FFF !important;
+        }
+
+        a {
+          color: #FFF !important;
+          text-decoration: underline;
+          font-weight: 600;
+        }
+
+        .product-features>dl.data-sheet {
+
+          dt,
+          dd {
+            border-bottom: 1px solid #eee;
+            background: transparent;
+            color: #FFF !important;
+          }
+        }
+      }
+    }
+
+    .nav-tabs {
+      border: 0 !important;
+
+      .nav-item {
+        .nav-link {
+          border: 1px solid #FFF !important;
+          background: transparent !important;
+          color: #FFF !important;
+
+          &.active {
+            border: 1px solid $cYellow !important;
+            color: $cYellow !important;
+          }
+        }
+      }
+    }
+  }
+
+  .category-products {
+    h4 {
+      color: #FFF !important;
+      font-weight: 600;
+    }
+
+    .products {
+      .product-miniature {
+        padding: 0 5px;
+
+        .product-price-and-shipping {
+          text-align: center;
+          width: 100%
+        }
+
+        .product-description {
+          align-items: flex-end;
+          height: fit-content;
+
+          h2 {
+            height: fit-content !important;
+
+            a {
+              color: #FFF !important;
+              text-decoration: underline;
+            }
+          }
+        }
+      }
+    }
+  }
 }