question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Making `/settings`' buttons consistent

See original GitHub issue

Is your feature request related to a problem? Please describe.

There are 3 buttons with different innerText View, Show Code, Show Solution

Edit: did I just put same buttons twice🤦🤣, because I am currently away from laptop check setting

image image

Describe the solution you’d like

Swapping Show Code and Show Solution with View for consistent look, while adding .sr-only to span in the button with innerText equal to Code or Solution.

Examples:

- <button>Show Code</button>
- <button>Show Solution</button>

+ <button>View <span class="sr-only>Code</span></button>
+ <button>View <span class="sr-only>Solution</span></button>

Describe alternatives you’ve considered

Nothing, this isn’t a true issue. Quality of life change

Additional context

This idea is originated from full button width

for more info check comment in https://github.com/freeCodeCamp/freeCodeCamp/issues/45947#issuecomment-1130030952

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:5 (5 by maintainers)

github_iconTop GitHub Comments

1reaction
Hdanzocommented, Sep 14, 2022

@tom-raley Hello! I am working on this at the moment 😄

1reaction
Sboonnycommented, Sep 15, 2022

@Hdanzo yeab that would be lovely 👍.

If you would like to fix this issue, please make sure you read our guidelines for contributing, we prioritize contributors following the instructions in our guides. Join us in our chat room or the forum if you need help contributing, our moderators will guide you through this.

Read more comments on GitHub >

github_iconTop Results From Across the Web

How To Design Better Buttons - Smashing Magazine
A safe bet is to make buttons square or square with rounded corners, depending on the style of the site or app. Rectangular...
Read more >
Icon consistency in buttons - User Experience Stack Exchange
Consistency for button can only be achieved if all buttons are text only · However, having common icon (such as 'Settings', 'Sync') in...
Read more >
Buttons - Menus and actions - Human Interface Guidelines
When buttons are instantly recognizable and easy to understand, an app tends to feel intuitive and well designed. Make buttons easy for people...
Read more >
How to Maintain a Consistent Look for Buttons in GeneratePress
For the GenerateBlocks Button block, you can make the change in the block settings under Advanced > CSS Classes.
Read more >
Set consistent font styles and create buttons with auto layout ...
Figma gives us the ability to save styles, colors and other components that can be re-used at a later time. This ensures consistency...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found