-
Notifications
You must be signed in to change notification settings - Fork 21
/
index.html
195 lines (179 loc) · 10.8 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
<!--<!doctype html>-->
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!-->
<html class="no-js">
<!--<![endif]-->
<head>
<meta charset="utf-8" />
<!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<!-- Mobile viewport optimized: h5bp.com/viewport -->
<meta name="viewport" content="width=device-width">
<!-- [1]: Add your own title for your site -->
<title>MetroAppSite</title>
<meta name="robots" content="index">
<meta name="description" content="Windows Store App Website Template" />
<meta name="keywords" content="markedup, modern ui, modern-ui, metro, metroui, metro-ui, metro ui, windows 8, metro style, bootstrap, framework, web framework, css, html" />
<meta name="author" content="Markedup" />
<!-- remove or comment this line if you want to use the local fonts -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700' rel='stylesheet' type='text/css'>
<!--<link rel="stylesheet" type="text/css" href="content/css/bootstrap.css">-->
<link rel="stylesheet" type="text/css" href="content/css/bootmetro-icons.css">
<link rel="stylesheet" type="text/css" href="content/css/bootmetro.css">
<link rel="stylesheet" type="text/css" href="content/css/bootmetro-responsive.css">
<!-- <link rel="stylesheet" type="text/css" href="content/css/bootmetro-ui-light.css"> -->
<link href="content/css/metro-ui-dark.css" rel="stylesheet" />
<link rel="stylesheet" type="text/css" href="content/css/metroAppSite.css">
<!-- these two css are to use only for documentation -->
<link rel="stylesheet" type="text/css" href="content/css/demo.css">
<link rel="stylesheet" type="text/css" href="scripts/google-code-prettify/prettify.css">
<!-- Le fav and touch icons -->
<link rel="shortcut icon" href="content/ico/favicon.ico">
<link rel="apple-touch-icon-precomposed" sizes="144x144" href="content/ico/apple-touch-icon-144-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="content/ico/apple-touch-icon-114-precomposed.png">
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="content/ico/apple-touch-icon-72-precomposed.png">
<link rel="apple-touch-icon-precomposed" href="content/ico/apple-touch-icon-57-precomposed.png">
<!-- All JavaScript at the bottom, except for Modernizr and Respond.
Modernizr enables HTML5 elements & feature detects; Respond is a polyfill for min/max-width CSS3 Media Queries
For optimal performance, use a custom Modernizr build: www.modernizr.com/download/ -->
<script src="scripts/modernizr-2.6.2.min.js"></script>
</head>
<body>
<!--[if lt IE 7]>
<p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
<![endif]-->
<header id="hero" class="">
<div class="jumbotron masthead">
<div class="container-fluid">
<div class="row-fluid">
<div class="inner span4">
<!-- [1]: Add your own marketing text (title, subtitle, features, testimonials, etc...) -->
<h1>MetroAppSite</h1>
<p>A simple HTML, CSS, and Javascript website template to help promote Windows Store applications.</p>
<p>
<a class="btn btn-large btn-primary" href="https://github.com/markedup-mobi/metroappsite-html5">Download Now
<i class="icon-arrow-right-7"></i>
</a>
<br />
<span class="label label-success">Latest version: 0.1</span>
</p>
<h3>Features</h3>
<ul>
<li>Metro UI, branding, and Microsoft Surface<sup>TM</sup> smooth screenshot slider.</li>
<li>Fully configurable branding and content.</li>
<li>Customizeable and extensible UI built with <a href="http://twitter.github.com/bootstrap/">Twitter Bootstrap</a> and <a href="http://aozora.github.com/bootmetro/">BootMetro</a></li>
<li>Includes privacy policy template, which is required to publish in the Windows Store.</li>
<li>Integrates with <a href="http://uservoice.com/">UserVoice</a> and Google Analytics to help you manage your app's presence online.</li>
<li><a href="https://github.com/markedup-mobi/metroappsite-html5">Download from Github</a></li>
</ul>
</div>
<div class="span4" id="surfacedCarousel">
<!-- [2]: add your own carousel images -->
<div id="bootFlipView" class="myCarousel carousel flipview slide ">
<div class="carousel-inner">
<div class="item active">
<img src="content/img/1m.jpg" alt="">
</div>
<div class="item">
<img src="content/img/2m.jpg" alt="">
</div>
<div class="item">
<img src="content/img/3m.jpg" alt="">
</div>
</div>
<a class="left carousel-control" href="#bootFlipView" data-slide="prev"></a>
<a class="right carousel-control" href="#bootFlipView" data-slide="next"></a>
</div>
</div>
</div>
</div>
</div>
</header>
<div id="home-tiles" class="container-fluid metro-responsive-tiles">
<div class="row-fluid">
<div class="span4 tile wide text no-click">
<h3>Testimonials</h3>
<div class="metro tile text5 no-click">
<blockquote>
MetroAppSite helped me get an amazing, professional-looking template up and running for my Windows Store app in minutes!
</blockquote>
- Aaron Stannard, Ex-Microsoftie
</div>
<div class="metro tile text5 no-click">
<blockquote>
I ran out of material for stock testimonials, but you get the idea!
</blockquote>
- Cenk Ayberkin, MarkedUp Developer
</div>
</div>
<div class="span4 offset1">
<h3>Latest</h3>
<!--
[3]: Go to https://dev.twitter.com/docs/embedded-timelines to get an embedded timeline for your own app
-->
<a class="twitter-timeline" data-dnt="true" href="https://twitter.com/MarkedUpMobi" data-widget-id="281103187757375488">Tweets by @MarkedUpMobi</a>
<script>!function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (!d.getElementById(id)) { js = d.createElement(s); js.id = id; js.src = "https://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs); } }(document, "script", "twitter-wjs");</script>
</div>
</div>
</div>
<!-- Grab Google CDN's jQuery. fall back to local if necessary -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script>window.jQuery || document.write("<script src='scripts/jquery-1.8.3.min.js'>\x3C/script>")</script>
<script type="text/javascript" src="scripts/google-code-prettify/prettify.js"></script>
<script type="text/javascript" src="scripts/bootstrap.min.js"></script>
<footer class="win-commandlayout navbar-fixed-bottom win-ui-light">
<div class="container">
<div class="row">
<div class="span6 align-left">
<a href="index.html" class="win-command">
<span class="win-commandimage icon-home-4 win-commandring"></span>
<span class="win-label">Home</span>
</a>
<hr class="win-command" />
<!-- [7]: Change this to the URL of your app on the Windows Store -->
<a href="https://github.com/markedup-mobi/metroappsite-html5" class="win-command">
<span class="win-commandimage win-commandring"></span>
<span class="win-label">Download</span>
</a>
<a href="privacy.html" class="win-command">
<span class="win-commandimage win-commandring icon-key-stroke"></span>
<span class="win-label">Privacy</span>
</a>
</div>
</div>
</div>
</footer>
<div class="container-fluid">
<div class="row-fluid">
<p><a href="https://github.com/markedup-mobi/metroappsite-html5">MetroAppSite HTML5</a> by <a href="https://markedup.com/">MarkedUp Analytics for Windows 8</a></p>
</div>
</div>
<!-- [4]: Replace this with your own Google Analytics information -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'YOUR GOOGLE ANALYTICS ACCOUNT ID HERE']);
_gaq.push(['_trackPageview']);
(function () {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
<!-- [4]: Replace this with your own UserVoice information -->
<script type="text/javascript">
var uvOptions = {};
(function () {
var uv = document.createElement('script'); uv.type = 'text/javascript'; uv.async = true;
uv.src = ('https:' == document.location.protocol ? 'https://' : 'http://') + 'widget.uservoice.com/UHvAZgKqBv1lTxoSODXliw.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(uv, s);
})();
</script>
<script type="text/javascript">
$("document").ready(function () {
$('#bootFlipView').carousel({ interval: 3500 });
});
</script>
</body>
</html>