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

docs(grid): Add KB for Grid min-width #1941

Merged
merged 26 commits into from
Mar 7, 2024
Merged

Conversation

NansiYancheva
Copy link
Contributor

No description provided.

@NansiYancheva NansiYancheva self-assigned this Feb 19, 2024
@NansiYancheva NansiYancheva added the merge-to-production Use this label to get a comment to choose whether to merge the PR to production label Feb 19, 2024
Copy link
Contributor

Hello @NansiYancheva,

Check the below option if you would like to automatically generate PR to production. The automation uses the branch for the cherry-pick, and then will delete the branch. Please, do not delete it manually.

  • create PR to production

@dimodi dimodi changed the title docs(grid)Add KB for Grid min-width docs(grid): Add KB for Grid min-width Feb 20, 2024
@dimodi dimodi marked this pull request as ready for review March 7, 2024 15:33
@dimodi dimodi requested a review from a team as a code owner March 7, 2024 15:33
NansiYancheva and others added 19 commits March 7, 2024 18:00
@NansiYancheva NansiYancheva merged commit 98706e7 into master Mar 7, 2024
1 check passed
Copy link
Contributor

github-actions bot commented Mar 7, 2024

Here you are the link to your PR to production: 1966

@github-actions github-actions bot deleted the kb-grid-min-width branch March 7, 2024 17:12
Copy link
Contributor

@ikoevska ikoevska left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Reviewed.

This knowledge base article gives solution to the following scenario:

* Some or none of the Grid columns have a `Width`.
* The columns without a `Width` shrink too much or disappear when the browser window or the Grid become narrow. This phenomenon occurs no matter if the Grid shows a horizontal scrollbar or not.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
* The columns without a `Width` shrink too much or disappear when the browser window or the Grid become narrow. This phenomenon occurs no matter if the Grid shows a horizontal scrollbar or not.
* The columns without `Width` shrink too much or disappear when the browser window or the Grid becomes narrow. This phenomenon occurs no matter if the Grid shows a horizontal scrollbar or not.


This knowledge base article gives solution to the following scenario:

* Some or none of the Grid columns have a `Width`.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
* Some or none of the Grid columns have a `Width`.
* One or more of the Grid columns don't have `Width` defined.

* The columns without a `Width` shrink too much or disappear when the browser window or the Grid become narrow. This phenomenon occurs no matter if the Grid shows a horizontal scrollbar or not.


How to keep the above column `Width` configuration and:
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
How to keep the above column `Width` configuration and:
* I want to keep the above column `Width` configuration and:
* I want the `Width`-less columns to remain visible and not shrink or disappear.
* I want the Grid to show a horizontal scrollbar.

1. Use the Grid's [`Class` parameter]({%slug grid-overview%}#grid-parameters) to set a custom CSS class.
1. Set a `min-width` style for the Grid table elements through the custom CSS class. The `min-width` value must be greater than the sum of the all set column [`Width`s]({%slug grid-columns-width%}).

As a result, the width-less N number of columns will receive 1/N of the remaining space. A large-enough `min-width` value will ensure that the width-less columns remain visible and wide enough.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
As a result, the width-less N number of columns will receive 1/N of the remaining space. A large-enough `min-width` value will ensure that the width-less columns remain visible and wide enough.
As a result, the `Width`-less N number of columns will receive 1/N of the remaining space. A large-enough `min-width` value will ensure that the `Width`-less columns remain visible and wide enough.


## See Also

* [Grid column width behavior]({%slug grid-columns-width%})
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
* [Grid column width behavior]({%slug grid-columns-width%})
* [Grid Column Width Behavior]({%slug grid-columns-width%})

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
merge-to-production Use this label to get a comment to choose whether to merge the PR to production
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants