MediaWiki:Common.css: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
No edit summary |
||
(43 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
/* CSS | /* CSS Document */ | ||
@font-face { | |||
font-family: "Pathfinder2EActions"; | |||
src: url("images/9/9f/Pathfinder2eActions.woff2") format("woff2"); | |||
font- | |||
} | } | ||
span.action { | |||
font-family: "Pathfinder2EActions"; | |||
font-size: calc(1em * 1.4); | |||
line-height: normal; | |||
} | } | ||
.action.action-1:before { | |||
content: ' 1'; | |||
} | } | ||
.action.action-2:before { | |||
content: ' 2'; | |||
} | } | ||
.action.action-3:before { | |||
. | content: ' 3'; | ||
. | |||
} | } | ||
.action.action-4:before { | |||
content: ' 4'; | |||
. | |||
} | } | ||
.action.action-5:before { | |||
content: ' 5'; | |||
} | } | ||
.cards { | |||
. | margin: 0 auto; | ||
display: grid; | |||
gap: 1rem; | |||
overflow: auto; | |||
} | } | ||
@media (min-width: 888px) { | |||
.cards { | |||
grid-template-columns: repeat(2, 1fr); | |||
} | |||
} | } | ||
.card { | |||
padding: 1rem; | |||
} | } | ||
.card.pfFeat { | |||
background-color: antiquewhite; | |||
. | |||
background-color: | |||
} | } | ||
.pfHeader { | |||
border-bottom: 1px solid black; | |||
. | text-transform: uppercase; | ||
} | } | ||
.clearfix:after { | |||
content: "\00A0"; | |||
display: block; | |||
. | |||
content: | |||
clear: both; | clear: both; | ||
visibility: hidden; | |||
line-height: 0; | |||
height: 0; | |||
} | } | ||
.pfName { | |||
. | |||
float: left; | float: left; | ||
} | } | ||
.pfLevel { | |||
. | |||
float: right; | float: right; | ||
} | } | ||
.pfTags { | |||
color: white; | |||
display: inline-block; | |||
background-color: maroon; | |||
. | border: 1px solid yellow; | ||
text-transform: uppercase; | |||
padding: 0.15em 0.3em; | |||
} | } | ||
.pfPrereq { | |||
border-bottom: 1px solid black; | |||
. | |||
} | } | ||
.lang { | |||
position: relative; | |||
display: inline-block; | |||
} | } | ||
. | .lang .tooltiplang { | ||
visibility: hidden; | |||
width: 120px; | |||
background-color: black; | |||
color: #fff; | |||
text-align: center; | |||
border-radius: 6px; | |||
padding: 5px 0; | |||
position: absolute; | |||
z-index: 1; | |||
top: 150%; | |||
left: 50%; | |||
margin-left: -60px; | |||
} | } | ||
. | .lang .tooltiplang::after { | ||
content: ""; | |||
position: absolute; | |||
bottom: 100%; | |||
left: 50%; | |||
margin-left: -5px; | |||
border-width: 5px; | |||
border-style: solid; | |||
border-color: transparent transparent black transparent; | |||
} | } | ||
. | .lang:hover .tooltiplang { | ||
visibility: visible; | |||
} | } | ||
.ombox { | |||
margin: 4px 10%; | |||
. | |||
border-collapse: collapse; | border-collapse: collapse; | ||
border: 1px solid #a2a9b1; | border: 1px solid #a2a9b1; | ||
background-color: #f8f9fa; | background-color: #f8f9fa; | ||
box-sizing: border-box; | |||
} | } | ||
.mbox-image { | |||
border: none; | border: none; | ||
padding: 2px 0 2px 0.9em; | |||
padding: 2px 0 2px 0.9em; | |||
text-align: center; | text-align: center; | ||
} | } | ||
.mbox-text { | |||
border: none; | border: none; | ||
padding: 0.25em 0.9em; | |||
padding: | width: 100%; | ||
width: | |||
} | } | ||
.ombox-notice { | |||
border: 1px solid #a2a9b1; | border: 1px solid #a2a9b1; | ||
} | } | ||
.mbox-small { | |||
clear: right; | clear: right; | ||
float: right; | float: right; | ||
margin: 4px 0 4px 1em; | margin: 4px 0 4px 1em; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
Line 890: | Line 144: | ||
} | } | ||
.ambox { | |||
margin: 0 10%; | |||
margin: | border: 1px solid #a2a9b1; | ||
background-color: #fbfbfb; | |||
box-sizing: border-box; | |||
} | } | ||
.ambox-style { | |||
border-left: 10px solid #fc3; | |||
. | |||
} | } | ||
.hlist li { | |||
margin: 0; | |||
display: inline; | |||
} | } | ||
.hlist li:after { | |||
content: " · "; | |||
font-weight: bold; | |||
} | } | ||
.navbar li { | |||
. | word-spacing: -0.125em; | ||
} | } | ||
. | .hlist dd:last-child:after, .hlist dt:last-child:after, .hlist li:last-child:after { | ||
content: none; | |||
} | } | ||
.plainlist ol li, .plainlist ul li { | |||
. | margin-bottom: 0; | ||
} | } | ||
.plainlist ol, .plainlist ul { | |||
. | line-height: inherit; | ||
list-style: none none; | |||
margin: 0; | |||
} | } | ||
.hlist ul { | |||
margin: 0; | |||
padding: 0; | |||
. | |||
} | } | ||
. | .adventure { | ||
background-color: #ff8c00; | |||
font-weight: bold; | |||
} | } | ||
.body_of_water { | |||
background-color: #000080; | |||
font-weight: bold; | |||
color: white; | |||
} | } | ||
.campaign { | |||
background-color: #ffff54; | |||
font-weight: bold; | |||
} | } | ||
.character { | |||
background-color: #2f4f4f; | |||
. | font-weight: bold; | ||
color: white; | |||
} | } | ||
. | .continent { | ||
background-color: #00ff00; | |||
font-weight: bold; | |||
} | } | ||
.country { | |||
. | background-color: #0000ff; | ||
font-weight: bold; | |||
color: white; | |||
} | } | ||
.deity { | |||
# | background-color: #ff00ff; | ||
font-weight: bold; | |||
color: white; | |||
} | } | ||
.forest { | |||
. | background-color: #008000; | ||
font-weight: bold; | |||
color: white; | |||
} | } | ||
.item { | |||
background-color: #8b0000; | |||
font-weight: bold; | |||
# | color: white; | ||
} | } | ||
.location { | |||
background-color: #ff1493; | |||
font-weight: bold; | |||
color: white; | |||
} | } | ||
. | .organization { | ||
background-color: #7fffd4; | |||
font-weight: bold; | |||
} | } | ||
. | .race { | ||
background-color: #deb887; | |||
font-weight: bold; | |||
} | } | ||
.session { | |||
background-color: #dda0dd; | |||
font-weight: bold; | |||
. | |||
} | } | ||
.settlement { | |||
. | background-color: #00bfff; | ||
font-weight: bold; | |||
} | } |
Latest revision as of 20:14, 13 February 2023
/* CSS Document */
@font-face {
font-family: "Pathfinder2EActions";
src: url("images/9/9f/Pathfinder2eActions.woff2") format("woff2");
}
span.action {
font-family: "Pathfinder2EActions";
font-size: calc(1em * 1.4);
line-height: normal;
}
.action.action-1:before {
content: ' 1';
}
.action.action-2:before {
content: ' 2';
}
.action.action-3:before {
content: ' 3';
}
.action.action-4:before {
content: ' 4';
}
.action.action-5:before {
content: ' 5';
}
.cards {
margin: 0 auto;
display: grid;
gap: 1rem;
overflow: auto;
}
@media (min-width: 888px) {
.cards {
grid-template-columns: repeat(2, 1fr);
}
}
.card {
padding: 1rem;
}
.card.pfFeat {
background-color: antiquewhite;
}
.pfHeader {
border-bottom: 1px solid black;
text-transform: uppercase;
}
.clearfix:after {
content: "\00A0";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.pfName {
float: left;
}
.pfLevel {
float: right;
}
.pfTags {
color: white;
display: inline-block;
background-color: maroon;
border: 1px solid yellow;
text-transform: uppercase;
padding: 0.15em 0.3em;
}
.pfPrereq {
border-bottom: 1px solid black;
}
.lang {
position: relative;
display: inline-block;
}
.lang .tooltiplang {
visibility: hidden;
width: 120px;
background-color: black;
color: #fff;
text-align: center;
border-radius: 6px;
padding: 5px 0;
position: absolute;
z-index: 1;
top: 150%;
left: 50%;
margin-left: -60px;
}
.lang .tooltiplang::after {
content: "";
position: absolute;
bottom: 100%;
left: 50%;
margin-left: -5px;
border-width: 5px;
border-style: solid;
border-color: transparent transparent black transparent;
}
.lang:hover .tooltiplang {
visibility: visible;
}
.ombox {
margin: 4px 10%;
border-collapse: collapse;
border: 1px solid #a2a9b1;
background-color: #f8f9fa;
box-sizing: border-box;
}
.mbox-image {
border: none;
padding: 2px 0 2px 0.9em;
text-align: center;
}
.mbox-text {
border: none;
padding: 0.25em 0.9em;
width: 100%;
}
.ombox-notice {
border: 1px solid #a2a9b1;
}
.mbox-small {
clear: right;
float: right;
margin: 4px 0 4px 1em;
box-sizing: border-box;
width: 238px;
font-size: 88%;
line-height: 1.25em;
}
.ambox {
margin: 0 10%;
border: 1px solid #a2a9b1;
background-color: #fbfbfb;
box-sizing: border-box;
}
.ambox-style {
border-left: 10px solid #fc3;
}
.hlist li {
margin: 0;
display: inline;
}
.hlist li:after {
content: " · ";
font-weight: bold;
}
.navbar li {
word-spacing: -0.125em;
}
.hlist dd:last-child:after, .hlist dt:last-child:after, .hlist li:last-child:after {
content: none;
}
.plainlist ol li, .plainlist ul li {
margin-bottom: 0;
}
.plainlist ol, .plainlist ul {
line-height: inherit;
list-style: none none;
margin: 0;
}
.hlist ul {
margin: 0;
padding: 0;
}
.adventure {
background-color: #ff8c00;
font-weight: bold;
}
.body_of_water {
background-color: #000080;
font-weight: bold;
color: white;
}
.campaign {
background-color: #ffff54;
font-weight: bold;
}
.character {
background-color: #2f4f4f;
font-weight: bold;
color: white;
}
.continent {
background-color: #00ff00;
font-weight: bold;
}
.country {
background-color: #0000ff;
font-weight: bold;
color: white;
}
.deity {
background-color: #ff00ff;
font-weight: bold;
color: white;
}
.forest {
background-color: #008000;
font-weight: bold;
color: white;
}
.item {
background-color: #8b0000;
font-weight: bold;
color: white;
}
.location {
background-color: #ff1493;
font-weight: bold;
color: white;
}
.organization {
background-color: #7fffd4;
font-weight: bold;
}
.race {
background-color: #deb887;
font-weight: bold;
}
.session {
background-color: #dda0dd;
font-weight: bold;
}
.settlement {
background-color: #00bfff;
font-weight: bold;
}