[design] improve menu and modal

Author: zombieFox

css/menu.css

@@ -22,6 +22,7 @@
 .menu-area{
 background-color:rgba(var(--gray-01),0.95);
 border-radius:var(--theme-radius);
+box-shadow:var(--shadow-large);
 width:100%;
 max-height:100%;
 overflow-y: auto;

css/modal.css

@@ -4,7 +4,7 @@
 left:50%;
 font-size:1em;
 width:45em;
-max-width:calc(100%-6em);
+max-width:calc(100%-2em);
 min-width:10em;
 transform:translate(-50%,-50%);
 opacity:0;
@@ -23,24 +23,31 @@
 }
 
 .modal-wrapper{
-box-sizing: border-box;
+background-color:rgb(var(--gray-01));
+border-radius:var(--theme-radius);
+box-shadow:var(--shadow-large);
 position: relative;
-transition: all var(--animation-speed-fast);
+max-height:calc(100vh-2em);
+overflow-y: auto;
+display: grid;
+grid-template-columns:1fr;
+grid-template-rows:1fr auto;
+justify-items: stretch;
+align-items: stretch;
+transition: opacity var(--animation-speed-fast);
 }
 
 .modal-wrapper .container{
 max-width:100%;
 }
 
 .is-transition-end .modal-wrapper{
-transition:allvar(--animation-speed-fast) ease-in-out;
+transition:opacityvar(--animation-speed-fast) ease-in-out;
 }
 
 .modal-body{
-background-color:rgb(var(--gray-01));
 border-radius:var(--theme-radius) var(--theme-radius) 00;
 padding:2em;
-max-height:calc(90vh-3.6666666667em);
 overflow-y: auto;
 box-sizing: border-box;
 z-index:1;
@@ -57,9 +64,9 @@
 
 .modal-controls{
 background-color:rgb(var(--gray-01));
+border-radius:00var(--theme-radius) var(--theme-radius);
 position: relative;
 z-index:2;
-border-radius:00var(--theme-radius) var(--theme-radius);
 display: flex;
 }
 

js/version.js

@@ -1,6 +1,6 @@
 varversion=(function(){
 
-varcurrent="3.18.0";
+varcurrent="3.19.0";
 
 varcompare=function(a,b){
 varpa=a.split(".");

manifest.json

@@ -2,7 +2,7 @@
 "name": "nightTab",
 "short_name": "nightTab",
 "description": "A neutral new tab page accented with a chosen colour. Customise the layout, style, background and bookmarks in nightTab.",
-"version": "3.18.0",
+"version": "3.19.0",
 "manifest_version": 2,
 "chrome_url_overrides":{
 "newtab": "index.html"