src/theme/variables.scss
// Ionic Variables and Theming. For more info, please see:
// http://ionicframework.com/docs/theming/
// Font path is used to include ionicons,
// roboto, and noto sans fonts
$font-path: '../assets/fonts';
// The app direction is used to include
// rtl styles in your app. For more info, please see:
// http://ionicframework.com/docs/theming/rtl-support/
$app-direction: ltr;
@import 'ionic.globals';
// Shared Variables
// --------------------------------------------------
// To customize the look and feel of this app, you can override
// the Sass variables found in Ionic's source scss files.
// To view all the possible Ionic variables, see:
// http://ionicframework.com/docs/theming/overriding-ionic-variables/
// Named Color Variables
// --------------------------------------------------
// Named colors makes it easy to reuse colors on various components.
// It's highly recommended to change the default colors
// to match your app's branding. Ionic uses a Sass map of
// colors so you can add, rename and remove colors as needed.
// The "primary" color is the only required color in the map.
$error-color: rgba(209, 71, 71, .9);
$colors: (
primary: #480a0f,
secondary: #135a76,
danger: #f53d3d,
light: #f4f4f4,
dark: #222,
foggy-gray: #ceccbf,
westar: #e6e4de,
carrara: #f2f1ee,
pampas: #f2f0ed,
verylight: #fff,
error: $error-color,
sea-green: #2e8b57,
red-crimson: #dc143c
);
// App iOS Variables
// --------------------------------------------------
// iOS only Sass variables can go here
// App Material Design Variables
// --------------------------------------------------
// Material Design only Sass variables can go here
// App Windows Variables
// --------------------------------------------------
// Windows only Sass variables can go here
// App Theme
// --------------------------------------------------
// Ionic apps can have different themes applied, which can
// then be future customized. This import comes last
// so that the above variables are used and Ionic's
// default are overridden.
@import 'ionic.theme.default';
// Ionicons
// --------------------------------------------------
// The premium icon font for Ionic. For more info, please see:
// http://ionicframework.com/docs/ionicons/
@import 'ionic.ionicons';
// Fonts
// --------------------------------------------------
@import 'roboto';
@import 'noto-sans';
// Custom variables
// --------------------------------------------------
@import 'font-lato';
$font-family-base: 'Lato', $font-family-base;
$speed-vinyl: 4s;
$speed-cover: 6s;
$color-shadow-meta-info: rgba(206, 204, 191, .5);
$color-shadow-btn-play-pause: rgba(0, 0, 0, .5);
$color-thumbnail-border: #c8c7cc;