mirror of
https://github.com/HSLdevcom/digitransit-ui
synced 2026-04-06 00:30:17 +02:00
127 lines
3.4 KiB
SCSS
127 lines
3.4 KiB
SCSS
/* Default theme */
|
|
|
|
/* General palette */
|
|
$white: #fff;
|
|
$light-gray: #ddd;
|
|
$medium-gray: #ccc;
|
|
$gray: #666;
|
|
$dark-gray: #575757;
|
|
$black: #333;
|
|
$gray-blue: #78909c;
|
|
$gray-blue-light: rgb(182, 193, 199);
|
|
|
|
/* Operator palette */
|
|
$livi-blue: #000f94;
|
|
$livi-gold: rgb(233, 171, 0);
|
|
$livi-bus-blue: rgb(0, 136, 206);
|
|
$livi-airplane-blue: #1a4a8f;
|
|
$livi-ferry-blue: #247c7b;
|
|
$livi-rail-purple: rgb(175, 141, 188);
|
|
$livi-subway-orange: rgb(237, 140, 0);
|
|
$livi-tram-green: rgb(106, 137, 37);
|
|
$livi-funicular-pink: #f0f;
|
|
|
|
/* Application palette */
|
|
$background-color: #fff;
|
|
$background-color-darker: #e0e5e8;
|
|
$background-color-lighter: #f4f4f5;
|
|
$primary-color: $livi-blue;
|
|
$primary-font-color: $white;
|
|
$secondary-color: #008bde;
|
|
$secondary-font-color: $white;
|
|
$favourite-color: $livi-gold;
|
|
$hilight-color: $livi-blue;
|
|
$action-color: $secondary-color;
|
|
$cancelation-red: #dc0451;
|
|
$cancelation-black: #666;
|
|
$cancelation-background: #fbe0ea;
|
|
$disruption-color: $cancelation-red;
|
|
$banner-disruption-color: $disruption-color;
|
|
$realtime-color: #46850e;
|
|
$visited-link-color: #8c4799;
|
|
$current-location-color: $primary-color;
|
|
$desktop-title-color: $primary-color;
|
|
$desktop-title-arrow-icon-color: $secondary-color;
|
|
$infobox-color-generic-blue: #e5f2fa;
|
|
$info-icon-blue: #0074be;
|
|
|
|
/* Component palette */
|
|
$title-color: $white;
|
|
$standalone-btn-color: $action-color;
|
|
$standalone-btn-hover-color: $gray-blue-light;
|
|
$standalone-btn-active-color: $gray-blue-light;
|
|
$viewpoint-marker-color: $livi-blue;
|
|
$link-color: $primary-color;
|
|
$from-color: #4ea700;
|
|
$to-color: #ec5188;
|
|
$slider-severe-color: #ca4000;
|
|
$slider-warning-color: #fbb800;
|
|
$slider-ok-color: #4ea700;
|
|
$selected-lang-background: rgba(0, 0, 0, 0.15);
|
|
$caution-icon-color: $white;
|
|
$caution-icon-font-color: none;
|
|
$top-bar-color: $primary-color;
|
|
$nav-content-color: false;
|
|
|
|
/* Vehicle palette */
|
|
$airplane-color: $livi-airplane-blue;
|
|
$bus-color: $livi-bus-blue;
|
|
$bus-express-color: $livi-bus-blue;
|
|
$speedtram-color: $livi-tram-green;
|
|
$tram-color: $livi-tram-green;
|
|
$metro-color: $livi-subway-orange;
|
|
$rail-color: $livi-rail-purple;
|
|
$ferry-color: $livi-ferry-blue;
|
|
$funicular-color: $livi-funicular-pink;
|
|
$citybike-color: #f2b62d;
|
|
$citybike-off-color: #919191;
|
|
$walk-color: #666;
|
|
$wait-color: #979797;
|
|
$bicycle-color: #666;
|
|
$car-color: #333;
|
|
$scooter-color: #bababa;
|
|
$call-agency-color: #666;
|
|
|
|
/* Fonts */
|
|
$font-family: 'Roboto', arial, georgia, serif;
|
|
$heading-font-family: $font-family;
|
|
$button-font-family: $font-family;
|
|
$font-weight-book: 400;
|
|
$font-weight-medium: 700;
|
|
$font-weight-map-container: $font-weight-book;
|
|
$letter-spacing: 0;
|
|
$letter-spacing-front-page: -0.67px;
|
|
$font-family-narrow: 'Roboto Condensed', 'Arial Condensed', arial, georgia,
|
|
serif;
|
|
$font-narrow-weight-book: 400;
|
|
$font-narrow-weight-medium: 700;
|
|
$narrow-letter-spacing: 0;
|
|
$line-height-normal: 1.2;
|
|
$font-size-xxxxsmall: 0.62rem;
|
|
$font-size-xxxsmall: 0.72rem;
|
|
$font-size-xxsmall: 0.8rem;
|
|
$font-size-xsmall: 0.87rem;
|
|
$font-size-small: 0.92rem;
|
|
$font-size-normal: 1rem;
|
|
$font-size-medium-large: 1.15rem;
|
|
$font-size-large: 1.25rem;
|
|
$font-size-xlarge: 1.5rem;
|
|
$disruption-message-font-weight: 200;
|
|
$itinerary-co2-font-weight: 325;
|
|
|
|
/* Paddings */
|
|
$padding-xxsmall: 0.125em;
|
|
$padding-xsmall: 0.25em;
|
|
$padding-small: 0.4em;
|
|
$padding-medium: 0.7em;
|
|
$padding-large: 1.5em;
|
|
$padding-xlarge: 2em;
|
|
|
|
/* Borders */
|
|
$border-radius-small: 2px;
|
|
$border-radius: 3px;
|
|
$border-radius-bigger: 8px;
|
|
$spinner-image: url('../default/default-spinner.png');
|
|
|
|
/* Navbar dimensions */
|
|
$nav-logo-height: 100%;
|