How to update colour of statuses in 9.0.9

Answers

• Options

  Brian_Wiest Customer Super IT Monkey ✭✭✭✭✭

  April 2019

  Custom CSS

  
  

  .status-pill--active {
      color: white;
      background-color: #333 !important;
  }
  

  
  

  0
• Options

  Sean_Terry Customer Advanced IT Monkey ✭✭✭

  April 2019

  Thanks
  
  

  0
• Options

  Gabriel_Lences Customer Advanced IT Monkey ✭✭✭

  April 2019

  Can this be further enhanced to have different colors according to what the status of the SR is? 
  E.g: failed would be red, submitted blue, completed green etc.?

  0
• Options

  Shane_White Cireson Support Super IT Monkey ✭✭✭✭✭

  April 2019 edited April 2019

  Hi @Gabriel_Lences,
  
  Yes it certainly can, I have drawn up a quick example for Incidents to show you how this might work, the js would need to go in CustomSpace folder and is changing the status-pill class background color (you can add border color and other css elements as well) to red if Active and blue if resolved:
  
  

  $(document).ready(function () {

  var mainPageNode = document.getElementById('main_wrapper');

  var observer = new MutationObserver(function(mutations) {

  
  

  var statusPill =  $('.status-pill')

  //console.log(statusPill);

  if (statusPill.length > 0) { //An Element Exists

  if(pageForm.viewModel.Status.Name === "Active") {

  for(var i = 0; i < statusPill.length; i++){statusPill[i].style.backgroundColor = "green"}

  }

  if(pageForm.viewModel.Status.Name === 'Resolved') {

  for(var i = 0; i < statusPill.length; i++){statusPill[i].style.backgroundColor = "red"}

  }

  observer.disconnect();

  }

  });

  
  

  // configure the observer and start the instance.

  var observerConfig = {attributes: true, childList: true, subtree: true, characterData: true };

  observer.observe(mainPageNode, observerConfig);

  });

  
  Below is a screenshot of the result:
  
  
  Hope this helps,
  Thanks,
  Shane.

  2
• Options

  Gabriel_Lences Customer Advanced IT Monkey ✭✭✭

  April 2019

  @Shane_White , that's exactly what I was looking for, perfect! Thanks a bunch! 

  0
• Options

  Shane_White Cireson Support Super IT Monkey ✭✭✭✭✭

  April 2019

  @Gabriel_Lences
  
  I have done a quick edit on the above code to fix it as a used the wrong if statement
  
  Thanks,
  Shane.

  0