MediaWiki:Common.css
From Psalms: Layer by Layer
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
- Opera: Press Ctrl-F5.
/* CSS placed here will be applied to all skins */ /* Also see ../customizations/custom.* on the filesystem */ /* =================================== */ /* === ALL PAGES, ALL SKINS */ /* =================================== */ /* Corporate font Lora (used for headings) */ @import url('//fonts.googleapis.com/css2?family=Lora:wght@400..700'); /* unicode-range specific fonts for Hebrew and Greek. See https://j.hn/using-css-to-display-fonts-for-greek-and-hebrew-but-not-english/ https://developers.google.com/fonts/docs/css2 https://www.onlinewebfonts.com/download/0a08163287a1fa0aceb8e98c2c931bc5 */ /* Hebrew font */ @font-face { font-family: "SBL Hebrew"; unicode-range: U+0590-05FF; src: url("/customizations/SBL-Hebrew/SBL-Hebrew.eot"); src: url("/customizations/SBL-Hebrew/SBL-Hebrew.eot?#iefix") format("embedded-opentype"), url("/customizations/SBL-Hebrew/SBL-Hebrew.woff2") format("woff2"), url("/customizations/SBL-Hebrew/SBL-Hebrew.woff") format("woff"), url("/customizations/SBL-Hebrew/SBL-Hebrew.ttf") format("truetype"), url("/customizations/SBL-Hebrew/SBL-Hebrew.svg#SBL Hebrew") format("svg"); } /* Greek font */ @font-face { font-family: "Gentium Plus"; /* TODO: subset the font to reduce size */ unicode-range: U+0370-03FF, U+1F00-1FFF; src: url("/customizations/Gentium-Plus/Gentium-Plus.eot"); src: url("/customizations/Gentium-Plus/Gentium-Plus.eot?#iefix") format("embedded-opentype"), url("/customizations/Gentium-Plus/Gentium-Plus.woff2") format("woff2"), url("/customizations/Gentium-Plus/Gentium-Plus.woff") format("woff"), url("/customizations/Gentium-Plus/Gentium-Plus.ttf") format("truetype"), url("/customizations/Gentium-Plus/Gentium-Plus.svg#Gentium Plus") format("svg"); } /* Simple RTL text direction changes. See https://css-tricks.com/almanac/properties/d/direction/ */ *[dir="ltr"] { direction: ltr; unicode-bidi: embed; } *[dir="rtl"] { direction: rtl; unicode-bidi: embed; text-align: right; } bdo[dir="ltr"] { direction: ltr; unicode-bidi: bidi-override; } bdo[dir="rtl"] { direction: rtl; unicode-bidi: bidi-override; text-align: right; } span[dir] { unicode-bidi: bidi-override; } body { font-size: 16px; /* default for tweeki skin is 14px */ font-family: "SBL Hebrew", "Gentium Plus", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; } h1,h2,h3,h4,h5,h6, .h1,.h2,.h3,.h4,.h5,.h6, .lead { font-family: "Lora", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif; } /* for images that exceed the page width, put a <div class="responsive-img"> around them */ .responsive-img img { max-width: 100%; } /* LOGO */ .navbar-brand img { height: 22px; margin-top: 0; } a { color: #69A88D; } a:hover, a:focus { color: #176560; text-decoration: none; } /* these were used on timeless skin. still relevant with tweeki? */ .list-I li { list-style-type: upper-roman; } .list-A li { list-style-type: upper-alpha; margin-left: 40px; } .list-1 li { list-style-type: decimal; margin-left: 80px; } .list-a li { list-style-type: lower-alpha; margin-left: 120px; } /* Enable PageForms spreadsheet-style grid to autogrow */ .jsgrid { height: unset !important; overflow: auto; } .jsgrid-grid-body { height: unset; overflow: auto; } .jsgrid-grid-table { height: unset; overflow: auto; } .outline > li { list-style-type: upper-roman; } .outline > li > li { list-style-type: upper-alpha; margin-left: 40px; } /* =================================== */ /* === STYLES FOR SPECIFIC PAGES === */ /* =================================== */ /* === Page: Welcome === */ /* Nav boxes linking to other CDBR sites */ .page-welcome .nav-boxes { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; } .page-welcome .nav-boxes .nav-box { flex-grow: 1; display: flex; align-items: flex-end; justify-content: center; padding: 1rem; } .page-welcome .nav-boxes .nav-box:nth-child(even) { background: #FBF9F7; } .page-welcome .nav-boxes .nav-box:nth-child(odd) { background: #F3EEE6; } .page-welcome .nav-boxes .nav-box p { display: flex; flex-direction: column; text-align: center; } .page-welcome .nav-boxes .nav-box img { max-width: 100%; height: auto; padding: 1rem; } /* Index of psalms */ .page-welcome .index { display: flex; flex-wrap: wrap; justify-content: space-between; } .page-welcome .index .index-item { width: 3em; /*1.7em;*/ font-size: 1.5em; text-align: right; padding: .1em 1em; } .page-welcome .index .link-deemphasize a { color: #888; font-weight: lighter; }