xStyle custom CSS for Alkemics front

This content aims to change a little the Alkemics interface to help you recognise at glance certains informations. It also refresh the interface a little.

Give me an example

Change banners

If you are on Preprod, the teal navbar will be enhanced with a light strip. On Load testing, the stip is purple. On your Pillar, the stip is cyan. On Prod, the navbar change colors using Salsify colors. The logon footer also work that way.

If you have multiple windows or tabs on theses opened, you will quickly see on which one you are.

Change user icon to a factory or a shop

If you use a Chrome profil for Retailers accounts, you can change the top right user icon to a shop one. If you use a Chrome profil for Manufacturers, it can change it to a factory.

How does it works?

Nothing is changed on the software itself: It's your broswer that applies more CSS rules to make it happens. It relies on the Chrome extension xStyle, that make it easy to turn them on or off, just in case it conflict with the website.

  1. Install xStyle from the Chrome Web Store ⎋
  2. In the extension, create a new Style
  3. Copy one of the files' content available here, in the text editor
  4. You can use the file name as the style name, or use your own.

Repeate for each styles you want to enables.

What each styles do?

  • PPR banner.css: Change the Preproduction banner

  • PLR banner.css: Change your Pillar banner

  • LTG banner.css: Change the Load Testing banner

  • PRD banner.css: Change the Production banner and login's footer

  • Whiter banner.css: Look & feel, mainly changing text to pure white and the hover and active elements. A must have. Works with the others files.

  • Retailers Sigils.css: Change the top-right user icon to a Shop one, and make it orange. This can't tell if you'r actually logged as a Retailer or not.

  • Suppliers Sigils.css: change the top-right user icon to a Factory one, and make it turquoise. This cn't tell if you're actually logged as a Manufacturer or not.

Description
CSS Tweaks for some website.
Readme 5.2 MiB
Languages
CSS 64.1%
Less 32.4%
HTML 3.5%