Add morabba font

Chnage ui to rtl
This commit is contained in:
marzban-dev
2024-12-14 19:36:00 +03:30
parent ddd30e65a1
commit 6edcc9c19a
16 changed files with 128 additions and 48 deletions
+73
View File
@@ -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;
}
}
+3 -1
View File
@@ -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;
+23 -23
View File
@@ -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;
}