Color coding environments is not working

Question

I need to color code my environments, I deal with 4 different envs and I need to tell them apart, fast. I have code for watermarks and separate colored Logos but those are not in-your-face enough when working in parallel on multiple envs I know that there is no upgrade safe way to do this, so I've been playing with the core code. include/MVC/View/tpls/sidecar.tpl has the hardcoded blue, which I tried to replace with purple (also tried green, red etc)

I checked that the purple was included in the tailwind colors in the root directory of sugar: tailwind.config.js refers to maple-syrup/build/color/tailwind/sugarPalette.js and it is : "purple": { "50": "#faf5ff", "100": "#f2e5ff", "200": "#ead6ff", "300": "#d8b4fe", "400": "#bf83fc", "500": "#a855f7", "600": "#9234ea", "700": "#7e22ce", "800": "#6a21a6", "900": "#591c87", "950": "#3c0764" }, Yet the only thing I achieved is removing the background altogether, which is a step forward as I can tell test envs from PRD, but not ideal since I can't tell the difference between test envs. Any thoughts on why the background won't recognize any color other than blue? thanks, Francesca

Francesca Shiekh · Accepted Answer

Hello Francesca Shiekh , 
 I managed to do this using a custom.less file like its described here: https://support.sugarcrm.com/documentation/sugar_developer/sugar_developer_guide_25.2/architecture/themes/#Custom_Themes 
 The only thing I had to do differently was to target the specific background utility classes used by Sugar&rsquo;s current theme. Here&rsquo;s what worked for me: Created the following custom/themes/custom.less 
 
 // custom/themes/custom.less

.fixed.h-full.w-full.bg-gradient-to-tr.from-blue-700.to-blue-400,
.fixed.h-full.w-full.bg-gradient-to-tr.from-blue-700.to-blue-400.dark\:from-blue-900.dark\:to-blue-600 {
background: red !important;
background-image: none !important;
} 
 
 After saving the file, I ran a Quick Repair and Rebuild and cleared my browser cache &mdash; the background updated right away. Look how beautiful Let me know if this works. Cheers, Andr&eacute;

Francesca Shiekh · Answer

Hi Francesca, 
 I can't speak to what is causing your issue but have you thought of customizing the theme for each environment? From what I understand, you are using the on-prem version so using a custom theme for each environment should be straight forward. 
 
 cheers, Yvonne