11a33c12e3
The colors we were using (gray for unpressed buttons and green or red for pressed buttons) didn't contrast well against a white background, so we're now using darker colors. However, with darker colors, using solid icons for the unpressed buttons makes it harder to differentiate when a button is pressed and when it isn't, particularly for color-blind people. So we're now using regular icons for the unpressed buttons and solid icons for the pressed ones.
178 lines
4.4 KiB
SCSS
178 lines
4.4 KiB
SCSS
// CONSUL DEMOCRACY Settings
|
|
// -----------------------------
|
|
//
|
|
// Table of Contents:
|
|
//
|
|
// 1. Foundation settings overrides
|
|
// 2. CONSUL DEMOCRACY variables
|
|
// 3. Foundation overrides depending on CONSUL DEMOCRACY variables
|
|
// 4. Foundation fixes
|
|
|
|
// 1. Foundation settings overrides
|
|
// ---------------------------------
|
|
|
|
$black: #222 !default;
|
|
$white: #fdfdfd !default;
|
|
|
|
$body-background: $white;
|
|
$body-font-family: "Source Sans Pro", "Helvetica", "Arial", sans-serif !important !default;
|
|
|
|
$closebutton-color: $black !default;
|
|
|
|
$global-radius: rem-calc(3) !default;
|
|
$global-width: rem-calc(1200) !default;
|
|
|
|
$header-styles: (
|
|
small: (
|
|
"h1": ("font-size": 34),
|
|
"h2": ("font-size": 24),
|
|
"h3": ("font-size": 20),
|
|
"h4": ("font-size": 18),
|
|
"h5": ("font-size": 16),
|
|
"h6": ("font-size": 14),
|
|
),
|
|
medium: (
|
|
"h1": ("font-size": 44),
|
|
"h2": ("font-size": 34),
|
|
"h3": ("font-size": 24),
|
|
"h4": ("font-size": 19),
|
|
"h5": ("font-size": 16),
|
|
"h6": ("font-size": 13),
|
|
),
|
|
) !default;
|
|
|
|
$small-font-size: rem-calc(14) !default;
|
|
|
|
$abbr-underline: none !default;
|
|
|
|
$orbit-bullet-diameter: 0.8rem !default;
|
|
$orbit-caption-background: #eee;
|
|
|
|
$show-header-for-stacked: true !default;
|
|
|
|
// 2. CONSUL DEMOCRACY variables
|
|
// -----------------------------
|
|
|
|
$body-margin: calc(50vw - #{$global-width / 2}) !default;
|
|
$full-width-margin: unquote("#{$global-width / 2} - 50vw") !default;
|
|
|
|
$base-font-size: rem-calc(17) !default;
|
|
$base-line: rem-calc(26) !default;
|
|
$line-height: rem-calc(24) !default;
|
|
$tiny-font-size: rem-calc(12) !default;
|
|
|
|
$font-family-serif: Georgia, "Times New Roman", Times, serif !default;
|
|
|
|
$brand: #004a83 !default;
|
|
$brand-secondary: darken($brand, 10%) !default;
|
|
|
|
$text-medium: #515151 !default;
|
|
$text-light: #bfbfbf !default;
|
|
|
|
$border: #dee0e3 !default;
|
|
|
|
$debates: $brand !default;
|
|
|
|
$like: #38a36f !default;
|
|
$unlike: #ea6666 !default;
|
|
|
|
$delete: #db2e0f !default;
|
|
$check: #46db91 !default;
|
|
|
|
$proposals: #ffa42d !default;
|
|
$proposals-dark: #794500 !default;
|
|
|
|
$budget: #7e328a !default;
|
|
$budget-hover: #7571bf !default;
|
|
|
|
$highlight: #e7f2fc !default;
|
|
$highlight-soft: #f3f8fd !default;
|
|
$light: #f5f7fa !default;
|
|
$featured: #ffdc5c !default;
|
|
|
|
$footer: #f1f1f1 !default;
|
|
$footer-border: #bfc1c3 !default;
|
|
$main-header: $brand !default;
|
|
$subnavigation: $body-background !default;
|
|
$top-links: $brand-secondary !default;
|
|
|
|
$success-bg: #dff0d8 !default;
|
|
$success-border: #d6e9c6 !default;
|
|
$color-success: #3c763d !default;
|
|
|
|
$info-bg: #d9edf7 !default;
|
|
$info-border: #bce8f1 !default;
|
|
$color-info: #31708f !default;
|
|
|
|
$warning-bg: #fcf8e3 !default;
|
|
$warning-border: #faebcc !default;
|
|
$color-warning: #8a6d3b !default;
|
|
|
|
$alert-bg: #f2dede !default;
|
|
$alert-border: #ebccd1 !default;
|
|
$color-alert: #a94442 !default;
|
|
|
|
$pdf-primary: #0300ff !default;
|
|
$pdf-secondary: #ff9e00 !default;
|
|
|
|
$focus-middle: #ffbf47 !default;
|
|
$focus-outer: $brand !default;
|
|
$focus-inner-width: 1px !default;
|
|
$focus-middle-width: 3px !default;
|
|
$focus-outer-width: 2px !default;
|
|
|
|
$input-height: $line-height * 2 !default;
|
|
|
|
$font-icon-margin: rem-calc(4) !default;
|
|
$icon-width: $line-height * 2 !default;
|
|
|
|
$off-screen-left: -1000rem !default;
|
|
|
|
$sdg-icon-min-width: 45px !default;
|
|
|
|
$sdg-text: #fff;
|
|
$sdg-colors: (
|
|
1: #e5243b,
|
|
2: #dda63a,
|
|
3: #4c9f38,
|
|
4: #c5192d,
|
|
5: #ff3a21,
|
|
6: #26bde2,
|
|
7: #fcc30b,
|
|
8: #a21942,
|
|
9: #fd6925,
|
|
10: #dd1367,
|
|
11: #fd9d24,
|
|
12: #bf8b2e,
|
|
13: #3f7e44,
|
|
14: #0a97d9,
|
|
15: #56c02b,
|
|
16: #00689d,
|
|
17: #19486a
|
|
) !default;
|
|
|
|
// 3. Foundation overrides depending on CONSUL DEMOCRACY variables
|
|
// ---------------------------------------------------------------
|
|
|
|
$anchor-color: $brand !default;
|
|
$anchor-color-hover: darken($anchor-color, 20%) !default;
|
|
|
|
$tab-background-active: $white !default;
|
|
|
|
$tab-item-font-size: $base-font-size !default;
|
|
$tab-item-padding: $line-height / 2 0 !default;
|
|
$tab-content-border: $border !default;
|
|
|
|
$tooltip-background-color: $brand !default;
|
|
|
|
// 4. Foundation fixes
|
|
// -------------------
|
|
|
|
$alert-color: null !default;
|
|
$primary-color: null !default;
|
|
$secondary-color: null !default;
|
|
$success-color: null !default;
|
|
$warning-color: null !default;
|
|
$-zf-bp-value: null !default;
|
|
$-zf-size: null !default;
|