summaryrefslogtreecommitdiffstats
path: root/web_src/less
diff options
context:
space:
mode:
Diffstat (limited to 'web_src/less')
-rw-r--r--web_src/less/_base.less342
-rw-r--r--web_src/less/markup/content.less1
-rw-r--r--web_src/less/themes/theme-arc-green.less148
3 files changed, 370 insertions, 121 deletions
diff --git a/web_src/less/_base.less b/web_src/less/_base.less
index 1f32307012..6846a21ef9 100644
--- a/web_src/less/_base.less
+++ b/web_src/less/_base.less
@@ -79,7 +79,6 @@
--color-pink: #e03997;
--color-brown: #a5673f;
--color-grey: #888888;
- --color-gold: #a1882b;
/* light variants - produced via Sass scale-color(color, $lightness: +25%) */
--color-red-light: #e45e5e;
--color-orange-light: #f59555;
@@ -93,8 +92,8 @@
--color-pink-light: #e86bb1;
--color-brown-light: #c58b66;
--color-grey-light: #a6a6a6;
- --color-gold-light: #cfb34a;
/* other colors */
+ --color-gold: #a1882b;
--color-black: #1b1c1d;
--color-white: #ffffff;
--color-diff-removed-word-bg: #fdb8c0;
@@ -314,6 +313,299 @@ a.commit-statuses-trigger {
text-decoration: none !important;
}
+.ui.red.labels .label,
+.ui.ui.ui.red.label,
+.ui.red.button,
+.ui.red.buttons .button {
+ background: var(--color-red);
+}
+.ui.red.button:hover,
+.ui.red.buttons .button:hover {
+ background: var(--color-red-light);
+}
+.ui.basic.red.buttons .button,
+.ui.basic.red.button {
+ color: var(--color-red);
+ border-color: var(--color-red);
+}
+.ui.basic.red.buttons .button:hover,
+.ui.basic.red.button:hover {
+ color: var(--color-red-light);
+ border-color: var(--color-red-light);
+}
+
+.ui.orange.labels .label,
+.ui.ui.ui.orange.label,
+.ui.orange.button,
+.ui.orange.buttons .button {
+ background: var(--color-orange);
+}
+.ui.orange.button:hover,
+.ui.orange.buttons .button:hover {
+ background: var(--color-orange-light);
+}
+.ui.basic.orange.buttons .button,
+.ui.basic.orange.button {
+ color: var(--color-orange);
+ border-color: var(--color-orange);
+}
+.ui.basic.orange.buttons .button:hover,
+.ui.basic.orange.button:hover {
+ color: var(--color-orange-light);
+ border-color: var(--color-orange-light);
+}
+
+.ui.yellow.labels .label,
+.ui.ui.ui.yellow.label,
+.ui.yellow.button,
+.ui.yellow.buttons .button {
+ background: var(--color-yellow);
+}
+.ui.yellow.button:hover,
+.ui.yellow.buttons .button:hover {
+ background: var(--color-yellow-light);
+}
+.ui.basic.yellow.buttons .button,
+.ui.basic.yellow.button {
+ color: var(--color-yellow);
+ border-color: var(--color-yellow);
+}
+.ui.basic.yellow.buttons .button:hover,
+.ui.basic.yellow.button:hover {
+ color: var(--color-yellow-light);
+ border-color: var(--color-yellow-light);
+}
+
+.ui.olive.labels .label,
+.ui.ui.ui.olive.label,
+.ui.olive.button,
+.ui.olive.buttons .button {
+ background: var(--color-olive);
+}
+.ui.olive.button:hover,
+.ui.olive.buttons .button:hover {
+ background: var(--color-olive-light);
+}
+.ui.basic.olive.buttons .button,
+.ui.basic.olive.button {
+ color: var(--color-olive);
+ border-color: var(--color-olive);
+}
+.ui.basic.olive.buttons .button:hover,
+.ui.basic.olive.button:hover {
+ color: var(--color-olive-light);
+ border-color: var(--color-olive-light);
+}
+
+.ui.green.labels .label,
+.ui.ui.ui.green.label,
+.ui.green.button,
+.ui.green.buttons .button {
+ background: var(--color-green);
+}
+.ui.green.button:hover,
+.ui.green.buttons .button:hover {
+ background: var(--color-green-light);
+}
+.ui.basic.green.buttons .button,
+.ui.basic.green.button {
+ color: var(--color-green);
+ border-color: var(--color-green);
+}
+.ui.basic.green.buttons .button:hover,
+.ui.basic.green.button:hover {
+ color: var(--color-green-light);
+ border-color: var(--color-green-light);
+}
+
+.ui.teal.labels .label,
+.ui.ui.ui.teal.label,
+.ui.teal.button,
+.ui.teal.buttons .button {
+ background: var(--color-teal);
+}
+.ui.teal.button:hover,
+.ui.teal.buttons .button:hover {
+ background: var(--color-teal-light);
+}
+.ui.basic.teal.buttons .button,
+.ui.basic.teal.button {
+ color: var(--color-teal);
+ border-color: var(--color-teal);
+}
+.ui.basic.teal.buttons .button:hover,
+.ui.basic.teal.button:hover {
+ color: var(--color-teal-light);
+ border-color: var(--color-teal-light);
+}
+
+.ui.blue.labels .label,
+.ui.ui.ui.blue.label,
+.ui.blue.button,
+.ui.blue.buttons .button {
+ background: var(--color-blue);
+}
+.ui.blue.button:hover,
+.ui.blue.buttons .button:hover {
+ background: var(--color-blue-light);
+}
+.ui.basic.blue.buttons .button,
+.ui.basic.blue.button {
+ color: var(--color-blue);
+ border-color: var(--color-blue);
+}
+.ui.basic.blue.buttons .button:hover,
+.ui.basic.blue.button:hover {
+ color: var(--color-blue-light);
+ border-color: var(--color-blue-light);
+}
+
+.ui.violet.labels .label,
+.ui.ui.ui.violet.label,
+.ui.violet.button,
+.ui.violet.buttons .button {
+ background: var(--color-violet);
+}
+.ui.violet.button:hover,
+.ui.violet.buttons .button:hover {
+ background: var(--color-violet-light);
+}
+.ui.basic.violet.buttons .button,
+.ui.basic.violet.button {
+ color: var(--color-violet);
+ border-color: var(--color-violet);
+}
+.ui.basic.violet.buttons .button:hover,
+.ui.basic.violet.button:hover {
+ color: var(--color-violet-light);
+ border-color: var(--color-violet-light);
+}
+
+.ui.purple.labels .label,
+.ui.ui.ui.purple.label,
+.ui.purple.button,
+.ui.purple.buttons .button {
+ background: var(--color-purple);
+}
+.ui.purple.button:hover,
+.ui.purple.buttons .button:hover {
+ background: var(--color-purple-light);
+}
+.ui.basic.purple.buttons .button,
+.ui.basic.purple.button {
+ color: var(--color-purple);
+ border-color: var(--color-purple);
+}
+.ui.basic.purple.buttons .button:hover,
+.ui.basic.purple.button:hover {
+ color: var(--color-purple-light);
+ border-color: var(--color-purple-light);
+}
+
+.ui.pink.labels .label,
+.ui.ui.ui.pink.label,
+.ui.pink.button,
+.ui.pink.buttons .button {
+ background: var(--color-pink);
+}
+.ui.pink.button:hover,
+.ui.pink.buttons .button:hover {
+ background: var(--color-pink-light);
+}
+.ui.basic.pink.buttons .button,
+.ui.basic.pink.button {
+ color: var(--color-pink);
+ border-color: var(--color-pink);
+}
+.ui.basic.pink.buttons .button:hover,
+.ui.basic.pink.button:hover {
+ color: var(--color-pink-light);
+ border-color: var(--color-pink-light);
+}
+
+.ui.brown.labels .label,
+.ui.ui.ui.brown.label,
+.ui.brown.button,
+.ui.brown.buttons .button {
+ background: var(--color-brown);
+}
+.ui.brown.button:hover,
+.ui.brown.buttons .button:hover {
+ background: var(--color-brown-light);
+}
+.ui.basic.brown.buttons .button,
+.ui.basic.brown.button {
+ color: var(--color-brown);
+ border-color: var(--color-brown);
+}
+.ui.basic.brown.buttons .button:hover,
+.ui.basic.brown.button:hover {
+ color: var(--color-brown-light);
+ border-color: var(--color-brown-light);
+}
+
+.ui.grey.labels .label,
+.ui.ui.ui.grey.label,
+.ui.grey.button,
+.ui.grey.buttons .button {
+ background: var(--color-grey);
+}
+.ui.grey.button:hover,
+.ui.grey.buttons .button:hover {
+ background: var(--color-grey-light);
+}
+.ui.basic.grey.buttons .button,
+.ui.basic.grey.button {
+ color: var(--color-grey);
+ border-color: var(--color-grey);
+}
+.ui.basic.grey.buttons .button:hover,
+.ui.basic.grey.button:hover {
+ color: var(--color-grey-light);
+ border-color: var(--color-grey-light);
+}
+
+.ui.black.labels .label,
+.ui.ui.ui.black.label,
+.ui.black.button,
+.ui.black.buttons .button {
+ background: var(--color-black);
+}
+.ui.black.button:hover,
+.ui.black.buttons .button:hover {
+ background: var(--color-black-light);
+}
+.ui.basic.black.buttons .button,
+.ui.basic.black.button {
+ color: var(--color-black);
+ border-color: var(--color-black);
+}
+.ui.basic.black.buttons .button:hover,
+.ui.basic.black.button:hover {
+ color: var(--color-black-light);
+ border-color: var(--color-black-light);
+}
+
+.ui.negative.buttons .button,
+.ui.negative.button {
+ background: var(--color-red);
+}
+
+.ui.negative.buttons .button:hover,
+.ui.negative.button:hover {
+ background: var(--color-red-light);
+}
+
+.ui.positive.buttons .button,
+.ui.positive.button {
+ background: var(--color-green);
+}
+
+.ui.positive.buttons .button:hover,
+.ui.positive.button:hover {
+ background: var(--color-green-light);
+}
+
.ui.search > .results {
background: var(--color-body);
border-color: var(--color-secondary);
@@ -958,6 +1250,52 @@ a.ui.card:hover,
opacity: .35;
}
+.ui.form .fields.error .field textarea,
+.ui.form .fields.error .field select,
+.ui.form .fields.error .field input:not([type]),
+.ui.form .fields.error .field input[type="date"],
+.ui.form .fields.error .field input[type="datetime-local"],
+.ui.form .fields.error .field input[type="email"],
+.ui.form .fields.error .field input[type="number"],
+.ui.form .fields.error .field input[type="password"],
+.ui.form .fields.error .field input[type="search"],
+.ui.form .fields.error .field input[type="tel"],
+.ui.form .fields.error .field input[type="time"],
+.ui.form .fields.error .field input[type="text"],
+.ui.form .fields.error .field input[type="file"],
+.ui.form .fields.error .field input[type="url"],
+.ui.form .field.error textarea,
+.ui.form .field.error select,
+.ui.form .field.error input:not([type]),
+.ui.form .field.error input[type="date"],
+.ui.form .field.error input[type="datetime-local"],
+.ui.form .field.error input[type="email"],
+.ui.form .field.error input[type="number"],
+.ui.form .field.error input[type="password"],
+.ui.form .field.error input[type="search"],
+.ui.form .field.error input[type="tel"],
+.ui.form .field.error input[type="time"],
+.ui.form .field.error input[type="text"],
+.ui.form .field.error input[type="file"],
+.ui.form .field.error input[type="url"],
+.ui.form .field.error select:focus,
+.ui.form .field.error input:not([type]):focus,
+.ui.form .field.error input[type="date"]:focus,
+.ui.form .field.error input[type="datetime-local"]:focus,
+.ui.form .field.error input[type="email"]:focus,
+.ui.form .field.error input[type="number"]:focus,
+.ui.form .field.error input[type="password"]:focus,
+.ui.form .field.error input[type="search"]:focus,
+.ui.form .field.error input[type="tel"]:focus,
+.ui.form .field.error input[type="time"]:focus,
+.ui.form .field.error input[type="text"]:focus,
+.ui.form .field.error input[type="file"]:focus,
+.ui.form .field.error input[type="url"]:focus {
+ background-color: var(--color-error-bg);
+ border: 1px solid var(--color-error-border);
+ color: var(--color-error-text);
+}
+
.ui.loading.loading.input > i.icon svg {
visibility: hidden;
}
diff --git a/web_src/less/markup/content.less b/web_src/less/markup/content.less
index c941c2c8a8..7ee55ea7f8 100644
--- a/web_src/less/markup/content.less
+++ b/web_src/less/markup/content.less
@@ -540,6 +540,7 @@
}
.markup-block-error {
+ border: 1px solid var(--color-error-border) !important;
margin-bottom: 0 !important;
border-bottom-left-radius: 0 !important;
border-bottom-right-radius: 0 !important;
diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less
index 1f6da76db9..a2d2e5d082 100644
--- a/web_src/less/themes/theme-arc-green.less
+++ b/web_src/less/themes/theme-arc-green.less
@@ -56,18 +56,32 @@
--color-secondary-alpha-80: #454a57cc;
--color-secondary-alpha-90: #454a57e1;
/* colors */
- --color-red: #db2828;
- --color-orange: #f2711c;
- --color-yellow: #fbbd08;
- --color-olive: #b5cc18;
- --color-green: #21ba45;
- --color-teal: #00b5ad;
- --color-blue: #2185d0;
- --color-violet: #6435c9;
- --color-purple: #a333c8;
- --color-pink: #e03997;
- --color-brown: #a5673f;
- --color-grey: #767a85;
+ --color-red: #7d3434;
+ --color-orange: #cc580c;
+ --color-yellow: #cc9903;
+ --color-olive: #91a313;
+ --color-green: #87ab63;
+ --color-teal: #00918a;
+ --color-blue: #1a6aa6;
+ --color-violet: #502aa1;
+ --color-purple: #8229a0;
+ --color-pink: #c21e7b;
+ --color-brown: #845232;
+ --color-grey: #5e626a;
+ /* light variants */
+ --color-red-light: #984646;
+ --color-orange-light: #e6630d;
+ --color-yellow-light: #e5ac04;
+ --color-olive-light: #a3b816;
+ --color-green-light: #9fbc82;
+ --color-teal-light: #00a39c;
+ --color-blue-light: #1e78bb;
+ --color-violet-light: #5a30b5;
+ --color-purple-light: #932eb4;
+ --color-pink-light: #db228a;
+ --color-brown-light: #955d39;
+ --color-grey-light: #6a6e78;
+ /* other colors */
--color-black: #1e222e;
--color-gold: #a1882b;
--color-white: #ffffff;
@@ -80,9 +94,9 @@
--color-diff-moved-row-border: #bcca6f;
--color-diff-added-row-border: #314a37;
--color-diff-inactive: #353846;
- --color-error-border: #a53a37;
- --color-error-bg: #482c2c;
- --color-error-text: #ff4433;
+ --color-error-border: #a04141;
+ --color-error-bg: #522;
+ --color-error-text: #f9cbcb;
--color-success-border: #458a57;
--color-success-bg: #284034;
--color-success-text: #6cc664;
@@ -145,105 +159,6 @@
filter: invert(.8);
}
-.ui.red.label,
-.ui.red.labels .label {
- background-color: #7d3434 !important;
- border-color: #8a2121 !important;
-}
-
-.ui.yellow.label,
-.ui.yellow.labels .label {
- border-color: #664d02 !important;
- background-color: #936e00 !important;
-}
-
-.ui.green.label,
-.ui.green.labels .label,
-.ui.basic.green.label {
- background-color: #2d693b !important;
- border-color: #2d693b !important;
-}
-
-.ui.green.labels a.label:hover,
-.ui.basic.green.labels a.label:hover,
-a.ui.ui.ui.green.label:hover,
-a.ui.basic.green.label:hover {
- background-color: #3d794b !important;
- border-color: #3d794b !important;
- color: #fff !important;
-}
-
-.ui.form .fields.error .field textarea,
-.ui.form .fields.error .field select,
-.ui.form .fields.error .field input:not([type]),
-.ui.form .fields.error .field input[type="date"],
-.ui.form .fields.error .field input[type="datetime-local"],
-.ui.form .fields.error .field input[type="email"],
-.ui.form .fields.error .field input[type="number"],
-.ui.form .fields.error .field input[type="password"],
-.ui.form .fields.error .field input[type="search"],
-.ui.form .fields.error .field input[type="tel"],
-.ui.form .fields.error .field input[type="time"],
-.ui.form .fields.error .field input[type="text"],
-.ui.form .fields.error .field input[type="file"],
-.ui.form .fields.error .field input[type="url"],
-.ui.form .field.error textarea,
-.ui.form .field.error select,
-.ui.form .field.error input:not([type]),
-.ui.form .field.error input[type="date"],
-.ui.form .field.error input[type="datetime-local"],
-.ui.form .field.error input[type="email"],
-.ui.form .field.error input[type="number"],
-.ui.form .field.error input[type="password"],
-.ui.form .field.error input[type="search"],
-.ui.form .field.error input[type="tel"],
-.ui.form .field.error input[type="time"],
-.ui.form .field.error input[type="text"],
-.ui.form .field.error input[type="file"],
-.ui.form .field.error input[type="url"] {
- background-color: #522;
- border: 1px solid #7d3434;
- color: #f9cbcb;
-}
-
-.ui.form .field.error select:focus,
-.ui.form .field.error input:not([type]):focus,
-.ui.form .field.error input[type="date"]:focus,
-.ui.form .field.error input[type="datetime-local"]:focus,
-.ui.form .field.error input[type="email"]:focus,
-.ui.form .field.error input[type="number"]:focus,
-.ui.form .field.error input[type="password"]:focus,
-.ui.form .field.error input[type="search"]:focus,
-.ui.form .field.error input[type="tel"]:focus,
-.ui.form .field.error input[type="time"]:focus,
-.ui.form .field.error input[type="text"]:focus,
-.ui.form .field.error input[type="file"]:focus,
-.ui.form .field.error input[type="url"]:focus {
- background-color: #522;
- border: 1px solid #a04141;
- color: #f9cbcb;
-}
-
-.ui.green.button,
-.ui.green.buttons .button {
- background-color: #87ab63;
-}
-
-.ui.green.button:hover,
-.ui.green.buttons .button:hover {
- background-color: #a0cc75;
-}
-
-.ui.red.button,
-.ui.red.buttons .button {
- background-color: #7d3434;
-}
-
-.ui.red.button:hover,
-.ui.red.buttons .button:hover {
- background-color: #984646;
-}
-
/* invert emojis that are hard to read otherwise */
.emoji[aria-label="check mark"],
.emoji[aria-label="currency exchange"],
@@ -271,8 +186,3 @@ a.ui.basic.green.label:hover {
img[src$="/img/matrix.svg"] {
filter: invert(80%);
}
-
-.markup-block-error {
- border: 1px solid rgba(121, 71, 66, .5) !important;
- border-bottom: none !important;
-}
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-26 07:00:12 +0000