rails_material_admin 0.1.7 → 0.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: f4b3364f18972b77b40153b8aa0ebd70bc58cddb61756e57989a2bebde6d8a5a
4
- data.tar.gz: 8da212e4b2f996bd258c687dce0e7bcde0cbe214222fdfc6fd7c33cddaa9048c
3
+ metadata.gz: 30f45ca5e4d9f67587182dac5886ac98d0fb575be7e678abbaab1acea81cec81
4
+ data.tar.gz: 23df68a00ad1c35c9992837ab57e2f1e98b325556262a3aaae9a96062444d792
5
5
  SHA512:
6
- metadata.gz: 8b8297f2577f2ffd71c83c072f1718ad7861d85b32b1efe24f081d096b24d43b6b9f30eebe552feb4b7d80d3e7045453f756f4173f75796d815d18f300d7992a
7
- data.tar.gz: 80900e997b9f24df31e43c9c575cb6c7187b3c3202de4295ddf1a361d63dacd8679a1ab808094c38da7689bf8ac197fa7e0259d003c5ebde04f9808e42619471
6
+ metadata.gz: 3c3d54ae2f3aa56b688c62fab3cff22c787663b6086b6509d84912adfa946fe8566858d5141464919aa7ee2b784a255cfbbe6d95c4d844b79cb615485d853858
7
+ data.tar.gz: c78896ab2cbc88e3721e27c4e52d173caddc996777c3d80fede6715b8f66ce57fe5a684ff70295b6e7d8134c3c2e8ee5fceef3058ad0ebe085ba5d6c5a630029
data/README.md CHANGED
@@ -1,7 +1,7 @@
1
1
  # MaterialAdmin
2
2
  Use rails webpacker to bundle the material admin template.
3
3
 
4
- https://www.wrappixel.com/demos/admin-templates/material-pro/Documentation/document.html
4
+ https://wrappixel.com/demos/admin-templates/materialpro-bootstrap-latest/material-pro/src/material/ui-scrollspy.html#list-item-2
5
5
 
6
6
  Easily install and set up admin quickly
7
7
 
@@ -17,4 +17,29 @@ module ApplicationHelper
17
17
  def sort_opt(model, column)
18
18
  { model: model, column: column }.to_json
19
19
  end
20
+
21
+ def sidebar_item_classes(c_names, *a_names)
22
+ class_names = 'sidebar-item'
23
+
24
+ if a_names.any?
25
+ class_names += ' selected' if controller_name.in?(c_names) && action_name.in?(a_names)
26
+ else
27
+ class_names += ' selected' if controller_name.in? c_names
28
+ end
29
+
30
+ class_names
31
+ end
32
+
33
+ def sidebar_item_link_classes(c_names, *a_names)
34
+ class_names = 'sidebar-link waves-effect waves-dark sidebar-link'
35
+
36
+ if a_names.any?
37
+ class_names += ' active' if controller_name.in?(c_names) && action_name.in?(a_names)
38
+ else
39
+ class_names += ' active' if controller_name.in? c_names
40
+ end
41
+
42
+ class_names
43
+ end
44
+
20
45
  end
@@ -1,30 +1,33 @@
1
- section#wrapper
2
- .login-register
3
- .login-box.card
4
- .card-body
5
- = form_for resource,
6
- as: resource_name,
7
- url: session_path(resource_name),
8
- html: { class: 'form-horizontal form-material' } do |f|
1
+ .auth-wrapper.d-flex.no-block.justify-content-center.align-items-center
2
+ .auth-box.p-4.bg-white.rounded
3
+ #loginform
4
+ .logo
5
+ h3.box-title.mb-3 Sign In
9
6
 
10
- h3.box-title.m-b-20 Sign In
7
+ .row
8
+ .col-12
9
+ = form_for resource,
10
+ as: resource_name,
11
+ url: session_path(resource_name),
12
+ html: { class: 'form-horizontal mt-3 form-material', id: 'loginform' } do |f|
11
13
 
12
- .form-group
13
- .col-xs-12
14
- = f.email_field :email, autofocus: true, autocomplete: "email", class: 'form-control'
14
+ .form-group.mb-3
15
+ .col-xs-12
16
+ = f.email_field :email, autofocus: true, autocomplete: "email", class: 'form-control', placeholder: 'Email'
15
17
 
