Registering assets for mobile and desktop - making site responsive


(Tech Domain) #1

I am trying to register mobile specific stylesheet and desktop specific stylesheet.
But the discourse always takes the stylesheet which is registered last.

For example in plugin.rb file

# General change
register_asset "stylesheets/topiclist.scss"

# Desktop change
register_asset "stylesheets/desktop/topiclist.scss"

# Mobile change
register_asset "stylesheets/mobile/topiclist.scss"

Here the mobile stylesheet will override the previous two.

If I change the order, and keep the desktop stylesheet last, then it will override the previous ones.

So how do you make it responsive? Do we have to write the media queries ourselves, or placing the stylesheet in specific folders ( mobile, desktop etc) should make it work?


(Vinoth Kannan) #2

The correct code should be like below

# General change
register_asset "stylesheets/topiclist.scss"

# Desktop change
register_asset "stylesheets/desktop/topiclist.scss", :desktop

# Mobile change
register_asset "stylesheets/mobile/topiclist.scss", :mobile

(Tech Domain) #3

@vinothkannans Thanks for answer.
But I had tried this after searching github repository. It didnt work for me, as the result was same as before.

I also tried another variation from this repo

register_asset('stylesheets/topiclist.scss', :desktop)
But this too didnt work.

I do not know Ruby very well, are the :desktop and :mobile variables available in plugin.rb file which control which stylesheet should be applicable?


(Nico Stöckigt) #4

I have the same issue with my markdown plugin. I tried:

register_css <<CSS
[...]
CSS

as well as

register_asset('stylesheets/decoration.scss')

but the Stylesheets seems not to be loaded!

Normally the Stylesheet Controlls :desktop, :mobile and :all are applicable!