Skip to content

Commit

Permalink
perf(cta): match cta tokens with auro-button tokens #213
Browse files Browse the repository at this point in the history
  • Loading branch information
@jordanjones243
jordanjones243 committed Nov 6, 2024
1 parent d32a8df commit 217c20f
Show file tree
Hide file tree
Showing 4 changed files with 130 additions and 130 deletions.
94 changes: 47 additions & 47 deletions demo/api.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -594,61 +594,61 @@ The component may be restyled using the following code sample and changing the v
--ds-auro-hyperlink-nav-hover-outline-color-inverse: transparent;
--ds-auro-hyperlink-nav-hover-border-color-inverse: transparent;
--ds-auro-hyperlink-cta-default-color-default: var(--ds-color-text-primary-inverse, #ffffff);
--ds-auro-hyperlink-cta-default-container-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-default-outline-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-default-border-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-default-container-color-default: var(--ds-color-container-ui-primary-default-default, #2c67b5);
--ds-auro-hyperlink-cta-default-outline-color-default: var(--ds-color-container-ui-primary-default-default, #2c67b5);
--ds-auro-hyperlink-cta-default-border-color-default: var(--ds-color-container-ui-primary-default-default, #2c67b5);
--ds-auro-hyperlink-cta-visited-color-default: var(--ds-color-text-primary-inverse, #ffffff);
--ds-auro-hyperlink-cta-visited-container-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-visited-outline-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-visited-border-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-visited-container-color-default: var(--ds-color-container-ui-primary-default-default, #2c67b5);
--ds-auro-hyperlink-cta-visited-outline-color-default: var(--ds-color-container-ui-primary-default-default, #2c67b5);
--ds-auro-hyperlink-cta-visited-border-color-default: var(--ds-color-container-ui-primary-default-default, #2c67b5);
--ds-auro-hyperlink-cta-focus-color-default: var(--ds-color-text-primary-inverse, #ffffff);
--ds-auro-hyperlink-cta-focus-container-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-focus-outline-color-default: var(--ds-color-container-ui-secondary-default-default, #ffffff);
--ds-auro-hyperlink-cta-focus-border-color-default: var(--ds-color-border-ui-focus-default, #2c67b5);
--ds-auro-hyperlink-cta-focus-container-color-default: var(--ds-color-container-ui-primary-default-default, #2c67b5);
--ds-auro-hyperlink-cta-focus-outline-color-default: var(--ds-color-border-emphasis-inverse, #f2f7fb);
--ds-auro-hyperlink-cta-focus-border-color-default: var(--ds-color-container-ui-primary-default-default, #2c67b5);
--ds-auro-hyperlink-cta-hover-color-default: var(--ds-color-text-primary-inverse, #ffffff);
--ds-auro-hyperlink-cta-hover-container-color-default: var(--ds-color-container-ui-primary-hover-default, #193d73);
--ds-auro-hyperlink-cta-hover-outline-color-default: var(--ds-color-border-ui-hover-default, #193d73);
--ds-auro-hyperlink-cta-hover-border-color-default: var(--ds-color-border-ui-hover-default, #193d73);
--ds-auro-hyperlink-cta-hover-outline-color-default: var(--ds-color-container-ui-primary-hover-default, #193d73);
--ds-auro-hyperlink-cta-hover-border-color-default: var(--ds-color-container-ui-primary-hover-default, #193d73);
--ds-auro-hyperlink-cta-default-color-inverse: var(--ds-color-text-primary-default, #2a2a2a);
--ds-auro-hyperlink-cta-default-container-color-inverse: var(--ds-color-ui-default-inverse, #00cff0);
--ds-auro-hyperlink-cta-default-outline-color-inverse: var(--ds-color-ui-default-inverse, #00cff0);
--ds-auro-hyperlink-cta-default-border-color-inverse: var(--ds-color-ui-default-inverse, #00cff0);
--ds-auro-hyperlink-cta-default-container-color-inverse: var(--ds-color-container-ui-primary-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-default-outline-color-inverse: var(--ds-color-container-ui-primary-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-default-border-color-inverse: var(--ds-color-container-ui-primary-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-visited-color-inverse: var(--ds-color-text-primary-default, #2a2a2a);
--ds-auro-hyperlink-cta-visited-container-color-inverse: var(--ds-color-ui-default-inverse, #00cff0);
--ds-auro-hyperlink-cta-visited-outline-color-inverse: var(--ds-color-ui-default-inverse, #00cff0);
--ds-auro-hyperlink-cta-visited-border-color-inverse: var(--ds-color-ui-default-inverse, #00cff0);
--ds-auro-hyperlink-cta-visited-container-color-inverse: var(--ds-color-container-ui-primary-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-visited-outline-color-inverse: var(--ds-color-container-ui-primary-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-visited-border-color-inverse: var(--ds-color-container-ui-primary-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-focus-color-inverse: var(--ds-color-text-primary-default, #2a2a2a);
--ds-auro-hyperlink-cta-focus-container-color-inverse: var(--ds-color-ui-default-inverse, #00cff0);
--ds-auro-hyperlink-cta-focus-outline-color-inverse: var(--ds-color-container-ui-secondary-default-default, #ffffff);
--ds-auro-hyperlink-cta-focus-border-color-inverse: var(--ds-color-border-ui-focus-inverse, #56bbde);
--ds-auro-hyperlink-cta-focus-container-color-inverse: var(--ds-color-container-ui-primary-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-focus-outline-color-inverse: var(--ds-color-border-emphasis-inverse, #f2f7fb);
--ds-auro-hyperlink-cta-focus-border-color-inverse: var(--ds-color-container-ui-primary-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-hover-color-inverse: var(--ds-color-text-primary-default, #2a2a2a);
--ds-auro-hyperlink-cta-hover-container-color-inverse: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);
--ds-auro-hyperlink-cta-hover-outline-color-inverse: var(--ds-color-border-ui-hover-inverse, #a8e9f7);
--ds-auro-hyperlink-cta-hover-border-color-inverse: var(--ds-color-border-ui-hover-inverse, #a8e9f7);
--ds-auro-hyperlink-cta-secondary-default-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-secondary-default-container-color-default: var(--ds-color-background-lightest, #ffffff);
--ds-auro-hyperlink-cta-secondary-default-outline-color-default: var(--ds-color-text-link-default, #0074c8);
--ds-auro-hyperlink-cta-secondary-default-border-color-default: var(--ds-color-text-link-default, #0074c8);
--ds-auro-hyperlink-cta-secondary-visited-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-secondary-visited-container-color-default: var(--ds-color-background-lightest, #ffffff);
--ds-auro-hyperlink-cta-secondary-visited-outline-color-default: var(--ds-color-text-link-default, #0074c8);
--ds-auro-hyperlink-cta-secondary-visited-border-color-default: var(--ds-color-text-link-default, #0074c8);
--ds-auro-hyperlink-cta-secondary-focus-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-secondary-focus-container-color-default: var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));
--ds-auro-hyperlink-cta-hover-outline-color-inverse: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);
--ds-auro-hyperlink-cta-hover-border-color-inverse: var(--ds-color-container-ui-primary-hover-inverse, #a8e9f7);
--ds-auro-hyperlink-cta-secondary-default-color-default: var(--ds-color-text-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-default-container-color-default: var(--ds-color-container-ui-secondary-default-default, #ffffff);
--ds-auro-hyperlink-cta-secondary-default-outline-color-default: var(--ds-color-border-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-default-border-color-default: var(--ds-color-border-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-visited-color-default: var(--ds-color-text-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-visited-container-color-default: var(--ds-color-container-ui-secondary-default-default, #ffffff);
--ds-auro-hyperlink-cta-secondary-visited-outline-color-default: var(--ds-color-border-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-visited-border-color-default: var(--ds-color-border-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-focus-color-default: var(--ds-color-text-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-focus-container-color-default: var(--ds-color-container-ui-secondary-default-default, #ffffff);
--ds-auro-hyperlink-cta-secondary-focus-outline-color-default: var(--ds-color-border-ui-focus-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-focus-border-color-default: var(--ds-color-border-ui-focus-default, #2c67b5);
--ds-auro-hyperlink-cta-secondary-hover-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-secondary-hover-container-color-default: var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));
--ds-auro-hyperlink-cta-secondary-hover-color-default: var(--ds-color-text-ui-hover-default, #193d73);
--ds-auro-hyperlink-cta-secondary-hover-container-color-default: var(--ds-color-container-ui-secondary-hover-default, rgba(0, 0, 0, 0.03));
--ds-auro-hyperlink-cta-secondary-hover-outline-color-default: var(--ds-color-border-ui-hover-default, #193d73);
--ds-auro-hyperlink-cta-secondary-hover-border-color-default: var(--ds-color-border-ui-hover-default, #193d73);
--ds-auro-hyperlink-cta-secondary-default-color-inverse: var(--ds-color-text-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-default-container-color-inverse: var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));
--ds-auro-hyperlink-cta-secondary-default-outline-color-inverse: var(--ds-color-border-ui-focus-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-default-border-color-inverse: var(--ds-color-border-ui-focus-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-default-outline-color-inverse: var(--ds-color-border-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-default-border-color-inverse: var(--ds-color-border-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-visited-color-inverse: var(--ds-color-text-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-visited-container-color-inverse: var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));
--ds-auro-hyperlink-cta-secondary-visited-outline-color-inverse: var(--ds-color-border-ui-focus-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-visited-border-color-inverse: var(--ds-color-border-ui-focus-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-visited-outline-color-inverse: var(--ds-color-border-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-visited-border-color-inverse: var(--ds-color-border-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-focus-color-inverse: var(--ds-color-text-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-secondary-focus-container-color-inverse: var(--ds-color-container-ui-secondary-default-inverse, rgba(255, 255, 255, 0.03));
--ds-auro-hyperlink-cta-secondary-focus-outline-color-inverse: var(--ds-color-border-ui-focus-inverse, #56bbde);
Expand All @@ -657,19 +657,19 @@ The component may be restyled using the following code sample and changing the v
--ds-auro-hyperlink-cta-secondary-hover-container-color-inverse: var(--ds-color-container-ui-secondary-hover-inverse, rgba(255, 255, 255, 0.12));
--ds-auro-hyperlink-cta-secondary-hover-outline-color-inverse: var(--ds-color-border-ui-hover-inverse, #a8e9f7);
--ds-auro-hyperlink-cta-secondary-hover-border-color-inverse: var(--ds-color-border-ui-hover-inverse, #a8e9f7);
--ds-auro-hyperlink-cta-tertiary-default-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-tertiary-default-container-color-default: var(--ds-color-container-tertiary-default, rgba(0, 0, 0, 0.03));
--ds-auro-hyperlink-cta-tertiary-default-color-default: var(--ds-color-text-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-tertiary-default-container-color-default: var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));
--ds-auro-hyperlink-cta-tertiary-default-outline-color-default: transparent;
--ds-auro-hyperlink-cta-tertiary-default-border-color-default: transparent;
--ds-auro-hyperlink-cta-tertiary-visited-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-tertiary-visited-container-color-default: var(--ds-color-container-tertiary-default, rgba(0, 0, 0, 0.03));
--ds-auro-hyperlink-cta-tertiary-visited-color-default: var(--ds-color-text-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-tertiary-visited-container-color-default: var(--ds-color-container-ui-tertiary-default-default, rgba(0, 0, 0, 0.03));
--ds-auro-hyperlink-cta-tertiary-visited-outline-color-default: transparent;
--ds-auro-hyperlink-cta-tertiary-visited-border-color-default: transparent;
--ds-auro-hyperlink-cta-tertiary-focus-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-tertiary-focus-container-color-default: var(--ds-color-container-tertiary-default, rgba(0, 0, 0, 0.03));
--ds-auro-hyperlink-cta-tertiary-focus-outline-color-default: var(--ds-color-border-ui-focus-default, #2c67b5);
--ds-auro-hyperlink-cta-tertiary-focus-border-color-default: transparent;
--ds-auro-hyperlink-cta-tertiary-hover-color-default: var(--ds-color-ui-default-default, #0074c8);
--ds-auro-hyperlink-cta-tertiary-focus-outline-color-default: var(--ds-color-border-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-tertiary-focus-border-color-default: var(--ds-color-border-ui-default-default, #2c67b5);
--ds-auro-hyperlink-cta-tertiary-hover-color-default: var(--ds-color-text-ui-hover-default, #193d73);
--ds-auro-hyperlink-cta-tertiary-hover-container-color-default: var(--ds-color-container-ui-tertiary-hover-default, rgba(0, 0, 0, 0.12));
--ds-auro-hyperlink-cta-tertiary-hover-outline-color-default: transparent;
--ds-auro-hyperlink-cta-tertiary-hover-border-color-default: transparent;
Expand All @@ -683,8 +683,8 @@ The component may be restyled using the following code sample and changing the v
--ds-auro-hyperlink-cta-tertiary-visited-border-color-inverse: transparent;
--ds-auro-hyperlink-cta-tertiary-focus-color-inverse: var(--ds-color-text-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-tertiary-focus-container-color-inverse: var(--ds-color-container-ui-secondary-focus-inverse, rgba(255, 255, 255, 0.03));
--ds-auro-hyperlink-cta-tertiary-focus-outline-color-inverse: var(--ds-color-border-ui-focus-inverse, #56bbde);
--ds-auro-hyperlink-cta-tertiary-focus-border-color-inverse: transparent;
--ds-auro-hyperlink-cta-tertiary-focus-outline-color-inverse: var(--ds-color-border-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-tertiary-focus-border-color-inverse: var(--ds-color-border-ui-default-inverse, #56bbde);
--ds-auro-hyperlink-cta-tertiary-hover-color-inverse: var(--ds-color-text-ui-hover-inverse, #a8e9f7);
--ds-auro-hyperlink-cta-tertiary-hover-container-color-inverse: var(--ds-color-container-ui-tertiary-hover-inverse, rgba(255, 255, 255, 0.25));
--ds-auro-hyperlink-cta-tertiary-hover-outline-color-inverse: transparent;
Expand Down
Loading

0 comments on commit 217c20f

Please sign in to comment.