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

Fix the table overflowing sidebar #1234

Merged
merged 3 commits into from
Nov 12, 2020
Merged

Conversation

SMAKSS
Copy link
Contributor

@SMAKSS SMAKSS commented Nov 10, 2020

Fixes #1205
Changing the table markup in the Commit SHAs according to the previous fix which controls the overflow of the table with the use of javascript/wrap-code-terms.js.

Why:

Well, this PR will fix #1205 where the table has overflowed the sidebar like below:
original

What's being changed:

I tried to stick with the previous fix which fixes the #56 with the use of javascript/wrap-code-terms.js, so I just tried to change the current markup of the table. Since the current logic will only support the breaking of contents within a <code> tag I had to wrap the necessary items which cause them to overflow in the <code> tag.

So it will look like this:
bold

But since the current style of the <code> tags within the table will make them bold I had to remove it from the general style to make the whole table look better, it may break changes in other pages (like this one) but I think they are overall looking good without font-weight: bold; but this is for owners to decide, so if there is any other suggestion to make it better I will be happy to make the necessary changes in the codebase.

The final look of the table:
final

Check off the following:

Fixes github#1205
change current markup of table based on the previous fix with use of javascript/wrap-code-terms.js
@welcome
Copy link

welcome bot commented Nov 10, 2020

Thanks for opening this pull request! A GitHub docs team member should be by to give feedback soon. In the meantime, please check out the contributing guidelines.

@janiceilene
Copy link
Contributor

Thanks so much @SMAKSS! I'll get this triaged for review ⚡

@janiceilene janiceilene added the engineering Will involve Docs Engineering label Nov 10, 2020
Copy link
Contributor

@sarahs sarahs left a comment

Choose a reason for hiding this comment

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

Thanks @SMAKSS! Using <code> tags here is a good change. 👍 And we agree the tables look better without the bold. Thanks for checking in about that!

@simpsoka
Copy link
Contributor

One question I had about this... and we don't have to do it as part of this PR, but something to think about. If anything is bolded on the table, should it be the column headers?

@chiedo chiedo merged commit 88399df into github:main Nov 12, 2020
@github-actions
Copy link
Contributor

Thanks very much for contributing! Your pull request has been merged 🎉 You should see your changes appear on the site in approximately 24 hours.

@SMAKSS

This comment was marked as spam.

@SMAKSS SMAKSS deleted the fix-table-overflow branch November 12, 2020 17:06
@simpsoka
Copy link
Contributor

@SMAKSS I like the bold column titles :)

@composio-dev
Copy link

PR Changes Summary

Objective

This PR aims to address an issue related to table overflow in the sidebar. It modifies the current markup of the table to use JavaScript to wrap code terms, thereby preventing overflow issues.

Changes

  • Type: Fix
  • **Important Files: **
    1. content/github/writing-on-github/autolinked-references-and-urls.md: Adjusted the formatting of URLs and repository references. Modified 4 lines, including additions and deletions.
    2. stylesheets/tables.scss: Removed the bold font-weight from table headers to comply with the new table structure.

Feel free to review the changes here.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
engineering Will involve Docs Engineering
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Table with long words overlaps with sidebar
6 participants