active_material 1.4.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (85) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE.txt +22 -0
  3. data/README.md +60 -0
  4. data/app/assets/images/active_material/icons/account_circle.svg +9 -0
  5. data/app/assets/images/active_material/icons/arrow-dropdown.svg +7 -0
  6. data/app/assets/images/active_material/icons/arrow_down.svg +7 -0
  7. data/app/assets/images/active_material/icons/clear.svg +8 -0
  8. data/app/assets/images/active_material/icons/create.svg +8 -0
  9. data/app/assets/images/active_material/icons/email.svg +8 -0
  10. data/app/assets/images/active_material/icons/event.svg +8 -0
  11. data/app/assets/images/active_material/icons/more.svg +9 -0
  12. data/app/assets/images/active_material/icons/reorder.svg +4 -0
  13. data/app/assets/images/active_material/icons/search.svg +9 -0
  14. data/app/assets/images/active_material/icons/secret.svg +8 -0
  15. data/app/assets/javascripts/active_material/fonts.js +21 -0
  16. data/app/assets/javascripts/active_material.js +1 -0
  17. data/app/assets/stylesheets/active_material/atoms/clearfix.scss +14 -0
  18. data/app/assets/stylesheets/active_material/atoms/color.scss +5 -0
  19. data/app/assets/stylesheets/active_material/atoms/family.scss +5 -0
  20. data/app/assets/stylesheets/active_material/atoms/fill.scss +5 -0
  21. data/app/assets/stylesheets/active_material/atoms/hidden.scss +5 -0
  22. data/app/assets/stylesheets/active_material/atoms/links.scss +23 -0
  23. data/app/assets/stylesheets/active_material/atoms/lists.scss +13 -0
  24. data/app/assets/stylesheets/active_material/atoms/paper.scss +7 -0
  25. data/app/assets/stylesheets/active_material/atoms/type.scss +54 -0
  26. data/app/assets/stylesheets/active_material/components/avatar.scss +3 -0
  27. data/app/assets/stylesheets/active_material/components/blank_slate.scss +26 -0
  28. data/app/assets/stylesheets/active_material/components/breadcrumbs.scss +11 -0
  29. data/app/assets/stylesheets/active_material/components/buttons.scss +20 -0
  30. data/app/assets/stylesheets/active_material/components/checkbox.scss +21 -0
  31. data/app/assets/stylesheets/active_material/components/clearfix.scss +3 -0
  32. data/app/assets/stylesheets/active_material/components/date-select.scss +31 -0
  33. data/app/assets/stylesheets/active_material/components/datepicker.scss +58 -0
  34. data/app/assets/stylesheets/active_material/components/dialog.scss +37 -0
  35. data/app/assets/stylesheets/active_material/components/dropdown.scss +33 -0
  36. data/app/assets/stylesheets/active_material/components/featured-blocks.scss +12 -0
  37. data/app/assets/stylesheets/active_material/components/filter.scss +61 -0
  38. data/app/assets/stylesheets/active_material/components/flash.scss +13 -0
  39. data/app/assets/stylesheets/active_material/components/footer.scss +4 -0
  40. data/app/assets/stylesheets/active_material/components/forms.scss +92 -0
  41. data/app/assets/stylesheets/active_material/components/header.scss +64 -0
  42. data/app/assets/stylesheets/active_material/components/hidden.scss +3 -0
  43. data/app/assets/stylesheets/active_material/components/login.scss +53 -0
  44. data/app/assets/stylesheets/active_material/components/overlay.scss +8 -0
  45. data/app/assets/stylesheets/active_material/components/pagination.scss +43 -0
  46. data/app/assets/stylesheets/active_material/components/panels.scss +38 -0
  47. data/app/assets/stylesheets/active_material/components/photo_select.scss +7 -0
  48. data/app/assets/stylesheets/active_material/components/scopes.scss +29 -0
  49. data/app/assets/stylesheets/active_material/components/select.scss +20 -0
  50. data/app/assets/stylesheets/active_material/components/sortable.scss +36 -0
  51. data/app/assets/stylesheets/active_material/components/structure.scss +30 -0
  52. data/app/assets/stylesheets/active_material/components/tables.scss +85 -0
  53. data/app/assets/stylesheets/active_material/components/tabs.scss +25 -0
  54. data/app/assets/stylesheets/active_material/components/tag.scss +23 -0
  55. data/app/assets/stylesheets/active_material/components/title_bar.scss +21 -0
  56. data/app/assets/stylesheets/active_material/components/utility_nav.scss +84 -0
  57. data/app/assets/stylesheets/active_material/generators/functions.scss +102 -0
  58. data/app/assets/stylesheets/active_material/generators/mixins.scss +24 -0
  59. data/app/assets/stylesheets/active_material/global/foundation.scss +107 -0
  60. data/app/assets/stylesheets/active_material/prototypes/actions-footer.scss +8 -0
  61. data/app/assets/stylesheets/active_material/prototypes/avatar.scss +19 -0
  62. data/app/assets/stylesheets/active_material/prototypes/btn-icon.scss +14 -0
  63. data/app/assets/stylesheets/active_material/prototypes/button.scss +58 -0
  64. data/app/assets/stylesheets/active_material/prototypes/datepicker.scss +107 -0
  65. data/app/assets/stylesheets/active_material/prototypes/dialog.scss +54 -0
  66. data/app/assets/stylesheets/active_material/prototypes/menu.scss +118 -0
  67. data/app/assets/stylesheets/active_material/prototypes/multiselect.scss +20 -0
  68. data/app/assets/stylesheets/active_material/prototypes/select.scss +42 -0
  69. data/app/assets/stylesheets/active_material/prototypes/snackbar.scss +47 -0
  70. data/app/assets/stylesheets/active_material/prototypes/subheader.scss +13 -0
  71. data/app/assets/stylesheets/active_material/prototypes/table.scss +116 -0
  72. data/app/assets/stylesheets/active_material/prototypes/tabs.scss +109 -0
  73. data/app/assets/stylesheets/active_material/prototypes/tag.scss +36 -0
  74. data/app/assets/stylesheets/active_material/prototypes/textfield.scss +137 -0
  75. data/app/assets/stylesheets/active_material/prototypes/toolbar.scss +70 -0
  76. data/app/assets/stylesheets/active_material/prototypes/underlay.scss +16 -0
  77. data/app/assets/stylesheets/active_material/values/breakpoints.scss +3 -0
  78. data/app/assets/stylesheets/active_material/values/colors.scss +104 -0
  79. data/app/assets/stylesheets/active_material/values/elevation.scss +8 -0
  80. data/app/assets/stylesheets/active_material/values/fonts.scss +10 -0
  81. data/app/assets/stylesheets/active_material/values/units.scss +8 -0
  82. data/app/assets/stylesheets/active_material.scss +36 -0
  83. data/lib/active_material/version.rb +3 -0
  84. data/lib/active_material.rb +8 -0
  85. metadata +156 -0
