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): tweak grid header style

Browse Source
This commit is contained in:
Łukasz Mierzwa
2020-03-30 22:06:11 +01:00
parent 65a9623fb0
commit 9489daa468
2 changed files with 29 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
ui/src/Components/Grid/AlertGrid/Grid.js
View File

@@ -118,32 +118,30 @@ const Grid = observer(
return (
<React.Fragment>
{alertStore.data.grids.length > 1 && (
<h5 className="d-flex flex-row justify-content-between px-2 py-1 mx-0 mt-2 mb-0 bg-light">
{grid.alertGroups.length > 1 && (
<span className="flex-shrink-0 flex-grow-0 ml-0 mr-2">
<FilteringCounterBadge
name="@state"
value="unprocessed"
counter={grid.stateCount.unprocessed}
themed={true}
alertStore={alertStore}
/>
<FilteringCounterBadge
name="@state"
value="suppressed"
counter={grid.stateCount.suppressed}
themed={true}
alertStore={alertStore}
/>
<FilteringCounterBadge
name="@state"
value="active"
counter={grid.stateCount.active}
themed={true}
alertStore={alertStore}
/>
</span>
)}
<h5 className="components-grid-swimlane d-flex flex-row justify-content-between rounded px-2 py-1 mx-1 mt-2 mb-0">
<span className="flex-shrink-0 flex-grow-0 ml-0 mr-2">
<FilteringCounterBadge
name="@state"
value="unprocessed"
counter={grid.stateCount.unprocessed}
themed={true}
alertStore={alertStore}
/>
<FilteringCounterBadge
name="@state"
value="suppressed"
counter={grid.stateCount.suppressed}
themed={true}
alertStore={alertStore}
/>
<FilteringCounterBadge
name="@state"
value="active"
counter={grid.stateCount.active}
themed={true}
alertStore={alertStore}
/>
</span>
<span
className="flex-shrink-1 flex-grow-1 text-center"
style={{ minWidth: "0px" }}
@@ -158,7 +156,7 @@ const Grid = observer(
)}
</span>
<span
className="flex-shrink-0 flex-grow-0 text-white cursor-pointer badge px-0 components-label ml-2 mr-0"
className="flex-shrink-0 flex-grow-0 text-muted cursor-pointer badge px-0 components-label ml-2 mr-0"
onClick={this.gridToggle.toggle}
>
<TooltipWrapper title="Click to toggle this grid details">

4
ui/src/Styles/Components/AlertGrid.scss
View File

@@ -6,3 +6,7 @@
transition-duration: 0.4s;
transition-timing-function: ease;
}
.components-grid-swimlane {
background-color: $dark;
}