administrate-bootstrap-theme 0.1.8 → 1.0.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: eb9d26e362dbe536ab4a0e4ecc13e3f1935ed019da480dfe9f659c78948f7527
-  data.tar.gz: 02d4b2e5676e89002e6d39bd5cf90debf51b9d8bd42aed9a2badf4f0461c0088
+  metadata.gz: d1492386198ceaae235aab382f3e29d5afb4b3182c58b3b0d3414c020a8bd36b
+  data.tar.gz: c76a13626f1f7144fcc9a0ab045feebef89496620955fd1af71f230a02d33888
 SHA512:
-  metadata.gz: da4bd70e2e13d72f2ef0af348ec28f6d61469b176ac3be83866c387d439641f112a33ea6fe8474350014668a97068c6fd7e717fbcd0e538063403811f8fbf358
-  data.tar.gz: d39de72ce3659ab179388ec8dc685a89696801185fe50e203894dc9b923e62d6d66f335905dfdbd58bf7e2a94a08669ebd641446d828f474079da47d44aba00b
+  metadata.gz: 21452eb50afdd29d1ed61c3badda42e3470150c4234e41761f6bc9cf9183b7b650f7c6e89f847a48a0ae1c1fa025be8292ad7e377b7efadfb7c20fe4c8074f89
+  data.tar.gz: 2bfe2c0f41a090560c16959ef1263502f9f733fa69d6d18ad86578b1642a6c81dd3ddd3506e26c329b53a4d979131f995dd267c9d18657d1f35a762951a03ebe

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)
-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).