S.Gromov
d69fca16fe
- Добавлен лендинг на React + Vite с темой и карточками навигации - Добавлен модуль темы (src/infra/theme) с поддержкой system/light/dark - Документация переписана: разделы «Модули», «Сегменты», «Компонент» - Добавлена страница навигации docs/index.md - Генерация llms.txt переведена на парсинг сайдбара VitePress - Описания для llms.txt вынесены в frontmatter (поле description) - Удалена директория generated/, архив ZIP убран с лендинга - Удалены английская документация, README_RU, concat-md.js - Добавлен vite-плагин для UTF-8 заголовков текстовых артефактов - Caddyfile обновлён: charset=utf-8 для llms.txt и ARCHITECTURE.md
67 lines
2.8 KiB
TypeScript
67 lines
2.8 KiB
TypeScript
import { ThemeToggle } from '../../infra/theme'
|
||
import { homeCards, repositoryUrl } from './config/home-screen.config'
|
||
import styles from './styles/home-screen.module.css'
|
||
|
||
const version = __BUILD_VERSION__ as string
|
||
|
||
export function HomeScreen() {
|
||
return (
|
||
<main className={styles.page}>
|
||
<section className={styles.hero}>
|
||
<h1 className={styles.title}>SLM Design</h1>
|
||
<p className={styles.lead}>
|
||
Scoped Layered Module Design — соглашения по архитектуре frontend-приложений:
|
||
слои, модули, сегменты, публичные API и направление зависимостей.
|
||
</p>
|
||
|
||
<div className={styles.controls}>
|
||
<a className={styles.repoLink} href={repositoryUrl} target="_blank" rel="noopener noreferrer">
|
||
<svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
|
||
<path d="M12 .3a12 12 0 0 0-3.8 23.38c.6.12.83-.26.83-.57L9 21.07c-3.34.72-4.04-1.61-4.04-1.61-.55-1.39-1.34-1.76-1.34-1.76-1.08-.74.09-.73.09-.73 1.2.09 1.83 1.24 1.83 1.24 1.08 1.83 2.81 1.3 3.5 1 .1-.78.42-1.31.76-1.61-2.67-.3-5.47-1.33-5.47-5.93 0-1.31.47-2.38 1.24-3.22-.14-.3-.54-1.52.1-3.18 0 0 1-.32 3.3 1.23a11.5 11.5 0 0 1 6 0c2.28-1.55 3.29-1.23 3.29-1.23.64 1.66.24 2.88.12 3.18a4.65 4.65 0 0 1 1.23 3.22c0 4.61-2.8 5.63-5.48 5.92.42.36.81 1.1.81 2.22l-.01 3.29c0 .31.2.69.82.57A12 12 0 0 0 12 .3Z" />
|
||
</svg>
|
||
<span>Репозиторий</span>
|
||
</a>
|
||
<ThemeToggle className={styles.themeToggle} />
|
||
</div>
|
||
</section>
|
||
|
||
<section className={styles.cards} aria-label="Быстрые переходы">
|
||
{homeCards.map((card) => {
|
||
if ('href' in card) {
|
||
return (
|
||
<a
|
||
className={`${styles.card} ${styles.cardLink}`}
|
||
href={card.href}
|
||
download={'download' in card ? card.download : undefined}
|
||
key={card.title}
|
||
>
|
||
<h2>{card.title}</h2>
|
||
<p>{card.description}</p>
|
||
<span className={styles.cardCta}>{card.cta}</span>
|
||
</a>
|
||
)
|
||
}
|
||
|
||
return (
|
||
<article className={styles.card} key={card.title}>
|
||
<h2>{card.title}</h2>
|
||
<p>{card.description}</p>
|
||
<div className={styles.cardActions}>
|
||
{card.actions.map((action) => (
|
||
<a className={styles.cardAction} href={action.href} key={action.href}>
|
||
{action.label}
|
||
</a>
|
||
))}
|
||
</div>
|
||
</article>
|
||
)
|
||
})}
|
||
</section>
|
||
|
||
<footer className={styles.footer}>
|
||
<span>{version}</span>
|
||
</footer>
|
||
</main>
|
||
)
|
||
}
|