MediaWiki:Common.less/elements.less

From Old School RuneScape Wiki
Jump to navigation Jump to search
// <pre>
/* ===================
      HTML elements
   =================== */

:root {
	--base-text-color: @river-bed;
	--base-heading-color: @river-bed;
	--base-heading-border: @mystic;
	--mw-code-background-color: #ddd4bb;
	--ul-list-style-image: url("data:image/svg+xml,%3C?xml version='1.0' encoding='UTF-8'?%3E %3Csvg xmlns='http://www.w3.org/2000/svg' version='1.1' width='5' height='13'%3E %3Ccircle cx='2.5' cy='9.5' r='2.5' fill='%234c4c4c'/%3E %3C/svg%3E"); // change fill to #4c4c4c
	--body-background-image: url('filepath://Old_School_RuneScape_Wiki_background.jpg');
}
@base-text-color: var(--base-text-color);
@base-heading-color: var(--base-heading-color);
@base-heading-border: var(--base-heading-border);

/* --------------------
         headings
   -------------------- */

h1,
h2,
h3,
h4,
h5,
h6 {
	color: var(--text-color);
}

h1,
h2 {
	border-color: var(--sidebar);
}

.mw-body h1,
.mw-body-content h1,
.mw-body-content h2,
.mw-body-content h3,
.mw-body-content h4,
.mw-body-content h5,
.mw-body-content h6 {
	font-family: @serif-stack;
}

// Clear left on first subheader. Useful to start section after DIIs
.mw-parser-output h2:first-of-type {
	clear: left;
}

/* --------------------
       pre and code
   -------------------- */

pre,
code,
.mw-code {
	color: inherit; // default is bad #000
	background-color: var(--mw-code-background-color);
	border: 1px solid var(--body-border);
}

/* --------------------
           lists
   -------------------- */

ul {
	list-style-image: var(--ul-list-style-image);
}

ol {

    // match spacing of <p>
    .mw-content-ltr & {
        margin-bottom: .8em;
    }

}

// bold line margins
dl {
    margin: 0;
}

// for indents used in discussions to mimic threaded replies
dd {
    min-width: 17.85em;
}

/* -------------------------
       why is <hr> inset
   ------------------------- */

hr {
    border-color: var(--sidebar);
    border-style: solid;
    border-width: 1px 0 0 0;
    height: initial;
}