administrate-materialize-theme 0.1.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (81) hide show
  1. checksums.yaml +7 -0
  2. data/MIT-LICENSE +20 -0
  3. data/README.md +49 -0
  4. data/Rakefile +1 -0
  5. data/app/assets/javascripts/administrate-materialize-theme/anime.min.js +34 -0
  6. data/app/assets/javascripts/administrate-materialize-theme/autocomplete.js +450 -0
  7. data/app/assets/javascripts/administrate-materialize-theme/bin/materialize.js +12374 -0
  8. data/app/assets/javascripts/administrate-materialize-theme/bin/materialize.min.js +6 -0
  9. data/app/assets/javascripts/administrate-materialize-theme/buttons.js +354 -0
  10. data/app/assets/javascripts/administrate-materialize-theme/cards.js +40 -0
  11. data/app/assets/javascripts/administrate-materialize-theme/carousel.js +717 -0
  12. data/app/assets/javascripts/administrate-materialize-theme/cash.js +960 -0
  13. data/app/assets/javascripts/administrate-materialize-theme/characterCounter.js +136 -0
  14. data/app/assets/javascripts/administrate-materialize-theme/chips.js +481 -0
  15. data/app/assets/javascripts/administrate-materialize-theme/collapsible.js +275 -0
  16. data/app/assets/javascripts/administrate-materialize-theme/component.js +44 -0
  17. data/app/assets/javascripts/administrate-materialize-theme/datepicker.js +975 -0
  18. data/app/assets/javascripts/administrate-materialize-theme/dropdown.js +617 -0
  19. data/app/assets/javascripts/administrate-materialize-theme/forms.js +275 -0
  20. data/app/assets/javascripts/administrate-materialize-theme/global.js +427 -0
  21. data/app/assets/javascripts/administrate-materialize-theme/materialbox.js +453 -0
  22. data/app/assets/javascripts/administrate-materialize-theme/modal.js +382 -0
  23. data/app/assets/javascripts/administrate-materialize-theme/parallax.js +138 -0
  24. data/app/assets/javascripts/administrate-materialize-theme/pushpin.js +145 -0
  25. data/app/assets/javascripts/administrate-materialize-theme/range.js +263 -0
  26. data/app/assets/javascripts/administrate-materialize-theme/scrollspy.js +295 -0
  27. data/app/assets/javascripts/administrate-materialize-theme/select.js +432 -0
  28. data/app/assets/javascripts/administrate-materialize-theme/sidenav.js +580 -0
  29. data/app/assets/javascripts/administrate-materialize-theme/slider.js +359 -0
  30. data/app/assets/javascripts/administrate-materialize-theme/tabs.js +402 -0
  31. data/app/assets/javascripts/administrate-materialize-theme/tapTarget.js +314 -0
  32. data/app/assets/javascripts/administrate-materialize-theme/theme.js +6 -0
  33. data/app/assets/javascripts/administrate-materialize-theme/timepicker.js +647 -0
  34. data/app/assets/javascripts/administrate-materialize-theme/toasts.js +310 -0
  35. data/app/assets/javascripts/administrate-materialize-theme/tooltip.js +303 -0
  36. data/app/assets/javascripts/administrate-materialize-theme/waves.js +335 -0
  37. data/app/assets/stylesheets/administrate-materialize-theme/components/_badges.scss +55 -0
  38. data/app/assets/stylesheets/administrate-materialize-theme/components/_buttons.scss +322 -0
  39. data/app/assets/stylesheets/administrate-materialize-theme/components/_cards.scss +195 -0
  40. data/app/assets/stylesheets/administrate-materialize-theme/components/_carousel.scss +90 -0
  41. data/app/assets/stylesheets/administrate-materialize-theme/components/_chips.scss +90 -0
  42. data/app/assets/stylesheets/administrate-materialize-theme/components/_collapsible.scss +91 -0
  43. data/app/assets/stylesheets/administrate-materialize-theme/components/_color-classes.scss +32 -0
  44. data/app/assets/stylesheets/administrate-materialize-theme/components/_color-variables.scss +370 -0
  45. data/app/assets/stylesheets/administrate-materialize-theme/components/_datepicker.scss +191 -0
  46. data/app/assets/stylesheets/administrate-materialize-theme/components/_dropdown.scss +85 -0
  47. data/app/assets/stylesheets/administrate-materialize-theme/components/_global.scss +769 -0
  48. data/app/assets/stylesheets/administrate-materialize-theme/components/_grid.scss +156 -0
  49. data/app/assets/stylesheets/administrate-materialize-theme/components/_icons-material-design.scss +5 -0
  50. data/app/assets/stylesheets/administrate-materialize-theme/components/_materialbox.scss +43 -0
  51. data/app/assets/stylesheets/administrate-materialize-theme/components/_modal.scss +94 -0
  52. data/app/assets/stylesheets/administrate-materialize-theme/components/_navbar.scss +208 -0
  53. data/app/assets/stylesheets/administrate-materialize-theme/components/_normalize.scss +447 -0
  54. data/app/assets/stylesheets/administrate-materialize-theme/components/_preloader.scss +334 -0
  55. data/app/assets/stylesheets/administrate-materialize-theme/components/_pulse.scss +34 -0
  56. data/app/assets/stylesheets/administrate-materialize-theme/components/_sidenav.scss +216 -0
  57. data/app/assets/stylesheets/administrate-materialize-theme/components/_slider.scss +92 -0
  58. data/app/assets/stylesheets/administrate-materialize-theme/components/_table_of_contents.scss +33 -0
  59. data/app/assets/stylesheets/administrate-materialize-theme/components/_tabs.scss +99 -0
  60. data/app/assets/stylesheets/administrate-materialize-theme/components/_tapTarget.scss +103 -0
  61. data/app/assets/stylesheets/administrate-materialize-theme/components/_timepicker.scss +183 -0
  62. data/app/assets/stylesheets/administrate-materialize-theme/components/_toast.scss +58 -0
  63. data/app/assets/stylesheets/administrate-materialize-theme/components/_tooltip.scss +32 -0
  64. data/app/assets/stylesheets/administrate-materialize-theme/components/_transitions.scss +13 -0
  65. data/app/assets/stylesheets/administrate-materialize-theme/components/_typography.scss +60 -0
  66. data/app/assets/stylesheets/administrate-materialize-theme/components/_variables.scss +349 -0
  67. data/app/assets/stylesheets/administrate-materialize-theme/components/_waves.scss +114 -0
  68. data/app/assets/stylesheets/administrate-materialize-theme/components/forms/_checkboxes.scss +200 -0
  69. data/app/assets/stylesheets/administrate-materialize-theme/components/forms/_file-input.scss +44 -0
  70. data/app/assets/stylesheets/administrate-materialize-theme/components/forms/_forms.scss +22 -0
  71. data/app/assets/stylesheets/administrate-materialize-theme/components/forms/_input-fields.scss +354 -0
  72. data/app/assets/stylesheets/administrate-materialize-theme/components/forms/_radio-buttons.scss +115 -0
  73. data/app/assets/stylesheets/administrate-materialize-theme/components/forms/_range.scss +161 -0
  74. data/app/assets/stylesheets/administrate-materialize-theme/components/forms/_select.scss +180 -0
  75. data/app/assets/stylesheets/administrate-materialize-theme/components/forms/_switches.scss +89 -0
  76. data/app/assets/stylesheets/administrate-materialize-theme/materialize.scss +41 -0
  77. data/app/assets/stylesheets/administrate-materialize-theme/theme.scss +200 -0
  78. data/lib/administrate-materialize-theme.rb +6 -0
  79. data/lib/administrate-materialize-theme/engine.rb +7 -0
  80. data/lib/administrate-materialize-theme/version.rb +5 -0
  81. metadata +150 -0
