-
Notifications
You must be signed in to change notification settings - Fork 13
/
demo.html
69 lines (66 loc) · 1.79 KB
/
demo.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<link rel="stylesheet" href="css/styles.css">
<title>Name Of Page</title>
<template id="nav">
<b-ox class="u-invert" pad="2">
<s-pread>
<a class="u-h2" href="#">Bruck</a>
<l-ine between="·">
<a href="#index">Home</a>
<a href="#about">About</a>
</l-ine>
</s-pread>
</b-ox>
</template>
</head>
<body>
<s-creen id="index">
<c-omment wording="This is the page header">
<c-lone of="nav" class="u-invert"></c-lone>
</c-omment>
<b-ox pad="2">
<c-enter>
<s-tack>
<c-omment wording="There must be one h1 per page">
<h1>Hello world!</h1>
</c-omment>
<s-tack repeat="2">
<t-ext words="15,40"></t-ext>
</s-tack>
<g-rid>
<i-mage ratio="1:3" caption="A placeholder image"></i-mage>
<i-mage ratio="1:3" caption="Another fake image"></i-mage>
</g-rid>
<s-tack repeat="2">
<t-ext words="15,40"></t-ext>
</s-tack>
</s-tack>
</c-enter>
</b-ox>
</s-creen>
<s-creen id="about">
<c-omment wording="This is the page header">
<c-lone of="nav" u-invert></c-lone>
</c-omment>
<b-ox pad="2">
<c-enter>
<s-tack>
<c-omment wording="There must be one h1 per page">
<h1>The about page!</h1>
</c-omment>
<s-tack repeat="5">
<t-ext words="15,40"></t-ext>
</s-tack>
</s-tack>
</c-enter>
</b-ox>
</s-creen>
<script src="js/app.js" type="module">
</script>
</body>
</html>