From GamingWiki
(Created page with "→CSS placed here will affect users of the Modern skin: TABLE.infobox, TABLE.listing { background: #f80000; margin: 4px 8px; }") |
|||
| (22 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
/* CSS placed here will affect users of the Modern skin */ | /* CSS placed here will affect users of the Modern skin */ | ||
| + | /* | ||
| + | == General site styles == | ||
| + | We have a few templates that are designed for general use. | ||
| + | */ | ||
| + | |||
| + | /* | ||
| + | === boxes: navbox, infobox, listing === | ||
| + | */ | ||
TABLE.infobox, | TABLE.infobox, | ||
TABLE.listing { | TABLE.listing { | ||
| − | background: # | + | background: #f8f8f8; |
margin: 4px 8px; | margin: 4px 8px; | ||
| + | border-spacing: 1px; | ||
| + | } | ||
| + | TABLE.infobox TH, | ||
| + | TABLE.listing TH { | ||
| + | background: #dadada; | ||
| + | color: #111; | ||
| + | border: 2px solid #ccc; | ||
| + | border-width: 2px 0px; | ||
| + | } | ||
| + | TABLE.infobox TD, | ||
| + | TABLE.listing TD { | ||
| + | border-width: 1px 0; | ||
| + | } | ||
| + | TABLE.infobox TD.shaded , | ||
| + | TABLE.infobox .label , | ||
| + | TABLE.listing TR>TD:first-child , | ||
| + | TABLE.listing TD.shaded { | ||
| + | background: #eee; | ||
| + | color: #111; | ||
| + | white-space: nowrap; | ||
| + | text-align: right; | ||
| + | width: 1px; | ||
| + | padding: 0 4px; | ||
| + | } | ||
| + | TABLE.infobox TD.subhead, | ||
| + | TABLE.listing TD.subhead { | ||
| + | background: #eee; | ||
| + | color: #111; | ||
| + | white-space: nowrap; | ||
| + | font-weight: bold; | ||
| + | text-align: left !important; | ||
| + | } | ||
| + | TABLE.infobox TD.alignright, | ||
| + | TABLE.listing TD.alignright { | ||
| + | text-align: right; | ||
| + | } | ||
| + | TABLE.infobox TD.wrap, | ||
| + | TABLE.listing TD.wrap { | ||
| + | white-space: normal; | ||
| + | } | ||
| + | .listing.collapse { | ||
| + | width:auto; | ||
| + | max-width: 36em; | ||
| + | } | ||
| + | .rellink, .dablink { | ||
| + | font-style: italic; | ||
| + | padding-left: 2em; | ||
| + | margin-bottom: 0.5em; | ||
| + | } | ||
| + | /* | ||
| + | ==== infobox ==== | ||
| + | */ | ||
| + | table.infobox { | ||
| + | width: 300px;; | ||
| + | text-align: left; | ||
| + | font-size:88%; | ||
| + | line-height:1.5em; | ||
| + | } | ||
| + | .infobox .infocaption { | ||
| + | font-size:125%; | ||
| + | font-weight:bold; | ||
| + | } | ||
| + | .infobox .above { | ||
| + | text-align:center; | ||
| + | font-size:125%; | ||
| + | font-weight:bold; | ||
| + | background: #FFFFC0; | ||
| + | } | ||
| + | .infobox .blurb { | ||
| + | text-align:center; | ||
| + | font-size:75%; | ||
| + | font-weight:normal; | ||
| + | } | ||
| + | .infobox .below { | ||
| + | text-align:center; | ||
| + | background: #FFFFC0; | ||
| + | } | ||
| + | .infobox .header { | ||
| + | text-align:center; | ||
| + | font-size:125%; | ||
| + | font-weight:bold; | ||
| + | } | ||
| + | .infobox.collapse { | ||
| + | width:auto; | ||
| + | max-width: 300px; | ||
| + | } | ||
| + | /* | ||
| + | ==== navbox ==== | ||
| + | */ | ||
| + | table.navbox { | ||
| + | width: 80%; | ||
| + | font-size:95%; | ||
| + | margin:0.5em auto; | ||
| + | } | ||
| + | .navbox-title span.collapseButton { | ||
| + | display: block; | ||
| + | float:right; | ||
| + | } | ||
| + | .navbox-group { white-space: nowrap; } | ||
| + | /* end navboxes */ | ||
| + | |||
| + | /* | ||
| + | === Some specific boxes === | ||
| + | |||
| + | Year in topic: an infobox of information for a given year | ||
| + | Year in other calendars: used by Year in topic, converts a given | ||
| + | year to other calendars. | ||
| + | |||
| + | */ | ||
| + | |||
| + | /* | ||
| + | == Per-game styles == | ||
| + | */ | ||
| + | |||
| + | /* | ||
| + | === Fate Core === | ||
| + | */ | ||
| + | /* | ||
| + | ==== For use with skill modes ==== | ||
| + | */ | ||
| + | .skill.trained { | ||
| + | } | ||
| + | |||
| + | .skill.focused { | ||
| + | background: #e8f8e8; | ||
| + | } | ||
| + | |||
| + | .skill.specialized { | ||
| + | background: #d8f8d8; | ||
} | } | ||
| + | |||
| + | |||
| + | /* | ||
| + | === Diaspora === | ||
| + | */ | ||
| + | |||
| + | /* | ||
| + | ==== general styles ==== | ||
| + | |||
| + | we want a distinctive style for any aspect, in text or in a character | ||
| + | sheet. | ||
| + | */ | ||
| + | .aspect { | ||
| + | color: #c60; | ||
| + | background: inherit; | ||
| + | font-weight: bold; | ||
| + | } | ||
| + | |||
| + | /* | ||
| + | ==== transcript styles ==== | ||
| + | */ | ||
| + | p.meta, div.meta, p.timestamp { | ||
| + | color: #001; | ||
| + | background: #eef; | ||
| + | margin: 0 1em; | ||
| + | padding: 0 2em; | ||
| + | } | ||
| + | div.meta { | ||
| + | color: #001; | ||
| + | background: #eef; | ||
| + | margin: 0 1em; | ||
| + | padding: 0.25em 2em; | ||
| + | } | ||
| + | p.timestamp { font-weight: bold; } | ||
| + | div.undent { margin: 0 -1em 0; } | ||
| + | |||
| + | /* | ||
| + | ==== character sheets ==== | ||
| + | */ | ||
| + | |||
| + | /* campaign name in header */ | ||
| + | .infobox .campaign { font-size: smaller; float: right; } | ||
| + | |||
| + | /* skill labels */ | ||
| + | /* underline certain skill types with a coloured line. */ | ||
| + | .diaspora .skill, .diaspora .skill span | ||
| + | { border-color: transparent; border-style: solid; border-width: 0 0 2px 0; } | ||
| + | .diaspora .skill .space, .diaspora .skill.space, | ||
| + | .diaspora .skill-communications, | ||
| + | .diaspora .skill-computer, | ||
| + | .diaspora .skill-engineering, | ||
| + | .diaspora .skill-gunnery, | ||
| + | .diaspora .skill-navigation, | ||
| + | .diaspora .skill-pilot | ||
| + | { border-color: #639 !important; } | ||
| + | .diaspora .skill .combat, .diaspora .skill.combat, | ||
| + | .diaspora .skill-brawling, | ||
| + | .diaspora .skill-close-combat, | ||
| + | .diaspora .skill-energy-weapons, | ||
| + | .diaspora .skill-microg, | ||
| + | .diaspora .skill-slug-throwers | ||
| + | { border-color: #693 !important; } | ||
| + | .diaspora .skill .track, .diaspora .skill.track, | ||
| + | .diaspora .skill-assets, | ||
| + | .diaspora .skill-resolve, | ||
| + | .diaspora .skill-stamina | ||
| + | { border-color: #963 !important; } | ||
| + | /* make the "military grade" marker act like a <sup> tag. */ | ||
| + | .diaspora .skill .mg-marker { | ||
| + | color: #c63; | ||
| + | font-size: 50%; | ||
| + | vertical-align:super; | ||
| + | } | ||
| + | /* stunt listing */ | ||
| + | .diaspora .stunt-description { padding: 0 2em; font-size: smaller; } | ||
| + | /* stressbox tables */ | ||
| + | table.fate.stressbox { | ||
| + | float:left; | ||
| + | margin: 0 0.5em; | ||
| + | border-spacing: 2px; | ||
| + | display: inline; | ||
| + | } | ||
| + | .fate.stressbox td { padding:4px; } | ||
| + | .fate.stressbox td div { | ||
| + | border: 1px solid black; | ||
| + | width: 15px; | ||
| + | height: 15px; | ||
| + | } | ||
| + | .fate.stressbox td.full div { background: grey; } | ||
| + | |||
| + | /* end Diaspora styles */ | ||
| + | |||
| + | /* Microscope styles */ | ||
| + | TABLE.microscope { | ||
| + | border: 3px solid black; | ||
| + | margin: 0 auto 1px; | ||
| + | } | ||
| + | TABLE.microscope.period { | ||
| + | width: 300px; | ||
| + | border-width: 0 4px; | ||
| + | } | ||
| + | TABLE.microscope.event { | ||
| + | width: 400px; | ||
| + | border-width: 2px 0; | ||
| + | } | ||
| + | TABLE.microscope.scene { | ||
| + | width: 250px; | ||
| + | border-width: 0 1px 1px; | ||
| + | } | ||
| + | TABLE.microscope TH, | ||
| + | TABLE.microscope TD { | ||
| + | vertical-align: top; | ||
| + | } | ||
| + | TABLE.microscope.period TH { | ||
| + | background: black; | ||
| + | color: white; | ||
| + | font-weight: bold; | ||
| + | padding: 0.25em 0.5em; | ||
| + | } | ||
| + | TABLE.microscope .tone { | ||
| + | height: 20px; | ||
| + | width: 20px; | ||
| + | border: 1px solid black; | ||
| + | border-radius: 12px; | ||
| + | margin: 2px auto; | ||
| + | } | ||
| + | TABLE.microscope.dark .tone { | ||
| + | background: black; | ||
| + | } | ||
| + | TABLE.microscope.light .tone { | ||
| + | background: white; | ||
| + | } | ||
| + | /* end Microscope styles */ | ||
| + | |||
| + | /* * * External widgets * * */ | ||
| + | /* Boardgamegeek / RPGGeek */ | ||
| + | /* .BGGwrapper { float: right; } */ | ||
| + | /* * End external widgets * */ | ||
| + | |||
| + | /* End custom styles */ | ||
Latest revision as of 00:07, 14 May 2014
/* CSS placed here will affect users of the Modern skin */
/*
== General site styles ==
We have a few templates that are designed for general use.
*/
/*
=== boxes: navbox, infobox, listing ===
*/
TABLE.infobox,
TABLE.listing {
background: #f8f8f8;
margin: 4px 8px;
border-spacing: 1px;
}
TABLE.infobox TH,
TABLE.listing TH {
background: #dadada;
color: #111;
border: 2px solid #ccc;
border-width: 2px 0px;
}
TABLE.infobox TD,
TABLE.listing TD {
border-width: 1px 0;
}
TABLE.infobox TD.shaded ,
TABLE.infobox .label ,
TABLE.listing TR>TD:first-child ,
TABLE.listing TD.shaded {
background: #eee;
color: #111;
white-space: nowrap;
text-align: right;
width: 1px;
padding: 0 4px;
}
TABLE.infobox TD.subhead,
TABLE.listing TD.subhead {
background: #eee;
color: #111;
white-space: nowrap;
font-weight: bold;
text-align: left !important;
}
TABLE.infobox TD.alignright,
TABLE.listing TD.alignright {
text-align: right;
}
TABLE.infobox TD.wrap,
TABLE.listing TD.wrap {
white-space: normal;
}
.listing.collapse {
width:auto;
max-width: 36em;
}
.rellink, .dablink {
font-style: italic;
padding-left: 2em;
margin-bottom: 0.5em;
}
/*
==== infobox ====
*/
table.infobox {
width: 300px;;
text-align: left;
font-size:88%;
line-height:1.5em;
}
.infobox .infocaption {
font-size:125%;
font-weight:bold;
}
.infobox .above {
text-align:center;
font-size:125%;
font-weight:bold;
background: #FFFFC0;
}
.infobox .blurb {
text-align:center;
font-size:75%;
font-weight:normal;
}
.infobox .below {
text-align:center;
background: #FFFFC0;
}
.infobox .header {
text-align:center;
font-size:125%;
font-weight:bold;
}
.infobox.collapse {
width:auto;
max-width: 300px;
}
/*
==== navbox ====
*/
table.navbox {
width: 80%;
font-size:95%;
margin:0.5em auto;
}
.navbox-title span.collapseButton {
display: block;
float:right;
}
.navbox-group { white-space: nowrap; }
/* end navboxes */
/*
=== Some specific boxes ===
Year in topic: an infobox of information for a given year
Year in other calendars: used by Year in topic, converts a given
year to other calendars.
*/
/*
== Per-game styles ==
*/
/*
=== Fate Core ===
*/
/*
==== For use with skill modes ====
*/
.skill.trained {
}
.skill.focused {
background: #e8f8e8;
}
.skill.specialized {
background: #d8f8d8;
}
/*
=== Diaspora ===
*/
/*
==== general styles ====
we want a distinctive style for any aspect, in text or in a character
sheet.
*/
.aspect {
color: #c60;
background: inherit;
font-weight: bold;
}
/*
==== transcript styles ====
*/
p.meta, div.meta, p.timestamp {
color: #001;
background: #eef;
margin: 0 1em;
padding: 0 2em;
}
div.meta {
color: #001;
background: #eef;
margin: 0 1em;
padding: 0.25em 2em;
}
p.timestamp { font-weight: bold; }
div.undent { margin: 0 -1em 0; }
/*
==== character sheets ====
*/
/* campaign name in header */
.infobox .campaign { font-size: smaller; float: right; }
/* skill labels */
/* underline certain skill types with a coloured line. */
.diaspora .skill, .diaspora .skill span
{ border-color: transparent; border-style: solid; border-width: 0 0 2px 0; }
.diaspora .skill .space, .diaspora .skill.space,
.diaspora .skill-communications,
.diaspora .skill-computer,
.diaspora .skill-engineering,
.diaspora .skill-gunnery,
.diaspora .skill-navigation,
.diaspora .skill-pilot
{ border-color: #639 !important; }
.diaspora .skill .combat, .diaspora .skill.combat,
.diaspora .skill-brawling,
.diaspora .skill-close-combat,
.diaspora .skill-energy-weapons,
.diaspora .skill-microg,
.diaspora .skill-slug-throwers
{ border-color: #693 !important; }
.diaspora .skill .track, .diaspora .skill.track,
.diaspora .skill-assets,
.diaspora .skill-resolve,
.diaspora .skill-stamina
{ border-color: #963 !important; }
/* make the "military grade" marker act like a <sup> tag. */
.diaspora .skill .mg-marker {
color: #c63;
font-size: 50%;
vertical-align:super;
}
/* stunt listing */
.diaspora .stunt-description { padding: 0 2em; font-size: smaller; }
/* stressbox tables */
table.fate.stressbox {
float:left;
margin: 0 0.5em;
border-spacing: 2px;
display: inline;
}
.fate.stressbox td { padding:4px; }
.fate.stressbox td div {
border: 1px solid black;
width: 15px;
height: 15px;
}
.fate.stressbox td.full div { background: grey; }
/* end Diaspora styles */
/* Microscope styles */
TABLE.microscope {
border: 3px solid black;
margin: 0 auto 1px;
}
TABLE.microscope.period {
width: 300px;
border-width: 0 4px;
}
TABLE.microscope.event {
width: 400px;
border-width: 2px 0;
}
TABLE.microscope.scene {
width: 250px;
border-width: 0 1px 1px;
}
TABLE.microscope TH,
TABLE.microscope TD {
vertical-align: top;
}
TABLE.microscope.period TH {
background: black;
color: white;
font-weight: bold;
padding: 0.25em 0.5em;
}
TABLE.microscope .tone {
height: 20px;
width: 20px;
border: 1px solid black;
border-radius: 12px;
margin: 2px auto;
}
TABLE.microscope.dark .tone {
background: black;
}
TABLE.microscope.light .tone {
background: white;
}
/* end Microscope styles */
/* * * External widgets * * */
/* Boardgamegeek / RPGGeek */
/* .BGGwrapper { float: right; } */
/* * End external widgets * */
/* End custom styles */