/* * App DARK theme CSS * ---------------------------------------------------------------------------- * Ionic Variables and Theming. For more info, please see: * http://ionicframework.com/docs/theming/ */ :root body.dark { --ion-background-color: #1e1e1e; --ion-background-color-rgb: 18,18,18; --ion-text-color: #ffffff; --ion-text-color-rgb: 255,255,255; --ion-border-color: #3f3f3f; --ion-color-step-50: #1e1e1e; --ion-color-step-100: #2a2a2a; --ion-color-step-150: #363636; --ion-color-step-200: #414141; --ion-color-step-250: #4d4d4d; --ion-color-step-300: #595959; --ion-color-step-350: #656565; --ion-color-step-400: #717171; --ion-color-step-450: #7d7d7d; --ion-color-step-500: #898989; --ion-color-step-550: #949494; --ion-color-step-600: #a0a0a0; --ion-color-step-650: #acacac; --ion-color-step-700: #b8b8b8; --ion-color-step-750: #c4c4c4; --ion-color-step-800: #d0d0d0; --ion-color-step-850: #dbdbdb; --ion-color-step-900: #e7e7e7; --ion-color-step-950: #f3f3f3; --light: var(--black); --dark: var(--gray-lighter); --ion-color-light: var(--light); --ion-color-light-rgb: 58,58,58; --ion-color-light-contrast: #ffffff; --ion-color-light-contrast-rgb: 255,255,255; --ion-color-light-shade: #333333; --ion-color-light-tint: #4e4e4e; --ion-color-dark: var(--dark); --ion-color-dark-rgb: 245,245,245; --ion-color-dark-contrast: #000000; --ion-color-dark-contrast-rgb: 0,0,0; --ion-color-dark-shade: #d8d8d8; --ion-color-dark-tint: #f6f6f6; --ion-tab-bar-background: #1f1f1f; --ion-item-background: #1e1e1e; --ion-card-background: #1c1c1d; ion-content { --background: var(--ion-background-color); --background-lighter: var(--gray-darker); --contrast-background: var(--ion-background-color); } --core-tabs-background: var(--custom-tabs-background, #3a3a3a); --core-tab-background: var(--custom-tab-background, #3a3a3a); --core-tab-color: var(--custom-tab-color, var(--white)); --core-tab-border-color: var(--custom-tab-border-color, var(--gray-light)); core-progress-bar { --text-color: var(--custom-progress-text-color, var(--gray-lighter)); } ion-item-divider { --background: var(--black); --color: var(--white); .item-detail-icon { color: var(--white); } } --core-button-select-background: var(--custom-button-select-background, #3a3a3a); --core-login-background: var(--custom-login-background, #3a3a3a); --core-login-text-color: var(--custom-login-text-color, white); }