administrate-bootstrap-theme 0.1.9 → 1.0.1

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: c179fa187eba0bd5d2a559db05a527b1cdde088000608bee63f9eed413aa8288
-  data.tar.gz: f0b2b078a5f189eb914dc8d0f70affc23fc91bf7b05fffa11ad6aee35ed064c3
+  metadata.gz: 959dad30755f6f5f6b83f7b6e2a2e537363aded614a1509161d649391eac2e1b
+  data.tar.gz: 34fb78bf956e0722122d5a62da1716ef2c5eb4e7d1438d6773fac700008c05df
 SHA512:
-  metadata.gz: 89a9486a51c81bf5a59b5866ced85fb658e6bdc1da5105f7a4876266f75d27f066e2c3aad3523c6177e2ab4b82b3d6e0aab0b6971565b238ef36dc6a5949f973
-  data.tar.gz: 52526a552b243d3d72a0eba83d321e23fe7a7f3af3f88e9e70a291a09d31211e4a357a8ed250ae00cda75371f9bb62fb5ed8a856ab202f31343f235e6ea82354
+  metadata.gz: ec97143b8ae01cee0afbd71caff3f1fd761f9e1f0675fab7e9b4fce3f21d4b339cc1835c3ac8d6f8981a706f2751e35bf3bb874aec385e135c734c0229ed2f48
+  data.tar.gz: 32a09612b9da3d51c290905fbbc22fb600f0c8d11df246a4c43fefcb63d086a84be8691c748cadee52ef06b2e88986ad99b2a5f6d2c2347721658442af573b4e

data/README.md

