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.

Sign up for GitHub

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

Jump to bottom

[Bug] buttons examples go outside website width on mobile #731

Closed
Andre601 opened this issue Jan 27, 2022 · 2 comments · Fixed by #831, #832 or FactorProfessional91/docs#5 · May be fixed by soumen1102/refined-github#2 or FactorProfessional91/docs#4
Closed

[Bug] buttons examples go outside website width on mobile #731

Andre601 opened this issue Jan 27, 2022 · 2 comments · Fixed by #831, #832 or FactorProfessional91/docs#5 · May be fixed by soumen1102/refined-github#2 or FactorProfessional91/docs#4
Assignees
@josepmartins
Labels
react size: sand type: bug 🐞

Comments

@Andre601
Copy link

Andre601 commented Jan 27, 2022 •
edited
Loading

Describe the bug

When viewing an Octicon which has button examples while on mobile, do the buttons go beyond the screen width.

Steps to reproduce

Steps to reproduce the behavior:

  1. Open the octicons page on mobile
  2. Click an icon that has button UI examples (i.e. moon (16px))
  3. Scroll down to the button examples
  4. See the buttons go beyond the screen width

Expected behavior

The buttons should stay within the screen

Screenshots

button examples issue

Device details

Desktop (please complete the following information):

  • OS: [e.g. iOS]
  • Browser [e.g. chrome, safari]
  • Version [e.g. 22]

Smartphone (please complete the following information):

  • Device: Samsung Galaxy S9
  • OS: Android 10
  • Browser Google Chrome
  • Version 97.0.4692.98

Additional info
@github-actions
Copy link
Contributor

Hi! This issue has been marked as stale because it has been open with no activity for 180 days. You can comment on the issue or remove the stale label to keep it open. If you do nothing, this issue will be closed in 7 days.

@github-actions github-actions bot added the Stale label Jul 26, 2022
@Andre601
Copy link
Author

The issue is still present.

@github-actions github-actions bot removed the Stale label Jul 26, 2022
josepmartins pushed a commit that referenced this issue Aug 29, 2022
Adjust flex wrap in UI examples.Fixes #731
1350a3a
@josepmartins josepmartins mentioned this issue Aug 29, 2022
Merged
@josepmartins josepmartins assigned josepmartins and unassigned edokoa and ashygee Aug 29, 2022
ashygee added a commit that referenced this issue Aug 29, 2022
@ashygee
Adjust flex wrap in UI examples. Fixes #731 (#831)
57f364a 
* Adjust flex wrap in UI examples.Fixes #731

* Add orange-turkey-work changeset

Co-authored-by: Ash Guillaume <10384315+ashygee@users.noreply.github.com>
@primer-css primer-css mentioned this issue Aug 29, 2022
Merged
@soumen1102 soumen1102 mentioned this issue Jun 20, 2024
Open
This was referenced Sep 9, 2024
Open
Merged
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@josepmartins josepmartins

Labels
react size: sand type: bug 🐞
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Adjust flex wrap in UI examples. Fixes #731 primer/octicons
Release Tracking primer/octicons
[Snyk] Upgrade: , , , , , classnames, ajv, cheerio, dayjs, github-slugger, hast-util-parse-selector, hastscript, hast-util-from-parse5, unist-util-visit, hast-util-select, highlight.js, hot-shots, html-entities, image-size, js-cookie, kleur, liquidjs, lunr-languages, mdast-util-to-string, mdast-util-from-markdown, unified, remark-parse, react-markdown, rehype-slug, rehype-stringify, rss-parser, semver, url-template, website-scraper FactorProfessional91/docs
[Snyk] Upgrade @primer/octicons-react from 17.5.0 to 17.12.0 soumen1102/refined-github
[Snyk] Upgrade: , , , , , classnames, ajv, cheerio, dayjs, github-slugger, hast-util-parse-selector, hastscript, hast-util-from-parse5, unist-util-visit, hast-util-select, highlight.js, hot-shots, html-entities, image-size, js-cookie, kleur, liquidjs, lunr-languages, mdast-util-to-string, mdast-util-from-markdown, unified, remark-parse, react-markdown, rehype-slug, rehype-stringify, rss-parser, semver, url-template, website-scraper FactorProfessional91/docs
5 participants
@edokoa @josepmartins @lesliecdubs @ashygee @Andre601