first draft of openenings content in html

2020-09-02 12:02:47 +02:00
parent aa59abfcc0
commit cdf8aa6064
3 changed files with 137 additions and 3 deletions
@@ -31,4 +31,60 @@ header[role="banner"]{


 section[role="main-content"]{
+
+  #content{
+    position: absolute;
+    left: 0; top:0;
+    width: 100%; height: 100%;
+    background-color: rgba(0, 0, 0, 0.6);
+
+    >.wrapper{
+      position: relative;
+      margin:5% 10%;
+      padding:1em;
+      overflow-y: hidden;
+      background-color: #fff;
+      border-radius: 5px;
+      height: 80%;
+      box-sizing:border-box;
+    }
+    >.wrapper{
+      display: flex;
+      flex-direction: column;
+      >header{
+        padding:0.5em 0;
+        h1{
+          font-size: 1.323em;
+          font-weight: normal;
+          margin: 0
+        }
+        .close-btn{
+          display: block;
+          width:1em; height:1em;
+          position: absolute;
+          top:1em; right:1em;
+          background-color: #1a1a1a;
+          cursor: pointer;
+          text-align: center;
+          border-radius: 5px;
+          font-weight: bold;
+          line-height: 1;
+          color: #fff;
+        }
+      }
+      >section{
+        overflow-y: auto;
+        div.text{
+          white-space: pre-wrap;
+          font-weight: 300;
+          line-height: 1.2;
+
+        }
+        img{
+          max-width:100%;
+        }
+      }
+    }
+
+  }
 }