UI Blueprint [4.5]

Posted by Simon Tregloan-Reed on 26-Jul-2017 05:34

Hi All,

I'm wondering if there is a way to see what the current UI blueprint option is being used from the client side? This is so I can use JavaScript to make the page look differently based on the UI blueprint.

Regards,

Simon Tregloan-Reed

Rollbase - Forum
Posted by Mohammed Siraj on 26-Jul-2017 05:44

You can use client-side SDK:
 
var pageContext = rbf_getPageContext();
var currTemplate = pageContext && pageContext.getCurrentUITemplate();
return currTemplate && currTemplate.getType();
 
Regards,
Siraj.
 

All Replies

Posted by Mohammed Siraj on 26-Jul-2017 05:44

You can use client-side SDK:
 
var pageContext = rbf_getPageContext();
var currTemplate = pageContext && pageContext.getCurrentUITemplate();
return currTemplate && currTemplate.getType();
 
Regards,
Siraj.
 

Posted by Simon Tregloan-Reed on 31-Jul-2017 08:34

Hi Siraj,

Sorry for the late reply, I got your response but wasn't able to send a reply because I couldn't see the topic I posted. It would show as a blank white page but thanks for the reply. I'll give it a shot and see what I get.

Regards,

Simon Tregloan-Reed

Posted by Thierry Ciot on 31-Jul-2017 20:52

Simon,

I understand you may want to use JavaScript in some cases but in most of the times you should be able to tailor the UI using CSS and have specific rule for each blueprint.

We have 3 CSS root level rules we add to the body element based on which blueprint the UI is running.  The CSS rules are:

  • rbs-ui-template-type-default (Traditional)
  • rbs-ui-template-type-2 (Modern Vertical BP)
  • rbs-ui-template-type-custom

So far example, this will make the object view title red for Modern Vertical BP and green for traditional

.rbs-ui-template-type-2 .rbs-objectViewTitle {  color: red; }
.rbs-ui-template-type-2 .rbs-objectViewTitle {  color: green; }

It is the same technique we have implemented for differentiating between desktop vs mobile and smartphone. See 
http://documentation.progress.com/output/rb/doc/#page/rb%2Fcustom-css.html for details.

Thierry.

Posted by Thierry Ciot on 01-Aug-2017 09:58

FYI:

We will improve the documentation in V5.0 to include these CSS rules

We are tracking it as item 76547

This thread is closed