open.source/stylus
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

edit: workaround for <details> not showing the toggle

Browse Source
This commit is contained in:
tophf 2017-11-29 19:24:40 +03:00
parent 189342472e
commit a60d53de29
2 changed files with 16 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
edit/edit.css
View File

@ -473,6 +473,13 @@ body[data-match-highlight="selection"] .CodeMirror-selection-highlight-scrollbar
#lint { #lint {
overflow-y: auto; overflow-y: auto;
overflow-x: hidden;} overflow-x: hidden;}
#lint > summary {
/* workaround for overflow:auto to show the toggle triangle */
position: absolute;
}
#lint > div {
margin-top: 4em;
}
#lint table { #lint table {
font-size: 100%; font-size: 100%;
border-spacing: 0; border-spacing: 0;

9
edit/edit.js
View File

@ -61,6 +61,15 @@ Promise.all([
} else { } else {
initWithSectionStyle({style}); initWithSectionStyle({style});
} }
// workaround part2 for the <details> not showing its toggle icon: hide <summary> on scroll
$('#lint').addEventListener('scroll', function () {
const newOpacity = this.scrollTop === 0 ? '' : '0';
const style = this.firstElementChild.style;
if (style.opacity !== newOpacity) {
style.opacity = newOpacity;
}
}, {passive: true});
}); });
// make querySelectorAll enumeration code readable // make querySelectorAll enumeration code readable