-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
135 lines (118 loc) · 6.74 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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Nova.css | Effect for your web and mobile project.</title>
<meta name="author" content="Lamine AZINAKOU">
<meta name="description" content="Effect for your web and mobile project">
<meta property="og:title" content="Nova.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Lato:300,400,700,900">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.9.0/css/all.css">
<link rel="stylesheet" href="css/demo.css">
<link rel="stylesheet" href="css/nova.min.css">
<link rel="icon" href="favicon.png" type="image/x-icon">
</head>
<body>
<main id="swup" class="transition-fade">
<section class="bg-nova header gradient">
<div class="container">
<div class="col-md-12 text-center">
<h1 class="title">Nova.css</h1>
<h2 class="subtitle">Simple. Useful. Efficient & Free forever.</h2>
<h2 class="subtitle2">No Flash. No frameworks. Just 3kb gzipped</h2>
<a href="use.html" class="cta">click here to see the tutorial</a>
</div>
</div>
</section>
<section>
<div class="container pt-5">
<div class="row justify-content-center">
<div class="col-md-12 text-center">
<code>Don't re-invent the wheel, Just re-align It</code>
</div>
<div class="col-md-6">
<div class="tutorial">
<h1 id="why" class="nv-underline-from-left">Why</h1>
<p> nova.css is a cool, fun and cross-browser effect set so you can use them in your web and
mobile projects as ionic. Ideal for emphasis, home pages, sliders, and adding water in
general. </p>
<h1 id="install" class="nv-underline-from-left">Install</h1>
<div class="row pb-3">
<div class="col-md-3 text-center">
<a href="https://github.com/agazinakou/Nova/archive/master.zip">
<img src="images/zip.svg" class="zip" alt="Nova zip">
</a>
</div>
<div class="col-md-9 text-left">
Just <a href="https://github.com/agazinakou/Nova/archive/master.zip">download a ZIP</a> file and past in your project. <br>
No Flash. No frameworks. Just 3kb gzipped
</div>
</div>
<h1 id="setup" class="nv-underline-from-left">Setup</h1>
<p>First, include the script located on the
<code>css</code> folder.
</p>
<pre class="snippet"><code class="html"><link rel="stylesheet" href="css/nova.min.css"></code></pre>
<h1 id="setup" class="nv-underline-from-left">How to use</h1>
<p>
Nova.css is simple to use just add the class name of the effect to the element to which
you want it to apply.
For example if I want to use the pulse effect <code>nv-back-pulse</code>
</p>
<pre
class="snippet"><code class="html"><a href="" class="button nv-back-pulse"></a></code></pre>
<h1 id="browser-support" class="nv-underline-from-left">Browser Support</h1>
<ul class="support">
<li>
<img src="images/chrome.png" alt="Chrome logo" width="64" height="64">
<p>Chrome 42+</p>
</li>
<li>
<img src="images/edge.png" alt="Edge logo" width="64" height="64">
<p>Edge 12+</p>
</li>
<li>
<img src="images/firefox.png" alt="Firefox logo" width="64" height="64">
<p>Firefox 41+</p>
</li>
<li>
<img src="images/ie.png" alt="Internet Explorer logo" width="64" height="64">
<p>IE 9+</p>
</li>
<li>
<img src="images/opera.png" alt="Opera logo" width="64" height="64">
<p>Opera 29+</p>
</li>
<li>
<img src="images/safari.png" alt="Safari logo" width="64" height="64">
<p>Safari 10+</p>
</li>
</ul>
<p>The good news is that nova.css gracefully degrades if you need to support older browsers.
</p>
</div>
</div>
</div>
</div>
</section>
</main>
<footer class="footer gradient text-center">
<p class="credits">
Made with
<span class="love">♥</span> by
<a class="footer-link" href="https://azinakou.com/" target="_blank">Lamine AZINAKOU</a>
</p>
</footer>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script src="https://kit.fontawesome.com/64a822a97e.js"></script>
<script src="https://unpkg.com/swup@latest/dist/swup.min.js"></script>
<script type="text/javascript" src="js/SwupSlideTheme.min.js"></script>
<script src="js/demo.js"></script>
</body>
</html>