updated overview page (#164)
Co-authored-by: Davide Di Modica <webmaster.ddm@gmail.com>
taylor_socfortress committed
Feb 23, 2024 at 07:56 UTC
8e3abbcbbbbe47b348428dde1d117e6d4fb4fee7
1 file changed
+19
-8
frontend/src/views/Overview.vue
+19
-8
@@ -5,17 +5,19 @@
5
<ThreatIntelButton size="small" type="primary" />
6
</div>
7
<div class="section">
8
- <div class="columns overflow-hidden">
9
- <div class="basis-1/3">
8
+ <div class="columns column-800 overflow-hidden">
9
+ <div class="basis-2/5">
10
<AgentsCard />
11
</div>
12
- <div class="basis-1/3">
12
+ <div class="basis-2/5">
13
<HealthcheckCard />
14
</div>
15
- <div class="basis-1/3 flex gap-6">
16
- <div class="grow overflow-hidden">
17
- <SocAlertsCard class="h-full" :vertical="cardDirection === 'vertical'" />
18
- </div>
15
+ <div class="basis-1/5 flex gap-6">
16
+ <!--
17
+ <div class="grow overflow-hidden">
18
+ <SocAlertsCard class="h-full" :vertical="cardDirection === 'vertical'" />
19
+ </div>
20
+ -->
21
<div class="grow overflow-hidden">
22
<CustomersCard class="h-full" :vertical="cardDirection === 'vertical'" />
23
</div>
@@ -51,7 +53,7 @@ import ThreatIntelButton from "@/components/alerts/ThreatIntelButton.vue"
53
import ActiveResponseWizardButton from "@/components/activeResponse/ActiveResponseWizardButton.vue"
54
import AgentsCard from "@/components/overview/AgentsCard.vue"
55
import HealthcheckCard from "@/components/overview/HealthcheckCard.vue"
54
-import SocAlertsCard from "@/components/overview/SocAlertsCard.vue"
56
+// import SocAlertsCard from "@/components/overview/SocAlertsCard.vue"
57
import CustomersCard from "@/components/overview/CustomersCard.vue"
58
import PipeList from "@/components/graylog/Pipelines/PipeList.vue"
59
import type { IndexStats } from "@/types/indices.d"
@@ -95,6 +97,15 @@ useResizeObserver(page, entries => {
97
@media (max-width: 1000px) {
98
.section {
99
.columns {
100
+ &:not(.column-1200, .column-800) {
101
+ flex-direction: column;
102
+ }
103
+ }
104
+ }
105
+ }
106
+ @media (max-width: 800px) {
107
+ .section {
108
+ .columns.column-800 {
109
flex-direction: column;
110
}
111
}