diff --git a/index.html b/index.html index 977c2ee..4c404b6 100644 --- a/index.html +++ b/index.html @@ -13,7 +13,7 @@ - +
diff --git a/src/assets/font/woff2/DanaFaNum-Bold.woff2 b/src/assets/font/woff2/DanaFaNum-Bold.woff2 new file mode 100644 index 0000000..d31799e Binary files /dev/null and b/src/assets/font/woff2/DanaFaNum-Bold.woff2 differ diff --git a/src/assets/font/woff2/DanaFaNum-Medium.woff2 b/src/assets/font/woff2/DanaFaNum-Medium.woff2 new file mode 100644 index 0000000..15fe1e5 Binary files /dev/null and b/src/assets/font/woff2/DanaFaNum-Medium.woff2 differ diff --git a/src/assets/font/woff2/DanaFaNum-Regular.woff2 b/src/assets/font/woff2/DanaFaNum-Regular.woff2 new file mode 100644 index 0000000..36ae4a3 Binary files /dev/null and b/src/assets/font/woff2/DanaFaNum-Regular.woff2 differ diff --git a/src/style/input.css b/src/style/input.css index e20858a..bd16bc4 100644 --- a/src/style/input.css +++ b/src/style/input.css @@ -4,9 +4,30 @@ @layer base { + @font-face { + font-family: "dana regular"; + font-weight: 100; + src: url("../assets/font/woff2/DanaFaNum-Regular.woff2") format("woff2"); + font-display: swap; + } + + @font-face { + font-family: "dana medium"; + font-weight: 500; + src: url("../assets/font/woff2/DanaFaNum-Medium.woff2") format("woff2"); + font-display: swap; + } + + @font-face { + font-family: "dana bold"; + font-weight: 700; + src: url("../assets/font/woff2/DanaFaNum-Bold.woff2") format("woff2"); + font-display: swap; + } + * { - font-family: 'Vazirmatn', sans-serif; - font-weight: 400; + @apply font-dana-m; + font-weight: 500; box-sizing: border-box; } diff --git a/src/style/output.css b/src/style/output.css index 81554c4..e1275a5 100644 --- a/src/style/output.css +++ b/src/style/output.css @@ -554,9 +554,39 @@ video { display: none; } +@font-face { + font-family: "dana regular"; + + font-weight: 100; + + src: url("../assets/font/woff2/DanaFaNum-Regular.woff2") format("woff2"); + + font-display: swap; +} + +@font-face { + font-family: "dana medium"; + + font-weight: 500; + + src: url("../assets/font/woff2/DanaFaNum-Medium.woff2") format("woff2"); + + font-display: swap; +} + +@font-face { + font-family: "dana bold"; + + font-weight: 700; + + src: url("../assets/font/woff2/DanaFaNum-Bold.woff2") format("woff2"); + + font-display: swap; +} + * { - font-family: 'Vazirmatn', sans-serif; - font-weight: 400; + font-family: dana medium; + font-weight: 500; box-sizing: border-box; } @@ -684,6 +714,10 @@ input[type="search"]:focus { margin-top: 0.5rem; } +.mt-3 { + margin-top: 0.75rem; +} + .mt-4 { margin-top: 1rem; } @@ -692,10 +726,6 @@ input[type="search"]:focus { margin-top: 2.25rem; } -.mt-3 { - margin-top: 0.75rem; -} - .line-clamp-1 { overflow: hidden; display: -webkit-box; @@ -1004,10 +1034,6 @@ input[type="search"]:focus { gap: 2.25rem; } -.gap-0 { - gap: 0px; -} - .overflow-hidden { overflow: hidden; } @@ -1040,10 +1066,6 @@ input[type="search"]:focus { border-radius: 9999px; } -.rounded { - border-radius: 0.25rem; -} - .rounded-b-\[30px\] { border-bottom-right-radius: 30px; border-bottom-left-radius: 30px; @@ -1096,11 +1118,6 @@ input[type="search"]:focus { border-color: rgb(209 213 219 / var(--tw-border-opacity)); } -.border-gray-500 { - --tw-border-opacity: 1; - border-color: rgb(107 114 128 / var(--tw-border-opacity)); -} - .border-gray-400 { --tw-border-opacity: 1; border-color: rgb(156 163 175 / var(--tw-border-opacity)); @@ -1174,10 +1191,6 @@ input[type="search"]:focus { padding: 1.25rem; } -.p-\[2px\] { - padding: 2px; -} - .px-14 { padding-left: 3.5rem; padding-right: 3.5rem; @@ -1223,6 +1236,11 @@ input[type="search"]:focus { padding-bottom: 0.25rem; } +.py-2 { + padding-top: 0.5rem; + padding-bottom: 0.5rem; +} + .py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; @@ -1258,26 +1276,6 @@ input[type="search"]:focus { padding-bottom: 5px; } -.py-5 { - padding-top: 1.25rem; - padding-bottom: 1.25rem; -} - -.px-7 { - padding-left: 1.75rem; - padding-right: 1.75rem; -} - -.py-4 { - padding-top: 1rem; - padding-bottom: 1rem; -} - -.py-2 { - padding-top: 0.5rem; - padding-bottom: 0.5rem; -} - .pb-2 { padding-bottom: 0.5rem; } @@ -1290,6 +1288,10 @@ input[type="search"]:focus { padding-bottom: 2px; } +.pb-\[3px\] { + padding-bottom: 3px; +} + .pl-11 { padding-left: 2.75rem; } @@ -1330,10 +1332,6 @@ input[type="search"]:focus { padding-top: 2px; } -.pb-\[3px\] { - padding-bottom: 3px; -} - .text-left { text-align: left; } @@ -1346,6 +1344,10 @@ input[type="search"]:focus { text-align: justify; } +.font-dana-m { + font-family: dana medium; +} + .text-2xl { font-size: 1.5rem; line-height: 2rem; @@ -1395,6 +1397,11 @@ input[type="search"]:focus { color: rgb(0 0 0 / var(--tw-text-opacity)); } +.text-gray-400 { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); +} + .text-gray-500 { --tw-text-opacity: 1; color: rgb(107 114 128 / var(--tw-text-opacity)); @@ -1409,16 +1416,6 @@ input[type="search"]:focus { color: rgb(255 255 255 / var(--tw-text-opacity)); } -.text-gray-400 { - --tw-text-opacity: 1; - color: rgb(156 163 175 / var(--tw-text-opacity)); -} - -.text-gray-300 { - --tw-text-opacity: 1; - color: rgb(209 213 219 / var(--tw-text-opacity)); -} - .shadow { --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1); --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color); diff --git a/tailwind.config.js b/tailwind.config.js index 3131782..deb1364 100644 --- a/tailwind.config.js +++ b/tailwind.config.js @@ -9,7 +9,12 @@ export default { colors: { Dark_orange: "#f87f06", Light_orange: "#fba105" - } + }, + fontFamily: { + "dana-r": ["dana regular"], /*400*/ + "dana-m": ["dana medium"], /*500*/ + "dana-b": ["dana bold"], /*600*/ + }, }, }, plugins: [],