phase2: markdown converter with goldmark, chroma, and ASCII-translit anchors

This commit is contained in:
Sergey Filkin
2026-04-18 11:47:18 +03:00
parent cab04768b5
commit 8deba3627f
39 changed files with 5662 additions and 0 deletions
+123
View File
@@ -0,0 +1,123 @@
package converter
import (
"strings"
"github.com/yuin/goldmark"
emojiast "github.com/yuin/goldmark-emoji/ast"
"github.com/yuin/goldmark/ast"
"github.com/yuin/goldmark/parser"
"github.com/yuin/goldmark/text"
"github.com/yuin/goldmark/util"
)
type anchorExtension struct{}
func (e *anchorExtension) Extend(m goldmark.Markdown) {
m.Parser().AddOptions(parser.WithASTTransformers(
util.Prioritized(&anchorTransformer{}, 900),
))
}
type anchorTransformer struct{}
func (t *anchorTransformer) Transform(doc *ast.Document, reader text.Reader, pc parser.Context) {
src := reader.Source()
used := map[string]int{}
_ = pc
_ = ast.Walk(doc, func(n ast.Node, entering bool) (ast.WalkStatus, error) {
if !entering {
return ast.WalkContinue, nil
}
h, ok := n.(*ast.Heading)
if !ok {
return ast.WalkContinue, nil
}
slug := translitSlug(extractHeadingText(h, src), used)
h.SetAttributeString("id", []byte(slug))
link := ast.NewLink()
link.Destination = []byte("#" + slug)
link.SetAttributeString("class", []byte("heading-anchor"))
link.SetAttributeString("aria-hidden", []byte("true"))
link.AppendChild(link, ast.NewString([]byte("#")))
if first := h.FirstChild(); first != nil {
h.InsertBefore(h, first, link)
} else {
h.AppendChild(h, link)
}
return ast.WalkSkipChildren, nil
})
}
func extractHeadingText(h *ast.Heading, src []byte) string {
var b strings.Builder
_ = ast.Walk(h, func(n ast.Node, entering bool) (ast.WalkStatus, error) {
if !entering {
return ast.WalkContinue, nil
}
switch v := n.(type) {
case *ast.Link:
if isHeadingAnchor(v) {
return ast.WalkSkipChildren, nil
}
case *ast.Text:
b.Write(v.Segment.Value(src))
if v.HardLineBreak() || v.SoftLineBreak() {
b.WriteByte(' ')
}
case *ast.String:
b.Write(v.Value)
case *ast.CodeSpan:
for child := v.FirstChild(); child != nil; child = child.NextSibling() {
switch c := child.(type) {
case *ast.Text:
b.Write(c.Segment.Value(src))
case *ast.String:
b.Write(c.Value)
}
}
return ast.WalkSkipChildren, nil
case *ast.AutoLink:
b.Write(v.Label(src))
return ast.WalkSkipChildren, nil
case *emojiast.Emoji:
if v.Value != nil && len(v.Value.Unicode) > 0 {
b.WriteString(string(v.Value.Unicode))
} else if len(v.ShortName) > 0 {
b.WriteByte(':')
b.Write(v.ShortName)
b.WriteByte(':')
}
return ast.WalkSkipChildren, nil
}
return ast.WalkContinue, nil
})
return strings.TrimSpace(b.String())
}
func isHeadingAnchor(link *ast.Link) bool {
attr, ok := link.AttributeString("class")
if !ok {
return false
}
switch value := attr.(type) {
case []byte:
return string(value) == "heading-anchor"
case string:
return value == "heading-anchor"
default:
return false
}
}
+170
View File
@@ -0,0 +1,170 @@
package converter
import (
"bytes"
"fmt"
"html/template"
"io/fs"
"strings"
"sync"
chromahtml "github.com/alecthomas/chroma/v2/formatters/html"
"github.com/yuin/goldmark"
emoji "github.com/yuin/goldmark-emoji"
highlighting "github.com/yuin/goldmark-highlighting/v2"
"github.com/yuin/goldmark/ast"
"github.com/yuin/goldmark/extension"
"github.com/yuin/goldmark/renderer"
"github.com/yuin/goldmark/text"
"github.com/yuin/goldmark/util"
)
const documentLang = "ru"
type Result struct {
HTML []byte
Title string
}
type Converter struct {
md goldmark.Markdown
tmpl *template.Template
bufferPool sync.Pool
}
type templateData struct {
Lang string
Title string
Body template.HTML
ShowTitle bool
}
func New(templateFS fs.FS) (*Converter, error) {
tmpl, err := template.ParseFS(templateFS, "document.html")
if err != nil {
return nil, err
}
return &Converter{
md: goldmark.New(
goldmark.WithExtensions(
extension.GFM,
extension.Footnote,
emoji.Emoji,
highlighting.NewHighlighting(
highlighting.WithStyle("github"),
highlighting.WithFormatOptions(chromahtml.WithClasses(false)),
),
&anchorExtension{},
),
goldmark.WithRendererOptions(
renderer.WithNodeRenderers(
util.Prioritized(&escapedRawHTMLRenderer{}, 999),
),
),
),
tmpl: tmpl,
bufferPool: sync.Pool{
New: func() any {
return new(bytes.Buffer)
},
},
}, nil
}
func (c *Converter) Convert(md []byte, fallbackTitle string) (Result, error) {
body, title, hasH1, err := c.render(md)
if err != nil {
return Result{}, err
}
if title == "" {
title = fallbackTitle
}
buf := c.getBuffer()
defer c.putBuffer(buf)
data := templateData{
Lang: documentLang,
Title: title,
Body: template.HTML(body),
ShowTitle: !hasH1 && title != "",
}
if err := c.tmpl.Execute(buf, data); err != nil {
return Result{}, err
}
return Result{
HTML: append([]byte(nil), buf.Bytes()...),
Title: title,
}, nil
}
func (c *Converter) RenderBody(md []byte) ([]byte, string, error) {
body, title, _, err := c.render(md)
if err != nil {
return nil, "", err
}
return body, title, nil
}
func (c *Converter) render(md []byte) ([]byte, string, bool, error) {
root := c.md.Parser().Parse(text.NewReader(md))
doc, ok := root.(*ast.Document)
if !ok {
return nil, "", false, fmt.Errorf("expected *ast.Document, got %T", root)
}
title, hasH1 := extractDocumentTitle(doc, md)
buf := c.getBuffer()
defer c.putBuffer(buf)
if err := c.md.Renderer().Render(buf, md, doc); err != nil {
return nil, "", false, err
}
return append([]byte(nil), buf.Bytes()...), title, hasH1, nil
}
func extractDocumentTitle(doc *ast.Document, src []byte) (string, bool) {
var (
title string
hasH1 bool
)
_ = ast.Walk(doc, func(n ast.Node, entering bool) (ast.WalkStatus, error) {
if !entering {
return ast.WalkContinue, nil
}
h, ok := n.(*ast.Heading)
if !ok {
return ast.WalkContinue, nil
}
if h.Level == 1 {
hasH1 = true
}
if title == "" {
title = strings.TrimSpace(extractHeadingText(h, src))
}
return ast.WalkContinue, nil
})
return title, hasH1
}
func (c *Converter) getBuffer() *bytes.Buffer {
buf := c.bufferPool.Get().(*bytes.Buffer)
buf.Reset()
return buf
}
func (c *Converter) putBuffer(buf *bytes.Buffer) {
buf.Reset()
c.bufferPool.Put(buf)
}
+162
View File
@@ -0,0 +1,162 @@
package converter
import (
"bytes"
"os"
"path/filepath"
"strings"
"testing"
"github.com/fserg/md-to-html/web/template"
"github.com/yuin/goldmark/ast"
"github.com/yuin/goldmark/text"
)
func TestGolden(t *testing.T) {
c := newTestConverter(t)
update := os.Getenv("UPDATE_GOLDEN") == "1"
entries, err := os.ReadDir("testdata")
if err != nil {
t.Fatal(err)
}
for _, entry := range entries {
name := entry.Name()
if entry.IsDir() || !strings.HasSuffix(name, ".md") {
continue
}
t.Run(name, func(t *testing.T) {
md, err := os.ReadFile(filepath.Join("testdata", name))
if err != nil {
t.Fatal(err)
}
wantPath := filepath.Join("testdata", strings.TrimSuffix(name, ".md")+".html")
got, err := c.Convert(md, "Document")
if err != nil {
t.Fatal(err)
}
for _, forbidden := range []string{"http://", "https://", "cdn.", "googleapis.com"} {
if bytes.Contains(got.HTML, []byte(forbidden)) {
t.Fatalf("generated HTML contains forbidden external resource marker %q", forbidden)
}
}
if update {
if err := os.WriteFile(wantPath, got.HTML, 0o644); err != nil {
t.Fatal(err)
}
return
}
want, err := os.ReadFile(wantPath)
if err != nil {
t.Fatalf("missing golden %s; run UPDATE_GOLDEN=1", wantPath)
}
if !bytes.Equal(got.HTML, want) {
t.Errorf("mismatch: run UPDATE_GOLDEN=1 go test ./internal/converter/... to refresh")
}
})
}
}
func TestTranslitSlug(t *testing.T) {
tests := []struct {
name string
in string
want string
used map[string]int
}{
{name: "cyrillic", in: "Установка", want: "ustanovka", used: map[string]int{}},
{name: "collision first", in: "Install", want: "install", used: map[string]int{}},
{name: "collision second", in: "Install", want: "install-1", used: map[string]int{"install": 1}},
{name: "cyrillic translit", in: "Сетап", want: "setap", used: map[string]int{}},
{name: "empty fallback", in: "!!!", want: "section", used: map[string]int{}},
}
for _, tt := range tests {
t.Run(tt.name, func(t *testing.T) {
got := translitSlug(tt.in, tt.used)
if got != tt.want {
t.Fatalf("translitSlug(%q) = %q, want %q", tt.in, got, tt.want)
}
})
}
}
func TestExtractHeadingText(t *testing.T) {
c := newTestConverter(t)
src := []byte("## [API](https://example.com) `go fmt` https://example.com :rocket:\n")
doc := c.md.Parser().Parse(text.NewReader(src))
var heading *ast.Heading
_ = ast.Walk(doc, func(n ast.Node, entering bool) (ast.WalkStatus, error) {
if !entering {
return ast.WalkContinue, nil
}
if h, ok := n.(*ast.Heading); ok {
heading = h
return ast.WalkStop, nil
}
return ast.WalkContinue, nil
})
if heading == nil {
t.Fatal("heading not found")
}
got := extractHeadingText(heading, src)
want := "API go fmt https://example.com 🚀"
if got != want {
t.Fatalf("extractHeadingText() = %q, want %q", got, want)
}
}
func TestConvertTitleFromFirstHeading(t *testing.T) {
c := newTestConverter(t)
result, err := c.Convert([]byte("# Hello\n\nParagraph"), "fallback")
if err != nil {
t.Fatal(err)
}
if result.Title != "Hello" {
t.Fatalf("result.Title = %q, want %q", result.Title, "Hello")
}
if !bytes.Contains(result.HTML, []byte("<title>Hello</title>")) {
t.Fatalf("expected HTML title to contain Hello")
}
}
func TestConvertTitleFallback(t *testing.T) {
c := newTestConverter(t)
result, err := c.Convert([]byte("Paragraph only"), "fallback")
if err != nil {
t.Fatal(err)
}
if result.Title != "fallback" {
t.Fatalf("result.Title = %q, want %q", result.Title, "fallback")
}
if !bytes.Contains(result.HTML, []byte("<h1>fallback</h1>")) {
t.Fatalf("expected fallback h1 to be injected")
}
}
func newTestConverter(t *testing.T) *Converter {
t.Helper()
c, err := New(webtemplate.FS)
if err != nil {
t.Fatal(err)
}
return c
}
+45
View File
@@ -0,0 +1,45 @@
package converter
import (
"github.com/yuin/goldmark/ast"
"github.com/yuin/goldmark/renderer"
"github.com/yuin/goldmark/util"
)
type escapedRawHTMLRenderer struct{}
func (r *escapedRawHTMLRenderer) RegisterFuncs(reg renderer.NodeRendererFuncRegisterer) {
reg.Register(ast.KindHTMLBlock, r.renderHTMLBlock)
reg.Register(ast.KindRawHTML, r.renderRawHTML)
}
func (r *escapedRawHTMLRenderer) renderHTMLBlock(w util.BufWriter, source []byte, node ast.Node, entering bool) (ast.WalkStatus, error) {
n := node.(*ast.HTMLBlock)
if entering {
for i := 0; i < n.Lines().Len(); i++ {
line := n.Lines().At(i)
_, _ = w.Write(util.EscapeHTML(line.Value(source)))
}
return ast.WalkContinue, nil
}
if n.HasClosure() {
_, _ = w.Write(util.EscapeHTML(n.ClosureLine.Value(source)))
}
return ast.WalkContinue, nil
}
func (r *escapedRawHTMLRenderer) renderRawHTML(w util.BufWriter, source []byte, node ast.Node, entering bool) (ast.WalkStatus, error) {
if !entering {
return ast.WalkSkipChildren, nil
}
n := node.(*ast.RawHTML)
for i := 0; i < n.Segments.Len(); i++ {
segment := n.Segments.At(i)
_, _ = w.Write(util.EscapeHTML(segment.Value(source)))
}
return ast.WalkSkipChildren, nil
}
+26
View File
@@ -0,0 +1,26 @@
package converter
import (
"fmt"
"regexp"
"strings"
"github.com/mozillazg/go-unidecode"
)
var slugRe = regexp.MustCompile(`[^a-z0-9]+`)
func translitSlug(s string, used map[string]int) string {
t := strings.ToLower(unidecode.Unidecode(s))
t = slugRe.ReplaceAllString(t, "-")
t = strings.Trim(t, "-")
if t == "" {
t = "section"
}
if n, ok := used[t]; ok && n > 0 {
used[t] = n + 1
return fmt.Sprintf("%s-%d", t, n)
}
used[t] = 1
return t
}
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Document</h1>
<p>Contact <a href="mailto:dev@example.test">dev@example.test</a> for details.</p>
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
Contact <dev@example.test> for details.
+298
View File
@@ -0,0 +1,298 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Basic Example</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1 id="basic-example"><a href="#basic-example" class="heading-anchor">#</a>Basic Example</h1>
<p>Simple paragraph with <strong>bold</strong>, <em>italic</em>, and <a href="/docs">docs</a>.</p>
</main>
</body>
</html>
+3
View File
@@ -0,0 +1,3 @@
# Basic Example
Simple paragraph with **bold**, *italic*, and [docs](/docs).
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Document</h1>
<p>Ready to launch &#x1f680; today.</p>
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
Ready to launch :rocket: today.
+303
View File
@@ -0,0 +1,303 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Document</h1>
<pre style="background-color:#f7f7f7;-webkit-text-size-adjust:none;"><code><span style="display:flex;"><span><span style="color:#cf222e">package</span><span style="color:#fff"> </span><span style="color:#1f2328">main</span><span style="color:#fff">
</span></span></span><span style="display:flex;"><span><span style="color:#fff">
</span></span></span><span style="display:flex;"><span><span style="color:#cf222e">import</span><span style="color:#fff"> </span><span style="color:#0a3069">&#34;fmt&#34;</span><span style="color:#fff">
</span></span></span><span style="display:flex;"><span><span style="color:#fff">
</span></span></span><span style="display:flex;"><span><span style="color:#cf222e">func</span><span style="color:#fff"> </span><span style="color:#6639ba">main</span><span style="color:#1f2328">()</span><span style="color:#fff"> </span><span style="color:#1f2328">{</span><span style="color:#fff">
</span></span></span><span style="display:flex;"><span><span style="color:#fff"> </span><span style="color:#1f2328">fmt</span><span style="color:#1f2328">.</span><span style="color:#6639ba">Println</span><span style="color:#1f2328">(</span><span style="color:#0a3069">&#34;hello&#34;</span><span style="color:#1f2328">)</span><span style="color:#fff">
</span></span></span><span style="display:flex;"><span><span style="color:#1f2328">}</span><span style="color:#fff">
</span></span></span></code></pre>
</main>
</body>
</html>
@@ -0,0 +1,9 @@
```go
package main
import "fmt"
func main() {
fmt.Println("hello")
}
```
+305
View File
@@ -0,0 +1,305 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Document</h1>
<p>Footnote text.<sup id="fnref:1"><a href="#fn:1" class="footnote-ref" role="doc-noteref">1</a></sup></p>
<div class="footnotes" role="doc-endnotes">
<hr>
<ol>
<li id="fn:1">
<p>Extra details.&#160;<a href="#fnref:1" class="footnote-backref" role="doc-backlink">&#x21a9;&#xfe0e;</a></p>
</li>
</ol>
</div>
</main>
</body>
</html>
+3
View File
@@ -0,0 +1,3 @@
Footnote text.[^1]
[^1]: Extra details.
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>dev@example.test</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>dev@example.test</h1>
<h2 id="dev-example-test"><a href="#dev-example-test" class="heading-anchor">#</a><a href="mailto:dev@example.test">dev@example.test</a></h2>
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
## <dev@example.test>
+300
View File
@@ -0,0 +1,300 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Install</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Install</h1>
<h2 id="install"><a href="#install" class="heading-anchor">#</a>Install</h2>
<h2 id="install-1"><a href="#install-1" class="heading-anchor">#</a>Install</h2>
<h2 id="setup"><a href="#setup" class="heading-anchor">#</a>Setup</h2>
<h2 id="setap"><a href="#setap" class="heading-anchor">#</a>Сетап</h2>
</main>
</body>
</html>
+7
View File
@@ -0,0 +1,7 @@
## Install
## Install
## Setup
## Сетап
+299
View File
@@ -0,0 +1,299 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Привет</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1 id="privet"><a href="#privet" class="heading-anchor">#</a>Привет</h1>
<h2 id="ustanovka"><a href="#ustanovka" class="heading-anchor">#</a>Установка</h2>
<h3 id="bystryi-start"><a href="#bystryi-start" class="heading-anchor">#</a>Быстрый старт</h3>
</main>
</body>
</html>
+5
View File
@@ -0,0 +1,5 @@
# Привет
## Установка
### Быстрый старт
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>🚀 Launch</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>🚀 Launch</h1>
<h2 id="launch"><a href="#launch" class="heading-anchor">#</a>&#x1f680; Launch</h2>
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
## :rocket: Launch
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>alt Title</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>alt Title</h1>
<h2 id="alt-title"><a href="#alt-title" class="heading-anchor">#</a><img src="image.png" alt="alt"> Title</h2>
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
## ![alt](image.png) Title
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>API</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>API</h1>
<h2 id="api"><a href="#api" class="heading-anchor">#</a><a href="/api">API</a></h2>
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
## [API](/api)
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Using go fmt</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Using go fmt</h1>
<h2 id="using-go-fmt"><a href="#using-go-fmt" class="heading-anchor">#</a>Using <code>go fmt</code></h2>
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
## Using `go fmt`
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Document</h1>
&lt;script&gt;alert(1)&lt;/script&gt;
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
<script>alert(1)</script>
+297
View File
@@ -0,0 +1,297 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Document</h1>
<p>Use <del>old</del> new output.</p>
</main>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
Use ~~old~~ new output.
+314
View File
@@ -0,0 +1,314 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Document</h1>
<table>
<thead>
<tr>
<th>Name</th>
<th>Value</th>
</tr>
</thead>
<tbody>
<tr>
<td>Alpha</td>
<td>1</td>
</tr>
<tr>
<td>Beta</td>
<td>2</td>
</tr>
</tbody>
</table>
</main>
</body>
</html>
+4
View File
@@ -0,0 +1,4 @@
| Name | Value |
| --- | --- |
| Alpha | 1 |
| Beta | 2 |
+300
View File
@@ -0,0 +1,300 @@
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Document</title>
<style>
:root {
color-scheme: light;
--page-bg: #f8fafc;
--surface: #ffffff;
--border: #e2e8f0;
--border-strong: #cbd5e1;
--text: #0f172a;
--muted: #475569;
--code-bg: #f1f5f9;
--accent: #2563eb;
--accent-hover: #1d4ed8;
--quote-bg: #eff6ff;
--quote-border: #93c5fd;
--shadow: 0 20px 45px rgba(15, 23, 42, 0.08);
}
* {
box-sizing: border-box;
}
body {
margin: 0;
background: linear-gradient(180deg, #f8fafc 0%, #eef2ff 100%);
color: var(--text);
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
line-height: 1.7;
padding: 24px 16px 40px;
}
.document {
max-width: 960px;
margin: 0 auto;
background: var(--surface);
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 20px;
box-shadow: var(--shadow);
padding: 48px 56px;
}
.document > :first-child {
margin-top: 0;
}
.document h1,
.document h2,
.document h3,
.document h4,
.document h5,
.document h6 {
color: var(--text);
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.25;
margin: 1.75rem 0 0.85rem;
position: relative;
scroll-margin-top: 2rem;
}
.document h1 {
border-bottom: 1px solid var(--border);
font-size: 2.4rem;
padding-bottom: 0.5rem;
}
.document h2 {
border-bottom: 1px solid var(--border);
font-size: 1.85rem;
padding-bottom: 0.45rem;
}
.document h3 {
font-size: 1.45rem;
}
.document h4 {
font-size: 1.2rem;
}
.document h5,
.document h6 {
font-size: 1rem;
}
.document .heading-anchor {
color: var(--muted);
float: left;
margin-left: -1.25em;
opacity: 0;
padding-right: 0.3em;
text-decoration: none;
transition: opacity 0.18s ease;
user-select: none;
}
.document h1:hover .heading-anchor,
.document h2:hover .heading-anchor,
.document h3:hover .heading-anchor,
.document h4:hover .heading-anchor,
.document h5:hover .heading-anchor,
.document h6:hover .heading-anchor,
.document .heading-anchor:focus {
opacity: 0.65;
}
.document p,
.document ul,
.document ol,
.document blockquote,
.document table,
.document pre,
.document hr {
margin: 0 0 1rem;
}
.document ul,
.document ol {
padding-left: 1.7rem;
}
.document li + li {
margin-top: 0.3rem;
}
.document li > p {
margin-bottom: 0.5rem;
}
.document a {
color: var(--accent);
text-decoration: underline;
text-decoration-thickness: 0.08em;
text-underline-offset: 0.15em;
}
.document a:hover {
color: var(--accent-hover);
}
.document strong {
font-weight: 700;
}
.document em {
font-style: italic;
}
.document del {
color: var(--muted);
text-decoration-thickness: 0.08em;
}
.document blockquote {
background: var(--quote-bg);
border-left: 4px solid var(--quote-border);
border-radius: 0 12px 12px 0;
color: var(--muted);
padding: 1rem 1.2rem;
}
.document hr {
border: 0;
border-top: 1px solid var(--border);
}
.document code {
background: var(--code-bg);
border: 1px solid rgba(148, 163, 184, 0.18);
border-radius: 8px;
font-family: "SFMono-Regular", SFMono-Regular, Consolas, "Liberation Mono", Menlo, monospace;
font-size: 0.9em;
padding: 0.15em 0.4em;
}
.document pre {
background: #0f172a;
border-radius: 16px;
color: #e2e8f0;
overflow-x: auto;
padding: 1rem 1.1rem;
}
.document pre code {
background: transparent;
border: 0;
color: inherit;
display: block;
font-size: 0.92rem;
line-height: 1.6;
padding: 0;
white-space: pre;
}
.document img {
border: 1px solid rgba(148, 163, 184, 0.22);
border-radius: 14px;
display: block;
height: auto;
max-width: 100%;
}
.document table {
border-collapse: collapse;
display: block;
overflow-x: auto;
width: 100%;
}
.document th,
.document td {
border: 1px solid var(--border);
padding: 0.65rem 0.8rem;
text-align: left;
vertical-align: top;
}
.document th {
background: #f8fafc;
font-weight: 700;
}
.document tr:nth-child(even) td {
background: rgba(248, 250, 252, 0.7);
}
.document .task-list-item {
list-style: none;
margin-left: -1.55rem;
padding-left: 1.55rem;
}
.document .task-list-item input[type="checkbox"] {
accent-color: var(--accent);
margin-right: 0.5rem;
pointer-events: none;
transform: translateY(1px);
}
.document .footnotes {
border-top: 1px solid var(--border);
color: var(--muted);
font-size: 0.95rem;
margin-top: 2rem;
padding-top: 1rem;
}
.document .footnotes ol {
margin-bottom: 0;
}
@media (max-width: 768px) {
body {
padding: 16px 10px 28px;
}
.document {
border-radius: 16px;
padding: 28px 20px;
}
.document h1 {
font-size: 2rem;
}
.document h2 {
font-size: 1.55rem;
}
.document h3 {
font-size: 1.3rem;
}
.document .heading-anchor {
margin-left: -1.05em;
}
.document th,
.document td {
min-width: 140px;
}
}
</style>
</head>
<body>
<main class="document">
<h1>Document</h1>
<ul>
<li><input checked="" disabled="" type="checkbox"> Ship phase 2</li>
<li><input disabled="" type="checkbox"> Review output</li>
</ul>
</main>
</body>
</html>
+2
View File
@@ -0,0 +1,2 @@
- [x] Ship phase 2
- [ ] Review output