css files for different multiple screen sizes?

[Tim]

I have been reading the nativescript documentation on supporting multiple screen sizes.

I have been able to define all my views without specifying the width & height values. However there are a few elements that are used on several screens that I have set the height for in the app.css.

So is it possible to specify app.minWH600.css ?

 

The documentation alludes to it, but provides the view XML files as example, and then uses the css as an example of a platform specifier. 

 

 

[Nick Iliev]

Hello Tim,

Currently, it is not possible to specify differently CSS files for multiple screen sizes.
However, CSS itself is providing an easier way to create different UX for your screen size qualifiers files.
Consider the following scenario:

You have

main-page.minWH720.xml 
main-page.minWH480.xml

And you need to provide different styles for both pages.
What you can do is the following:

.my-button-for-wh720page {
   background-color: red
}

.my-button-for-wh480page {
   background-color: blue
}

And use them accordingly where needed
For example: 
the button in .minWH720, will have cssClass="my-button-for-wh720page"
the button in main-page.minWH480,xml will have cssClass="my-button-for-wh480page"


Regards,
Nikolay Iliev
Telerik by Progress