mirror of
https://github.com/fleetdm/fleet
synced 2026-05-18 14:38:53 +00:00
## Addresses second major part of #15011 (item 3) – Host query report _Note for reviewers: The most important files here are:_ - HostQueryReport.tsx - HQRTable.tsx - HQRTableConfig.tsx _The rest are associated API services, interfaces, helpers, routes, styles, and miscellanious code improvements I made along the way._ ____________ ### See linked issue for enumeration of feature-related tasks <img width="1230" alt="Screenshot 2023-12-08 at 4 23 50 PM" src="https://github.com/fleetdm/fleet/assets/61553566/4ae4b41b-9209-4afa-ae50-8844d01ff8fd"> <img width="1230" alt="collecting" src="https://github.com/fleetdm/fleet/assets/61553566/061ac2bc-899f-4b29-91ba-36ebecf5ce58"> <img width="1230" alt="Screenshot 2023-12-08 at 4 24 39 PM" src="https://github.com/fleetdm/fleet/assets/61553566/f8b25e01-fe3b-47e6-b980-eba9538b1a01"> <img width="1230" alt="Screenshot 2023-12-08 at 4 25 01 PM" src="https://github.com/fleetdm/fleet/assets/61553566/46360274-8500-494c-8fb7-3a1d45347ce0"> Re-routes to host details > queries if: - query reports are globally disabled: https://github.com/fleetdm/fleet/assets/61553566/ac67da8c-57bc-4d9b-96be-daf3b198e704 - query has `Discard data` enabled: https://github.com/fleetdm/fleet/assets/61553566/b797dd24-9893-4360-bf40-b80298848864 - [x] Manual QA for all new/changed functionality --------- Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
70 lines
1.3 KiB
SCSS
70 lines
1.3 KiB
SCSS
.empty-table {
|
|
&__container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
margin: 96px auto $pad-large; // 96px to top of div
|
|
max-width: 450px; // standard empty state width
|
|
gap: $pad-medium; // 16px between image, text, and buttons
|
|
}
|
|
|
|
&__inner {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: $pad-small; // 4px from header to info text
|
|
|
|
h3,
|
|
h3 a {
|
|
text-align: center;
|
|
font-size: $small;
|
|
font-weight: $bold;
|
|
margin: 0;
|
|
}
|
|
|
|
ul {
|
|
margin: 0;
|
|
padding: 0;
|
|
color: $core-fleet-black;
|
|
list-style: none;
|
|
|
|
li {
|
|
&::before {
|
|
content: "•";
|
|
color: $core-vibrant-blue;
|
|
margin-right: $pad-medium;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
&__info {
|
|
max-width: 350px;
|
|
}
|
|
|
|
&__info,
|
|
&__additional-info {
|
|
line-height: 1.5;
|
|
text-align: center;
|
|
color: $core-fleet-blue;
|
|
font-size: $x-small;
|
|
margin: 0;
|
|
}
|
|
|
|
&__cta-buttons {
|
|
display: flex;
|
|
justify-content: center;
|
|
gap: $pad-medium; // 16px between buttons
|
|
}
|
|
}
|
|
|
|
// more flexible styling for empty tables within tabs
|
|
.react-tabs {
|
|
.empty-table {
|
|
&__container {
|
|
align-self: center;
|
|
justify-content: center;
|
|
margin-bottom: 20px;
|
|
min-height: 155px;
|
|
max-width: none;
|
|
}
|
|
}
|
|
}
|