diff --git a/brutaldon/static/css/fullbrutalism.css b/brutaldon/static/css/fullbrutalism.css index 841ee7f..854af7b 100644 --- a/brutaldon/static/css/fullbrutalism.css +++ b/brutaldon/static/css/fullbrutalism.css @@ -300,3 +300,42 @@ img.emoji max-width: 1.5rem; vertical-align: text-bottom; } + +.modal { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: none; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + overflow: hidden; + position: fixed; + z-index: 40; +} +.modal-background { + position: absolute; + background-color: rgba(10,10,10,.86); +} +.modal, .modal-background { + bottom: 0; + left: 0; + right: 0; + top: 0; +} + +.modal-content +{ + z-index: 60; + background-color: #CCC; + color: #000; + padding: 1ex; + border: 8px ridge #CCC; + max-height: 90vh; + overflow: auto; +} + +.modal.is-active { + display: flex; +} + diff --git a/brutaldon/static/css/minimal-large.css b/brutaldon/static/css/minimal-large.css index 5f5bb14..770324f 100644 --- a/brutaldon/static/css/minimal-large.css +++ b/brutaldon/static/css/minimal-large.css @@ -227,4 +227,41 @@ hr.is-hidden border: 1px solid #000; padding: 1.5em; margin-bottom: 1.5em; + background-color: white; + color: black; } + +.modal { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: none; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + overflow: hidden; + position: fixed; + z-index: 40; +} +.modal-background { + position: absolute; + background-color: rgba(10,10,10,.86); +} +.modal, .modal-background { + bottom: 0; + left: 0; + right: 0; + top: 0; +} + +.modal-content +{ + height: 90vh; + overflow: auto; + z-index: 60; +} + +.modal.is-active { + display: flex; +} + diff --git a/brutaldon/static/css/vt240don-amber.css b/brutaldon/static/css/vt240don-amber.css index 66051cc..c317462 100644 --- a/brutaldon/static/css/vt240don-amber.css +++ b/brutaldon/static/css/vt240don-amber.css @@ -167,6 +167,42 @@ img.emoji vertical-align: text-bottom; } +.modal { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: none; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + overflow: hidden; + position: fixed; + z-index: 40; +} +.modal-background { + position: absolute; + background-color: rgba(10,10,10,.86); +} +.modal, .modal-background { + bottom: 0; + left: 0; + right: 0; + top: 0; +} + +.modal-content +{ + z-index: 60; + max-height: 90vh; + overflow: auto; +} + +.modal.is-active { + display: flex; +} + + + @media screen and (max-width: 768px) { .media { display: block; diff --git a/brutaldon/static/css/vt240don-green.css b/brutaldon/static/css/vt240don-green.css index 58aea86..db9fa81 100644 --- a/brutaldon/static/css/vt240don-green.css +++ b/brutaldon/static/css/vt240don-green.css @@ -170,6 +170,41 @@ img.emoji vertical-align: text-bottom; } +.modal { + -webkit-box-align: center; + -ms-flex-align: center; + align-items: center; + display: none; + -webkit-box-pack: center; + -ms-flex-pack: center; + justify-content: center; + overflow: hidden; + position: fixed; + z-index: 40; +} +.modal-background { + position: absolute; + background-color: rgba(10,10,10,.86); +} +.modal, .modal-background { + bottom: 0; + left: 0; + right: 0; + top: 0; +} + +.modal-content +{ + z-index: 60; + max-height: 90vh; + overflow: auto; +} + +.modal.is-active { + display: flex; +} + + @media screen and (max-width: 768px) { .media { display: block;