Narrow-width editor on touchscreens: toggle lint report via click

This commit is contained in:
tophf 2016-02-01 17:09:31 +02:00
parent ddb6f400e7
commit 08e35c6990
2 changed files with 12 additions and 0 deletions

View File

@ -455,6 +455,9 @@
#lint > div { #lint > div {
max-height: 0; max-height: 0;
} }
#lint.collapsed > div {
display: none;
}
#lint:hover > div { #lint:hover > div {
margin-top: 1em; margin-top: 1em;
max-height: 30vh; max-height: 30vh;

View File

@ -979,6 +979,10 @@ function gotoLintIssue(event) {
}); });
} }
function toggleLintReport() {
document.getElementById("lint").classList.toggle("collapsed");
}
function beautify(event) { function beautify(event) {
if (exports.css_beautify) { // thanks to csslint's definition of 'exports' if (exports.css_beautify) { // thanks to csslint's definition of 'exports'
doBeautify(); doBeautify();
@ -1135,6 +1139,11 @@ function initHooks() {
document.getElementById("lint").addEventListener("click", gotoLintIssue); document.getElementById("lint").addEventListener("click", gotoLintIssue);
window.addEventListener("resize", resizeLintReport); window.addEventListener("resize", resizeLintReport);
// touch devices don't have onHover events so the element we'll be toggled via clicking (touching)
if ("ontouchstart" in document.body) {
document.querySelector("#lint h2").addEventListener("click", toggleLintReport);
}
setupGlobalSearch(); setupGlobalSearch();
setCleanGlobal(); setCleanGlobal();
updateTitle(); updateTitle();