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

resources/css/markdown-editor.css
156 строк5 KB
evo
i18n: wire auth views to lang files
11 фев 2026, 10:55
11 фев 2026, 10:55fcc42fe
/* ============================================
   EASYMDE - LIGHT THEME
   ============================================ */

.markdown-editor .EasyMDEContainer {
    @apply rounded-2xl border border-slate-200 bg-white overflow-hidden;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08) !important;
    border-radius: 1rem !important;
    background: #ffffff !important;
}

.markdown-editor .EasyMDEContainer .editor-toolbar {
    @apply border-b border-slate-200 bg-slate-50;
    border-top-left-radius: 1rem !important;
    border-top-right-radius: 1rem !important;
    padding: 0.4rem 0.5rem !important;
    background: #f8fafc !important;
}

.markdown-editor .EasyMDEContainer .editor-toolbar button {
    @apply text-slate-600 rounded-md;
    margin: 0 2px !important;
    border: none !important;
}

.markdown-editor .EasyMDEContainer .editor-toolbar button:hover,
.markdown-editor .EasyMDEContainer .editor-toolbar button.active {
    @apply text-indigo-700 bg-indigo-50;
    background: #eef2ff !important;
}

.markdown-editor .EasyMDEContainer .CodeMirror,
.markdown-editor .EasyMDEContainer .CodeMirror.cm-s-easymde {
    @apply bg-white text-slate-900;
    border: none !important;
    max-height: 400px !important;
    font-family: inherit !important;
    font-size: 14px !important;
    line-height: 1.65 !important;
    background: #ffffff !important;
}

.markdown-editor .EasyMDEContainer .CodeMirror-scroll {
    padding: 0 1rem 1.25rem 1rem !important;
}

.markdown-editor .EasyMDEContainer .CodeMirror-gutters {
    @apply bg-white border-slate-200;
    background: #ffffff !important;
}

.markdown-editor .EasyMDEContainer .CodeMirror-cursor {
    border-left: 1px solid #0f172a !important;
}

.markdown-editor .EasyMDEContainer .editor-statusbar {
    @apply text-slate-400 border-t border-slate-200 bg-white;
    background: #ffffff !important;
}

.markdown-editor .EasyMDEContainer .editor-preview,
.markdown-editor .EasyMDEContainer .editor-preview-side {
    @apply bg-white text-slate-900;
    padding: 1rem 1.25rem !important;
    background: #ffffff !important;
}

/* ============================================
   EASYMDE - DARK THEME
   ============================================ */

.dark .markdown-editor .EasyMDEContainer {
    @apply border-slate-700 bg-slate-900;
    box-shadow: 0 12px 30px rgba(2, 6, 23, 0.5) !important;
    background: #0f172a !important;
}

.dark .markdown-editor .EasyMDEContainer .editor-toolbar {
    @apply border-slate-700 bg-slate-900;
    background: #0b1220 !important;
}

.dark .markdown-editor .EasyMDEContainer .editor-toolbar button {
    @apply text-slate-300 rounded-md;
}

.dark .markdown-editor .EasyMDEContainer .editor-toolbar button:hover,
.dark .markdown-editor .EasyMDEContainer .editor-toolbar button.active {
    @apply text-indigo-200 bg-indigo-900/40;
    background: rgba(49, 46, 129, 0.45) !important;
}

.dark .markdown-editor .EasyMDEContainer .CodeMirror,
.dark .markdown-editor .EasyMDEContainer .CodeMirror.cm-s-easymde {
    @apply bg-slate-900 text-slate-100;
    background: #0f172a !important;
}

.dark .markdown-editor .EasyMDEContainer .CodeMirror-gutters {
    @apply bg-slate-900 border-slate-700;
    background: #0f172a !important;
}

.dark .markdown-editor .EasyMDEContainer .CodeMirror-cursor {
    border-left: 1px solid #e2e8f0 !important;
}

.dark .markdown-editor .EasyMDEContainer .editor-statusbar {
    @apply text-slate-500 border-slate-700 bg-slate-900;
    background: #0f172a !important;
}

.dark .markdown-editor .EasyMDEContainer .editor-preview,
.dark .markdown-editor .EasyMDEContainer .editor-preview-side {
    @apply bg-slate-900 text-slate-100;
    padding: 1rem 1.25rem !important;
    background: #0f172a !important;
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 640px) {
    .markdown-editor .CodeMirror,
    .markdown-editor .EasyMDEContainer .CodeMirror.cm-s-easymde {
        max-height: 280px !important;
    }
}

/* ============================================
   TOOLBAR FIXES
   ============================================ */

.markdown-editor .EasyMDEContainer .editor-toolbar .separator {
    border-left: 1px solid #e2e8f0;
}

.dark .markdown-editor .EasyMDEContainer .editor-toolbar .separator {
    border-left: 1px solid #334155;
}

/* Match dashboard inputs */
.markdown-editor .EasyMDEContainer .CodeMirror-focused {
    box-shadow: inset 0 0 0 1px rgba(99, 102, 241, 0.25);
}

/* EasyMDE fullscreen/side-by-side overlay should sit above dashboard sidebar */
.editor-toolbar.fullscreen,
.CodeMirror-fullscreen,
.editor-preview-side {
    z-index: 60 !important;
}

/* Тема редактора управляется только классом .dark на html (как и остальное приложение).
   Не используем prefers-color-scheme, чтобы светлая тема в приложении не переключалась системной тёмной темой. */