checksums.yaml ADDED
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA1:
3
+ metadata.gz: 4db8f4dd0845f94f384644dd2913f1062a02b856
4
+ data.tar.gz: 3a818db9e6715b003a9c82c8b2ebc747b4686118
5
+ SHA512:
6
+ metadata.gz: 035d18d160a33a97784977e95c70cc340ea7724af54976771f433021cc6b67f741e3dd12f820e26e2d71f04ca0d938625396d99a3b424aeea68f937e79e962ec
7
+ data.tar.gz: d3780de85ae2544e665638f0dff2e95200ca7f314fc3c32e6ed4f442eb9453fea2dc7bbbce2bf335b378028aea70e6ba5c7ecc5a48bf8acab1eb4d052bda166f
data/LICENSE.txt ADDED
@@ -0,0 +1,22 @@
1
+ Copyright (c) 2015 David Eisinger
2
+
3
+ MIT License
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining
6
+ a copy of this software and associated documentation files (the
7
+ "Software"), to deal in the Software without restriction, including
8
+ without limitation the rights to use, copy, modify, merge, publish,
9
+ distribute, sublicense, and/or sell copies of the Software, and to
10
+ permit persons to whom the Software is furnished to do so, subject to
11
+ the following conditions:
12
+
13
+ The above copyright notice and this permission notice shall be
14
+ included in all copies or substantial portions of the Software.
15
+
16
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
19
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
20
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
21
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
22
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/README.md ADDED
@@ -0,0 +1,60 @@
1
+ # ActiveMaterial
2
+
3
+ An ActiveAdmin skin based on Google's Material Design.
4
+
5
+ <img src="http://i.imgur.com/kDkGzYe.png">
6
+
7
+ 1. [Installation](#installation)
8
+ 2. [Usage](#usage)
9
+ 3. [Customization](#customization)
10
+ 4. [Contributing](#contributing)
11
+
12
+ ## Installation
13
+
14
+ Add this line to your application's Gemfile:
15
+
16
+ ```ruby
17
+ gem "active_material", git: "git@github.com:vigetlabs/active_material.git"
18
+ ```
19
+
20
+ And then execute:
21
+
22
+ ```shell
23
+ $ bundle
24
+ ```
25
+
26
+ Or install it yourself as:
27
+
28
+ ```shell
29
+ $ gem install active_material
30
+ ```
31
+
32
+ ## Usage
33
+
34
+ In `app/assets/stylesheets/active_admin.css.scss`, replace:
35
+
36
+ `@import "active_admin/base";`
37
+
38
+ with
39
+
40
+ `@import "active_material";`
41
+
42
+ ## Customization
43
+
44
+ Refer to the [Customization Guide](./docs/customization.md).
45
+
46
+ ## Contributing
47
+
48
+ 1. Fork it ( https://github.com/[my-github-username]/active_material/fork )
49
+ 2. Create your feature branch (`git checkout -b my-new-feature`)
50
+ 3. Commit your changes (`git commit -am "Add some feature"`)
51
+ 4. Push to the branch (`git push origin my-new-feature`)
52
+ 5. Create a new Pull Request
53
+
54
+ ***
55
+
56
+ <a href="http://code.viget.com">
57
+ <img src="http://code.viget.com/github-banner.png" alt="Code At Viget">
58
+ </a>
59
+
60
+ Visit [code.viget.com](http://code.viget.com) to see more projects from [Viget.](https://viget.com)
@@ -0,0 +1,9 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="48px" height="48px" viewBox="0 0 48 48" enable-background="new 0 0 48 48" xml:space="preserve">
6
+ <path fill="#FFFFFF" d="M24,4C12.95,4,4,12.95,4,24s8.95,20,20,20s20-8.95,20-20S35.05,4,24,4z M24,10c3.311,0,6,2.69,6,6
7
+ c0,3.32-2.689,6-6,6c-3.31,0-6-2.68-6-6C18,12.69,20.69,10,24,10z M24,38.4c-5.01,0-9.41-2.561-12-6.44c0.05-3.97,8.01-6.16,12-6.16
8
+ s11.939,2.19,12,6.16C33.41,35.84,29.01,38.4,24,38.4z"/>
9
+ </svg>
@@ -0,0 +1,7 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="18px" height="18px" viewBox="0 0 18 18" enable-background="new 0 0 18 18" xml:space="preserve">
6
+ <path opacity="0.4" d="M5,8l4,4l4-4H5z"/>
7
+ </svg>
@@ -0,0 +1,7 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
6
+ <path opacity="0.5" d="M7.41,7.84L12,12.42l4.59-4.58L18,9.25l-6,6l-6-6L7.41,7.84z"/>
7
+ </svg>
@@ -0,0 +1,8 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
6
+ <path opacity="0.54" d="M19,6.41L17.59,5L12,10.59L6.41,5L5,6.41L10.59,12L5,17.59L6.41,19L12,13.41L17.59,19L19,17.59L13.41,12
7
+ L19,6.41z"/>
8
+ </svg>
@@ -0,0 +1,8 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
6
+ <path opacity="0.54" d="M3,17.25V21h3.75L17.811,9.94l-3.75-3.75L3,17.25z M20.71,7.04c0.39-0.39,0.39-1.02,0-1.41l-2.34-2.34
7
+ c-0.39-0.39-1.021-0.39-1.41,0l-1.83,1.83l3.75,3.75L20.71,7.04z"/>
8
+ </svg>
@@ -0,0 +1,8 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
6
+ <path opacity="0.3" enable-background="new " d="M20,4H4C2.9,4,2.01,4.9,2.01,6L2,18c0,1.1,0.9,2,2,2h16c1.1,0,2-0.9,2-2V6
7
+ C22,4.9,21.1,4,20,4z M20,8l-8,5L4,8V6l8,5l8-5V8z"/>
8
+ </svg>
@@ -0,0 +1,8 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
6
+ <path opacity="0.4" d="M17,12h-5v5h5V12z M16,1v2H8V1H6v2H5C3.89,3,3.01,3.9,3.01,5L3,19c0,1.1,0.89,2,2,2h14c1.1,0,2-0.9,2-2V5
7
+ c0-1.1-0.9-2-2-2h-1V1H16z M19,19H5V8h14V19z"/>
8
+ </svg>
@@ -0,0 +1,9 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
6
+ <path fill="none" d="M0,0h24v24H0V0z"/>
7
+ <path opacity="0.875" d="M12,8c1.1,0,2-0.9,2-2s-0.9-2-2-2c-1.1,0-2,0.9-2,2S10.9,8,12,8z M12,10c-1.1,0-2,0.9-2,2c0,1.1,0.9,2,2,2
8
+ c1.1,0,2-0.9,2-2C14,10.9,13.1,10,12,10z M12,16c-1.1,0-2,0.9-2,2s0.9,2,2,2c1.1,0,2-0.9,2-2S13.1,16,12,16z"/>
9
+ </svg>
@@ -0,0 +1,4 @@
1
+ <svg fill="#000000" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
2
+ <path d="M0 0h24v24H0z" fill="none"/>
3
+ <path d="M3 15h18v-2H3v2zm0 4h18v-2H3v2zm0-8h18V9H3v2zm0-6v2h18V5H3z"/>
4
+ </svg>
@@ -0,0 +1,9 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
6
+ <path opacity="0.54" d="M15.5,14h-0.79l-0.28-0.27C15.41,12.59,16,11.11,16,9.5C16,5.91,13.09,3,9.5,3S3,5.91,3,9.5S5.91,16,9.5,16
7
+ c1.61,0,3.09-0.59,4.23-1.57L14,14.71v0.79l5,4.99L20.49,19L15.5,14z M9.5,14C7.01,14,5,11.99,5,9.5S7.01,5,9.5,5S14,7.01,14,9.5
8
+ S11.99,14,9.5,14z"/>
9
+ </svg>
@@ -0,0 +1,8 @@
1
+ <?xml version="1.0" encoding="utf-8"?>
2
+ <!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
3
+ <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
4
+ <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
5
+ width="24px" height="24px" viewBox="0 0 24 24" enable-background="new 0 0 24 24" xml:space="preserve">
6
+ <path opacity="0.4" d="M12.65,10C11.83,7.67,9.61,6,7,6c-3.31,0-6,2.69-6,6c0,3.311,2.69,6,6,6c2.61,0,4.83-1.67,5.65-4H17v4h4v-4h2
7
+ v-4H12.65z M7,14c-1.1,0-2-0.9-2-2c0-1.1,0.9-2,2-2s2,0.9,2,2C9,13.1,8.1,14,7,14z"/>
8
+ </svg>
@@ -0,0 +1,21 @@
1
+ /**
2
+ * Fonts.js
3
+ * Material design uses the Roboto Family. This script is responsible
4
+ * for pulling it in asynchronously.
5
+ *
6
+ * http://www.google.com/design/spec/style/typography.html#typography-typeface
7
+ */
8
+
9
+ WebFontConfig = {
10
+ google: { families: [ 'RobotoDraft:regular,medium,bold,italic:latin' ] }
11
+ };
12
+
13
+ (function() {
14
+ var wf = document.createElement('script');
15
+ wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
16
+ '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
17
+ wf.type = 'text/javascript';
18
+ wf.async = 'true';
19
+ var s = document.getElementsByTagName('script')[0];
20
+ s.parentNode.insertBefore(wf, s);
21
+ })();
@@ -0,0 +1 @@
1
+ //= require active_material/fonts
@@ -0,0 +1,14 @@
1
+ /// Injects standard clearfix rules
2
+ @mixin am-clearfix {
3
+ *zoom: 1;
4
+
5
+ &:before,
6
+ &:after {
7
+ content: " ";
8
+ display: table;
9
+ }
10
+
11
+ &:after {
12
+ clear: both;
13
+ }
14
+ }
@@ -0,0 +1,5 @@
1
+ /// Injects a color property given a key within $am-color.
2
+ /// @param {any} $key - A key within $am-color
3
+ @mixin am-color($key) {
4
+ color: am-color($key);
5
+ }
@@ -0,0 +1,5 @@
1
+ /// Injects a font-family property given a key within $am-font-family.
2
+ /// @param {any} $key - A key within $am-font-family
3
+ @mixin am-font-family($key) {
4
+ font-family: am-font-family($key)
5
+ }
@@ -0,0 +1,5 @@
1
+ /// Injects a background-color property given a key within $am-color.
2
+ /// @param {any} $key - A key within $am-color
3
+ @mixin am-fill($key) {
4
+ background-color: am-color($key);
5
+ }
@@ -0,0 +1,5 @@
1
+ /// Injects rules to visually hide an element
2
+ @mixin am-hidden {
3
+ clip: rect(0, 0, 0, 0) !important;
4
+ position: absolute !important;
5
+ }
@@ -0,0 +1,23 @@
1
+ /// Assigns a color rule and rules to adjust color to the
2
+ /// accent color upon hover/focus
3
+ ///
4
+ /// @param {any} $initial - A color key for the initial text color
5
+ /// @param {any} $focus - A color key for the focus/hover text color
6
+ @mixin am-link($initial:text, $focus:accent) {
7
+ @include am-color($initial);
8
+
9
+ &:hover,
10
+ &:focus {
11
+ @include am-color($focus);
12
+ }
13
+ }
14
+
15
+ /// Strips away text decoration, applying an underline on hover/focus
16
+ @mixin am-link-no-decoration {
17
+ text-decoration: none;
18
+
19
+ &:hover,
20
+ &:focus {
21
+ text-decoration: none;
22
+ }
23
+ }
@@ -0,0 +1,13 @@
1
+ /// Nullify default list rules
2
+ @mixin am-list-blank {
3
+ list-style: none;
4
+ margin: 0;
5
+ padding: 0;
6
+ }
7
+
8
+ /// Inject a rule for child <li> tags to use inline-block.
9
+ @mixin am-list-inline {
10
+ li {
11
+ display: inline-block;
12
+ }
13
+ }
@@ -0,0 +1,7 @@
1
+ /// Inject rules for generic, elevated surfaces. This is used for
2
+ /// elements that overlap other content, such as panels and sidebars.
3
+ @mixin am-paper {
4
+ @include am-fill(paper);
5
+ border-radius: 2px;
6
+ box-shadow: 0 1px 2px rgba(#000, 0.24), 0 0 2px rgba(#000, 0.15);
7
+ }
@@ -0,0 +1,54 @@
1
+ /// Type Atoms
2
+ ///
3
+ /// Mixins for manipulation of typography. These styles mirror the
4
+ /// Material Design standard
5
+ ///
6
+ /// https://www.google.com/design/spec/style/typography.html
7
+
8
+ /// Applies rules for subheader text.
9
+ @mixin am-type-subheader {
10
+ @include am-font-size(16);
11
+ font-weight: 400;
12
+ line-height: am-sp(24);
13
+ letter-spacing: am-tracking(10);
14
+ }
15
+
16
+ /// Applies rules for heavier, more emphasized, body text.
17
+ @mixin am-type-body-2 {
18
+ @include am-font-size(14);
19
+ font-weight: 600;
20
+ line-height: am-sp(24);
21
+ letter-spacing: am-tracking(10);
22
+ }
23
+
24
+ /// Applies rules for standard body text.
25
+ @mixin am-type-body-1 {
26
+ @include am-font-size(14);
27
+ font-weight: 400;
28
+ line-height: am-sp(20);
29
+ letter-spacing: am-tracking(10);
30
+ }
31
+
32
+ /// Applies rules for caption text.
33
+ @mixin am-type-caption {
34
+ @include am-font-size(12);
35
+ font-style: normal;
36
+ font-weight: 500;
37
+ letter-spacing: am-tracking(20);
38
+ line-height: am-sp(12);
39
+ }
40
+
41
+ /// Applies rules for button text.
42
+ @mixin am-type-btn {
43
+ @include am-font-size(14);
44
+ font-weight: 500;
45
+ letter-spacing: am-tracking(10);
46
+ line-height: am-sp(12);
47
+ text-transform: uppercase;
48
+ }
49
+
50
+ /// Applies rules for smooth text anti-aliasing.
51
+ @mixin am-type-smooth {
52
+ -moz-osx-font-smoothing: grayscale;
53
+ -webkit-font-smoothing: antialiased;
54
+ }
@@ -0,0 +1,3 @@
1
+ .avatar {
2
+ @include am-avatar;
3
+ }
@@ -0,0 +1,26 @@
1
+ /**
2
+ * Blank Slate
3
+ * This element appears whenever a resource can not display
4
+ * any information. For example, the default homescreen.
5
+ */
6
+
7
+ .blank_slate_container {
8
+ @include am-color(tertiary-text);
9
+ @include am-type-body-1;
10
+ @include am-type-smooth;
11
+ font-weight: 600;
12
+ padding: am-unit(3) am-unit(2);
13
+ text-align: center;
14
+ }
15
+
16
+ .blank_slate {
17
+ border: 1px dashed rgba(#000, 0.2);
18
+ border-radius: 3px;
19
+ display: inline-block;
20
+ padding: 16px 24px;
21
+
22
+ small {
23
+ display: block;
24
+ margin-top: am-unit(1);
25
+ }
26
+ }
@@ -0,0 +1,11 @@
1
+ /**
2
+ * Breadcrumbs
3
+ * Appear above the title to help users return to previous
4
+ * steps in their flow.
5
+ */
6
+
7
+ .breadcrumb {
8
+ @include am-type-caption;
9
+ display: block;
10
+ margin-bottom: am-unit(1);
11
+ }
@@ -0,0 +1,20 @@
1
+ /**
2
+ * Buttons
3
+ * Various selectors for button like elements
4
+ */
5
+
6
+ .clear_filters_btn {
7
+ @include am-btn;
8
+ }
9
+
10
+ .button,
11
+ .cancel a {
12
+ @include am-btn;
13
+ }
14
+
15
+ input[type="submit"],
16
+ input[type="reset"],
17
+ input[type="button"] {
18
+ @include am-btn;
19
+ @include am-btn-raised;
20
+ }
@@ -0,0 +1,21 @@
1
+ /**
2
+ * Checkboxes
3
+ * Inputs given the "boolean" class. They have been seperated
4
+ * from general form styles because of some hairy nesting.
5
+ */
6
+
7
+ .input.boolean {
8
+
9
+ > label {
10
+ font-size: 14px;
11
+ }
12
+
13
+ > label > input {
14
+ display: inline-block;
15
+ margin-right: am-unit(1);
16
+ position: relative;
17
+ top: -1px;
18
+ width: auto;
19
+ }
20
+
21
+ }
@@ -0,0 +1,3 @@
1
+ .clearfix {
2
+ @include am-clearfix;
3
+ }
@@ -0,0 +1,31 @@
1
+ /**
2
+ * Date Selects
3
+ */
4
+
5
+ .date_select,
6
+ .datetime_select,
7
+ .time_select {
8
+
9
+ .fragments-group {
10
+ @include am-list-blank;
11
+ @include am-list-inline;
12
+ @include am-select;
13
+ }
14
+
15
+ .fragment {
16
+ @include am-select-unit;
17
+
18
+ select {
19
+ @include am-select-input-borderless;
20
+ }
21
+ }
22
+
23
+ .fragment label {
24
+ @include am-hidden;
25
+ }
26
+
27
+ .fragment select {
28
+ @include am-select-input;
29
+ }
30
+
31
+ }
@@ -0,0 +1,58 @@
1
+ /**
2
+ * Datepicker
3
+ * An input with a dropdown calendar that appears on focus
4
+ */
5
+
6
+ .ui-datepicker {
7
+ @include am-datepicker;
8
+ }
9
+
10
+ .ui-datepicker-header {
11
+ @include am-datepicker-header;
12
+
13
+ .ui-icon {
14
+ @include am-hidden;
15
+ }
16
+ }
17
+
18
+ .ui-datepicker-title {
19
+ @include am-datepicker-title;
20
+ }
21
+
22
+ .ui-datepicker-prev {
23
+ @include am-datepicker-prev;
24
+ }
25
+
26
+ .ui-datepicker-next {
27
+ @include am-datepicker-next;
28
+ }
29
+
30
+ .ui-datepicker-calendar {
31
+ @include am-datepicker-calendar;
32
+
33
+ th {
34
+ @include am-datepicker-calendar-heading;
35
+ }
36
+
37
+ td {
38
+ @include am-datepicker-calendar-day;
39
+ }
40
+
41
+ a {
42
+ @include am-datepicker-calendar-day-link;
43
+
44
+ &.ui-state-active,
45
+ &:hover,
46
+ &:focus {
47
+ @include am-datepicker-calendar-day-link-focus
48
+ }
49
+
50
+ &.ui-state-highlight {
51
+ @include am-datepicker-calendar-day-link-current;
52
+ }
53
+ }
54
+ }
55
+
56
+ .ui-datepicker-unselectable {
57
+ @include am-datepicker-calendar-day-disabled;
58
+ }
@@ -0,0 +1,37 @@
1
+ /**
2
+ * Dialog
3
+ * A full page takeover action panel
4
+ */
5
+
6
+ .ui-dialog {
7
+ @include am-dialog;
8
+ }
9
+
10
+ .ui-dialog-toolbar {
11
+ @include am-toolbar;
12
+ }
13
+
14
+ .ui-dialog-title {
15
+ @include am-dialog-title;
16
+ }
17
+
18
+ .ui-dialog-content {
19
+ display: inline;
20
+
21
+ ul {
22
+ margin: 0;
23
+ }
24
+ }
25
+
26
+ .ui-dialog-buttonset {
27
+ @include am-dialog-footer;
28
+ }
29
+
30
+ .ui-button {
31
+ @include am-btn;
32
+ @include am-link(primary, text);
33
+ }
34
+
35
+ .ui-dialog-titlebar-close {
36
+ @include am-dialog-close;
37
+ }
@@ -0,0 +1,33 @@
1
+ /**
2
+ * Dropdowns
3
+ */
4
+
5
+ .dropdown_menu {
6
+ @include am-menu;
7
+ }
8
+
9
+ .dropdown_menu_button {
10
+ @include am-menu-button;
11
+
12
+ &:after {
13
+ @include am-menu-carat;
14
+ }
15
+
16
+ &.disabled {
17
+ @include am-btn-disabled;
18
+ }
19
+ }
20
+
21
+ .dropdown_menu_list {
22
+ @include am-menu-list;
23
+ @include am-menu-list-open;
24
+
25
+ li {
26
+ @include am-menu-item;
27
+ }
28
+
29
+ li a {
30
+ @include am-menu-link;
31
+ @include am-menu-item-open;
32
+ }
33
+ }
@@ -0,0 +1,12 @@
1
+ .featured-blocks-message {
2
+ display: block;
3
+ padding: 0 am-unit(2) am-unit(2);
4
+ }
5
+
6
+ .new-featured-block {
7
+ @include am-actions-footer;
8
+
9
+ .button {
10
+ @include am-btn-raised;
11
+ }
12
+ }