fleet/ee/vulnerability-dashboard/assets/styles/layout.less
Eric b1945b2128
Add fleet-vulnerability-dashboard repo to ee/ folder (#17428)
Closes: https://github.com/fleetdm/confidential/issues/4057

Changes:
- Added the contents of the fleet-vulnerability-dashboard repo to
ee/vulnerability-dashboard
- Added a github workflow to deploy the vulnerability dashboard on
Heroku
- Added a github workflow to test changes to the vulnerability-dashboard
- Updated the website's custom configuration to enable
auto-approvals/review requests to files in the
ee/vulnerability-dashboard folder
2024-03-13 13:06:11 -05:00

90 lines
1.9 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;
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;
}
}
}