mirror of
https://github.com/fleetdm/fleet
synced 2026-05-24 09:28:54 +00:00
5160095f78
Changes: - Added a Fleet GitOps page (/fleet-gitops) - Added a link to the new page in the "Solutions" dropdown to the website's header navigation --------- Co-authored-by: Mike Thomas <78363703+mike-j-thomas@users.noreply.github.com>
645 lines
13 KiB
Text
Vendored
645 lines
13 KiB
Text
Vendored
#fleet-gitops {
|
|
// page-wide heading styles
|
|
|
|
h1 {
|
|
color: #192147;
|
|
|
|
|
|
font-family: Inter;
|
|
font-size: 48px;
|
|
font-style: normal;
|
|
font-weight: 800;
|
|
line-height: 120%;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
h2 {
|
|
color: #192147;
|
|
scroll-margin-top: 100px;
|
|
|
|
font-family: Inter;
|
|
font-size: 32px;
|
|
font-style: normal;
|
|
font-weight: 800;
|
|
line-height: 120%;
|
|
margin-bottom: 0px;
|
|
page-break-before: always;
|
|
|
|
}
|
|
|
|
h3 {
|
|
color: #192147;
|
|
|
|
font-family: Inter;
|
|
font-size: 20px;
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
line-height: 120%;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
h4 {
|
|
color: #515774;
|
|
font-feature-settings: 'salt' on, 'ss01' on, 'ss02' on;
|
|
font-family: 'Roboto Mono';
|
|
font-size: 16px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 150%;
|
|
text-transform: uppercase;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
h5 {
|
|
color: #192147;
|
|
|
|
|
|
font-family: Inter;
|
|
font-size: 16px;
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
line-height: 150%;
|
|
margin-bottom: 0px;
|
|
}
|
|
|
|
p {
|
|
margin-bottom: 0px;
|
|
line-height: 150%;
|
|
}
|
|
|
|
ul {
|
|
padding-inline-start: 22px;
|
|
li {
|
|
margin-bottom: 12px;
|
|
a {
|
|
|
|
}
|
|
}
|
|
}
|
|
|
|
[purpose='page-container'] {
|
|
display: flex;
|
|
padding: 64px 64px 0px 64px;
|
|
max-width: 1200px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 160px;
|
|
align-self: stretch;
|
|
}
|
|
[purpose='page-hero'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 120px;
|
|
align-self: stretch;
|
|
}
|
|
|
|
[purpose='hero-text'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: flex-start;
|
|
gap: 32px;
|
|
flex: 1 0 0;
|
|
max-width: 663px;
|
|
h1 {
|
|
margin-bottom: 0px;
|
|
}
|
|
}
|
|
[purpose='button-row'] {
|
|
display: flex;
|
|
max-width: 360px;
|
|
padding-top: 16px;
|
|
align-items: center;
|
|
align-content: center;
|
|
gap: 24px;
|
|
align-self: stretch;
|
|
flex-wrap: wrap;
|
|
[purpose='cta-button'] {
|
|
display: flex;
|
|
height: 36px;
|
|
min-width: 140px;
|
|
padding: 8px 16px;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 4px;
|
|
border-radius: 8px;
|
|
background: #009A7D;
|
|
color: #FFF;
|
|
text-align: center;
|
|
|
|
|
|
font-family: Inter;
|
|
font-size: 14px;
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
line-height: 150%;
|
|
}
|
|
|
|
}
|
|
|
|
[purpose='page-section'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 64px;
|
|
align-self: stretch;
|
|
}
|
|
[purpose='page-section-sm-padding'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 48px;
|
|
align-self: stretch;
|
|
}
|
|
|
|
[purpose='list-and-cta'] {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 64px;
|
|
align-self: stretch;
|
|
}
|
|
|
|
[purpose='features-list'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 48px;
|
|
flex: 1 0 0;
|
|
[purpose='list-item'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 16px;
|
|
align-self: stretch;
|
|
}
|
|
}
|
|
[purpose='workshop-cta'] {
|
|
display: flex;
|
|
width: 390px;
|
|
padding: 8px;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 24px;
|
|
border-radius: 8px;
|
|
border: 1px solid #E2E4EA;
|
|
background: #FFF;
|
|
[purpose='cta-image'] {
|
|
width: 100%;
|
|
img {
|
|
width: auto;
|
|
height: 249px;
|
|
aspect-ratio: 1;
|
|
}
|
|
flex: 1 0 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
background: linear-gradient(180deg, #E8F1F6 0%, #FFF 84.74%);
|
|
}
|
|
[purpose='cta-text'] {
|
|
display: flex;
|
|
padding: 5px 24px 24px 24px;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 16px;
|
|
align-self: stretch;
|
|
p {
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
[purpose='section-image'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 24px;
|
|
align-self: stretch;
|
|
|
|
|
|
[purpose='image-container'] {
|
|
display: flex;
|
|
height: 469px;
|
|
justify-content: center;
|
|
align-items: center;
|
|
align-self: stretch;
|
|
background: #F9FAFC;
|
|
img {
|
|
max-width: 471px;
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
}
|
|
[purpose='image-caption'] {
|
|
max-width: 663px;
|
|
color: #515774;
|
|
|
|
font-family: Inter;
|
|
font-size: 12px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 150%;
|
|
}
|
|
}
|
|
|
|
|
|
[purpose='two-column-features'] {
|
|
display: flex;
|
|
min-width: 327px;
|
|
align-items: flex-start;
|
|
gap: 64px;
|
|
align-self: stretch;
|
|
}
|
|
[purpose='feature'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 24px;
|
|
flex: 1 0 0;
|
|
}
|
|
[purpose='features-section'] {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
align-content: flex-start;
|
|
gap: 48px 64px;
|
|
align-self: stretch;
|
|
flex-wrap: wrap;
|
|
[purpose='feature'] {
|
|
display: flex;
|
|
min-width: 288px;
|
|
max-width: 336px;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 16px;
|
|
flex: 1 0 0;
|
|
}
|
|
}
|
|
[purpose='section-quote'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 24px;
|
|
align-self: center;
|
|
max-width: 600px;
|
|
[purpose='quote-text'] {
|
|
color: #515774;
|
|
text-align: center;
|
|
font-family: Inter;
|
|
font-size: 22px;
|
|
font-style: italic;
|
|
font-weight: 400;
|
|
line-height: 150%;
|
|
}
|
|
[purpose='quote-attribution'] {
|
|
color: #515774;
|
|
|
|
|
|
font-family: Inter;
|
|
font-size: 12px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 150%;
|
|
|
|
}
|
|
[purpose='quote-author-info'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 4px;
|
|
align-self: center;
|
|
}
|
|
[purpose='quote-author-image'] {
|
|
img {
|
|
height: 48px;
|
|
}
|
|
}
|
|
[purpose='author-name'] {
|
|
color: #192147;
|
|
text-align: center;
|
|
|
|
|
|
font-family: Inter;
|
|
font-size: 14px;
|
|
font-style: normal;
|
|
font-weight: 700;
|
|
line-height: 150%;
|
|
}
|
|
[purpose='author-title'] {
|
|
color: #515774;
|
|
text-align: center;
|
|
|
|
|
|
font-family: Inter;
|
|
font-size: 14px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 20px;
|
|
}
|
|
}
|
|
[purpose='tweets-container'] {
|
|
margin-top: 160px;
|
|
[purpose='tweets'] {
|
|
margin-top: 40px;
|
|
margin-bottom: 64px;
|
|
}
|
|
}
|
|
[purpose='bottom-cta'] {
|
|
display: flex;
|
|
padding: 64px 64px;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 24px;
|
|
align-self: stretch;
|
|
text-align: center;
|
|
[purpose='button-row'] {
|
|
align-self: center;
|
|
padding-top: 0px;
|
|
}
|
|
|
|
}
|
|
|
|
|
|
[parasails-component='parallax-city'] {
|
|
background: linear-gradient(358deg, #E9F4F4 0%, #FFFFFF 100%);
|
|
}
|
|
[parasails-component='scrollable-tweets'] {
|
|
[purpose='tweet-card'] {
|
|
[purpose='quote'] {
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1199px) {
|
|
[purpose='page-container'] {
|
|
gap: 120px;
|
|
}
|
|
[purpose='page-hero'] {
|
|
gap: 120px;
|
|
}
|
|
|
|
[purpose='features-section'] {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
align-content: flex-start;
|
|
gap: 48px 64px;
|
|
align-self: stretch;
|
|
flex-wrap: wrap;
|
|
[purpose='feature'] {
|
|
display: flex;
|
|
max-width: unset;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
flex: 1 0 0;
|
|
}
|
|
}
|
|
[purpose='tweets-container'] {
|
|
margin-top: 120px;
|
|
}
|
|
[purpose='workshop-cta'] {
|
|
width: 313.186px;
|
|
padding: 8px;
|
|
gap: 24px;
|
|
[purpose='cta-text'] {
|
|
padding: 4.015px 19.273px 19.273px 19.273px;
|
|
gap: 12.849px;
|
|
p {
|
|
color: #515774;
|
|
font-family: Inter;
|
|
font-size: 11.243px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 16.061px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@media (max-width: 991px) {
|
|
[purpose='page-container'] {
|
|
display: flex;
|
|
padding: 48px 48px;
|
|
padding-bottom: 0px;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 80px;
|
|
align-self: stretch;
|
|
}
|
|
|
|
[purpose='page-hero'] {
|
|
gap: 80px;
|
|
}
|
|
[purpose='workshop-cta'] {
|
|
width: 312px;
|
|
padding: 8px;
|
|
gap: 24px;
|
|
[purpose='cta-text'] {
|
|
padding: 5px 24px 24px 24px;
|
|
gap: 16px;
|
|
p {
|
|
color: #515774;
|
|
|
|
font-family: Inter;
|
|
font-size: 14px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 20px;
|
|
}
|
|
}
|
|
}
|
|
[purpose='page-section'] {
|
|
gap: 48px;
|
|
}
|
|
[purpose='features-section'] {
|
|
gap: 32px 48px;
|
|
}
|
|
[purpose='two-column-features'] {
|
|
gap: 48px;
|
|
}
|
|
[purpose='bottom-cta'] {
|
|
padding: 48px;
|
|
}
|
|
[purpose='tweets-container'] {
|
|
margin-top: 80px;
|
|
[purpose='tweets'] {
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
}
|
|
@media (max-width: 767px) {
|
|
[purpose='page-container'] {
|
|
display: flex;
|
|
padding: 32px;
|
|
padding-bottom: 0px;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 80px;
|
|
align-self: stretch;
|
|
}
|
|
|
|
[purpose='page-hero'] {
|
|
gap: 80px;
|
|
}
|
|
[purpose='page-section'] {
|
|
gap: 48px;
|
|
}
|
|
[purpose='features-section'] {
|
|
gap: 32px 48px;
|
|
}
|
|
[purpose='two-column-features'] {
|
|
gap: 48px;
|
|
}
|
|
[purpose='list-and-cta'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 48px;
|
|
align-self: stretch;
|
|
}
|
|
[purpose='workshop-cta'] {
|
|
width: 100%;
|
|
padding: 8px;
|
|
gap: 24px;
|
|
[purpose='cta-image'] {
|
|
width: 100%;
|
|
img {
|
|
width: auto;
|
|
height: 330px;
|
|
aspect-ratio: 1;
|
|
}
|
|
flex: 1 0 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
background: linear-gradient(180deg, #E8F1F6 0%, #FFF 84.74%);
|
|
}
|
|
[purpose='cta-text'] {
|
|
padding: 5px 24px 24px 24px;
|
|
gap: 16px;
|
|
p {
|
|
color: #515774;
|
|
|
|
font-family: Inter;
|
|
font-size: 14px;
|
|
font-style: normal;
|
|
font-weight: 400;
|
|
line-height: 20px;
|
|
}
|
|
}
|
|
}
|
|
[purpose='section-image'] {
|
|
[purpose='image-container'] {
|
|
height: unset;
|
|
padding: 43px 76.612px 42px 77.612px;
|
|
img {
|
|
max-width: 471px;
|
|
width: 100%;
|
|
height: auto;
|
|
}
|
|
}
|
|
}
|
|
[purpose='features-section'] {
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: flex-start;
|
|
gap: 32px;
|
|
align-self: stretch;
|
|
[purpose='feature'] {
|
|
width: 100%;
|
|
min-width: unset;
|
|
}
|
|
}
|
|
[purpose='two-column-features'] {
|
|
flex-direction: column;
|
|
min-width: unset;
|
|
}
|
|
[purpose='bottom-cta'] {
|
|
padding: 48px;
|
|
}
|
|
[purpose='tweets-container'] {
|
|
margin-top: 80px;
|
|
[purpose='tweets'] {
|
|
margin-bottom: 48px;
|
|
}
|
|
}
|
|
}
|
|
|
|
@media (max-width: 575px) {
|
|
[purpose='section-image'] {
|
|
[purpose='image-container'] {
|
|
padding: 24px 43.707px 24px 45.707px;
|
|
}
|
|
}
|
|
h1 {
|
|
color: #192147;
|
|
|
|
|
|
font-family: Inter;
|
|
font-size: 32px;
|
|
font-style: normal;
|
|
font-weight: 800;
|
|
line-height: 120%;
|
|
}
|
|
h2 {
|
|
color: #192147;
|
|
font-family: Inter;
|
|
font-size: 24px;
|
|
font-style: normal;
|
|
font-weight: 800;
|
|
line-height: 120%;
|
|
}
|
|
|
|
[purpose='workshop-cta'] {
|
|
width: 100%;
|
|
padding: 8px;
|
|
gap: 24px;
|
|
[purpose='cta-image'] {
|
|
width: 100%;
|
|
img {
|
|
width: auto;
|
|
max-width: 100%;
|
|
max-height: 330px;
|
|
height: auto;
|
|
aspect-ratio: 1;
|
|
padding: 0px 12px;
|
|
}
|
|
padding: 0px 12px;
|
|
flex: 1 0 0;
|
|
display: flex;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
background: linear-gradient(180deg, #E8F1F6 0%, #FFF 84.74%);
|
|
}
|
|
}
|
|
|
|
[purpose='button-row'] {
|
|
display: flex;
|
|
max-width: 100%;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
gap: 16px;
|
|
align-self: stretch;
|
|
[purpose='cta-button'] {
|
|
min-width: 100%;
|
|
}
|
|
}
|
|
[purpose='bottom-cta'] {
|
|
padding: 32px 0px;
|
|
[purpose='button-row'] {
|
|
width: 100%;
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
}
|