-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
132 lines (128 loc) · 6.44 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>TypeChem • A collection of handpicked font & color combinations</title>
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<meta name="description" content="TypeChem is a collection of handpicked font and color combinations">
<meta name="keywords" content="font,pair,fontpair,google,type,discover,fonts,colors,chemistry">
<meta name="author" content="Abhishek Warokar">
<meta name="url" content="https://TypeChem.github.io">
<meta name="robots" content="all">
<meta name="google-site-verification" content="YxS5o9VCTbg-QKwlKs93HyuwBPGlt8CjPlICZrtHJDM" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
<link rel="icon" type="image/png" href="favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="/manifest.json">
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#0a0a0a">
<meta name="msapplication-TileColor" content="#0a0a0a">
<meta name="msapplication-TileImage" content="/mstile-144x144.png">
<meta name="theme-color" content="#0a0a0a">
<meta name="mobile-web-app-capable" content="yes">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/style.css">
<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed|Montserrat" rel="stylesheet">
</head>
<body>
<div class="menu">
<div class="menu-center">
<div class="col-half">
<h1 id="logo">TYPE<span class="da">—</span><br><span class="da">—</span>CHEM</h1>
<p id="info-icon">INFO</p>
</div>
<div class="menu-info">
<div class="col-5">
<div class="menu-title">
<h1>TITLE FONT</h1>
</div>
<div class="menu-value" id="title">
</div>
</div>
<div class="col-5">
<div class="menu-title">
<h1>PARAGRAPH FONT</h1>
</div>
<div class="menu-value" id="paragraph">
</div>
</div>
<div class="col-5" id="colors">
<div class="menu-title">
<h1>COLORS</h1>
</div>
<div id="color-contain">
<div class="color-circle has-tooltip" id="circle-Title">
<span class="tooltip">
</span>
</div>
<div class="color-circle has-tooltip" id="circle-paragraph">
<span class="tooltip">
</span>
</div>
<div class="color-circle has-tooltip" id="circle-background">
<span class="tooltip">
</span>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="article-paper">
<article id="main-article">
<h1>A trip to Venus: In Space</h1>
<p>TypeChem is a collection of handpicked font and color combinations. Press arrow keys or swipe to explore.</p>
<p>Apparently we had reached a great height in the atmosphere, for the sky was a dead black, and the stars had ceased to
twinkle. By the same illusion which lifts the horizon of the sea to the level of the spectator on a hillside, the sable
cloud beneath was dished out, & the car seemed to float in the middle of an immense dark sphere, whose upper half
was strewn with silver. Looking down into the dark gulf below, I could see a ruddy light streaming through a rift in
the clouds. It was probably a last glimpse of London, or some neighbouring town; but soon the rolling vapours closed,
& shut it out.</p>
<p>I now realised to the full that I was nowhere, or to speak more correctly, a wanderer in empty space—that I had left one
world behind me and was travelling to another, like a disembodied spirit crossing the gloomy Styx. A strange serenity
took possession of my soul, and all that had polluted or degraded it in the lower life seemed to fall away from it like
the shadow of an evil dream.</p>
<p>In the depths of my heart I no longer felt sorry to quit the earth. It seemed to me now, a place where the loveliest things
never come to birth, or die the soonest—where life itself hangs on a blind mischance, where true friendship is afraid
to show its face, where pure love is unrequited or betrayed, and the noblest benefactors of their fellowmen have been
reviled or done to death—a place which we regard as a heaven when we enter it, and a hell before we leave it. No, I was
not sorry to quit the earth</p>
<p>And the beautiful planet, shining there so peacefully in the west, was it any better? At a like distance the earth would
seem still fairer, and perhaps even now some wretch in Venus is asking himself a similar question. Is it not probable
that just as all the worlds are made of the same materials, so the mixture of good and evil is much the same in all?
I turned to the stars, where in all ages man has sought an answer to his riddles. The better land! Where is it? if not
among the stars. I am now in the old heaven above the clouds. Does it lie within the visible universe, as it lies within
the heart when peace and happiness are there?</p>
<p>In that pure ether the glory of the firmament was revealed to me as it had never been on the earth, where it is often
veiled with clouds and mist, or marred by houses and surrounding ojects—where the quietude of the mind is also apt to
be disturbed by sordid and perplexing cares. Its awful sublimity overwhelmed my faculties, and its majesty inspired me
with a kind of dread. In presence of these countless orbs my own nothingness came home to me, and a voice seemed to whisper
in my ear, "Hush! What art thou? Be humble and revere."</p>
</article>
</div>
<script>
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})(window, document, 'script', 'https://www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-90419707-1', 'auto');
ga('send', 'pageview');
</script>
<script src="js/jquery-2.1.4.js"></script>
<script src="js/jquery.mobile-1.4.5.min.js"></script>
<script src="js/fonts.js"></script>
<script src="js/webfont.js"></script>
<script src="js/main.js"></script>
</body>
</html>