Prevent vertical scrollbar on header

This commit is contained in:
Rob Garrison 2017-08-17 14:47:45 -05:00
parent 06cd78b643
commit 12a09976f2
2 changed files with 13 additions and 6 deletions

View File

@ -424,6 +424,9 @@ body[data-match-highlight="selection"] .CodeMirror-selection-highlight-scrollbar
#help-popup .rules { #help-popup .rules {
padding: 0 15px; padding: 0 15px;
} }
#help-popup .save {
margin-right: 3px;
}
/************ lint ************/ /************ lint ************/
#lint { #lint {
@ -574,7 +577,7 @@ body[data-match-highlight="selection"] .CodeMirror-selection-highlight-scrollbar
margin-bottom: 0; margin-bottom: 0;
} }
#lint > div { #lint > div {
max-height: 0; max-height: 20vh;
} }
#lint.collapsed > div { #lint.collapsed > div {
display: none; display: none;

View File

@ -144,17 +144,20 @@ function renderLintReport(someBlockChanged) {
document.getElementById('issue-count').textContent = issueCount; document.getElementById('issue-count').textContent = issueCount;
container.replaceChild(newContent, content); container.replaceChild(newContent, content);
container.style.display = newContent.children.length ? 'block' : 'none'; container.style.display = newContent.children.length ? 'block' : 'none';
resizeLintReport(null, newContent); resizeLintReport();
} }
} }
function resizeLintReport(event, content) { function resizeLintReport() {
content = content || document.getElementById('lint').children[1]; const magicBuffer = 20; // subtracted value to prevent scrollbar
const content = $('#lint table');
if (content.children.length) { if (content.children.length) {
const bounds = content.getBoundingClientRect(); const bounds = content.getBoundingClientRect();
const newMaxHeight = bounds.bottom <= innerHeight ? '' : (innerHeight - bounds.top) + 'px'; const newMaxHeight = bounds.bottom <= window.innerHeight ? '' :
// subtract out a bit of padding or the vertical scrollbar extends beyond the viewport
(window.innerHeight - bounds.top - magicBuffer) + 'px';
if (newMaxHeight !== content.style.maxHeight) { if (newMaxHeight !== content.style.maxHeight) {
content.style.maxHeight = newMaxHeight; content.parentNode.style.maxHeight = newMaxHeight;
} }
} }
} }
@ -189,6 +192,7 @@ function showLintHelp() {
const rules = []; const rules = [];
const url = 'https://stylelint.io/user-guide/rules/'; const url = 'https://stylelint.io/user-guide/rules/';
header = t('issuesHelp', `<a href="${url}" target="_blank">stylelint</a>`); header = t('issuesHelp', `<a href="${url}" target="_blank">stylelint</a>`);
// to-do: change this to a generator
$$('#lint td[role="severity"]').forEach(el => { $$('#lint td[role="severity"]').forEach(el => {
const rule = el.title.replace('Rule: (', '').replace(/[()]/g, '').trim(); const rule = el.title.replace('Rule: (', '').replace(/[()]/g, '').trim();
if (!rules.includes(rule)) { if (!rules.includes(rule)) {