| LEFT | RIGHT | 
|   1 // This file is part of help.eyeo.com. |   1 // This file is part of help.eyeo.com. | 
|   2 // Copyright (C) 2017 Eyeo GmbH |   2 // Copyright (C) 2017 Eyeo GmbH | 
|   3 // |   3 // | 
|   4 // help.eyeo.com is free software: you can redistribute it and/or modify |   4 // help.eyeo.com is free software: you can redistribute it and/or modify | 
|   5 // it under the terms of the GNU General Public License as published by |   5 // it under the terms of the GNU General Public License as published by | 
|   6 // the Free Software Foundation, either version 3 of the License, or |   6 // the Free Software Foundation, either version 3 of the License, or | 
|   7 // (at your option) any later version. |   7 // (at your option) any later version. | 
|   8 // |   8 // | 
|   9 // help.eyeo.com is distributed in the hope that it will be useful, |   9 // help.eyeo.com is distributed in the hope that it will be useful, | 
|  10 // but WITHOUT ANY WARRANTY; without even the implied warranty of |  10 // but WITHOUT ANY WARRANTY; without even the implied warranty of | 
|  11 // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the |  11 // MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the | 
|  12 // GNU General Public License for more details. |  12 // GNU General Public License for more details. | 
|  13 // |  13 // | 
|  14 // You should have received a copy of the GNU General Public License |  14 // You should have received a copy of the GNU General Public License | 
|  15 // along with acceptableads.org.  If not, see <http://www.gnu.org/licenses/>. |  15 // along with acceptableads.org.  If not, see <http://www.gnu.org/licenses/>. | 
|  16  |  16  | 
|  17 // Colors ////////////////////////////////////////////////////////////////////// |  17 // Colors ////////////////////////////////////////////////////////////////////// | 
|  18  |  18  | 
|  19 // Grayscale |  19 // Grayscale | 
|  20  |  20  | 
|  21 $white: #fff; |  21 $white: #fff; | 
|  22 $pale-white: #ECECEC; |  22 $gray: #D2D2D2; | 
|  23 $light-gray: #D2D2D2; |  23 $gray-light: #ECECEC; | 
|  24 $medium-gray: #AEAEAE; |  24 $gray-medium: #AEAEAE; | 
|  25 $dark-gray: #757575; |  25 $gray-dark: #757575; | 
|  26 $black: #161616; |  26 $black: #161616; | 
|  27  |  27  | 
|  28 // Brand colors |  28 // Brand colors | 
|  29  |  29  | 
|  30 $eyeo-black: $black; |  30 $eyeo-black: $black; | 
|  31 $abp-red: #C70D2B; |  31 $abp-red: #C70D2B; | 
|  32 $abb-blue: #0D79C7; |  32 $abb-blue: #0D79C7; | 
|  33  |  33  | 
|  34 // Typography ////////////////////////////////////////////////////////////////// |  34 // Typography ////////////////////////////////////////////////////////////////// | 
|  35  |  35  | 
|  36 // Font stack |  36 // Font stack | 
|  37  |  37  | 
|  38 // @see https://www.smashingmagazine.com/2015/11/using-system-ui-fonts-practical
    -guide/ |  38 $primary-font: "Source Sans Pro", sans-serif; | 
|  39 $primary-font: "Source Sans Pro", -apple-system, BlinkMacSystemFont, |  | 
|  40                "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", |  | 
|  41                "Fira Sans", "Droid Sans", "Helvetica Neue", |  | 
|  42                sans-serif; |  | 
|  43  |  39  | 
|  44 // Font colours |  40 // Font colours | 
|  45  |  41  | 
|  46 $font-color-default: $eyeo-black; |  42 $font-color-default: $eyeo-black; | 
|  47 $font-color-link: $abb-blue; |  43 $font-color-link: $abb-blue; | 
|  48  |  44  | 
|  49 // Font sizes (headings) |  45 // Font sizes (headings) | 
|  50  |  46  | 
|  51 $font-size-h1: 3em; |  47 $font-size-h1: 3em; | 
|  52 $font-size-h2: 2em; |  48 $font-size-h2: 2em; | 
|  53 $font-size-h3: 1.4em; |  49 $font-size-h3: 1.4em; | 
|  54 $font-size-h4: 1em; |  50 $font-size-h4: 1em; | 
|  55 $font-size-h5: $font-size-h4; |  51 $font-size-h5: $font-size-h4; | 
|  56 $font-size-h6: $font-size-h4; |  52 $font-size-h6: $font-size-h4; | 
|  57  |  53  | 
|  58 // Font weights |  54 // Font weights | 
|  59  |  55  | 
|  60 $bold-weight: 700; |  56 $bold-weight: 700; | 
|  61  |  57  | 
|  62 // Sizes /////////////////////////////////////////////////////////////////////// |  58 // Sizes /////////////////////////////////////////////////////////////////////// | 
|  63  |  59  | 
|  64 // Spacers ///////////////////////////////////////////////////////////////////// |  60 // Spacers ///////////////////////////////////////////////////////////////////// | 
|  65  |  61  | 
|  66 // Columns ///////////////////////////////////////////////////////////////////// |  62 // Columns ///////////////////////////////////////////////////////////////////// | 
|  67  |  63  | 
|  68 // Breakpoints ///////////////////////////////////////////////////////////////// |  64 // Breakpoints ///////////////////////////////////////////////////////////////// | 
|  69  |  65  | 
|  70 // Placeholders //////////////////////////////////////////////////////////////// |  66 // Placeholders //////////////////////////////////////////////////////////////// | 
| LEFT | RIGHT |