Skip to content

Commit 11a5522

Browse files
aldis-ameriksaldis-ameriks
committed
Reformat index.html with prettier
1 parent c180c53 commit 11a5522

File tree

1 file changed

+89
-87
lines changed

1 file changed

+89
-87
lines changed

‎index.html

Lines changed: 89 additions & 87 deletions
Original file line numberDiff line numberDiff line change
@@ -1,102 +1,103 @@
11
<!DOCTYPE html>
22
<html>
3-
4-
<head>
5-
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
6-
<link rel="stylesheet" href="grid.css">
3+
<head>
4+
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
5+
<link rel="stylesheet" href="grid.css" />
76

87
<title>Infinity CSS Grid</title>
98
<style>
10-
* {box-sizing: border-box}
11-
12-
body {
13-
margin: 0;
14-
font-size: 17px;
15-
background-color: #333;
16-
font-family: Helvetica, Arial, sans-serif;
17-
}
18-
h1 {
19-
font-size: 32px;
20-
font-family: "HelveticaNeueThin", "HelveticaNeue-Thin", "Helvetica Neue Thin", Arial, sans-serif;
21-
font-weight: 200;
22-
font-stretch: normal;
23-
24-
}
25-
a {color:#fff}
26-
27-
#main{
28-
margin: 0 auto; width: 80%; padding: 8px;
29-
background-color: #fff;
30-
}
31-
32-
33-
34-
35-
.column,.merge2,.merge3 {
36-
37-
color: #fff;
38-
background-color: #00bbeb;
39-
padding: 15px;
40-
margin: 10px 8px 10px 8px;
41-
text-align: center;
42-
}
43-
44-
9+
* {
10+
box-sizing: border-box;
11+
}
12+
13+
body {
14+
margin: 0;
15+
font-size: 17px;
16+
background-color: #333;
17+
font-family: Helvetica, Arial, sans-serif;
18+
}
19+
h1 {
20+
font-size: 32px;
21+
font-family: 'HelveticaNeueThin', 'HelveticaNeue-Thin', 'Helvetica Neue Thin', Arial,
22+
sans-serif;
23+
font-weight: 200;
24+
font-stretch: normal;
25+
}
26+
a {
27+
color: #fff;
28+
}
29+
30+
#main {
31+
margin: 0 auto;
32+
width: 80%;
33+
padding: 8px;
34+
background-color: #fff;
35+
}
36+
37+
.column,
38+
.merge2,
39+
.merge3 {
40+
color: #fff;
41+
background-color: #00bbeb;
42+
padding: 15px;
43+
margin: 10px 8px 10px 8px;
44+
text-align: center;
45+
}
4546
</style>
46-
</head>
47-
48-
<body>
47+
</head>
4948

50-
51-
<div id="main">
52-
<div class="row">
53-
<div class="column" style="border:0; background:none" ><img src="infinity.svg" style="width:600px" /></div>
49+
<body>
50+
<div id="main">
51+
<div class="row">
52+
<div class="column" style="border:0; background:none">
53+
<img src="infinity.svg" style="width:600px" />
5454
</div>
55+
</div>
5556

56-
<div class="row">
57-
<div class="column"> <h1>Infinity CSS Grid</h1></div>
58-
</div>
57+
<div class="row">
58+
<div class="column"><h1>Infinity CSS Grid</h1></div>
59+
</div>
5960

60-
<div class="row">
61-
<div class="column"> <p> Fluid Flex Solution for making infinite grid columns.</p></div>
62-
</div>
61+
<div class="row">
62+
<div class="column"><p>Fluid Flex Solution for making infinite grid columns.</p></div>
63+
</div>
6364

64-
<div class="row">
65+
<div class="row">
6566
<div class="column">50%</div>
6667
<div class="column">50%</div>
67-
</div>
68+
</div>
6869

69-
<div class="row">
70+
<div class="row">
7071
<div class="column">33,3%</div>
7172
<div class="column">33,3%</div>
7273
<div class="column">33,3%</div>
73-
</div>
74+
</div>
7475

75-
<div class="row">
76+
<div class="row">
7677
<div class="column">25%</div>
7778
<div class="column">25%</div>
7879
<div class="column">25%</div>
7980
<div class="column">25%</div>
80-
</div>
81+
</div>
8182

82-
<div class="row">
83+
<div class="row">
8384
<div class="column">20%</div>
8485
<div class="column">20%</div>
8586
<div class="column">20%</div>
8687
<div class="column">20%</div>
8788
<div class="column">20%</div>
88-
</div>
89+
</div>
8990

90-
<div class="row">
91+
<div class="row">
9192
<div class="column">16,66%</div>
9293
<div class="column">16,66%</div>
9394
<div class="column">16,66%</div>
9495
<div class="column">16,66%</div>
9596
<div class="column">16,66%</div>
9697
<div class="column">16,66%</div>
97-
</div>
98+
</div>
9899

99-
<div class="row">
100+
<div class="row">
100101
<div class="column">12,5%</div>
101102
<div class="column">12,5%</div>
102103
<div class="column">12,5%</div>
@@ -105,10 +106,9 @@
105106
<div class="column">12,5%</div>
106107
<div class="column">12,5%</div>
107108
<div class="column">12,5%</div>
108-
</div>
109-
109+
</div>
110110

111-
<div class="row">
111+
<div class="row">
112112
<div class="column">1</div>
113113
<div class="column">1</div>
114114
<div class="column">1</div>
@@ -117,42 +117,44 @@
117117
<div class="column">1</div>
118118
<div class="merge2">Merge 2</div>
119119
<div class="column">1</div>
120-
</div>
120+
</div>
121121

122-
<div class="row">
122+
<div class="row">
123123
<div class="merge3">Merge 3 (take 3 places)</div>
124124
<div class="column">1</div>
125125
<div class="column">1</div>
126126
<div class="column">1</div>
127-
</div>
127+
</div>
128128

129-
<div class="row">
129+
<div class="row">
130130
<div class="merge4 nested row">
131-
<div class="column">Nested </div>
132-
<div class="column">Nested </div>
133-
<div class="column">Nested </div>
131+
<div class="column">Nested</div>
132+
<div class="column">Nested</div>
133+
<div class="column">Nested</div>
134134
</div>
135135
<div class="column">1</div>
136+
</div>
136137

137-
</div>
138-
139-
<div class="row">
138+
<div class="row">
140139
<div class="column">Ultra minimal only 0.15 Kb</div>
141140
<div class="column">Fluid</div>
142-
<div class="column">Just add columns into the row container </div>
141+
<div class="column">Just add columns into the row container</div>
142+
</div>
143143

144+
<div class="row">
145+
<div class="column">
146+
<p>
147+
You can add as many columns as you like. You can merge the columns or insert columns
148+
inside columns. Everything is 0.1 Kb and even works in IE10.
149+
</p>
144150
</div>
151+
</div>
145152

146-
<div class="row">
147-
<div class="column"><p>You can add as many columns as you like. You can merge the columns or insert columns inside columns. Everything is 0.1 Kb and even works in IE10.</p></div>
153+
<div class="row">
154+
<div class="column">
155+
<p><a href="https://github.com/vladocar/infinity-css-grid/">Learn more on Github </a></p>
148156
</div>
149-
150-
<div class="row">
151-
<div class="column"><p><a href="https://github.com/vladocar/infinity-css-grid/">Learn more on Github </a></p></div>
152-
153-
</div>
154-
157+
</div>
155158
</div>
156-
</body>
157-
159+
</body>
158160
</html>

0 commit comments

Comments
 (0)