arctic_admin 3.2.0 → 4.0.1.alpha
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 +4 -4
- data/Readme.md +44 -7
- data/app/assets/javascripts/arctic_admin/base.js +1 -79
- data/app/assets/javascripts/arctic_admin/main.js +52 -0
- data/app/assets/stylesheets/arctic_admin/_main.scss +54 -0
- data/app/assets/stylesheets/arctic_admin/layouts/_filter.scss +18 -1
- data/app/assets/stylesheets/arctic_admin/layouts/_sidebar.scss +7 -1
- data/app/assets/stylesheets/arctic_admin/mixins/_prefix_mixins.scss +1 -1
- data/app/assets/stylesheets/arctic_admin/pages/_index.scss +14 -0
- data/lib/arctic_admin/version.rb +1 -1
- metadata +6 -18
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 2ac5204d1d381efd50fab0fd34bfbe1ea01ac93f99498695e6792223b17fe72e
|
4
|
+
data.tar.gz: 66c5c5b151dd6592c35059a0b029923cd108a1f9630d03b8220a84dda91486e2
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 9e588e7530142d7dd7d81bb2049e8a6ac5519545578184c4a2d595a8c0505462b8a2dd65f355af9cc5c748a780e95fd0f6b4c63b25bb3ad2069aa06feecad7e5
|
7
|
+
data.tar.gz: 76540e14071b7f9a75739aee25e1a9665b98ea549a79689346f53b1d73634a3414f9c696dffc06095dba55614f6627bc54cdafa06b59a329a3ce667d2aa77ff0
|
data/Readme.md
CHANGED
@@ -1,6 +1,8 @@
|
|
1
1
|
# ArcticAdmin
|
2
2
|
[](https://rubygems.org/gems/arctic_admin)
|
3
3
|
[](https://rubygems.org/gems/arctic_admin)
|
4
|
+
[](https://www.npmjs.com/package/arctic_admin)
|
5
|
+
[](https://www.npmjs.com/package/arctic_admin)
|
4
6
|
|
5
7
|
Simple theme for ActiveAdmin :ok_hand:
|
6
8
|
|
@@ -12,6 +14,8 @@ Simple theme for ActiveAdmin :ok_hand:
|
|
12
14
|
|
13
15
|
## Installation
|
14
16
|
|
17
|
+
>**⚠️ If you are using webpacker (Standard with Rails 6) look below**
|
18
|
+
|
15
19
|
- Add this to your Gemfile:
|
16
20
|
|
17
21
|
```ruby
|
@@ -73,19 +77,52 @@ In your `active_admin.js`, include the js file:
|
|
73
77
|
|
74
78
|
:exclamation: **Remove the line `//= require active_admin/base`**
|
75
79
|
|
76
|
-
|
80
|
+
## Use with webpacker
|
77
81
|
|
78
|
-
|
82
|
+
### 1 - Preparation
|
79
83
|
|
80
|
-
|
84
|
+
Install the needed assets with npm or yarn:
|
81
85
|
|
82
|
-
|
83
|
-
|
86
|
+
```
|
87
|
+
yarn add arctic_admin @fortawesome/fontawesome-free
|
88
|
+
```
|
89
|
+
|
90
|
+
|
91
|
+
### 2 - CSS
|
92
|
+
|
93
|
+
In your `app/javascript/stylesheets/active_admin.scss`, add the line:
|
94
|
+
|
95
|
+
```scss
|
96
|
+
@import '~arctic_admin/src/scss/main';
|
97
|
+
```
|
98
|
+
|
99
|
+
Remove:
|
100
|
+
|
101
|
+
```scss
|
102
|
+
@import "~@activeadmin/activeadmin/src/scss/mixins";
|
103
|
+
@import "~@activeadmin/activeadmin/src/scss/base";
|
104
|
+
```
|
105
|
+
|
106
|
+
### 3 - JS
|
107
|
+
|
108
|
+
Search for `app/javascript/packs/active_admin.js` in your rails project and add the following lines:
|
109
|
+
|
110
|
+
```js
|
111
|
+
import "@fortawesome/fontawesome-free/css/all.css";
|
112
|
+
import 'arctic_admin'
|
113
|
+
```
|
114
|
+
|
115
|
+
|
116
|
+
### Customization
|
117
|
+
|
118
|
+
For this, you need to use SASS to customize the theming.
|
119
|
+
|
120
|
+
Right now you can change the primary color of the theme by placing the following variable in your `active_admin.scss` file:
|
84
121
|
|
85
122
|
```scss
|
86
123
|
$primary-color: #2dbb43;
|
87
124
|
|
88
|
-
@import "arctic_admin/
|
125
|
+
@import "~arctic_admin/src/scss/main";
|
89
126
|
```
|
90
127
|
|
91
128
|
If you use the
|
@@ -95,7 +132,7 @@ add this to your `active_admin.sass` file:
|
|
95
132
|
```sass
|
96
133
|
$primary-color: #2dbb43
|
97
134
|
|
98
|
-
@import arctic_admin/
|
135
|
+
@import ~arctic_admin/src/scss/main
|
99
136
|
```
|
100
137
|
|
101
138
|
Then restart your webserver if it was previously running.
|
@@ -1,80 +1,2 @@
|
|
1
|
-
//= require jquery
|
2
|
-
//= require jquery_ujs
|
3
1
|
//= require active_admin/base
|
4
|
-
|
5
|
-
$(function() {
|
6
|
-
var animationFilterDone = true;
|
7
|
-
$(document).on('click touchstart', '#sidebar', function(e) {
|
8
|
-
if(animationFilterDone == true) {
|
9
|
-
var position = $(this).position();
|
10
|
-
var width = $(this).width();
|
11
|
-
var target = e.target;
|
12
|
-
if ((e.pageX < position.left) && (target.tagName != 'SELECT') && (target.tagName != 'OPTION')) {
|
13
|
-
if ($(this).css('right') == '0px') {
|
14
|
-
$(this).css('position', 'fixed');
|
15
|
-
$(this).animate({
|
16
|
-
right: "-="+width
|
17
|
-
}, 600, function() {
|
18
|
-
$(this).removeAttr('style');
|
19
|
-
animationFilterDone = true;
|
20
|
-
});
|
21
|
-
} else {
|
22
|
-
$(this).animate({
|
23
|
-
right: "+="+width
|
24
|
-
}, 600, function() {
|
25
|
-
$(this).css('position', 'absolute');
|
26
|
-
animationFilterDone = true;
|
27
|
-
});
|
28
|
-
}
|
29
|
-
}
|
30
|
-
}
|
31
|
-
});
|
32
|
-
|
33
|
-
var animationDone = true;
|
34
|
-
$(document).on('click touchstart', '#utility_nav', function(e) {
|
35
|
-
var position = $(this).position();
|
36
|
-
var tabs = $('#tabs');
|
37
|
-
var width = Math.round(tabs[0].getBoundingClientRect().width);
|
38
|
-
|
39
|
-
if (e.pageX < (position.left + 40)) {
|
40
|
-
if(animationDone == true) {
|
41
|
-
animationDone = false;
|
42
|
-
if (tabs.css('left') == '0px') {
|
43
|
-
tabs.animate({
|
44
|
-
left: "-="+width
|
45
|
-
}, 400, function() {
|
46
|
-
animationDone = true;
|
47
|
-
});
|
48
|
-
} else {
|
49
|
-
tabs.animate({
|
50
|
-
left: "+="+width
|
51
|
-
}, 400, function() {
|
52
|
-
animationDone = true;
|
53
|
-
});
|
54
|
-
}
|
55
|
-
}
|
56
|
-
}
|
57
|
-
});
|
58
|
-
|
59
|
-
$(document).on('click touchstart', 'body', function(e) {
|
60
|
-
var tabs = $('#tabs');
|
61
|
-
var width = Math.round(tabs[0].getBoundingClientRect().width);
|
62
|
-
if (tabs.css('left') == '0px') {
|
63
|
-
if (e.pageX > width && e.pageY > 60) {
|
64
|
-
if(animationDone == true) {
|
65
|
-
animationDone = false;
|
66
|
-
tabs.animate({
|
67
|
-
left: "-="+width
|
68
|
-
}, 400, function() {
|
69
|
-
animationDone = true;
|
70
|
-
});
|
71
|
-
}
|
72
|
-
}
|
73
|
-
}
|
74
|
-
});
|
75
|
-
|
76
|
-
$(document).on('click', '#tabs .has_nested', function(e) {
|
77
|
-
e.stopPropagation();
|
78
|
-
$(this).toggleClass('open');
|
79
|
-
});
|
80
|
-
});
|
2
|
+
//= require ./main
|
@@ -0,0 +1,52 @@
|
|
1
|
+
document.addEventListener('DOMContentLoaded', () => {
|
2
|
+
|
3
|
+
// right filter sidebar
|
4
|
+
const sidebar = document.querySelector('#sidebar')
|
5
|
+
if (sidebar) {
|
6
|
+
sidebar.addEventListener('click', event => {
|
7
|
+
const insideSection = document.querySelector('#filters_sidebar_section')
|
8
|
+
if (!(event.target === insideSection || insideSection.contains(event.target))) {
|
9
|
+
sidebar.classList.toggle('sidebar_open')
|
10
|
+
}
|
11
|
+
})
|
12
|
+
}
|
13
|
+
|
14
|
+
const menuButton = document.querySelector('#utility_nav')
|
15
|
+
const menu = document.querySelector('#tabs')
|
16
|
+
|
17
|
+
// toggle menu sidebar with the menu button
|
18
|
+
menuButton.addEventListener('click', event => {
|
19
|
+
const currentUser = document.querySelector('#current_user')
|
20
|
+
const logout = document.querySelector('#logout')
|
21
|
+
const forbiddenLinks = event.target === logout ||
|
22
|
+
logout.contains(event.target) ||
|
23
|
+
event.target === currentUser ||
|
24
|
+
currentUser.contains(event.target)
|
25
|
+
if (!forbiddenLinks) {
|
26
|
+
menu.classList.toggle('tabs_open')
|
27
|
+
}
|
28
|
+
})
|
29
|
+
|
30
|
+
// close left menu sidebar on any click outside
|
31
|
+
document.body.addEventListener('click', event => {
|
32
|
+
const forbiddenLinks = event.target === menu ||
|
33
|
+
menu.contains(event.target) ||
|
34
|
+
event.target === menuButton ||
|
35
|
+
menuButton.contains(event.target)
|
36
|
+
if (menu.classList.contains('tabs_open') && !forbiddenLinks) {
|
37
|
+
menu.classList.remove('tabs_open')
|
38
|
+
}
|
39
|
+
})
|
40
|
+
|
41
|
+
// toggle of nested menu items
|
42
|
+
const nestedMenuItems = document.querySelectorAll('#tabs .has_nested')
|
43
|
+
nestedMenuItems.forEach(
|
44
|
+
(nestedMenuItem) => {
|
45
|
+
nestedMenuItem.addEventListener('click', (e) => {
|
46
|
+
e.stopPropagation()
|
47
|
+
nestedMenuItem.classList.toggle('open')
|
48
|
+
})
|
49
|
+
}
|
50
|
+
)
|
51
|
+
|
52
|
+
})
|
@@ -0,0 +1,54 @@
|
|
1
|
+
@import 'reset';
|
2
|
+
|
3
|
+
@import './variables/variables';
|
4
|
+
|
5
|
+
@import './mixins/mixins';
|
6
|
+
|
7
|
+
@import 'common';
|
8
|
+
@import 'buttons';
|
9
|
+
@import 'grid';
|
10
|
+
|
11
|
+
@import './components/columns';
|
12
|
+
@import './components/comments';
|
13
|
+
@import './components/date_picker';
|
14
|
+
@import './components/dialogs';
|
15
|
+
@import './components/flash';
|
16
|
+
@import './components/form';
|
17
|
+
@import './components/inputs';
|
18
|
+
@import './components/pagination';
|
19
|
+
@import './components/panel_contents';
|
20
|
+
@import './components/select2';
|
21
|
+
@import './components/status_tag';
|
22
|
+
@import './components/tables';
|
23
|
+
@import './components/tabs';
|
24
|
+
|
25
|
+
@import './layouts/filter';
|
26
|
+
@import './layouts/footer';
|
27
|
+
@import './layouts/header';
|
28
|
+
@import './layouts/main_content';
|
29
|
+
@import './layouts/sidebar';
|
30
|
+
@import './layouts/wrapper';
|
31
|
+
|
32
|
+
@import './pages/form';
|
33
|
+
@import './pages/index';
|
34
|
+
@import './pages/login';
|
35
|
+
@import './pages/show';
|
36
|
+
body {
|
37
|
+
font-family: $font-family-body;
|
38
|
+
background-color: $body-background;
|
39
|
+
color: $text-color;
|
40
|
+
}
|
41
|
+
|
42
|
+
h1,
|
43
|
+
h2,
|
44
|
+
h3,
|
45
|
+
h4,
|
46
|
+
h5,
|
47
|
+
h6 {
|
48
|
+
margin-top: 0;
|
49
|
+
}
|
50
|
+
|
51
|
+
a {
|
52
|
+
color: $primary-color;
|
53
|
+
text-decoration: none;
|
54
|
+
}
|
@@ -49,6 +49,11 @@
|
|
49
49
|
.filter_date_range input {
|
50
50
|
width: 45%;
|
51
51
|
display: inline-block;
|
52
|
+
|
53
|
+
// consistent look of all filters
|
54
|
+
&:nth-child(2) {
|
55
|
+
float: right;
|
56
|
+
}
|
52
57
|
}
|
53
58
|
|
54
59
|
input[type="submit"] {
|
@@ -56,9 +61,21 @@
|
|
56
61
|
line-height: 31px;
|
57
62
|
margin-right: 10px;
|
58
63
|
}
|
64
|
+
|
65
|
+
&.panel {
|
66
|
+
position: relative;
|
67
|
+
}
|
59
68
|
}
|
60
69
|
|
61
70
|
#search-status-_sidebar_section {
|
62
71
|
font-size: 14px;
|
63
72
|
}
|
64
|
-
|
73
|
+
|
74
|
+
// 'Filter' and 'Clear Filters' buttons
|
75
|
+
.buttons {
|
76
|
+
display: flex;
|
77
|
+
justify-content: space-between;
|
78
|
+
align-items: center;
|
79
|
+
margin-top: 1rem;
|
80
|
+
}
|
81
|
+
}
|
@@ -8,6 +8,12 @@
|
|
8
8
|
z-index: 1;
|
9
9
|
overflow: auto;
|
10
10
|
left: - $header-width;
|
11
|
+
transition: .5s;
|
12
|
+
transition-timing-function: ease-in-out;
|
13
|
+
|
14
|
+
&.tabs_open {
|
15
|
+
left: 0;
|
16
|
+
}
|
11
17
|
|
12
18
|
@media screen and (min-width: $sm-width) {
|
13
19
|
top: 60px;
|
@@ -95,7 +101,7 @@
|
|
95
101
|
}
|
96
102
|
}
|
97
103
|
|
98
|
-
ul {
|
104
|
+
& > ul {
|
99
105
|
display: block;
|
100
106
|
}
|
101
107
|
}
|
@@ -58,6 +58,6 @@
|
|
58
58
|
text-rendering: auto;
|
59
59
|
-webkit-font-smoothing: antialiased;
|
60
60
|
-moz-osx-font-smoothing: grayscale;
|
61
|
-
font: 900 normal normal 14px/1 'Font Awesome 5 Free';
|
61
|
+
font: 900 normal normal 14px/1 'Font Awesome 5 Free', 'Font Awesome 5 Pro';
|
62
62
|
content: $code-icon;
|
63
63
|
}
|
@@ -39,6 +39,10 @@ body.index {
|
|
39
39
|
position: absolute;
|
40
40
|
z-index: 1;
|
41
41
|
}
|
42
|
+
|
43
|
+
.indexes.table_tools_segmented_control {
|
44
|
+
text-align: right;
|
45
|
+
}
|
42
46
|
}
|
43
47
|
|
44
48
|
.paginated_collection_contents {
|
@@ -89,13 +93,23 @@ body.index {
|
|
89
93
|
.scopes {
|
90
94
|
.scope {
|
91
95
|
@include group-button($primary-color);
|
96
|
+
|
97
|
+
a {
|
98
|
+
margin-right: .25rem;
|
99
|
+
}
|
92
100
|
}
|
93
101
|
}
|
94
102
|
|
95
103
|
#sidebar {
|
96
104
|
position: fixed;
|
105
|
+
transition: .5s;
|
106
|
+
transition-timing-function: ease-in-out;
|
97
107
|
right: - $filter-width;
|
98
108
|
|
109
|
+
&.sidebar_open {
|
110
|
+
right: 0;
|
111
|
+
}
|
112
|
+
|
99
113
|
@media screen and (min-width: $x-lg-width) {
|
100
114
|
right: - $lg-filter-width;
|
101
115
|
}
|
data/lib/arctic_admin/version.rb
CHANGED
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: arctic_admin
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version:
|
4
|
+
version: 4.0.1.alpha
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Clément Prod'homme
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2020-
|
11
|
+
date: 2020-12-07 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|
@@ -58,20 +58,6 @@ dependencies:
|
|
58
58
|
- - "<"
|
59
59
|
- !ruby/object:Gem::Version
|
60
60
|
version: '3.0'
|
61
|
-
- !ruby/object:Gem::Dependency
|
62
|
-
name: jquery-rails
|
63
|
-
requirement: !ruby/object:Gem::Requirement
|
64
|
-
requirements:
|
65
|
-
- - ">="
|
66
|
-
- !ruby/object:Gem::Version
|
67
|
-
version: '0'
|
68
|
-
type: :runtime
|
69
|
-
prerelease: false
|
70
|
-
version_requirements: !ruby/object:Gem::Requirement
|
71
|
-
requirements:
|
72
|
-
- - ">="
|
73
|
-
- !ruby/object:Gem::Version
|
74
|
-
version: '0'
|
75
61
|
- !ruby/object:Gem::Dependency
|
76
62
|
name: font-awesome-sass
|
77
63
|
requirement: !ruby/object:Gem::Requirement
|
@@ -111,11 +97,13 @@ files:
|
|
111
97
|
- app/assets/fonts/Lato-Regular.woff
|
112
98
|
- app/assets/fonts/Lato-Regular.woff2
|
113
99
|
- app/assets/javascripts/arctic_admin/base.js
|
100
|
+
- app/assets/javascripts/arctic_admin/main.js
|
114
101
|
- app/assets/stylesheets/arctic_admin/_base.scss
|
115
102
|
- app/assets/stylesheets/arctic_admin/_buttons.scss
|
116
103
|
- app/assets/stylesheets/arctic_admin/_common.scss
|
117
104
|
- app/assets/stylesheets/arctic_admin/_fonts.scss
|
118
105
|
- app/assets/stylesheets/arctic_admin/_grid.scss
|
106
|
+
- app/assets/stylesheets/arctic_admin/_main.scss
|
119
107
|
- app/assets/stylesheets/arctic_admin/_reset.scss
|
120
108
|
- app/assets/stylesheets/arctic_admin/components/_columns.scss
|
121
109
|
- app/assets/stylesheets/arctic_admin/components/_comments.scss
|
@@ -166,9 +154,9 @@ required_ruby_version: !ruby/object:Gem::Requirement
|
|
166
154
|
version: '0'
|
167
155
|
required_rubygems_version: !ruby/object:Gem::Requirement
|
168
156
|
requirements:
|
169
|
-
- - "
|
157
|
+
- - ">"
|
170
158
|
- !ruby/object:Gem::Version
|
171
|
-
version:
|
159
|
+
version: 1.3.1
|
172
160
|
requirements: []
|
173
161
|
rubygems_version: 3.0.3
|
174
162
|
signing_key:
|