activeadmin_blaze_theme 0.5.10 → 0.6.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (216) hide show
  1. checksums.yaml +5 -5
  2. data/.circleci/config.yml +33 -0
  3. data/.gitignore +12 -2
  4. data/.rspec +2 -0
  5. data/.rubocop.yml +27 -0
  6. data/Gemfile +2 -0
  7. data/LICENSE.txt +1 -1
  8. data/README.md +72 -73
  9. data/Rakefile +15 -1
  10. data/activeadmin_blaze_theme.gemspec +24 -11
  11. data/app/assets/stylesheets/activeadmin_blaze_theme/_base.scss +197 -0
  12. data/app/assets/stylesheets/activeadmin_blaze_theme/_contents.scss +42 -0
  13. data/app/assets/stylesheets/activeadmin_blaze_theme/_footer.scss +15 -0
  14. data/app/assets/stylesheets/activeadmin_blaze_theme/_form.scss +381 -0
  15. data/app/assets/stylesheets/activeadmin_blaze_theme/_header.scss +140 -0
  16. data/app/assets/stylesheets/activeadmin_blaze_theme/_navigation.scss +69 -0
  17. data/app/assets/stylesheets/activeadmin_blaze_theme/_sidebars.scss +64 -0
  18. data/app/assets/stylesheets/activeadmin_blaze_theme/_tables.scss +96 -0
  19. data/app/assets/stylesheets/activeadmin_blaze_theme/_variables.scss +46 -0
  20. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.addresses.scss +11 -0
  21. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.alerts.scss +78 -0
  22. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.avatars.scss +38 -0
  23. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.back-to-top.scss +17 -0
  24. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.badges.scss +71 -0
  25. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.breadcrumbs.scss +24 -0
  26. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.buttons.scss +91 -0
  27. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.calendars.scss +80 -0
  28. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.cards.scss +195 -0
  29. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.divider.scss +39 -0
  30. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.file-upload.scss +24 -0
  31. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.github-buttons.scss +131 -0
  32. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.headings.scss +12 -0
  33. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.hints.scss +21 -0
  34. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.input-groups.scss +164 -0
  35. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.inputs.scss +128 -0
  36. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.links.scss +72 -0
  37. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.lists.scss +64 -0
  38. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.navs.scss +83 -0
  39. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.overlays.scss +23 -0
  40. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.pagination.scss +31 -0
  41. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.progress.scss +83 -0
  42. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.ranges.scss +176 -0
  43. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.tables.scss +86 -0
  44. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.tabs.scss +68 -0
  45. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.tags.scss +39 -0
  46. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.timelines.scss +113 -0
  47. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.toggles.scss +89 -0
  48. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{components.tooltips.scss → _components.tooltips.scss} +28 -30
  49. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_components.trees.scss +48 -0
  50. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_generics.global.scss +17 -0
  51. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_objects.containers.scss +37 -0
  52. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_objects.drawers.scss +91 -0
  53. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_objects.forms.scss +25 -0
  54. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{objects.grid.responsive.scss → _objects.grid.responsive.scss} +14 -14
  55. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{objects.grid.scss → _objects.grid.scss} +2 -2
  56. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{objects.images.scss → _objects.images.scss} +1 -1
  57. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{objects.media.scss → _objects.media.scss} +3 -3
  58. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_objects.modals.scss +70 -0
  59. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{objects.panels.scss → _objects.panels.scss} +1 -11
  60. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/{utilities.alignment.scss → _utilities.alignment.scss} +13 -1
  61. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.boxing.scss +111 -0
  62. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.elevation.scss +17 -0
  63. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.radius.scss +11 -0
  64. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.sizes.scss +23 -0
  65. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.typography.scss +160 -0
  66. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_utilities.visibility.scss +54 -0
  67. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/_variables.scss +93 -0
  68. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/blaze.scss +49 -41
  69. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.buttons.scss +82 -43
  70. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.inputs.scss +2 -40
  71. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.grid.scss +35 -6
  72. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_tools.mediaqueries.scss +13 -34
  73. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.alignment.scss +12 -0
  74. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.states.scss +7 -0
  75. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.visibility.scss +7 -0
  76. data/app/assets/stylesheets/activeadmin_blaze_theme/theme.scss +10 -974
  77. data/bin/rails +29 -0
  78. data/bin/rake +29 -0
  79. data/bin/rspec +29 -0
  80. data/bin/rubocop +29 -0
  81. data/extra/edit.png +0 -0
  82. data/extra/index.png +0 -0
  83. data/lib/activeadmin/views/activeadmin_form.rb +6 -2
  84. data/lib/activeadmin_blaze_theme.rb +5 -2
  85. data/lib/activeadmin_blaze_theme/version.rb +3 -1
  86. data/lib/formtastic/inputs/blaze_toggle_input.rb +12 -8
  87. data/spec/dummy/.ruby-version +1 -0
  88. data/spec/dummy/.tool-versions +1 -0
  89. data/spec/dummy/Rakefile +6 -0
  90. data/spec/dummy/app/admin/authors.rb +57 -0
  91. data/spec/dummy/app/admin/dashboard.rb +32 -0
  92. data/spec/dummy/app/admin/posts.rb +50 -0
  93. data/spec/dummy/app/admin/tags.rb +4 -0
  94. data/spec/dummy/app/assets/config/manifest.js +3 -0
  95. data/spec/dummy/app/assets/images/.keep +0 -0
  96. data/spec/dummy/app/assets/javascripts/active_admin.js +1 -0
  97. data/spec/dummy/app/assets/stylesheets/active_admin.scss +4 -0
  98. data/spec/dummy/app/assets/stylesheets/application.css +15 -0
  99. data/spec/dummy/app/channels/application_cable/channel.rb +4 -0
  100. data/spec/dummy/app/channels/application_cable/connection.rb +4 -0
  101. data/spec/dummy/app/controllers/application_controller.rb +2 -0
  102. data/spec/dummy/app/controllers/concerns/.keep +0 -0
  103. data/spec/dummy/app/helpers/application_helper.rb +2 -0
  104. data/spec/dummy/app/javascript/packs/application.js +15 -0
  105. data/spec/dummy/app/jobs/application_job.rb +7 -0
  106. data/spec/dummy/app/mailers/application_mailer.rb +4 -0
  107. data/spec/dummy/app/models/application_record.rb +7 -0
  108. data/spec/dummy/app/models/author.rb +26 -0
  109. data/spec/dummy/app/models/concerns/.keep +0 -0
  110. data/spec/dummy/app/models/post.rb +25 -0
  111. data/spec/dummy/app/models/post_tag.rb +9 -0
  112. data/spec/dummy/app/models/profile.rb +9 -0
  113. data/spec/dummy/app/models/tag.rb +6 -0
  114. data/spec/dummy/app/views/layouts/application.html.erb +14 -0
  115. data/spec/dummy/app/views/layouts/mailer.html.erb +13 -0
  116. data/spec/dummy/app/views/layouts/mailer.text.erb +1 -0
  117. data/spec/dummy/bin/rails +4 -0
  118. data/spec/dummy/bin/rake +4 -0
  119. data/spec/dummy/bin/setup +33 -0
  120. data/spec/dummy/config.ru +5 -0
  121. data/spec/dummy/config/application.rb +18 -0
  122. data/spec/dummy/config/boot.rb +5 -0
  123. data/spec/dummy/config/cable.yml +10 -0
  124. data/spec/dummy/config/database.yml +8 -0
  125. data/spec/dummy/config/environment.rb +5 -0
  126. data/spec/dummy/config/environments/development.rb +62 -0
  127. data/spec/dummy/config/environments/production.rb +112 -0
  128. data/spec/dummy/config/environments/test.rb +49 -0
  129. data/spec/dummy/config/initializers/active_admin.rb +335 -0
  130. data/spec/dummy/config/initializers/application_controller_renderer.rb +8 -0
  131. data/spec/dummy/config/initializers/assets.rb +12 -0
  132. data/spec/dummy/config/initializers/backtrace_silencers.rb +7 -0
  133. data/spec/dummy/config/initializers/content_security_policy.rb +28 -0
  134. data/spec/dummy/config/initializers/cookies_serializer.rb +5 -0
  135. data/spec/dummy/config/initializers/filter_parameter_logging.rb +4 -0
  136. data/spec/dummy/config/initializers/inflections.rb +16 -0
  137. data/spec/dummy/config/initializers/mime_types.rb +4 -0
  138. data/spec/dummy/config/initializers/wrap_parameters.rb +14 -0
  139. data/spec/dummy/config/locales/en.yml +33 -0
  140. data/spec/dummy/config/puma.rb +38 -0
  141. data/spec/dummy/config/routes.rb +3 -0
  142. data/spec/dummy/config/spring.rb +6 -0
  143. data/spec/dummy/config/storage.yml +7 -0
  144. data/spec/dummy/db/migrate/20170806125915_create_active_storage_tables.active_storage.rb +27 -0
  145. data/spec/dummy/db/migrate/20180101010101_create_active_admin_comments.rb +16 -0
  146. data/spec/dummy/db/migrate/20180607053251_create_authors.rb +13 -0
  147. data/spec/dummy/db/migrate/20180607053254_create_profiles.rb +12 -0
  148. data/spec/dummy/db/migrate/20180607053255_create_tags.rb +11 -0
  149. data/spec/dummy/db/migrate/20180607053257_create_post_tags.rb +12 -0
  150. data/spec/dummy/db/migrate/20180607053739_create_posts.rb +17 -0
  151. data/spec/dummy/db/schema.rb +99 -0
  152. data/spec/dummy/lib/assets/.keep +0 -0
  153. data/spec/dummy/public/404.html +67 -0
  154. data/spec/dummy/public/422.html +67 -0
  155. data/spec/dummy/public/500.html +66 -0
  156. data/spec/dummy/public/apple-touch-icon-precomposed.png +0 -0
  157. data/spec/dummy/public/apple-touch-icon.png +0 -0
  158. data/spec/dummy/public/favicon.ico +0 -0
  159. data/spec/rails_helper.rb +36 -0
  160. data/spec/spec_helper.rb +20 -0
  161. data/spec/support/capybara.rb +3 -0
  162. data/spec/support/drivers.rb +7 -0
  163. data/spec/system/theme_spec.rb +15 -0
  164. metadata +390 -70
  165. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/blaze.colors.scss +0 -30
  166. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.addresses.scss +0 -12
  167. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.alerts.scss +0 -59
  168. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.avatars.scss +0 -36
  169. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.badges.scss +0 -60
  170. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.breadcrumbs.scss +0 -20
  171. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.bubbles.scss +0 -49
  172. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.buttons.scss +0 -77
  173. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.calendars.scss +0 -69
  174. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.cards.scss +0 -213
  175. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.headings.scss +0 -14
  176. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.hints.scss +0 -27
  177. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.input-groups.scss +0 -163
  178. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.inputs.scss +0 -144
  179. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.links.scss +0 -31
  180. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.lists.scss +0 -60
  181. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.navs.scss +0 -126
  182. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.overlays.scss +0 -26
  183. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.pagination.scss +0 -42
  184. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.progress.scss +0 -51
  185. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.ranges.scss +0 -114
  186. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tables.scss +0 -88
  187. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tabs.scss +0 -72
  188. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.tags.scss +0 -42
  189. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.toggles.scss +0 -74
  190. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.trees.scss +0 -47
  191. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/components.typography.scss +0 -94
  192. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/generics.global.scss +0 -13
  193. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.alerts.scss +0 -6
  194. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.badges.scss +0 -8
  195. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.links.scss +0 -22
  196. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.lists.scss +0 -10
  197. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.navs.scss +0 -29
  198. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.ranges.scss +0 -89
  199. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.tabs.scss +0 -5
  200. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.toggles.scss +0 -6
  201. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_components.typography.scss +0 -25
  202. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_objects.containers.scss +0 -10
  203. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_settings.global.scss +0 -864
  204. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/mixins/_utilities.boxing.scss +0 -125
  205. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.containers.scss +0 -31
  206. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.drawers.scss +0 -88
  207. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.forms.scss +0 -25
  208. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/objects.modals.scss +0 -58
  209. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/themes/blaze.example.scss +0 -7
  210. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.boxing.scss +0 -101
  211. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.elevation.scss +0 -19
  212. data/app/assets/stylesheets/activeadmin_blaze_theme/blaze/utilities.sizes.scss +0 -25
  213. data/extra/screenshot1.jpg +0 -0
  214. data/extra/screenshot2.jpg +0 -0
  215. data/extra/screenshot3.jpg +0 -0
  216. data/extra/screenshot4.jpg +0 -0
