forked from ilyador/Mori-Dark
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
192 lines (165 loc) · 8.67 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
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<title>My Story | Mori</title>
<meta name="description" content="">
<meta name="author" content="Ilya-Dorman" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Place favicon.ico and apple-touch-icon.png in the root directory -->
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/font-face.css">
<link rel="stylesheet" href="css/color-schemes/dark/hot-pink.css">
<link rel="stylesheet" href="css/typography.css">
<link rel="stylesheet" href="css/font-awesome.css">
<link rel="stylesheet" href="css/main.css">
<script>
document.cookie='resolution='+Math.max(screen.width,screen.height)+("devicePixelRatio" in window ? ","+devicePixelRatio : ",1")+'; path=/';
</script><!-- Responsive images -->
</head>
<body>
<!--[if lt IE 7]>
<p class="chromeframe">You are using an outdated browser. <a href="http://browsehappy.com/">Upgrade your browser today</a> or <a href="http://www.google.com/chromeframe/?redirect=true">install Google Chrome Frame</a> to better experience this site.</p>
<![endif]-->
<!-- Add your site or application content here -->
<nav>
<div class="top-ribbon"></div>
<ul class="nav-font clearfix">
<li>Gallery</li>
<li>Blog</li>
<li>Contact</li>
</ul>
</nav>
<div class="sparator"></div>
<header class="site-header">
<h1 class="title title-font">Hi, I am Mori</h1>
<p class="tagline tagline-font">
Web designer & front-end developer. I make fun web-stuff, and wish I was less hyperactive so I could drink more coffee.
</p>
</header>
<div class="sparator"></div>
<section class="works-hex">
<a href="gallery-hex.html" class="category category-1">
<div class="wrapper"><!--A helper to keep the hexagon's aspect ratio-->
<div class="hexagon">
<div class="hexagon-in1">
<div class="hexagon-in2">
<img class="thumbnail" src="img/01.jpg" alt="thumbnail">
</div><!--hexagon-in2-->
</div><!--hexagon-in1-->
</div><!--hexagon-->
</div><!--wrapper-->
<div class="category-name"><h2 class="works-font">Logos</h2></div>
</a><!--category-1-->
<a href="gallery-hex.html" class="category category-2">
<div class="wrapper">
<div class="hexagon">
<div class="hexagon-in1">
<div class="hexagon-in2">
<img class="thumbnail" src="img/02.jpg" alt="thumbnail">
</div><!--hexagon-in2-->
</div><!--hexagon-in1-->
</div><!--hexagon-->
</div><!--wrapper-->
<div class="category-name"><h2 class="works-font">Print</h2></div>
</a><!--category-2-->
<a href="gallery-hex.html" class="category category-3">
<div class="wrapper">
<div class="hexagon">
<div class="hexagon-in1">
<div class="hexagon-in2">
<img class="thumbnail" src="img/03.jpg" alt="thumbnail">
</div><!--hexagon-in2-->
</div><!--hexagon-in1-->
</div><!--hexagon-->
</div><!--wrapper-->
<div class="category-name"><h2 class="works-font">Websites</h2></div>
</a><!--category-3-->
</section><!--works-->
<div class="sparator"></div>
<section class="about-me">
<article class="about about-font">
<p>You can learn more about my creative process at my <a href="#from-my-blog">blog <i class="icon-pencil"></i></a>, also you can follow me on <a href="http://www.twitter.com">twitter <i class="icon-twitter"></i></a> and <a href="http://www.facebook.com">facebook <i class="icon-facebook-sign"></i></a>.</p>
<p>I have some cool programming projects on <a href="http://www.github.com">github <i class="icon-github"></i></a> and my cats' blog on <a href="http://www.tumblr.com">tumblr</a>.</p>
<p>Hey, I just met you and this is crazy, but here's my <a href="mailto:[email protected]">e-mail <i class="icon-envelope-alt"></i></a>, so write me, maybe. Or just call <a href="tel:4213-45-710">4213-45-710 <i class="icon-phone"></i></a> I'd love to talk :)</p>
</article><!--text-->
<article class="twitter-stream">
<header><p><a href="">@mori</a> on twitter <i class="icon-twitter"></i></p></header>
<div class="tweets meta-info-font"></div>
</article><!--twitter-stream-->
</section><!--about-me-->
<div class="sparator"></div>
<div class="blog-excerpts-wrapper">
<section id="from-my-blog" class="from-my-blog">
<h2 class="title-font">From my blog</h2>
<aside class="sidebar">
<div class="blog-description about-font">
<p>Here I write about my <a href="categories.html">creatvie process <i class="icon-cogs"></i></a>, <a href="categories.html">songs <i class="icon-book"></i></a>, <a href="categories.html">random rants</a> and other stuff.</p>
</div>
</aside>
<div class="blog-excerpts">
<article class="post-excerpt">
<header>
<h2 class="entry-title-font"><a href="post.html">In the beginning</a></h2>
<p class="meta-info-font"><time datetime="2009-09-04T16:31:24+02:00">September 2009</time> · This post is about <a href="categories.html">Work</a> and <a href="categories.html">Independance</a></p>
</header>
<div class="content">
<p>Lorem ipsum dolor sit amet, sea primis perpetua ex, autem regione euripidis ut mel. Cu convenire adipiscing mea, cum te prompta argumentum, ei nam constituto delicatissimi.</p>
</div><!--entry-->
<footer>
<p class="meta-info-font"><a href="post.html">Read more ⇒</a></p>
</footer>
</article>
<article class="post-excerpt">
<header>
<h2 class="entry-title-font"><a href="post.html">At Day's End</a></h2>
<p class="meta-info-font"><time datetime="2010-03-04T16:31:24+02:00">March 2010</time> · This post is about <a href="categories.html">Poetry</a>, <a href="categories.html">Creativity</a> and <a href="categories.html">Myself</a></p>
</header>
<div class="content">
<p>Ei epicuri detracto suscipiantur duo, regione forensibus has ex, at tacimates consequat referrentur usu. Cu antiopam voluptatibus vituperatoribus vel, labores disputando ex sed, an eos habeo mutat facer. Posse solet legimus est an, his suas dicant facete eu, no quo dico vidisse fuisset.</p>
</div><!--entry-->
<footer>
<p class="meta-info-font"><a href="post.html">Read more ⇒</a></p>
</footer>
</article>
<article class="post-excerpt">
<header>
<h2 class="entry-title-font"><a href="post.html">Another Post</a></h2>
<p class="meta-info-font"><time datetime="2010-03-04T16:31:24+02:00">March 2010</time> · This post is about <a href="categories.html">Poetry</a>, <a href="categories.html">Creativity</a> and <a href="categories.html">Myself</a></p>
</header>
<div class="content">
<p>Qui persius legimus deterruisset eu. Duo cu meis placerat rationibus, dico minim expetendis te pri. Corpora forensibus eos ei. Sed harum recteque ea, vide postulant ex ius. Inani omnesque scaevola at qui.</p>
</div><!--entry-->
<footer>
<p class="meta-info-font"><a href="post.html">Read more ⇒</a></p>
</footer>
</article>
</div><!--blog-excerpt-->
</section><!--from-my-blog-->
</div><!--blog-excerpts-wrapper-->
<footer class="site-footer site-footer-font">
<div class="sparator"></div>
<div class="contact">
<a href="mailto:[email protected]"><i class="icon-envelope-alt"></i> [email protected]</a> ·
<a href="tel:4213-45-710"><i class="icon-phone"></i> 4213-45-710</a> ·
<a href="http://www.twitter.com"><i class="icon-twitter"></i> @Mori</a> ·
<a href="http://www.facebook.com"><i class="icon-facebook-sign"></i> /mori.h</a>
</div>
<div class="copyright">Template Copyright @ 2012 My Story. Made by <a href="#">Hexocat</a> with <i class="icon-heart"></i></div>
</footer>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/jquery-1.8.0.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
var _gaq=[['_setAccount','UA-XXXXX-X'],['_trackPageview']];
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js';
s.parentNode.insertBefore(g,s)}(document,'script'));
</script>
</body>
</html>