cutlass_js_rails 0.4.4 → 0.4.5

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
  SHA1:
3
- metadata.gz: 3b6d5a43a5ccdbcbb8238401b692f30df6d1aa99
4
- data.tar.gz: 7a2a01dcc7069a69fa494718de681f34daa1b90e
3
+ metadata.gz: 6072050b62fb94cfaec9ec9fa68ea755b4f3cecb
4
+ data.tar.gz: 00cdf69b9d4388632ebc42a35186049b34255141
5
5
  SHA512:
6
- metadata.gz: ee43d2151681a172a6c357545ebccbf2fa49c3254b0175a04911952175aabac810562666efd0184f7a4762d871027b1ac8aaa83ba3a50ddc294f0e41bac411b6
7
- data.tar.gz: 115fadc5df164a09b5ac6f4a3976d3de998d5691f0386492c70dfeb9fb2975526c5b1f9802628e6e83fa21f0b758f619667b120b3a6b79d8c89f12bf7b8157e7
6
+ metadata.gz: e07990b528a4185c1e0a649b1031c9fe774654d0c90587cc625c137afcaf0ea4ada6273d965973b7cb9f8953949feb40492d8a928d42aee7cf0e3026295a5b84
7
+ data.tar.gz: a684b3351dfd80e92833981ed617ce1ec57ca8fce5d3783ff801006a43d7be30f881423f8f6b6ce05e551d49ec9309ad968e8e53ba659a32e6abdf016325e6e6
Binary file
@@ -25,10 +25,12 @@ document.addEventListener("turbolinks:load", function() {
25
25
 
26
26
  //SELECT BOXES ========================================================
27
27
 
28
- $(document).on('change', '.Cutlass-input-select', function(){
28
+ $(document).on('change', '.Cutlass-input-select, .Cutlass-input-select--large ', function(){
29
29
  Cutlass.toggleSelectActive($(this))
30
30
  })
31
31
 
32
+
33
+
32
34
  $('.Cutlass-input-select').each(function(){
33
35
  Cutlass.toggleSelectActive($(this))
34
36
  })
@@ -26,7 +26,7 @@ Cutlass.removeActive = function($input){
26
26
  }
27
27
 
28
28
  Cutlass.animateFields = function(){
29
- $('.Cutlass-input-text, .Cutlass-input-select, .Cutlass-input-radio, .Cutlass-input-toggler, .Cutlass-input-link').addClass('s-shown');
29
+ $('.Cutlass-input-text, .Cutlass-input-select, .Cutlass-input-select--large, .Cutlass-input-radio, .Cutlass-input-toggler, .Cutlass-input-link').addClass('s-shown');
30
30
  $('.Cutlass-item').each(function(i){
31
31
  var $el = $(this)
32
32
  setTimeout(function(){
@@ -1,5 +1,5 @@
1
1
  Cutlass.generateAllHTML = function(){
2
- Cutlass.generateHTML(['text', 'select', 'radio', 'toggler', 'link'])
2
+ Cutlass.generateHTML(['text', 'select', 'select--large', 'radio', 'toggler', 'link'])
3
3
  }
4
4
 
5
5
  Cutlass.generateHTML = function(inputTypes){
@@ -45,7 +45,7 @@ $cutlass-link-color: #ff7c14 !default;
45
45
  // ========================================================
46
46
  // HIDING PRE-HTML-GENERATION
47
47
  // ========================================================
48
- .Cutlass-input-text, .Cutlass-input-select, .Cutlass-input-radio, .Cutlass-input-toggler, .Cutlass-input-link{
48
+ .Cutlass-input-text, .Cutlass-input-select, .Cutlass-input-select--large, .Cutlass-input-radio, .Cutlass-input-toggler, .Cutlass-input-link{
49
49
  opacity: 0;
50
50
  &.s-shown{
51
51
  opacity: 1;
@@ -76,6 +76,35 @@ $cutlass-link-color: #ff7c14 !default;
76
76
  // ========================================================
77
77
  // SELECT INPUT
78
78
  // ========================================================
79
+
80
+ %Cutlass-select{
81
+ position: relative;
82
+ color: $cutlass-input-color;
83
+ background-color: transparent;
84
+ height: 59px;
85
+ width: 100%;
86
+ z-index: 5;
87
+ outline: 0;
88
+ appearance: none;
89
+ -webkit-appearance: none; /*Removes default chrome and safari style*/
90
+ -moz-appearance: none; /*Removes default style Firefox*/
91
+ &::-ms-expand{
92
+ display: none; //IE10 remove arrow
93
+ }
94
+ }
95
+
96
+ %Cutlass-arrow{
97
+ content: '';
98
+ position: absolute;
99
+ top: 55%;
100
+ margin-top: -6px;
101
+ right: 10px;
102
+ background-image: image-url("down_arrow.png");
103
+ background-size: 13px 8px;
104
+ width: 13px;
105
+ height: 8px;
106
+ }
107
+
79
108
  .m-select{
80
109
  .Cutlass-label{
81
110
  position: absolute;
@@ -83,24 +112,37 @@ $cutlass-link-color: #ff7c14 !default;
83
112
  top: 18px;
84
113
  }
85
114
  .Cutlass-input-select{
115
+ @extend %Cutlass-select;
86
116
  @extend %Cutlass-input;
87
- position: relative;
88
- height: 59px;
89
- color: $cutlass-input-color;
90
117
  padding: 8px $right-padding 0 $left-padding;
91
- background-color: transparent;
92
- width: 100%;
93
- z-index: 5;
94
- outline: 0;
95
- appearance: none;
96
- -webkit-appearance: none; /*Removes default chrome and safari style*/
97
- -moz-appearance: none; /*Removes default style Firefox*/
98
- &::-ms-expand{
99
- display: none; //IE10 remove arrow
100
- }
118
+ }
119
+ &:before{
120
+ @extend %Cutlass-arrow;
121
+ right: 15px;
101
122
  }
102
123
  }
103
124
 
125
+ .m-select--large{
126
+ .Cutlass-label{
127
+ position: absolute;
128
+ left: $left-padding;
129
+ top: 16px;
130
+ font-size: 20px;
131
+ height: 20px;
132
+ }
133
+ &.s-active .Cutlass-label {
134
+ display: none;
135
+ }
136
+ .Cutlass-input-select--large{
137
+ @extend %Cutlass-select;
138
+ @extend %Cutlass-input;
139
+ font-size: 20;
140
+ padding: 3px $right-padding 0 $left-padding;
141
+ }
142
+ &:before{
143
+ @extend %Cutlass-arrow;
144
+ }
145
+ }
104
146
  // ========================================================
105
147
  // TOGGLER INPUT
106
148
  // ========================================================
@@ -2,4 +2,4 @@
2
2
  <% code = local_assigns.fetch(:code) %>
3
3
  <% props = local_assigns.fetch(:props, {}) %>
4
4
  <% value = local_assigns.fetch(:value, '') %>
5
- <%= f.select code, options_for_select(options, selected: value), { selected: value }, { class: "Cutlass-input-select #{css_classes}", 'data-label': label, 'data-error': model.errors[code][0] }.merge(props) %>
5
+ <%= f.select code, options_for_select(options, selected: value), { selected: value }, { class: "Cutlass-input-select #{css_classes}", 'data-label': label, 'data-error': model&.errors ? model.errors[code][0] : nil }.merge(props) %>
@@ -0,0 +1,5 @@
1
+ <% css_classes = (defined? css_classes) ? css_classes : '' %>
2
+ <% code = local_assigns.fetch(:code) %>
3
+ <% props = local_assigns.fetch(:props, {}) %>
4
+ <% value = local_assigns.fetch(:value, '') %>
5
+ <%= f.select code, options_for_select(options, selected: value), { selected: value }, { class: "Cutlass-input-select--large #{css_classes}", 'data-label': label, 'data-error': model&.errors ? model.errors[code][0] : nil }.merge(props) %>
@@ -1,3 +1,3 @@
1
1
  module CutlassJsRails
2
- VERSION = '0.4.4'
2
+ VERSION = '0.4.5'
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: cutlass_js_rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.4.4
4
+ version: 0.4.5
5
5
  platform: ruby
6
6
  authors:
7
7
  - chardos
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2016-07-05 00:00:00.000000000 Z
11
+ date: 2016-07-06 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bundler
@@ -51,6 +51,7 @@ files:
51
51
  - LICENSE.txt
52
52
  - README.md
53
53
  - Rakefile
54
+ - app/assets/images/down_arrow.png
54
55
  - app/assets/javascripts/cutlass.js
55
56
  - app/assets/javascripts/cutlass/helpers.js
56
57
  - app/assets/javascripts/cutlass/html_generation.js
@@ -60,6 +61,7 @@ files:
60
61
  - app/views/cutlass/_link_field.html.erb
61
62
  - app/views/cutlass/_radio_field.html.erb
62
63
  - app/views/cutlass/_select_field.html.erb
64
+ - app/views/cutlass/_select_field_large.html.erb
63
65
  - app/views/cutlass/_text_field.html.erb
64
66
  - app/views/cutlass/_toggle_field.html.erb
65
67
  - bin/console
@@ -87,7 +89,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
87
89
  version: '0'
88
90
  requirements: []
89
91
  rubyforge_project:
90
- rubygems_version: 2.6.4
92
+ rubygems_version: 2.5.1
91
93
  signing_key:
92
94
  specification_version: 4
93
95
  summary: Cuts down the size of inputs by reducing the prominence of labels once a