site/_src/_assets/styles/bigchain/_variables.scss

//
// Variables
// ---
// bigchain.io
//

//
// Colors
//
//$brand-main-blue:         #003C69 !default;
$brand-main-blue:         #275B82 !default;
$brand-main-blue-dark:    #101A25 !default;

$brand-main-gray:         #70859B !default;

$brand-main-brown:        #B56D00 !default;
$brand-main-light:        #FFFFFF !default;

$gray-dark:               #373a3c !default;
$gray:                    $brand-main-gray !default;
$gray-light:              #818a91 !default;
$gray-lighter:            #eceeef !default;
$gray-lightest:           #f7f7f9 !default;

$brand-primary:           $brand-main-blue !default;
$brand-success:           #5cb85c !default;
$brand-info:              #5bc0de !default;
$brand-warning:           #f0ad4e !default;
$brand-danger:            #d9534f !default;


//
// Typography
//
$font-family-fira:        'Fira Sans', sans-serif !default;
$font-family-avenir:      'Avenir Next', 'Helvetica Neue', 'Arial', sans-serif !default;
$font-family-monospace:    Menlo, Monaco, Consolas, "Courier New", monospace !default;
$font-family-base:         $font-family-avenir !default;

$font-weight-light:         300 !default;
$font-weight-normal:        400 !default;
$font-weight-bold:          600 !default;
$font-weight-base:          $font-weight-normal !default;

$font-size-root:            18px !default;

$font-size-base:            1rem !default;
$font-size-lg:              1.25rem !default;
$font-size-sm:              0.875rem !default;
$font-size-xs:              0.75rem !default;

$font-size-h1:              3rem !default;
$font-size-h2:              2.5rem !default;
$font-size-h3:              2rem !default;
$font-size-h4:              1.5rem !default;
$font-size-h5:              $font-size-base !default;
$font-size-h6:              0.85rem !default;

$line-height:               1.5 !default;

$headings-font-family:      $font-family-fira !default;
$headings-font-weight:      $font-weight-light !default;
$headings-line-height:      1.2 !default;
$headings-color:            $brand-main-gray !default;


//
// Scaffolding
//
$body-bg:                   #fff !default;
$text-color:                $brand-main-blue-dark !default;

$link-color:                $brand-main-brown !default;
$link-hover-color:          darken($link-color, 15%) !default;


//
// Grid
//
$gutter-space:              2rem !default;


//
// Responsive breakpoints
//
$screen-sm-min:             30em !default;
$screen-md-min:             40.625em !default;
$screen-lg-min:             87.500em !default;

$screen-sm:                 'min-width: #{$screen-sm-min}';
$screen-md:                 'min-width: #{$screen-md-min}';
$screen-lg:                 'min-width: #{$screen-lg-min}';


//
// Components
//
$spacer:                 1rem !default;
$line-height-lg:         (4 / 3) !default;
$line-height-sm:         1.5 !default;

$border-radius:          .15rem !default;
$border-radius-lg:       .2rem !default;
$border-radius-sm:       .1rem !default;

$component-active-color: #fff !default;
$component-active-bg:    $brand-primary !default;


//
// Buttons
//
$btn-padding-x:                  1.5rem !default;
$btn-padding-y:                  .375rem !default;
$btn-font-weight:                $font-weight-normal !default;

$btn-primary-color:              #fff !default;
$btn-primary-bg:                 $brand-primary !default;
$btn-primary-border:             $btn-primary-bg !default;

$btn-secondary-color:            $gray-dark !default;
$btn-secondary-bg:               #fff !default;
$btn-secondary-border:           #fff !default;

$btn-info-color:                 #fff !default;
$btn-info-bg:                    $brand-info !default;
$btn-info-border:                $btn-info-bg !default;

$btn-success-color:              #fff !default;
$btn-success-bg:                 $brand-success !default;
$btn-success-border:             $btn-success-bg !default;

$btn-warning-color:              #fff !default;
$btn-warning-bg:                 $brand-warning !default;
$btn-warning-border:             $btn-warning-bg !default;

$btn-danger-color:               #fff !default;
$btn-danger-bg:                  $brand-danger !default;
$btn-danger-border:              $btn-danger-bg !default;

$btn-link-disabled-color:        $gray-light !default;

$btn-padding-x-sm:               .75rem !default;
$btn-padding-y-sm:               .25rem !default;

$btn-padding-x-lg:               1.25rem !default;
$btn-padding-y-lg:               .75rem !default;

// Allows for customizing button radius independently from global border radius
$btn-border-radius:              $border-radius !default;
$btn-border-radius-lg:           $border-radius-lg !default;
$btn-border-radius-sm:           $border-radius-sm !default;

//
// Forms
//
$input-padding-x:                .5rem !default;
$input-padding-y:                0 !default;

$input-bg:                       rgba(255,255,255,.1) !default;
$input-bg-disabled:              $gray-lighter !default;

$input-color:                    $gray !default;
$input-border-color:             #ccc !default;

$input-border-focus:             #66afe9 !default;
$input-box-shadow-focus:         rgba(102,175,233,.6) !default;

$input-color-placeholder:        #999 !default;

$input-font:                     $font-family-avenir !default;
$input-font-weight:              $font-weight-normal !default;