Merged in Feature/promotion-program (pull request #124)

Feature/promotion program

5 files changed, 147 insertions, 0 deletions

diff --git a/src-migrate/modules/cart/styles/detail.module.css b/src-migrate/modules/cart/styles/detail.module.css
new file mode 100644
index 00000000..42d492bb
--- /dev/null
+++ b/src-migrate/modules/cart/styles/detail.module.css
@@ -0,0 +1,3 @@
+.wrapper {
+    @apply flex flex-wrap;
+}
diff --git a/src-migrate/modules/cart/styles/item-action.module.css b/src-migrate/modules/cart/styles/item-action.module.css
new file mode 100644
index 00000000..e4db7fa5
--- /dev/null
+++ b/src-migrate/modules/cart/styles/item-action.module.css
@@ -0,0 +1,32 @@
+.actionSection {
+    @apply flex ml-auto h-fit my-auto;
+}
+
+.deleteButton {
+    @apply bg-red-100 disabled:bg-gray-100
+        text-red-700 disabled:text-gray-500
+        hover:bg-red-200
+        disabled:cursor-not-allowed
+        transition-all
+        p-2.5 rounded;
+}
+
+.quantitySection {
+    @apply relative flex border border-gray-300 rounded ml-4 items-center text-red-700;
+}
+
+.quantityLoading {
+    @apply absolute flex items-center justify-center text-white rounded w-full h-full bg-gray-900/50 z-10;
+}
+
+.quantityControl {
+    @apply h-full w-8 flex items-center justify-center hover:bg-gray-100 
+        disabled:text-gray-500 
+        disabled:bg-transparent
+        disabled:cursor-not-allowed 
+        transition;
+}
+
+.quantity {
+    @apply text-gray-900 font-medium max-w-[28px] outline-none text-center;
+}
diff --git a/src-migrate/modules/cart/styles/item-promo.module.css b/src-migrate/modules/cart/styles/item-promo.module.css
new file mode 100644
index 00000000..5bc192c0
--- /dev/null
+++ b/src-migrate/modules/cart/styles/item-promo.module.css
@@ -0,0 +1,31 @@
+.wrapper {
+    @apply md:ml-12 ml-8 mt-4 flex;
+}
+
+.imageWrapper {
+    @apply md:h-24 md:w-24 md:min-w-[96px]
+    h-20 w-20 min-w-[80px] 
+    border border-gray-300 rounded 
+    p-2.5;
+}
+
+.image {
+    @apply w-full h-full object-contain;
+}
+
+.details {
+    @apply ml-4 w-full flex flex-col gap-y-1;
+}
+
+.name {
+    @apply font-medium;
+}
+
+.code,
+.weightLabel {
+    @apply text-gray-600;
+}
+
+.quantity {
+    @apply w-12 min-w-[42px] py-2.5 bg-gray-100 border border-gray-300 h-fit my-auto rounded-md ml-auto font-medium text-center;
+}
diff --git a/src-migrate/modules/cart/styles/item.module.css b/src-migrate/modules/cart/styles/item.module.css
new file mode 100644
index 00000000..dfbbf5e8
--- /dev/null
+++ b/src-migrate/modules/cart/styles/item.module.css
@@ -0,0 +1,60 @@
+.wrapper {
+    @apply border-b border-gray-300 pb-8;
+}
+
+.header {
+    @apply mb-4 flex items-center text-caption-1 leading-6;
+}
+
+.badgeType {
+    @apply min-w-fit p-2 flex items-center gap-x-1.5 rounded-md border border-danger-500 text-danger-500;
+}
+
+.mainProdWrapper {
+    @apply flex;
+}
+
+.image {
+    @apply md:h-32 md:w-32 md:min-w-[128px] 
+    w-24 h-24 min-w-[96px] rounded flex p-2 border border-gray-300;
+}
+
+.noImage {
+    @apply m-auto font-semibold text-gray-400;
+}
+
+.details {
+    @apply ml-4 flex flex-col gap-y-1 w-full;
+}
+
+.name {
+    @apply font-medium;
+}
+
+.spacing2 {
+    @apply h-2;
+}
+
+.discPriceSection {
+    @apply flex flex-col md:flex-row gap-x-2.5;
+}
+
+.priceBefore {
+    @apply line-through text-gray-500;
+}
+
+.price {
+    @apply text-red-600 font-medium;
+}
+
+.savingAmt {
+    @apply text-success-600;
+}
+
+.weightLabel {
+    @apply text-gray-500;
+}
+
+.quantity {
+    @apply py-2.5 bg-red-100 border border-red-300 text-red-800 h-fit my-auto rounded-md ml-auto font-medium w-12 text-center;
+}
diff --git a/src-migrate/modules/cart/styles/summary.module.css b/src-migrate/modules/cart/styles/summary.module.css
new file mode 100644
index 00000000..48ccec28
--- /dev/null
+++ b/src-migrate/modules/cart/styles/summary.module.css
@@ -0,0 +1,21 @@
+.line {
+    @apply flex justify-between;
+}
+
+.label,
+.value {
+    @apply text-gray-700;
+}
+
+.value,
+.grandTotal {
+    @apply font-medium;
+}
+
+.discount {
+    @apply text-red-700;
+}
+
+.divider {
+    @apply my-0.5 h-0.5 bg-gray-200;
+}