Forum Discussion
Changing text color on system buttons
Hi,
Is there a way to change the font color of system buttons (aka the Divider Continue button)? Seems to me like it would be an easy fix by just adding that to the block's setting.
I'm currently building courses and our Brand color is light green. But for an unknown reason, the system uses white font on my Continue buttons that uses the Brand color. So, we can barely see the text on those buttons and it doesn't pass the WCAG 2.1 contrast requirements.
I can't change the shade of the green color since it's our brand color. What can I do? Why the option to change the text on those system buttons (or even changing the colors of those buttons) is not available?
Thanks
22 Replies
Hello Frédérick!
I can understand how white text on a light green button would be an accessibility issue. While there isn't a way to change the continue button text color right now, I'll send you an update if we make adjustments that will help you!
It's 3 years later. Has this been addressed yet? It's a 508 compliance problem!
Hi Kimberly,
Rise 360 can now switch the colors of system text such as the text found in buttons, between light and dark colors. This feature is described in detail by my colleagues Crystal and Gren. If this isn't the accessibility enhancement you need, can you share more information about your requirements so I can relay them to our product team?
Thanks, I'll appreciate that
We would love the ability to change the "Continue" text color as well. Any update on this feature?
Hello Glen! We're still tracking this request, but I'll be sure to let you know here as soon as we have updates to share!
I discovered by accident while trying to change the color of the Continue button that you can change the Continue font color by doing the steps below to your exported Rise course. I would imagine the other system buttons can be changed in a similar fashion if you can figure out the name for them in the CSS file.
1. Extract your files from the zipped exported package.2. Open the main.bundle.css file in a text editor such as Notepad. (In a Scorm package, this is located in the scormcontent/lib folder.)
3. Use CTRL + F to open Find and search for 'continue' (see continue.png attached image below).
4. Inside the curly brackets immediately following .continue-btn, you will find a color attribute followed by a hex value (circled in blue in the continue.png attached image). Change the hex value to the color you desire.
NOTE: Be very careful to only change the hex value (shown in the image as #fff). Don't add or delete any other characters. Also make sure your hex value begins with the hash (or pound) symbol as shown. Your hex value will likely be 6 characters long, such as #123456.
5. Save the file. Rezip your package and publish.
I hope this helps!
This is great to know, thanks so much!
Do you know if there is a way to change the colour of the numbers in a list as well?
Cheers!
- Good news! We fixed the issue in Rise 360 where bullets and numbers in text block do not accept color formatting.If the problem happens again, please share a Peek 360 screencast with us by clicking here, and we'll be happy to help!
Hey folks,
We've hit some snags with our updated text editor. While we love the joy of delivering new features, it should never come at the expense of usability. We're going to roll back this release for now. You may still see the new toolbar until the rollback is complete. I'm so sorry for the trouble!
Looking for a way to change the font color on the Continue buttons as well. Any ETA on this feature? Thanks!
Hi, I am also looking for an update on changing the font color on the continue buttons. Attached is what my buttons currently look like, and as you can see the font is hard to read. Thanks!
Hello, are there any updates on that issue? If the accent color of a theme is rather light, all the divider buttons are basically useless. I hope you can fix this problem any time soon. Thank you!
