MediaWiki:Common.css: Difference between revisions
From Haven Homes
mNo edit summary |
mNo edit summary |
||
(63 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
/* CSS placed here will be applied to all skins */ | /* CSS placed here will be applied to all skins */ | ||
/* fix gap before slideshows */ | |||
ul.gallery.mw-gallery-slideshow { | |||
margin: 0 0; | |||
} | |||
/* add gap after tabs for headers */ | |||
div.tabs-tabbox + h2, div.tabs-tabbox + h3, div.tabs-tabbox + h4 { | |||
margin-top: 40px; | |||
} | |||
div.tabs-tabbox { | |||
padding:15px; | |||
} | |||
.tabs-container { | |||
max-width:100% !important; | |||
width:100% !important; /* prevents short slideshows from displaying smaller */ | |||
text-align:center; | |||
} | |||
/* make active tab contents match active tab color */ | |||
.tabs-container { | |||
background-color:#ffffff; | |||
} | |||
.tabs-inputform { | |||
margin-top: 80px; | |||
} | |||
/* new panorama viewer */ | |||
.panorama-embed { | |||
max-width:880px; | |||
width: 880px; | |||
height: 660px; | |||
display:block; | |||
margin:20px auto; | |||
border:0 none; | |||
border-radius:8px; | |||
box-shadow: 0 1px 1px rgba(0,0,0,0.11),0 2px 2px rgba(0,0,0,0.11),0 4px 4px rgba(0,0,0,0.11),0 6px 8px rgba(0,0,0,0.11),0 8px 16px rgba(0,0,0,0.11); | |||
} | |||
@media only screen and (max-width: 960px) { | |||
.panorama-embed { | |||
width: 600px; | |||
height: 450px; | |||
} | |||
} | |||
@media only screen and (max-width: 720px) { | |||
.panorama-embed { | |||
width: 400px; | |||
height: 300px; | |||
} | |||
} | |||
/* Load fonts -- **REMOVE UNUSED** */ | /* Load fonts -- **REMOVE UNUSED** */ | ||
Line 86: | Line 144: | ||
/* rest of ToC items */ | /* rest of ToC items */ | ||
.toc ul li ul li {font-family:Lato,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";} | .toc ul li ul li {font-family:Lato,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";} | ||
html { | |||
scroll-behavior: smooth; | |||
} | |||
Line 92: | Line 155: | ||
ul ul {list-style:circle;} | ul ul {list-style:circle;} | ||
/* extra space between list items */ | /* extra space between list items */ | ||
li {margin-bottom: 0.3em;} | li {margin-bottom: 0.3em;} | ||
.mw-content-ltr .toc ul ul, .mw-content-rtl .mw-content-ltr .toc ul ul {margin-top: 0.3em;} /* fix for nested lists */ | |||
/* Fix lack of spacing after lists */ | /* Fix lack of spacing after lists */ | ||
ul + p {margin-top:1em;} | ul + p {margin-top:1em;} | ||
Line 121: | Line 185: | ||
line-height: 1.2; */ | line-height: 1.2; */ | ||
} | } | ||
.hh-bullet { | |||
padding-left:15px; | |||
} | |||
.hh-bullet::before { | |||
white-space: pre; | |||
word-wrap: break-word; | |||
padding-left:15px; | |||
content:'\A • '; | |||
} | |||
.hidden { | |||
display:none; | |||
} | |||
/* Category links */ | |||
.catlinks { | |||
padding-left:10px; | |||
} | |||
.mw-body .catlinks ul { | |||
margin-left: 0; | |||
} | |||
/* hide title on main page */ | |||
body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; } | |||
/* Formatting for Forms generated from CIForms */ | |||
/* hide page numbers on forms */ | |||
.mw-body .mw-indicators { | |||
display:none; | |||
} | |||
.ci_form { | |||
width:100%; | |||
} | |||
/* Data tables */ | |||
/* First row */ | |||
.hh-data-table tr:first-child td { | |||
font-weight: bold; | |||
} | |||
.hh-data-table tr td { | |||
border:1px solid #bfbfbf; | |||
padding:0 10px; | |||
vertical-align:top; | |||
} | |||
.hh-data-table { | |||
margin-bottom: 1.5rem; | |||
} | |||
/* indent text below main headers on wide screens */ | /* indent text below main headers on wide screens */ | ||
/* add noheader class to pages without any headers */ | |||
@media only screen and (min-width: 1024px) { | @media only screen and (min-width: 1024px) { | ||
.content h3 {margin-left:15px;} | .content h3 {margin-left:15px;} | ||
.content h4, .content h5, .content h6, .content p {margin-left:30px;} | .content h4, .content h5, .content h6, .content p, .ci_form, .hh-data-table {margin-left:30px;} | ||
/* h2 ~ ul gets all lists after the ToC */ | /* h2 ~ ul gets all lists after the ToC */ | ||
.content h2 ~ ul, .content h3 ~ ul, .content h4 ~ ul {margin-left: | .content h2 ~ ul, .content h3 ~ ul, .content h4 ~ ul, .content .emptyheader ~ ul {margin-left:60px;} | ||
.content h2 ~ ul ul, .content h3 ~ ul ul, .content h4 ~ ul ul, .content .emptyheader ~ ul ul {margin-left:17px;} | |||
/*.content ul:not(.toc):not(ul) {margin-left:60px;} | |||
.content :not(.toc) ul ul {margin-left:17px;}*/ | |||
} | } |
Latest revision as of 07:41, 16 November 2023
/* CSS placed here will be applied to all skins */ /* fix gap before slideshows */ ul.gallery.mw-gallery-slideshow { margin: 0 0; } /* add gap after tabs for headers */ div.tabs-tabbox + h2, div.tabs-tabbox + h3, div.tabs-tabbox + h4 { margin-top: 40px; } div.tabs-tabbox { padding:15px; } .tabs-container { max-width:100% !important; width:100% !important; /* prevents short slideshows from displaying smaller */ text-align:center; } /* make active tab contents match active tab color */ .tabs-container { background-color:#ffffff; } .tabs-inputform { margin-top: 80px; } /* new panorama viewer */ .panorama-embed { max-width:880px; width: 880px; height: 660px; display:block; margin:20px auto; border:0 none; border-radius:8px; box-shadow: 0 1px 1px rgba(0,0,0,0.11),0 2px 2px rgba(0,0,0,0.11),0 4px 4px rgba(0,0,0,0.11),0 6px 8px rgba(0,0,0,0.11),0 8px 16px rgba(0,0,0,0.11); } @media only screen and (max-width: 960px) { .panorama-embed { width: 600px; height: 450px; } } @media only screen and (max-width: 720px) { .panorama-embed { width: 400px; height: 300px; } } /* Load fonts -- **REMOVE UNUSED** */ /* Merriweather500 latin-ext */ @font-face { font-family: 'Merriweather500'; font-style: bold; font-weight: 700; src: url(https://fonts.gstatic.com/s/merriweather/v30/u-440qyriQwlOrhSvowK_l5-ciZMZ-Y.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* Merriweather500 latin */ @font-face { font-family: 'Merriweather500'; font-style: bold; font-weight: 700; src: url(https://fonts.gstatic.com/s/merriweather/v30/u-440qyriQwlOrhSvowK_l5-fCZM.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Merriweather700 latin-ext */ @font-face { font-family: 'Merriweather700'; font-style: normal; font-weight: 700; src: url(https://fonts.gstatic.com/s/merriweather/v30/u-4n0qyriQwlOrhSvowK_l52xwNZVsf6lvg.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* Merriweather700 latin */ @font-face { font-family: 'Merriweather700'; font-style: normal; font-weight: 700; src: url(https://fonts.gstatic.com/s/merriweather/v30/u-4n0qyriQwlOrhSvowK_l52xwNZWMf6.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Merriweather900 latin-ext */ @font-face { font-family: 'Merriweather900'; font-style: normal; font-weight: 900; src: url(https://fonts.gstatic.com/s/merriweather/v30/u-4n0qyriQwlOrhSvowK_l52_wFZVsf6lvg.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* Merriweather900 latin */ @font-face { font-family: 'Merriweather900'; font-style: normal; font-weight: 900; src: url(https://fonts.gstatic.com/s/merriweather/v30/u-4n0qyriQwlOrhSvowK_l52_wFZWMf6.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Lato latin-ext */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: url(https://fonts.gstatic.com/s/lato/v23/S6uyw4BMUTPHjxAwXjeu.woff2) format('woff2'); unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* Lato latin */ @font-face { font-family: 'Lato'; font-style: normal; font-weight: 400; src: url(https://fonts.gstatic.com/s/lato/v23/S6uyw4BMUTPHjx4wXg.woff2) format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } /* Assign fonts */ /* regular text */ body {font-family:Lato,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";} /* headers */ .content h1 { font-family:Merriweather900,"Palatino","Georgia","Times New Roman"; } .content h2 { font-family:Merriweather700,"Palatino","Georgia","Times New Roman"; } .content h3, .content h4, .content h5, .content h6 { font-family:Merriweather500,"Palatino","Georgia","Times New Roman"; } /* top-level ToC items */ .toc ul li {font-family:Merriweather700,"Palatino","Georgia","Times New Roman";} /* rest of ToC items */ .toc ul li ul li {font-family:Lato,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans","Liberation Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";} html { scroll-behavior: smooth; } /* List formatting */ ul {list-style:square;} ul ul {list-style:circle;} /* extra space between list items */ li {margin-bottom: 0.3em;} .mw-content-ltr .toc ul ul, .mw-content-rtl .mw-content-ltr .toc ul ul {margin-top: 0.3em;} /* fix for nested lists */ /* Fix lack of spacing after lists */ ul + p {margin-top:1em;} ul + h2, ul + h3, ul + h4 {margin-top:1em;} /* links */ .content a, .content a:link, .content a:visited, .content a:hover { text-decoration:underline; } .toc a, .toc a:link, .toc a:visited { text-decoration:none; } /* Table of contents */ /* ToC position */ #toc {float:right;margin: 1em 0 1em 1em;} /* #toc {float:right;margin:0 0 1em 1em;position:fixed;top:150px;right:10px;}; */ /* Hide numbers in ToC */ .tocnumber {display:none !important;} /* Increase indent in ToC */ .toc ul ul {margin-left:1.25em !important;} /* .content h4, .content h4 ~ p, .content h4 ~ ul {margin-left:40px;} .content h3, .content h3 ~ p, .content h3 ~ ul {margin-left:20px;} */ h3, h4, h5, h6, .h3, .h4, .h5, .h6 { margin-bottom: 0.2rem; /*font-weight: 500; line-height: 1.2; */ } .hh-bullet { padding-left:15px; } .hh-bullet::before { white-space: pre; word-wrap: break-word; padding-left:15px; content:'\A • '; } .hidden { display:none; } /* Category links */ .catlinks { padding-left:10px; } .mw-body .catlinks ul { margin-left: 0; } /* hide title on main page */ body.page-Main_Page.action-view h1.firstHeading, body.page-Main_Page.action-submit h1.firstHeading { display: none; } /* Formatting for Forms generated from CIForms */ /* hide page numbers on forms */ .mw-body .mw-indicators { display:none; } .ci_form { width:100%; } /* Data tables */ /* First row */ .hh-data-table tr:first-child td { font-weight: bold; } .hh-data-table tr td { border:1px solid #bfbfbf; padding:0 10px; vertical-align:top; } .hh-data-table { margin-bottom: 1.5rem; } /* indent text below main headers on wide screens */ /* add noheader class to pages without any headers */ @media only screen and (min-width: 1024px) { .content h3 {margin-left:15px;} .content h4, .content h5, .content h6, .content p, .ci_form, .hh-data-table {margin-left:30px;} /* h2 ~ ul gets all lists after the ToC */ .content h2 ~ ul, .content h3 ~ ul, .content h4 ~ ul, .content .emptyheader ~ ul {margin-left:60px;} .content h2 ~ ul ul, .content h3 ~ ul ul, .content h4 ~ ul ul, .content .emptyheader ~ ul ul {margin-left:17px;} /*.content ul:not(.toc):not(ul) {margin-left:60px;} .content :not(.toc) ul ul {margin-left:17px;}*/ }