Skip to content

Conversation

@SisIvanova
Copy link
Collaborator

@SisIvanova SisIvanova commented Sep 18, 2024

Related to IgniteUI/igniteui-theming/issues/327

Hand-off: https://www.figma.com/design/rIwpaKXD3IgFtOohUV9Zi4/Tabs-in-Indigo-Handoff?node-id=1-4844&node-type=frame&t=tpZ8mIYbO20WBYY6-0

Additional information (check all that apply):

  • Bug fix
  • New functionality
  • Documentation
  • Demos
  • CI/CD

Checklist:

  • All relevant tags have been applied to this PR
  • This PR includes unit tests covering all the new code (test guidelines)
  • This PR includes API docs for newly added methods/properties (api docs guidelines)
  • This PR includes feature/README.MD updates for the feature docs
  • This PR includes general feature table updates in the root README.MD
  • This PR includes CHANGELOG.MD updates for newly added functionality
  • This PR contains breaking changes
  • This PR includes ng update migrations for the breaking changes (migrations guidelines)
  • This PR includes behavioral changes and the feature specification has been updated with them

@SisIvanova SisIvanova marked this pull request as ready for review September 24, 2024 12:12
@andiesm813
Copy link

@SisIvanova i'm sure i must have something different, because i see some of the css properties incorrect, and i know we discussed some of the colors, so maybe there's something wrong on my end.....

Regardless, i will list the css variables that are expected:

Light Theme

--item-text-color: --ig-gray-800
--item-hover-background: --ig-gray-900 5%
--item-disabled-color: --ig-gray-900 20%

--item-icon-color: --ig-gray-600
--item-active-icon-color: --ig-gray-700
--item-hover-icon-color: --ig-gray-700
--item-disabled-icon-color: --ig-gray-900 20%

--button-color: --ig-gray-600
--button-hover-background: --ig-gray-900 5%
--button-hover-color: --ig-gray-700
--button-disabled-color: --ig-gray-900 20%

--tab-ripple-color: transparent
--button-ripple-color: transparent

--border-color: --ig-gray-900 15%
--border-color--hover: transparent
--border-radius: 0

Dark Theme

--item-text-color: white 80%
--item-hover-background: white 10%
--item-disabled-color: white 20%

--item-icon-color: white 60%
--item-active-icon-color: white 80%
--item-hover-icon-color: white 80%
--item-disabled-icon-color: white 20%

--button-color: white 80%
--button-hover-background: white 10%
--button-hover-color: white
--button-disabled-color: white 20%

--tab-ripple-color: transparent
--button-ripple-color: transparent

--border-color: white 15%
--border-color--hover: transparent
--border-radius: 0

@simeonoff simeonoff changed the base branch from master to simeonoff/indigo-themes September 26, 2024 11:14
@simeonoff simeonoff merged commit b525515 into simeonoff/indigo-themes Sep 26, 2024
@simeonoff simeonoff deleted the sivanova/indigo-tabs branch September 26, 2024 11:14
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Indigo: Update Tab Theme

6 participants