Template:Styles/Portals.css: Difference between revisions
From Absit Omen Lexicon
((by SublimeText.Mediawiker)) |
((by SublimeText.Mediawiker)) |
||
(7 intermediate revisions by the same user not shown) | |||
Line 2: | Line 2: | ||
clear: both; | clear: both; | ||
padding: 0.1em; | padding: 0.1em; | ||
text-align: center; | text-align: center; | ||
font-family: sans-serif; | font-family: sans-serif; | ||
font-size: 100%; | font-size: 100%; | ||
margin-bottom: 0px; | margin-bottom: 0px; | ||
border-width: 1px 1px 0; | |||
border-style: solid; | |||
} | } | ||
Line 19: | Line 17: | ||
padding: 0.5em; | padding: 0.5em; | ||
padding-top: 0.3em; | padding-top: 0.3em; | ||
border-width: 1px; | |||
border-style: solid; | |||
} | } | ||
/* For portals, added 2011-12-07 -bv | /* For portals, added 2011-12-07 -bv | ||
Line 28: | Line 28: | ||
border-width:3px; | border-width:3px; | ||
vertical-align:top; | vertical-align:top; | ||
padding: | padding:.5rem; | ||
} | |||
.portal-column-container { | |||
display: flex; | |||
flex-direction: row; | |||
gap: 1rem; | |||
} | } | ||
.portal-column-left { | .portal-column-left { | ||
flex: 1; | |||
} | } | ||
.portal-column-right { | .portal-column-right { | ||
flex: 1; | |||
} | } | ||
.portal-column-left-wide { | .portal-column-left-wide { | ||
flex: 1.2; | |||
. | |||
} | } | ||
.portal-column-left-extra-wide { | .portal-column-left-extra-wide { | ||
flex: 1.4; | |||
} | } | ||
@media only screen and (max-width: 850px) { | |||
@media only screen and (max-width: | |||
/* Decouple the columns on narrow screens */ | /* Decouple the columns on narrow screens */ | ||
.portal-column-left, | .portal-column-left, | ||
.portal-column-right, | .portal-column-right, | ||
.portal-column-left-wide, | .portal-column-left-wide, | ||
.portal-column-left-extra-wide { | |||
.portal-column-left-extra-wide | width: 100%; | ||
.portal-column- | } | ||
.portal-column-container { | |||
display: block; | |||
} | } | ||
} | } | ||
.portal-footer { | .portal-footer { | ||
Line 80: | Line 73: | ||
/*Portal Specific CSS */ | /*Portal Specific CSS */ | ||
div.infoMessage { | div.infoMessage { | ||
Line 91: | Line 79: | ||
} | } | ||
/* Characters Portal */ | |||
body.page-Portal_Characters .portal-container, body.page-Portal_Characters_test .portal-container { | body.page-Portal_Characters .portal-container, body.page-Portal_Characters_test .portal-container { | ||
border-color:#996600; | |||
background:#1F0629; | background:#1F0629; | ||
} | } | ||
body.page-Portal_Characters div.portal-box > h2,body.page-Portal_Characters_test div.portal-box > h2 { | body.page-Portal_Characters div.portal-box > h2,body.page-Portal_Characters_test div.portal-box > h2 { | ||
border-color:#996600; | |||
background: #220034; | |||
} | } | ||
body.page-Portal_Characters div.portal-box > div,body.page-Portal_Characters_test div.portal-box > div { | body.page-Portal_Characters div.portal-box > div,body.page-Portal_Characters_test div.portal-box > div { | ||
border-color: #996600; | |||
background: #320045; | |||
} | |||
/*Chapters Portal*/ | |||
body.page-Portal_Chapters .portal-container, body.page-Portal_Chapters_test .portal-container { | |||
border-color: #ff8c00; | |||
background: #010140; | |||
} | |||
body.page-Portal_Chapters div.portal-box > h2,body.page-Portal_Chapters_test div.portal-box > h2 { | |||
border-color: #cc7001; | |||
background: #000055; | |||
} | |||
body.page-Portal_Chapters div.portal-box > div,body.page-Portal_Chapters_test div.portal-box > div { | |||
border-color: #cc7001; | |||
background: #000027; | |||
} | |||
/*Hogwarts Portal*/ | |||
body.page-Portal_Hogwarts .portal-container, body.page-Portal_Hogwarts_test .portal-container { | |||
border-color:#996600; | |||
background:#271c00; | |||
} | |||
body.page-Portal_Hogwarts div.portal-box > h2,body.page-Portal_Hogwarts_test div.portal-box > h2 { | |||
border-color: #320045; | |||
background: #5d4200; | |||
} | |||
body.page-Portal_Hogwarts div.portal-box > div,body.page-Portal_Hogwarts_test div.portal-box > div { | |||
border-color: #320045; | |||
background: #3e2c00; | |||
} | } |
Latest revision as of 22:48, 22 December 2021
div.portal-box > h2 { clear: both; padding: 0.1em; text-align: center; font-family: sans-serif; font-size: 100%; margin-bottom: 0px; border-width: 1px 1px 0; border-style: solid; } div.portal-box > div { border-top-width: 1px; vertical-align: top; text-align: left; margin: 0 0 10px; padding: 0.5em; padding-top: 0.3em; border-width: 1px; border-style: solid; } /* For portals, added 2011-12-07 -bv On wide screens, show these as two columns On narrow and mobile screens, let them collapse into a single column */ .portal-container { width:100%; border-style:solid; border-width:3px; vertical-align:top; padding:.5rem; } .portal-column-container { display: flex; flex-direction: row; gap: 1rem; } .portal-column-left { flex: 1; } .portal-column-right { flex: 1; } .portal-column-left-wide { flex: 1.2; } .portal-column-left-extra-wide { flex: 1.4; } @media only screen and (max-width: 850px) { /* Decouple the columns on narrow screens */ .portal-column-left, .portal-column-right, .portal-column-left-wide, .portal-column-left-extra-wide { width: 100%; } .portal-column-container { display: block; } } .portal-footer { margin:0.3em 0.2em 0.2em 0.3em; padding:0.3em 0.2em 0.2em 0.3em; text-align:right; } /*Portal Specific CSS */ div.infoMessage { background:#003232; border:1px solid #186565; } /* Characters Portal */ body.page-Portal_Characters .portal-container, body.page-Portal_Characters_test .portal-container { border-color:#996600; background:#1F0629; } body.page-Portal_Characters div.portal-box > h2,body.page-Portal_Characters_test div.portal-box > h2 { border-color:#996600; background: #220034; } body.page-Portal_Characters div.portal-box > div,body.page-Portal_Characters_test div.portal-box > div { border-color: #996600; background: #320045; } /*Chapters Portal*/ body.page-Portal_Chapters .portal-container, body.page-Portal_Chapters_test .portal-container { border-color: #ff8c00; background: #010140; } body.page-Portal_Chapters div.portal-box > h2,body.page-Portal_Chapters_test div.portal-box > h2 { border-color: #cc7001; background: #000055; } body.page-Portal_Chapters div.portal-box > div,body.page-Portal_Chapters_test div.portal-box > div { border-color: #cc7001; background: #000027; } /*Hogwarts Portal*/ body.page-Portal_Hogwarts .portal-container, body.page-Portal_Hogwarts_test .portal-container { border-color:#996600; background:#271c00; } body.page-Portal_Hogwarts div.portal-box > h2,body.page-Portal_Hogwarts_test div.portal-box > h2 { border-color: #320045; background: #5d4200; } body.page-Portal_Hogwarts div.portal-box > div,body.page-Portal_Hogwarts_test div.portal-box > div { border-color: #320045; background: #3e2c00; }