* style: update gray brand colors (#994) * Style: Update brand colors (#1043) * style: update brand colors * chore: upgrade react components (#1072) * chore: upgrade react components chore: upgrade docs-page * chore: pin deps * chore: update logos (#1083) * chore: upgrade components to latest chore: upgrade components to stable * chore: style fixes style: color fixes style: adjust body copy color * chore: upgrade deps to stable * style(home): feature icons path to black * chore: upgrade deps for body copy colors * chore: upgrades alert banner * feat: updates favicon * style(home-hero): updates progress bar base * style(home-hero): fix download cta color override
67 lines
1.0 KiB
CSS
67 lines
1.0 KiB
CSS
.brandedCta {
|
|
padding: 88px 0;
|
|
background-color: var(--boundary-secondary);
|
|
background-image: url('./img/bg-pattern.svg');
|
|
background-position: bottom right;
|
|
background-repeat: no-repeat;
|
|
|
|
@media (--small) {
|
|
background-position: bottom 0 right -130px;
|
|
}
|
|
|
|
@media (438px <= width < 600px) {
|
|
background-position: bottom 0 right -260px;
|
|
}
|
|
|
|
@media (width < 438px) {
|
|
background-position: bottom 0 right -170px;
|
|
}
|
|
}
|
|
|
|
.contentContainer {
|
|
@media (width >= 992px) {
|
|
display: flex;
|
|
}
|
|
|
|
@media (width < 992px) {
|
|
flex-direction: column;
|
|
}
|
|
}
|
|
|
|
.heading {
|
|
color: var(--black);
|
|
margin-top: 0;
|
|
|
|
@media (width >= 992px) {
|
|
flex-basis: 33.3%;
|
|
margin: 0;
|
|
}
|
|
}
|
|
|
|
.content {
|
|
max-width: 647px;
|
|
margin: 0;
|
|
color: var(--gray-2);
|
|
}
|
|
|
|
.content-and-links {
|
|
@media (width >= 992px) {
|
|
flex-basis: 66.6%;
|
|
margin-left: 32px;
|
|
}
|
|
|
|
& .g-type-body-large {
|
|
max-width: 35em;
|
|
}
|
|
}
|
|
|
|
.links {
|
|
margin-top: 40px;
|
|
margin-bottom: -16px;
|
|
|
|
& a {
|
|
margin-right: 16px;
|
|
margin-bottom: 16px;
|
|
}
|
|
}
|