MediaWiki:Common.css
Jump to navigation
Jump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Mono|IBM+Plex+Sans|IBM+Plex+Serif&display=swap');
/*
Theme Name: Perpendicular Angel Design
Theme URI: https://www.perpendicularangel.com
Author: anne m. gibson
Author URI: https://www.perpendicularangel.com
Description: hacking my own wiki
Version: 1.0
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Resets
2.0 Alignments
3.0 Clearings
4.0 Typography
6.0 Forms
7.0 Formatting
8.0 Lists
9.0 Tables
10.0 Links
--------------------------------------------------------------*/
/*--------------------------------------------------------------
1.0 Resets - getting rid of mediawiki crap i don't like
--------------------------------------------------------------*/
.mw-body {
border: 1px solid rgb(221, 221, 221);
color: #333;
}
.mw-body .firstHeading {
padding-top: 0;
}
.mw-body-content {
font-size: inherit;
}
/* header */
#mw-head-base {
margin-top: -4.14em;
}
#p-personal li, div.vectorTabs li a {
font-size: 14px;
font-size: 0.875rem;
}
#pt-userpage, #pt-anonuserpage {
background: none;
}
#left-navigation,
#right-navigation {
margin-top: 3.25em;
}
div.vectorTabs{
background-image:none;
border: 1px solid rgb(221, 221, 221);
}
div.vectorTabs span {
background-image:none;
}
div.vectorTabs span a {
padding-top: 0.875em;
}
div.vectorTabs ul {
background-image: none;
}
div.vectorTabs ul li {
background-image: none;
}
div.vectorTabs li.selected {
background-image: none;
border-bottom-color: #fff;
background-color: #fff;
}
div#mw-head div.vectorMenu h3 {
background-image:none;
font-family: "IBM Plex Sans", sans-serif;
font-size: 0.875rem;
height: 2.5em;
}
div.vectorMenu h3 span {
font-size: 1em;
font-weight: bold;
padding: 0.875em 1.5em 0 0.5em;
margin: 0;
color: #70065c;
text-decoration: underline;
}
/* left nav */
div#mw-panel div.portal div.body ul li {
font-size: 1rem;
}
/* content */
.catlinks {
padding: 8px;
}
#mw-subcategories {
padding-top: 1rem;
}
/*
#mw-category-media {
display: none;
}
*/
/*--------------------------------------------------------------
2.0 Alignments
--------------------------------------------------------------*/
.alignleft {
display: inline;
float: left;
margin-right: 1.5em;
}
.alignright {
display: inline;
float: right;
margin-left: 1.5em;
}
.aligncenter {
clear: both;
display: block;
margin-left: auto;
margin-right: auto;
}
/*--------------------------------------------------------------
3.0 Clearings
--------------------------------------------------------------*/
.clear:before,
.clear:after
{
content: "";
display: table;
table-layout: fixed;
}
.clear:after {
clear: both;
}
/*--------------------------------------------------------------
4.0 Typography
--------------------------------------------------------------*/
body,
button,
input,
select,
textarea {
font-family: 'IBM Plex Sans', sans-serif;
color: #333;
}
h1, .mw-body h1,
h2, .mw-body h2,
h3, .mw-body h3,
h4, .mw-body h4,
h5, .mw-body h5,
h6, .mw-body h6 {
clear: both;
color: #333;
font-family: 'IBM Plex Serif', serif;
line-height: 1.5;
margin: 0 0 0.75em;
padding: 1em 0 0;
}
h1:first-child, .mw-body h1:first-child,
h2:first-child, .mw-body h2:first-child,
h3:first-child, .mw-body h3:first-child,
h4:first-child, .mw-body h4:first-child,
h5:first-child, .mw-body h5:first-child,
h6:first-child, .mw-body h6:first-child {
padding-top: 0;
}
h1, .mw-body h1 {
font-size: 29px;
font-size: 1.8rem;
}
h2, .mw-body h2 {
font-size: 26px;
font-size: 1.6rem;
}
h3, .mw-body h3 {
font-size: 23px;
font-size: 1.4rem;
}
h4, .mw-body h4 {
font-size: 20px;
font-size: 1.2rem;
}
h5, .mw-body h5 {
font-size: 18px;
font-size: 1.1rem;
}
h6, .mw-body h6 {
font-size: 16px;
font-size: 1rem;
font-weight: 800;
}
p, .mw-body p {
font-size: 16px;
font-size: 1rem;
margin: 0 0 1.5em;
padding: 0;
}
dfn,
cite,
em,
i {
font-style: italic;
}
blockquote {
/*
background-color: #e6e6f4;
*/
background-color: #F1F1F9;
border-radius: 8px;
color: #1c146d;
/*
font-size: 18px;
font-size: 1.125rem;
font-style: italic;
*/
line-height: 1.5;
margin:0 0 24 0;
padding: 20px;
}
blockquote cite {
display: block;
font-style: normal;
}
address {
margin: 0 0 1.5em;
}
pre
{
background: #e6e6f4;
border-radius: 8px;
font-family: 'IBM Plex Mono', Courier, monospace;
margin-bottom: 1.6em;
max-width: 100%;
overflow: auto;
padding: 1.5em;
}
code,
kbd,
tt,
var
{
font-family: 'IBM Plex Mono', Courier, monospace;
margin-bottom: 1.6em;
max-width: 100%;
overflow: auto;
}
abbr,
acronym {
border-bottom: 1px dotted #666;
cursor: help;
}
mark,
ins {
background: #eee;
text-decoration: none;
}
big {
font-size: 125%;
}
blockquote {
quotes: "" "";
}
q {
quotes: "“" "”" "‘" "’";
}
blockquote:before,
blockquote:after {
content: "";
}
:focus {
outline: 2px solid #633593;
background-color: #F9F3D2;
}
ul li {
margin-bottom: 0.5em;
}
/*--------------------------------------------------------------
6.0 Forms
--------------------------------------------------------------*/
button,
input[type="button"],
input[type="submit"] {
background-color: #3e002e;
border: 0;
border-radius: 4px;
color: #fff;
cursor: pointer;
display: inline-block;
font-size: 14px;
font-size: 0.875rem;
font-weight: 800;
line-height: 1;
padding: 1em 2em;
text-shadow: none;
-webkit-transition: background 0.2s;
transition: background 0.2s;
}
input + button,
input + input[type="button"],
input + input[type="submit"] {
padding: 0.75em 2em;
}
button.secondary,
input[type="reset"],
input[type="button"].secondary,
input[type="reset"].secondary,
input[type="submit"].secondary {
background-color: #570046;
color: #222;
}
button:hover,
button:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus {
background: #70065c;
}
button.secondary:hover,
button.secondary:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="button"].secondary:hover,
input[type="button"].secondary:focus,
input[type="reset"].secondary:hover,
input[type="reset"].secondary:focus,
input[type="submit"].secondary:hover,
input[type="submit"].secondary:focus {
background: #700c5c;
}
/* Placeholder text color -- selectors need to be separate to work. */
:placeholder {
color: #757575;
}
:-ms-input-placeholder {
color: #757575;
}
input, textarea, keygen, select {
font-size: 16px;
font-size: 1em;
}
/*--------------------------------------------------------------
7.0 Formatting
--------------------------------------------------------------*/
hr {
background-color: #bbb;
border: 0;
height: 1px;
margin-bottom: 1.5em;
}
/*--------------------------------------------------------------
8.0 Lists
--------------------------------------------------------------*/
.mw-content-ltr ul,
.mw-content-rtl .mw-content-ltr ul,
ul,
ol {
margin: 0.3em 0 1em 1.6em;
padding: 0;
}
ul {
list-style: disc;
}
ol {
list-style: decimal;
}
li > ul,
li > ol {
margin-bottom: 0;
margin-left: 1.5em;
}
dt {
font-weight: 700;
}
dd {
margin: 0 1.5em 1.5em;
}
/*--------------------------------------------------------------
9.0 Tables
--------------------------------------------------------------*/
table {
border-collapse: collapse;
margin: 0 0 1.5em;
width: 100%;
}
thead th {
border-bottom: 2px solid #bbb;
padding-bottom: 0.5em;
}
th {
padding: 0.4em;
text-align: left;
}
tr {
border-bottom: 1px solid #eee;
}
td {
padding: 0.4em;
}
th:first-child,
td:first-child {
padding-left: 0;
}
th:last-child,
td:last-child {
padding-right: 0;
}
/*--------------------------------------------------------------
10.0 Links
--------------------------------------------------------------*/
a,
div.vectorTabs li a,
div#mw-panel div.portal div.body ul li a {
color: #70065c;
font-weight: bold;
text-decoration: underline;
}
a:hover,
a:active,
div.vectorTabs li a:active {
color: #570046;
background-color: #F9F3D2;
}
a.new, #p-personal a.new {
color: #9c0808;
}
a.new::after,
#p-personal a.new::after,
div.vectorTabs li.new a::after,
div.vectorTabs li.new a:visited::after {
content:"➕";
}
#ca-unwatch.icon a,
#ca-watch.icon a,
#ca-unwatch.icon a:hover,
#ca-unwatch.icon a:focus,
#ca-watch.icon a:hover,
#ca-watch.icon a:focus {
margin: inherit;
padding:0.5em 0.875em 0 0.5em;
padding-top:0.875em;
display: inherit;
width: inherit;
height: 1.9em;
overflow: inherit;
background-image:none;
}