Question

I have a simple controller that goes to a view under views/mobile/home/index.html.haml

It works and now I am trying to add files to views/layouts/mobile to ensure that the site responds to mobile and tablet viewing.

Should I create a new index.html.haml for the tablet and a separate one for the tablet view?

Also, as I understand it, I am supposed to make the index.html.haml and views/mobile/home/index.html.haml have a yield command so that at certain point during loading it loads the correct version of the mobile page. How do I do that?

My current controller is very basic like this:

class Mobile::HomeController < ApplicationController
  def index

    respond_to do |format|
      format.html
    end
  end

  def create

  end
end

Answer 1

Typically the responsive design should happen at the CSS and Javascript level. The HTML should define the semantic structure of the information you are displaying and NOT the visual design. Instead look at how frameworks like TwitterBootstrap handle the responsive design using things like CSS media queries etc.