supernets/hardlounge
supernets/hardlounge
4
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Replace status message abbr with a tooltipped icon

Browse Source
This commit is contained in:
Jérémie Astori 2017-08-05 15:28:05 -04:00
parent 499dfdfe92
commit 0cdc2a0a04
No known key found for this signature in database
GPG Key ID: B9A4F245CD67BDE8
2 changed files with 25 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
client/css/style.css
View File

@ -194,6 +194,7 @@ kbd {
#chat .title:before,
#footer .icon,
#chat .count:before,
#settings .extra-help,
#settings #play:before,
#form #submit:before,
#chat .invite .from:before,
@ -334,6 +335,10 @@ kbd {
line-height: 50px;
}
#settings .extra-help:before {
content: "\f059"; /* http://fontawesome.io/icon/question-circle/ */
}
#settings #play:before {
content: "\f028"; /* http://fontawesome.io/icon/volume-up/ */
margin-right: 9px;
@ -1400,10 +1405,15 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
margin: 4px 10px 0 0;
}
#settings .extra-help,
#settings #play {
color: #7f8c8d;
}
#settings .extra-help {
cursor: help;
}
#settings #play {
font-size: 14px;
transition: opacity .2s;
@ -1725,6 +1735,16 @@ part/quit messages where we don't load previews (adds a blank line otherwise) */
animation-delay: .4s;
}
.tooltipped-no-delay:hover:before,
.tooltipped-no-delay:hover:after,
.tooltipped-no-delay:active:before,
.tooltipped-no-delay:active:after,
.tooltipped-no-delay:focus:before,
.tooltipped-no-delay:focus:after {
-webkit-animation-delay: 0s;
animation-delay: 0s;
}
.tooltipped-s:after,
.tooltipped-se:after,
.tooltipped-sw:after {

7
client/index.html
View File

@ -219,13 +219,16 @@
<div class="col-sm-6">
<label class="opt">
<input type="checkbox" name="optional">
Show <abbr title="Joins, parts, kicks, nick changes, and mode changes">status messages</abbr>
Show status messages
<span class="tooltipped tooltipped-n tooltipped-no-delay" aria-label="Joins, parts, kicks, nick changes, and mode changes">
<button class="extra-help" aria-label="Joins, parts, kicks, nick changes, and mode changes"></button>
</span>
</label>
</div>
<div class="col-sm-6">
<label class="opt">
<input type="checkbox" name="condense">
Condense <abbr title="Joins, parts, kicks, nick changes, and mode changes">status messages</abbr>
Condense status messages
</label>
</div>
<div class="col-sm-6">