style: polish Persian RTL layout and typography

This commit is contained in:
2026-09-08 19:21:52 +03:30
parent 3af34dbd92
commit 273f92a3c3
13 changed files with 237 additions and 27 deletions

View File

@@ -25,6 +25,14 @@ html[data-theme="dark"] {
color-scheme: dark;
}
@font-face {
font-family: 'Peyda';
src: url('/fonts/PeydaWeb-Black.woff2') format('woff2');
font-style: normal;
font-weight: 900;
font-display: swap;
}
html[data-site-loading='true'] {
overflow: hidden;
}
@@ -42,6 +50,16 @@ body {
transition: background-color 0.25s ease, color 0.25s ease;
}
html[dir='rtl'] body {
text-align: right;
}
.ltr-token {
direction: ltr;
unicode-bidi: isolate;
font-family: 'IRANYekanXVF', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
/* Master 1440px Fixed Canvas */
.desktop-canvas {
width: 100%;
@@ -126,6 +144,20 @@ body {
transform-origin: left center;
}
html[dir='rtl'] .section-header {
align-items: flex-start;
text-align: right;
}
html[dir='rtl'] .section-eyebrow,
html[dir='rtl'] .section-title {
letter-spacing: 0;
}
html[dir='rtl'] .section-underline {
transform-origin: right center;
}
/* One-time viewport reveals. Content remains visible when JavaScript is unavailable. */
html[data-motion-ready='true'] [data-reveal] {
opacity: 0;
@@ -170,12 +202,22 @@ html[data-motion-ready='true'] [data-visible='true'] .section-underline {
}
}
/* Pacifico Display Font Class */
/* Keep the original Latin display face and use Peyda for Persian text. */
.font-display {
font-family: 'Pacifico', cursive;
font-weight: 400;
}
html[lang='fa'] .font-display {
font-family: 'Peyda', 'IRANYekanXVF', sans-serif;
font-weight: 900;
}
html[lang='fa'] .section-title {
font-family: 'Peyda', 'IRANYekanXVF', sans-serif;
font-weight: 900;
}
/* Pill Button */
.pill-btn {
display: inline-flex;
@@ -188,6 +230,7 @@ html[data-motion-ready='true'] [data-visible='true'] .section-underline {
font-size: var(--font-size-button);
line-height: var(--line-height-button);
font-weight: 600;
font-family: 'IRANYekanXVF', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
cursor: pointer;
text-decoration: none;
transition: