Make edit help modals match manage help modals

This commit is contained in:
Rob Garrison 2018-01-15 19:50:18 -06:00
parent 26dbe6d0f5
commit a52ea871f8
2 changed files with 11 additions and 6 deletions

View File

@ -467,7 +467,7 @@ html:not(.usercss) .applies-to li:last-child .add-applies-to {
#help-popup { #help-popup {
top: 3rem; top: 3rem;
right: 3rem; right: 3rem;
max-width: 50vw; max-width: 26rem;
position: fixed; position: fixed;
display: none; display: none;
background-color: white; background-color: white;
@ -489,6 +489,7 @@ html:not(.usercss) .applies-to li:last-child .add-applies-to {
} }
#help-popup .title { #help-popup .title {
font-weight: bold; font-weight: bold;
font-size: 1rem;
background-color: rgba(0,0,0,0.05); background-color: rgba(0,0,0,0.05);
margin: -0.5rem -0.5rem 0.5rem; margin: -0.5rem -0.5rem 0.5rem;
padding: .5rem 32px .5rem .5rem; padding: .5rem 32px .5rem .5rem;
@ -497,6 +498,10 @@ html:not(.usercss) .applies-to li:last-child .add-applies-to {
max-height: calc(100vh - 8rem); max-height: calc(100vh - 8rem);
overflow-y: auto; overflow-y: auto;
} }
#help-popup.info .contents {
padding: 1.5rem .75rem;
}
#help-popup .settings { #help-popup .settings {
min-width: 500px; min-width: 500px;
min-height: 200px; min-height: 200px;

View File

@ -516,22 +516,22 @@ function fromMozillaFormat() {
function showSectionHelp(event) { function showSectionHelp(event) {
event.preventDefault(); event.preventDefault();
showHelp(t('styleSectionsTitle'), t('sectionHelp')); showHelp(t('styleSectionsTitle'), t('sectionHelp'), 'info');
} }
function showAppliesToHelp(event) { function showAppliesToHelp(event) {
event.preventDefault(); event.preventDefault();
showHelp(t('appliesLabel'), t('appliesHelp')); showHelp(t('appliesLabel'), t('appliesHelp'), 'info');
} }
function showToMozillaHelp(event) { function showToMozillaHelp(event) {
event.preventDefault(); event.preventDefault();
showHelp(t('styleMozillaFormatHeading'), t('styleToMozillaFormatHelp')); showHelp(t('styleMozillaFormatHeading'), t('styleToMozillaFormatHelp'), 'info');
} }
function showHelp(title = '', body) { function showHelp(title = '', body, className = '') {
const div = $('#help-popup'); const div = $('#help-popup');
div.className = ''; div.className = className;
const contents = $('.contents', div); const contents = $('.contents', div);
contents.textContent = ''; contents.textContent = '';