resources/css/markdown-content.css - main - evo/docviz

resources/css/markdown-content.css
108 строк4 KB
evo
Fix markdown editor
09 фев 2026, 00:13
09 фев 2026, 00:13f7a315b
/* ============================================
   MARKDOWN CONTENT
   ============================================ */

.markdown-content {
    @apply text-slate-700 dark:text-slate-200 leading-relaxed;
}

.markdown-content p {
    @apply mb-4;
}

.markdown-content h1 {
    @apply text-3xl font-bold text-slate-900 dark:text-white mt-8 mb-4;
}

.markdown-content h2 {
    @apply text-2xl font-semibold text-slate-900 dark:text-white mt-8 mb-3;
}

.markdown-content h3 {
    @apply text-xl font-semibold text-slate-900 dark:text-white mt-6 mb-2;
}

.markdown-content h4 {
    @apply text-lg font-semibold text-slate-900 dark:text-white mt-6 mb-2;
}

.markdown-content ul {
    @apply list-disc pl-6 mb-4 list-outside;
}

.markdown-content ol {
    @apply list-decimal pl-6 mb-4 list-outside;
}

.markdown-content ul ul,
.markdown-content ol ul {
    @apply list-[circle] list-outside;
}

.markdown-content ul ul ul,
.markdown-content ol ul ul {
    @apply list-[square] list-outside;
}

.markdown-content ul ol,
.markdown-content ol ol {
    @apply list-decimal list-outside;
}

.markdown-content li {
    @apply mb-1 pl-1;
}

.markdown-content a {
    @apply text-indigo-600 dark:text-indigo-300 underline decoration-dotted underline-offset-4;
}

.markdown-content blockquote {
    @apply relative border border-l-4 border-slate-200 dark:border-slate-600 border-l-indigo-400 dark:border-l-indigo-500 bg-slate-50 dark:bg-slate-800/60 text-slate-600 dark:text-slate-300 px-4 py-3 pr-14 rounded-lg mb-4 italic;
}

.markdown-content blockquote::before {
    content: '';
    position: absolute;
    top: 1rem;
    right: 1rem;
    width: 2rem;
    height: 2rem;
    opacity: 0.4;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2364748b' viewBox='0 0 24 24'%3E%3Cpath d='M4.583 17.321C3.553 16.227 3 15 3 13.011c0-3.5 2.457-6.637 6.03-8.188l.893 1.378c-3.335 1.804-3.987 4.145-4.247 5.921.114-.032.272-.063.444-.084 2.043-.196 3.591.236 3.655 1.802.075 1.677-1.421 3.596-3.757 3.596-.272 0-.531-.032-.767-.094zm9.735 0C12.553 16.227 12 15 12 13.011c0-3.5 2.457-6.637 6.03-8.188l.893 1.378c-3.335 1.804-3.987 4.145-4.247 5.921.114-.032.272-.063.444-.084 2.043-.196 3.591.236 3.655 1.802.075 1.677-1.421 3.596-3.757 3.596-.272 0-.531-.032-.767-.094z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

html.dark .markdown-content blockquote::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%2394a3b8' viewBox='0 0 24 24'%3E%3Cpath d='M4.583 17.321C3.553 16.227 3 15 3 13.011c0-3.5 2.457-6.637 6.03-8.188l.893 1.378c-3.335 1.804-3.987 4.145-4.247 5.921.114-.032.272-.063.444-.084 2.043-.196 3.591.236 3.655 1.802.075 1.677-1.421 3.596-3.757 3.596-.272 0-.531-.032-.767-.094zm9.735 0C12.553 16.227 12 15 12 13.011c0-3.5 2.457-6.637 6.03-8.188l.893 1.378c-3.335 1.804-3.987 4.145-4.247 5.921.114-.032.272-.063.444-.084 2.043-.196 3.591.236 3.655 1.802.075 1.677-1.421 3.596-3.757 3.596-.272 0-.531-.032-.767-.094z'/%3E%3C/svg%3E");
}

.markdown-content blockquote p {
    @apply mb-2 last:mb-0;
}

.markdown-content code:not(pre code) {
    @apply rounded px-2 py-1 text-sm font-mono;
}

html:not(.dark) .markdown-content code:not(pre code) {
    @apply bg-slate-50 text-slate-800 border border-slate-200;
}

html.dark .markdown-content code:not(pre code) {
    @apply bg-slate-900 text-slate-200 border border-slate-700;
}

.markdown-content pre {
    @apply p-4 text-sm font-mono;
}

.markdown-content pre code {
    @apply bg-transparent p-0 text-inherit;
}

.markdown-content hr {
    @apply border-slate-200 dark:border-slate-700 my-6;
}