webapps.wiki: form margin zero.

[factor.git] / extra / webapps / wiki / wiki.css

diff --git a/extra/webapps/wiki/wiki.css b/extra/webapps/wiki/wiki.css
index 40d999b022ada3e90dd070004970520be6b703ea..2136a2e5beb1d8a6f174f373e3040261a27486e8 100644 (file)
--- a/extra/webapps/wiki/wiki.css
+++ b/extra/webapps/wiki/wiki.css
@@ -1,80 +1,66 @@
-.comparison th {
-    border-width: 1px;
-    border-color: #666;
-    border-style: solid;
-    width: 50%;
+input, textarea, select {
+    font-size: 12pt;
+    border: 1px solid #dbdbdb;
+    border-radius: 5px;
+    padding: 5px;
 }
 
-.comparison table {
-    border-color: #666;
-    border-style: solid;
-    border-width: 1px;
-    border-spacing: 0;
-    border-collapse: collapse;
+textarea {
+    width: 100%;
 }
 
-.insert {
-    background-color: #9f9;
+table {
+    table-layout: fixed;
 }
 
-.delete {
-    background-color: #f99;
+td {
+    word-wrap: break-word;
 }
 
-.revisions table, .revisions td, .revisions th {
-    border-color: #666;
-    border-style: solid;
+table.comparison {
+    width: 100%;
 }
 
-.revisions table {
-    border-width: 0 0 1px 1px;
-    border-spacing: 0;
-    border-collapse: collapse;
+table.comparison th {
+    width: 50%;
 }
 
-.revisions td, .revisions th {
-    margin: 0;
-    padding: 4px;
-    border-width: 1px 1px 0 0;
+table.comparison th, table.comparison td {
+    border: 1px solid #ccc;
 }
 
-.contents {
-    font-size: 90%;
-    margin: 0;
-    padding: 15px;
-    padding-top: 0px;
-    line-height: 130%;
+.insert {
+    background-color: #9f9;
+    color: black;
 }
 
-.contents ul {
-    list-style-type: none;
-    margin: 0;
-    padding-left: 20px;
+.delete {
+    background-color: #f99;
+    color: black;
 }
 
-.page {
-    padding: 15px;
-    padding-top: 0px;
-    width: calc(100vw - 200px);
-    max-width: 800px;
+table.revisions {
+    width: 100%;
 }
 
-.page nav {
-    margin: -15px;
-    margin-top: 0px;
-    border-top: 1px dashed #ccc;
-    border-bottom: 1px dashed #ccc;
-    width: calc(100vw - 200px);
-    max-width: 800px;
-    background: none;
+table.revisions td, table.revisions th {
+    margin: 0;
+    padding: 4px;
 }
 
-.page img {
-    max-width: 100%;
+table.revisions, table.revisions th, table.revisions td {
+    border: 1px solid #ccc;
 }
 
-.page hr {
-    height: 1px;
+/* Dark mode */
+@media (prefers-color-scheme: dark) {
+    table.comparison, table.comparison th, table.comparison td {
+        border-color: #666;
+    }
+
+    table.revisions, table.revisions th, table.revisions td {
+        border-color: #666;
+    }
 }
 
 .description {
@@ -96,28 +82,6 @@
 .description p:first-child { margin-top: 0px; }
 .description p:last-child { margin-bottom: 0px; }
 
-.description table, .description td {
-    border-color: #666;
-    border-style: solid;
-}
-
-.description table {
-    border-width: 0 0 1px 1px;
-    border-spacing: 0;
-    border-collapse: collapse;
-}
-
-.description td {
-    margin: 0;
-    padding: 4px;
-    border-width: 1px 1px 0 0;
-}
-
-footer {
-    padding-left: 15px;
-    font-size: smaller;
-}
-
 #left {
     position: absolute;
     top: 0;
@@ -129,26 +93,63 @@ footer {
 }
 
 #right {
-    width: 100%;
+    width: calc(100vw - 200px);
     max-width: calc(min(100vw - 230px, 770px));
 }
 
+.contents {
+    font-size: 90%;
+    margin: 0;
+    padding: 15px;
+    padding-top: 0px;
+    line-height: 130%;
+}
+
+.contents ul {
+    list-style-type: none;
+    margin: 0;
+    padding-left: 20px;
+}
+
+.page nav {
+    margin: -15px;
+    margin-top: 0px;
+    background: none;
+}
+
+.page img {
+    max-width: 100%;
+}
+
+.page hr {
+    height: 1px;
+}
+
 nav img {
-    vertical-align: middle;
+    margin-right: 5px;
     display: none;
 }
 
+nav input {
+    border-radius: 3px;
+    padding: 3px;
+    margin: 0px;
+}
+
 .page nav {
     width: calc(100vw - 200px);
     max-width: 800px;
     left: 0;
     border-top: 1px dashed #ccc;
     border-bottom: 1px dashed #ccc;
+    margin-top: 15px;
 }
 
 .page footer {
+    padding: 15px;
     padding-left: 0;
     padding-right: 0;
+    font-size: smaller;
 }
 
 @media screen and (max-width: 600px) {
@@ -189,6 +190,10 @@ nav img {
         filter: invert(80%);
     }
 
+    nav input {
+        font-size: smaller;
+    }
+
     #left {
         border: none;
         border-left: 1px dashed #666;