Merge privileges

app/assets/stylesheets/app/_editor.scss

@@ -1,4 +1,11 @@
 $heading-height: 75px;
+
+#editor-column {
+  .locked {
+    opacity: 0.8;
+  }
+}
+
 .editor {
   flex: 1 50%;
   display: flex;
@@ -7,10 +14,6 @@ $heading-height: 75px;
   background-color: var(--sn-stylekit-background-color);
 }
 
-.locked {
-  opacity: 0.8;
-}
-
 #editor-title-bar {
   width: 100%;
 

app/assets/stylesheets/app/_lock-screen.scss

@@ -14,8 +14,8 @@
   z-index: $z-index-lock-screen;
   background-color: var(--sn-stylekit-contrast-background-color);
   color: var(--sn-stylekit-foreground-color);
-  font-size: 16px;
   display: flex;
+  flex-direction: column;
   align-items: center;
   justify-content: center;
 
@@ -29,6 +29,7 @@
   .sk-panel {
     width: 315px;
     flex-grow: 0;
+    border-radius: 0;
 
     .sk-panel-header {
       justify-content: center;
@@ -36,9 +37,6 @@
   }
 
   #passcode-reset {
-    margin-top: 18px;
     text-align: center;
-    width: 100%;
-    font-size: 13px;
   }
 }

app/assets/stylesheets/app/_modals.scss

@@ -11,6 +11,42 @@
   }
 }
 
+#privileges-modal {
+  width: 700px;
+
+  table {
+    margin-bottom: 12px;
+    width: 100%;
+    overflow: auto;
+    border-collapse: collapse;
+    border-spacing: 0px;
+    border-color: var(--sn-stylekit-contrast-border-color);
+    background-color: var(--sn-stylekit-background-color);
+    color: var(--sn-stylekit-contrast-foreground-color);
+
+    th, td {
+      padding: 6px 13px;
+      border: 1px solid var(--sn-stylekit-contrast-border-color);
+    }
+
+    tr:nth-child(2n) {
+      background-color: var(--sn-stylekit-contrast-background-color);
+    }
+  }
+
+  th {
+    text-align: center;
+    font-weight: normal;
+  }
+
+  .priv-header  {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+}
+
 #password-wizard {
   font-size: 16px;
 }
@@ -147,9 +183,10 @@
     // Not sure yet if totally required.
     // Update: The extensions manager doesn't display correctly without it
     // flex-grow: 1 should fix that.
-  
+
     flex-grow: 1;
     width: 100%;
     height: 100%;
+    background-color: transparent;
   }
 }