8173a57904
* style: update brand colors * chore: upgrade react-component deps * add new downloads page * chore: upgrades react-tabs * chore: update deps * style: home page color updates * style: fix vmware background * chore: upgrade body text color components * style: adds body-copy color override * feat: updates favicon * content(home): swap trusted by logo image * content(home): updates parity svg * chore: updates product download page * chore: updates product download page to stable * style: fix sticky footer for downloads page * chore: update favicon path Co-authored-by: Jeff Escalante <jescalan@users.noreply.github.com>
171 lines
2.3 KiB
CSS
171 lines
2.3 KiB
CSS
/* page level */
|
|
|
|
.block {
|
|
padding: 100px 0;
|
|
}
|
|
|
|
.tag {
|
|
composes: g-type-label from global;
|
|
display: inline-block;
|
|
background: black;
|
|
color: white;
|
|
padding: 6px 8px;
|
|
}
|
|
|
|
.h2 {
|
|
composes: g-type-display-2 from global;
|
|
margin: 20px 0 20px 0;
|
|
}
|
|
|
|
/* header section */
|
|
|
|
.header {
|
|
text-align: center;
|
|
margin: 140px 0 160px 0;
|
|
}
|
|
|
|
.logos {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
margin: 0 auto;
|
|
|
|
& span {
|
|
font-size: 2.5em;
|
|
font-weight: bold;
|
|
margin-left: 30px;
|
|
margin-right: 30px;
|
|
padding-bottom: 8px;
|
|
|
|
@media (max-width: 550px) {
|
|
margin-left: 15px;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
@media (max-width: 350px) {
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
font-size: 1.8em;
|
|
}
|
|
}
|
|
|
|
& img:first-child {
|
|
height: 60px;
|
|
|
|
@media (max-width: 550px) {
|
|
height: 45px;
|
|
}
|
|
|
|
@media (max-width: 420px) {
|
|
height: 35px;
|
|
}
|
|
}
|
|
|
|
& img:last-child {
|
|
height: 30px;
|
|
|
|
@media (max-width: 550px) {
|
|
height: 25px;
|
|
}
|
|
|
|
@media (max-width: 420px) {
|
|
height: 20px;
|
|
}
|
|
}
|
|
}
|
|
|
|
.buttons > *:not(:last-child) {
|
|
margin-right: 15px;
|
|
}
|
|
|
|
.mainHeadline {
|
|
composes: g-type-display-3 from global;
|
|
}
|
|
|
|
.mainSubhead {
|
|
composes: g-type-body-large from global;
|
|
}
|
|
|
|
/* benefits section */
|
|
|
|
.benefits {
|
|
composes: block;
|
|
background: var(--vagrant-secondary);
|
|
color: var(--black);
|
|
|
|
& h4 {
|
|
margin-top: 20px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
& ul {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
columns: 2;
|
|
|
|
@media (max-width: 900px) {
|
|
columns: 1;
|
|
}
|
|
|
|
& li {
|
|
overflow: hidden;
|
|
}
|
|
|
|
& p {
|
|
margin: 0 0 10px;
|
|
}
|
|
}
|
|
|
|
& small {
|
|
margin-top: 50px;
|
|
display: block;
|
|
|
|
& a {
|
|
color: var(--black);
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
|
|
.buyNow {
|
|
background: var(--vagrant-secondary);
|
|
color: var(--black);
|
|
composes: block;
|
|
|
|
& small a {
|
|
color: var(--black);
|
|
text-decoration: underline;
|
|
}
|
|
|
|
& .purchaseForm {
|
|
margin: 50px 0;
|
|
}
|
|
}
|
|
|
|
.faq {
|
|
composes: block;
|
|
|
|
& h4 {
|
|
margin-top: 20px;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
& > div > ul {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
|
|
& > li:not(:last-child) {
|
|
margin-bottom: 30px;
|
|
|
|
& > p > ul {
|
|
margin: 20px 0;
|
|
|
|
& li {
|
|
margin: 8px 0;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|