Use brand colors on budgets section

This commit is contained in:
decabeza
2020-10-09 12:05:58 +02:00
committed by Javi Martín
parent 048ca61207
commit aabf8493f8
4 changed files with 19 additions and 16 deletions

View File

@@ -20,7 +20,7 @@
} }
.ballot-list-price { .ballot-list-price {
color: $budget; @include brand-text;
display: block; display: block;
font-weight: bold; font-weight: bold;
margin-top: $line-height / 2; margin-top: $line-height / 2;
@@ -40,8 +40,7 @@
} }
&:hover { &:hover {
background: $budget; @include brand-background;
color: #fff;
a, a,
span { span {

View File

@@ -9,6 +9,7 @@
} }
.heading { .heading {
@include brand-text;
border: 2px solid $border; border: 2px solid $border;
border-radius: rem-calc(6); border-radius: rem-calc(6);
box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
@@ -53,7 +54,7 @@
} }
&:hover::before { &:hover::before {
background: $highlight; background: $light;
z-index: -1; z-index: -1;
} }
} }

View File

@@ -102,7 +102,8 @@
} }
&.current-phase-tab a { &.current-phase-tab a {
@include brand-background; background: $brand-secondary;
color: $white;
padding-top: $line-height / 2; padding-top: $line-height / 2;
&:hover { &:hover {

View File

@@ -1130,7 +1130,7 @@
// ----------- // -----------
.budget-header { .budget-header {
background: $budget; @extend %brand-background;
margin-top: -$line-height; margin-top: -$line-height;
padding-bottom: $line-height; padding-bottom: $line-height;
padding-top: $line-height; padding-top: $line-height;
@@ -1165,8 +1165,8 @@
} }
.jumbo-budget { .jumbo-budget {
background: $budget; background: $white;
border-bottom: 1px solid $budget; border-bottom: 2px solid $border;
&.budget-heading { &.budget-heading {
min-height: $line-height * 10; min-height: $line-height * 10;
@@ -1194,7 +1194,7 @@
.icon-angle-left, .icon-angle-left,
p, p,
a { a {
color: #fff; color: $text;
} }
.tagline { .tagline {
@@ -1216,8 +1216,7 @@
} }
.button { .button {
@include brand-text; @extend %brand-background;
background: #fff;
margin-bottom: rem-calc(3); margin-bottom: rem-calc(3);
text-decoration: none; text-decoration: none;
} }
@@ -1231,7 +1230,7 @@
position: relative; position: relative;
.progress { .progress {
background: #212033; background: #bbcdd9;
border-radius: rem-calc(12); border-radius: rem-calc(12);
clear: both; clear: both;
margin-bottom: 0; margin-bottom: 0;
@@ -1239,7 +1238,7 @@
} }
.progress-meter { .progress-meter {
background: #fdcb10; background: $brand;
border-radius: rem-calc(12); border-radius: rem-calc(12);
border-bottom-right-radius: 0; border-bottom-right-radius: 0;
border-top-right-radius: 0; border-top-right-radius: 0;
@@ -1261,6 +1260,7 @@
} }
span { span {
@include brand-text;
font-size: $base-font-size; font-size: $base-font-size;
} }
} }
@@ -1274,7 +1274,7 @@
white-space: nowrap; white-space: nowrap;
&::before { &::before {
color: #a5a1ff; color: $brand;
content: "\57"; content: "\57";
font-family: "icons"; font-family: "icons";
font-size: $small-font-size; font-size: $small-font-size;
@@ -1285,6 +1285,7 @@
} }
span { span {
@include brand-text;
font-size: rem-calc(24); font-size: rem-calc(24);
} }
} }
@@ -1320,7 +1321,7 @@
} }
.subtitle { .subtitle {
border-left: 2px solid $budget; border-left: 2px solid $brand;
margin: $line-height / 2 0; margin: $line-height / 2 0;
padding-left: $line-height / 2; padding-left: $line-height / 2;
} }
@@ -1375,10 +1376,11 @@
z-index: 3; z-index: 3;
@include breakpoint(medium) { @include breakpoint(medium) {
background-color: $budget;
transition: height 0.3s; transition: height 0.3s;
&.is-fixed { &.is-fixed {
background: $white;
border-bottom: 2px solid $border;
height: auto; height: auto;
left: 0; left: 0;
padding: $line-height; padding: $line-height;