Skip to content

Commit db347c4

Browse files
rstacruzrstacruz
committed
Update page styles.
1 parent 4b7819e commit db347c4

2 files changed

Lines changed: 55 additions & 26 deletions

File tree

‎index.html‎

Lines changed: 31 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -12,39 +12,44 @@ <h1>NProgress<i>.js</i></h1>
1212
<p>Small, nanoscopic progress bar. Featuring realistic trickle animations to convince your users that something is happening!</p>
1313
</header>
1414

15-
<div class='controls fade out'>
16-
<p>
17-
<button class='button play' id='b-0'></button>
18-
<i>NProgress</i><b>.start()</b>
19-
&mdash;
20-
shows the progress bar
21-
</p>
22-
<p>
23-
<button class='button play' id='b-40'></button>
24-
<i>NProgress</i><b>.set(0.4)</b>
25-
&mdash;
26-
sets a percentage
27-
</p>
28-
<p>
29-
<button class='button play' id='b-inc'></button>
30-
<i>NProgress</i><b>.inc()</b>
31-
&mdash;
32-
increments by a little
33-
</p>
34-
<p>
35-
<button class='button play' id='b-100'></button>
36-
<i>NProgress</i><b>.done()</b>
37-
&mdash;
38-
completes the progress
39-
</p>
15+
<div class='contents fade out'>
16+
<div class='controls'>
17+
<p>
18+
<button class='button play' id='b-0'></button>
19+
<i>NProgress</i><b>.start()</b>
20+
&mdash;
21+
shows the progress bar
22+
</p>
23+
<p>
24+
<button class='button play' id='b-40'></button>
25+
<i>NProgress</i><b>.set(0.4)</b>
26+
&mdash;
27+
sets a percentage
28+
</p>
29+
<p>
30+
<button class='button play' id='b-inc'></button>
31+
<i>NProgress</i><b>.inc()</b>
32+
&mdash;
33+
increments by a little
34+
</p>
35+
<p>
36+
<button class='button play' id='b-100'></button>
37+
<i>NProgress</i><b>.done()</b>
38+
&mdash;
39+
completes the progress
40+
</p>
41+
</div>
42+
<div class='actions'>
43+
<a href='https://github.com/rstacruz/nprogress' class='button primary'>Download</a>
44+
</div>
4045
</div>
4146

4247
<script src='vendor/jquery-1.10.js'></script>
4348
<script src='nprogress.js'></script>
4449

4550
<script>
4651
NProgress.start();
47-
setTimeout(function() { NProgress.done(); $('.controls').removeClass('out'); }, 1000);
52+
setTimeout(function() { NProgress.done(); $('.fade').removeClass('out'); }, 1000);
4853

4954
$("#b-0").click(function() { NProgress.start(); });
5055
$("#b-40").click(function() { NProgress.set(0.4); });

‎support/style.css‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,7 @@ button {
3737

3838
.button {
3939
display: inline-block;
40+
text-decoration: none;
4041

4142
background: #eee;
4243
color: #777;
@@ -56,6 +57,15 @@ button {
5657
color: #fff;
5758
}
5859

60+
.button.primary {
61+
background: #2d9;
62+
color: #fff;
63+
}
64+
.button.primary:hover {
65+
background: #1c8;
66+
}
67+
68+
5969
.button:active {
6070
background: #2d9;
6171
box-shadow: inset 0 0 4px rgba(0, 0, 0, 0.6);
@@ -72,6 +82,7 @@ button {
7282
width: 40px;
7383
margin-right: 10px;
7484
text-align: center;
85+
text-indent: -4px;
7586
}
7687

7788
.controls i {
@@ -123,3 +134,16 @@ button {
123134
margin: 3.5em auto;
124135
}
125136
}
137+
138+
/* --- */
139+
140+
.actions {
141+
text-align: center;
142+
margin: 3em 0;
143+
}
144+
145+
.button {
146+
padding-left: 20px;
147+
padding-right: 20px;
148+
}
149+

0 commit comments

Comments
 (0)