Ku6epXBOCTuK/lopata
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: update design

Browse Source
This commit is contained in:
Ku6epXBOCTuK
2026-06-11 12:48:42 +05:00
parent fad4d81c52
commit 3a8c9fe47a
9 changed files with 269 additions and 329 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/layouts/doc.astro
+34 -30
View File
@@ -1,16 +1,16 @@
---
import BaseLayout from './base.astro'
import SiteHeader from '../components/SiteHeader.astro'
import SiteFooter from '../components/SiteFooter.astro'
import Perforation from '../components/Perforation.astro'
import Perforation from "../components/Perforation.astro";
import SiteFooter from "../components/SiteFooter.astro";
import SiteHeader from "../components/SiteHeader.astro";
import BaseLayout from "./base.astro";
interface Props {
title: string
description?: string
code?: string
title: string;
description?: string;
code?: string;
}
const { title, description, code } = Astro.props as Props
const { title, description, code } = Astro.props as Props;
---
<BaseLayout title={`${title} // Архив ДНТ-7`} description={description}>
@@ -18,9 +18,11 @@ const { title, description, code } = Astro.props as Props
<SiteHeader />
<div class="banner-classified border-y border-foreground/30">
<div class="mx-auto flex max-w-4xl items-center justify-between gap-4 px-4 py-1.5 text-[0.65rem] font-700 uppercase tracking-[0.2em] sm:px-6">
<div
class="mx-auto flex max-w-4xl items-center justify-between gap-4 px-4 py-1.5 text-[0.65rem] font-700 uppercase tracking-[0.2em] sm:px-6"
>
<span>Для служебного пользования</span>
<span class="hidden sm:inline">{code || 'МДС'}</span>
<span class="hidden sm:inline">{code || "МДС"}</span>
<span>Экз. № 1</span>
</div>
</div>
@@ -34,7 +36,7 @@ const { title, description, code } = Astro.props as Props
</a>
<article class="paper relative mt-4 -rotate-[0.3deg] p-6 sm:p-10">
<span class="tape -top-3 left-1/2 hidden -translate-x-1/2 rotate-1 sm:block" aria-hidden="true" />
<span class="tape -top-3 left-1/2 hidden -translate-x-1/2 rotate-1 sm:block" aria-hidden="true"></span>
<div class="pointer-events-none absolute right-4 top-4 sm:right-8 sm:top-10">
<img
@@ -47,7 +49,9 @@ const { title, description, code } = Astro.props as Props
</div>
<header class="pb-5">
<h1 class="max-w-2xl text-balance font-heading text-3xl font-700 uppercase leading-[0.95] tracking-tight sm:text-5xl">
<h1
class="max-w-2xl text-balance font-heading text-3xl font-700 uppercase leading-[0.95] tracking-tight sm:text-5xl"
>
{title}
</h1>
<hr class="rule rule-red mt-5" />
@@ -69,8 +73,8 @@ const { title, description, code } = Astro.props as Props
<style>
.doc-content {
font-size: 0.875rem;
line-height: 1.625;
font-size: 0.9375rem;
line-height: 1.75;
color: oklch(0.28 0.03 52 / 0.9);
}
.doc-content h2 {
@@ -78,19 +82,19 @@ const { title, description, code } = Astro.props as Props
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.05em;
font-size: 1.125rem;
margin-top: 2.5rem;
margin-bottom: 1rem;
padding-bottom: 0.25rem;
font-size: 1.25rem;
margin-top: 3rem;
margin-bottom: 1.25rem;
padding-bottom: 0.35rem;
border-bottom: 1px solid oklch(0.45 0.04 56 / 0.3);
}
.doc-content h3 {
font-family: var(--font-heading);
font-weight: 600;
text-transform: uppercase;
font-size: 0.9375rem;
margin-top: 1.5rem;
margin-bottom: 0.75rem;
font-size: 1rem;
margin-top: 2rem;
margin-bottom: 1rem;
color: var(--primary);
}
.doc-content h2:first-child {
@@ -101,7 +105,7 @@ const { title, description, code } = Astro.props as Props
margin-top: 0;
}
.doc-content p {
margin-bottom: 0.75rem;
margin-bottom: 1.25rem;
}
.doc-content strong {
font-weight: 700;
@@ -109,8 +113,8 @@ const { title, description, code } = Astro.props as Props
}
.doc-content ol,
.doc-content ul {
margin-left: 1.25rem;
margin-bottom: 0.75rem;
margin-left: 1.5rem;
margin-bottom: 1.25rem;
}
.doc-content ol {
list-style: decimal;
@@ -119,7 +123,7 @@ const { title, description, code } = Astro.props as Props
list-style: disc;
}
.doc-content li {
margin-bottom: 0.35rem;
margin-bottom: 0.5rem;
}
.doc-content ol ::marker,
.doc-content ul ::marker {
@@ -130,18 +134,18 @@ const { title, description, code } = Astro.props as Props
border: 0;
border-top: 1px solid oklch(0.45 0.04 56 / 0.5);
box-shadow: 0 3px 0 -2px oklch(0.45 0.04 56 / 0.5);
margin: 1.5rem 0;
margin: 2.5rem 0;
}
.doc-content table {
width: 100%;
border-collapse: collapse;
margin-bottom: 1rem;
font-size: 0.8125rem;
margin-bottom: 1.25rem;
font-size: 0.875rem;
}
.doc-content th,
.doc-content td {
border: 1px solid oklch(0.5 0.04 56 / 0.35);
padding: 0.5rem 0.75rem;
padding: 0.625rem 0.875rem;
text-align: left;
vertical-align: top;
}
@@ -149,7 +153,7 @@ const { title, description, code } = Astro.props as Props
font-family: var(--font-heading);
font-weight: 600;
text-transform: uppercase;
font-size: 0.7rem;
font-size: 0.75rem;
letter-spacing: 0.05em;
background: oklch(0.5 0.04 56 / 0.08);
}