From 6edcc9c19a09bafc9c8c22dad17d8691e6f49dd3 Mon Sep 17 00:00:00 2001 From: marzban-dev Date: Sat, 14 Dec 2024 19:36:00 +0330 Subject: [PATCH] Add morabba font Chnage ui to rtl --- frontend/assets/css/fonts/morabba.css | 73 ++++++++++++++++++ frontend/assets/css/tailwind.css | 4 +- frontend/assets/css/typo.utils.css | 46 +++++------ .../global/product-detail/Rating.vue | 6 +- .../global/product-detail/RemainQuantity.vue | 14 ++-- frontend/components/product/ProductView.vue | 31 ++++---- frontend/layouts/Default.vue | 2 +- .../public/fonts/Morabba/Morabba-Black.woff2 | Bin 0 -> 21492 bytes .../public/fonts/Morabba/Morabba-Bold.woff2 | Bin 0 -> 21644 bytes .../fonts/Morabba/Morabba-ExtraBold.woff2 | Bin 0 -> 21720 bytes .../public/fonts/Morabba/Morabba-Heavy.woff2 | Bin 0 -> 20068 bytes .../public/fonts/Morabba/Morabba-Light.woff2 | Bin 0 -> 21300 bytes .../public/fonts/Morabba/Morabba-Medium.woff2 | Bin 0 -> 21516 bytes .../fonts/Morabba/Morabba-Regular.woff2 | Bin 0 -> 21524 bytes .../fonts/Morabba/Morabba-SemiBold.woff2 | Bin 0 -> 21676 bytes .../fonts/Morabba/Morabba-UltraLight.woff2 | Bin 0 -> 19560 bytes 16 files changed, 128 insertions(+), 48 deletions(-) create mode 100644 frontend/assets/css/fonts/morabba.css create mode 100644 frontend/public/fonts/Morabba/Morabba-Black.woff2 create mode 100644 frontend/public/fonts/Morabba/Morabba-Bold.woff2 create mode 100644 frontend/public/fonts/Morabba/Morabba-ExtraBold.woff2 create mode 100644 frontend/public/fonts/Morabba/Morabba-Heavy.woff2 create mode 100644 frontend/public/fonts/Morabba/Morabba-Light.woff2 create mode 100644 frontend/public/fonts/Morabba/Morabba-Medium.woff2 create mode 100644 frontend/public/fonts/Morabba/Morabba-Regular.woff2 create mode 100644 frontend/public/fonts/Morabba/Morabba-SemiBold.woff2 create mode 100644 frontend/public/fonts/Morabba/Morabba-UltraLight.woff2 diff --git a/frontend/assets/css/fonts/morabba.css b/frontend/assets/css/fonts/morabba.css new file mode 100644 index 0000000..d609e04 --- /dev/null +++ b/frontend/assets/css/fonts/morabba.css @@ -0,0 +1,73 @@ +@layer base { + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/IRANYekanX-UltraLight.woff2"); + font-weight: 200; + font-style: normal; + font-display: swap; + } + + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/Morabba-Light.woff2"); + font-weight: 300; + font-style: normal; + font-display: swap; + } + + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/Morabba-Regular.woff2"); + font-weight: 400; + font-style: normal; + font-display: swap; + } + + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/Morabba-Medium.woff2"); + font-weight: 500; + font-style: normal; + font-display: swap; + } + + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/Morabba-SemiBold.woff2"); + font-weight: 600; + font-style: normal; + font-display: swap; + } + + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/Morabba-Bold.woff2"); + font-weight: 700; + font-style: normal; + font-display: swap; + } + + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/Morabba-ExtraBold.woff2"); + font-weight: 800; + font-style: normal; + font-display: swap; + } + + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/Morabba-Black.woff2"); + font-weight: 900; + font-style: normal; + font-display: swap; + } + + @font-face { + font-family: "Morabba"; + src: url("/fonts/Morabba/Morabba-Heavy.woff2"); + font-weight: 1000; + font-style: normal; + font-display: swap; + } +} \ No newline at end of file diff --git a/frontend/assets/css/tailwind.css b/frontend/assets/css/tailwind.css index 66e087e..ca3b0db 100644 --- a/frontend/assets/css/tailwind.css +++ b/frontend/assets/css/tailwind.css @@ -4,7 +4,8 @@ @import "./typo.utils.css"; @import "./button.comp.css"; @import "./input.comp.css"; -@import "./fonts/iran-yekan-x.css" +@import "./fonts/iran-yekan-x.css"; +@import "./fonts/morabba.css"; @theme { /* COLORS */ @@ -109,6 +110,7 @@ --font-inter: "Inter", sans-serif; --font-dmsans: "DM Sans", sans-serif; --font-iran-yekan-x: "IRANYekanXVF", "sans-serif"; + --font-morabba: "Morabba", "sans-serif"; /* BREAKPOINTS */ --breakpoint-3xl: 1700px; diff --git a/frontend/assets/css/typo.utils.css b/frontend/assets/css/typo.utils.css index a8fa5c7..cc54143 100644 --- a/frontend/assets/css/typo.utils.css +++ b/frontend/assets/css/typo.utils.css @@ -1,96 +1,96 @@ /* TYPO HERO */ @utility typo-hero-1 { - @apply text-[96px] leading-[96px] font-bold ; + @apply text-[96px] leading-[96px] font-semibold font-morabba; } @utility typo-hero-2 { - @apply text-[72px] leading-[72px] font-bold ; + @apply text-[72px] leading-[72px] font-semibold font-morabba; } /* TYPE HEADING */ @utility typo-h-1 { - @apply text-[64px] leading-[72px] font-bold ; + @apply text-[64px] leading-[72px] font-semibold font-morabba; } @utility typo-h-2 { - @apply text-[56px] leading-[64px] font-bold ; + @apply text-[56px] leading-[64px] font-semibold font-morabba; } @utility typo-h-3 { - @apply text-[48px] leading-[56px] font-bold ; + @apply text-[48px] leading-[56px] font-semibold font-morabba; } @utility typo-h-4 { - @apply text-[40px] leading-[52px] font-bold ; + @apply text-[40px] leading-[52px] font-semibold font-morabba; } @utility typo-h-5 { - @apply text-[32px] leading-[40px] font-bold ; + @apply text-[32px] leading-[40px] font-semibold font-morabba; } @utility typo-h-6 { - @apply text-[24px] leading-[32px] font-bold ; + @apply text-[24px] leading-[32px] font-semibold font-morabba; } /* TYPE SUBHEADING */ @utility typo-sub-h-xl { - @apply text-[20px] leading-[24px] font-semibold ; + @apply text-[20px] leading-[24px] font-semibold font-iran-yekan-x; } @utility typo-sub-h-lg { - @apply text-[18px] leading-[24px] font-semibold ; + @apply text-[18px] leading-[24px] font-semibold font-iran-yekan-x; } @utility typo-sub-h-md { - @apply text-[16px] leading-[20px] font-semibold ; + @apply text-[16px] leading-[20px] font-semibold font-iran-yekan-x; } @utility typo-sub-h-sm { - @apply text-[14px] leading-[20px] font-semibold ; + @apply text-[14px] leading-[20px] font-semibold font-iran-yekan-x; } @utility typo-sub-h-xs { - @apply text-[12px] leading-[16px] font-semibold ; + @apply text-[12px] leading-[16px] font-semibold font-iran-yekan-x; } /* TYPE PARAGRAPH */ @utility typo-p-2xl { - @apply text-[24px] leading-[40px] font-light ; + @apply text-[24px] leading-[40px] font-light font-iran-yekan-x; } @utility typo-p-xl { - @apply text-[20px] leading-[32px] font-light ; + @apply text-[20px] leading-[32px] font-light font-iran-yekan-x; } @utility typo-p-lg { - @apply text-[18px] leading-[32px] font-light ; + @apply text-[18px] leading-[32px] font-light font-iran-yekan-x; } @utility typo-p-md { - @apply text-[16px] leading-[28px] font-light ; + @apply text-[16px] leading-[28px] font-light font-iran-yekan-x; } @utility typo-p-sm { - @apply text-[14px] leading-[24px] font-light ; + @apply text-[14px] leading-[24px] font-light font-iran-yekan-x; } @utility typo-p-xs { - @apply text-[12px] leading-[16px] font-light ; + @apply text-[12px] leading-[16px] font-light font-iran-yekan-x; } /* TYPO LABEL */ @utility typo-label-lg { - @apply text-[18px] leading-[24px] font-medium ; + @apply text-[18px] leading-[24px] font-medium font-iran-yekan-x; } @utility typo-label-md { - @apply text-[16px] leading-[24px] font-medium ; + @apply text-[16px] leading-[24px] font-medium font-iran-yekan-x; } @utility typo-label-sm { - @apply text-[14px] leading-[20px] font-medium ; + @apply text-[14px] leading-[20px] font-medium font-iran-yekan-x; } @utility typo-label-xs { - @apply text-[12px] leading-[16px] font-medium ; + @apply text-[12px] leading-[16px] font-medium font-iran-yekan-x; } \ No newline at end of file diff --git a/frontend/components/global/product-detail/Rating.vue b/frontend/components/global/product-detail/Rating.vue index 76ae042..ac204dd 100644 --- a/frontend/components/global/product-detail/Rating.vue +++ b/frontend/components/global/product-detail/Rating.vue @@ -4,9 +4,6 @@ \ No newline at end of file diff --git a/frontend/components/global/product-detail/RemainQuantity.vue b/frontend/components/global/product-detail/RemainQuantity.vue index 243a894..63318be 100644 --- a/frontend/components/global/product-detail/RemainQuantity.vue +++ b/frontend/components/global/product-detail/RemainQuantity.vue @@ -3,6 +3,7 @@ // types type Props = { + maxQuantity: number; quantity: number; } @@ -13,16 +14,19 @@ defineProps(); \ No newline at end of file diff --git a/frontend/components/product/ProductView.vue b/frontend/components/product/ProductView.vue index 9aa13ab..4509295 100644 --- a/frontend/components/product/ProductView.vue +++ b/frontend/components/product/ProductView.vue @@ -8,48 +8,49 @@ const maxQuantity = ref(10); \ No newline at end of file diff --git a/frontend/layouts/Default.vue b/frontend/layouts/Default.vue index cc6c41b..e63fd0d 100644 --- a/frontend/layouts/Default.vue +++ b/frontend/layouts/Default.vue @@ -11,7 +11,7 @@