Skip to content

Commit 363690b

Browse files
authored
More buttons (#17)
* add new line of buttons * change fonSize * fix change size errors * responsive amount of buttons * fix tooltip size * add links
1 parent 12e5cba commit 363690b

File tree

4 files changed

+77
-3
lines changed

4 files changed

+77
-3
lines changed

toolbar/test.html

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,8 @@
22
<html>
33
<head>
44
<meta charset="utf-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1">
57
<title>Test Toolbar</title>
68
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"></link>
79
<link rel="stylesheet" type="text/css" href="toolbar.css"></link>

toolbar/toolbar.css

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -108,3 +108,39 @@
108108
.tooltip-wide {
109109
max-width: 420px;
110110
}
111+
112+
.tooltip-bk:link {
113+
color: #ffffff;
114+
background-color: black;
115+
}
116+
117+
.tooltip-bk:hover,
118+
.tooltip-bk:focus,
119+
.tooltip-bk:active,
120+
.tooltip-bk.active {
121+
color: yellow;
122+
}
123+
124+
.tooltip-bl:link {
125+
color: yellow;
126+
background-color: blue;
127+
}
128+
129+
.tooltip-bl:hover,
130+
.tooltip-bl:focus,
131+
.tooltip-bl:active,
132+
.tooltip-bl.active {
133+
color: red;
134+
}
135+
136+
.tooltip-cy:link {
137+
color: black;
138+
background-color: rgb(210, 239, 233);
139+
}
140+
141+
.tooltip-cy:hover,
142+
.tooltip-cy:focus,
143+
.tooltip-cy:active,
144+
.tooltip-cy.active {
145+
color: red;
146+
}

toolbar/toolbar.js

Lines changed: 39 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,6 +38,12 @@ function loadProvisuToolbar(element, url, file, extra) {
3838
var json = JSON.parse(evt.target.responseText);
3939
generateHTML(element, url, json, extra);
4040
$(function() {
41+
$('#toolbar-smaller').click(function() {
42+
setFontSize(-4);
43+
});
44+
$('#toolbar-bigger').click(function() {
45+
setFontSize(4);
46+
});
4147
$('[data-toggle="tooltip"]').tooltip({
4248
container: 'body',
4349
template: '<div class="tooltip tooltip-big" role="tooltip">' +
@@ -135,9 +141,31 @@ function generateHTML(element, url, i18n, extra) {
135141

136142
if (extra) {
137143
html = '<div class="btn-group" role="group" aria-label="...">' +
138-
'<a href="/service?url=' + url + '" class="btn btn-default" ' +
144+
'<a href="/service?url=' + url + '&filter=normal" ' +
145+
'class="btn btn-default" data-toggle="tooltip" data-placement="bottom" ' +
146+
'title="' + i18n.toolbarDescription.message + ' - ' +
147+
i18n.infoNormal.message + '">' +
148+
'<i class="fa fa-low-vision fa-2x" aria-hidden="true"></i>' +
149+
'</a>' +
150+
'<a href="/service?url=' + url + '&filter=black" ' +
151+
'class="btn btn-default tooltip-bk hidden-xs" ' +
139152
'data-toggle="tooltip" data-placement="bottom" ' +
140-
'title="' + i18n.toolbarDescription.message + '">' +
153+
'title="' + i18n.toolbarDescription.message + ' - ' +
154+
i18n.infoBlack.message + '">' +
155+
'<i class="fa fa-low-vision fa-2x" aria-hidden="true"></i>' +
156+
'</a>' +
157+
'<a href="/service?url=' + url + '&filter=blue" ' +
158+
'class="btn btn-default tooltip-bl hidden-xs" ' +
159+
'data-toggle="tooltip" data-placement="bottom" ' +
160+
'title="' + i18n.toolbarDescription.message + ' - ' +
161+
i18n.infoBlue.message + '">' +
162+
'<i class="fa fa-low-vision fa-2x" aria-hidden="true"></i>' +
163+
'</a>' +
164+
'<a href="/service?url=' + url + '&filter=cyan" ' +
165+
'class="btn btn-default tooltip-cy hidden-xs" ' +
166+
'data-toggle="tooltip" data-placement="bottom" ' +
167+
'title="' + i18n.toolbarDescription.message + ' - ' +
168+
i18n.infoCyan.message + '">' +
141169
'<i class="fa fa-low-vision fa-2x" aria-hidden="true"></i>' +
142170
'</a>' +
143171
'<button type="button" class="btn btn-default" id="toolbar-smaller" ' +
@@ -154,3 +182,12 @@ function generateHTML(element, url, i18n, extra) {
154182
}
155183
document.getElementById(element).innerHTML = html;
156184
}
185+
186+
$(function() {
187+
$('[data-toggle="tooltip"]').tooltip({
188+
container: 'body',
189+
template: '<div class="tooltip tooltip-big" role="tooltip">' +
190+
'<div class="tooltip-arrow"></div>' +
191+
'<div class="tooltip-inner tooltip-wide"></div></div>',
192+
});
193+
});

web/routes/index.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,6 @@ var prefix = process.env.PREFIX || '';
1515
*/
1616
router.get('/', function(req, res, next) {
1717
var locale = require('locale');
18-
console.log('user i18n: ' + req.locale);
1918
var i18n = require('../_locales/' + req.locale + '/messages.json');
2019

2120
var lunetteStylePath = prefix + '/css/lunette.css';

0 commit comments

Comments
 (0)