Skip to content

Commit bad445c

Browse files
author
Olivier Giulieri
committed
Improved top navigation bar.
1 parent 9b8b0c9 commit bad445c

File tree

15 files changed

+313
-361
lines changed

15 files changed

+313
-361
lines changed

‎demo/contact.html‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,24 +17,24 @@
1717

1818
<body>
1919

20-
<div class="evo-navbar">
21-
<div class="evol-logo"><a href="../index.html">evolutility.js</a></div>
22-
<ul class="evo-nav-tabs">
20+
<div class="evo-header">
21+
<div class="evo-logo"><a href="../index.html">evolutility.js</a></div>
22+
<ul class="evo-head-links">
2323
<li><a href="index.html" class="sel">demo</a></li>
2424
<li><a href="../doc/index.html">documentation</a></li>
2525
<li><a href="https://github.com/evoluteur/evolutility" target="_new">GitHub</a></li>
2626
</ul>
27-
<div class="demo-links">
28-
<a href="todo.html">todo</a> -
29-
<a href="contact.html" class="sel">addressbook</a> -
30-
<a href="winecellar.html">wine cellar</a> -
31-
<a href="test.html">test</a>
32-
</div>
27+
<ul class="evo-head-links2">
28+
<li><a href="todo.html">todo</a></li>
29+
<li><a href="contact.html" class="sel">addressbook</a></li>
30+
<li><a href="winecellar.html">wine cellar</a></li>
31+
<li><a href="test.html">test</a></li>
32+
</ul>
3333
<div class="clearfix"></div>
3434
</div>
3535

3636

37-
<div class="evo-header2">
37+
<div class="evo-title2">
3838
<h1 id="title">Addressbook</h1>
3939
</div>
4040

‎demo/index.html‎

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -9,22 +9,23 @@
99

1010
<body>
1111

12-
<div class="evo-navbar">
13-
<div class="evol-logo"><a href="../index.html">evolutility.js</a></div>
14-
<ul class="evo-nav-tabs">
12+
<div class="evo-header">
13+
<div class="evo-logo"><a href="../index.html">evolutility.js</a></div>
14+
<ul class="evo-head-links">
1515
<li><a href="index.html" class="sel">demo</a></li>
1616
<li><a href="../doc/index.html">documentation</a></li>
1717
<li><a href="https://github.com/evoluteur/evolutility" target="_new">GitHub</a></li>
1818
</ul>
19-
<div class="demo-links">
20-
<a href="todo.html">todo</a> -
21-
<a href="contact.html">addressbook</a> -
22-
<a href="winecellar.html">wine cellar</a>
23-
</div>
19+
<ul class="evo-head-links2">
20+
<li><a href="todo.html">todo</a></li>
21+
<li><a href="contact.html">addressbook</a></li>
22+
<li><a href="winecellar.html">wine cellar</a></li>
23+
<li><a href="test.html">test</a></li>
24+
</ul>
2425
<div class="clearfix"></div>
2526
</div>
2627

27-
<div class="evo-header">
28+
<div class="evo-title">
2829
<h1 id="title">Demos</h1>
2930
</div>
3031

‎demo/test.html‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -16,31 +16,31 @@
1616

1717
<body>
1818

19-
<div class="evo-navbar">
20-
<div class="evol-logo"><a href="../index.html">evolutility.js</a></div>
21-
<ul class="evo-nav-tabs">
19+
<div class="evo-header">
20+
<div class="evo-logo"><a href="../index.html">evolutility.js</a></div>
21+
<ul class="evo-head-links">
2222
<li><a href="index.html" class="sel">demo</a></li>
2323
<li><a href="../doc/index.html">documentation</a></li>
2424
<li><a href="https://github.com/evoluteur/evolutility" target="_new">GitHub</a></li>
2525
</ul>
26-
<div class="demo-links">
27-
<a href="todo.html">todo</a> -
28-
<a href="contact.html">addressbook</a> -
29-
<a href="winecellar.html">wine cellar</a> -
30-
<a href="test.html" class="sel">test</a>
31-
</div>
26+
<ul class="evo-head-links2">
27+
<li><a href="todo.html">todo</a></li>
28+
<li><a href="contact.html">addressbook</a></li>
29+
<li><a href="winecellar.html">wine cellar</a></li>
30+
<li><a href="test.html" class="sel">test</a></li>
31+
</ul>
3232
<div class="clearfix"></div>
3333
</div>
3434

3535

3636

37-
<div class="evo-header2">
37+
<div class="evo-title2">
3838
<h1 id="title">Test</h1>
3939
</div>
4040

