1 звезда на GitHub = 1 новый компонент.

Поставить звезду
Типографика typographyluxuryheaders

Cinematic Typography

Заголовок в верхнем регистре с широким трекингом (разрядкой букв) в стиле премиум.

Живое превью

Cinematic Typography

Использование

Скопируйте и вставьте этот код на вашу страницу Astro:

astro
---
import { CinematicTypography } from 'astro-component-kit';
---

<LetterSpacingWide>Content</LetterSpacingWide>
--- import { CinematicTypography } from 'astro-component-kit'; --- <LetterSpacingWide>Content</LetterSpacingWide>

Ручная установка

Если вы не используете пакет npm, создайте файл и вставьте следующий код: src/components/lib/CinematicTypography.astro:

astro
---
---
<div class="cinema-txt"><slot /></div>
<style>
  .cinema-txt { color: #fff; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.8em; text-transform: uppercase; text-align: center; line-height: 1.5; }
</style>
--- --- <div class="cinema-txt"><slot /></div> <style> .cinema-txt { color: #fff; font-size: 0.8rem; font-weight: 600; letter-spacing: 0.8em; text-transform: uppercase; text-align: center; line-height: 1.5; } </style>

Краткая информация

Категория
Типографика
Имя файла
CinematicTypography.astro
Зависимости
Нет — чистый Astro + CSS
Теги
typographyluxuryheaders