Add yekan bakh font
This commit is contained in:
@@ -0,0 +1,41 @@
|
||||
@layer base {
|
||||
@font-face {
|
||||
font-family: "YekanBakh";
|
||||
src: url("/fonts/YekanBakh/YekanBakh-Thin.woff");
|
||||
font-weight: 100;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "YekanBakh";
|
||||
src: url("/fonts/YekanBakh/YekanBakh-Light.woff");
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "YekanBakh";
|
||||
src: url("/fonts/YekanBakh/YekanBakh-Regular.woff");
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "YekanBakh";
|
||||
src: url("/fonts/YekanBakh/YekanBakh-SemiBold.woff");
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "YekanBakh";
|
||||
src: url("/fonts/YekanBakh/YekanBakh-Bold.woff");
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
}
|
||||
@@ -1,7 +1,7 @@
|
||||
@utility persian-number {
|
||||
-moz-font-feature-settings: "ss02";
|
||||
-webkit-font-feature-settings: "ss02";
|
||||
font-feature-settings: "ss02";
|
||||
-moz-font-feature-settings: "ss07";
|
||||
-webkit-font-feature-settings: "ss07";
|
||||
font-feature-settings: "ss07";
|
||||
}
|
||||
|
||||
@utility text-gradient {
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
@import "./input.comp.css";
|
||||
@import "./fonts/iran-yekan-x.css";
|
||||
@import "./fonts/morabba.css";
|
||||
@import "./fonts/yekan-bakh.css";
|
||||
|
||||
@theme {
|
||||
/* COLORS */
|
||||
@@ -110,6 +111,7 @@
|
||||
--font-inter: "Inter", sans-serif;
|
||||
--font-dmsans: "DM Sans", sans-serif;
|
||||
--font-iran-yekan-x: "IRANYekanXVF", "sans-serif";
|
||||
--font-yekan-bakh: "YekanBakh", "sans-serif";
|
||||
--font-morabba: "Morabba", "sans-serif";
|
||||
|
||||
/* BREAKPOINTS */
|
||||
@@ -131,6 +133,7 @@
|
||||
/* CONTAINER */
|
||||
|
||||
@utility container {
|
||||
@apply mx-auto;
|
||||
padding-inline: 3rem;
|
||||
@screen xl {
|
||||
padding-inline: 5rem;
|
||||
|
||||
@@ -1,96 +1,96 @@
|
||||
/* TYPO HERO */
|
||||
@utility typo-hero-1 {
|
||||
@apply text-[96px] leading-[96px] font-semibold font-morabba;
|
||||
@apply text-[96px] leading-[96px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-hero-2 {
|
||||
@apply text-[72px] leading-[72px] font-semibold font-morabba;
|
||||
@apply text-[72px] leading-[72px] font-semibold ;
|
||||
}
|
||||
|
||||
/* TYPE HEADING */
|
||||
@utility typo-h-1 {
|
||||
@apply text-[64px] leading-[72px] font-semibold font-morabba;
|
||||
@apply text-[64px] leading-[72px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-h-2 {
|
||||
@apply text-[56px] leading-[64px] font-semibold font-morabba;
|
||||
@apply text-[56px] leading-[64px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-h-3 {
|
||||
@apply text-[48px] leading-[56px] font-semibold font-morabba;
|
||||
@apply text-[48px] leading-[56px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-h-4 {
|
||||
@apply text-[40px] leading-[52px] font-semibold font-morabba;
|
||||
@apply text-[40px] leading-[52px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-h-5 {
|
||||
@apply text-[32px] leading-[40px] font-semibold font-morabba;
|
||||
@apply text-[32px] leading-[40px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-h-6 {
|
||||
@apply text-[24px] leading-[32px] font-semibold font-morabba;
|
||||
@apply text-[24px] leading-[32px] font-semibold ;
|
||||
}
|
||||
|
||||
/* TYPE SUBHEADING */
|
||||
@utility typo-sub-h-xl {
|
||||
@apply text-[20px] leading-[24px] font-semibold font-iran-yekan-x;
|
||||
@apply text-[20px] leading-[24px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-sub-h-lg {
|
||||
@apply text-[18px] leading-[24px] font-semibold font-iran-yekan-x;
|
||||
@apply text-[18px] leading-[24px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-sub-h-md {
|
||||
@apply text-[16px] leading-[20px] font-semibold font-iran-yekan-x;
|
||||
@apply text-[16px] leading-[20px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-sub-h-sm {
|
||||
@apply text-[14px] leading-[20px] font-semibold font-iran-yekan-x;
|
||||
@apply text-[14px] leading-[20px] font-semibold ;
|
||||
}
|
||||
|
||||
@utility typo-sub-h-xs {
|
||||
@apply text-[12px] leading-[16px] font-semibold font-iran-yekan-x;
|
||||
@apply text-[12px] leading-[16px] font-semibold ;
|
||||
}
|
||||
|
||||
/* TYPE PARAGRAPH */
|
||||
@utility typo-p-2xl {
|
||||
@apply text-[24px] leading-[40px] font-light font-iran-yekan-x;
|
||||
@apply text-[24px] leading-[40px] font-light ;
|
||||
}
|
||||
|
||||
@utility typo-p-xl {
|
||||
@apply text-[20px] leading-[32px] font-light font-iran-yekan-x;
|
||||
@apply text-[20px] leading-[32px] font-light ;
|
||||
}
|
||||
|
||||
@utility typo-p-lg {
|
||||
@apply text-[18px] leading-[32px] font-light font-iran-yekan-x;
|
||||
@apply text-[18px] leading-[32px] font-light ;
|
||||
}
|
||||
|
||||
@utility typo-p-md {
|
||||
@apply text-[16px] leading-[28px] font-light font-iran-yekan-x;
|
||||
@apply text-[16px] leading-[28px] font-light ;
|
||||
}
|
||||
|
||||
@utility typo-p-sm {
|
||||
@apply text-[14px] leading-[24px] font-light font-iran-yekan-x;
|
||||
@apply text-[14px] leading-[24px] font-light ;
|
||||
}
|
||||
|
||||
@utility typo-p-xs {
|
||||
@apply text-[12px] leading-[16px] font-light font-iran-yekan-x;
|
||||
@apply text-[12px] leading-[16px] font-light ;
|
||||
}
|
||||
|
||||
/* TYPO LABEL */
|
||||
@utility typo-label-lg {
|
||||
@apply text-[18px] leading-[24px] font-medium font-iran-yekan-x;
|
||||
@apply text-[18px] leading-[24px] font-medium ;
|
||||
}
|
||||
|
||||
@utility typo-label-md {
|
||||
@apply text-[16px] leading-[24px] font-medium font-iran-yekan-x;
|
||||
@apply text-[16px] leading-[24px] font-medium ;
|
||||
}
|
||||
|
||||
@utility typo-label-sm {
|
||||
@apply text-[14px] leading-[20px] font-medium font-iran-yekan-x;
|
||||
@apply text-[14px] leading-[20px] font-medium ;
|
||||
}
|
||||
|
||||
@utility typo-label-xs {
|
||||
@apply text-[12px] leading-[16px] font-medium font-iran-yekan-x;
|
||||
@apply text-[12px] leading-[16px] font-medium ;
|
||||
}
|
||||
Reference in New Issue
Block a user