Difference between revisions of "User:DustyFB/Sandbox/Templates/Template:Spaceship Infobox Begin"
Jump to navigation
Jump to search
(DustyFB moved page User:DustyFB/Sandbox/Templates/Template:Spaceship Infobox Begin to User:DustyFB/Sandbox/Templates/Template:SB Infobox Begin) Tag: New redirect |
|||
(2 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
# | <includeonly><div class="SB-Infobox">{{#invoke:SB_Infobox_Begin|main}}</div> | ||
{{#css: | |||
.SB-Infobox { | |||
border:2px solid #304344; | |||
width:25vw; | |||
max-width:40em; | |||
float:right; | |||
clear:right; | |||
margin: 10px 10px; | |||
padding: 10px 10px; | |||
background:rgba(49, 68, 77, 0.15); | |||
} | |||
.SB-Infobox-Header { | |||
text-align: center; | |||
margin-bottom: 0.25em; | |||
} | |||
.SB-Infobox-Header img { | |||
height: auto; | |||
width: 100%; | |||
background: linear-gradient(transparent, #3a808045); | |||
display: block; | |||
outline: 2px solid #305e60; | |||
} | |||
.SB-Infobox-Header-Caption { | |||
display: block; | |||
font-style: italic; | |||
margin-top: 0.25em; | |||
} | |||
.SB-Infobox-Name { | |||
font-family: KenneyFuture; | |||
font-size:2em; | |||
color:#edcd50; | |||
text-align: center; | |||
background: #38586082; | |||
} | |||
.SB-Infobox-Data-Section-Header::before { | |||
content: " "; | |||
display: block; | |||
position: relative; | |||
top: -1em; | |||
border-top: 1px solid #394442; | |||
} | |||
.SB-Infobox-Data-Section-Header { | |||
width: 100%; | |||
text-align: center; | |||
margin: auto; | |||
background: #2b42488c; | |||
font-family: kenney future narrow; | |||
font-size: 1.4em; | |||
margin-top: 1em; | |||
} | |||
.SB-Infobox-Data-Section { | |||
text-align: center; | |||
} | |||
.SB-Infobox-Data-Cell { | |||
display:flex; | |||
text-align:left; | |||
padding:0 0.4em; | |||
font-size:1.25em | |||
} | |||
.SB-Infobox-Cell-Header { | |||
font-weight:bold; | |||
flex:48%; | |||
min-width:min-content; | |||
margin-right:4%; | |||
} | |||
.SB-Infobox-Cell-Body { | |||
flex:50%; | |||
margin: auto; | |||
} | |||
.SB-Infobox-Faction-Logo img { | |||
max-width: 15%; | |||
width:auto; | |||
height:auto; | |||
position: absolute; | |||
bottom: 0.25em; | |||
right: 0.25em; | |||
opacity: 0.8; | |||
outline:none; | |||
background:none; | |||
} | |||
.SB-Infobox-Image-Wrap { | |||
position: relative; | |||
} | |||
/* Portrait orientation. Also, low-res viewports */ | |||
@media | |||
only screen and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait), | |||
only screen and ( min--moz-device-pixel-ratio: 2) and (orientation: portrait), | |||
only screen and ( -o-min-device-pixel-ratio: 2/1) and (orientation: portrait), | |||
only screen and ( min-device-pixel-ratio: 2) and (orientation: portrait), | |||
only screen and ( min-resolution: 192dpi) and (orientation: portrait), | |||
only screen and ( min-resolution: 2dppx) and (orientation: portrait), | |||
only screen and (max-width: 800px) and (orientation: portrait) { | |||
.SB-Infoboxbox { | |||
width:auto; | |||
float:none; | |||
clear:none; | |||
font-size:1.5em; | |||
} | |||
} | |||
@media | |||
only screen and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape), | |||
only screen and ( min--moz-device-pixel-ratio: 2) and (orientation: landscape), | |||
only screen and ( -o-min-device-pixel-ratio: 2/1) and (orientation: landscape), | |||
only screen and ( min-device-pixel-ratio: 2) and (orientation: landscape), | |||
only screen and ( min-resolution: 192dpi) and (orientation: landscape), | |||
only screen and ( min-resolution: 2dppx) and (orientation: landscape) { | |||
.SB-Infoboxbox { | |||
width:40%; | |||
font-size:0.9em; | |||
} | |||
} | |||
}}</includeonly> |