igniteui-webcomponents icon indicating copy to clipboard operation
igniteui-webcomponents copied to clipboard

feat(dropdown): update indigo styles

Open SisIvanova opened this issue 1 year ago • 2 comments

Related to https://github.com/IgniteUI/igniteui-theming/issues/234

SisIvanova avatar May 02 '24 08:05 SisIvanova

  • Shadow should be ig-elevation-2 in the dark theme. Screenshot 2024-05-07 at 16 40 02

didimmova avatar May 07 '24 13:05 didimmova

I think the outline of the active item should have outline-offset like in the angular PR

didimmova avatar May 07 '24 14:05 didimmova

@SisIvanova i couldnt run these either.... image

andiesm813 avatar May 17 '24 23:05 andiesm813

I think the outline of the active item should have outline-offset like in the angular PR

When you say "active" i assume it's focused.... if so, and if what you mean about the offset is that it's outlined center or outside the element, we actually have inside border.

image

andiesm813 avatar May 17 '24 23:05 andiesm813

  • (same comment from Angular) paddings are 3px, but the border should be placed inside (in the kit, the space between the border and the active/hover background is 2px, not sure how you are going to implement it, but we can discuss it if you want

AnjiManova avatar May 20 '24 11:05 AnjiManova

The overline style is wrong. A merged PR with the overline style is available, but the change is not visible in this PR.

AnjiManova avatar May 20 '24 11:05 AnjiManova

  • there are additional gaps in the item that should be removed image

AnjiManova avatar May 20 '24 11:05 AnjiManova

  • the prefix has an additional 16px margin that I believe should be removed image

AnjiManova avatar May 20 '24 12:05 AnjiManova

  • after selecting an item and reopening the dropdown, the item stays focused image

AnjiManova avatar May 20 '24 12:05 AnjiManova

The code is not from WebC but there is the same issue so I duplicate the comment from Angular image

AnjiManova avatar May 20 '24 13:05 AnjiManova

  • the border radius should be fixed or something not sure what is the problem here image

AnjiManova avatar May 20 '24 13:05 AnjiManova

  • the border radius should be fixed or something not sure what is the problem here
image

This issue is not related to the Indigo design updates and will be fixed in a separate PR.

SisIvanova avatar May 27 '24 08:05 SisIvanova

The overline style is wrong. A merged PR with the overline style is available, but the change is not visible in this PR.

I believe the font styles are correct.

Screenshot 2024-05-27 at 11 40 10 AM

SisIvanova avatar May 27 '24 08:05 SisIvanova

I think we are ready with the verification. @andiesm813 do you have something to add because I want to change the label to design:verified

sdimchevski avatar May 29 '24 09:05 sdimchevski

@SisIvanova i couldnt run these either.... image

I am still not able to run this branch (since 2 weeks ago)..... @SisIvanova i cannot verify or add anything else. Anji reviewed this thoroughly and i'm sure she didnt miss anything. So we can mark it as verified if you want @sdimchevski

andiesm813 avatar May 30 '24 14:05 andiesm813

I am still not able to run this branch (since 2 weeks ago)..... @SisIvanova i cannot verify or add anything else. Anji reviewed this thoroughly and i'm sure she didnt miss anything. So we can mark it as verified if you want @sdimchevski

You couldn't run the samples because of the theming package version. Simeon created a new PR including the Indigo design changes for the dropdown, progress, and list components. You should be able to test it without any difficulty.

SisIvanova avatar May 30 '24 15:05 SisIvanova

@SisIvanova yes! Didi told me as well! i was able to test it now! The only thing i see weird is the Web Components version, it has like a white background color and then inside the actual dropdown appears, with the rounded corners.... In Angular it looks ok.

image

These corners i mean

image

andiesm813 avatar May 30 '24 15:05 andiesm813

@SisIvanova yes! Didi told me as well! i was able to test it now! The only thing i see weird is the Web Components version, it has like a white background color and then inside the actual dropdown appears, with the rounded corners.... In Angular it looks ok.

image

These corners i mean

image

This problem is reproducible in all themes and will be fixed in a separate PR. I will log a new issue.

SisIvanova avatar May 30 '24 15:05 SisIvanova