Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Block Section] Text hierarchy and spacing #6905

Closed
asangma opened this issue May 2, 2023 · 9 comments
Closed

[Block Section] Text hierarchy and spacing #6905

asangma opened this issue May 2, 2023 · 9 comments
Assignees
Labels
4 - verified Issues that have been released and confirmed resolved. design Issues that need design consultation prior to development. enhancement Issues tied to a new feature or request. estimate - design - sm Small design effort; 1-4 days of design work estimate - 2 Small fix or update, may require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - medium Issue is non core or affecting less that 60% of people using the library ready for dev Issues ready for development implementation.

Comments

@asangma
Copy link
Contributor

asangma commented May 2, 2023

Description

BlockSection heading is very similar to Block's heading.
image

Suggest using normal font weight for BlockSection headings.
image

Also, it seems that the padding in the content area of Block doesn't match the inline padding used in most other areas. Right now, it's at 0.625rem whereas most other places 0.75rem is used. Suggest updating to 0.75rem for better alignment.

Screen Shot 2023-05-02 at 2 17 34 PM

@SkyeSeitz would appreciate your feedback.

Acceptance Criteria

Better text hierarchy and padding alignment.

Relevant Info

No response

Which Component

Block and BlockSection

Example Use Case

Using Block and BlockSection together.

Priority impact

p4 - not time sensitive

Esri team

N/A

Final design recommendations

See comment

@asangma asangma added enhancement Issues tied to a new feature or request. 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels May 2, 2023
@github-actions github-actions bot added the impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive label May 2, 2023
@SkyeSeitz
Copy link

I agree, I think better text hierarchy is something we could take a look at 👍🏽

Funnily enough, the Block content section padding in Figma lines up Block text and Block Section text at 0.75rem/12px already. So either Figma missed this change or we have just been slightly misaligned since the Figma component was built- thanks for pointing out, Alan! This fix would also nicely center align Block's expand chevron and Block Section's Switch.

image

@asangma
Copy link
Contributor Author

asangma commented May 5, 2023

Thanks @SkyeSeitz.

@geospatialem This isn't urgent but the UtilityNetwork widget would be much happier if this change gets in soon. :)

@ashetland ashetland added the figma changes Issues that require additions or updates to the Figma UI Kit label May 15, 2023
@geospatialem geospatialem added p - medium Issue is non core or affecting less that 60% of people using the library estimate - 3 A day or two of work, likely requires updates to tests. needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. and removed needs triage Planning workflow - pending design/dev review. labels Jun 6, 2023
@geospatialem geospatialem added this to the 2023 December Priorities milestone Sep 6, 2023
@geospatialem geospatialem removed the needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. label Sep 6, 2023
@geospatialem geospatialem added the design Issues that need design consultation prior to development. label Oct 23, 2023
@geospatialem geospatialem added 1 - assigned Issues that are assigned to a sprint and a team member. and removed 0 - new New issues that need assignment. labels Oct 23, 2023
@brittneytewks brittneytewks added the estimate - design - sm Small design effort; 1-4 days of design work label Nov 6, 2023
@ashetland
Copy link

ashetland commented Nov 9, 2023

Design notes for this issue (Figma file available as well):

Block

  • Update --calcite-block-padding default to 0.75rem

image

Bock Section

  • Update idle font weight to regular
  • Font color should be text.1 while hovering/focused and while open

CleanShot 2024-05-14 at 07 46 14@2x

@ashetland ashetland added the ready for dev Issues ready for development implementation. label Nov 9, 2023
@github-actions github-actions bot added 0 - new New issues that need assignment. needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Nov 9, 2023
@github-actions github-actions bot removed this from the 2023 November Priorities milestone Nov 9, 2023
Copy link
Contributor

github-actions bot commented Nov 9, 2023

cc @geospatialem, @brittneytewks

@brittneytewks brittneytewks removed the figma changes Issues that require additions or updates to the Figma UI Kit label Dec 12, 2023
@geospatialem geospatialem added the estimate - 2 Small fix or update, may require updates to tests. label May 13, 2024
@geospatialem geospatialem changed the title Block and BlockSection text hierarchy and spacing [Block Section] Text hierarchy and spacing May 13, 2024
@geospatialem
Copy link
Member

Opened #9323 to address block, the above has been re-scoped, targeted for June's release to address block-section.

@Elijbet Elijbet added 3 - installed Issues that have been merged to master branch and are ready for final confirmation. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Jun 3, 2024
Copy link
Contributor

github-actions bot commented Jun 3, 2024

Installed and assigned for verification.

@github-actions github-actions bot assigned geospatialem and DitwanP and unassigned Elijbet Jun 3, 2024
@Elijbet Elijbet added 1 - assigned Issues that are assigned to a sprint and a team member. and removed 3 - installed Issues that have been merged to master branch and are ready for final confirmation. labels Jun 3, 2024
@geospatialem geospatialem assigned Elijbet and unassigned geospatialem and DitwanP Jun 6, 2024
@Elijbet Elijbet added 2 - in development Issues that are actively being worked on. and removed 1 - assigned Issues that are assigned to a sprint and a team member. labels Jun 13, 2024
Elijbet added a commit that referenced this issue Jun 14, 2024
**Related Issue:** #6905

## Summary

Adjust text hierarchy.
@Elijbet Elijbet added 3 - installed Issues that have been merged to master branch and are ready for final confirmation. and removed 2 - in development Issues that are actively being worked on. labels Jun 14, 2024
@github-actions github-actions bot assigned geospatialem and DitwanP and unassigned Elijbet Jun 14, 2024
Copy link
Contributor

Installed and assigned for verification.

@DitwanP
Copy link
Contributor

DitwanP commented Jun 17, 2024

🍡 Verified locally on dev

@DitwanP DitwanP closed this as completed Jun 17, 2024
@DitwanP DitwanP added 4 - verified Issues that have been released and confirmed resolved. and removed 3 - installed Issues that have been merged to master branch and are ready for final confirmation. labels Jun 17, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
4 - verified Issues that have been released and confirmed resolved. design Issues that need design consultation prior to development. enhancement Issues tied to a new feature or request. estimate - design - sm Small design effort; 1-4 days of design work estimate - 2 Small fix or update, may require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - medium Issue is non core or affecting less that 60% of people using the library ready for dev Issues ready for development implementation.
Projects
None yet
Development

No branches or pull requests

7 participants