@@ -1,65 +1,106 @@
-# Administrate Bootstrap Theme [![Gem Version](https://badge.fury.io/rb/administrate-bootstrap-theme.svg)](https://badge.fury.io/rb/administrate-bootstrap-theme) ![specs](https://github.com/blocknotes/administrate-bootstrap-theme/actions/workflows/ruby.yml/badge.svg)
-A Bootstrap 5 (_beta_) theme for [Administrate](https://github.com/thoughtbot/administrate).
+# Administrate Bootstrap Theme
+[![gem version](https://badge.fury.io/rb/administrate-bootstrap-theme.svg)](https://badge.fury.io/rb/administrate-bootstrap-theme)
+[![gem downloads](https://badgen.net/rubygems/dt/administrate-bootstrap-theme)](https://rubygems.org/gems/administrate-bootstrap-theme) 
+[![linters](https://github.com/blocknotes/administrate-bootstrap-theme/actions/workflows/linters.yml/badge.svg)](https://github.com/blocknotes/administrate-bootstrap-theme/actions/workflows/linters.yml)
+[![specs](https://github.com/blocknotes/administrate-bootstrap-theme/actions/workflows/specs.yml/badge.svg)](https://github.com/blocknotes/administrate-bootstrap-theme/actions/workflows/specs.yml)
+
+A Bootstrap 5 theme for [Administrate](https://github.com/thoughtbot/administrate).
 
 Features:
-- easy to install, just include CSS/JS to apply the theme to a default Administrate structure;
+- easy to install: just run the generator installer;
 - customizable via SASS variables;
 - allow to use *Bootstrap* components in the admin.
 
 See some [screenshots](#screenshots).
 
+Please :star: if you like it.
+
 ## Installation
-- Add to *Gemfile* (of an Administrate project): `gem 'administrate-bootstrap-theme'` (and execute `bundle`)
-- Add to *app/assets/config/manifest.js*:
 
-```js
-//= link administrate-bootstrap-theme/theme.css
-//= link administrate-bootstrap-theme/theme.js
-```
+- Add to *Gemfile* (of an Administrate project): `gem 'administrate-bootstrap-theme', '~> 1.0'` (and execute `bundle`)
+- Run the installer: `bin/rails generate administrate_bootstrap_theme:install`
 
-- Generate the layout views if they are missing: `rails generate administrate:views:layout` (only **_stylesheet** and **_javascript** partials are needed)
-- Update *app/views/admin/application/_stylesheet.html.erb*, leaving only:
+## Customizations
 
-```erb
-<%= stylesheet_link_tag 'administrate-bootstrap-theme/theme', media: 'all' %>
-<%= yield :stylesheet %>
+Edit the variables defined in *app/assets/stylesheets/administrate-bootstrap-theme.scss*:
+
+```scss
+$navigation-width: 250px;
+$navigation-bg: #055160;
+$navigation-bg-active: #d51;
+$navigation-fg: #eee;
+$primary: #0d6ecd;
+$secondary: #666;
+$main-content-bg: #f4f8fb;
+$main-content-fg: #222;
+
+@import 'administrate-bootstrap-theme/theme'; // required after the variables setup
 ```
 
-- Update *app/views/admin/application/_javascript.html.erb*, leaving only:
+### Extra improvements
 
-```erb
-<%= javascript_include_tag 'administrate-bootstrap-theme/theme' %>
-<%= yield :javascript %>
+Choose a predefined color schema - *app/assets/stylesheets/administrate-bootstrap-theme.scss*:
+
+```scss
+@import 'administrate-bootstrap-theme/colors/default';
+// @import 'administrate-bootstrap-theme/colors/autumn';
+// @import 'administrate-bootstrap-theme/colors/forest';
+// @import 'administrate-bootstrap-theme/colors/industrial';
+// @import 'administrate-bootstrap-theme/colors/water';
+@import 'administrate-bootstrap-theme/theme';
 ```
 
-## Customizations
-To change variables it's necessary to create a new *.scss* (or *.sass*) file like this one (ex. *admin.scss*):
+Set a UI font:
 
+- you can of course import any font from Google fonts (or other providers);
+- to use a pre-configured one - *app/assets/stylesheets/administrate-bootstrap-theme.scss*:
 ```scss
-// app/assets/stylesheets/admin.scss
-$navigation-width: 300px;
+@import 'administrate-bootstrap-theme/fonts/roboto';
+// @import 'administrate-bootstrap-theme/fonts/lato';
+// @import 'administrate-bootstrap-theme/fonts/montserrat';
+// @import 'administrate-bootstrap-theme/fonts/open_sans';
+// @import 'administrate-bootstrap-theme/fonts/source_sans_pro';
 @import 'administrate-bootstrap-theme/theme';
 ```
 
-And replace the link tag in the *application.html.erb* with: `<%= stylesheet_link_tag 'admin', media: 'all' %>`
-
-For the complete list of options take a look [here](app/assets/stylesheets/administrate-bootstrap-theme/_variables.scss).
+For more improvements to the sidebar:
+
+- generate the navigation partial: `bin/rails generate administrate:views:navigation`
+- edit the partial *app/views/admin/application/_navigation.html.erb*
+- to change the _Back to app_ button to a title component: replace the classes for the first link (_back_to_app_) with `button--title`
+- update the translation button title editing *config/locales/en.yml*:
+```yml
+en:
+  administrate:
+    navigation:
+      back_to_app: 'MyAdmin'
+```
+- to add a copyright line at the bottom, update the links part with:
+```erb
+<div class="mb-auto">
+  <% Administrate::Namespace.new(namespace).resources_with_index_route.each do |resource| %>
+    ...
+  <% end %>
+</div>
+<div class="copy">by Mat</div>
+```
 
 ## Screenshots
-- Index page:
-![screenshot_index](screenshot_index.png)
-- Show page:
-![screenshot_show](screenshot_show.png)
-- Form page:
-![screenshot_form](screenshot_form.png)
+
+- Index, show and edit pages: ![Administrate Bootstrap Theme sections](extra/screenshot_sections.png)
+- Index page with some customized colors: ![Administrate Bootstrap Theme index page customized](extra/screenshot_index_alt.png)
+- Color schemas (none, default, autumn, forest, water, industrial): ![Administrate Bootstrap Theme colors](extra/screenshot_colors.png)
 
 ## Do you like it? Star it!
+
 If you use this component just star it. A developer is more motivated to improve a project when there is some interest.
 
 Or consider offering me a coffee, it's a small thing but it is greatly appreciated: [about me](https://www.blocknot.es/about-me).
 
 ## Contributors
+
 - [Mattia Roccoberton](https://blocknot.es/): author
 
 ## License
+
 The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).