Skip to content

Commit

Permalink
feat(theme): export light theme tokens (#28802)
Browse files Browse the repository at this point in the history
Issue number: Internal

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->
The light theme tokens are included in the starter apps but not in Ionic
Framework itself.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- The light mode tokens are bundled with Ionic Framework. This allows
developers to always have the light mode accessible to them including
the tokens.

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!--
  If this introduces a breaking change:
1. Describe the impact and migration path for existing applications
below.
  2. Update the BREAKING.md file with the breaking change.
3. Add "BREAKING CHANGE: [...]" to the commit description when merging.
See
https://github.com/ionic-team/ionic-framework/blob/main/.github/CONTRIBUTING.md#footer
for more information.
-->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

---------

Co-authored-by: ionitron <[email protected]>
  • Loading branch information
mapsandapps and Ionitron authored Jan 10, 2024
1 parent 749df5b commit e1f9850
Showing 1 changed file with 74 additions and 0 deletions.
74 changes: 74 additions & 0 deletions core/src/css/core.scss
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,80 @@
@import "../components/menu/menu.ios.vars";
@import "../components/menu/menu.md.vars";

:root {
/** primary **/
--ion-color-primary: #0054e9;
--ion-color-primary-rgb: 0, 84, 233;
--ion-color-primary-contrast: #ffffff;
--ion-color-primary-contrast-rgb: 255, 255, 255;
--ion-color-primary-shade: #004acd;
--ion-color-primary-tint: #1a65eb;

/** secondary **/
--ion-color-secondary: #0163aa;
--ion-color-secondary-rgb: 1, 99, 170;
--ion-color-secondary-contrast: #ffffff;
--ion-color-secondary-contrast-rgb: 255, 255, 255;
--ion-color-secondary-shade: #015796;
--ion-color-secondary-tint: #1a73b3;

/** tertiary **/
--ion-color-tertiary: #6030ff;
--ion-color-tertiary-rgb: 96, 48, 255;
--ion-color-tertiary-contrast: #ffffff;
--ion-color-tertiary-contrast-rgb: 255, 255, 255;
--ion-color-tertiary-shade: #542ae0;
--ion-color-tertiary-tint: #7045ff;

/** success **/
--ion-color-success: #2dd55b;
--ion-color-success-rgb: 45, 213, 91;
--ion-color-success-contrast: #000000;
--ion-color-success-contrast-rgb: 0, 0, 0;
--ion-color-success-shade: #28bb50;
--ion-color-success-tint: #42d96b;

/** warning **/
--ion-color-warning: #ffc409;
--ion-color-warning-rgb: 255, 196, 9;
--ion-color-warning-contrast: #000000;
--ion-color-warning-contrast-rgb: 0, 0, 0;
--ion-color-warning-shade: #e0ac08;
--ion-color-warning-tint: #ffca22;

/** danger **/
--ion-color-danger: #c5000f;
--ion-color-danger-rgb: 197, 0, 15;
--ion-color-danger-contrast: #ffffff;
--ion-color-danger-contrast-rgb: 255, 255, 255;
--ion-color-danger-shade: #ad000d;
--ion-color-danger-tint: #cb1a27;

/** dark **/
--ion-color-dark: #2f2f2f;
--ion-color-dark-rgb: 47, 47, 47;
--ion-color-dark-contrast: #ffffff;
--ion-color-dark-contrast-rgb: 255, 255, 255;
--ion-color-dark-shade: #292929;
--ion-color-dark-tint: #444444;

/** medium **/
--ion-color-medium: #5f5f5f;
--ion-color-medium-rgb: 95, 95, 95;
--ion-color-medium-contrast: #ffffff;
--ion-color-medium-contrast-rgb: 255, 255, 255;
--ion-color-medium-shade: #545454;
--ion-color-medium-tint: #6f6f6f;

/** light **/
--ion-color-light: #f6f8fc;
--ion-color-light-rgb: 246, 248, 252;
--ion-color-light-contrast: #000000;
--ion-color-light-contrast-rgb: 0, 0, 0;
--ion-color-light-shade: #d8dade;
--ion-color-light-tint: #f7f9fc;
}

// Ionic Font Family
// --------------------------------------------------

Expand Down

0 comments on commit e1f9850

Please sign in to comment.