This commit is contained in:
rayelliott 2020-06-04 20:22:54 +00:00
parent 782807f5ae
commit 2f7eddda1e
4 changed files with 96 additions and 24 deletions

View File

@ -43,9 +43,7 @@ body.rwavw-custom {
}
@media (max-width: 63.98em) {
.pure-g {
> div {
position: relative;
&:first-child {
@ -67,7 +65,7 @@ body.rwavw-custom {
}
}
h2, h3, h4, h5, h6, p {
.heading-section-title, p {
color: #fff;
}
}

View File

@ -8,7 +8,7 @@ body.rwavw-custom {
display: none !important;
}
h2, h3, h4, h5, h6 {
.heading-section-title {
color: #000a38;
}
@ -30,7 +30,7 @@ body.rwavw-custom {
svg {
height: 44px;
width: auto;
opacity: 0.8;
// color: $accent-500;
}
}
@ -58,35 +58,99 @@ body.rwavw-custom {
}
.widget.rwavw-feature-narrow {
// bg color of row group accent
$bg-color: $accent-500;
.pure-g > div {
justify-content: flex-start;
}
.row-group {
position: relative;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-bottom: 44px;
text-align: center;
p {
margin-bottom: 0;
}
&::before {
content: '';
display: block;
position: absolute;
top: -11px;
bottom: -11px;
left: -16px;
right: -16px;
background-color: $bg-color;
background: linear-gradient(
to top right,
rgba($bg-color, 1),
rgba($bg-color, 0.7)
);
opacity: 0.5;
}
}
.row-group + p {
opacity: 0.7;
}
@media (min-width: 64em) {
.row-group::before {
top: -11px;
bottom: -11px;
left: calc((100vw - 1000px) / -2);
right: -22px;
background: linear-gradient(
to right,
rgba($bg-color, 0.8),
rgba($bg-color, 1)
);
opacity: 0.4;
border-radius: 25px;
}
.pure-g > div:last-child .row-group::before {
left: -22px;
right: calc((100vw - 1000px) / -2);
background: linear-gradient(
to left,
rgba($bg-color, 0.8),
rgba($bg-color, 1)
);
}
}
p, .heading-section-title {
margin-bottom: 22px;
margin-bottom: 44px;
}
.heading-section-title + p {
margin-top: -22px;
}
p {
font-weight: 600;
font-size: 20px;
line-height: 33px;
padding-right: 18px;
font-size: 18px;
line-height: 27px;
margin-top: 0;
opacity: 0.6;
&:not(:last-child) {
padding-right: 18px;
}
a {
display: inline-block;
color: rgb(0, 10, 56);
font-size: 18px;
font-weight: 600;
font-weight: 700;
background-color: rgba(0, 10, 56, 0.05);
margin-left: -22px;
padding: 0 22px;
@ -94,13 +158,22 @@ body.rwavw-custom {
line-height: 42px;
height: 44px;
box-shadow: $box-shadow-sk;;
color: $neutral-900;
background-color: $accent-500;
background-color: linear-gradient(
to top right,
rgba($accent-500, 1),
rgba($accent-500, 0.8)
);
box-shadow: 4px 4px 6px rgba($accent-500, 0.25), -4px -4px 9px rgba(#fff, 0.75);
svg {
position: relative;
height: 28px;
top: 8px;
margin-left: 4px;
color: inherit;
}
}
@ -136,9 +209,6 @@ body.rwavw-custom {
}
}
@media (min-width: 767px) {
}
@media (max-width: 64em) {
p {
text-align: center !important;
@ -166,14 +236,18 @@ body.rwavw-custom {
justify-content: flex-start;
}
h4, h5, h6 {
opacity: 0.8;
.heading-col-title {
color: $accent-500;
}
p {
font-size:16px;
font-weight: 600;
opacity: 0.6;
opacity: 0.8;
&:last-child {
opacity: 0.7;
}
}
}

View File

@ -78,17 +78,17 @@ body.rwavw-custom {
font-weight: 600;
min-width: 18ch;
border: 3px solid #fff;
border: 3px solid $accent-500;
&:first-child {
color: #000;
background-color: #fff;
color: $neutral-900;
background-color: $accent-500;
margin-bottom: 22px;
}
&:last-child {
color: #fff;
background-color: transparent;
color: $accent-500;
background-color: rgba($neutral-900, 0.2);
}
}
}

View File

@ -1,7 +1,7 @@
$color--accent-500: #fc8d00;
$accent-500: #fc8d00;
$color--neutral-900: #231f20;
$neutral-900: #231f20;
$box-shadow-sk: 4px 4px 6px rgba(0, 10, 56, 0.15), -4px -4px 9px rgba(#fff, 0.75);