All geek questions in one place

Using a Canvas Theme from Themeforest in Rails 4

I am trying to create a Rails 4 application using the Canvas theme from Themeforest and it runs my ass.

I was looking for several ways to put CSS / JS in the correct folders, and I even had success with it using this tutorial . Yes!

When I try to use the same method with the Canvas theme, all hell breaks. The topic contains the following:

Canvas-Theme/

 - css/
    - fonts/
        - (a bunch of custom fonts)
    - animate.css
    - bootstrap.css
    - calendar.css
    - camera.css
    - colors.css
    - colors.php
    - dark.css
    - font-icons.css
    - fonts.css
    - magnific-popup.css
    - nivo-slider.css
    - responsive.css
    - vmap.css
 - images/
    - (a bunch of images)
 - js/
    - canvas.slider.fade.js
    - events-data.js
    - functions.js
    - jquery.calendario.js
    - jquery.camera.js
    - jquery.elastic.js
    - jquery.gmap.js
    - jquery.js
    - jquery.mousewheel.min.js
    - jquery.nivo.js
    - jquery.vmap.js
    - plugins.js

 - (tons of HTML templates)
 - style.css
 - style.less

In my Rails application, I use the default installation (except mysql), which includes the following stones:

gem 'rails', '4.1.7'
# Use mysql as the database for Active Record
gem 'mysql2'
# Use SCSS for stylesheets
gem 'sass-rails', '~> 4.0.3'
# Use Uglifier as compressor for JavaScript assets
gem 'uglifier', '>= 1.3.0'
# Use CoffeeScript for .js.coffee assets and views
gem 'coffee-rails', '~> 4.0.0'
# See https://github.com/sstephenson/execjs#readme for more supported runtimes
# gem 'therubyracer',  platforms: :ruby

# Use jquery as the JavaScript library
gem 'jquery-rails'
# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks
gem 'turbolinks'
# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder
gem 'jbuilder', '~> 2.0'
# bundle exec rake doc:rails generates the API under doc/api.
gem 'sdoc', '~> 0.4.0',          group: :doc

# Use ActiveModel has_secure_password
# gem 'bcrypt', '~> 3.1.7'

# Use unicorn as the app server
# gem 'unicorn'

# Use Capistrano for deployment
# gem 'capistrano-rails', group: :development

# Use debugger
# gem 'debugger', group: [:development, :test]

# Windows does not include zoneinfo files, so bundle the tzinfo-data gem
gem 'tzinfo-data', platforms: [:mingw, :mswin]

I dumped all CSS files in

app/assets/stylesheets/

and all js in

app/assets/javascript/

I also created a folder with fonts and put included fonts there

app/assets/fonts/

Here is my application.js:

//= require jquery
//= require turbolinks
//= require_tree .

Here is my application.css

*= require_tree .
*= require_self

Canvas-Theme style.css, stylesheets. , .

HTML index.html.erb, . , , - .

,

  • jquery.js, , Rails ?
  • bootstrap "bootstrap.css"?

!

+4
2

. , JavaScript. , appilcation.js:

//= require jquery
//= require turbolinks
//= require_tree .
//= require functions

functions.js vendors/assets/javascript, . , . , CSS/JS. , , . , .

+3

@Craigfoo, . , appilcation.js, functions.js vendors/assets/javascript /layouts/application.html.erb

<!DOCTYPE html>
<html>
<head>
  <title>Canvas</title>
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <%= csrf_meta_tags %>
</head>
<body>

  <%= yield %>
  <%= javascript_include_tag 'functions', 'data-turbolinks-track' => true %>

</body>
</html>

. config/initializers/assets.rb :

Rails.application.config.assets.precompile += %w( functions.js )
0

Source: https://habr.com/ru/post/1570232/

More articles:


All Articles