tabler rubygem

Tabler 紅寶石

用於 Ruby on Rails 的 Tabler ruby​​ gem。

安裝

請參閱適合您選擇的環境的指南：

• Ruby on Rails 4+ 或其他 Sprockets 環境。

• 其他不在 Rails 上的 Ruby 框架。

一個。紅寶石 on Rails

---

v0.1.4 重大變更：

預設不再包含圖像。相反，您可以包含所有圖像集或您想要的特定圖像集（瀏覽器、標記和/或付款）。 請閱讀下文，以了解有關如何執行此操作的更多資訊。

---

將bootstrap和tabler-rubygem加入您的 Gemfile 中：

 gem 'bootstrap', '~> 4.1.1'gem 'tabler-rubygem'

確保sprockets-rails至少為 v2.3.2。

bundle install並重新啟動伺服器以使檔案可以透過管道使用。

在app/assets/stylesheets/application.scss中匯入 Tabler 樣式和可選的 Tabler 外掛程式樣式和圖示：

 // 自訂 tabler 變數必須在 bootstrap 和 tabler 之前設定或匯入。 // 可選@import "tabler.icons"; // 可選包括[瀏覽器、標誌、付款]

可用的變數可以在這裡找到。
Tabler 外掛程式包含此處找到的 javascript 的 css 檔案。

您也可以選擇在每個插件的基礎上包含插件 css，例如：

 // 自訂tabler 變數必須在*before* tabler.@import "tabler/variables";@import "bootstrap";@import "tabler";@import "tabler/plugins/charts-c3/plugin.scss" 設定或導入;

或包含每種類型的圖示 css，例如：

 // 自訂 tabler 變數必須在 *before* tabler.@import "tabler/variables";@import "bootstrap";@import "tabler";@import "tabler/icons/flag";

確保檔案具有.scss副檔名（或.sass用於 Sass 語法）。如果您剛剛產生了一個新的 Rails 應用程序，它可能會附帶一個.css檔案。如果此檔案存在，它將取代 Sass 提供服務，因此將其重新命名：

 $ mv app/assets/stylesheets/application.css app/assets/stylesheets/application.scss

然後，從 Sass 檔案中刪除所有*= require和*= require_tree語句。相反，使用@import導入 Sass 檔案。

不要在 Sass 中使用*= require ，否則你的其他樣式表將無法存取 Tabler mixins 和變數。

將 Tabler 和可選的 Tabler 外掛程式新增至您的application.js ：

 //= 需要 tabler //= 需要 tabler.plugins

Tabler 已經包含 jQuery 和 Bootstrap javascript。
Tabler 外掛程式包含此處找到的 javascript。

如果您已經在專案中包含 jQuery，則可以在每個檔案的基礎上包含 tabler 的 js 以避免衝突：

 // = 需要 tabler/tabler// = 需要 tabler/vendors/bootstrap.bundle.min // = 需要 tabler/vendors/circle-progress.min // = 需要 tabler/vendors/jquery.sparkline.min // = 需要表/核心

您也可以選擇在每個插件的基礎上包含插件 js，例如：

 //= 需要 tabler//= 需要 tabler/plugins/charts-c3/js/d3.v3.min//= 需要 tabler/plugins/charts-c3/js/c3.min

b.其他 Ruby 框架

如果您的框架使用 Sprockets 或 Hanami，則當需要 gem 時，資源將在 Sprockets 中註冊，您可以按照指南的 Rails 部分使用它們。

否則您可能需要手動註冊資產。請參閱有關該主題的框架文件。

配置

Sass：自動前綴器

Tabler 需要使用 Autoprefixer。 Autoprefixer 使用 Can I Use 中的值將供應商前綴新增至 CSS 規則。

如果您將 tabler 與 Rails 一起使用，則會自動為您設定 autoprefixer。否則，請查閱 Autoprefixer 文件。

Sass：單獨的組件

預設情況下，所有 Tabler 都會被導入。

您也可以明確匯入元件。要從完整的模組清單開始，請將_tabler.scss檔案作為_tabler-custom.scss複製到您的資產中。然後從_tabler-custom中註解掉您不需要的元件。在應用程式 Sass 檔案中，將@import 'tabler'替換為：

 @import 'tabler-custom'；