Difference between revisions of "MediaWiki:Common.css"
Jump to navigation
Jump to search
Line 26: | Line 26: | ||
small.jrdebug { display: none; } | small.jrdebug { display: none; } | ||
small.jrdebug span.debugDecor { display: none; } | small.jrdebug span.debugDecor { display: none; } | ||
} | |||
@media screen and (min-width: 415px) { | |||
/* Moving Image namespace */ | |||
.ns-162 .tplContainer .tplFlex { | |||
display:flex; | |||
flex:row; | |||
width:calc(95vw - 200px); | |||
justify-content: flex-start; | |||
} | |||
.ns-162 .tplContainer .tplFlex .tplFlexLeft { | |||
order: 1; | |||
width:680px; | |||
flex-shrink:0; | |||
border:5px solid rgba(255, 200, 200, .1); | |||
} | |||
.ns-162 .tplContainer .tplFlex .tplFlexRight { | |||
order: 2; | |||
max-width: 35vw; | |||
border:5px solid rgba(200, 200, 255, .1); | |||
flex-shrink:1; | |||
min-width: 180px; | |||
} | |||
} | } | ||
Line 71: | Line 93: | ||
span.edit-help-doc { | span.edit-help-doc { | ||
background-color:#e1ffec; | background-color:#e1ffec; | ||
color: #0e591e; | color: #0e591e; | ||
background-image: url(/skins/jjr/assets/info.svg); | background-image: url(/skins/jjr/assets/info.svg); | ||
background-position: center right; | |||
background-repeat: no-repeat; | |||
padding-right: 14px; | |||
background-size: 13px 13px; | |||
margin-left: 0.5em; | margin-left: 0.5em; | ||
border: 1px #effffa solid; | border: 1px #effffa solid; | ||
} | } | ||
/*Year Nav*/ | /*Year Nav*/ | ||
.yearNav { | .yearNav { | ||
display: flex; | |||
font-size: 2.3em; | |||
justify-content: center; | |||
align-items: center; | |||
} | } | ||
.yearNav .prev, .yearNav .next { font-size:0.7em; } | .yearNav .prev, .yearNav .next { font-size:0.7em; } | ||
.yearNav .curr { | .yearNav .curr { | ||
padding:0 1.5em 0; | padding:0 1.5em 0; | ||
font-weight:bold | font-weight:bold; | ||
} | } | ||
.ns-162 .tplEnd { | .ns-162 .tplEnd { | ||
clear:both; | clear:both; | ||
Line 137: | Line 136: | ||
.ns-162 .tplContainer .tplFlex dl { | .ns-162 .tplContainer .tplFlex dl { | ||
padding-right: 5rem; | padding-right: 5rem; | ||
border-right: 1px solid transparent; | border-right: 1px solid transparent; | ||
} | } | ||
Line 156: | Line 155: | ||
} | } | ||
@media only screen and (max-width: 982px) { | @media only screen and (max-width: 982px) { | ||
.ns-162 #mw-panel #p-film_links a { | .ns-162 #mw-panel #p-film_links a { | ||
line-height: 1.2; | |||
padding: 1px 4px; | |||
font-size: 1rem; | |||
} | } | ||
} | } | ||
@media screen and (min-width: 982px) { | @media screen and (min-width: 982px) { | ||
.ns-162 #mw-panel #p-film_links a { | .ns-162 #mw-panel #p-film_links a { | ||
line-height: 1.5; | |||
padding: 6px 18px; | |||
font-size: 1rem; | |||
} | } | ||
} | } | ||
.ns-162 #mw-panel #p-film_links a:hover { | .ns-162 #mw-panel #p-film_links a:hover { | ||
Line 181: | Line 180: | ||
.phc { | .phc { | ||
border: 2px dashed #eebbbb; | |||
background-color: #ffeaea; | |||
padding: 10px; | |||
margin: 3px; | |||
display:flex; | display:flex; | ||
flex-direction:column; | flex-direction:column; | ||
} | } | ||
.phc .phcWarnMain { | .phc .phcWarnMain { | ||
display:flex; | display:flex; | ||
flex-direction:row; | flex-direction:row; | ||
} | } | ||
.phc .phcWarnMain .phcicon svg{ | .phc .phcWarnMain .phcicon svg{ | ||
height: 34px; | |||
vertical-align: 1em; | |||
margin-top: 14px; | |||
margin-right: 20px; | |||
width: 34px; | |||
color:#eebbbb; | color:#eebbbb; | ||
} | } | ||
.phc .phcwarn { | .phc .phcwarn { | ||
font-size:1.5em; | font-size:1.5em; | ||
color:#da9a9a; | color:#da9a9a; | ||
width: 400px; | width: 400px; | ||
margin-right:10px; | margin-right:10px; | ||
} | } | ||
.phc .phcmain { | .phc .phcmain { | ||
font-size:1em; | font-size:1em; | ||
display:flex; | display:flex; | ||
flex-direction:column; | flex-direction:column; | ||
} | } | ||
.phc .phcseeing { | .phc .phcseeing { | ||
font-size:0.8em; | font-size:0.8em; | ||
align-self:center; | align-self:center; | ||
} | } | ||
small.debugData { | small.debugData { | ||
font-family: 'Courier New', monospace; | |||
color: #AAAAAA; | |||
font-size: 0.8em; | |||
margin-top: -9px; | |||
position: absolute; | |||
} | } | ||
small.debugData a {color:#999999;} | small.debugData a {color:#999999;} | ||
.docsub { | .docsub { | ||
font-size:1.1em; | font-size:1.1em; | ||
background-color:#e1ffec; | background-color:#e1ffec; | ||
padding:25px; | padding:25px; | ||
} | } | ||
span.descHeader { | span.descHeader { | ||
font-weight: bold; | |||
margin-bottom: 0.1em; | |||
} | } |
Revision as of 19:45, 9 January 2022
/* CSS placed here will be applied to all skins */ @media screen and (min-width: 982px) { div#mw-panel nav.portal div.vector-menu-content ul li, div#mw-panel nav.portal h3 { font-size: 1em; /* original was 0.75em */ } #p-logo { margin-bottom:0; margin-top: -18px; } #mw-panel, #p-logo, #p-logo a { width: 13em; /* 10em */ } .mw-body, #mw-head-base, #mw-data-after-content, .mw-footer, #left-navigation { margin-left: 12.6em; /* 11em */ } #p-logo, #p-logo a { height: 250px; } } /* Most Samsung phones and iPhones are less than 415 */ @media screen and (max-width: 415px) { small.debugData { display: none; } small.debugData a { display: none; } small.jrdebug { display: none; } small.jrdebug span.debugDecor { display: none; } } @media screen and (min-width: 415px) { /* Moving Image namespace */ .ns-162 .tplContainer .tplFlex { display:flex; flex:row; width:calc(95vw - 200px); justify-content: flex-start; } .ns-162 .tplContainer .tplFlex .tplFlexLeft { order: 1; width:680px; flex-shrink:0; border:5px solid rgba(255, 200, 200, .1); } .ns-162 .tplContainer .tplFlex .tplFlexRight { order: 2; max-width: 35vw; border:5px solid rgba(200, 200, 255, .1); flex-shrink:1; min-width: 180px; } } .wikiEditor-ui .wikiEditor-ui-toolbar .tabs span.tab-jrtools a { color: #c80874; font-weight: bold; } .wikiEditor-ui .wikiEditor-ui-toolbar .tabs span.tab-fontaw a { color: #a195aa; font-weight: bold; } .wikiEditor-ui .wikiEditor-ui-toolbar .tabs span.tab-filmtpl a { color: #a30ba5; font-weight: bold; } .wikiEditor-ui .wikiEditor-ui-toolbar .tabs span.tab-filmtpl a:hover, .wikiEditor-ui .wikiEditor-ui-toolbar .tabs span.tab-fontaw a:hover, .wikiEditor-ui .wikiEditor-ui-toolbar .tabs span.tab-jrtools a:hover { color:black; background-color:white; } small.jrdebug { color: #C8A9A9; float: right; font-size: 0.7em; display:block; position:absolute; top:-50px; right:1px; padding:4px; margin:15px; background-color:#fedaed; } small.jrdebug span.debugDecor { color:#e1c1d1; transform: rotate(90deg); transform: rotate(90deg); -ms-transform: rotate(90deg); /* for IE */ -webkit-transform: rotate(90deg); display: inline-block; } span.edit-help-doc { background-color:#e1ffec; color: #0e591e; background-image: url(/skins/jjr/assets/info.svg); background-position: center right; background-repeat: no-repeat; padding-right: 14px; background-size: 13px 13px; margin-left: 0.5em; border: 1px #effffa solid; } /*Year Nav*/ .yearNav { display: flex; font-size: 2.3em; justify-content: center; align-items: center; } .yearNav .prev, .yearNav .next { font-size:0.7em; } .yearNav .curr { padding:0 1.5em 0; font-weight:bold; } .ns-162 .tplEnd { clear:both; border-bottom: 1px #f2ece5 solid; } .ns-162 .embedvideo .embedvideo{ margin-left:1px; } .ns-162 .mw-parser-output div.tplContainer > p {font-size: 1.5em;} .ns-162 #mw-page-base{ background-image: -webkit-linear-gradient(top,#ffffff 50%,#f2ece5 100%); background-image: linear-gradient(to bottom,#ffffff 50%,#f2ece5 100%); } .ns-162 .mw-body{ border: 1px solid #cfb89d; } /*.ns-162 .vector-menu-tabs, .ns-162 .vector-menu-tabs a, .ns-162 #mw-head .vector-menu-dropdown h3*/ .ns-162 .catlinks{ border: 1px solid #cfb89d; } body.ns-162 { background-color: #f2ece5; } .ns-162 .tplContainer .tplFlex dl { padding-right: 5rem; border-right: 1px solid transparent; } .ns-162 #mw-panel #p-film_links a { cursor: pointer; outline: 0; display: inline-block; font-weight: bold; text-align: center; background-color: transparent; border: 1px solid transparent; color: #685c7a; border-color: #685c7a; background-color: #c9bddc; border-radius: .25rem; transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out; } @media only screen and (max-width: 982px) { .ns-162 #mw-panel #p-film_links a { line-height: 1.2; padding: 1px 4px; font-size: 1rem; } } @media screen and (min-width: 982px) { .ns-162 #mw-panel #p-film_links a { line-height: 1.5; padding: 6px 18px; font-size: 1rem; } } .ns-162 #mw-panel #p-film_links a:hover { color: #fff; background-color: #685c7a; border-color: #685c7a; } .ns-162 svg.fa-film { background-color: #CFEECF; padding: 1px 4px; } .phc { border: 2px dashed #eebbbb; background-color: #ffeaea; padding: 10px; margin: 3px; display:flex; flex-direction:column; } .phc .phcWarnMain { display:flex; flex-direction:row; } .phc .phcWarnMain .phcicon svg{ height: 34px; vertical-align: 1em; margin-top: 14px; margin-right: 20px; width: 34px; color:#eebbbb; } .phc .phcwarn { font-size:1.5em; color:#da9a9a; width: 400px; margin-right:10px; } .phc .phcmain { font-size:1em; display:flex; flex-direction:column; } .phc .phcseeing { font-size:0.8em; align-self:center; } small.debugData { font-family: 'Courier New', monospace; color: #AAAAAA; font-size: 0.8em; margin-top: -9px; position: absolute; } small.debugData a {color:#999999;} .docsub { font-size:1.1em; background-color:#e1ffec; padding:25px; } span.descHeader { font-weight: bold; margin-bottom: 0.1em; }