github/karma
1
0
Fork 0
mirror of https://github.com/prymitive/karma synced 2026-05-07 03:26:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): don't allow overflow on silence details

Browse Source
This commit is contained in:
Łukasz Mierzwa
2019-10-27 07:51:20 +00:00
parent a9a9efdc4d
commit 392e39e621
3 changed files with 18 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
ui/src/Components/ManagedSilence/SilenceDetails.js
View File

@@ -41,7 +41,7 @@ const SilenceDetails = ({
return (
<div className="mt-1">
<div className="d-flex flex-row justify-content-between">
<div className="d-flex flex-fill flex-lg-row flex-column justify-content-between">
<div className="flex-shrink-1 flex-grow-1">
<div>
<span className="badge px-1 mr-1 components-label">
@@ -109,10 +109,10 @@ const SilenceDetails = ({
</div>
</div>
</div>
<div className="flex-shrink-0 flex-grow-0">
<div className="d-flex flex-column">
<div className="flex-shrink-0 flex-grow-0 mt-lg-0 mt-2">
<div className="d-flex flex-fill flex-lg-column flex-row justify-content-around">
<button
className="btn btn-outline-secondary btn-sm mb-2"
className="btn btn-outline-secondary btn-sm mb-lg-2 mb-0"
onClick={onEditSilence}
>
<FontAwesomeIcon

8
ui/src/Components/ManagedSilence/__snapshots__/index.test.js.snap
View File

@@ -150,7 +150,7 @@ exports[`<ManagedSilence /> matches snapshot with expaned details 1`] = `
</div>
<div class=\\"card-body pt-0\\">
<div class=\\"mt-1\\">
<div class=\\"d-flex flex-row justify-content-between\\">
<div class=\\"d-flex flex-fill flex-lg-row flex-column justify-content-between\\">
<div class=\\"flex-shrink-1 flex-grow-1\\">
<div>
<span class=\\"badge px-1 mr-1 components-label\\">
@@ -266,9 +266,9 @@ exports[`<ManagedSilence /> matches snapshot with expaned details 1`] = `
</div>
</div>
</div>
<div class=\\"flex-shrink-0 flex-grow-0\\">
<div class=\\"d-flex flex-column\\">
<button class=\\"btn btn-outline-secondary btn-sm mb-2\\">
<div class=\\"flex-shrink-0 flex-grow-0 mt-lg-0 mt-2\\">
<div class=\\"d-flex flex-fill flex-lg-column flex-row justify-content-around\\">
<button class=\\"btn btn-outline-secondary btn-sm mb-lg-2 mb-0\\">
<svg aria-hidden=\\"true\\"
focusable=\\"false\\"
data-prefix=\\"fas\\"

10
ui/src/Components/SilenceModal/index.stories.js
View File

@@ -97,6 +97,16 @@ storiesOf("SilenceModal", module)
const silence = MockSilence();
silence.startsAt = "2018-08-14T16:00:00Z";
silence.endsAt = `2018-08-14T18:${index < 10 ? "0" + index : index}:00Z`;
silence.matchers.push({
name: "thisIsAveryLongNameToTestMatcherWrapping",
value: "valueIsAlsoAbitLong",
isRegex: false
});
silence.matchers.push({
name: "alertname",
value: "(foo1|foo2|foo3|foo4)",
isRegex: true
});
silence.id = `silence${index}`;
silences.push({
cluster: "am",