Skip to content

Commit 282d725

Browse files
author
Erwin Dondorp
committed
show tooltip for manual run button
1 parent 5e4b2ca commit 282d725

4 files changed

Lines changed: 42 additions & 13 deletions

File tree

‎saltgui/index.html‎

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,10 +24,12 @@
2424
<body>
2525
<header id="header" class="no-print">
2626
<h1 class='logo'><div id="logo">SaltGUI</div></h1>
27-
<svg class='fab' width="36" height="36">
28-
<circle id='button-manual-run' cx="18" cy="18" r="18" fill="#4caf50" />
29-
<text style='pointer-events: none' fill="white" font-weight="bold" font-size="20" x="6" y="23">&gt;_</text>
30-
</svg>
27+
<h1 class='fab'>
28+
<svg width="36" height="36">
29+
<circle id='button-manual-run' cx="18" cy="18" r="18" fill="#4caf50" />
30+
<text style='pointer-events: none' fill="white" font-weight="bold" font-size="20" x="6" y="23">&gt;_</text>
31+
</svg>
32+
</h1>
3133
<!-- 1F4D6 = OPEN BOOK -->
3234
<!-- FE0E = VARIATION SELECTOR-15 (render as text) -->
3335
<h1 id="docu" class='docu'>&#x1F4D6;&#xFE0E;</h1>
@@ -37,7 +39,7 @@ <h1 id="docu" class='docu'>&#x1F4D6;&#xFE0E;</h1>
3739
<div class="minimenu">
3840
<div class="dropdown">
3941
<!-- 2261 = MATHEMATICAL OPERATOR IDENTICAL TO (aka "hamburger") -->
40-
<div class="menu-item">&#x2261;</div>
42+
<div class="menu-item" id="minimenu-top">&#x2261;</div>
4143
<div class="dropdown-content"></div>
4244
</div>
4345
</div>

‎saltgui/static/scripts/Router.js‎

Lines changed: 13 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -66,6 +66,9 @@ export class Router {
6666
const logo = document.getElementById("logo");
6767
Utils.addToolTip(logo, "ctrl-click to see\nOptions and Stats", "logo");
6868

69+
const fab = document.querySelector(".fab");
70+
Utils.addToolTip(fab, "Type 'c' to show\nmanual run", "fab");
71+
6972
Router.updateMainMenu();
7073

7174
const hash = window.location.hash.replace(/^#/, "");
@@ -102,18 +105,25 @@ export class Router {
102105
dropdownContent = Utils.createDiv("dropdown-content", "", "dropdown-content-" + pParentId);
103106
dropDownDiv.append(dropdownContent);
104107
}
105-
const itemDiv = Utils.createDiv("run-command-button menu-item", pButtonId, "button-" + pButtonId + "1");
108+
const itemDiv = Utils.createDiv("run-command-button menu-item menu-item-first-letter", pButtonId, "button-" + pButtonId + "1");
106109
dropdownContent.append(itemDiv);
107110
} else {
108-
const topItemDiv = Utils.createDiv("menu-item", pButtonId, "button-" + pButtonId + "1");
111+
const topItemDiv = Utils.createDiv("menu-item menu-item-first-letter", pButtonId, "button-" + pButtonId + "1");
109112
dropDownDiv.append(topItemDiv);
110113
}
111114

112115
// mini menu
113116

114117
const miniMenuDiv = document.querySelector(".minimenu");
115118
const dropdownContent2 = miniMenuDiv.querySelector(".dropdown-content");
116-
const menuItemDiv = Utils.createDiv("run-command-button menu-item", (pParentId ? "-" + Character.NO_BREAK_SPACE : "") + pButtonId, "button-" + pButtonId + "2");
119+
let menuItemDiv;
120+
if (pParentId) {
121+
menuItemDiv = Utils.createDiv("run-command-button menu-item");
122+
menuItemDiv.append(Utils.createSpan("", "-" + Character.NO_BREAK_SPACE, ""));
123+
menuItemDiv.append(Utils.createSpan("menu-item-first-letter", pButtonId, "button-" + pButtonId + "2"));
124+
} else {
125+
menuItemDiv = Utils.createDiv("run-command-button menu-item menu-item-first-letter", pButtonId, "button-" + pButtonId + "2");
126+
}
117127
dropdownContent2.append(menuItemDiv);
118128

119129
// activate the menu items as needed

‎saltgui/static/stylesheets/main.css‎

Lines changed: 12 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -99,16 +99,12 @@ h1 {
9999
}
100100

101101
.fab {
102-
display: block;
102+
display: inline-block;
103103
float: right;
104104
margin-top: 8px;
105105
margin-right: 8px;
106106
}
107107

108-
.fab:hover circle {
109-
fill: gray;
110-
}
111-
112108
#button-manual-run {
113109
opacity: 0.8;
114110
cursor: pointer;
@@ -191,6 +187,17 @@ h1 {
191187
cursor: pointer;
192188
}
193189

190+
.menu-item-first-letter#button-logout1:hover::first-letter,
191+
.menu-item-first-letter#button-logout2:hover::first-letter,
192+
.menu-item-first-letter#minimenu-top:hover::first-letter {
193+
text-decoration: none;
194+
}
195+
196+
.menu-item-first-letter:hover::first-letter {
197+
text-decoration: underline #4caf50 double;
198+
text-decoration-skip-ink: none;
199+
}
200+
194201
@media (width >= 950px) {
195202
.fullmenu { display: inline-block; }
196203
.minimenu { display: none; }

‎saltgui/static/stylesheets/tooltip.css‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -50,6 +50,11 @@
5050
transform: translate(-95%, 0);
5151
}
5252

53+
.tooltip > .tooltip-text-fab {
54+
text-align: right;
55+
transform: translate(-138px, 52px);
56+
}
57+
5358
.tooltip:hover {
5459
/* only slightly darker than 'whitesmoke(#f5f5f5)' */
5560
background-color: #e0e0e0;
@@ -92,6 +97,11 @@ pre.output .tooltip:hover {
9297
display: none;
9398
}
9499

100+
.tooltip > .tooltip-text-fab::after {
101+
/* hide the tooltip pointer */
102+
display: none;
103+
}
104+
95105
.tooltip > .tooltip-text-bottom-left::after {
96106
left: calc(5% - 2.5px);
97107
}

0 commit comments

Comments
 (0)