Make toot modal work in brutalist themes

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;
+}
+

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;
+}
+

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;

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;