-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
130 lines (113 loc) · 4.64 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
<!DOCTYPE html>
<html>
<head>
<title>EXOcss (beta)</title>
<!-- META -->
<meta name="creator" content="Walid Moussa (MW)">
<meta name="author" content="Walid Moussa (MW)">
<meta name="publisher" content="Walid Moussa (MW)">
<meta name="copyright" content="Walid Moussa (MW)">
<meta name="abstract"
content="EXOcss is a css skeleton for creating responsive websites or web apps ultra fast with flexbox or floating. flexible. lightweight. responsive.">
<meta charset="utf-8">
<meta name="language" content="Deutsch">
<meta name="charset" content="utf-8">
<meta name="description"
content="EXOcss is a css skeleton for creating responsive websites or web apps ultra fast with flexbox or floating. flexible. lightweight. responsive.">
<meta name="keywords" content="EXOcss,css,framework,library,modules,flexbox,floating,responsive">
<meta name="application-name" content="EXOcss">
<meta name="generator" content="MWAPP">
<meta name="reply-to" content="">
<meta name="geo.placename" content="Castrop-Rauxel, Nordrhein-Westfalen, Germany">
<meta name="geo.region" content="DE-NW">
<meta name="resource-type" content="document">
<meta name="revisit-after" content="7 days">
<meta name="robots" content="index;follow">
<meta name="expires" content="0">
<meta name="googlebot" content="noarchive">
<meta name="googlebot" content="code">
<meta name="googlebot" content="noodp">
<link rel="author" href="humans.txt">
<!-- MOBILE -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- EXOcss NORMALIZE -->
<link href="css/otherCSS/normalize.min.css" rel="stylesheet">
<!-- EXOcss CORE -->
<link href="css/EXOcss/modules/base/exo.css" rel="stylesheet">
<!-- EXOcss MODULES -->
<link href="css/EXOcss/modules/base/exoFloatPercent.css" rel="stylesheet">
<link href="css/EXOcss/modules/header/exoHeader.css" rel="stylesheet">
<link href="css/EXOcss/modules/heading/exoHeading.css" rel="stylesheet">
<link href="css/EXOcss/modules/horizontalLine/exoHorizontalLine.css" rel="stylesheet">
<link href="css/EXOcss/modules/typography/exoTypography.css" rel="stylesheet">
<!-- EXOcss CUSTOM STYLES -->
<link href="css/EXOcss/custom.css" rel="stylesheet">
</head>
<body>
<header class="exoRow exoTextCenter">
<div class="exoCol exoCol100">
<h1 class="exoTextCenter">EXO<span style="color: gray;font-style: italic;font-size: 0.75em;">css
(beta)</span>
</h1>
<p style="font-style: italic;padding-bottom: 0.5em;">flexible. lightweight. responsive.</p>
<p>EXOcss is a css skeleton for creating responsive websites or web apps ultra fast with flexbox or
floating.</p>
</div>
</header>
<div class="exoRow exoTextCenter">
<div class="exoCol col100">
<p class="titleMain">STYLE GUIDE</p>
<p style="font-weight: bold;">the style guide is the best way to show examples of EXOcss</p>
<p style="font-size: smaller;">(notice: this page is constantly being updated and expanded, more to come.)
</div>
</div>
<p class="titleSub">Heading</p>
<hr>
<div class="row exoTextCenter">
<div class="exoCol col100">
<h1>EXOcss H1</h1>
<h2>EXOcss H2</h2>
<h3>EXOcss H3</h3>
<h4>EXOcss H4</h4>
<h5>EXOcss H5</h5>
<h6>EXOcss H6</h6>
</div>
</div>
<p class="titleSub">Typography</p>
<hr>
<div class="exoRow exoTextCenter">
<div class="exoCol">
<p>Paragraph</p>
</div>
</div>
<p class="titleSub">COLS & ROWS</p>
<hr>
<div class="exoRow exoTextCenter">
<p>1 COLUMN</p>
<div class="exoCol col100 bg1">1. COLUMN: .exoCol</div>
</div>
<hr>
<p>2 COLUMNS</p>
<div class="exoRow exoTextCenter">
<div class="exoCol col50 bg1">1. COLUMN: .exoCol .exoCol50</div>
<div class="exoCol col50 bg2">2. COLUMN: .exoCol .exoCol50</div>
</div>
<hr>
<p>3 COLUMNS</p>
<div class="exoRow exoTextCenter">
<div class="exoCol exoCol30 bg1">1. COLUMN: .exoCol .exoCol30</div>
<div class="exoCol exoCol30 offsetLeft5 offsetRight5 bg2 ">2. COLUMN: .exoCol .offsetLeft5 .exoCol30
.offsetRight5
</div>
<div class="exoCol exoCol30 bg3">3. COLUMN: .exoCol .exoCol30</div>
</div>
<div class="hide">
<p class="titleSub">MODULE</p>
<hr>
<div class="row exoTextCenter">
<div class="exoCol">
</div>
</div>
</div>
</body>
</html>