

Flat UI Pro デザインフレームワークを [reflection/designmodo-flatuipro-
rails](http://joanswork.com/add-flat-ui-pro-to-rails/) を使って、Rails4.2
のプロジェクトにインストールしようとしています。  
[参考サイト](http://joanswork.com/add-flat-ui-pro-to-
rails/)の手順でやっているのですが、うまく適用できません

* * *

**STEP1**

  * `Flat-UI-HTML-Developers-License.zip` をダウンロードしてデスクトップに解凍
  * 解凍後のフォルダ名は `Flat UI HTML - Developers License`
  * 上記のフォルダ名を `flat-ui-pro` に変更

プロジェクトのコンソールから`bower.json`ファイルが有るディレクトリに移動し、`bower install`

  1. `cd`
  2. `cd Desktop`
  3. `cd flat-ui-pro`
  4. `cd HTML`
  5. `cd UI`
  6. `cd Flat-UI-Pro-1.3.2`
  7. `bower install`

* * *

**STEP2**

[code]

    gem 'less-rails'
    gem 'twitter-bootstrap-rails'
    gem 'jquery-ui-rails'
    gem 'designmodo-flatuipro-rails', '~> 1.3.2.0.branch'
    gem 'therubyracer', platforms: :ruby
    
    bundle update
    bundle install
    
[/code]

**STEP2 後の`app/assets/stylesheets`**

![画像の説明をここに入力](https://i.stack.imgur.com/AObw2.png)

* * *

**STEP3**

プロジェクトのカントディレクトリにて

[code]

    bin/rails generate flatuipro:install ~/Desktop/flat-ui-pro
    
[/code]

**STEP3 後の`app/assets/stylesheets`**

![画像の説明をここに入力](https://i.stack.imgur.com/3Zx40.png)

**STEP3 後の`http://0.0.0.0:3000/posts`**

![画像の説明をここに入力](https://i.stack.imgur.com/WUiJd.png)

* * *

**STEP4**

[code]

    rake assets:clean RAILS_ENV=development
    rake assets:precompile RAILS_ENV=development
    
[/code]

**STEP4 後の`app/assets/stylesheets`**

![画像の説明をここに入力](https://i.stack.imgur.com/3Zx40.png)

**STEP4 後の`http://0.0.0.0:3000/posts`** 変化なし

![画像の説明をここに入力](https://i.stack.imgur.com/WUiJd.png)

* * *

**STEP5**

[code]

    rails generate flatuipro:demo
    
[/code]

**STEP5 後の`app/assets/stylesheets`**

![画像の説明をここに入力](https://i.stack.imgur.com/XVx1L.png)

**STEP5 後の`http://0.0.0.0:3000/posts`** 変化なし

![画像の説明をここに入力](https://i.stack.imgur.com/WUiJd.png)

**STEP5 後の`http://0.0.0.0:3000/flatuipro_demo/index`**

![画像の説明をここに入力](https://i.stack.imgur.com/ULriU.png)

**`scaffolds.scss` を削除した後の `http://0.0.0.0:3000/posts`**  
![画像の説明をここに入力](https://i.stack.imgur.com/Kz8OI.png)

**`scaffolds.scss` を削除した後の `http://0.0.0.0:3000/flatuipro_demo/index`**  
**配置やレイアウトが変**  
![画像の説明をここに入力](https://i.stack.imgur.com/KJrmo.png)

**select boxが変**

![画像の説明をここに入力](https://i.stack.imgur.com/onWgr.png)


CC BY-SA 4.0
2015-06-16T03:54:41.023
11394
2019-05-30T16:16:10.813
2019-05-30T16:16:10.813
2238
9453
question
ruby-on-rails twitter-bootstrap
Flat UI proの適用ができない