442 lines
48 KiB
HTML
442 lines
48 KiB
HTML
<!DOCTYPE html>
|
||
|
||
<html class="dark" lang="ru"><head><meta charset="utf-8"/><meta content="width=device-width, initial-scale=1.0" name="viewport"/><link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" rel="stylesheet"/><link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Inter:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap" rel="stylesheet"/>
|
||
<link href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap" rel="stylesheet"/><style>@layer base{html,body{margin:0;padding:0;}body{overscroll-behavior:none;}main>:first-child{margin-top:0!important;}main>:last-child{margin-bottom:0!important;}}::-webkit-scrollbar{display:none;}</style><script src="https://cdn.tailwindcss.com"></script><script id="tailwind-config">tailwind.config = { darkMode: 'class', theme: { extend: { 'colors': { 'surface-container-highest': '#2d3449', 'on-surface': '#dae2fd', 'surface-tint': '#7bd0ff', 'on-primary-container': '#004965', 'on-secondary-container': '#b0b2ff', 'surface-container': '#171f33', 'on-primary': '#00354a', 'secondary': '#c0c1ff', 'error': '#ffb4ab', 'on-primary-fixed': '#001e2c', 'surface-container-low': '#131b2e', 'surface-container-high': '#222a3d', 'on-error-container': '#ffdad6', 'inverse-on-surface': '#283044', 'secondary-container': '#3131c0', 'on-background': '#dae2fd', 'secondary-fixed-dim': '#c0c1ff', 'on-secondary-fixed': '#07006c', 'inverse-primary': '#00668a', 'primary-fixed-dim': '#7bd0ff', 'background': '#0b1326', 'surface-bright': '#31394d', 'surface': '#0b1326', 'error-container': '#93000a', 'on-tertiary': '#003824', 'tertiary-fixed-dim': '#4edea3', 'on-tertiary-fixed-variant': '#005236', 'outline': '#87929a', 'outline-variant': '#3e484f', 'surface-dim': '#0b1326', 'primary': '#8ed5ff', 'tertiary': '#56e5a9', 'primary-fixed': '#c4e7ff', 'on-error': '#690005', 'on-surface-variant': '#bdc8d1', 'on-secondary': '#1000a9', 'secondary-fixed': '#e1e0ff', 'surface-container-lowest': '#060e20', 'surface-variant': '#2d3449', 'tertiary-container': '#30c88f', 'tertiary-fixed': '#6ffbbe', 'on-tertiary-fixed': '#002113', 'on-tertiary-container': '#004e34', 'on-secondary-fixed-variant': '#2f2ebe', 'inverse-surface': '#dae2fd', 'primary-container': '#38bdf8', 'on-primary-fixed-variant': '#004c69' }, 'borderRadius': { 'DEFAULT': '0.125rem', 'lg': '0.25rem', 'xl': '0.5rem', 'full': '0.75rem' }, 'spacing': { 'sidebar-default-width': '18rem', 'status-bar-height': '1.625rem', 'gutter-sm': '0.5rem', 'gutter-xs': '0.25rem', 'panel-padding-compact': '0.375rem', 'window-bar-height': '2.25rem', 'gutter-lg': '1rem', 'page-canvas-padding': '2rem', 'gutter-md': '0.75rem', 'sidebar-max-width': '26rem', 'panel-padding-default': '0.75rem', 'sidebar-min-width': '15rem' }, 'fontFamily': { 'code-gutter': ['JetBrains Mono'], 'code-editor': ['JetBrains Mono'], 'headline-sm': ['Space Grotesk'], 'status-indicator': ['JetBrains Mono'], 'headline-md': ['Space Grotesk'], 'body-lg': ['Inter'], 'body-md': ['Inter'], 'label-sm': ['JetBrains Mono'], 'body-sm': ['Inter'], 'label-md': ['JetBrains Mono'], 'headline-lg': ['Space Grotesk'] }, 'fontSize': { 'code-gutter': ['11px', { 'lineHeight': '22px', 'fontWeight': '400' }], 'code-editor': ['13px', { 'lineHeight': '22px', 'fontWeight': '400' }], 'headline-sm': ['13px', { 'lineHeight': '18px', 'fontWeight': '500' }], 'status-indicator': ['10px', { 'lineHeight': '12px', 'fontWeight': '600' }], 'headline-md': ['15px', { 'lineHeight': '20px', 'letterSpacing': '-0.005em', 'fontWeight': '600' }], 'body-lg': ['13px', { 'lineHeight': '20px', 'fontWeight': '400' }], 'body-md': ['12px', { 'lineHeight': '18px', 'fontWeight': '400' }], 'label-sm': ['10px', { 'lineHeight': '12px', 'letterSpacing': '0.03em', 'fontWeight': '500' }], 'body-sm': ['11px', { 'lineHeight': '16px', 'fontWeight': '400' }], 'label-md': ['11px', { 'lineHeight': '14px', 'letterSpacing': '0.02em', 'fontWeight': '500' }], 'headline-lg': ['18px', { 'lineHeight': '24px', 'letterSpacing': '-0.01em', 'fontWeight': '600' }] } } } };</script></head><body class="bg-surface text-on-surface select-none"><header class="fixed top-0 left-0 right-0 z-50 flex flex-col bg-surface-container-low shadow-[0_1px_8px_rgba(0,0,0,0.5)]"><div class="h-9 px-gutter-md flex items-center justify-between bg-surface-container-lowest"><div class="flex items-center gap-gutter-md"><div class="flex items-center gap-1.5"><div class="w-3 h-3 rounded-full bg-error cursor-pointer"></div><div class="w-3 h-3 rounded-full bg-tertiary-container cursor-pointer"></div><div class="w-3 h-3 rounded-full bg-primary cursor-pointer"></div></div><div class="flex items-center gap-gutter-xs"><img alt="GhostEditor Logo" class="h-8 w-auto object-contain" src="https://lh3.googleusercontent.com/aida-public/AB6AXuAFWH4iJvY-GFVxVrq3UGpNJ319wquVI3fSNvr8nAQMrkO02fuQNQxzf2tRN73t_vf5qB52i2RpbL7nJH6I8v6YEstU9iXctqDA9ZwyvfYOaY0IVtyWM_SsLQuJ2xPMVSo5ytDgBr0ioZfsiHclEZ3h6OyVPPeQNyIJ-xxZGMx0hwbiX7oJyUiOwJqt2opyf9k1lJoQKM9Vn4yyHvko4yuKF7FkzcZUVqcOU9zaQ4yAGE69fG8RA3sYsA"/><span class="font-headline-sm text-headline-sm text-on-surface font-semibold tracking-tight">GhostEditor</span></div><span class="font-label-sm text-label-sm text-on-surface-variant font-code-editor">coursework_report.md</span><span class="px-1.5 py-0.5 rounded bg-surface-container-high text-tertiary font-label-sm text-label-sm">[Saved]</span><span class="px-2 py-0.5 rounded bg-surface-container text-primary font-label-sm text-label-sm">[Курсовая работа (МИРЭА)]</span></div><div class="flex items-center gap-gutter-sm bg-surface-container px-2.5 py-1 rounded"><span class="material-symbols-outlined text-primary text-[14px]">terminal</span><span class="font-label-sm text-label-sm text-on-surface-variant font-code-editor">reports / mirea / coursework_report.md</span><span class="material-symbols-outlined text-on-surface-variant text-[14px] cursor-pointer">unfold_more</span></div><div class="flex items-center gap-gutter-sm"><div class="flex items-center bg-surface-container-high p-0.5 rounded"><button class="px-2 py-0.5 rounded font-label-sm text-label-sm text-on-surface-variant hover:text-on-surface hover:bg-surface-variant transition-colors" title="Editor Only"><span class="material-symbols-outlined text-[14px] align-middle">code</span></button><button class="px-2 py-0.5 rounded font-label-sm text-label-sm bg-primary-container text-on-primary-container" title="Split 50/50"><span class="material-symbols-outlined text-[14px] align-middle">vertical_split</span></button><button class="px-2 py-0.5 rounded font-label-sm text-label-sm text-on-surface-variant hover:text-on-surface hover:bg-surface-variant transition-colors" title="GOST Preview Only"><span class="material-symbols-outlined text-[14px] align-middle">menu_book</span></button></div><button class="p-1 text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high rounded transition-colors" title="Settings"><span class="material-symbols-outlined text-[18px]">settings</span></button><div class="flex items-center bg-surface-container px-2 py-1 rounded cursor-pointer text-on-surface-variant hover:text-on-surface"><span class="font-label-sm text-label-sm mr-1">DOCX via Word COM</span><span class="material-symbols-outlined text-[14px]">expand_more</span></div><button class="flex items-center gap-1.5 px-3 py-1 bg-primary-container text-on-primary-container rounded font-label-sm text-label-sm font-semibold hover:bg-primary-fixed transition-colors shadow-[0_2px_8px_rgba(56,189,248,0.2)]"><span class="material-symbols-outlined text-[15px]">check_circle</span><span>Собрать DOCX</span></button><div class="w-8 h-8 rounded-full bg-primary flex items-center justify-center"><span class="material-symbols-outlined text-on-primary text-[18px]">person</span></div></div></div><div class="h-11 px-gutter-md flex items-center justify-between bg-surface-container-low"><div class="flex items-center gap-1"><button class="px-2 py-1 rounded font-label-sm text-label-sm text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface flex items-center gap-1 font-code-editor" title="Заголовок ГОСТ (ВВЕДЕНИЕ/ЗАКЛЮЧЕНИЕ)"><span># *ВВЕДЕНИЕ</span></button><div class="w-px h-4 bg-outline-variant mx-1"></div><button class="px-2 py-1 rounded font-label-sm text-label-sm text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface flex items-center gap-1 font-code-editor" title="Таблица ГОСТ"><span class="material-symbols-outlined text-[14px]">table_chart</span><span>Таблица (^/>)</span></button><button class="px-2 py-1 rounded font-label-sm text-label-sm text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface flex items-center gap-1 font-code-editor" title="Рисунок по ГОСТ"><span class="material-symbols-outlined text-[14px]">image</span><span>%id</span></button><button class="px-2 py-1 rounded font-label-sm text-label-sm text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface flex items-center gap-1 font-code-editor" title="Формула"><span class="material-symbols-outlined text-[14px]">functions</span><span>$$</span></button><div class="w-px h-4 bg-outline-variant mx-1"></div><button class="px-2 py-1 rounded font-label-sm text-label-sm text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface flex items-center gap-1 font-code-editor" title="Диаграмма PlantUML/BPMN"><span class="material-symbols-outlined text-[14px]">account_tree</span><span>uml-c4</span></button><button class="px-2 py-1 rounded font-label-sm text-label-sm text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface flex items-center gap-1 font-code-editor" title="Ссылка на рисунок / источник"><span class="material-symbols-outlined text-[14px]">format_quote</span><span>@Рисунок:[1]</span></button><button class="px-2 py-1 rounded font-label-sm text-label-sm text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface flex items-center gap-1 font-code-editor" title="Разрыв страницы (A4 Break)"><span class="material-symbols-outlined text-[14px]">insert_page_break</span></button></div><div class="flex items-center gap-gutter-md"><div class="flex items-center gap-gutter-xs bg-surface-container-lowest px-2 py-1 rounded"><span class="text-on-surface-variant font-label-sm text-label-sm">Профиль:</span><select class="bg-transparent text-on-surface font-label-sm text-label-sm outline-none cursor-pointer"><option class="bg-surface-container-high text-on-surface" selected="" value="coursework">Курсовая (coursework)</option><option class="bg-surface-container-high text-on-surface" value="practice">Практика (practice)</option><option class="bg-surface-container-high text-on-surface" value="vkr">ВКР (vkr)</option><option class="bg-surface-container-high text-on-surface" value="pis">ПИС (PIS_custom)</option><option class="bg-surface-container-high text-on-surface" value="apid">АПИД (APID_coursework)</option></select></div><div class="flex items-center gap-1.5 px-2.5 py-0.5 rounded bg-surface-container font-label-sm text-label-sm"><span class="text-tertiary">✔</span><span class="text-on-surface font-semibold">ТЗ ГОСТ 7.32:</span><span class="text-tertiary">0 ошибок</span><span class="text-outline-variant">•</span><span class="text-secondary">2 предпр.</span></div></div></div></header><aside class="fixed left-0 top-20 bottom-7 w-sidebar-default-width bg-surface-container-low z-40 flex flex-col"><div class="h-8 px-gutter-md flex items-center justify-between bg-surface-container"><span class="font-label-sm text-label-sm uppercase tracking-wider text-on-surface-variant">Обозреватель ГОСТ</span><div class="flex items-center gap-1"><button class="text-on-surface-variant hover:text-on-surface" title="Добавить файл"><span class="material-symbols-outlined text-[15px]">note_add</span></button><button class="text-on-surface-variant hover:text-on-surface" title="Свернуть"><span class="material-symbols-outlined text-[15px]">unfold_less</span></button></div></div><nav class="flex-1 overflow-y-auto p-gutter-xs" data-active-classes="bg-surface-container-high text-primary font-semibold"><a aria-current="page" class="flex items-center gap-2 px-gutter-sm py-1 rounded transition-colors bg-surface-container-high text-primary font-semibold" data-path="document-editor" href="#"><span class="material-symbols-outlined text-[15px] text-primary">description</span><span>coursework_report.md</span></a><a class="flex items-center gap-2 px-gutter-sm py-1 rounded text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface font-body-sm text-body-sm transition-colors" data-path="gost-specifications" href="#"><span class="material-symbols-outlined text-[15px] text-secondary">tune</span><span>mirea_spec.yaml</span></a><a class="flex items-center gap-2 px-gutter-sm py-1 rounded text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface font-body-sm text-body-sm transition-colors" data-path="bibliography-manager" href="#"><span class="material-symbols-outlined text-[15px] text-tertiary">format_list_numbered</span><span>bibliography.bib</span></a><a class="flex items-center gap-2 px-gutter-sm py-1 rounded text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface font-body-sm text-body-sm transition-colors" data-path="diagram-assets" href="#"><span class="material-symbols-outlined text-[15px] text-primary">account_tree</span><span>schemas/uml_c4.puml</span></a><div class="my-2 px-gutter-sm"><div class="text-outline font-label-sm text-label-sm uppercase tracking-wider mb-1">Структура Документа</div><div class="pl-2 flex flex-col gap-0.5"><div class="flex items-center gap-1.5 py-0.5 text-on-surface font-code-editor text-body-sm cursor-pointer hover:text-primary"><span class="text-outline text-label-sm">1</span><span>ВВЕДЕНИЕ</span></div><div class="flex items-center gap-1.5 py-0.5 text-on-surface font-code-editor text-body-sm cursor-pointer hover:text-primary"><span class="text-outline text-label-sm">2</span><span>АНАЛИТИЧЕСКИЙ РАЗДЕЛ</span></div><div class="flex items-center gap-1.5 py-0.5 text-on-surface-variant pl-3 font-code-editor text-body-sm cursor-pointer hover:text-primary"><span class="text-outline text-label-sm">2.1</span><span>Анализ предметной области</span></div><div class="flex items-center gap-1.5 py-0.5 text-on-surface-variant pl-3 font-code-editor text-body-sm cursor-pointer hover:text-primary"><span class="text-outline text-label-sm">2.2</span><span>Сравнительный обзор СУБД</span></div><div class="flex items-center gap-1.5 py-0.5 text-on-surface font-code-editor text-body-sm cursor-pointer hover:text-primary"><span class="text-outline text-label-sm">3</span><span>ПРОЕКТНЫЙ РАЗДЕЛ</span></div><div class="flex items-center gap-1.5 py-0.5 text-on-surface font-code-editor text-body-sm cursor-pointer hover:text-primary"><span class="text-outline text-label-sm">4</span><span>ЗАКЛЮЧЕНИЕ</span></div><div class="flex items-center gap-1.5 py-0.5 text-on-surface font-code-editor text-body-sm cursor-pointer hover:text-primary"><span class="text-outline text-label-sm">5</span><span>СПИСОК ЛИТЕРАТУРЫ</span></div></div></div><div class="mt-auto px-gutter-sm pt-2"><a class="flex items-center gap-2 px-gutter-sm py-1.5 rounded bg-surface-container text-on-surface-variant hover:bg-surface-container-high hover:text-on-surface font-label-sm text-label-sm transition-colors" data-path="build-diagnostics" href="#"><span class="material-symbols-outlined text-[15px] text-tertiary">analytics</span><span>Журнал сборки</span></a></div></nav></aside><div class="pl-sidebar-default-width"><main class="relative pt-20 pb-7 w-full bg-surface-container-lowest min-h-screen"><div class="flex flex-col w-full">
|
||
<!-- Interactive Modal Wrapper with Backdrop Shadow / High Depth Window -->
|
||
<div class="p-gutter-md flex flex-col gap-gutter-md w-full max-w-[1720px] mx-auto">
|
||
<!-- Modal Window Canvas Container -->
|
||
<div class="w-full bg-surface-container-low rounded-xl shadow-[0_20px_50px_rgba(0,0,0,0.85)] flex flex-col overflow-hidden">
|
||
<!-- Window Titlebar / Navigation Bar -->
|
||
<div class="h-12 px-gutter-md bg-surface-container-lowest flex items-center justify-between">
|
||
<div class="flex items-center gap-gutter-md">
|
||
<div class="flex items-center gap-2">
|
||
<!-- App / Extension Icon -->
|
||
<div class="w-7 h-7 rounded bg-primary-container/20 flex items-center justify-center text-primary">
|
||
<span class="material-symbols-outlined text-[18px]">menu_book</span>
|
||
</div>
|
||
<div class="flex flex-col">
|
||
<div class="flex items-center gap-2">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface font-semibold tracking-tight">GhostEditor Desktop — Спецификация диалекта Markdown</span>
|
||
<span class="px-2 py-0.5 rounded bg-surface-container-high text-primary font-label-sm text-label-sm">md2gost v0.1.0</span>
|
||
<span class="px-2 py-0.5 rounded bg-tertiary/10 text-tertiary font-label-sm text-label-sm flex items-center gap-1">
|
||
<span class="material-symbols-outlined text-[12px]">verified</span>
|
||
<span>ГОСТ 7.32-2017</span>
|
||
</span>
|
||
<span class="px-2 py-0.5 rounded bg-secondary-container/40 text-secondary font-label-sm text-label-sm">AST Extended Marko</span>
|
||
</div>
|
||
<span class="font-label-sm text-label-sm text-on-surface-variant font-code-editor">docs/markdown.md • docs/quickstart.md • rev #8e2a14</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Search Bar & Top Actions -->
|
||
<div class="flex items-center gap-gutter-md">
|
||
<div class="relative flex items-center">
|
||
<span class="material-symbols-outlined absolute left-2.5 text-on-surface-variant text-[15px]">search</span>
|
||
<input class="bg-surface-container-lowest text-on-surface placeholder-on-surface-variant/60 text-code-editor font-code-editor pl-8 pr-12 py-1.5 rounded w-80 outline-none focus:bg-surface-container" placeholder="Поиск по синтаксису и правилам... [Ctrl+K]" type="text"/>
|
||
<span class="absolute right-2 text-label-sm font-label-sm text-on-surface-variant bg-surface-container-high px-1.5 py-0.5 rounded">Ctrl+K</span>
|
||
</div>
|
||
<div class="flex items-center gap-1">
|
||
<button class="w-8 h-8 rounded bg-surface-container flex items-center justify-center text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high transition-colors" title="Открыть в окне">
|
||
<span class="material-symbols-outlined text-[16px]">open_in_new</span>
|
||
</button>
|
||
<button class="w-8 h-8 rounded bg-surface-container flex items-center justify-center text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high transition-colors" title="Справка CLI">
|
||
<span class="material-symbols-outlined text-[16px]">terminal</span>
|
||
</button>
|
||
<button class="w-8 h-8 rounded bg-surface-container flex items-center justify-center text-on-surface-variant hover:text-error hover:bg-error/10 transition-colors ml-1" title="Закрыть окно">
|
||
<span class="material-symbols-outlined text-[18px]">close</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Top Category Navigation Tabs -->
|
||
<div class="h-10 px-gutter-md bg-surface-container flex items-center gap-1 overflow-x-auto">
|
||
<button class="flex items-center gap-2 px-3 py-1.5 rounded font-label-md text-label-md text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high transition-colors">
|
||
<span class="material-symbols-outlined text-[15px]">overview</span>
|
||
<span>1. Обзор диалекта и базовые правила</span>
|
||
</button>
|
||
<button class="flex items-center gap-2 px-3 py-1.5 rounded font-label-md text-label-md text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high transition-colors">
|
||
<span class="material-symbols-outlined text-[15px]">account_tree</span>
|
||
<span>2. Спецразделы и структура</span>
|
||
</button>
|
||
<button class="flex items-center gap-2 px-3 py-1.5 rounded bg-primary-container text-on-primary-container font-label-md text-label-md font-semibold shadow-sm">
|
||
<span class="material-symbols-outlined text-[15px]">table_chart</span>
|
||
<span>3. Таблицы со слиянием (^ / >)</span>
|
||
</button>
|
||
<button class="flex items-center gap-2 px-3 py-1.5 rounded font-label-md text-label-md text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high transition-colors">
|
||
<span class="material-symbols-outlined text-[15px]">functions</span>
|
||
<span>4. Схемы, UML и OMML формулы</span>
|
||
</button>
|
||
<button class="flex items-center gap-2 px-3 py-1.5 rounded font-label-md text-label-md text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high transition-colors">
|
||
<span class="material-symbols-outlined text-[15px]">link</span>
|
||
<span>5. Перекрёстные ссылки и библиография</span>
|
||
</button>
|
||
<button class="flex items-center gap-2 px-3 py-1.5 rounded font-label-md text-label-md text-on-surface-variant hover:text-on-surface hover:bg-surface-container-high transition-colors">
|
||
<span class="material-symbols-outlined text-[15px]">rule</span>
|
||
<span>6. Правила чекера ГОСТ (--check)</span>
|
||
</button>
|
||
</div>
|
||
<!-- Main Three-Column Workspace Layout -->
|
||
<div class="grid grid-cols-12 gap-0 min-h-[680px] bg-surface-container-lowest">
|
||
<!-- Left Column: Navigation Tree & Quick Constructs (col-span-3) -->
|
||
<div class="col-span-3 bg-surface-container-low flex flex-col p-gutter-sm gap-gutter-sm">
|
||
<div class="px-2 py-1 flex items-center justify-between">
|
||
<span class="font-label-sm text-label-sm uppercase tracking-wider text-on-surface-variant font-semibold">Синтаксические конструкции md2gost</span>
|
||
<span class="font-label-sm text-label-sm text-primary px-1.5 py-0.5 rounded bg-surface-container">8 модулей</span>
|
||
</div>
|
||
<!-- Grouped Syntax Rules List -->
|
||
<div class="flex-1 flex flex-col gap-1 overflow-y-auto pr-1">
|
||
<!-- Construct 1 -->
|
||
<div class="p-2 rounded bg-surface-container/60 hover:bg-surface-container cursor-pointer transition-colors flex flex-col gap-1 group">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface group-hover:text-primary">1. Спецразделы без номеров</span>
|
||
<span class="px-1.5 py-0.2 rounded bg-surface-container-high text-tertiary font-label-sm text-label-sm">AST</span>
|
||
</div>
|
||
<p class="font-body-sm text-body-sm text-on-surface-variant line-clamp-1"># *ВВЕДЕНИЕ, [TOC], # *ЗАКЛЮЧЕНИЕ</p>
|
||
<div class="flex items-center gap-1 text-label-sm font-label-sm text-on-surface-variant/80 font-code-editor">
|
||
<span>Пункт ГОСТ 7.32: 5.2</span>
|
||
</div>
|
||
</div>
|
||
<!-- Construct 2 -->
|
||
<div class="p-2 rounded bg-surface-container/60 hover:bg-surface-container cursor-pointer transition-colors flex flex-col gap-1 group">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface group-hover:text-primary">2. Идентификаторы и кросс-ссылки</span>
|
||
<span class="px-1.5 py-0.2 rounded bg-surface-container-high text-primary font-label-sm text-label-sm">Ref Engine</span>
|
||
</div>
|
||
<p class="font-body-sm text-body-sm text-on-surface-variant line-clamp-1">%id, @Рисунок:id, @Таблица:id, @Формула:id</p>
|
||
<div class="flex items-center gap-1 text-label-sm font-label-sm text-tertiary font-code-editor">
|
||
<span>Автонумерация сквозная</span>
|
||
</div>
|
||
</div>
|
||
<!-- Construct 3 (ACTIVE) -->
|
||
<div class="p-2.5 rounded bg-surface-container-high flex flex-col gap-1.5 shadow-sm">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-primary font-semibold">3. Таблицы со слиянием (row/col)</span>
|
||
<span class="px-2 py-0.5 rounded bg-primary-container text-on-primary-container font-label-sm text-label-sm font-bold">Выбрано</span>
|
||
</div>
|
||
<p class="font-body-sm text-body-sm text-on-surface">Маркеры ^ (rowspan), > (colspan), авторазрыв</p>
|
||
<div class="flex items-center justify-between text-label-sm font-label-sm text-on-surface-variant">
|
||
<span class="font-code-editor text-secondary">%tbl-id Название</span>
|
||
<span class="text-tertiary">w:vMerge • w:gridSpan</span>
|
||
</div>
|
||
</div>
|
||
<!-- Construct 4 -->
|
||
<div class="p-2 rounded bg-surface-container/60 hover:bg-surface-container cursor-pointer transition-colors flex flex-col gap-1 group">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface group-hover:text-primary">4. Листинги исходного кода</span>
|
||
<span class="px-1.5 py-0.2 rounded bg-surface-container-high text-secondary font-label-sm text-label-sm">Pygments</span>
|
||
</div>
|
||
<p class="font-body-sm text-body-sm text-on-surface-variant line-clamp-1">python %lst-main Заголовок листинга</p>
|
||
<div class="flex items-center gap-1 text-label-sm font-label-sm text-on-surface-variant/80 font-code-editor">
|
||
<span>Разрывы без сирот строк</span>
|
||
</div>
|
||
</div>
|
||
<!-- Construct 5 -->
|
||
<div class="p-2 rounded bg-surface-container/60 hover:bg-surface-container cursor-pointer transition-colors flex flex-col gap-1 group">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface group-hover:text-primary">5. Схемы, PlantUML и BPMN</span>
|
||
<span class="px-1.5 py-0.2 rounded bg-surface-container-high text-primary font-label-sm text-label-sm">Kroki / Jar</span>
|
||
</div>
|
||
<p class="font-body-sm text-body-sm text-on-surface-variant line-clamp-1">uml-c4 %arch, +landscape, +listing</p>
|
||
<div class="flex items-center gap-1 text-label-sm font-label-sm text-tertiary font-code-editor">
|
||
<span>Рендер в EMF/PNG 300 DPI</span>
|
||
</div>
|
||
</div>
|
||
<!-- Construct 6 -->
|
||
<div class="p-2 rounded bg-surface-container/60 hover:bg-surface-container cursor-pointer transition-colors flex flex-col gap-1 group">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface group-hover:text-primary">6. Формулы и математика</span>
|
||
<span class="px-1.5 py-0.2 rounded bg-surface-container-high text-on-surface-variant font-label-sm text-label-sm">LaTeX → OMML</span>
|
||
</div>
|
||
<p class="font-body-sm text-body-sm text-on-surface-variant line-clamp-1">$$ ... $$ %eq-energy и инлайн $a^2+b^2=c^2$</p>
|
||
<div class="flex items-center gap-1 text-label-sm font-label-sm text-on-surface-variant/80 font-code-editor">
|
||
<span>Нумерация по правому краю</span>
|
||
</div>
|
||
</div>
|
||
<!-- Construct 7 -->
|
||
<div class="p-2 rounded bg-surface-container/60 hover:bg-surface-container cursor-pointer transition-colors flex flex-col gap-1 group">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface group-hover:text-primary">7. Библиография и источники</span>
|
||
<span class="px-1.5 py-0.2 rounded bg-surface-container-high text-tertiary font-label-sm text-label-sm">ГОСТ 7.0.5</span>
|
||
</div>
|
||
<p class="font-body-sm text-body-sm text-on-surface-variant line-clamp-1">[1]: Автор. Монография... и цитирование [1]</p>
|
||
<div class="flex items-center gap-1 text-label-sm font-label-sm text-error font-code-editor">
|
||
<span>Проверка давности ≤ 5 лет</span>
|
||
</div>
|
||
</div>
|
||
<!-- Construct 8 -->
|
||
<div class="p-2 rounded bg-surface-container/60 hover:bg-surface-container cursor-pointer transition-colors flex flex-col gap-1 group">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface group-hover:text-primary">8. Разрыв страниц и ориентация</span>
|
||
<span class="px-1.5 py-0.2 rounded bg-surface-container-high text-secondary font-label-sm text-label-sm">Page Engine</span>
|
||
</div>
|
||
<p class="font-body-sm text-body-sm text-on-surface-variant line-clamp-1">--- hr-pagebreak, секция +landscape</p>
|
||
<div class="flex items-center gap-1 text-label-sm font-label-sm text-on-surface-variant/80 font-code-editor">
|
||
<span>A4 Альбомная секция</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Bottom Metric Widget -->
|
||
<div class="p-2.5 rounded bg-surface-container flex items-center justify-between mt-auto">
|
||
<div class="flex items-center gap-2">
|
||
<span class="material-symbols-outlined text-tertiary text-[18px]">verified_user</span>
|
||
<div class="flex flex-col">
|
||
<span class="font-label-sm text-label-sm text-on-surface font-semibold">Валидатор активен</span>
|
||
<span class="font-label-sm text-label-sm text-on-surface-variant">0 критических расхождений</span>
|
||
</div>
|
||
</div>
|
||
<span class="px-2 py-0.5 rounded bg-tertiary/10 text-tertiary font-label-sm text-label-sm font-code-editor">100% GOST</span>
|
||
</div>
|
||
</div>
|
||
<!-- Center Column: Deep Explanation, Live Markdown Editor & Playground (col-span-5) -->
|
||
<div class="col-span-5 bg-surface-container flex flex-col p-gutter-md gap-gutter-md overflow-y-auto">
|
||
<!-- Section Title & Meta Header -->
|
||
<div class="flex flex-col gap-1.5">
|
||
<div class="flex items-center justify-between">
|
||
<div class="flex items-center gap-2">
|
||
<span class="px-2 py-0.5 rounded bg-primary/10 text-primary font-label-sm text-label-sm font-semibold uppercase">Спецификация раздела 3</span>
|
||
<span class="text-on-surface-variant font-label-sm text-label-sm">md2gost table syntax</span>
|
||
</div>
|
||
<div class="flex items-center gap-2">
|
||
<button class="px-2 py-1 rounded bg-surface-container-high hover:bg-surface-container-highest text-on-surface text-label-sm font-label-sm flex items-center gap-1">
|
||
<span class="material-symbols-outlined text-[13px]">share</span>
|
||
<span>Поделиться</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<h2 class="font-headline-lg text-headline-lg text-on-surface font-bold">Таблицы со сложным слиянием ячеек (`^` rowspan / `>` colspan)</h2>
|
||
<p class="font-body-md text-body-md text-on-surface-variant leading-relaxed">
|
||
В стандартном Markdown отсутствует семантическое слияние ячеек. Диалект <span class="text-primary font-code-editor">md2gost</span> решает эту проблему введением служебных маркеров: символ <code class="px-1.5 py-0.5 rounded bg-surface-container-lowest text-primary font-code-editor font-semibold">^</code> инициирует слияние по вертикали с вышестоящей ячейкой (rowspan), а <code class="px-1.5 py-0.5 rounded bg-surface-container-lowest text-primary font-code-editor font-semibold">></code> объединяет ячейку с предыдущей слева (colspan). В Word OpenXML это компилируется напрямую в дескрипторы <code class="text-secondary font-code-editor">w:vMerge</code> и <code class="text-secondary font-code-editor">w:gridSpan</code>.
|
||
</p>
|
||
</div>
|
||
<!-- Code Snippet Box with Tab Switcher -->
|
||
<div class="flex flex-col bg-surface-container-lowest rounded-lg overflow-hidden">
|
||
<!-- Snippet Action Header -->
|
||
<div class="h-9 px-gutter-sm bg-surface-container-high flex items-center justify-between">
|
||
<div class="flex items-center gap-1">
|
||
<button class="px-2.5 py-1 rounded bg-surface-container-lowest text-primary font-label-sm text-label-sm font-semibold">Исходный Markdown (.md)</button>
|
||
<button class="px-2.5 py-1 rounded text-on-surface-variant hover:text-on-surface font-label-sm text-label-sm">DOCX OpenXML AST</button>
|
||
<button class="px-2.5 py-1 rounded text-on-surface-variant hover:text-on-surface font-label-sm text-label-sm">Критерии проверки</button>
|
||
</div>
|
||
<div class="flex items-center gap-2">
|
||
<button class="flex items-center gap-1 px-2 py-0.5 rounded bg-surface-container text-on-surface hover:bg-surface-variant text-label-sm font-label-sm transition-colors" title="Скопировать">
|
||
<span class="material-symbols-outlined text-[13px] text-tertiary">content_copy</span>
|
||
<span>Копировать</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
<!-- Code Editor Buffer View -->
|
||
<div class="p-3 font-code-editor text-code-editor leading-6 overflow-x-auto flex">
|
||
<!-- Line Numbers Gutter -->
|
||
<div class="select-none pr-3 text-outline text-right text-code-gutter flex flex-col">
|
||
<span>01</span>
|
||
<span>02</span>
|
||
<span>03</span>
|
||
<span>04</span>
|
||
<span>05</span>
|
||
<span>06</span>
|
||
<span>07</span>
|
||
</div>
|
||
<!-- Syntax Stream -->
|
||
<div class="flex flex-col text-on-surface">
|
||
<div><span class="text-secondary font-bold">%tbl-db-compare</span> <span class="text-on-surface-variant">Сравнительный анализ реляционных СУБД для логирования</span></div>
|
||
<div><span class="text-outline">|</span> <span class="text-primary font-semibold">СУБД</span> <span class="text-outline">|</span> <span class="text-primary font-semibold">Производительность</span> <span class="text-outline">|</span> <span class="text-primary font-semibold">Поддержка JSON</span> <span class="text-outline">|</span> <span class="text-primary font-semibold">Стоимость лицензии</span> <span class="text-outline">|</span></div>
|
||
<div><span class="text-outline">| :--- | :--- | :--- | :--- |</span></div>
|
||
<div><span class="text-outline">|</span> PostgreSQL <span class="text-outline">|</span> <span class="text-tertiary">Высокая (OLTP)</span> <span class="text-outline">|</span> Полная (JSONB) <span class="text-outline">|</span> <span class="text-tertiary font-semibold">Бесплатно (Open Source)</span> <span class="text-outline">|</span></div>
|
||
<div><span class="text-outline">|</span> MySQL 8.0 <span class="text-outline">|</span> <span class="text-primary font-bold bg-primary/20 px-1 rounded">^</span> <span class="text-outline">|</span> Базовая (JSON doc) <span class="text-outline">|</span> <span class="text-primary font-bold bg-primary/20 px-1 rounded">^</span> <span class="text-outline">|</span></div>
|
||
<div><span class="text-outline">|</span> Oracle DB <span class="text-outline">|</span> Экстремальная <span class="text-outline">|</span> <span class="text-secondary font-bold bg-secondary/20 px-1 rounded">></span> <span class="text-outline">|</span> Коммерческая (Проприетарно) <span class="text-outline">|</span></div>
|
||
<div><span class="text-outline">|</span> SQLite 3 <span class="text-outline">|</span> Локальная <span class="text-outline">|</span> Ограниченная <span class="text-outline">|</span> Public Domain <span class="text-outline">|</span></div>
|
||
</div>
|
||
</div>
|
||
<!-- Legend Info Pill -->
|
||
<div class="px-3 py-1.5 bg-surface-container-high/40 flex items-center justify-between text-label-sm font-label-sm text-on-surface-variant">
|
||
<div class="flex items-center gap-3">
|
||
<span class="flex items-center gap-1"><span class="w-2 h-2 rounded-full bg-primary"></span> <code class="text-primary font-code-editor">^</code> — вертикальный rowspan</span>
|
||
<span class="flex items-center gap-1"><span class="w-2 h-2 rounded-full bg-secondary"></span> <code class="text-secondary font-code-editor">></code> — горизонтальный colspan</span>
|
||
</div>
|
||
<span class="text-outline font-code-editor">UTF-8 • 7 строк</span>
|
||
</div>
|
||
</div>
|
||
<!-- GOST Standard Warning / Directive Callout -->
|
||
<div class="p-3.5 rounded-lg bg-surface-container-high flex gap-3 shadow-sm">
|
||
<span class="material-symbols-outlined text-primary text-[22px] shrink-0 mt-0.5">policy</span>
|
||
<div class="flex flex-col gap-1">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface font-semibold">Требование ГОСТ 7.32-2017 (п. 6.8 Таблицы):</span>
|
||
<p class="font-body-sm text-body-sm text-on-surface-variant leading-relaxed">
|
||
Название таблицы размещается над ней слева без абзацного отступа в формате: <code class="text-primary font-code-editor">Таблица 1 — Название</code>. Точка в конце заголовка не ставится. При переносе таблицы на следующий лист Word COM автоматически дублирует шапку таблицы и выводит над ней строку <code class="text-secondary font-code-editor">«Продолжение таблицы 1»</code>.
|
||
</p>
|
||
<div class="flex items-center gap-2 mt-1">
|
||
<span class="px-2 py-0.5 rounded bg-surface-container text-tertiary font-label-sm text-label-sm font-code-editor">--table-continuation word</span>
|
||
<span class="px-2 py-0.5 rounded bg-surface-container text-primary font-label-sm text-label-sm font-code-editor">--keep-with-next</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Cross-linking snippet block -->
|
||
<div class="p-3 rounded-lg bg-surface-container-lowest flex flex-col gap-2">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface font-medium">Ссылка на таблицу в основном тексте документа:</span>
|
||
<span class="font-label-sm text-label-sm text-tertiary">Кросс-референс</span>
|
||
</div>
|
||
<div class="p-2 rounded bg-surface-container text-code-editor font-code-editor text-on-surface flex items-center justify-between">
|
||
<div>
|
||
<span class="text-on-surface-variant">Результаты замеров сведены в</span> <span class="text-primary font-semibold">@Таблица:tbl-db-compare</span>.
|
||
</div>
|
||
<span class="text-outline text-label-sm">→ «в таблице 1»</span>
|
||
</div>
|
||
<span class="font-body-sm text-body-sm text-on-surface-variant">Склонение слова «таблица» и корректный регистр подбираются транслятором автоматически согласно падежу контекста.</span>
|
||
</div>
|
||
</div>
|
||
<!-- Right Column: Inspector & DOCX Live Physical Preview (col-span-4) -->
|
||
<div class="col-span-4 bg-surface-container-low flex flex-col p-gutter-md gap-gutter-md overflow-y-auto">
|
||
<!-- Anti-Mistake Guide Panel -->
|
||
<div class="flex flex-col gap-2">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-label-sm text-label-sm uppercase tracking-wider text-on-surface-variant font-semibold">Контроль чекера ТЗ (--check)</span>
|
||
<span class="px-2 py-0.5 rounded bg-tertiary/10 text-tertiary font-label-sm text-label-sm">Anti-Mistake</span>
|
||
</div>
|
||
<!-- List of Rules -->
|
||
<div class="flex flex-col gap-1.5">
|
||
<!-- Rule 1: Quotes -->
|
||
<div class="p-2 rounded bg-surface-container flex items-start gap-2">
|
||
<span class="material-symbols-outlined text-tertiary text-[18px] shrink-0 mt-0.5">check_circle</span>
|
||
<div class="flex flex-col">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface">Автозамена кавычек</span>
|
||
<span class="font-body-sm text-body-sm text-on-surface-variant">"Кавычки" → «Французские ёлочки» по ГОСТ</span>
|
||
</div>
|
||
</div>
|
||
<!-- Rule 2: Em-dash -->
|
||
<div class="p-2 rounded bg-surface-container flex items-start gap-2">
|
||
<span class="material-symbols-outlined text-tertiary text-[18px] shrink-0 mt-0.5">check_circle</span>
|
||
<div class="flex flex-col">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface">Тире и дефисы</span>
|
||
<span class="font-body-sm text-body-sm text-on-surface-variant">Слово - слово → Слово — слово (длинное тире с неразрывным пробелом)</span>
|
||
</div>
|
||
</div>
|
||
<!-- Rule 3: Footnotes BAN -->
|
||
<div class="p-2 rounded bg-surface-container flex items-start gap-2">
|
||
<span class="material-symbols-outlined text-error text-[18px] shrink-0 mt-0.5">cancel</span>
|
||
<div class="flex flex-col">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface">Запрет сносок [^1]</span>
|
||
<span class="font-body-sm text-body-sm text-error">ГОСТ 7.32 запрещает сноски на страницах. Используйте только список литературы [n]</span>
|
||
</div>
|
||
</div>
|
||
<!-- Rule 4: Abbreviations BAN -->
|
||
<div class="p-2 rounded bg-surface-container flex items-start gap-2">
|
||
<span class="material-symbols-outlined text-error text-[18px] shrink-0 mt-0.5">cancel</span>
|
||
<div class="flex flex-col">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface">Запрет сокращений «рис.», «табл.»</span>
|
||
<span class="font-body-sm text-body-sm text-error">Писать только полными словами: «Рисунок 1.2», «Таблица 3»</span>
|
||
</div>
|
||
</div>
|
||
<!-- Rule 5: Warning on 'No p/p' -->
|
||
<div class="p-2 rounded bg-surface-container flex items-start gap-2">
|
||
<span class="material-symbols-outlined text-secondary text-[18px] shrink-0 mt-0.5">warning</span>
|
||
<div class="flex flex-col">
|
||
<span class="font-headline-sm text-headline-sm text-on-surface">Колонка «№ п/п» не допускается</span>
|
||
<span class="font-body-sm text-body-sm text-on-surface-variant">Стандарт предписывает ставить просто «№» или осмысленный заголовок</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Skeuomorphic Physical A4 Paper Preview Box -->
|
||
<div class="flex flex-col gap-2 mt-2">
|
||
<div class="flex items-center justify-between">
|
||
<span class="font-label-sm text-label-sm uppercase tracking-wider text-on-surface-variant font-semibold">Физический рендер в Word DOCX</span>
|
||
<span class="font-code-editor text-label-sm text-on-surface-variant">Масштаб 1:1 • 12pt TNR</span>
|
||
</div>
|
||
<!-- Authentic Paper Sheet Representation -->
|
||
<div class="w-full bg-surface-container-lowest p-4 rounded-lg flex items-center justify-center">
|
||
<div class="w-full bg-[#ffffff] text-[#111827] rounded shadow-[0_1px_3px_rgba(0,0,0,0.3),0_12px_32px_-4px_rgba(0,0,0,0.65)] p-4 flex flex-col gap-1.5 font-sans select-text">
|
||
<!-- Table Caption as rendered in GOST -->
|
||
<div class="text-[11px] font-serif leading-tight text-[#111827]">
|
||
Таблица 1 — Сравнительный анализ реляционных СУБД для логирования
|
||
</div>
|
||
<!-- Simulated Native Word Table with borders -->
|
||
<div class="w-full overflow-hidden text-[10px] font-serif text-[#111827]">
|
||
<table class="w-full border-collapse">
|
||
<thead>
|
||
<tr class="bg-[#f3f4f6]">
|
||
<th class="p-1.5 text-left font-bold border border-[#374151]">СУБД</th>
|
||
<th class="p-1.5 text-left font-bold border border-[#374151]">Производительность</th>
|
||
<th class="p-1.5 text-left font-bold border border-[#374151]">Поддержка JSON</th>
|
||
<th class="p-1.5 text-left font-bold border border-[#374151]">Стоимость лицензии</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
<tr>
|
||
<td class="p-1.5 border border-[#374151]">PostgreSQL</td>
|
||
<td class="p-1.5 border border-[#374151]" rowspan="2">Высокая (OLTP)</td>
|
||
<td class="p-1.5 border border-[#374151]">Полная (JSONB)</td>
|
||
<td class="p-1.5 border border-[#374151]" rowspan="2">Бесплатно (Open Source)</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="p-1.5 border border-[#374151]">MySQL 8.0</td>
|
||
<!-- rowspan merged from above -->
|
||
<td class="p-1.5 border border-[#374151]">Базовая (JSON doc)</td>
|
||
<!-- rowspan merged from above -->
|
||
</tr>
|
||
<tr>
|
||
<td class="p-1.5 border border-[#374151]">Oracle DB</td>
|
||
<td class="p-1.5 border border-[#374151]" colspan="2">Экстремальная</td>
|
||
<!-- colspan merged from left -->
|
||
<td class="p-1.5 border border-[#374151]">Коммерческая</td>
|
||
</tr>
|
||
<tr>
|
||
<td class="p-1.5 border border-[#374151]">SQLite 3</td>
|
||
<td class="p-1.5 border border-[#374151]">Локальная</td>
|
||
<td class="p-1.5 border border-[#374151]">Ограниченная</td>
|
||
<td class="p-1.5 border border-[#374151]">Public Domain</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
<!-- Footer note on doc sheet -->
|
||
<div class="text-[9px] font-serif text-[#6b7280] italic mt-1 text-right">
|
||
Сформировано через python-docx-template • шрифт Times New Roman 12 pt
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Bottom Action and Status Bar -->
|
||
<div class="h-12 px-gutter-md bg-surface-container flex items-center justify-between">
|
||
<div class="flex items-center gap-gutter-md">
|
||
<span class="font-label-sm text-label-sm text-on-surface-variant font-code-editor">
|
||
docs/markdown.md • v0.1.0 (18.4 КБ) • Синхронизировано с компилятором
|
||
</span>
|
||
</div>
|
||
<div class="flex items-center gap-2">
|
||
<button class="px-3 py-1.5 rounded bg-surface-container-high hover:bg-surface-container-highest text-on-surface font-label-md text-label-md flex items-center gap-1.5 transition-colors">
|
||
<span class="material-symbols-outlined text-[15px]">content_copy</span>
|
||
<span>Скопировать сниппет (Ctrl+C)</span>
|
||
</button>
|
||
<button class="px-3 py-1.5 rounded bg-surface-container-high hover:bg-surface-container-highest text-on-surface font-label-md text-label-md flex items-center gap-1.5 transition-colors">
|
||
<span class="material-symbols-outlined text-[15px]">open_in_browser</span>
|
||
<span>Полная справка в браузере</span>
|
||
</button>
|
||
<button class="px-4 py-1.5 rounded bg-primary-container hover:bg-primary-fixed text-on-primary-container font-label-md text-label-md font-bold flex items-center gap-1.5 transition-colors shadow-sm">
|
||
<span class="material-symbols-outlined text-[16px]">add_box</span>
|
||
<span>Вставить сниппет в coursework_report.md</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- Interactive JavaScript for micro-interactions -->
|
||
<script>
|
||
document.addEventListener('DOMContentLoaded', () => {
|
||
const copyBtns = document.querySelectorAll('button:has(.material-symbols-outlined:contains("content_copy"))');
|
||
copyBtns.forEach(btn => {
|
||
btn.addEventListener('click', () => {
|
||
const originalText = btn.innerHTML;
|
||
btn.classList.add('bg-tertiary-container', 'text-on-tertiary-container');
|
||
btn.innerHTML = '<span class="material-symbols-outlined text-[15px]">done</span><span>Скопировано в буфер!</span>';
|
||
setTimeout(() => {
|
||
btn.innerHTML = originalText;
|
||
btn.classList.remove('bg-tertiary-container', 'text-on-tertiary-container');
|
||
}, 2000);
|
||
});
|
||
});
|
||
});
|
||
</script>
|
||
</div></main></div><footer class="fixed bottom-0 left-0 right-0 h-7 z-50 px-gutter-md bg-surface-container flex items-center justify-between font-label-sm text-label-sm text-on-surface-variant"><div class="flex items-center gap-gutter-md"><div class="flex items-center gap-1 hover:text-on-surface cursor-pointer"><span class="material-symbols-outlined text-[13px] text-primary">save_as</span><span>main</span></div><div class="flex items-center gap-1 hover:text-on-surface cursor-pointer"><span class="material-symbols-outlined text-[13px]">data_object</span><span>UTF-8</span></div><div class="hover:text-on-surface cursor-pointer"><span>Ln 142, Col 28</span></div><div class="hover:text-on-surface cursor-pointer"><span>3,480 слов</span></div><div class="flex items-center gap-1 hover:text-on-surface cursor-pointer"><span class="material-symbols-outlined text-[13px] text-secondary">description</span><span>24 стр. (A4)</span></div></div><div class="flex items-center gap-2"><span class="w-2 h-2 rounded-full bg-tertiary animate-pulse"></span><span class="text-on-surface font-code-editor">Local Kroki (Ready)</span><span class="text-outline">|</span><span class="text-on-surface-variant font-code-editor">plantuml.jar (v1.2024)</span></div><div class="flex items-center gap-gutter-md"><div class="flex items-center gap-1.5"><span class="text-outline">Таблицы:</span><span class="text-on-surface font-semibold">Word COM (Active)</span></div><div class="flex items-center gap-1.5"><span class="text-outline">Заполнение:</span><span class="text-tertiary font-semibold">94%</span></div><div class="flex items-center gap-2"><span class="material-symbols-outlined text-[14px] cursor-pointer hover:text-on-surface">zoom_out</span><span class="text-on-surface font-code-editor">100%</span><span class="material-symbols-outlined text-[14px] cursor-pointer hover:text-on-surface">zoom_in</span></div></div></footer></body></html> |