mirror of
https://github.com/fleetdm/fleet
synced 2026-05-24 09:28:54 +00:00
e3002d409a
**Related issue:** Resolves #37219 # Checklist for submitter If some of the following don't apply, delete the relevant line. - [x] Changes file added for user-visible changes in `changes/`, `orbit/changes/` or `ee/fleetd-chrome/changes`. See [Changes files](https://github.com/fleetdm/fleet/blob/main/docs/Contributing/guides/committing-changes.md#changes-files) for more information. ## Testing - [x] QA'd all new/changed functionality manually
106 lines
2.1 KiB
SCSS
106 lines
2.1 KiB
SCSS
.software-installer-card {
|
|
@include vertical-card-layout;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
|
|
.table-container__results-count {
|
|
height: auto;
|
|
|
|
> span {
|
|
line-height: normal;
|
|
}
|
|
}
|
|
|
|
&__actions {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.component__tooltip-wrapper__element {
|
|
display: flex; // Required for vertical align icons that have and don't have tooltip
|
|
}
|
|
}
|
|
|
|
&__installer-status-table,
|
|
&__installer-policies-table {
|
|
width: 100%;
|
|
}
|
|
|
|
&__installer-header,
|
|
&__row-1 {
|
|
display: flex;
|
|
width: 100%;
|
|
gap: $pad-medium;
|
|
}
|
|
|
|
&__row-1--responsive-wrap {
|
|
display: flex;
|
|
flex-grow: 1;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
&__auto-updates-tooltip {
|
|
text-align: center;
|
|
}
|
|
|
|
// Lots of data (10 items) on one line responsive fix (#29397)
|
|
@media (max-width: ($table-controls-break)) {
|
|
.installer-details-widget__details {
|
|
flex-wrap: wrap;
|
|
}
|
|
// SoftwareDetailsWidget and Tags wrap onto 2 lines on low widths
|
|
&__row-1--responsive-wrap {
|
|
flex-direction: column;
|
|
gap: $pad-medium;
|
|
}
|
|
|
|
// Buttons align top of card when alone (not middle with pills/yaml button)
|
|
&__actions {
|
|
.children-wrapper {
|
|
align-self: start;
|
|
}
|
|
}
|
|
// View YAML (gitops) button wrapped onto third line
|
|
&__installer-header {
|
|
flex-direction: column;
|
|
gap: $pad-medium;
|
|
}
|
|
}
|
|
|
|
&__tags-wrapper {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-content: center;
|
|
gap: $pad-medium; // Between tags
|
|
}
|
|
|
|
&__installer-statuses {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
align-self: stretch;
|
|
border-radius: 6px;
|
|
border: 1px solid $ui-fleet-black-10;
|
|
font-size: $x-small;
|
|
}
|
|
|
|
&__actions-wrapper {
|
|
display: flex;
|
|
gap: $pad-xsmall;
|
|
}
|
|
|
|
&__download-icon {
|
|
display: flex;
|
|
justify-content: center;
|
|
width: 44px;
|
|
}
|
|
|
|
@media (max-width: $break-md) {
|
|
align-items: flex-start;
|
|
|
|
&__main-content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: $pad-large;
|
|
}
|
|
}
|
|
}
|