css snippet for Markdown BBCode [md]

[Chip (OP)]

Code: [Select]

/* Markdown [md] tag styling */
.md-block {
line-height: 1.5;
}

.md-block h1,
.md-block h2,
.md-block h3,
.md-block h4,
.md-block h5,
.md-block h6 {
margin: 0.8em 0 0.4em;
line-height: 1.25;
font-weight: 600;
}

.md-block h1 { font-size: 1.6em; border-bottom: 1px solid #444; padding-bottom: 0.2em; }
.md-block h2 { font-size: 1.4em; border-bottom: 1px solid #444; padding-bottom: 0.2em; }
.md-block h3 { font-size: 1.2em; }
.md-block h4 { font-size: 1.05em; }

.md-block p {
margin: 0.6em 0;
}

.md-block ul,
.md-block ol {
margin: 0.5em 0 0.5em 1.4em;
padding: 0;
}

.md-block li {
margin: 0.15em 0;
}

.md-block blockquote {
margin: 0.6em 0;
padding: 0.3em 1em;
border-left: 3px solid #888;
background: rgba(128, 128, 128, 0.08);
color: inherit;
}

.md-block hr {
border: none;
border-top: 1px solid #555;
margin: 1em 0;
}

.md-block code {
font-family: Consolas, Monaco, "Courier New", monospace;
background: rgba(128, 128, 128, 0.15);
padding: 0.1em 0.35em;
border-radius: 3px;
font-size: 0.9em;
}

.md-block pre.md-code-block {
background: #1e1e1e;
color: #d4d4d4;
padding: 0.8em 1em;
border-radius: 4px;
overflow-x: auto;
margin: 0.6em 0;
line-height: 1.4;
}

.md-block pre.md-code-block code {
background: none;
padding: 0;
color: inherit;
font-size: 0.9em;
}

.md-block a {
text-decoration: underline;
}

.md-block img {
max-width: 100%;
height: auto;
border-radius: 4px;
}
.md-block table.md-table {
border-collapse: collapse;
width: 100%;
margin: 0.8em 0;
}

.md-block table.md-table th,
.md-block table.md-table td {
border: 1px solid #555;
padding: 0.4em 0.7em;
text-align: left;
}

.md-block table.md-table th {
background: rgba(128, 128, 128, 0.15);
font-weight: 600;
}

.md-block table.md-table tr:nth-child(even) td {
background: rgba(128, 128, 128, 0.05);
}
.md-block table.md-table,
.md-block table.md-table th,
.md-block table.md-table td {
border: 1px solid #555 !important;
border-collapse: collapse !important;
}

1. Log into your forum as admin
2. Go to **Admin Control Panel** → **Themes and Layout** → **Edit Style Sheet** (sometimes listed under "Edit Themes" then "Edit Style Sheet")
3. Pick which stylesheet to edit — if your theme has a `custom.css` (or similar), use that one rather than the main `index.css`, since a separate file survives if you ever update or reset the theme
4. Scroll to the bottom of that file and paste the whole CSS snippet I gave you
5. Save

That's it — no restart, no cache clear needed for most SMF setups; refresh a page with an `[md]` post on it and the styling should apply immediately.

If you don't see "Edit Style Sheet" in that menu on this fork, tell me what options *are* listed under Themes and Layout and I'll point you to the right one rather than guess.