Forum: Ruby on Rails Working with designmodo's Flat UI Pro

B7ae888fe561d862e118b313ec4f205d?d=identicon&s=25 bertly_the_coder (Guest)
on 2014-03-02 16:47
(Received via mailing list)
Hi guys,

I am using Rails 4, Bootstrap 3 and simple_form  and have been having a
bit
of trouble implementing Flat UI into my existing site. I used the
following
article to implement: http://joanswork.com/add-flat-ui-pro-to-rails/.
When
I tried to run my app, my first error was that typeahead.js was missing.
So
I went into the flatui.js file and removed this. Then I run the app
again
and this time it loaded. Now when I look at my radio-buttons, all they
have
is the label, when I click on them, I get a radio button, but it's
styling
makes it look really cramped. When I click on another radio button, the
initial one showed disabled. How do I get to load the correct styling
the
first time? Am I missing a class designation? I've attached images:

fresh page:

<https://lh3.googleusercontent.com/-Ytm4DAgpxSc/UxN...

clicked on one radio button:

<https://lh6.googleusercontent.com/-NyF6TC0KY3s/UxN...

clicked on second radio button:

<https://lh5.googleusercontent.com/-Rvi9vV9YwLQ/UxN...

Am I supposed to used classes to load and style correctly. I'm also
trying
to style my selects which currently look like this:

<https://lh5.googleusercontent.com/-4BwXvh2-Q9M/UxN...

My gem file looks correct with:

# Use SCSS for stylesheets

gem 'sass-rails', '~> 4.0.0'

gem 'jquery-ui-rails'

gem 'less-rails-bootstrap'

gem 'designmodo-flatuipro-rails'

gem 'therubyracer', platforms: :ruby


and my css file and js files include the following lines:
//= require jquery
//= require jquery.ui.button
//= require jquery.ui.datepicker
//= require jquery.ui.slider
//= require jquery.ui.spinner
//= require jquery.ui.tooltip
//= require jquery.ui.effect
//= require flatuipro
//= require jquery_ujs
//= require turbolinks
//= require bootstrap
//= require_tree .

Any help/pointers are highly appreciated.

Thank you!
Please log in before posting. Registration is free and takes only a minute.
Existing account

NEW: Do you have a Google/GoogleMail, Yahoo or Facebook account? No registration required!
Log in with Google account | Log in with Yahoo account | Log in with Facebook account
No account? Register here.