开发者

Rails 3.1 and dynamic jquery ui-theme switch

开发者 https://www.devze.com 2023-04-09 19:33 出处:网络
To be brief: application.css /* *= require_self *= require_tree . *= require vendor */ application.js //= require jquery

To be brief:

application.css

/*
 *= require_self
 *= require_tree .
 *= require vendor
*/

application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require_tree .

and vendor/assets$ tree

.
└── stylesheets
    ├── ui-themes
    │   ├── smoothness
    │   │   ├── images
    │   │   │   ├── ui-bg_flat_0_a开发者_如何学运维aaaaa_40x100.png
    │   │   │   ├── ui-bg_flat_75_ffffff_40x100.png
    │   │   │   ├── ui-bg_glass_55_fbf9ee_1x400.png
    │   │   │   ├── ui-bg_glass_65_ffffff_1x400.png
    │   │   │   ├── ui-bg_glass_75_dadada_1x400.png
    │   │   │   ├── ui-bg_glass_75_e6e6e6_1x400.png
    │   │   │   ├── ui-bg_glass_95_fef1ec_1x400.png
    │   │   │   ├── ui-bg_highlight-soft_75_cccccc_1x100.png
    │   │   │   ├── ui-icons_222222_256x240.png
    │   │   │   ├── ui-icons_2e83ff_256x240.png
    │   │   │   ├── ui-icons_454545_256x240.png
    │   │   │   ├── ui-icons_888888_256x240.png
    │   │   │   └── ui-icons_cd0a0a_256x240.png
    │   │   └── jquery-ui-1.8.16.custom.css
    │   └── trontastic
    │       ├── images
    │       │   ├── ui-bg_diagonals-small_50_262626_40x40.png
    │       │   ├── ui-bg_flat_0_303030_40x100.png
    │       │   ├── ui-bg_flat_0_4c4c4c_40x100.png
    │       │   ├── ui-bg_glass_40_0a0a0a_1x400.png
    │       │   ├── ui-bg_glass_55_f1fbe5_1x400.png
    │       │   ├── ui-bg_glass_60_000000_1x400.png
    │       │   ├── ui-bg_gloss-wave_55_000000_500x100.png
    │       │   ├── ui-bg_gloss-wave_85_9fda58_500x100.png
    │       │   ├── ui-bg_gloss-wave_95_f6ecd5_500x100.png
    │       │   ├── ui-icons_000000_256x240.png
    │       │   ├── ui-icons_1f1f1f_256x240.png
    │       │   ├── ui-icons_9fda58_256x240.png
    │       │   ├── ui-icons_b8ec79_256x240.png
    │       │   ├── ui-icons_cd0a0a_256x240.png
    │       │   └── ui-icons_ffffff_256x240.png
    │       └── jquery-ui-1.8.16.custom.css
    └── vendor.css.erb

Then my problem is how to dynamic load jquery theme css through params[:theme], i tried

/*
*= require "ui-themes/<%= params[:theme] %>/jquery-ui-1.8.16.custom"
*
*/

in vendor.css.erb, but not lucky.

thanks for any help.


  1. solution, include all possible themes in your css file, but scope them, i.e. nest all rules under a distinct body id (or class) e.g. #theme-1 ui-widget-... { .. } etc... then switch the id of your body tag dynamically

  2. solution make an own css for every theme (each also including your other styles), add those files to config.assets.precompile in your config/environments/production.rb, disable the hash cache buster suffix (there is a question here at stack overflow how to do this) and then switch stylesheets on your server side (in your layout) by param

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号