modal styling / @Rob

pull/1/head
yann300 6 years ago
parent a5a7b12e46
commit 8d9f78d0c9
  1. 1
      src/app/ui/modaldialog.js
  2. 10
      src/app/ui/styles/modaldialog-styles.js

@ -15,6 +15,7 @@ module.exports = (title, content, ok, cancel, focusSelector) => {
var cancelDiv = document.getElementById('modal-footer-cancel') var cancelDiv = document.getElementById('modal-footer-cancel')
cancelDiv.innerHTML = (cancel && cancel.label !== undefined) ? cancel.label : 'Cancel' cancelDiv.innerHTML = (cancel && cancel.label !== undefined) ? cancel.label : 'Cancel'
cancelDiv.style.display = cancelDiv.innerHTML === '' ? 'none' : 'inline-block'
var modal = document.querySelector(`.${css.modalBody}`) var modal = document.querySelector(`.${css.modalBody}`)
var modalTitle = document.querySelector(`.${css.modalHeader} h3`) var modalTitle = document.querySelector(`.${css.modalHeader} h3`)

@ -17,17 +17,21 @@ var css = csjs`
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
background: var(--info); background: var(--info);
color: var(--primary);
} }
.modalBody { .modalBody {
padding: 1.5em; padding: 1.5em;
line-height: 1.5em; line-height: 1.5em;
color: var(--success); color: var(--primary);
} }
.modalBody em { .modalBody em {
color: var(--text-secondary); color: var(--success);
} }
.modalBody a { .modalBody a {
color: var(--text-secondary); color: var(--secondary);
}
.modalBody a:hover {
color: var(--success);
} }
.modalFooter { .modalFooter {
display: flex; display: flex;

Loading…
Cancel
Save