fleet/ee/vulnerability-dashboard/assets/styles/layout.less
Eric 48a26f3fe5
Vulnerability dashboard: Add new homepage (#35253)
Related to: https://github.com/fleetdm/fleet/issues/33661

Changes:
- Updated the homepage of the vulnerability dashboard to be a new
dashboard page.
- Updated the `Vulnerability` model to make cveID a unique value.
2025-11-07 12:01:57 -06:00

94 lines
2 KiB
Text

@footer-height: 40px;
@container-md-max-width: 1100px;
[v-cloak] { display: none; }
html, body {
height: 100%;
margin: 0;
font-family: 'Inter', sans-serif;
}
[purpose='page-header'] {
background-color: #fff;
height: 60px;
border-bottom: 1px solid #c4ccd2;
.nav-link {
color: #292b2d;
font-weight: bold;
font-size: 14px;
}
.dropdown-item:hover {
background-color: unset;
color: #6a67fe;
}
button {
color: #292b2d;
font-weight: bold;
font-size: 14px;
background: none;
border: none;
&:focus {
outline: none;
}
}
}
[purpose='page-wrap'] {
height: 100%;
/* lesshint-disable */height: auto !important;/* lesshint-enable */
// ^^The above is to disable "importantRule" and "duplicateProperty" rules.
min-height: 100%;
position: relative;
padding-bottom: @footer-height;
&.header-hidden {
padding-bottom: 0px;
}
background-color: #f8f9fa;
color: #292b2d;
a {
color: #007697;
}
}
[purpose='page-footer'] {
border-top: 1px solid rgba(0, 0, 0, 0.1);
height: @footer-height;
width: 100%;
position: absolute;
left: 0px;
bottom: 0px;
}
body.detected-mobile {
// Above and beyond the media queries below, this selector (which relies on
// `parasails` automatically attaching this class, if appropriate) contains
// styles intended to be activated specifically when loaded from a recognized
// mobile device, regardless of viewport dimensions. This includes tablet
// devices (like the iPad) as well as handset devices (like the iPhone).
// …
}
@media (max-width: 800px) {
[purpose='page-wrap'] {
padding-bottom: 75px;
[purpose='page-footer'] {
height: 75px;
[purpose='footer-copy'], [purpose='footer-nav'] {
width: 100%;
display: block;
text-align: center;
}
}
}
}
@media (max-width: 575px) {
[purpose='page-wrap'] {
padding-bottom: 100px;
[purpose='page-footer'] {
height: 100px;
}
}
}