16
- .form-group
17
- .col-xs-12
18
- = f.password_field :password, autocomplete: "current-password", class: 'form-control'
18
+ .form-group.mb-4
19
+ .col-xs-12
20
+ = f.password_field :password, autocomplete: "current-password", class: 'form-control', placeholder: 'Password'
19
21
 
20
- - if devise_mapping.rememberable?
21
- .form-group
22
- .d-flex.no-block.align-items-center
23
- .checkbox.checkbox-primary.p-t-0
24
- = f.check_box :remember_me
25
- = f.label :remember_me
22
+ - if devise_mapping.rememberable?
23
+ .form-group
24
+ .d-flex
25
+ div class="checkbox checkbox-info pt-0"
26
+ input id="checkbox-signup" type="checkbox" class="material-inputs chk-col-indigo"
27
+ label for="checkbox-signup" Remember me
28
+
29
+ .form-group.text-center.mt-4.mb-3
30
+ .col-xs-12
31
+ = f.submit "Log in", class: 'btn btn-info d-block w-100 waves-effect waves-light'
26
32
 
27
- .form-group.text-center.m-t-20
28
- .col-xs-12
29
- = f.submit "Log in", class: 'btn btn-info btn-lg btn-block text-uppercase waves-effect waves-light'
30
33
 
@@ -17,17 +17,28 @@ html xmlns:wb="http://open.weibo.com/wb"
17
17
  /! Preloader - style you can find in spinners.css
18
18
  // NOTE: Need fix for turbolinks.
19
19
  / .preloader
20
- / svg.circular viewbox=("25 25 50 50")
20
+ / svg.circular viewbox=("25 25 50 50")
21
21
  / circle.path cx="50" cy="50" fill="none" r="20" stroke-miterlimit="10" stroke-width="2" /
22
22
 
23
23
  /! Main wrapper - style you can find in pages.scss
24
- #main-wrapper
24
+ #main-wrapper[
25
+ data-theme="light"
26
+ data-layout="vertical"
27
+ data-navbarbg="skin1"
28
+ data-sidebartype="full"
29
+ data-sidebar-position="fixed"
30
+ data-header-position="fixed"
31
+ data-boxed-layout="full"
32
+ ]
25
33
  = render 'admin/shared/header'
26
34
  = render 'admin/shared/sidebar'
27
-
28
- .page-wrapper
35
+
36
+ .page-wrapper style="display: block;"
37
+ = yield :breadcrumb
38
+
29
39
  .container-fluid
30
- = yield :breadcrumb
40
+ = yield :error_messages
41
+
31
42
  .row
32
43
  = yield
33
44
 
@@ -1,8 +1,13 @@
1
- - if resource.errors.any?
1
+ - targets = Array(target).select { |ele| ele.errors.any? }
2
+
3
+ - if targets.any?
2
4
  #error_explanation
3
- h2
4
- = I18n.t("errors.messages.not_saved", count: resource.errors.count, resource: resource.class.model_name.human.downcase)
5
- ul
6
- - resource.errors.full_messages.each do |message|
7
- li
8
- = message
5
+ div [
6
+ class="alert customize-alert alert-dismissible alert-light-danger text-danger fade show"
7
+ role="alert"
8
+ ]
9
+ button.btn-close aria-label="Close" data-bs-dismiss="alert" type="button"
10
+
11
+ - targets.map(&:errors).map(&:messages).map(&:values).flatten.each do |message|
12
+ | #{message}
13
+
@@ -0,0 +1,14 @@
1
+ - if flash.any?
2
+ - flash.each do |name, msg|
3
+ - if [String, Array].include?(msg.class)
4
+ - message = msg.is_a?(Array) ? msg.join('<br>').html_safe : msg
5
+
6
+ div [
7
+ class="alert customize-alert alert-dismissible alert-light-#{name.to_s == 'notice' ? 'success' : 'danger'} text-danger fade show"
8
+ role="alert"
9
+ ]
10
+ button.btn-close aria-label="Close" data-bs-dismiss="alert" type="button"
11
+
12
+ .d-flex.align-items-center.font-weight-medium
13
+ i.text-danger.fill-white.feather-sm.me-2 data-feather="info" = message
14
+
@@ -1,9 +1,11 @@
1
1
  /! Topbar header - style you can find in pages.scss
