Created
March 8, 2016 15:59
-
-
Save tribou/c4ab59308bb7b1748ca3 to your computer and use it in GitHub Desktop.
Sample HTML index page template
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta | |
charset="utf-8" | |
></meta> | |
<meta | |
name="viewport" | |
content="width=device-width, initial-scale=1, maximum-scale=1" | |
></meta> | |
<meta | |
name="theme-color" | |
content="#00d2ff"> | |
</meta> | |
<meta name="application-name" content="HTML Template"> | |
<meta name="msapplication-TileImage" content="/images/favicons/icon-144.png"> | |
<meta name="msapplication-TileColor" content="#00d2ff"> | |
<title> | |
HTML Template | |
</title> | |
<link | |
href="https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.min.css" | |
rel="stylesheet"></link> | |
<link | |
rel="shortcut icon" | |
sizes="16x16" | |
href="/images/favicons/icon-16.png"> | |
</link> | |
<link | |
rel="shortcut icon" | |
sizes="24x24" | |
href="/images/favicons/icon-24.png"> | |
</link> | |
<link | |
rel="shortcut icon" | |
sizes="32x32" | |
href="/images/favicons/icon-32.png"> | |
</link> | |
<link | |
rel="shortcut icon" | |
sizes="48x48" | |
href="/images/favicons/icon-48.png"> | |
</link> | |
<link | |
rel="shortcut icon" | |
sizes="64x64" | |
href="/images/favicons/icon-64.png"> | |
</link> | |
<link | |
rel="icon" | |
sizes="152x152" | |
href="/images/favicons/icon-152.png"> | |
</link> | |
<link | |
rel="apple-touch-icon-precomposed" | |
sizes="57x57" | |
href="/images/favicons/icon-57.png"> | |
</link> | |
<link | |
rel="apple-touch-icon-precomposed" | |
sizes="72x72" | |
href="/images/favicons/icon-72.png"> | |
</link> | |
<link | |
rel="apple-touch-icon-precomposed" | |
sizes="114x114" | |
href="/images/favicons/icon-114.png"> | |
</link> | |
<link | |
rel="apple-touch-icon-precomposed" | |
sizes="120x120" | |
href="/images/favicons/icon-120.png"> | |
</link> | |
<link | |
rel="apple-touch-icon-precomposed" | |
sizes="144x144" | |
href="/images/favicons/icon-144.png"> | |
</link> | |
<link | |
rel="apple-touch-icon-precomposed" | |
sizes="152x152" | |
href="/images/favicons/icon-152.png"> | |
</link> | |
<style> | |
body { | |
background: #00d2ff; /* fallback for old browsers */ | |
background: -webkit-linear-gradient(to left, #00d2ff , #3a7bd5); /* Chrome 10-25, Safari 5.1-6 */ | |
background: linear-gradient(to left, #00d2ff , #3a7bd5); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */ | |
color: #FFFFFF; | |
} | |
.app { | |
width: 100%; | |
} | |
.construction { | |
/*background-image: url('/images/under_construction.png');*/ | |
background-repeat: no-repeat; | |
background-position: center center; | |
-webkit-background-size: 630px 290px; | |
-moz-background-size: 630px 290px; | |
-o-background-size: 630px 290px; | |
background-size: 630px 290px; | |
width: 630px; | |
height: 290px; | |
margin: 0 auto; | |
margin-top: 20vh; | |
text-align: center; | |
} | |
@media (max-width: 767px) { | |
.construction { | |
-webkit-background-size: 315px 145px; | |
-moz-background-size: 315px 145px; | |
-o-background-size: 315px 145px; | |
background-size: 315px 145px; | |
width: 315px; | |
height: 145px; | |
} | |
} | |
</style> | |
</head> | |
<body> | |
<div class="app"> | |
<div class="construction"> | |
<h1> | |
HTML Template | |
</h1> | |
</div> | |
</div> | |
<!-- | |
<script | |
src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js" | |
></script> | |
<script | |
src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" | |
></script> | |
--> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment