updated some of the styling and positioning of some stuff

This commit is contained in:
Malcolm Diller 2022-10-15 18:04:41 -07:00
parent 1b0d5b710e
commit 72a65218be

View File

@ -9,11 +9,13 @@
--text-color: #eee; --text-color: #eee;
--input-text-color: #ccc; --input-text-color: black;
--input-background-color: hsl(225, 11.1%, 14%); --input-background-color: #e9e9ed;
--input-border-color: hsl(225, 11.1%, 10%); --input-border-color: #8f8f9d;
/* non-theme stuff */ /* other */
--input-border-radius: 4px;
--input-border-size: 1px;
--accent-color: hsl(var(--accent-hue), 100%, var(--accent-lightness)); --accent-color: hsl(var(--accent-hue), 100%, var(--accent-lightness));
--make-image-border: 2px solid hsl(var(--accent-hue), 100%, calc(var(--accent-lightness) - 21%)); --make-image-border: 2px solid hsl(var(--accent-hue), 100%, calc(var(--accent-lightness) - 21%));
} }
@ -36,7 +38,7 @@
*/ */
/* Discord Theme */ /* Discord Theme */
/* /*
:root { :root {
--background-color1: #36393f; --background-color1: #36393f;
--background-color2: #2f3136; --background-color2: #2f3136;
@ -47,10 +49,30 @@
--accent-lightness: 65%; --accent-lightness: 65%;
--make-image-border: none; --make-image-border: none;
--input-border-size: 2px;
--input-background-color: #202225; --input-background-color: #202225;
--input-border-color: var(--input-background-color); --input-border-color: var(--input-background-color);
} } */
*/
/* Dillerm Theme */
/* :root {
--main-hue: 222;
--main-saturation: 18%;
--value-base: 19%;
--value-step: 3%;
--background-color1: hsl(var(--main-hue), var(--main-saturation), var(--value-base));
--background-color2: hsl(var(--main-hue), var(--main-saturation), calc(var(--value-base) - (1 * var(--value-step))));
--background-color3: hsl(var(--main-hue), var(--main-saturation), calc(var(--value-base) - (2 * var(--value-step))));
--background-color4: hsl(var(--main-hue), var(--main-saturation), calc(var(--value-base) - (3 * var(--value-step))));
--accent-hue: 212;
--make-image-border: none;
--input-border-size: 1px;
--input-background-color: var(--background-color3);
--input-text-color: #ccc;
--input-border-color: var(--background-color4);
} */
* { * {
@ -75,6 +97,7 @@ label {
#prompt { #prompt {
width: 100%; width: 100%;
height: 65pt; height: 65pt;
font-size: 13px;
} }
.image_preview_container { .image_preview_container {
/* display: none; */ /* display: none; */
@ -530,11 +553,11 @@ select {
input, input,
select, select,
textarea { textarea {
border-radius: 6px; border-radius: var(--input-border-radius);
padding: 4px; padding: 4px;
accent-color: var(--accent-color); accent-color: var(--accent-color);
background: var(--input-background-color); background: var(--input-background-color);
border: 2px solid var(--input-border-color); border: var(--input-border-size) solid var(--input-border-color);
color: var(--input-text-color); color: var(--input-text-color);
} }
@ -554,6 +577,15 @@ textarea[disabled] {
opacity: 0.5; opacity: 0.5;
} }
input[type="file"] {
width: 100%;
padding: 2px;
}
input::file-selector-button {
padding: 0px 4px;
}
/* input[type="range"] { /* input[type="range"] {
-webkit-appearance: none; -webkit-appearance: none;
appearance: none; appearance: none;