2
- header.topbar
3
- nav.navbar.top-navbar.navbar-expand-md.navbar-light
4
- /! Logo
5
- .navbar-header
6
- a.navbar-brand href="/" tppabs="https://wrappixel.com/demos/admin-templates/material-pro/material/index.html"
2
+ header.topbar data-navbarbg="skin1"
3
+ nav.navbar.top-navbar.navbar-expand-md.navbar-dark
4
+ .navbar-header data-logobg='skin1'
5
+ a.nav-link.nav-toggler.d-block.d-md-none.text-muted.waves-effect.waves-dark href="javascript:void(0)"
6
+ i.mdi.mdi-menu
7
+
8
+ a.navbar-brand href="/admin" tppabs="https://wrappixel.com/demos/admin-templates/material-pro/material/index.html"
7
9
  /! Logo icon
8
10
  b
9
11
  /! You can put here icon as well // <i class="wi wi-sunset"></i> //
@@ -11,14 +13,16 @@ header.topbar
11
13
  / img.dark-logo alt="homepage" src="../assets/images/logo-icon.png" /
12
14
  /! Light Logo icon
13
15
  / img.light-logo alt="homepage" src="../assets/images/logo-light-icon.png" /
14
- / = image_tag nil, width: 45, class: 'light-logo'
15
- span.inline-block.ml10 Logo
16
- .navbar-collapse
17
- ul.navbar-nav.mr-auto.mt-md-0
18
- li.nav-item
19
- a.nav-link.nav-toggler.hidden-md-up.text-muted.waves-effect.waves-dark href="javascript:void(0)"
20
- i.mdi.mdi-menu
16
+ = image_tag asset_pack_path('media/images/logo-light-icon.png'), class: 'light-logo'
17
+ span.logo-text
18
+ .inline-block.ml10 Logo
19
+
20
+ a.topbartoggler.d-block.d-md-none.waves-effect.waves-light href="javascript:void(0)" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"
21
+ i.ti-more
22
+
23
+ .navbar-collapse.collapse data-navbarbg="skin1"
24
+ ul.navbar-nav.me-auto
21
25
  li.nav-item
22
- a.nav-link.sidebartoggler.hidden-sm-down.text-muted.waves-effect.waves-dark href="javascript:void(0)"
26
+ a.nav-link.sidebartoggler.d-none.d-md-block.waves-effect.waves-dark href="javascript:void(0)"
23
27
  i.ti-menu
24
28
 
@@ -1,15 +1,14 @@
1
1
  /! ==============================================================
2
2
  /! Left Sidebar - style you can find in sidebar.scss
3
3
  /! ==============================================================
4
- aside.left-sidebar
5
- /! Sidebar scroll
6
- .scroll-sidebar
7
- /! Sidebar navigation
4
+ aside.left-sidebar data-sidebarbg='skin6'
5
+ .scroll-sidebar.ps-container.ps-theme-default.ps-active-y
6
+ /! Sidebar scroll
8
7
  nav.sidebar-nav
9
- ul#sidebarnav
8
+ ul#sidebarnav.in
10
9
  / li.nav-small-cap Project title
11
- li
12
- = link_to '#' do
10
+ li class=sidebar_item_classes('users')
11
+ = link_to '#', class: sidebar_item_link_classes('users') do
13
12
  i.fa.fa-user
14
13
  span.hide-menu Menu
15
14
 
@@ -19,5 +18,7 @@ aside.left-sidebar
19
18
  / i.ti-settings
20
19
  / a.link data-toggle="tooltip" href="" title="Email"
21
20
  / i.mdi.mdi-gmail
22
- a.link data-toggle="tooltip" href=destroy_admin_session_path title="Logout" data-method="DELETE"
21
+ = link_to destroy_admin_session_path, title: 'Logout', method: :delete, data: { toggle: 'tooltip' } do
23
22
  i.mdi.mdi-power
23
+ / a.link data-toggle="tooltip" href=destroy_admin_session_path title="Logout" data-method="DELETE"
24
+
@@ -71,6 +71,9 @@ class CrudGenerator < Rails::Generators::NamedBase
71
71
 
72
72
  create_file "#{Rails.root}/app/views/#{layout_name}/#{resource}/_form.html.slim" do
73
73
  <<~html
74
+ = content_for :error_messages do
75
+ = render 'admin/shared/error_messages', target: @#{name}
76
+
74
77
  .col-lg-12
75
78
  .card
76
79
  .card-body
@@ -108,9 +111,6 @@ class CrudGenerator < Rails::Generators::NamedBase
108
111
  # frozen_string_literal: true
109
112
 
110
113
  class #{layout_name.camelize}::#{resource.camelize}Controller < #{layout_name.camelize}::BaseController
111
-
112
- include DatatableDecorator
113
-
114
114
  def index
115
115
  respond_to do |format|
116
116
  format.html
@@ -144,7 +144,7 @@ class CrudGenerator < Rails::Generators::NamedBase
144
144
 
145
145
  @total_rows = #{resource}.count
146
146
 
147
- @rows = users.page(dt[:page]).per(dt[:per_page])
147
+ @rows = #{resource}.page(dt[:page]).per(dt[:per_page])
148
148
  @rows = @rows.order(search_obj[:order])
149
149
  end
150
150
  end
@@ -10,7 +10,10 @@ class MaterialAdminGenerator < Rails::Generators::NamedBase
10
10
  ' expose-loader file-loader url-loader resolve-url-loader'\
11
11
  ' @rails/ujs @rails/activestorage'\
12
12
  ' stimulus turbolinks'\
13
- ' jquery popper.js select2'
13
+ ' jquery popper.js select2 @popperjs/core'
14
+ ESLINT_JS_PKGS =
15
+ 'eslint prettier eslint-plugin-prettier eslint-config-prettier'\
16
+ ' stylelint stylelint-config-prettier stylelint-config-recommended stylelint-scss'
14
17
 
15
18
  # TODO: Warning! Add reset project.
16
19
 
@@ -62,6 +65,7 @@ class MaterialAdminGenerator < Rails::Generators::NamedBase
62
65
 
63
66
  def yarn_install
64
67
  system("yarn add #{JS_PKGS}")
68
+ system("yarn add #{ESLINT_JS_PKGS} --dev")
65
69
  end
66
70
 
67
71
  def create_helper
@@ -144,6 +148,8 @@ class MaterialAdminGenerator < Rails::Generators::NamedBase
144
148
  class #{layout_name.camelize}::BaseController < ActionController::Base
145
149
  layout '#{layout_name}'
146
150
 
151
+ include DatatableDecorator
152
+
147
153
  before_action :authenticate_#{layout_name}!
148
154
  end
149
155
  dashboard_controller
@@ -1,3 +1,3 @@
1
1
  module MaterialAdmin
2
- VERSION = '0.1.7'
2
+ VERSION = '0.1.8'
3
3
  end
@@ -13,6 +13,12 @@ import 'select2'
13
13
 
14
14
  import '../vendor/rails_material_admin/material_admin'
15
15
 
16
+ import bootstrap from '../vendor/rails_material_admin/js/bootstrap.min'
17
+ window.bootstrap = bootstrap
18
+
19
+ import Swal from '../vendor/rails_material_admin/js/sweetalert2.min'
20
+ window.Swal = Swal
21
+
16
22
  import '../src/javascripts/lib/utils_datatables.js'
17
23
  import '../src/javascripts/admin/common/scaffold.js'
18
24
 
@@ -1,5 +1,7 @@
1
+ import 'select2/dist/css/select2.css'
2
+
1
3
  import '../../../node_modules/datatables.net-bs4/css/dataTables.bootstrap4.css';
2
- import '../../rails_material_admin/material_admin.scss';
4
+ import '../vendor/rails_material_admin/material_admin.scss';
3
5
  import '../src/stylesheets/shared/atom.scss';
4
- import '../src/stylesheets/shared/override.scss';
6
+ import '../src/stylesheets/admin/shared/override.scss';
5
7
  import '../src/stylesheets/admin/shared/common.scss';
@@ -13,22 +13,48 @@ ul#sidebarnav > li > a {
13
13
  }
14
14
 
15
15
  /* form */
