Update themes/modern-dark.css

themes/modern-dark.css

@@ -11,20 +11,15 @@
     --border-color: #333333;
 }
 
-/* Backgrounds */
+/* General settings */
 body {
     background-color: var(--background-color);
     color: var(--text-color);
     font-family: Arial, sans-serif;
+    margin: 0;
+    padding: 0;
 }
 
-header, footer {
-    background-color: var(--surface-color);
-    color: var(--text-color);
-    padding: 1em;
-}
-
-/* Links */
 a {
     color: var(--primary-color);
     text-decoration: none;
@@ -34,6 +29,13 @@ a:hover {
     text-decoration: underline;
 }
 
+/* Headers and footers */
+header, footer {
+    background-color: var(--surface-color);
+    color: var(--text-color);
+    padding: 1em;
+}
+
 /* Buttons */
 button, .button {
     background-color: var(--primary-color);
@@ -48,7 +50,7 @@ button:hover, .button:hover {
     background-color: #9B59FC;
 }
 
-/* Inputs */
+/* Inputs, selects, textareas */
 input, textarea, select {
     background-color: var(--surface-color);
     color: var(--text-color);
@@ -57,6 +59,11 @@ input, textarea, select {
     border-radius: 4px;
 }
 
+input:focus, textarea:focus, select:focus {
+    outline: none;
+    border-color: var(--primary-color);
+}
+
 /* Tables */
 table {
     width: 100%;
@@ -107,3 +114,141 @@ form {
     background-color: var(--primary-color);
     color: #FFFFFF;
 }
+
+/* Specific YaCy elements */
+body, table, input, textarea, select {
+    font-size: 11px;
+    font-family: verdana, tahoma, arial, helvetica, sans-serif;
+}
+
+h1, h2, h3, h4 {
+    font-family: Arial, Helvetica, sans-serif;
+    color: var(--text-color);
+    margin-bottom: 4px;
+}
+
+input, textarea, select {
+    color: var(--text-color);
+}
+
+input[type=checkbox], input[type=radio] {
+    width: 13px;
+    height: 13px;
+}
+
+a img, a:hover img {
+    border: 0;
+}
+
+a.nounderline {
+    text-decoration: none;
+}
+
+pre {
+    font-family: courier;
+    font-size: 12px;
+}
+
+input {
+    font-size: 12px;
+}
+
+/* Box and list styles */
+.box {
+    border: 1px solid var(--border-color);
+    padding: 5px;
+    margin: 2px 0px 5px 0px;
+    background-color: var(--surface-color);
+}
+
+ul {
+    list-style-type: square;
+    margin: 5px 0px 10px 15px;
+    padding: 0px;
+}
+
+ul li {
+    margin: 0px 0px 2px 0px;
+    padding: 0px;
+}
+
+/* Form styles */
+form, fieldset {
+    margin: 0px;
+    padding: 0px;
+}
+
+fieldset {
+    border: 1px solid var(--border-color);
+    padding: 5px 10px 10px 10px;
+    margin-top: 10px;
+    background-color: var(--surface-color);
+}
+
+legend {
+    padding: 0px 3px;
+    color: var(--primary-color);
+    font-weight: bold;
+}
+
+/* Specific classes and IDs */
+.pagenavigation a, .pagenavigation a:hover {
+    background-color: transparent;
+    color: var(--primary-color);
+}
+
+.small {
+    font-size: 10px;
+    color: var(--text-muted-color);
+}
+
+.half {
+    font-size: 12px;
+    color: var(--text-muted-color);
+}
+
+.warning {
+    color: #FF0000;
+    font-weight: bold;
+}
+
+/* Highlighting */
+.highlight {
+    background-color: var(--secondary-color);
+    padding: 2px 4px;
+    border-radius: 2px;
+}
+
+/* Code blocks */
+code {
+    background-color: var(--surface-color);
+    color: var(--primary-color);
+    padding: 2px 4px;
+    border-radius: 4px;
+}
+
+/* Tooltips */
+.tooltip {
+    position: relative;
+    display: inline-block;
+}
+
+.tooltip .tooltiptext {
+    visibility: hidden;
+    width: 120px;
+    background-color: var(--surface-color);
+    color: var(--text-color);
+    text-align: center;
+    border-radius: 6px;
+    padding: 5px 0;
+    position: absolute;
+    z-index: 1;
+    bottom: 100%; /* Position the tooltip above the text */
+    left: 50%;
+    margin-left: -60px;
+    border: 1px solid var(--border-color);
+}
+
+.tooltip:hover .tooltiptext {
+    visibility: visible;
+}