Using footable in Ruby on Rails 4 - ruby-on-rails

How do I include footable in Ruby on Rails 4?
In my Gemfile I added gem 'foo_table-rails'
I did a bundle install after that.
In my application.js I wrote: //= require footable.core
In application.scss I wrote: //= require footable.core
I have tried even *= require footable-rails , but unfortunately it is not working.
My application.scss is as shown below:
#import "bootstrap-sprockets";
#import "bootstrap";
*= require footable.metro
PS: I have already installed bootstrap & I have been using its templates.

Your application.js is correct, but in your application.scss, you need to choose a theme, if you're starting with the metro theme for example use:
*= require footable.metro
Try changing your application.scss to:
/*
*= require footable.metro
*= require_self
*/
#import "bootstrap-sprockets";
#import "bootstrap";

Related

Devise bootstrap views not found after updating to latest version

I get the following error after updating Devise bootstrap views to the latest version (1.1.0). Everything works OK if I switch back to v0.0.11.
What is the problem?
In my Gemfile I have this
gem 'devise'
gem "twitter-bootstrap-rails"
gem "devise-bootstrap-views"
application.css
/*
*= require devise_bootstrap_views
*= require_tree .
*= require_self
*/
bootstrap_and_overrides.css
/*
=require twitter-bootstrap-static/bootstrap
Static version of css will use Glyphicons sprites by default
=require twitter-bootstrap-static/sprites
*/
application.js
//
//= require rails-ujs
//= require jquery
//= require twitter/bootstrap
// require turbolinks
//= require Chart.bundle
//= require chartkick
//= require_tree .
I know this is an old question, but I guess this is a duplicate of Question #52636393.
I had this same problem while updating dependencies from an old project of mine. All I had to do was to remove the following line from application.css
*= require devise_bootstrap_views
Look for this line in your css/sass files and try removing it. Oh, and remember to restart your server :)
I hope it helps.

Why my rails project cannot show Bootstrap styles after changing all these files?

My computer system is Mac OS. In the past few days, I was working on a rails project and I tried to use Bootstrap in my app. Followed by the instruction of Bootstrap website, I changed some files' contents but it still didn't work. Can somebody help me?
This is the code in application.scss:
#import "bootstrap-sprockets";
#import "bootstrap";
This is the code in application.js:
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
This is my Gemfile:
gem 'bootstrap-sass', '3.3.7'
I have also run 'bundle install' on my console. However, nothing happened in my pages.
Your application.js is missing the bootstrap files. Add those and you are good to go. Just add the below
//= require bootstrap-sprockets
to the application.js

how to implement bootstrap themes in rails?

I'm trying to use startbootstrap themes to my rails application
http://startbootstrap.com/template-overviews/creative/
I have download the themes extract it
move the css folder into vendor/stylesheets
move the javascript folder into vendor/javascripts
edit the index.html file and remove all the dependencies from there(remove the css and remove the javascript)
then
I edit my application.js and application.css to include the css and js files from the themes
application.js
//= require vendor/jquery/jquery.min.js
//= require vendor/bootstrap/js/bootstrap.min.js
//= require vendor/scrollreveal/scrollreveal.min.js
//= require vendor/magnific-popup/jquery.magnific-popup.min.js
//= require js/creative.min.js
application.css
*= require vendor/bootstrap/css/bootstrap.min.css
*= require vendor/font-awesome/css/font-awesome.min.css
*= require vendor/magnific-popup/magnific-popup.css
*= require css/creative.min.css
the css and image is working properly but the javascripts never work Idk why
so far my workaround is copy all the files into public folder
You can directly install the bootstrap gem and install it.
Open your gemfile and put:
gem 'bootstrap-sass', '~> 3.3.6'
bundle install.
Open your application.css and put:
#import "bootstrap-sprockets";
#import "bootstrap";
Rename your application.css to application.scss
Open your application.js and put:
//= require jquery
//= require bootstrap-sprockets

Rails less/sass conflict

I have a LESS-based rails application.
since I added summernote html editor, I had to add also SASS code to my project.
So I added these lines:
Gemfile:
gem 'font-awesome-rails'
gem 'summernote-rails'
gem 'bootstrap-sass'
application.css:
*= require font-awesome
*= require summernote
In local everything works fine.
When I commit the application to heroku I get the following error:
Sass::SyntaxError: Undefined variable: "$alert-padding".
(in /tmp/build_xxx/vendor/bundle/ruby/2.1.0/gems/bootstrap-sass-3.3.1.0/assets/stylesheets/bootstrap/_alerts.scss:10)
I guess I miss the SASS variables, but have no idea how to add them without create any conflict with the LESS code.
============= EDIT =================
The precompilation is broken on the first sass variable it finds, in file /gems/bootstrap-sass-3.3.1.0/assets/stylesheets/bootstrap/_alerts.scss:
.alert {
padding: $alert-padding;
I assume the precompiler does not have any SASS variable declared, and fails to precompile on the first place it finds any.
============= EDIT =================
I added to my application.scss the #import I understand I needed to have, now it looks like this:
#import "bootstrap-sprockets";
#import "bootstrap/variables";
#import "bootstrap/mixins";
#import "bootstrap";
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require_self
*= require custom_bootstrap/custom_bootstrap
*= require custom
*= require social-share-button
*= require bootstrap-datetimepicker
*= require dataTables/jquery.dataTables
*= require dataTables/src/demo_table_jui
*= require pricing
*= require jquery.fileupload-ui
*= require font-awesome
*= require social-buttons-3.css
*= require summernote
*/
I definitely have _variables.scss included (I renamed it in order to be sure), and I see that $alert-padding is declared:
$alert-padding: 15px !default;
$alert-border-radius: $border-radius-base !default;
$alert-link-font-weight: bold !default;
Still, I get this error!
PD -
I use the following command in order to check precompilation locally:
RAILS_ENV=development bundle exec rake assets:precompile
You can find installation instructions here.
I fail to see at least those:
application.css should be application.scss
gem 'sass-rails' in your Gemfile
use the import statements accordingly and appropriately in your application.scss

Ruby on Rails 4: Installing GEM

I am trying to install my first gem in Ruby, but am having problems with it working. I am not quite sure where I am going wrong, I am following the directions of the gem step by step. I am using Cloud9 for my ide.
The gem I am trying to install is the: wysiwyg-rails gem
I add the following line to the gem file:
gem 'wysiwyg-rails', '1.2.5'
then I add the following to the application.css file so it looks like:
/*
*= require froala_editor.min.css
*= require froala_style.min.css
*= require font-awesome
*= require_tree .
*= require_self
*/
And finally I add the require .js file to the application.js:
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require turbolinks
//= require froala_editor.min.js
//= require plugins/tables.min.js
//= require_tree .
I run bundle install and then restart the server. When I try to load the page, I get the error: couldn't find file 'font-awesome'
However, i can see that font-awesome is installed
Using font-awesome-rails 4.2.0.0
If I remove the *= require font-awesome from the application.css, it starts up without any errors. When I view the source code, I can see the css and js files ( froala_editor) load up, but font-awesome is not one of them. Is there a step that I am missing?
Thanks!
the problem is very strange,the reason is unknown,but i resloved in my program,just add "font-awesome-rails" gem.
gem "font-awesome-rails"
Have you tried installing with font-awesome-less or font-awesome-sass gems to get them up and running?
It seems you are running without any sprockets (asset-pipeline). Add any of those gems, it probably run fine when serving rails s.
After bundle install, go to application.css and write this code as it follows:
#import "font-awesome-sprockets"
#import "font-awesome"
Hope that helps.

Resources