fleet/frontend/components/PlatformCompatibility/_styles.scss

.platform-compatibility {
  display: flex;
  font-size: $x-small;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;

  b,
  svg,
  span {
    display: flex;
    align-items: center;
  }

  .platform {
    display: flex;
    gap: $pad-xsmall;
  }
}
Improve loading state for query platform compatibility (#3752) 2022-01-18 21:08:54 +00:00			`.platform-compatibility {`
			`display: flex;`
Fleet UI: Add critical policy option (#8758) 2022-12-14 18:57:57 +00:00			`font-size: $x-small;`
Improve loading state for query platform compatibility (#3752) 2022-01-18 21:08:54 +00:00			`align-items: center;`
Fleet UI: Fix platform compatibility styling (#19850) ## Issue Cerra #19710 ## Description - Remove 12px padding to the left of platform compatibility - Refactor to `flex-wrap` so on small widths, the chrome platform doesn't overflow past the section ## Code cleanup - Remove redundant `<span/>` - Refactor 12px gaps and 4px gaps to use flex `gap` instead of `padding` - Refactor redundant code in `<PlatformCompatibility/>` # 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] Manual QA for all new/changed functionality --------- Co-authored-by: Jacob Shandling <jacob@fleetdm.com> 2024-06-18 22:14:20 +00:00			`gap: 12px;`
			`flex-wrap: wrap;`

Improve loading state for query platform compatibility (#3752) 2022-01-18 21:08:54 +00:00			`b,`
Frontend: Unit tests /components directory, convert to svg icons (#8716) 2022-12-07 17:59:38 +00:00			`svg,`
Improve loading state for query platform compatibility (#3752) 2022-01-18 21:08:54 +00:00			`span {`
			`display: flex;`
			`align-items: center;`
			`}`

Add ability to detect compatibility and update which hosts are checked for a policy (#4703) Add new usePlatformSelector custom hook Add new usePlatformCompatibility custom hook Add new PlatformSelector global component Refactor PlatformCompatibility as global component Refactor sql_tools to TypeScript Improve type definitions for context/policy Align PolicyPage and QueryPage with platform compatibility changes 2022-03-21 16:51:00 +00:00			`.platform {`
Fleet UI: Fix platform compatibility styling (#19850) ## Issue Cerra #19710 ## Description - Remove 12px padding to the left of platform compatibility - Refactor to `flex-wrap` so on small widths, the chrome platform doesn't overflow past the section ## Code cleanup - Remove redundant `<span/>` - Refactor 12px gaps and 4px gaps to use flex `gap` instead of `padding` - Refactor redundant code in `<PlatformCompatibility/>` # 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] Manual QA for all new/changed functionality --------- Co-authored-by: Jacob Shandling <jacob@fleetdm.com> 2024-06-18 22:14:20 +00:00			`display: flex;`
			`gap: $pad-xsmall;`
Improve loading state for query platform compatibility (#3752) 2022-01-18 21:08:54 +00:00			`}`
			`}`