-
Notifications
You must be signed in to change notification settings - Fork 2
/
Copy pathindex.html
102 lines (85 loc) · 4.29 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
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Yo.css</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" href="styles/main.css" />
</head>
<body>
<header class="navbar navbar--fixed">
<nav class="container">
<ul class="nav nav--block float--right">
<li><a href="https://github.com/Thibaut-B/Yo.css/archive/master.zip"><i class="icon icon-download"></i></a></li>
</ul>
<ul class="nav nav--block">
<li><a href="index.html">Yo.css</a></li>
<li><a href="http://thibaut-baillet.com" target="_blank">Author</a></li>
<li class="dropdown-toggle">
<a href="exemple.html">Exemple</a>
<ul class="dropdown-menu" role="menu">
<li><a href="exemple.html#heading">Heading</a></li>
<li><a href="exemple.html#button">Button</a></li>
<li><a href="exemple.html#label">Label</a></li>
<li><a href="exemple.html#list">List</a></li>
<li><a href="exemple.html#pagination">Pagination</a></li>
<li><a href="exemple.html#breadcrumbs">Breadcrumbs</a></li>
<li><a href="exemple.html#form">Form</a></li>
<li><a href="exemple.html#img">Images</a></li>
</ul>
</li>
</ul>
</nav>
</header>
<section class="intro mb">
<div class="container">
<h1>Yo.css</h1>
<h2>A simple OOCSS Framework<br>thinks for front-end developer!</h2>
<p>
<a href="https://github.com/Thibaut-B/Yo.css" class="btn btn--red"><i class="icon icon-octopus"></i> View on Github</a>
<a href="https://github.com/Thibaut-B/Yo.css/archive/master.zip" class="btn btn--red"><i class="icon icon-download"></i> Download</a>
</p>
</div>
</section>
<section class="container mb cf">
<h2 class="text--center">Keys features</h2>
<article>
<img src="gh-pages/img/vertical.jpg" alt="" />
<h3>Use vertical rhythm</h3>
<p>Give a vertical rhythm to your design with a suitable structure for that.</p>
</article>
<article>
<img src="gh-pages/img/bem.jpg" alt="" />
<h3>BEM naming</h3>
<p>The framework use a perfect naming methodology for OOCSS pathern.</p>
</article>
<article>
<img src="gh-pages/img/themes.jpg" alt="" />
<h3>Set your theme</h3>
<p>It's easy to design each object with a simple theme file.</p>
</article>
</section>
<section class="container mb text--center">
<h2 class="">Licences</h2>
<p>
<strong>Creative common attribution licenses</strong><br>
Licenses may copy, distribute, display and perform the work and make derivative works based on it only if they give the author or licensor the credits in the manner specified by these.
<br>
<span xmlns:dct="http://purl.org/dc/terms/" property="dct:title">MFG Labs icon set</span> from <a xmlns:cc="http://creativecommons.org/ns#" href="http://www.mfglabs.com" property="cc:attributionName" rel="cc:attributionURL">MFG Labs</a> is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.fr">Creative Commons Attribution 3.0 License</a>.<br>
<a rel="license" href="http://creativecommons.org/licenses/by/3.0/deed.fr"><img alt="Licence Creative Commons" style="border-width:0" src="http://i.creativecommons.org/l/by/3.0/80x15.png"></a>
</p>
</section>
<section class="container mb">
<h2 class="text--center">Thanks you</h2>
<div class="feedback">
<p><strong>Send us your feedback</strong></br>Our work isn’t perfect so far, let us know if you want to contribute by sending us some feedback. Contact us via Twitter or Github.</p>
<a href="https://twitter.com/bailletthibaut" class="twitter-follow-button" data-show-count="false" data-lang="en">Follow @bailletthibaut</a>
<iframe src="http://ghbtns.com/github-btn.html?user=thibaut-b&repo=Yo.css&type=watch&count=true"
allowtransparency="true" frameborder="0" scrolling="0" width="110" height="20"></iframe>
</div>
</section>
<div class="grid-horizontal"></div>
<div class="grid-vertical"></div>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</body>
</html>