@@ -0,0 +1,156 @@
1
+ .container {
2
+ margin: 0 auto;
3
+ max-width: 1280px;
4
+ width: 90%;
5
+ }
6
+ @media #{$medium-and-up} {
7
+ .container {
8
+ width: 85%;
9
+ }
10
+ }
11
+ @media #{$large-and-up} {
12
+ .container {
13
+ width: 70%;
14
+ }
15
+ }
16
+ .col .row {
17
+ margin-left: (-1 * $gutter-width / 2);
18
+ margin-right: (-1 * $gutter-width / 2);
19
+ }
20
+
21
+ .section {
22
+ padding-top: 1rem;
23
+ padding-bottom: 1rem;
24
+
25
+ &.no-pad {
26
+ padding: 0;
27
+ }
28
+ &.no-pad-bot {
29
+ padding-bottom: 0;
30
+ }
31
+ &.no-pad-top {
32
+ padding-top: 0;
33
+ }
34
+ }
35
+
36
+
37
+ // Mixins to eliminate code repitition
38
+ @mixin reset-offset {
39
+ margin-left: auto;
40
+ left: auto;
41
+ right: auto;
42
+ }
43
+ @mixin grid-classes($size, $i, $perc) {
44
+ &.offset-#{$size}#{$i} {
45
+ margin-left: $perc;
46
+ }
47
+ &.pull-#{$size}#{$i} {
48
+ right: $perc;
49
+ }
50
+ &.push-#{$size}#{$i} {
51
+ left: $perc;
52
+ }
53
+ }
54
+
55
+
56
+ .row {
57
+ margin-left: auto;
58
+ margin-right: auto;
59
+ margin-bottom: 20px;
60
+
61
+ // Clear floating children
62
+ &:after {
63
+ content: "";
64
+ display: table;
65
+ clear: both;
66
+ }
67
+
68
+ .col {
69
+ float: left;
70
+ box-sizing: border-box;
71
+ padding: 0 $gutter-width / 2;
72
+ min-height: 1px;
73
+
74
+ &[class*="push-"],
75
+ &[class*="pull-"] {
76
+ position: relative;
77
+ }
78
+
79
+ $i: 1;
80
+ @while $i <= $num-cols {
81
+ $perc: unquote((100 / ($num-cols / $i)) + "%");
82
+ &.s#{$i} {
83
+ width: $perc;
84
+ @include reset-offset;
85
+ }
86
+ $i: $i + 1;
87
+ }
88
+
89
+ $i: 1;
90
+ @while $i <= $num-cols {
91
+ $perc: unquote((100 / ($num-cols / $i)) + "%");
92
+ @include grid-classes("s", $i, $perc);
93
+ $i: $i + 1;
94
+ }
95
+
96
+ @media #{$medium-and-up} {
97
+
98
+ $i: 1;
99
+ @while $i <= $num-cols {
100
+ $perc: unquote((100 / ($num-cols / $i)) + "%");
101
+ &.m#{$i} {
102
+ width: $perc;
103
+ @include reset-offset;
104
+ }
105
+ $i: $i + 1
106
+ }
107
+
108
+ $i: 1;
109
+ @while $i <= $num-cols {
110
+ $perc: unquote((100 / ($num-cols / $i)) + "%");
111
+ @include grid-classes("m", $i, $perc);
112
+ $i: $i + 1;
113
+ }
114
+ }
115
+
116
+ @media #{$large-and-up} {
117
+
118
+ $i: 1;
119
+ @while $i <= $num-cols {
120
+ $perc: unquote((100 / ($num-cols / $i)) + "%");
121
+ &.l#{$i} {
122
+ width: $perc;
123
+ @include reset-offset;
124
+ }
125
+ $i: $i + 1;
126
+ }
127
+
128
+ $i: 1;
129
+ @while $i <= $num-cols {
130
+ $perc: unquote((100 / ($num-cols / $i)) + "%");
131
+ @include grid-classes("l", $i, $perc);
132
+ $i: $i + 1;
133
+ }
134
+ }
135
+
136
+ @media #{$extra-large-and-up} {
137
+
138
+ $i: 1;
139
+ @while $i <= $num-cols {
140
+ $perc: unquote((100 / ($num-cols / $i)) + "%");
141
+ &.xl#{$i} {
142
+ width: $perc;
143
+ @include reset-offset;
144
+ }
145
+ $i: $i + 1;
146
+ }
147
+
148
+ $i: 1;
149
+ @while $i <= $num-cols {
150
+ $perc: unquote((100 / ($num-cols / $i)) + "%");
151
+ @include grid-classes("xl", $i, $perc);
152
+ $i: $i + 1;
153
+ }
154
+ }
155
+ }
156
+ }
@@ -0,0 +1,5 @@
1
+ /* This is needed for some mobile phones to display the Google Icon font properly */
2
+ .material-icons {
3
+ text-rendering: optimizeLegibility;
4
+ font-feature-settings: 'liga';
5
+ }
@@ -0,0 +1,43 @@
1
+ .materialboxed {
2
+ &:hover {
3
+ &:not(.active) {
4
+ opacity: .8;
5
+ }
6
+ }
7
+
8
+ display: block;
9
+ cursor: zoom-in;
10
+ position: relative;
11
+ transition: opacity .4s;
12
+ -webkit-backface-visibility: hidden;
13
+
14
+ &.active {
15
+ cursor: zoom-out;
16
+ }
17
+ }
18
+
19
+ #materialbox-overlay {
20
+ position:fixed;
21
+ top: 0;
22
+ right: 0;
23
+ bottom: 0;
24
+ left: 0;
25
+ background-color: #292929;
26
+ z-index: 1000;
27
+ will-change: opacity;
28
+ }
29
+
30
+ .materialbox-caption {
31
+ position: fixed;
32
+ display: none;
33
+ color: #fff;
34
+ line-height: 50px;
35
+ bottom: 0;
36
+ left: 0;
37
+ width: 100%;
38
+ text-align: center;
39
+ padding: 0% 15%;
40
+ height: 50px;
41
+ z-index: 1000;
42
+ -webkit-font-smoothing: antialiased;
43
+ }
@@ -0,0 +1,94 @@
1
+ .modal {
2
+ &:focus {
3
+ outline: none;
4
+ }
5
+
6
+ @extend .z-depth-5;
7
+
8
+ display: none;
9
+ position: fixed;
10
+ left: 0;
11
+ right: 0;
12
+ background-color: #fafafa;
13
+ padding: 0;
14
+ max-height: 70%;
15
+ width: 55%;
16
+ margin: auto;
17
+ overflow-y: auto;
18
+
19
+ border-radius: 2px;
20
+ will-change: top, opacity;
21
+
22
+ @media #{$medium-and-down} {
23
+ width: 80%;
24
+ }
25
+
26
+ h1,h2,h3,h4 {
27
+ margin-top: 0;
28
+ }
29
+
30
+ .modal-content {
31
+ padding: 24px;
32
+ }
33
+ .modal-close {
34
+ cursor: pointer;
35
+ }
36
+
37
+ .modal-footer {
38
+ border-radius: 0 0 2px 2px;
39
+ background-color: #fafafa;
40
+ padding: 4px 6px;
41
+ height: 56px;
42
+ width: 100%;
43
+ text-align: right;
44
+
45
+ .btn, .btn-flat {
46
+ margin: 6px 0;
47
+ }
48
+ }
49
+ }
50
+ .modal-overlay {
51
+ position: fixed;
52
+ z-index: 999;
53
+ top: -25%;
54
+ left: 0;
55
+ bottom: 0;
56
+ right: 0;
57
+ height: 125%;
58
+ width: 100%;
59
+ background: #000;
60
+ display: none;
61
+
62
+ will-change: opacity;
63
+ }
64
+
65
+ // Modal with fixed action footer
66
+ .modal.modal-fixed-footer {
67
+ padding: 0;
68
+ height: 70%;
69
+
70
+ .modal-content {
71
+ position: absolute;
72
+ height: calc(100% - 56px);
73
+ max-height: 100%;
74
+ width: 100%;
75
+ overflow-y: auto;
76
+ }
77
+
78
+ .modal-footer {
79
+ border-top: 1px solid rgba(0,0,0,.1);
80
+ position: absolute;
81
+ bottom: 0;
82
+ }
83
+ }
84
+
85
+ // Modal Bottom Sheet Style
86
+ .modal.bottom-sheet {
87
+ top: auto;
88
+ bottom: -100%;
89
+ margin: 0;
90
+ width: 100%;
91
+ max-height: 45%;
92
+ border-radius: 0;
93
+ will-change: bottom, opacity;
94
+ }
@@ -0,0 +1,208 @@
1
+ nav {
2
+ &.nav-extended {
3
+ height: auto;
4
+
5
+ .nav-wrapper {
6
+ min-height: $navbar-height-mobile;
7
+ height: auto;
8
+ }
9
+
10
+ .nav-content {
11
+ position: relative;
12
+ line-height: normal;
13
+ }
14
+ }
15
+
16
+ color: $navbar-font-color;
17
+ @extend .z-depth-1;
18
+ background-color: $primary-color;
19
+ width: 100%;
20
+ height: $navbar-height-mobile;
21
+ line-height: $navbar-line-height-mobile;
22
+
23
+ a { color: $navbar-font-color; }
24
+
25
+ i,
26
+ [class^="mdi-"], [class*="mdi-"],
27
+ i.material-icons {
28
+ display: block;
29
+ font-size: 24px;
30
+ height: $navbar-height-mobile;
31
+ line-height: $navbar-line-height-mobile;
32
+ }
33
+
34
+ .nav-wrapper {
35
+ position: relative;
36
+ height: 100%;
37
+ }
38
+
39
+ @media #{$large-and-up} {
40
+ a.sidenav-trigger { display: none; }
41
+ }
42
+
43
+
44
+ // Collapse button
45
+ .sidenav-trigger {
46
+ float: left;
47
+ position: relative;
48
+ z-index: 1;
49
+ height: $navbar-height-mobile;
50
+ margin: 0 18px;
51
+
52
+ i {
53
+ height: $navbar-height-mobile;
54
+ line-height: $navbar-line-height-mobile;
55
+ }
56
+ }
57
+
58
+
59
+ // Logo
60
+ .brand-logo {
61
+ position: absolute;
62
+ color: $navbar-font-color;
63
+ display: inline-block;
64
+ font-size: $navbar-brand-font-size;
65
+ padding: 0;
66
+
67
+ &.center {
68
+ left: 50%;
69
+ transform: translateX(-50%);
70
+ }
71
+
72
+ @media #{$medium-and-down} {
73
+ left: 50%;
74
+ transform: translateX(-50%);
75
+
76
+ &.left, &.right {
77
+ padding: 0;
78
+ transform: none;
79
+ }
80
+
81
+ &.left { left: 0.5rem; }
82
+ &.right {
83
+ right: 0.5rem;
84
+ left: auto;
85
+ }
86
+ }
87
+
88
+ &.right {
89
+ right: 0.5rem;
90
+ padding: 0;
91
+ }
92
+
93
+ i,
94
+ [class^="mdi-"], [class*="mdi-"],
95
+ i.material-icons {
96
+ float: left;
97
+ margin-right: 15px;
98
+ }
99
+ }
100
+
101
+
102
+ // Title
103
+ .nav-title {
104
+ display: inline-block;
105
+ font-size: 32px;
106
+ padding: 28px 0;
107
+ }
108
+
109
+
110
+ // Navbar Links
111
+ ul {
112
+ margin: 0;
113
+
114
+ li {
115
+ transition: background-color .3s;
116
+ float: left;
117
+ padding: 0;
118
+
119
+ &.active {
120
+ background-color: rgba(0,0,0,.1);
121
+ }
122
+ }
123
+ a {
124
+ transition: background-color .3s;
125
+ font-size: $navbar-font-size;
126
+ color: $navbar-font-color;
127
+ display: block;
128
+ padding: 0 15px;
129
+ cursor: pointer;
130
+
131
+ &.btn, &.btn-large, &.btn-flat, &.btn-floating {
132
+ margin-top: -2px;
133
+ margin-left: 15px;
134
+ margin-right: 15px;
135
+
136
+ & > .material-icons {
137
+ height: inherit;
138
+ line-height: inherit;
139
+ }
140
+ }
141
+
142
+ &:hover {
143
+ background-color: rgba(0,0,0,.1);
144
+ }
145
+ }
146
+
147
+ &.left {
148
+ float: left;
149
+ }
150
+ }
151
+
152
+ // Navbar Search Form
153
+ form {
154
+ height: 100%;
155
+ }
156
+
157
+ .input-field {
158
+ margin: 0;
159
+ height: 100%;
160
+
161
+ input {
162
+ height: 100%;
163
+ font-size: 1.2rem;
164
+ border: none;
165
+ padding-left: 2rem;
166
+
167
+ &:focus, &[type=text]:valid, &[type=password]:valid,
168
+ &[type=email]:valid, &[type=url]:valid, &[type=date]:valid {
169
+ border: none;
170
+ box-shadow: none;
171
+ }
172
+ }
173
+
174
+ label {
175
+ top: 0;
176
+ left: 0;
177
+
178
+ i {
179
+ color: rgba(255,255,255,.7);
180
+ transition: color .3s;
181
+ }
182
+ &.active i { color: $navbar-font-color; }
183
+ }
184
+ }
185
+ }
186
+
187
+ // Fixed Navbar
188
+ .navbar-fixed {
189
+ position: relative;
190
+ height: $navbar-height-mobile;
191
+ z-index: 997;
192
+
193
+ nav {
194
+ position: fixed;
195
+ }
196
+ }
197
+ @media #{$medium-and-up} {
198
+ nav.nav-extended .nav-wrapper {
199
+ min-height: $navbar-height;
200
+ }
201
+ nav, nav .nav-wrapper i, nav a.sidenav-trigger, nav a.sidenav-trigger i {
202
+ height: $navbar-height;
203
+ line-height: $navbar-line-height;
204
+ }
205
+ .navbar-fixed {
206
+ height: $navbar-height;
207
+ }
208
+ }