# My Themes
其引入的文件為: horizon\openstack_dashboard\themes\maintenance\static\_variables.scss。在該文件里,分別引入二個文件bootstarp/variables 和 horizon/variables。其代碼如下:
~~~
@import "bootstrap/variables";
@import "horizon/variables";
~~~
## 1. bootstrap/variables
其對應的文件路徑為: horizon\openstack_dashboard\themes\maintenance\static\bootstrap\_variables.scss。
重新定義定義字體的路徑、引入 variable_customizations 和 bootswatch Paper Variables。其代碼如下:
~~~
// Override the web font path ... we want to set this ourselves
$web-font-path: $static_url + "/horizon/lib/roboto_fontface/css/roboto-fontface.css";
$roboto-font-path: $static_url + "/horizon/lib/roboto_fontface/fonts";
@import "variable_customizations";
// Bootswatch Paper
// Variables
// --------------------------------------------------
@import "/horizon/lib/bootswatch/paper/variables";
~~~
### 1.1 variable_customizations
其路徑為:horizon\openstack_dashboard\themes\maintenance\static\bootstrap\_variable_customizations.scss。其定義了一些顏色樣式變量值。自己引入樣式時不需要管它。
### 1.2 bootswatch Paper Variables
其路徑為: horizon\static\horizon\lib\bootswatch\paper\_variables.scss。這里面也是定義一些CSS樣式的變量值。
## 2 horizon/variables
其對應的文件路徑為: 、horizon\openstack_dashboard\themes\maintenance\static\horizon\_variables.scss。這里面就定義了幾個樣式變量,不用理會它。
- 1.概述
- 2.CSS樣式引入
- 2.1 My Themes
- 2.2 Horizon
- 2.3 Angular
- 2.4 HORIZON_CONFIG.scss_files
- 2.5 Custom Styles
- 3. JS文件引入
- 31. iframe_embed_settings 標簽
- 3.2 horizon/_conf.html
- 3.3 _script_loader.html
- 3.4 _custom_head_js.html
- 3.5 horizon/_scripts.html
- 4. 主題替換
- 4.1 ACE主題
- 4.2 引入ACE主題的CSS樣式
- 4.3 引入ACE主題的JS文件
- 4.4 收集和壓縮
- 4.5 總結
- 4.6 錯誤與沖突收集
- 5.錯誤修正
- 6.openstack里所有功能瀏覽
- 7.前端hightchart.js分析
- 8.命令使用