@@ -0,0 +1,72 @@
1
+ @import 'mixins/utilities.states';
2
+ @import 'mixins/utilities.visibility';
3
+
4
+ @mixin link--color {
5
+ @include disabled;
6
+ color: var(--color-link);
7
+ background-color: transparent;
8
+
9
+ &:not(:disabled) {
10
+ &:visited {
11
+ opacity: 0.9;
12
+ }
13
+
14
+ &:hover {
15
+ background-color: transparent;
16
+ opacity: 0.9;
17
+ }
18
+
19
+ &:active {
20
+ background-color: transparent;
21
+ opacity: 0.8;
22
+ }
23
+ }
24
+ }
25
+
26
+ a.c-link,
27
+ .c-link[role='link'] {
28
+ @include link--color;
29
+
30
+ text-decoration: none;
31
+ cursor: pointer;
32
+
33
+ &:hover {
34
+ text-decoration: underline;
35
+ }
36
+
37
+ .c-link--skip {
38
+ @include visually-hidden;
39
+
40
+ top: 0;
41
+ left: 0;
42
+ z-index: var(--z-over-everything);
43
+
44
+ &:active,
45
+ &:focus {
46
+ width: auto;
47
+ height: auto;
48
+ overflow: auto;
49
+ clip-path: none;
50
+ }
51
+ }
52
+
53
+ &.c-link--brand {
54
+ --color-link: var(--color-brand);
55
+ }
56
+
57
+ &.c-link--info {
58
+ --color-link: var(--color-info);
59
+ }
60
+
61
+ &.c-link--warning {
62
+ --color-link: var(--color-warning);
63
+ }
64
+
65
+ &.c-link--success {
66
+ --color-link: var(--color-success);
67
+ }
68
+
69
+ &.c-link--error {
70
+ --color-link: var(--color-error);
71
+ }
72
+ }
@@ -0,0 +1,64 @@
1
+ ul.c-list,
2
+ ol.c-list,
3
+ .c-list[role='list'] {
4
+ display: block;
5
+ margin: 0;
6
+ padding: 0 0 0 var(--spacing-medium);
7
+ list-style-position: outside;
8
+
9
+ ul.c-list,
10
+ ol.c-list,
11
+ .c-list[role='list'] {
12
+ padding: 0 0 0 var(--spacing-medium);
13
+ }
14
+
15
+ .c-list__item {
16
+ padding: 0;
17
+ }
18
+
19
+ .c-list__item--unstyled {
20
+ list-style: none;
21
+ }
22
+
23
+ &.c-list--unstyled {
24
+ padding: 0;
25
+ list-style: none;
26
+ }
27
+
28
+ &.c-list--ordered {
29
+ padding: 0;
30
+ list-style: none;
31
+ counter-reset: ordered;
32
+
33
+ .c-list__item {
34
+ &::before {
35
+ padding: 0 var(--spacing-small) 0 0;
36
+ content: counters(ordered, '.') ' ';
37
+ counter-increment: ordered;
38
+ }
39
+ }
40
+ }
41
+
42
+ &.c-list--inline {
43
+ padding: 0;
44
+
45
+ .c-list--inline {
46
+ padding: 0;
47
+ }
48
+
49
+ .c-list__item {
50
+ display: inline-block;
51
+ width: auto;
52
+ padding-right: var(--spacing-medium);
53
+ }
54
+
55
+ &:not(.c-list--unstyled) {
56
+ .c-list__item {
57
+ &::before {
58
+ padding: 0 var(--spacing-small) 0 0;
59
+ content: '\2022';
60
+ }
61
+ }
62
+ }
63
+ }
64
+ }
@@ -0,0 +1,83 @@
1
+ nav.c-nav,
2
+ .c-nav[role='navigation'] {
3
+ z-index: var(--z-over-page);
4
+ width: 280px;
5
+ height: 100%;
6
+ margin: 0;
7
+ padding: 0;
8
+ overflow-x: hidden;
9
+ overflow-y: auto;
10
+ -webkit-overflow-scrolling: touch;
11
+ color: #fff;
12
+ background-color: #000;
13
+
14
+ &.c-nav--left {
15
+ position: fixed;
16
+ top: 0;
17
+ right: auto;
18
+ bottom: 0;
19
+ left: 0;
20
+ }
21
+
22
+ &.c-nav--right {
23
+ position: fixed;
24
+ top: 0;
25
+ right: 0;
26
+ bottom: 0;
27
+ left: auto;
28
+ }
29
+
30
+ .c-nav__item,
31
+ .c-nav__content {
32
+ display: block;
33
+ height: 3.5em;
34
+ padding: 0 var(--spacing-medium);
35
+ color: inherit;
36
+ line-height: 3.5em;
37
+
38
+ .o-image {
39
+ height: 100%;
40
+ }
41
+ }
42
+
43
+ .c-nav__item {
44
+ --nav-background-color: var(--color-default);
45
+
46
+ text-decoration: none;
47
+
48
+ &:hover,
49
+ &--active {
50
+ color: var(--nav-color);
51
+ background-color: var(--nav-background-color);
52
+ }
53
+
54
+ &:focus {
55
+ box-shadow: var(--box-shadow-focus);
56
+ }
57
+
58
+ &:active {
59
+ filter: brightness(0.95);
60
+ }
61
+ }
62
+
63
+ .c-nav__item--brand {
64
+ --nav-background-color: var(--color-brand);
65
+ }
66
+
67
+ .c-nav__item--info {
68
+ --nav-background-color: var(--color-info);
69
+ }
70
+
71
+ .c-nav__item--warning {
72
+ --nav-color: #000;
73
+ --nav-background-color: var(--color-warning);
74
+ }
75
+
76
+ .c-nav__item--success {
77
+ --nav-background-color: var(--color-success);
78
+ }
79
+
80
+ .c-nav__item--error {
81
+ --nav-background-color: var(--color-error);
82
+ }
83
+ }
@@ -0,0 +1,23 @@
1
+ .c-overlay[aria-hidden] {
2
+ position: fixed;
3
+ top: 0;
4
+ right: 0;
5
+ bottom: 0;
6
+ left: 0;
7
+ z-index: var(--overlay-z-index);
8
+ display: block;
9
+ width: 100%;
10
+ height: 100%;
11
+ background-color: transparentize(#000, 0.6);
12
+ visibility: hidden;
13
+ opacity: 0;
14
+
15
+ &.c-overlay--visible {
16
+ visibility: visible;
17
+ opacity: 1;
18
+ }
19
+
20
+ &.c-overlay--transparent {
21
+ background-color: transparent;
22
+ }
23
+ }
@@ -0,0 +1,31 @@
1
+ @import 'mixins/components.buttons';
2
+
3
+ nav.c-pagination,
4
+ .c-pagination[role='navigation'] {
5
+ display: flex;
6
+ width: 100%;
7
+ padding: var(--spacing-medium);
8
+ font-size: var(--text-font-size-medium);
9
+ text-align: center;
10
+ }
11
+
12
+ .c-pagination__pages {
13
+ display: flex;
14
+ flex: 1 0 auto;
15
+ justify-content: center;
16
+
17
+ .c-pagination__control {
18
+ margin: 0 0.2em;
19
+ }
20
+ }
21
+
22
+ .c-pagination__control {
23
+ --button-color: var(--color-brand);
24
+
25
+ @include button;
26
+ @include button-ghost;
27
+
28
+ flex: 0 0 auto;
29
+ min-width: 2.4em;
30
+ border-radius: var(--border-radius-rounded);
31
+ }
@@ -0,0 +1,83 @@
1
+ .c-progress {
2
+ --progress-bar-color: #fff;
3
+ --progress-bar-background-color: var(--color-default);
4
+
5
+ display: block;
6
+ overflow: hidden;
7
+ color: var(--progress-bar-color);
8
+ text-align: center;
9
+ background-color: var(--color-background);
10
+ border: 0;
11
+ border-radius: var(--border-radius);
12
+
13
+ &.c-progress--rounded {
14
+ border-radius: var(--border-radius-rounded);
15
+ }
16
+
17
+ &.c-progress--timer {
18
+ --border-radius: 0;
19
+ height: 3px;
20
+
21
+ .c-progress__bar[role='progressbar'] {
22
+ width: 0;
23
+ animation-name: slide;
24
+ animation-duration: 10s;
25
+ animation-timing-function: linear;
26
+ animation-iteration-count: infinite;
27
+ animation-fill-mode: forwards;
28
+ }
29
+
30
+ @keyframes slide {
31
+ from {
32
+ width: 0;
33
+ }
34
+
35
+ 95% {
36
+ width: 100%;
37
+ opacity: 1;
38
+ }
39
+
40
+ 100% {
41
+ width: 100%;
42
+ opacity: 0;
43
+ }
44
+ }
45
+ }
46
+
47
+ .c-progress__bar[role='progressbar'] {
48
+ display: block;
49
+ float: left;
50
+ height: 100%;
51
+ overflow: hidden;
52
+ white-space: nowrap;
53
+ text-overflow: ellipsis;
54
+ background-color: var(--progress-bar-background-color);
55
+ border-radius: 0;
56
+
57
+ &::after {
58
+ color: transparent !important;
59
+ content: '-';
60
+ }
61
+
62
+ &.c-progress__bar--brand {
63
+ --progress-bar-background-color: var(--color-brand);
64
+ }
65
+
66
+ &.c-progress__bar--info {
67
+ --progress-bar-background-color: var(--color-info);
68
+ }
69
+
70
+ &.c-progress__bar--warning {
71
+ --progress-bar-color: #000;
72
+ --progress-bar-background-color: var(--color-warning);
73
+ }
74
+
75
+ &.c-progress__bar--success {
76
+ --progress-bar-background-color: var(--color-success);
77
+ }
78
+
79
+ &.c-progress__bar--error {
80
+ --progress-bar-background-color: var(--color-error);
81
+ }
82
+ }
83
+ }
@@ -0,0 +1,176 @@
1
+ @mixin range-track {
2
+ width: 100%;
3
+ height: 10px;
4
+ border: 0;
5
+ border-radius: var(--border-radius-rounded);
6
+ box-shadow: none;
7
+ }
8
+
9
+ @mixin range-track-ms {
10
+ color: transparent;
11
+ background-color: transparent;
12
+ border-color: transparent;
13
+ }
14
+
15
+ @mixin range-fill-ms {
16
+ background-color: var(--color-default);
17
+ border: 0;
18
+ border-radius: var(--border-radius-rounded);
19
+ box-shadow: none;
20
+ }
21
+
22
+ @mixin range-thumb {
23
+ width: 20px;
24
+ height: 20px;
25
+ margin: -5px 0 0 0;
26
+ background-color: #fff;
27
+ border: 0;
28
+ border-radius: var(--border-radius-rounded);
29
+ box-shadow: 0 1px 4px -1px #000;
30
+ }
31
+
32
+ @mixin range-thumb-focus {
33
+ border-color: var(--border-color-focus);
34
+ box-shadow: var(--box-shadow-focus);
35
+ }
36
+
37
+ @mixin range-thumb-webkit {
38
+ -webkit-appearance: none;
39
+ }
40
+
41
+ @mixin range-thumb-active {
42
+ transform: scale(1.4);
43
+ }
44
+
45
+ @mixin range-disabled {
46
+ background-color: var(--color-disabled-background);
47
+ cursor: not-allowed;
48
+ }
49
+
50
+ .c-range[type='range'] {
51
+ --range-track-color: var(--color-default);
52
+
53
+ width: 100%;
54
+ padding: var(--spacing-small) 0;
55
+ outline: 0;
56
+ -webkit-appearance: none;
57
+
58
+ &.c-range--brand {
59
+ --range-track-color: var(--color-brand);
60
+ }
61
+
62
+ &.c-range--info {
63
+ --range-track-color: var(--color-info);
64
+ }
65
+
66
+ &.c-range--warning {
67
+ --range-track-color: var(--color-warning);
68
+ }
69
+
70
+ &.c-range--success {
71
+ --range-track-color: var(--color-success);
72
+ }
73
+
74
+ &.c-range--error {
75
+ --range-track-color: var(--color-error);
76
+ }
77
+
78
+ &:not(:disabled) {
79
+ &::-webkit-slider-runnable-track {
80
+ background-color: var(--range-track-color);
81
+ }
82
+
83
+ &::-moz-range-track {
84
+ background-color: var(--range-track-color);
85
+ }
86
+
87
+ &::-ms-track {
88
+ background-color: var(--range-track-color);
89
+ }
90
+ }
91
+
92
+ &:not(:disabled):active {
93
+ &::-webkit-slider-thumb {
94
+ transform: scale(1.4);
95
+ }
96
+
97
+ &::-moz-range-thumb {
98
+ transform: scale(1.4);
99
+ }
100
+
101
+ &::-ms-thumb {
102
+ transform: scale(1.4);
103
+ }
104
+ }
105
+
106
+ &:focus {
107
+ &::-webkit-slider-thumb {
108
+ @include range-thumb-focus;
109
+ }
110
+
111
+ &::-moz-range-thumb {
112
+ @include range-thumb-focus;
113
+ }
114
+
115
+ &::-ms-thumb {
116
+ @include range-thumb-focus;
117
+ }
118
+ }
119
+
120
+ &:disabled {
121
+ &::-webkit-slider-thumb {
122
+ @include range-disabled;
123
+ }
124
+
125
+ &::-webkit-slider-runnable-track {
126
+ @include range-disabled;
127
+ }
128
+
129
+ &::-moz-range-thumb {
130
+ @include range-disabled;
131
+ }
132
+
133
+ &::-moz-range-track {
134
+ @include range-disabled;
135
+ }
136
+
137
+ &::-ms-thumb {
138
+ @include range-disabled;
139
+ }
140
+
141
+ &::-ms-track {
142
+ @include range-disabled;
143
+ }
144
+ }
145
+ }
146
+
147
+ .c-range::-webkit-slider-runnable-track {
148
+ @include range-track;
149
+ }
150
+
151
+ .c-range::-webkit-slider-thumb {
152
+ @include range-thumb;
153
+ @include range-thumb-webkit;
154
+ }
155
+
156
+ .c-range::-moz-range-track {
157
+ @include range-track;
158
+ }
159
+
160
+ .c-range::-moz-range-thumb {
161
+ @include range-thumb;
162
+ }
163
+
164
+ .c-range::-ms-track {
165
+ @include range-track;
166
+ @include range-track-ms;
167
+ }
168
+
169
+ .c-range::-ms-fill-lower,
170
+ .c-range::-ms-fill-upper {
171
+ @include range-fill-ms;
172
+ }
173
+
174
+ .c-range::-ms-thumb {
175
+ @include range-thumb;
176
+ }