IT Monkey will place code here as examples of what Cireson's consulting team has to offer as well as examples for public consumption to benefit the Microsoft System Center community as a whole.
DISCLAIMER
All files and projects located here come as is and without any warranty or support. We will attempt to improve the projects as time goes on based on customer and community demand. Comments and improvements are welcome as well as customization requests. Your use of these Cireson Uploads is subject to our Terms of Use.
Cireson's support team has no information on these projects outside of what you have available and will not provide support for these enhancements, extensions, and scripts.
Dont forget to checkout solutions uploaded by our customers, partners and community members here.
Cireson Portal Dark and High Contrast Modes!!!
Shane_White
Cireson Support Super IT Monkey ✭✭✭✭✭
Hi Community,
I noticed a few threads where there were a mention of Dark Mode in the portal, and or compliance with WACG so I have built a customisation for a couple of Modes in the portal:
- Default (What you know and love 😉)
- Dark Mode
- High Contrast Mode
I will say this is not Cireson code and will not be supported by Cireson, but I am looking to gather feedback around this customisation so that I can gauge interest and adoption. This feature may become a future add-in to provide a more robust and manageable solution
The installation is simple, copy the folder named 'AccessibilitySettings' inside the attached .zip folder into your customspace and add this line into your custom.js file:
loadScript("/CustomSpace/AccessibilitySettings/AccessibilitySettings.js",['']);
NOTE: This requires you to have the Cireson Script loader found here:
https://cireson.com/blog/how-to-organize-your-customspace-with-a-script-loader/
Files Downloaded here:
https://github.com/shanewh1te/AccessibilitySettings
The colours are configurable if you would like to get into that, simply open up AccessibilitySettings.js and edit the colours at the top of the file.
Please leave a like on the thread if you download and test this solution so I can get a rough idea of how many people are interested in this!
Let me know what you guys think, really looking to collate as much feedback as possible! Happy to answer any additional questions
Thanks,
Shane
Comments
If further help/screenshots are need explaining how it works, please let me know!
Hi Shane, thanks for sending me this. I loaded the script into our dev portal. Looks good and I like how easy it is for a Analyst to change to and from an admin perspective to tweak the colours if we want certain aspects to keep some elements of our theme. However it seems quite inconsistent on what pages it loads, sometimes it loads on home, views, pages etc. click away and come back to it and not only is it back in default but the setting has gone too even if the console is showing as loading the .js and also sometimes it loads as default before changing to what mode it has been set to. I think this could make some of our Analysts very happy but I would need it more slick in loading to please others. Hope this feedback helps :)
Hi @Emma_Jenkins
That is really good feedback so thank you very much, I think I might have noticed a little of what you are describing, and that is one of the quirks of using the browser storage to remember your preference.
How often does it happen? Would you be able to record the behaviour and send a sample over to me please?
Hmmm my browser cache is disabled so I don't know if that will make it better or worse. I will try with/without and get something over to you. Thanks
With browser cache disabled that would definitely make it worse 😜 As it saves your preference to the cache! Thanks :-)
Thanks to the help of @Emma_Jenkins I was already able to iron out some bugs:
This would be great as an Add in if users can decide.
@Shane_White This looks good to me. It makes the section of the banner bar larger to accommodate it. Is there a way to make the cog smaller or allow it to fit to the bar?