mirror of
https://github.com/HSLdevcom/digitransit-ui
synced 2025-07-06 09:30:37 +02:00
158 lines
4.3 KiB
SCSS
158 lines
4.3 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: #f2f5f7;
|
|
$selector-background-color: #f4f4f4;
|
|
$button-hover-color: #f4f4f4;
|
|
$primary-color: $livi-blue;
|
|
$primary-font-color: $white;
|
|
$secondary-color: #008bde;
|
|
$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: #3b7f00;
|
|
$current-location-color: $primary-color;
|
|
$desktop-title-color: $primary-color;
|
|
$desktop-title-arrow-icon-color: $secondary-color;
|
|
$infobox-color-generic-blue: #ebf6fd;
|
|
$infobox-border-color: $infobox-color-generic-blue;
|
|
$info-icon-blue: #0074be;
|
|
$info-background-color: #e5f1f9;
|
|
$success-color: #f1f8eb;
|
|
|
|
/* 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;
|
|
$disclaimer-background-color: rgba(254, 209, 0, 0.1);
|
|
$disclaimer-border-color: #fed100;
|
|
$navigation-background-color: $background-color-lighter;
|
|
|
|
/* 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: #000;
|
|
$wait-color: #979797;
|
|
$bicycle-color: #666;
|
|
$car-color: #333;
|
|
$call-agency-color: #666;
|
|
$external-feed-color: #647693;
|
|
$external-feed-map-color: #647693;
|
|
$scooter-color: $external-feed-color;
|
|
$scooter-map-color: $external-feed-map-color;
|
|
$walk-inside-color: #666;
|
|
$replacement-bus-color: #dc0451;
|
|
|
|
/* 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;
|
|
$font-weight-disclaimer: $font-weight-medium;
|
|
$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;
|
|
$itinerary-co2-badge-font-weight: 500;
|
|
$id-font-family: $font-family;
|
|
$id-font-size: $font-size-normal;
|
|
$id-font-weight: normal;
|
|
|
|
/* 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;
|
|
$border-radius-disclaimer: $border-radius;
|
|
$spinner-image: url('../default/default-spinner.png');
|
|
|
|
/* Navbar dimensions */
|
|
$nav-logo-height: 100%;
|
|
$nav-logo-min-height: 40px;
|
|
|
|
/* Navigator */
|
|
$navigation-icon-size: 40px;
|
|
$slide-up-down-animation: 0.8s cubic-bezier(0.47, 0, 0.23, 1.38) forwards;
|
|
$slide-up-down-fade: 0.8s ease-out forwards;
|
|
|
|
.theme-default {
|
|
display: block;
|
|
}
|
|
|
|
.theme-matka {
|
|
display: none;
|
|
}
|