CODEWITHSUNDEEP
ruby-on-railsrubyruby-on-rails-4simple-form
suyesh
suyesh

Reputation: 530

How to customize simple Form text area?

I want to customize input areas in this code 

<%= simple_form_for @fuel_price, url: supplier_fuel_prices_path, class: "m-t" do |f| %>
                                          <%= f.input :regular, label: "Regular" %>
                                          <%= f.input :medium, label: "Medium"%>
                                          <%= f.input :premium, label: "Premium" %>
                                          <%= f.input :diesel, label: "Diesel" %>

to have styling like the image below

enter image description here

I dont want horizontol or anything. Just want that dollor in front.

Or even better, something like below but with $ instead of @

enter image description here

Upvotes: 0

Views: 717

Answers (2)

Sukanta
Sukanta

Reputation: 585

You have to add bootstrap css library into your application and try the below code

simple_form_for @fuel_price, url: supplier_fuel_prices_path, class: "m-t" do |f| %>
 <div class="form-group">
  <div class="input-group">
   <div class="input-group-addon">$</div>
    <%= f.text_field :regular, placeholder: "Regular", class:"form-control" %>
  </div>
  <div class="input-group">
   <div class="input-group-addon">$</div>
   <%= f.text_field :medium, placeholder: "Medium", class:"form-control"%>

  </div
  <div class="input-group">
   <div class="input-group-addon">$</div>
   <%= f.text_field :premium, placeholder: "Premium",class:"form-control" %>

  </div
  <div class="input-group">
   <div class="input-group-addon">$</div>
   <%= f.text_field :diesel, placeholder: "Diesel",class:"form-control" %>   

  </div
 </div>
<%end%>

Upvotes: 0

Dimitris Panagkasidis
Dimitris Panagkasidis

Reputation: 93

You can find solution here. He uses Bootstrap and SimpleForm

Upvotes: 2

Related Questions