Move filepreview css to own file; clean up some rules

Author: Mai-Lapyst

web_src/css/index.css

@@ -30,6 +30,7 @@
 @import "./markup/content.css";
 @import "./markup/codecopy.css";
 @import "./markup/asciicast.css";
+@import "./markup/filepreview.css";
 
 @import "./chroma/base.css";
 @import "./codemirror/base.css";

web_src/css/markup/content.css

@@ -128,7 +128,7 @@
 .markup ul,
 .markup ol,
 .markup dl,
-.markup table:not(.file-preview),
+.markup table,
 .markup pre {
   margin-top: 0;
   margin-bottom: 16px;
@@ -281,29 +281,29 @@
   margin-bottom: 0;
 }
 
-.markup table:not(.file-preview) {
+.markup table {
   display: block;
   width: 100%;
   width: max-content;
   max-width: 100%;
   overflow: auto;
 }
 
-.markup table:not(.file-preview) th {
+.markup table th {
   font-weight: var(--font-weight-semibold);
 }
 
-.markup table:not(.file-preview) th,
-.markup table:not(.file-preview) td {
+.markup table th,
+.markup table td {
   padding: 6px 13px !important;
   border: 1px solid var(--color-secondary) !important;
 }
 
-.markup table:not(.file-preview) tr {
+.markup table tr {
   border-top: 1px solid var(--color-secondary);
 }
 
-.markup table:not(.file-preview) tr:nth-child(2n) {
+.markup table tr:nth-child(2n) {
   background-color: var(--color-markup-table-row);
 }
 
@@ -586,25 +586,3 @@
 .file-view.markup.orgmode li.indeterminate > p {
   display: inline-block;
 }
-
-.markup .file-preview-box {
-  margin-bottom: 16px;
-}
-
-.markup .file-preview-box div:nth-child(1) {
-  padding: .5rem;
-  padding-left: 1rem;
-  border: 1px solid var(--color-secondary);
-  border-bottom: none;
-  border-radius: 0.28571429rem 0.28571429rem 0 0;
-  background: var(--color-box-header);
-}
-
-.markup .file-preview-box div:nth-child(1) > a {
-  display: block;
-}
-
-.markup .file-preview-box .table {
-  margin-top: 0;
-  border-radius: 0 0 0.28571429rem 0.28571429rem;
-}

web_src/css/markup/filepreview.css

@@ -0,0 +1,35 @@
+.markup table.file-preview {
+  margin-bottom: 0px;
+}
+
+.markup table.file-preview td {
+  padding: 0 10px 0 10px !important;
+  border: none !important;
+}
+
+.markup table.file-preview tr {
+  border-top: none;
+  background-color: inherit !important;
+}
+
+.markup .file-preview-box {
+  margin-bottom: 16px;
+}
+
+.markup .file-preview-box .header {
+  padding: .5rem;
+  padding-left: 1rem;
+  border: 1px solid var(--color-secondary);
+  border-bottom: none;
+  border-radius: 0.28571429rem 0.28571429rem 0 0;
+  background: var(--color-box-header);
+}
+
+.markup .file-preview-box .header > a {
+  display: block;
+}
+
+.markup .file-preview-box .table {
+  margin-top: 0;
+  border-radius: 0 0 0.28571429rem 0.28571429rem;
+}