tabler rubygem
1.0.0
Ruby on Rails용 Tabler 루비 보석입니다.
선택한 환경에 적합한 가이드를 참조하세요.
Ruby on Rails 4+ 또는 기타 Sprockets 환경.
Rails에 없는 다른 Ruby 프레임워크.
v0.1.4 주요 변경 사항:
이미지는 더 이상 기본적으로 포함되지 않습니다. 대신 모든 이미지 세트 또는 원하는 특정 이미지 세트(브라우저, 플래그 및/또는 결제)를 포함할 수 있습니다. 이 작업을 수행하는 방법에 대한 자세한 내용은 아래를 읽어보세요.
Gemfile에 bootstrap 및 tabler-rubygem 추가합니다.
gem 'bootstrap', '~> 4.1.1'gem 'tabler-rubygem'
sprockets-rails 이 v2.3.2 이상인지 확인하세요.
bundle install 하고 서버를 다시 시작하여 파이프라인을 통해 파일을 사용할 수 있게 만드세요.
app/assets/stylesheets/application.scss 에서 Tabler 스타일과 선택적으로 Tabler 플러그인 스타일 및 아이콘을 가져옵니다.
// 사용자 정의 테이블러 변수는 부트스트랩 및 tabler *전에* 설정하거나 가져와야 합니다.@import "tabler/variables";@import "bootstrap";@import "tabler";@import "tabler.plugins"; // 선택사항@import "tabler.icons"; // 선택사항에는 [브라우저, 플래그, 결제]가 포함됩니다.
사용 가능한 변수는 여기에서 확인할 수 있습니다.
Tabler 플러그인에는 여기에 있는 자바스크립트용 CSS 파일이 포함되어 있습니다.
또한 플러그인별로 플러그인 CSS를 포함하도록 선택할 수도 있습니다. 예를 들면 다음과 같습니다.
// 사용자 정의 테이블 변수는 *전에* tabler.@import "tabler/variables";@import "bootstrap";@import "tabler";@import "tabler/plugins/charts-c3/plugin.scss" 설정하거나 가져와야 합니다. ;
또는 유형별로 아이콘 CSS를 포함합니다. 예:
// 사용자 정의 테이블 변수는 *전에* tabler.@import "tabler/variables";@import "bootstrap";@import "tabler";@import "tabler/icons/flag"; 전에 설정하거나 가져와야 합니다.
파일의 확장자가 .scss (또는 Sass 구문의 경우 .sass )인지 확인하세요. 방금 새로운 Rails 앱을 생성했다면 대신 .css 파일이 함께 제공될 수 있습니다. 이 파일이 있으면 Sass 대신 제공되므로 이름을 바꾸십시오.
$ mv 앱/자산/stylesheets/application.css 앱/assets/stylesheets/application.scss
그런 다음 Sass 파일에서 모든 *= require 및 *= require_tree 문을 제거합니다. 대신 @import 사용하여 Sass 파일을 가져오세요.
Sass에서 *= require 사용하지 마십시오. 그렇지 않으면 다른 스타일시트가 Tabler 믹스인 및 변수에 액세스할 수 없습니다.
application.js 에 Tabler 및 선택적으로 Tabler 플러그인을 추가합니다.
//= tabler가 필요합니다.//= tabler.plugins가 필요합니다.
Tabler에는 이미 jQuery 및 Bootstrap javascript가 포함되어 있습니다.
Tabler 플러그인에는 여기에 있는 자바스크립트가 포함되어 있습니다.
프로젝트에 이미 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 필요
프레임워크에서 Sprockets 또는 Hanami를 사용하는 경우 gem이 필요할 때 자산이 Sprockets에 등록되며 가이드의 Rails 섹션에 따라 사용할 수 있습니다.
그렇지 않으면 자산을 수동으로 등록해야 할 수도 있습니다. 해당 주제에 대한 프레임워크 문서를 참조하세요.
Tabler에는 Autoprefixer를 사용해야 합니다. Autoprefixer는 Can I Use의 값을 사용하여 CSS 규칙에 공급업체 접두사를 추가합니다.
Rails와 함께 Tabler를 사용하는 경우 autoprefixer가 자동으로 설정됩니다. 그렇지 않은 경우 Autoprefixer 설명서를 참조하세요.
기본적으로 모든 Tabler를 가져옵니다.
구성 요소를 명시적으로 가져올 수도 있습니다. 전체 모듈 목록으로 시작하려면 _tabler.scss 파일을 자산에 _tabler-custom.scss 로 복사하세요. 그런 다음 _tabler-custom 에서 원하지 않는 구성 요소를 주석 처리합니다. 애플리케이션 Sass 파일에서 @import 'tabler' 다음으로 바꿉니다.
@import '테이블러-커스텀';
