Jump to content
  • For the status field we have already defined several different values, but they all look the same at the moment. Especially with a bug tracker, the status of an error message should be immediately visible, for example with an alarm red for critical errors, green for fixed errors, and so on.

    Now we do all this in one washup with CSS. This is not only much easier and more elegant, the old font color tag is also no longer supported under modern HTML5.

    Now I have to say that it's actually the idea of IPS that you create your own CSS files for your pages (the Release Notes Tutorial explains exactly how this works). In this example I use the code directly in the templates. This has several advantages, among others I can be more individual.

    In the recordRow template you simply copy the code from above over the actual template code ...

    <style>
      .ipsBadge_style1 {
        --badge--background: #ff0000;
        --badge--color: #fff;
        border-radius: 2px;
      }
       .ipsBadge_style2 {
        --badge--background: #49bd5b;
        --badge--color: #fff;
         border-radius: 2px;
      } 
       .ipsBadge_style3 {
        --badge--background: #606060;
        --badge--color: #fff;
         border-radius: 2px;
      }   
       .ipsBadge_style4 {
        --badge--background: #ff9900;
        --badge--color: #fff;
         border-radius: 2px;
      }   
       .ipsBadge_style5 {
        --badge--background: #3A8BC4;
        --badge--color: #fff;
         border-radius: 2px;
      }   
       .ipsBadge_style6 {
        --badge--background: #FF69B4;
        --badge--color: #fff;
         border-radius: 2px;
      }    
    </style>  

    In the record Template exactly the same, only that I added this in the Style-Tag (just for the look) ...

    .ipsTabs {
      display: none;
      }

    This removes the Tabs menu that is superfluous in this case.

    bugtracker_threadview.png

     





×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. Further information can be found in our Privacy Policy.