EveryCRT Wiki

Template:Form styles.css: Difference between revisions

← Older editNewer edit →
Arclight changed the content model of the page Template:Form styles.css from "wikitext" to "Sanitized CSS"
Add support for info boxes and additional form elements in dark mode (via update-page on MediaWiki MCP Server)
Line 52: Line 52:
}
}


/* Standard text inputs */
/* Standard text inputs - both inside and outside formtable */
.formtable input[type="text"],
input[type="text"],
.formtable input[type="url"],
input[type="url"],
.formtable input[type="number"],
input[type="number"],
.formtable textarea,
textarea,
.formtable select {
select {
     background-color: #ffffff;
     background-color: #ffffff;
     color: #333333;
     color: #333333;
     border-color: #a2a9b1;
     border-color: #a2a9b1;
}
/* Dropdown/select styling */
.formtable select {
    background-color: #ffffff;
    color: #333333;
}
}


Line 108: Line 102:
html.skin-theme-clientpref-night .formtable td[style*="background: #f0f0f0"] {
html.skin-theme-clientpref-night .formtable td[style*="background: #f0f0f0"] {
     background-color: #45475a !important;
     background-color: #45475a !important;
    color: #cdd6f4 !important;
}
/* Info boxes with green backgrounds */
html.skin-theme-clientpref-night div[style*="background: #e8f4e8"],
html.skin-theme-clientpref-night div[style*="background:#e8f4e8"] {
    background-color: #2d4a3e !important;
    border-color: #4a7c5a !important;
     color: #cdd6f4 !important;
     color: #cdd6f4 !important;
}
}
Line 140: Line 142:
}
}


/* Standard text inputs */
/* Standard text inputs - global for form pages */
html.skin-theme-clientpref-night .formtable input[type="text"],
html.skin-theme-clientpref-night input[type="text"],
html.skin-theme-clientpref-night .formtable input[type="url"],
html.skin-theme-clientpref-night input[type="url"],
html.skin-theme-clientpref-night .formtable input[type="number"],
html.skin-theme-clientpref-night input[type="number"],
html.skin-theme-clientpref-night .formtable textarea,
html.skin-theme-clientpref-night textarea,
html.skin-theme-clientpref-night .formtable select {
html.skin-theme-clientpref-night select {
     background-color: #313244 !important;
     background-color: #313244 !important;
     color: #cdd6f4 !important;
     color: #cdd6f4 !important;
Line 151: Line 153:
}
}


/* Dropdown/select styling */
html.skin-theme-clientpref-night select option {
html.skin-theme-clientpref-night .formtable select {
    background-color: #313244 !important;
    color: #cdd6f4 !important;
}
 
html.skin-theme-clientpref-night .formtable select option {
     background-color: #313244;
     background-color: #313244;
     color: #cdd6f4;
     color: #cdd6f4;
Line 183: Line 179:


/* Checkboxes and radio buttons labels */
/* Checkboxes and radio buttons labels */
html.skin-theme-clientpref-night .formtable label {
html.skin-theme-clientpref-night label {
     color: #cdd6f4;
     color: #cdd6f4;
}
}


/* Small help text */
/* Small help text - general */
html.skin-theme-clientpref-night .formtable small {
html.skin-theme-clientpref-night small {
     color: #a6adc8;
     color: #a6adc8;
}
/* Help text with specific color */
html.skin-theme-clientpref-night div[style*="color: #666"],
html.skin-theme-clientpref-night span[style*="color: #666"] {
    color: #a6adc8 !important;
}
}


Line 211: Line 213:


/* Placeholder text */
/* Placeholder text */
html.skin-theme-clientpref-night .formtable input::placeholder,
html.skin-theme-clientpref-night input::placeholder,
html.skin-theme-clientpref-night .formtable textarea::placeholder {
html.skin-theme-clientpref-night textarea::placeholder {
     color: #6c7086 !important;
     color: #6c7086 !important;
}
/* Multiple instance templates (Add input, Add output buttons) */
html.skin-theme-clientpref-night .multipleTemplateStarter,
html.skin-theme-clientpref-night .multipleTemplateAdder {
    background-color: #313244;
    border-color: #45475a;
}
html.skin-theme-clientpref-night .multipleTemplateAdder a {
    color: #89b4fa !important;
}
}


Line 234: Line 247:
     html.skin-theme-clientpref-os .formtable td[style*="background: #f0f0f0"] {
     html.skin-theme-clientpref-os .formtable td[style*="background: #f0f0f0"] {
         background-color: #45475a !important;
         background-color: #45475a !important;
        color: #cdd6f4 !important;
    }
    html.skin-theme-clientpref-os div[style*="background: #e8f4e8"],
    html.skin-theme-clientpref-os div[style*="background:#e8f4e8"] {
        background-color: #2d4a3e !important;
        border-color: #4a7c5a !important;
         color: #cdd6f4 !important;
         color: #cdd6f4 !important;
     }
     }
Line 264: Line 284:
     }
     }


     html.skin-theme-clientpref-os .formtable input[type="text"],
     html.skin-theme-clientpref-os input[type="text"],
     html.skin-theme-clientpref-os .formtable input[type="url"],
     html.skin-theme-clientpref-os input[type="url"],
     html.skin-theme-clientpref-os .formtable input[type="number"],
     html.skin-theme-clientpref-os input[type="number"],
     html.skin-theme-clientpref-os .formtable textarea,
     html.skin-theme-clientpref-os textarea,
     html.skin-theme-clientpref-os .formtable select {
     html.skin-theme-clientpref-os select {
         background-color: #313244 !important;
         background-color: #313244 !important;
         color: #cdd6f4 !important;
         color: #cdd6f4 !important;
Line 274: Line 294:
     }
     }


     html.skin-theme-clientpref-os .formtable select option {
     html.skin-theme-clientpref-os select option {
         background-color: #313244;
         background-color: #313244;
         color: #cdd6f4;
         color: #cdd6f4;
Line 298: Line 318:
     }
     }


     html.skin-theme-clientpref-os .formtable label {
     html.skin-theme-clientpref-os label {
         color: #cdd6f4;
         color: #cdd6f4;
     }
     }


     html.skin-theme-clientpref-os .formtable small {
     html.skin-theme-clientpref-os small {
         color: #a6adc8;
         color: #a6adc8;
    }
    html.skin-theme-clientpref-os div[style*="color: #666"],
    html.skin-theme-clientpref-os span[style*="color: #666"] {
        color: #a6adc8 !important;
     }
     }


Line 322: Line 347:
     }
     }


     html.skin-theme-clientpref-os .formtable input::placeholder,
     html.skin-theme-clientpref-os input::placeholder,
     html.skin-theme-clientpref-os .formtable textarea::placeholder {
     html.skin-theme-clientpref-os textarea::placeholder {
         color: #6c7086 !important;
         color: #6c7086 !important;
    }
    html.skin-theme-clientpref-os .multipleTemplateStarter,
    html.skin-theme-clientpref-os .multipleTemplateAdder {
        background-color: #313244;
        border-color: #45475a;
    }
    html.skin-theme-clientpref-os .multipleTemplateAdder a {
        color: #89b4fa !important;
     }
     }
}
}
Retrieved from "https://wiki.everycrt.com/wiki/Template:Form_styles.css"
MediaWiki Appliance - Powered by TurnKey Linux