title: Migration css rails login form to bootstrap
body: <p>Need help migration to bootstrap.</p>
  
  <p>bootstrap sound easy just go get all scss and samples to paste. But I don't know how to insert "@user, url: signup_path" into/or replace in bootstrap code to work in rails app.</p>
  
  <p>html:</p>
  
  <pre><code>&lt;div class="row"&gt;
  &lt;div class="col-md-6 col-md-offset-3"&gt;
    &lt;%= form_for(@user, url: signup_path) do |f| %&gt;
  
    &lt;%= render 'shared/error_messages' %&gt;
  
    &lt;%= f.label :name %&gt;
    &lt;%= f.text_field :name %&gt;
  
    &lt;%= f.label :email %&gt;
    &lt;%= f.email_field :email %&gt;
  
    &lt;%= f.label :password %&gt;
    &lt;%= f.password_field :password %&gt;
  
    &lt;%= f.submit "Create my account", class: "btn btn-primary" %&gt;
  &lt;% end %&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Bootstrap code: from <a href="http://getbootstrap.com/components/#input-groups-sizing" rel="nofollow noreferrer">getbootstrap</a></p>
  
  <pre><code>&lt;div class="input-group input-group-lg"&gt;
    &lt;span class="input-group-addon" id="sizing-addon1"&gt;@&lt;/span&gt;
    &lt;input type="text" class="form-control" placeholder="Username" aria-describedby="sizing-addon1"&gt;
  &lt;/div&gt;
  
  &lt;div class="input-group"&gt;
    &lt;span class="input-group-addon" id="sizing-addon2"&gt;@&lt;/span&gt;
    &lt;input type="text" class="form-control" placeholder="Username" aria-describedby="sizing-addon2"&gt;
  &lt;/div&gt;
  
  &lt;div class="input-group input-group-sm"&gt;
    &lt;span class="input-group-addon" id="sizing-addon3"&gt;@&lt;/span&gt;
    &lt;input type="text" class="form-control" placeholder="Username" aria-describedby="sizing-addon3"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Updated:
  bootstrap as follow:</p>
  
  <pre><code>&lt;%= form_for(@user) do |f| %&gt;
    &lt;%= render 'shared/error_messages', object: @user %&gt;
    &lt;div class="input-group"&gt;
        &lt;span class="input-group-addon" id="basic-addon1"&gt;@&lt;/span&gt;
    &lt;%= f.label :name %&gt;
    &lt;%= f.text_field :name, class: 'form-control' %&gt;
    &lt;/div&gt;
  
    &lt;div class="input-group"&gt;
        &lt;span class="input-group-addon" id="basic-addon1"&gt;@&lt;/span&gt;
    &lt;%= f.label :email %&gt;
    &lt;%= f.email_field :email, class: 'form-control' %&gt;
     &lt;/div&gt;
  
    &lt;div class="input-group"&gt;
        &lt;span class="input-group-addon" id="basic-addon1"&gt;@&lt;/span&gt;
    &lt;%= f.label :password %&gt;
    &lt;%= f.password_field :password, class: 'form-control' %&gt;
    &lt;/div&gt;
  
    &lt;div class="input-group"&gt;
        &lt;span class="input-group-addon" id="basic-addon1"&gt;@&lt;/span&gt;
    &lt;%= f.label :password_confirmation %&gt;
    &lt;%= f.password_field :password_confirmation, class: 'form-control' %&gt;
    &lt;/div&gt;
  
    &lt;div class="input-group"&gt;
        &lt;span class="input-group-addon" id="basic-addon1"&gt;@&lt;/span&gt;
    &lt;%= f.submit yield(:button_text), class: "btn btn-primary" %&gt;
    &lt;/div&gt;
  
  &lt;% end %&gt;
  </code></pre>