4141
<div class="evo-content2">
4242

43-
<p>Test page with all field types. Used to QA Evolutility ...and easily see what is not implemented yet. </p>
43+
<p><br/>Test page with all field types. Used to QA Evolutility ...and easily see what is not implemented yet. </p>
4444

4545

4646
<div id="evol"></div>

‎demo/todo.html‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -17,23 +17,23 @@
1717

1818
<body>
1919

20-
<div class="evo-navbar">
21-
<div class="evol-logo"><a href="../index.html">evolutility.js</a></div>
22-
<ul class="evo-nav-tabs">
20+
<div class="evo-header">
21+
<div class="evo-logo"><a href="../index.html">evolutility.js</a></div>
22+
<ul class="evo-head-links">
2323
<li><a href="index.html" class="sel">demo</a></li>
2424
<li><a href="../doc/index.html">documentation</a></li>
2525
<li><a href="https://github.com/evoluteur/evolutility" target="_new">GitHub</a></li>
2626
</ul>
27-
<div class="demo-links">
28-
<a href="todo.html" class="sel">todo</a> -
29-
<a href="contact.html">addressbook</a> -
30-
<a href="winecellar.html">wine cellar</a> -
31-
<a href="test.html">test</a>
32-
</div>
27+
<ul class="evo-head-links2">
28+
<li><a href="todo.html" class="sel">todo</a></li>
29+
<li><a href="contact.html">addressbook</a></li>
30+
<li><a href="winecellar.html">wine cellar</a></li>
31+
<li><a href="test.html">test</a></li>
32+
</ul>
3333
<div class="clearfix"></div>
3434
</div>
3535

36-
<div class="evo-header2">
36+
<div class="evo-title2">
3737
<h1 id="title">To Do</h1>
3838
</div>
3939

‎demo/winecellar.html‎

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -17,25 +17,23 @@
1717

1818
<body>
1919

20-
<div class="evo-navbar winecellar">
21-
<div class="evol-logo"><a href="../index.html">evolutility.js</a></div>
22-
<ul class="evo-nav-tabs">
20+
<div class="evo-header winecellar">
21+
<div class="evo-logo"><a href="../index.html">evolutility.js</a></div>
22+
<ul class="evo-head-links">
2323
<li><a href="index.html" class="sel">demo</a></li>
2424
<li><a href="../doc/index.html">documentation</a></li>
2525
<li><a href="https://github.com/evoluteur/evolutility" target="_new">GitHub</a></li>
2626
</ul>
27-
<div class="demo-links">
28-
<a href="todo.html">todo</a> -
29-
<a href="contact.html">addressbook</a> -
30-
<a href="winecellar.html" class="sel">wine cellar</a> -
31-
<a href="test.html">test</a>
32-
</div>
27+
<ul class="evo-head-links2">
28+
<li><a href="todo.html">todo</a></li>
29+
<li><a href="contact.html">addressbook</a></li>
30+
<li><a href="winecellar.html" class="sel">wine cellar</a></li>
31+
<li><a href="test.html">test</a></li>
32+
</ul>
3333
<div class="clearfix"></div>
3434
</div>
3535

36-
37-
38-
<div class="evo-header2">
36+
<div class="evo-title2">
3937
<h1 id="title">Wine Cellar</h1>
4038
</div>
4139

‎dist/css/demo.css‎

