MediaWiki:Common.css: Difference between revisions
((by SublimeText.Mediawiker)) |
((by SublimeText.Mediawiker)) |
||
(91 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; | ||
padding: | max-width: 900px; | ||
padding: 30px 50px 30px; | |||
float: left; | |||
} | } | ||
Line 180: | Line 182: | ||
color: #424242; | color: #424242; | ||
font-weight: 300; | font-weight: 300; | ||
} | |||
.person-infobox { | |||
min-width: 700px; | |||
} | } | ||
Line 186: | Line 192: | ||
font-style: italic; | font-style: italic; | ||
color: #424242; | color: #424242; | ||
margin-top: 7px; | |||
} | } | ||
Line 239: | Line 246: | ||
} | } | ||
.licence-description { | .file-info-description, .licence-description { | ||
padding: 20px; | 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; | |||
} | } |
Latest revision as of 13: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;
}