Main Page: Difference between revisions
From Zelda Wiki, the Zelda encyclopedia
m
Inserted css from hydradark.css
KokoroSenshi (talk | contribs) m (Tidied code) |
KokoroSenshi (talk | contribs) m (Inserted css from hydradark.css) |
||
| Line 114: | Line 114: | ||
</div> <!-- End of main-page div --> | </div> <!-- End of main-page div --> | ||
{{#css: | |||
/* main page */ | |||
.main-page { | |||
font-size: 15px; | |||
margin: 2em auto; | |||
width: 98%; | |||
} | |||
#mf-zw-logo img { | |||
max-width: 100%; | |||
height: auto; | |||
} | |||
.main-page input { | |||
max-width: 100%; | |||
} | |||
.empty-tile { | |||
display: none; | |||
} | |||
.spin-off-logo { | |||
display: block; | |||
} | |||
@media screen and (min-width: 950px) { | |||
.categories { | |||
max-width: 750px; | |||
} | |||
} | |||
@media screen and (min-width: 1180px) { | |||
.spin-off-logo, .empty-tile { | |||
display: inline-block; | |||
} | |||
} | |||
@media screen and (max-width: 1350px) { | |||
#dyk.infoblock { | |||
margin-top: 2em; | |||
order: 3; | |||
width: 100% !important; | |||
} | |||
#cdm-zone-02 { | |||
order: 2; | |||
} | |||
.infoblock-container { | |||
flex-wrap: wrap; | |||
} | |||
} | |||
@media screen and (min-width: 1650px) { | |||
.categories, .main-series { | |||
max-width: 1415px; | |||
} | |||
} | |||
@media screen and (min-width: 3000px) { | |||
.categories { | |||
max-width: 2750px; | |||
} | |||
} | |||
.year { | |||
bottom: 0.5em; | |||
color: rgba(255, 255, 255, 0.9); | |||
font-size: 12px; | |||
left: 1em; | |||
position: absolute; | |||
z-index: 10; | |||
} | |||
.game { | |||
display: inline-block; | |||
font-size: 0; | |||
margin: 2px; | |||
position: relative; | |||
} | |||
.game a { | |||
background-color: rgba(0, 0, 0, 0.6); | |||
clip: rect(0px, 230px, 125px, 0px); | |||
color: #ffffff; | |||
display: flex; | |||
flex-direction: column; | |||
font-size: 25px; | |||
font-style: normal; | |||
height: 101%; | |||
justify-content: center; | |||
line-height: 29px; | |||
position: absolute; | |||
text-decoration: none; | |||
width: 100%; | |||
} | |||
.game a:hover { | |||
background-color: rgba(0, 0, 0, 0.3); | |||
} | |||
.game-container { | |||
margin: 0 auto 3em; | |||
} | |||
.main-series, | |||
.remakes { | |||
display: flex; | |||
flex-flow: row-reverse wrap-reverse; | |||
justify-content: center; | |||
margin: 0 auto; | |||
} | |||
.remakes { | |||
max-width: 1000px; | |||
} | |||
.categories { | |||
margin: 0 auto; | |||
text-align: center; | |||
} | |||
.infoblock-container { | |||
display: flex; | |||
justify-content: center; | |||
margin: 3em auto; | |||
} | |||
.infoblock { | |||
background: #1d578b none repeat scroll 0 0; | |||
border-radius: 5px; | |||
margin: 0 1em; | |||
padding: 1em; | |||
text-align: left; | |||
vertical-align: top; | |||
} | |||
.infoblock-header { | |||
display: block; | |||
font-family: "Bowlby One"; | |||
font-size: 3em; | |||
letter-spacing: 1px; | |||
line-height: 1em; | |||
padding: 0 0.5em 0.2em; | |||
text-transform: uppercase; | |||
} | |||
#dyk.infoblock { | |||
width: 60%; | |||
} | |||
#news.infoblock { | |||
width: 40%; | |||
} | |||
@media screen and (max-width: 768px) { | |||
#dyk.infoblock { | |||
width: 100%; | |||
} | |||
#news.infoblock { | |||
width: 100%; | |||
} | |||
} | |||
#news.infoblock dl { | |||
display: none; | |||
} | |||
.infoblock.curse-ad { | |||
flex-shrink: 0; | |||
} | |||
#news.infoblock ul li { | |||
margin-bottom: 10px; | |||
} | |||
#dyk.infoblock ul li { | |||
margin-bottom: 20px; | |||
} | |||
/* NIWA nav */ | |||
#mf-NIWAnav .high-res { | |||
display:none; | |||
} | |||
@media screen and (min-width: 700px) { | |||
#mf-NIWAnav .low-res { | |||
display:none; | |||
} | |||
#mf-NIWAnav .high-res { | |||
display:block; | |||
} | |||
} | |||
#mf-NIWAnav .low-res img { | |||
height: auto; | |||
max-width: 100%; | |||
width: auto; | |||
} | |||
#mf-NIWAnav { /*The mf- prefix allows the nav to be included on the mobile main page */ | |||
background: #1d578b; | |||
border: 1px solid #426787; | |||
border-radius: 10px; | |||
box-sizing: border-box; | |||
margin: 0 auto; | |||
max-width: 1400px; /*Needs to be readjusted when new members are added. */ | |||
padding: 0.5em; | |||
text-align: center; | |||
} | |||
#mf-NIWAnav .cell { | |||
background: #17456e; | |||
border: 1px solid #426787; | |||
border-radius: 10px; | |||
display: inline-block; | |||
margin: 3px; | |||
padding: 10px 0; | |||
text-align: center; | |||
width: 165px; | |||
} | |||
#mf-NIWAnav .header { | |||
font-size:1.2em; | |||
} | |||
}} | |||