Lines changed: 57 additions & 82 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,18 @@
11
/* evolutility : demo.css */
22
/* evolutility : header.css */
3-
.evol-logo {
3+
.evo-logo {
44
float: left;
55
font-size: 2em;
66
margin: 5px 80px 5px 10px;
77
}
8-
.evol-logo a,
9-
.evol-logo a:hover {
8+
.evo-logo > a {
9+
text-decoration: none;
1010
color: #ffc000 !important;
1111
}
12+
.evo-logo > a:hover {
13+
text-decoration: none;
14+
color: #ed991a !important;
15+
}
1216
.logop1,
1317
.logop3 {
1418
font-weight: bold;
@@ -18,7 +22,7 @@
1822
font-weight: bold;
1923
color: #ed991a;
2024
}
21-
.evo-navbar {
25+
.evo-header {
2226
overflow: hidden;
2327
background-color: #1f497d;
2428
position: fixed;
@@ -29,88 +33,77 @@
2933
padding: 2px 5px 2px 10px;
3034
z-index: 3000;
3135
}
32-
.evo-navbar a {
36+
.evo-header a {
3337
color: #c6d9f0;
3438
text-decoration: none;
3539
}
36-
.evo-navbar a :hover {
40+
.evo-header a :hover {
3741
color: #c6d9f0;
3842
}
39-
.evo-header,
40-
.evo-header2 {
41-
position: relative;
42-
}
43-
.evo-header > h1,
44-
.evo-header2 > h1 {
45-
margin-left: 20px;
46-
color: white !important;
47-
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
48-
font-weight: 500;
49-
}
50-
.evo-header {
51-
background-color: #1f497d;
52-
top: 50px;
53-
padding: 20px 10px;
54-
min-height: 120px;
55-
}
56-
.evo-header2 {
57-
background-color: #1f497d;
58-
top: 32px;
59-
padding: 0 10px;
60-
min-height: 50px;
61-
}
62-
.evo-nav-tabs {
63-
margin-left: 30px;
43+
.evo-head-links,
44+
.evo-head-links2 {
6445
display: block;
6546
}
66-
.evo-nav-tabs > li {
47+
.evo-head-links > li,
48+
.evo-head-links2 > li {
6749
display: inline;
68-
padding: 10px;
50+
padding: 0 10px;
6951
}
70-
.evo-nav-tabs > li > a {
52+
.evo-head-links > li > a,
53+
.evo-head-links2 > li > a {
7154
text-decoration: none;
7255
}
73-
.evo-nav-tabs > li > a:hover {
56+
.evo-head-links > li > a:hover,
57+
.evo-head-links2 > li > a:hover {
7458
text-decoration: none;
7559
color: #ed991a;
7660
}
77-
.doc-links,
78-
.demo-links {
79-
position: absolute;
80-
top: 29px;
61+
.evo-head-links > li > a.sel,
62+
.evo-head-links2 > li > a.sel {
63+
color: white;
8164
}
82-
.doc-links > a,
83-
.demo-links > a {
84-
color: #c6d9f0;
65+
.evo-head-links {
66+
font-size: 1.5em;
67+
margin-left: 30px;
8568
}
86-
.doc-links > a:hover,
87-
.demo-links > a:hover {
88-
color: #ed991a;
89-
text-decoration: none;
69+
.evo-title,
70+
.evo-title2 {
71+
position: relative;
9072
}
91-
.demo-links {
92-
left: 246px;
73+
.evo-title > h1,
74+
.evo-title2 > h1 {
75+
margin-left: 20px;
76+
color: white !important;
77+
font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
78+
font-weight: 500;
9379
}
94-
.doc-links {
95-
left: 323px;
80+
.evo-title {
81+
background-color: #1f497d;
82+
top: 50px;
83+
padding: 20px 10px;
84+
min-height: 120px;
9685
}
97-
.evo-nav-tabs {
98-
font-size: 1.5em;
86+
.evo-title2 {
87+
background-color: #1f497d;
88+
top: 62px;
89+
padding: 5px 10px;
9990
}
100-
.evo-nav-tabs > li > a.sel,
101-
.doc-links > a.sel,
102-
.demo-links > a.sel {
103-
color: white;
91+
.evo-content h1,
92+
.evo-content2 h1,
93+
.evo-content3 h1,
94+
.evo-content h2,
95+
.evo-content2 h2,
96+
.evo-content3 h2 {
97+
color: #428bca !important;
10498
}
105-
.demo-links2 > a {
106-
padding: 1px 8px;
107-
color: #39C;
108-
font-weight: 400;
99+
.evo-content {
100+
padding: 80px 30px 30px;
109101
}
110-
.demo-links2 > a.sel {
111-
color: #0d0d0d;
112-
text-decoration: none;
113-
/*border: solid 2px blue;*/
102+
.evo-content2 {
103+
padding: 64px 30px 30px;
104+
}
105+
.evo-content3 {
106+
padding: 96px 30px 30px;
114107
}
115108
.footer {
116109
text-align: center;
@@ -123,24 +116,6 @@ body {
123116
color: #0d0d0d;
124117
font-weight: 300;
125118
}
126-
body .evo-content h1,
127-
body .evo-content2 h1,
128-
body .evo-content3 h1,
129-
body .evo-content h2,
130-
body .evo-content2 h2,
131-
body .evo-content3 h2 {
132-
margin-left: 30px;
133-
color: #428bca !important;
134-
}
135-
body .evo-content {
136-
padding: 80px 30px 30px;
137-
}
138-
body .evo-content2 {
139-
padding: 32px 30px 30px;
140-
}
141-
body .evo-content3 {
142-
padding: 50px 30px 30px;
143-
}
144119
.blueBox {
145120
float: left;
146121
padding: 5px 10px;

0 commit comments

Comments
 (0)