mirror of
https://github.com/fleetdm/fleet
synced 2026-04-21 21:47:20 +00:00
a00559e732
> Related issue: #9956 # Checklist for submitter If some of the following don't apply, delete the relevant line. <!-- Note that API documentation changes are now addressed by the product design team. --> - [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/Committing-Changes.md#changes-files) for more information. - [x] Input data is properly validated, `SELECT *` is avoided, SQL injection is prevented (using placeholders for values in statements) - [x] Added/updated tests - [x] If paths of existing endpoints are modified without backwards compatibility, checked the frontend/CLI for any necessary changes - [x] If database migrations are included, checked table schema to confirm autoupdate - For database migrations: - [x] Checked schema for all modified table for columns that will auto-update timestamps during migration. - [x] Confirmed that updating the timestamps is acceptable, and will not cause unwanted side effects. - [x] Ensured the correct collation is explicitly set for character columns (`COLLATE utf8mb4_unicode_ci`). - [x] Manual QA for all new/changed functionality --------- Co-authored-by: Martin Angers <martin.n.angers@gmail.com> Co-authored-by: Gabriel Hernandez <ghernandez345@gmail.com> Co-authored-by: Roberto Dip <rroperzh@gmail.com> Co-authored-by: Sarah Gillespie <73313222+gillespi314@users.noreply.github.com> Co-authored-by: Dante Catalfamo <43040593+dantecatalfamo@users.noreply.github.com> Co-authored-by: Roberto Dip <dip.jesusr@gmail.com>
74 lines
1.4 KiB
SCSS
74 lines
1.4 KiB
SCSS
.status-indicator {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
&:before {
|
|
border-radius: 100%;
|
|
content: " ";
|
|
display: inline-block;
|
|
margin-right: $pad-small;
|
|
height: 8px;
|
|
min-width: 8px;
|
|
}
|
|
|
|
// New indicator styles
|
|
&--success {
|
|
&:before {
|
|
background-color: $ui-success;
|
|
}
|
|
}
|
|
|
|
&--warning {
|
|
&:before {
|
|
background-color: $ui-warning;
|
|
}
|
|
}
|
|
|
|
&--error {
|
|
&:before {
|
|
background-color: $ui-error;
|
|
}
|
|
}
|
|
|
|
&--indeterminate {
|
|
&:before {
|
|
background-color: $ui-offline;
|
|
}
|
|
}
|
|
|
|
|
|
// NOTE: We will move away from styling the indicator status depending
|
|
// on the value passed to the component. Instead we have added an `indicator`
|
|
// prop that will allow us explicitly define the desired status. This makes
|
|
// the component more flexible and easier to use. The next two blocks of
|
|
// styles (host status and user status) will be removed in the future.
|
|
|
|
// host status
|
|
&--online:before,
|
|
&--enabled:before,
|
|
&--on:before {
|
|
background-color: $ui-success;
|
|
}
|
|
&--offline:before,
|
|
&--disabled:before,
|
|
&--off:before {
|
|
background-color: $ui-offline;
|
|
}
|
|
|
|
// user status
|
|
&--active {
|
|
&:before {
|
|
background-color: $ui-success;
|
|
}
|
|
}
|
|
&--no-access {
|
|
&:before {
|
|
background-color: $ui-offline;
|
|
}
|
|
}
|
|
&--invite-pending {
|
|
&:before {
|
|
background-color: $ui-warning;
|
|
}
|
|
}
|
|
}
|