@receiver:
diff --git a/ui/src/Components/LabelSetList/__snapshots__/index.test.js.snap b/ui/src/Components/LabelSetList/__snapshots__/index.test.js.snap
index 9304cfe5c..e3ab2dbc5 100644
--- a/ui/src/Components/LabelSetList/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/LabelSetList/__snapshots__/index.test.js.snap
@@ -9,7 +9,7 @@ exports[` matches snapshot with populated list 1`] = `
-
-
+
foo:
@@ -19,7 +19,7 @@ exports[` matches snapshot with populated list 1`] = `
-
-
+
job:
@@ -29,7 +29,7 @@ exports[` matches snapshot with populated list 1`] = `
-
-
+
instance:
@@ -39,7 +39,7 @@ exports[` matches snapshot with populated list 1`] = `
-
-
+
cluster:
diff --git a/ui/src/Components/Labels/FilterInputLabel/index.test.js b/ui/src/Components/Labels/FilterInputLabel/index.test.js
index dfb8a00f0..15f64b018 100644
--- a/ui/src/Components/Labels/FilterInputLabel/index.test.js
+++ b/ui/src/Components/Labels/FilterInputLabel/index.test.js
@@ -64,13 +64,13 @@ describe(" className", () => {
}
});
- it("applied filter with '=' matcher and no color should use 'btn-warning' class", () => {
- ValidateClass("=", true, "btn-warning");
+ it("applied filter with '=' matcher and no color should use 'btn-default' class", () => {
+ ValidateClass("=", true, "btn-default");
});
- it("applied filter with any matcher other than '=' and no color should use 'btn-warning' class", () => {
+ it("applied filter with any matcher other than '=' and no color should use 'btn-default' class", () => {
for (const matcher of NonEqualMatchers) {
- ValidateClass(matcher, true, "btn-warning");
+ ValidateClass(matcher, true, "btn-default");
}
});
@@ -79,10 +79,10 @@ describe(" className", () => {
ValidateClass("=", true, "btn-info");
});
- it("applied filter included in staticColorLabels with any matcher other than '=' should use 'btn-warning' class", () => {
+ it("applied filter included in staticColorLabels with any matcher other than '=' should use 'btn-default' class", () => {
alertStore.settings.values.staticColorLabels = ["foo"];
for (const matcher of NonEqualMatchers) {
- ValidateClass(matcher, true, "btn-warning");
+ ValidateClass(matcher, true, "btn-default");
}
});
});
diff --git a/ui/src/Components/Labels/FilteringLabel/__snapshots__/index.test.js.snap b/ui/src/Components/Labels/FilteringLabel/__snapshots__/index.test.js.snap
index 411ee21af..6f05c6d96 100644
--- a/ui/src/Components/Labels/FilteringLabel/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/Labels/FilteringLabel/__snapshots__/index.test.js.snap
@@ -8,7 +8,7 @@ exports[` matches snapshot 1`] = `
aria-describedby=\\"tippy-tooltip-1\\"
data-original-title=\\"Click to only show alerts with this label or Alt+Click to hide them\\"
>
-
+
foo:
diff --git a/ui/src/Components/Labels/LabelWithPercent/__snapshots__/index.test.js.snap b/ui/src/Components/Labels/LabelWithPercent/__snapshots__/index.test.js.snap
index b9de37a3c..a5d73bbc1 100644
--- a/ui/src/Components/Labels/LabelWithPercent/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/Labels/LabelWithPercent/__snapshots__/index.test.js.snap
@@ -3,7 +3,7 @@
exports[` matches snapshot with isActive=true 1`] = `
"
-
+
25
@@ -48,7 +48,7 @@ exports[` matches snapshot with isActive=true 1`] = `
exports[` matches snapshot with offset=0 1`] = `
"
-
+
25
@@ -78,7 +78,7 @@ exports[` matches snapshot with offset=0 1`] = `
exports[` matches snapshot with offset=25 1`] = `
"
-
+
25
diff --git a/ui/src/Components/Labels/StaticLabel/__snapshots__/index.test.js.snap b/ui/src/Components/Labels/StaticLabel/__snapshots__/index.test.js.snap
index b9be407da..8da94e487 100644
--- a/ui/src/Components/Labels/StaticLabel/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/Labels/StaticLabel/__snapshots__/index.test.js.snap
@@ -2,7 +2,7 @@
exports[` matches snapshot 1`] = `
"
-
+
foo:
diff --git a/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap b/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
index 2b96134b0..842cf92bb 100644
--- a/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
+++ b/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
@@ -35,7 +35,7 @@ exports[` matches snapshot with labels to show 1`] = `
class=\\"mw-100 p-1\\"
>
-
+
8
@@ -60,7 +60,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
4
@@ -93,7 +93,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
4
@@ -142,7 +142,7 @@ exports[` matches snapshot with labels to show 1`] = `
class=\\"mw-100 p-1\\"
>
-
+
1
@@ -167,7 +167,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
1
@@ -200,7 +200,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
1
@@ -233,7 +233,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
1
@@ -266,7 +266,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
1
@@ -299,7 +299,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
1
@@ -332,7 +332,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
1
@@ -365,7 +365,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
1
@@ -398,7 +398,7 @@ exports[` matches snapshot with labels to show 1`] = `
-
+
1
diff --git a/ui/src/Components/SilenceModal/SilencePreview/__snapshots__/index.test.js.snap b/ui/src/Components/SilenceModal/SilencePreview/__snapshots__/index.test.js.snap
index cfc97ec41..61199c21b 100644
--- a/ui/src/Components/SilenceModal/SilencePreview/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/SilenceModal/SilencePreview/__snapshots__/index.test.js.snap
@@ -18,7 +18,7 @@ exports[` matches snapshot 1`] = `
foo
-
+
job:
@@ -26,7 +26,7 @@ exports[` matches snapshot 1`] = `
foo
-
+
instance:
@@ -44,7 +44,7 @@ exports[` matches snapshot 1`] = `
bar
-
+
job:
@@ -52,7 +52,7 @@ exports[` matches snapshot 1`] = `
bar
-
+
instance:
@@ -70,7 +70,7 @@ exports[` matches snapshot 1`] = `
bar
-
+
job:
@@ -78,7 +78,7 @@ exports[` matches snapshot 1`] = `
bar
-
+
instance:
diff --git a/ui/src/Styles/Components/BaseLabel.scss b/ui/src/Styles/Components/BaseLabel.scss
index 09f32515b..701129f8b 100644
--- a/ui/src/Styles/Components/BaseLabel.scss
+++ b/ui/src/Styles/Components/BaseLabel.scss
@@ -19,7 +19,20 @@
margin-bottom: 2px;
}
+.btn-default,
+.badge-default {
+ background-color: $color-default;
+}
+.border-default {
+ border: 1px solid $color-default;
+}
+
.components-label:not(.badge-pill) {
+ &.badge-default,
+ &.btn-default {
+ border: 1px solid darken($color-default, 2%);
+ }
+
&.badge-primary,
&.btn-primary {
border: 1px solid lighten($primary, 2%);
diff --git a/ui/src/Styles/Components/FilterInputLabel.scss b/ui/src/Styles/Components/FilterInputLabel.scss
index 4a9eba6ad..c79ab8c8d 100644
--- a/ui/src/Styles/Components/FilterInputLabel.scss
+++ b/ui/src/Styles/Components/FilterInputLabel.scss
@@ -43,6 +43,10 @@ button.btn.components-filteredinputlabel {
}
button.components-label.btn {
+ &.btn-default:hover {
+ background-color: $color-default;
+ }
+
&.btn-primary:hover {
background-color: $primary;
}
diff --git a/ui/src/Styles/DarkTheme.scss b/ui/src/Styles/DarkTheme.scss
index e5b8e8929..ca9d72b84 100644
--- a/ui/src/Styles/DarkTheme.scss
+++ b/ui/src/Styles/DarkTheme.scss
@@ -85,6 +85,8 @@ $datepicker__border-radius: 0.25rem;
$datepicker__day-name-color: $white;
$datepicker__day-hover-color: $white;
+$color-default: #7080a7;
+
@import "Styles/Components/Accordion";
@import "Styles/Components/Alert";
@import "Styles/Components/AlertGroup";
diff --git a/ui/src/Styles/LightTheme.scss b/ui/src/Styles/LightTheme.scss
index 6ee18c1f8..afea8bd75 100644
--- a/ui/src/Styles/LightTheme.scss
+++ b/ui/src/Styles/LightTheme.scss
@@ -76,6 +76,8 @@ $datepicker__border-radius: 0.25rem;
$datepicker__day-name-color: $black;
$datepicker__day-hover-color: $black;
+$color-default: #7080a7;
+
@import "Styles/Components/Accordion";
@import "Styles/Components/Alert";
@import "Styles/Components/AlertGroup";