This wiki is still a major work in progress, and a lot is being worked on. Please be patient. —Newmaker
Difference between revisions of "MediaWiki:Common.css"
(so close) |
|||
(35 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 */ | ||
+ | body { font-size: 125%; } | ||
+ | /* Petscop textboxes */ | ||
+ | @font-face { | ||
+ | font-family: 'Petscop Wide'; | ||
+ | src: url('/images/3/39/Petscop_Wide.woff') format('woff'), | ||
+ | url('/images/8/86/Petscop_Wide.ttf') format('truetype'); | ||
+ | } | ||
+ | |||
+ | .petscop-font { | ||
+ | font-family: 'Petscop Wide', Ubuntu Mono, Consolas, Monaco, Courier New, sans-serif; | ||
+ | font-size: 24px; /* 16 */ | ||
+ | font-style: normal; | ||
+ | -webkit-font-smoothing: none; | ||
+ | font-smooth: never; | ||
+ | font-weight: normal !important; | ||
+ | } | ||
+ | |||
+ | .petscop-textbox { | ||
+ | font-family: 'Petscop Wide', Ubuntu Mono, Consolas, Monaco, Courier New, sans-serif; | ||
+ | font-size: 32px; | ||
+ | font-weight: normal !important; | ||
+ | border: 5px solid gray; | ||
+ | background-color: #0f0909; | ||
+ | padding: 0.3em 0.5em; | ||
+ | margin: 4px auto; | ||
+ | color: white; | ||
+ | border-color: #0f0909 #070404 #040101 #070404; | ||
+ | box-shadow: 0px 0px 0px 2px black; | ||
+ | min-width: 15em; | ||
+ | width: max-content; | ||
+ | } | ||
+ | |||
+ | /* boldface breaks some things, like text colors */ | ||
+ | .petscop-textbox .mw-selflink, .petscop-font .mw-selflink { | ||
+ | font-weight: normal !important; | ||
+ | } | ||
+ | |||
+ | |||
+ | .petscop-textbox-light { | ||
+ | border: 5px solid gray; | ||
+ | background-color: white; | ||
+ | color: black; | ||
+ | border-color: #eee #bbb #888 #bbb; | ||
+ | box-shadow: 0px 0px 0px 2px black; | ||
+ | } | ||
+ | |||
+ | .petscop-textbox-pause { | ||
+ | border: none; | ||
+ | background-color: #fdf; | ||
+ | color: #725; | ||
+ | min-width: 9em; | ||
+ | } | ||
+ | |||
+ | .petscop-textbox-childlibrary { | ||
+ | border: 3px solid #c4d; | ||
+ | background-color: #b8f; | ||
+ | color: #fff; | ||
+ | text-align: center; | ||
+ | padding: 3px; | ||
+ | min-width: unset; | ||
+ | } | ||
+ | |||
+ | .petscop-textbox-childlibrary-inside { | ||
+ | border: 3px solid #519; | ||
+ | padding: 0.3em 0.5em; | ||
+ | } | ||
+ | |||
+ | .petscop-textbox-mikegrave { | ||
+ | border: 3px solid #000; | ||
+ | background-color: #000; | ||
+ | color: #aaa; | ||
+ | text-align: center; | ||
+ | padding: 0px; | ||
+ | min-width: unset; | ||
+ | } | ||
+ | |||
+ | .petscop-textbox-mikegrave-inside { | ||
+ | border: 5px solid #aaa; | ||
+ | border-width: 5px 5px; | ||
+ | padding: 0.3em 0.6em; | ||
+ | } | ||
+ | |||
+ | .petscop-textbox p, .petscop-textbox * p { | ||
+ | margin: 0; | ||
+ | line-height: normal; | ||
+ | } | ||
+ | .poem hr+br { | ||
+ | display: none; | ||
+ | } | ||
+ | |||
+ | .petscop-text-color { | ||
+ | color: transparent; | ||
+ | background: black; | ||
+ | -webkit-background-clip: text; | ||
+ | background-clip: text; | ||
+ | } | ||
+ | |||
+ | .petscop-textbox-light .petscop-color-green { background-image: linear-gradient(#0a0, #000); } | ||
+ | .petscop-color-green { background-image: linear-gradient(#0a0, #fff); } | ||
+ | .petscop-textbox-light .petscop-color-red { background-image: linear-gradient(#f00, #000); } | ||
+ | .petscop-color-red { background-image: linear-gradient(#f00, #fff); } | ||
+ | .petscop-textbox-light .petscop-color-purple { background-image: linear-gradient(#88c, #000); } | ||
+ | .petscop-color-purple { background-image: linear-gradient(#88c, #fff); } | ||
+ | .petscop-textbox-light .petscop-color-yellow { background-image: linear-gradient(#fe4, #000); } | ||
+ | .petscop-color-yellow { background-image: linear-gradient(#fe4, #fff); } | ||
+ | |||
+ | div#content a[href^="https://youtu.be"].external { | ||
+ | background:none !important; | ||
+ | padding: 0px !important; | ||
+ | } | ||
.breakout { | .breakout { | ||
float: right; | float: right; | ||
border: 1px solid #888; | border: 1px solid #888; | ||
− | background: # | + | background: #111; |
padding: 0.2em; | padding: 0.2em; | ||
} | } | ||
Line 12: | Line 122: | ||
.breakouttitle { | .breakouttitle { | ||
text-align: center; | text-align: center; | ||
− | background: # | + | background: #535; |
border-top: 1px solid #a6a; | border-top: 1px solid #a6a; | ||
border-bottom: 1px solid #a6a; | border-bottom: 1px solid #a6a; | ||
Line 19: | Line 129: | ||
input, textarea { | input, textarea { | ||
− | border: 1px solid # | + | border: 1px solid #888; |
− | background: # | + | background: #000; /* you can't fight f8 */ |
− | color: # | + | color: #ccc; |
} | } | ||
Line 30: | Line 140: | ||
table.prettytable { | table.prettytable { | ||
margin: 1em 1em 1em 0; | margin: 1em 1em 1em 0; | ||
− | background: # | + | background: #111; |
− | border: 1px # | + | border: 1px #555 solid; |
border-collapse: collapse; | border-collapse: collapse; | ||
} | } | ||
.wikitable th, .wikitable td, | .wikitable th, .wikitable td, | ||
.prettytable th, .prettytable td { | .prettytable th, .prettytable td { | ||
− | border: 1px # | + | border: 1px #555 solid; |
padding: 0.2em; | padding: 0.2em; | ||
} | } | ||
.wikitable th, | .wikitable th, | ||
.prettytable th { | .prettytable th { | ||
− | background: # | + | background: #222; |
text-align: center; | text-align: center; | ||
} | } | ||
Line 49: | Line 159: | ||
} | } | ||
+ | .mainpage-wrapper { | ||
+ | display: flex; | ||
+ | flex-wrap: wrap; | ||
+ | justify-content: space-around; | ||
+ | } | ||
− | + | .mainpage-wrapper > div { | |
− | + | min-width: 400px; | |
− | . | + | padding: 1em; |
− | + | flex-grow: 1; | |
− | + | flex-basis: 400px; | |
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } |
Latest revision as of 23:32, 22 November 2018
/* CSS placed here will be applied to all skins */ body { font-size: 125%; } /* Petscop textboxes */ @font-face { font-family: 'Petscop Wide'; src: url('/images/3/39/Petscop_Wide.woff') format('woff'), url('/images/8/86/Petscop_Wide.ttf') format('truetype'); } .petscop-font { font-family: 'Petscop Wide', Ubuntu Mono, Consolas, Monaco, Courier New, sans-serif; font-size: 24px; /* 16 */ font-style: normal; -webkit-font-smoothing: none; font-smooth: never; font-weight: normal !important; } .petscop-textbox { font-family: 'Petscop Wide', Ubuntu Mono, Consolas, Monaco, Courier New, sans-serif; font-size: 32px; font-weight: normal !important; border: 5px solid gray; background-color: #0f0909; padding: 0.3em 0.5em; margin: 4px auto; color: white; border-color: #0f0909 #070404 #040101 #070404; box-shadow: 0px 0px 0px 2px black; min-width: 15em; width: max-content; } /* boldface breaks some things, like text colors */ .petscop-textbox .mw-selflink, .petscop-font .mw-selflink { font-weight: normal !important; } .petscop-textbox-light { border: 5px solid gray; background-color: white; color: black; border-color: #eee #bbb #888 #bbb; box-shadow: 0px 0px 0px 2px black; } .petscop-textbox-pause { border: none; background-color: #fdf; color: #725; min-width: 9em; } .petscop-textbox-childlibrary { border: 3px solid #c4d; background-color: #b8f; color: #fff; text-align: center; padding: 3px; min-width: unset; } .petscop-textbox-childlibrary-inside { border: 3px solid #519; padding: 0.3em 0.5em; } .petscop-textbox-mikegrave { border: 3px solid #000; background-color: #000; color: #aaa; text-align: center; padding: 0px; min-width: unset; } .petscop-textbox-mikegrave-inside { border: 5px solid #aaa; border-width: 5px 5px; padding: 0.3em 0.6em; } .petscop-textbox p, .petscop-textbox * p { margin: 0; line-height: normal; } .poem hr+br { display: none; } .petscop-text-color { color: transparent; background: black; -webkit-background-clip: text; background-clip: text; } .petscop-textbox-light .petscop-color-green { background-image: linear-gradient(#0a0, #000); } .petscop-color-green { background-image: linear-gradient(#0a0, #fff); } .petscop-textbox-light .petscop-color-red { background-image: linear-gradient(#f00, #000); } .petscop-color-red { background-image: linear-gradient(#f00, #fff); } .petscop-textbox-light .petscop-color-purple { background-image: linear-gradient(#88c, #000); } .petscop-color-purple { background-image: linear-gradient(#88c, #fff); } .petscop-textbox-light .petscop-color-yellow { background-image: linear-gradient(#fe4, #000); } .petscop-color-yellow { background-image: linear-gradient(#fe4, #fff); } div#content a[href^="https://youtu.be"].external { background:none !important; padding: 0px !important; } .breakout { float: right; border: 1px solid #888; background: #111; padding: 0.2em; } .breakouttitle { text-align: center; background: #535; border-top: 1px solid #a6a; border-bottom: 1px solid #a6a; } input, textarea { border: 1px solid #888; background: #000; /* you can't fight f8 */ color: #ccc; } /* wikitable/prettytable class for skinning normal tables */ table.wikitable, table.prettytable { margin: 1em 1em 1em 0; background: #111; border: 1px #555 solid; border-collapse: collapse; } .wikitable th, .wikitable td, .prettytable th, .prettytable td { border: 1px #555 solid; padding: 0.2em; } .wikitable th, .prettytable th { background: #222; text-align: center; } .wikitable caption, .prettytable caption { font-weight: bold; } .mainpage-wrapper { display: flex; flex-wrap: wrap; justify-content: space-around; } .mainpage-wrapper > div { min-width: 400px; padding: 1em; flex-grow: 1; flex-basis: 400px; }