Template:Hero: Difference between revisions
From WikiMSK
No edit summary |
No edit summary |
||
(12 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
<html> | <html> | ||
<link rel="preconnect" href="https://fonts.googleapis.com"> | |||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> | |||
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:ital,wght@0,400;0,700;1,400&display=swap" rel="stylesheet"> | |||
<style> | <style> | ||
.hero{ | .hero{ | ||
background-image: url("https://wikimsk.org/w/img_auth.php/ | background-image: url("https://wikimsk.org/w/img_auth.php/a/ac/Reading_man.jpg"); | ||
height: 350px; | height: 350px; | ||
background-position: center; | background-position: center; | ||
Line 12: | Line 14: | ||
justify-content: center; /* align horizontal */ | justify-content: center; /* align horizontal */ | ||
align-items: center; /* align vertical */ | align-items: center; /* align vertical */ | ||
width:99%; | |||
} | } | ||
.hero-text{ | .hero-text{ | ||
font-family:"Josefin Sans" | font-family:"Josefin Sans"; | ||
padding:2em; | padding:2em; | ||
line-height:1rem; | line-height:1rem; | ||
Line 27: | Line 29: | ||
.hero-title{ | .hero-title{ | ||
font-size:80px; | font-size:80px; | ||
margin-bottom: | margin-bottom:1.2rem; | ||
font-weight:900; | font-weight:900; | ||
line-height:1. | line-height:1.3em; | ||
text-align: center; | text-align: center; | ||
text-decoration: underline; | text-decoration: underline; | ||
text-decoration-color: #3498db; | text-decoration-color: #3498db; | ||
text-shadow: 2px 2px DimGray; | text-shadow: 2px 2px DimGray; | ||
} | text-underline-offset: 4px; | ||
} | |||
.hero-caption{ | .hero-caption{ | ||
font-size:30px; | font-size:30px; | ||
text-align: center; | text-align: center; | ||
line-height:1.1em; | line-height:1.1em; | ||
background-color: var(--medik); | |||
padding-top: 0.3rem; | |||
padding-left: 0.4rem; | |||
padding-right: 0.4rem; | |||
} | } | ||
@media only screen and (max-width: | @media only screen and (max-width: 1000px) { | ||
.hero-caption{ | .hero-caption{ | ||
font-size:20px; | font-size:20px; | ||
Line 48: | Line 54: | ||
.hero-title{ | .hero-title{ | ||
font-size:60px; | font-size:60px; | ||
} | |||
} | |||
@media only screen and (max-width: 550px) { | |||
.hero-caption{ | |||
font-size:16px; | |||
} | |||
.hero-title{ | |||
font-size:50px; | |||
} | } | ||
} | } | ||
Line 55: | Line 69: | ||
<div class="hero-text"> | <div class="hero-text"> | ||
<div class="hero-title">WELCOME TO <span style="color:#3498db">WIKIMSK</span></div> | <div class="hero-title">WELCOME TO <span style="color:#3498db">WIKIMSK</span></div> | ||
<div class="hero-caption"> | <div class="hero-caption">The New Zealand Musculoskeletal Medicine Wiki</div> | ||
</div> | </div> | ||
</div> | </div> | ||
<noinclude>[[Category:Main Page Templates]]</noinclude> | <noinclude>[[Category:Main Page Templates]]</noinclude> |
Latest revision as of 18:01, 15 April 2023
WELCOME TO WIKIMSK