16
- [type=checkbox] + label {
17
- margin-right: 15px;
18
- }
16
+ form .form-body {
17
+ .form-group > label,
18
+ .form-group .field_with_errors > label {
19
+ display: flex;
20
+ flex-direction: column;
21
+ justify-content: center;
22
+ }
19
23
 
20
- [type=radio] + label {
21
- margin-right: 15px;
22
- }
24
+ .form-group {
25
+ padding-bottom: 0;
26
+ margin-bottom: 14px;
27
+ border-bottom: none;
28
+ }
23
29
 
24
- form .form-body .form-group > label {
25
- display: flex;
26
- flex-direction: column;
27
- justify-content: center;
28
- }
30
+ .field_with_errors {
31
+ display: contents;
29
32
 
30
- .form-body .form-group {
31
- padding-bottom: 0;
32
- margin-bottom: 14px;
33
- border-bottom: none;
33
+ .form-control {
34
+ border-color: #fc4b6c;
35
+ padding-right: calc(1.5em + .75rem);
36
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23fc4b6c'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fc4b6c' stroke='none'/%3e%3c/svg%3e");
37
+ background-repeat: no-repeat;
38
+ background-position: right calc(.375em + .1875rem) center;
39
+ background-size: calc(.75em + .375rem) calc(.75em + .375rem);
40
+ }
41
+
42
+ span.select2.select2-container .selection .select2-selection {
43
+ border-color: #fc4b6c;
44
+ padding-right: calc(1.5em + .75rem);
45
+ background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23fc4b6c'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23fc4b6c' stroke='none'/%3e%3c/svg%3e");
46
+ background-repeat: no-repeat;
47
+ background-position: right calc(.375em + 1rem) center;
48
+ background-size: calc(.75em + .375rem) calc(.75em + .375rem);
49
+ }
50
+ }
51
+
52
+ [type=checkbox] + label {
53
+ margin-right: 15px;
54
+ }
55
+
56
+ [type=radio] + label {
57
+ margin-right: 15px;
58
+ }
34
59
  }
60
+
@@ -0,0 +1,84 @@
1
+ html, body {
2
+ height: 100%;
3
+ }
4
+
5
+ .topbar .top-navbar .navbar-header .navbar-brand {
6
+ color: white;
7
+ }
8
+
9
+ // NOTE: If you want reduce the checkbox border
10
+ // [type='checkbox'] + label:before,
11
+ // [type='checkbox']:not(.filled-in) + label:after {
12
+ // border: 1px solid #ced4da;
13
+ // }
14
+
15
+ /* select2 */
16
+ .select2-container {
17
+ width: 100% !important;
18
+ }
19
+
20
+ .select2-container--default .select2-selection--multiple {
21
+ border: 1px solid #ced4da;
22
+ }
23
+
24
+ .select2-container--default.select2-container--focus .select2-selection--multiple,
25
+ .select2-container--default.select2-container--open.select2-container--below .select2-selection--single,
26
+ .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
27
+ border: 1px solid #ced4da;
28
+ color: #495057;
29
+ background-color: #fff;
30
+ border-color: #80bdff;
31
+ outline: 0;
32
+ box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.25);
33
+ }
34
+
35
+ .select2-container--default .select2-selection--multiple .select2-selection__rendered {
36
+ padding-left: 12px;
37
+ }
38
+
39
+ .select2-search__field {
40
+ color: #999;
41
+ font-weight: 300;
42
+ }
43
+
44
+ // Fix placeholder missing when select is initially hidden.
45
+ .select2-search--inline {
46
+ /*this will make the container disappear, making the child the one who sets the width of the element*/
47
+ display: contents;
48
+ }
49
+ .select2-search__field:placeholder-shown {
50
+ /*makes the placeholder to be 100% of the width while there are no options selected*/
51
+ width: 100% !important;
52
+ }
53
+
54
+ .select2-container--default .select2-selection--single .select2-selection__placeholder {
55
+ font-size: 16px;
56
+ color: #67757c;
57
+ }
58
+
59
+ .datepicker.datepicker-dropdown.dropdown-menu {
60
+ z-index: 9999 !important;
61
+ }
62
+
63
+
64
+ /* Admin template css update */
65
+ .input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
66
+ margin-left: -1px;
67
+ border-top-left-radius: 0;
68
+ border-bottom-left-radius: 0;
69
+ }
70
+
71
+ .input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
72
+ border-top-right-radius: 0;
73
+ border-bottom-right-radius: 0;
74
+ }
75
+
76
+ .form-control, .form-control::placeholder {
77
+ font-weight: 200;
78
+ }
79
+
80
+ .btn.active.focus, .btn.active:focus,
81
+ .btn.focus, .btn:active.focus, .btn:active:focus, .btn:focus {
82
+ outline: none;
83
+ }
84
+