Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
((by SublimeText.Mediawiker)) |
((by SublimeText.Mediawiker)) |
||
(57 intermediate revisions by the same user not shown) | |||
Line 2: | Line 2: | ||
text-align: right; | text-align: right; | ||
font-size: 15px; | font-size: 15px; | ||
− | + | white-space: nowrap; | |
} | } | ||
Line 77: | Line 77: | ||
.white-box { | .white-box { | ||
margin-bottom: 30px; | margin-bottom: 30px; | ||
− | max-width: | + | max-width: 900px; |
− | + | padding: 30px 50px 30px; | |
− | + | float: left; | |
} | } | ||
Line 184: | Line 184: | ||
} | } | ||
− | .person-infobox | + | .person-infobox { |
+ | min-width: 700px; | ||
+ | } | ||
.person-infobox dt { | .person-infobox dt { | ||
Line 190: | Line 192: | ||
font-style: italic; | font-style: italic; | ||
color: #424242; | color: #424242; | ||
+ | margin-top: 7px; | ||
} | } | ||
Line 261: | Line 264: | ||
} | } | ||
.halfsies.left { | .halfsies.left { | ||
− | + | padding-right: 14px; | |
− | + | margin-right: 14px; | |
− | + | border-right: 1px solid #aaa; | |
} | } | ||
.thirdsies { | .thirdsies { | ||
Line 272: | Line 275: | ||
code, .code { | code, .code { | ||
− | + | padding: 2px 4px; | |
− | + | font-size: 90%; | |
− | + | color: #c7254e; | |
− | + | background-color: #f9f2f4; | |
− | + | border-radius: 4px; | |
} | } | ||
Line 291: | Line 294: | ||
} | } | ||
− | .guide-toggle, | + | .guide-toggle, .guide-toggle-all { |
display: inline-block; | display: inline-block; | ||
margin: -20px 7px 5px; | margin: -20px 7px 5px; | ||
Line 301: | Line 304: | ||
.FormTopNotice { | .FormTopNotice { | ||
background: #ffeedf; | background: #ffeedf; | ||
− | |||
line-height: 1.4; | line-height: 1.4; | ||
border-bottom: 1px solid #aaa; | border-bottom: 1px solid #aaa; | ||
border-top: 1px solid #aaa; | border-top: 1px solid #aaa; | ||
− | margin: 0 -1. | + | } |
+ | |||
+ | table.term-form > tr > th, | ||
+ | table.term-form > * > tr > th { | ||
+ | background-color: rgb(233, 239, 251); | ||
+ | font-weight: 400; | ||
+ | text-align: right; | ||
+ | font-style: italic; | ||
+ | } | ||
+ | |||
+ | table.term-form > tr > th, | ||
+ | table.term-form > tr > td, | ||
+ | table.term-form > * > tr > th, | ||
+ | table.term-form > * > tr > td { | ||
+ | padding: 0.5em 0.7em; | ||
+ | vertical-align: top; | ||
+ | } | ||
+ | |||
+ | table.term-form label.checkboxLabel { | ||
+ | display: table; | ||
+ | margin-bottom: .2em; | ||
+ | } | ||
+ | |||
+ | |||
+ | a:focus, | ||
+ | h1:focus, | ||
+ | h2:focus, | ||
+ | h3:focus, | ||
+ | h4:focus, | ||
+ | h5:focus, | ||
+ | h6:focus { | ||
+ | outline: none; | ||
+ | } | ||
+ | |||
+ | .add-link a.external { | ||
+ | font-weight: bold !important; | ||
+ | font-family: 'Open Sans',sans-serif; | ||
+ | font-size: 1.1em; | ||
+ | border: none; | ||
+ | background: none; | ||
+ | color: rgb(51, 102, 204) !important; | ||
+ | } | ||
+ | |||
+ | .ns-0.action-formedit #pageNameFromField { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .ellipsis { | ||
+ | white-space: nowrap; | ||
+ | overflow: hidden; | ||
+ | text-overflow: ellipsis; | ||
+ | } | ||
+ | |||
+ | .bootstable { | ||
+ | width: 100%; | ||
+ | max-width: 100%; | ||
+ | margin-bottom: 1rem; | ||
+ | background-color: rgba(0, 0, 0, 0); | ||
+ | border-collapse: collapse; | ||
+ | } | ||
+ | |||
+ | .bootstable th { | ||
+ | text-align: inherit; | ||
+ | font-weight: normal; | ||
+ | font-style: italic; | ||
+ | } | ||
+ | |||
+ | .bootstable th, | ||
+ | .bootstable td { | ||
+ | padding: .75rem; | ||
+ | vertical-align: top; | ||
+ | border-top: 1px solid rgb(171, 171, 171); | ||
+ | } | ||
+ | |||
+ | .bootstable thead th { | ||
+ | vertical-align: bottom; | ||
+ | border-bottom: 2px solid rgb(171, 171, 171); | ||
+ | } | ||
+ | |||
+ | .th-right th { | ||
+ | text-align: right; | ||
+ | } | ||
+ | |||
+ | .first-row-no-border tr:first-of-type th, | ||
+ | .first-row-no-border tr:first-of-type td { | ||
+ | border: none !important; | ||
+ | } | ||
+ | |||
+ | ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ | ||
+ | color: rgb(183, 183, 183)!important; | ||
+ | } | ||
+ | |||
+ | :-ms-input-placeholder { /* Internet Explorer 10-11 */ | ||
+ | color: rgb(183, 183, 183)!important; | ||
+ | } | ||
+ | |||
+ | ::-ms-input-placeholder { /* Microsoft Edge */ | ||
+ | color: rgb(183, 183, 183)!important; | ||
+ | } | ||
+ | |||
+ | .th-nowrap th, | ||
+ | .nowrap { | ||
+ | white-space: nowrap; | ||
+ | } | ||
+ | |||
+ | .th-top-right th { | ||
+ | vertical-align: top!important; | ||
+ | text-align: right!important; | ||
+ | } | ||
+ | |||
+ | .d-table, | ||
+ | .checkboxLabel { | ||
+ | display: table !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | .checkboxesSpan { | ||
+ | display: block; | ||
+ | -webkit-column-count: 3; | ||
+ | -moz-column-count: 3; | ||
+ | column-count: 3; | ||
+ | -webkit-column-width: 20em; | ||
+ | -moz-column-width: 20em; | ||
+ | column-width: 20em; | ||
+ | -webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */ | ||
+ | page-break-inside: avoid; /* Firefox */ | ||
+ | break-inside: avoid; /* IE 10+ */ | ||
+ | } | ||
+ | |||
+ | .columns { | ||
+ | -webkit-column-count: 3; | ||
+ | -moz-column-count: 3; | ||
+ | column-count: 3; | ||
+ | -webkit-column-width: 20em; | ||
+ | -moz-column-width: 20em; | ||
+ | column-width: 20em; | ||
+ | -webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */ | ||
+ | page-break-inside: avoid; /* Firefox */ | ||
+ | break-inside: avoid; /* IE 10+ */ | ||
+ | } | ||
+ | |||
+ | .medium-columns { | ||
+ | -webkit-column-count: 3; | ||
+ | -moz-column-count: 3; | ||
+ | column-count: 3; | ||
+ | -webkit-column-width: 13em; | ||
+ | -moz-column-width: 13em; | ||
+ | column-width: 13em; | ||
+ | -webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */ | ||
+ | page-break-inside: avoid; /* Firefox */ | ||
+ | break-inside: avoid; /* IE 10+ */ | ||
+ | } | ||
+ | |||
+ | .small-columns { | ||
+ | -webkit-column-count: 3; | ||
+ | -moz-column-count: 3; | ||
+ | column-count: 3; | ||
+ | -webkit-column-width: 10em; | ||
+ | -moz-column-width: 10em; | ||
+ | column-width: 10em; | ||
+ | -webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */ | ||
+ | page-break-inside: avoid; /* Firefox */ | ||
+ | break-inside: avoid; /* IE 10+ */ | ||
+ | } | ||
+ | |||
+ | .max-1200 { | ||
+ | max-width: 1200px; | ||
+ | } | ||
+ | |||
+ | .smwtable-clean { | ||
+ | width: 100%; | ||
+ | } | ||
+ | |||
+ | .figure-form-nav a { | ||
+ | display: inline-block; | ||
+ | padding: .4em .7em; | ||
+ | background: #eaeaea; | ||
+ | border-right: 1px solid lightgrey; | ||
+ | } | ||
+ | |||
+ | .figure-form-nav a:hover { | ||
+ | background: lightgrey; | ||
} | } |
Latest revision as of 14:18, 19 January 2022
.personForm th {
text-align: right;
font-size: 15px;
white-space: nowrap;
}
.personForm p {
font-size: 15px;
}
/* NEW CSS FROM JEREMI */
.lightText {color: #ccc;}
.lightText a, .lightText a.external {color: #7aacff;}
.lightText a:visited, .lightText a.external:visited {color: #a39de6;}
.green-box {
margin-bottom: 30px;
padding: 0 30px 20px;
background-color: #f5fff3;
}
.green-box-header {
font-size: 16px;
font-weight: 400;
text-align: center;
margin-bottom: 15px;
padding: 10px;
border-bottom: 1px solid #ea4100;
}
.red-box {
margin-bottom: 30px;
padding: 0 30px 20px;
background: #fff6f6;
}
.red-box-header {
font-size: 16px;
font-weight: 400;
text-align: center;
margin-bottom: 15px;
padding: 10px;
border-bottom: 1px solid #ea4100;
}
.blue-box {
margin-bottom: 30px;
padding: 0 30px 20px;
background: #e4f2ff;
}
.blue-box-header {
font-size: 16px;
font-weight: 400;
text-align: center;
margin-bottom: 15px;
padding: 10px;
border-bottom: 1px solid #ea4100;
}
.yellow-box {
margin-bottom: 30px;
padding: 0 30px 20px;
background: #ffffe5;
}
.yellow-box-header {
font-size: 16px;
font-weight: 400;
text-align: center;
margin-bottom: 15px;
padding: 10px;
border-bottom: 1px solid #ea4100;
}
.white-box {
margin-bottom: 30px;
max-width: 900px;
padding: 30px 50px 30px;
float: left;
}
.white-box-header {
font-size: 16px;
font-weight: 400;
text-align: center;
margin-bottom: 15px;
padding: 10px;
border-bottom: 1px solid #ea4100;
}
#headertabs.large.ui-widget {
margin-top: .7em;
}
a:focus {outline: none;}
.depth-0 {border: 1px solid rgba(0, 0, 0, .16);}
.depth-1 {
-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .16), 0 2px 10px 0 rgba(0, 0, 0, .12);
}
.depth-2 {
-webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .18), 0 4px 15px 0 rgba(0, 0, 0, .15);
}
.depth-3 {
-webkit-box-shadow: 0 8px 17px 0 rgba(0, 0, 0, .2), 0 6px 20px 0 rgba(0, 0, 0, .19);
box-shadow: 0 8px 17px 0 rgba(0, 0, 0, .2), 0 6px 20px 0 rgba(0, 0, 0, .19);
}
.depth-4 {
-webkit-box-shadow: 0 12px 15px 0 rgba(0, 0, 0, .24), 0 17px 50px 0 rgba(0, 0, 0, .19);
box-shadow: 0 12px 15px 0 rgba(0, 0, 0, .24), 0 17px 50px 0 rgba(0, 0, 0, .19);
}
.depth-5 {
-webkit-box-shadow: 0 16px 28px 0 rgba(0, 0, 0, .22), 0 25px 55px 0 rgba(0, 0, 0, .21);
box-shadow: 0 16px 28px 0 rgba(0, 0, 0, .22), 0 25px 55px 0 rgba(0, 0, 0, .21);
}
.depth-6 {
-webkit-box-shadow: 0 27px 24px 0 rgba(0, 0, 0, .2), 0 40px 77px 0 rgba(0, 0, 0, .22);
box-shadow: 0 27px 24px 0 rgba(0, 0, 0, .2), 0 40px 77px 0 rgba(0, 0, 0, .22);
}
.z-100 {z-index: 100;}
.z-200 {z-index: 200;}
.z-300 {z-index: 300;}
.z-400 {z-index: 400;}
.z-500 {z-index: 500;}
.z-600 {z-index: 600;}
.z-700 {z-index: 700;}
.z-800 {z-index: 800;}
.z-900 {z-index: 900;}
.trans-3 {transition-duration: .3s;}
.trans-5 {transition-duration: .5s;}
.trans-10 {transition-duration: 1s;}
.anim-1 {animation-duration: .1s !important;}
.anim-2 {animation-duration: .2s !important;}
.anim-3 {animation-duration: .3s !important;}
.anim-5 {animation-duration: .5s !important;}
.anim-10 {animation-duration: 1s !important;}
.column {
float: left;
width: 50%;
}
@media (max-width: 600px) {
.column {
width: 100%;
}
}
/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}
.personInfoHeadings {
width: 100%;
font-style: italic;
border-bottom: 1px solid #ea4100;
margin-top: 13px;
padding-bottom: 2px;
margin-bottom: 5px;
color: #424242;
font-weight: 400;
}
.personTemplate th, .light-header {
text-align: right;
font-style: italic;
color: #424242;
font-weight: 300;
}
.person-infobox {
min-width: 700px;
}
.person-infobox dt {
font-weight: 300;
font-style: italic;
color: #424242;
margin-top: 7px;
}
.personImages img {
margin: 10px 10px 0px 0px;
height: 200px;
width: auto;
}
.reduced-margins {
margin: 1em 0 !important;
}
.term-form {
margin: 0 0 30px;
padding: 20px 40px;
background: #e0f1ff;
}
.term-form .mw-editsection {display: none;}
.term-form input, .term-form textarea {
font-size: 13px;
}
.file-info {
margin: 30px;
background: #edf4ff;
max-width: 900px;
}
.licence-container {
margin: 30px;
background: #fbecb41a;
max-width: 900px;
}
.file-info .mw-editsection, .licence-container .mw-editsection {display: none;}
.file-info-header, .licence-header {
font-size: x-large;
padding: 10px;
text-align: center;
font-family: 'Gotham Black', sans-serif;
border-bottom: 1px solid #dc3948;
}
.sub-header {
font-size: large;
text-align: center;
font-weight: 600;
font-family: 'Montserrat', sans-serif;
}
.file-info-description, .licence-description {
padding: 20px;
}
.lift-5 {padding-bottom: 5px; margin-left: -5px;}
.float-r {float: right;}
.personForm .mw-editsection, .personForm .ht-editsection {display: none;}
.personForm .ui-widget-content {background: #f0f6ff;}
@media screen and (min-width: 850px) {
.halfsies {
float: left;
width: 47%;
}
.halfsies.left {
padding-right: 14px;
margin-right: 14px;
border-right: 1px solid #aaa;
}
.thirdsies {
float: left;
width: 30%;
}
}
code, .code {
padding: 2px 4px;
font-size: 90%;
color: #c7254e;
background-color: #f9f2f4;
border-radius: 4px;
}
.guide {
color: #000;
background-color: #f9f9f9;
border: 1px solid #ddd;
padding: .5em;
clear: both;
}
.guide-content {
display: none;
}
.guide-toggle, .guide-toggle-all {
display: inline-block;
margin: -20px 7px 5px;
cursor: pointer;
float: right;
color: tomato;
}
.FormTopNotice {
background: #ffeedf;
line-height: 1.4;
border-bottom: 1px solid #aaa;
border-top: 1px solid #aaa;
}
table.term-form > tr > th,
table.term-form > * > tr > th {
background-color: rgb(233, 239, 251);
font-weight: 400;
text-align: right;
font-style: italic;
}
table.term-form > tr > th,
table.term-form > tr > td,
table.term-form > * > tr > th,
table.term-form > * > tr > td {
padding: 0.5em 0.7em;
vertical-align: top;
}
table.term-form label.checkboxLabel {
display: table;
margin-bottom: .2em;
}
a:focus,
h1:focus,
h2:focus,
h3:focus,
h4:focus,
h5:focus,
h6:focus {
outline: none;
}
.add-link a.external {
font-weight: bold !important;
font-family: 'Open Sans',sans-serif;
font-size: 1.1em;
border: none;
background: none;
color: rgb(51, 102, 204) !important;
}
.ns-0.action-formedit #pageNameFromField {
display: none;
}
.ellipsis {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.bootstable {
width: 100%;
max-width: 100%;
margin-bottom: 1rem;
background-color: rgba(0, 0, 0, 0);
border-collapse: collapse;
}
.bootstable th {
text-align: inherit;
font-weight: normal;
font-style: italic;
}
.bootstable th,
.bootstable td {
padding: .75rem;
vertical-align: top;
border-top: 1px solid rgb(171, 171, 171);
}
.bootstable thead th {
vertical-align: bottom;
border-bottom: 2px solid rgb(171, 171, 171);
}
.th-right th {
text-align: right;
}
.first-row-no-border tr:first-of-type th,
.first-row-no-border tr:first-of-type td {
border: none !important;
}
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
color: rgb(183, 183, 183)!important;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
color: rgb(183, 183, 183)!important;
}
::-ms-input-placeholder { /* Microsoft Edge */
color: rgb(183, 183, 183)!important;
}
.th-nowrap th,
.nowrap {
white-space: nowrap;
}
.th-top-right th {
vertical-align: top!important;
text-align: right!important;
}
.d-table,
.checkboxLabel {
display: table !important;
}
.checkboxesSpan {
display: block;
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 20em;
-moz-column-width: 20em;
column-width: 20em;
-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
page-break-inside: avoid; /* Firefox */
break-inside: avoid; /* IE 10+ */
}
.columns {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 20em;
-moz-column-width: 20em;
column-width: 20em;
-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
page-break-inside: avoid; /* Firefox */
break-inside: avoid; /* IE 10+ */
}
.medium-columns {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 13em;
-moz-column-width: 13em;
column-width: 13em;
-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
page-break-inside: avoid; /* Firefox */
break-inside: avoid; /* IE 10+ */
}
.small-columns {
-webkit-column-count: 3;
-moz-column-count: 3;
column-count: 3;
-webkit-column-width: 10em;
-moz-column-width: 10em;
column-width: 10em;
-webkit-column-break-inside: avoid; /* Chrome, Safari, Opera */
page-break-inside: avoid; /* Firefox */
break-inside: avoid; /* IE 10+ */
}
.max-1200 {
max-width: 1200px;
}
.smwtable-clean {
width: 100%;
}
.figure-form-nav a {
display: inline-block;
padding: .4em .7em;
background: #eaeaea;
border-right: 1px solid lightgrey;
}
.figure-form-nav a:hover {
background: lightgrey;
}