This repository has been archived by the owner on Jul 11, 2019. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 26
/
index.html
146 lines (145 loc) · 6.81 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
<!doctype html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="A front-end template that helps you build fast, modern mobile web apps.">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>FOOTER</title>
<!-- Add to homescreen for Chrome on Android -->
<meta name="mobile-web-app-capable" content="yes">
<link rel="icon" sizes="192x192" href="images/touch/chrome-touch-icon-192x192.png">
<!-- Add to homescreen for Safari on iOS -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="Material Design Lite">
<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png">
<!-- Tile icon for Win8 (144x144 + tile color) -->
<meta name="msapplication-TileImage" content="images/touch/ms-touch-icon-144x144-precomposed.png">
<meta name="msapplication-TileColor" content="#3372DF">
<!-- SEO: If your mobile URL is different from the desktop URL, add a canonical link to the desktop page https://developers.google.com/webmasters/smartphone-sites/feature-phones -->
<!--
<link rel="canonical" href="http://www.example.com/">
-->
<!--<link href='//fonts.googleapis.com/css?family=Roboto:regular,bold,italic,thin,light,bolditalic,black,medium&lang=en' rel='stylesheet' type='text/css'>-->
<!--<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">-->
<link rel="stylesheet" href="packages/mdl/assets/styles/material.min.css">
<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="styles.css">
<style>
div.loading { display: none; }
body.mdl-upgrading > * { display: none; }
body.mdl-upgrading div.loading { display: block; }
header, body { padding: 0; margin: 0; }
</style>
</head>
<body class="demo-page demo-page--footer mdl-upgrading"> <div class="loading">Loading...</div>
<div class="mdl-layout mdl-js-layout mdl-color--grey-100">
<header class="mdl-layout__header mdl-layout__header--scroll mdl-layout--fixed-header mdl-color--grey-100 mdl-color-text--grey-800">
<div class="mdl-layout__header-row">
<span class="mdl-layout-title">FOOTER-Sample</span>
<div class="mdl-layout-spacer"></div>
</div>
</header>
<div class="ribbon mdl-color--primary"></div>
<main class="mdl-layout__content">
<div class="container mdl-grid">
<div class="mdl-cell mdl-cell--2-col mdl-cell--hide-tablet mdl-cell--hide-phone"></div>
<div class="content mdl-color--white mdl-shadow--4dp content mdl-color-text--grey-800 mdl-cell mdl-cell--8-col">
<section class="demo-section demo-section--footer">
<div class="demo-preview-block">
<footer class="mdl-mega-footer">
<div class="mdl-mega-footer--top-section">
<div class="mdl-mega-footer--left-section">
<!-- Content for the left section -->
</div>
<div class="mdl-mega-footer--right-section">
<a href="#">App Status Dashboard</a>
<a href="#">Terms of Service</a>
</div>
</div>
<div class="mdl-mega-footer--middle-section">
<div class="mdl-mega-footer--drop-down-section">
<input class="mdl-mega-footer--heading-checkbox" type="checkbox" checked>
<h1 class="mdl-mega-footer--heading">Learning & Support</h1>
<ul class="mdl-mega-footer--link-list">
<li><a href="#">Resource Center</a></li>
<li><a href="#">Help Center</a></li>
<li><a href="#">Community</a></li>
<li><a href="#">Learn with Google</a></li>
<li><a href="#">Small Business Community</a></li>
<li><a href="#">Think Insights</a></li>
</ul>
</div>
<div class="mdl-mega-footer--drop-down-section">
<input class="mdl-mega-footer--heading-checkbox" type="checkbox" checked>
<h1 class="mdl-mega-footer--heading">Just for Developers</h1>
<ul class="mdl-mega-footer--link-list">
<li><a href="#">Google Developers</a></li>
<li><a href="#">AdWords API</a></li>
<li><a href="#">AdWords Scipts</a></li>
<li><a href="#">AdWords Remarketing Tag</a></li>
</ul>
</div>
<div class="mdl-mega-footer--drop-down-section">
<input class="mdl-mega-footer--heading-checkbox" type="checkbox" checked>
<h1 class="mdl-mega-footer--heading">Related Products</h1>
<ul class="mdl-mega-footer--link-list">
<li><a href="#">Analytics Standard</a></li>
<li><a href="#">Shopping Ads</a></li>
<li><a href="#">Trusted Store</a></li>
<li><a href="#">AdSense</a></li>
</ul>
</div>
<div class="mdl-mega-footer--drop-down-section">
<input class="mdl-mega-footer--heading-checkbox" type="checkbox" checked>
<h1 class="mdl-mega-footer--heading">More solutions from Google</h1>
<ul class="mdl-mega-footer--link-list">
<li><a href="#">Google for Advertising</a></li>
<li><a href="#">Google for Business</a></li>
</ul>
</div>
</div>
<div class="mdl-mega-footer--bottom-section">
<div class="mdl-logo mdl-typography--subhead">
<strong>Title</strong>
</div>
<ul class="mdl-mega-footer--link-list">
<li><a href="#">Help</a></li>
<li><a href="#">Privacy & Terms</a></li>
</ul>
</div>
</footer>
<footer class="mdl-mini-footer">
<div class="mdl-mini-footer--left-section">
<div class="mdl-logo mdl-typography--subhead">
<strong>Title</strong>
</div>
<ul class="mdl-mini-footer--link-list">
<li><a href="#">Help</a></li>
<li><a href="#">Privacy & Terms</a></li>
</ul>
</div>
<div class="mdl-mini-footer--right-section">
<!-- Content for the right section -->
</div>
</footer>
</div>
</section>
</div>
</div>
</main>
<footer class="mdl-mini-footer">
<div class="mdl-mini-footer--left-section">
<p class="sitegen-link">Page was generated with <a href="https://pub.dartlang.org/packages/sitegen" target="_blank">SiteGen.</a>
<span class="additional-info">The static site generator for Dart.</span></p>
</div>
</footer>
</div>
<a href="https://github.com/MikeMitterer/dart-material-design-lite/tree/mdl/example/mdl_footer/web" target="_blank" id="view-source">
<button class="mdl-button mdl-js-button mdl-button--fab mdl-js-ripple-effect mdl-button--accent"><i class="material-icons">pageview</i></button>
</a>
<script type="application/dart" src="main.dart"></script>
<script data-pub-inline src="packages/browser/dart.js"></script>
</body>
</html>