Massive style changes

wwwroot/css/file-explorer.css

@@ -13,6 +13,8 @@
 .fe-modal {
   background: var(--f2-bg);
   border: var(--border-width) solid var(--f2-border);
+  border-radius: var(--border-radius);
+  overflow: hidden;
   width: 90vw;
   max-width: 1100px;
   height: 80vh;
@@ -24,7 +26,7 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: var(--s2) var(--s3);
+  padding: .5em;
   border-bottom: var(--border-width) solid var(--f1-border);
   background: var(--f1-bg);
   flex-shrink: 0;
@@ -33,7 +35,7 @@
 .fe-nav {
   display: flex;
   align-items: center;
-  gap: var(--s2);
+  gap: .5em;
   flex: 1;
   overflow: hidden;
 }
@@ -45,10 +47,6 @@
   white-space: nowrap;
 }
 
-.fe-btn {
-  padding: var(--s1) var(--s2);
-}
-
 .fe-body {
   display: flex;
   flex: 1;
@@ -75,7 +73,7 @@
 }
 
 .fe-item {
-  padding: var(--s1) var(--s3);
+  padding: .5em 1em;
   cursor: pointer;
   white-space: nowrap;
   overflow: hidden;
@@ -100,7 +98,7 @@
 }
 
 .fe-loading, .fe-error, .fe-empty, .fe-placeholder {
-  padding: var(--s4);
+  padding: 1em;
   text-align: center;
   opacity: var(--semi-transparent);
   align-self: center;
@@ -114,21 +112,16 @@
   display: flex;
   flex: 1;
   overflow: hidden;
-  font-size: 0.9em;
 }
 
 .fe-line-numbers {
-  padding: var(--s2);
-  padding-right: var(--s3);
+  padding: .5em;
   background: var(--f1-bg);
   color: var(--text);
   opacity: var(--semi-transparent);
   text-align: right;
   overflow: hidden;
   user-select: none;
-  line-height: 1.5;
-  font-family: monospace;
-  font-size: 1em;
   border-right: var(--border-width) solid var(--f1-border);
   flex-shrink: 0;
   min-width: 3em;
@@ -143,16 +136,15 @@
   border: none;
   background: var(--f2-bg);
   color: var(--text);
-  font-family: monospace;
-  font-size: 1em;
   line-height: 1.5;
-  padding: var(--s2);
+  padding: .5em;
   outline: none;
   overflow-y: auto;
   white-space: pre;
   tab-size: 4;
-  min-height: unset;
   height: auto;
+  min-height: unset;
+  max-height: unset;
 }
 
 .fe-textarea:hover {
@@ -169,11 +161,11 @@
   display: flex;
   align-items: center;
   justify-content: space-between;
-  padding: var(--s2) var(--s3);
+  padding: .5em .5em .5em 1em;
   border-top: var(--border-width) solid var(--f1-border);
   background: var(--f1-bg);
   flex-shrink: 0;
-  gap: var(--s3);
+  gap: .5em;
 }
 
 .fe-info {