bootstrap-bookingsync-sass 1.0.4 → 1.0.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: 79d31ffdf77934799d29a0cacfcfe76818ff1fef
4
- data.tar.gz: 22d0fe6a3ed435c0fbeb1b0f3bc8b5268837e456
3
+ metadata.gz: c3c36199fe844d41017503e61a845a389e88edc6
4
+ data.tar.gz: 0b1fb0732e3abb2295c994633ba07c0d843de27b
5
5
  SHA512:
6
- metadata.gz: a6c1562ae01e16e38b10a97c1d40d9625a476010b7734e0a7b24c2468945fd9b1b385fa50d718689381d2fc22d42f63f4f42632dcabb7312cc1526ec2bb939a6
7
- data.tar.gz: 889ba7ee1723ab4b49fdf3f860c70251e80229916b750b2a8bbf57c89b9e655f1b3559d61d2feaa7b381d418e23edb64f901bb45a0b9199bb7c010510bb974fb
6
+ metadata.gz: d17763bd2435c3643cf32b452a2a96e4c1321eaba606dfc5250f0df0f57644a0972937a1c82603efa7fb3e70a4e963153511bbfaf1fb5cf06409aaf614ac9555
7
+ data.tar.gz: 9a169ae6555d6fef6bb91bf6621913c63eac03a7a66f6616f055f37aa4a6e99d2e1a897437bb99e237b8d4dfa7f152679ca49675e6502ee5d0ea79cd0cd581c4
@@ -1,5 +1,11 @@
1
1
  ### master
2
2
 
3
+ ### 1.0.5 - 2017-10-01
4
+
5
+ * improvements
6
+ * option for adding icon and classes to input
7
+ * fix height for chosen multiple select container
8
+
3
9
  ### 1.0.4 - 2017-06-14
4
10
 
5
11
  * bug fixes
data/README.md CHANGED
@@ -228,6 +228,19 @@ Make sure the file has `.scss` extension (or `.sass` for Sass syntax). If you ha
228
228
 
229
229
  ### Running
230
230
 
231
+ #### Prerequisites
232
+ You will need the following things properly installed on your computer.
233
+
234
+ * [Node.js](http://nodejs.org/) (latest stable version, v7.7.1 at 2017-08-16)
235
+ * [Bower](http://bower.io/)
236
+ * [Ember CLI](http://www.ember-cli.com/)
237
+ * [yarn](https://yarnpkg.com/en/)
238
+
239
+ #### Installation
240
+ * `yarn`
241
+ * `bower install`
242
+
243
+ #### Starting
231
244
  * `ember server`
232
245
  * Visit your app at http://localhost:4200 or from your Rails application if tight together.
233
246
 
@@ -1,12 +1,30 @@
1
1
  import Ember from 'ember';
2
2
  import layout from '../templates/components/bsy-input';
3
3
 
4
- const BsyInputComponent = Ember.Component.extend({
4
+ const { Component, computed } = Ember;
5
+
6
+ const BsyInputComponent = Component.extend({
5
7
  layout,
6
8
  tagName: "div",
7
9
  classNames: "form-group",
8
10
  type: "text",
9
- classNameBindings: ["value:filled"]
11
+ classNameBindings: ["value:filled", "icon:has-icon"],
12
+ size: null, // sm, lg
13
+
14
+ inputClassNames: computed('size', function () {
15
+ const size = this.get('size');
16
+ if (size) {
17
+ return `form-control input-${size}`;
18
+ }
19
+ return "form-control";
20
+ }),
21
+
22
+ iconSize: computed('size', function () {
23
+ const size = this.get('size');
24
+ if (size) {
25
+ return `icon--${size}`;
26
+ }
27
+ })
10
28
  });
11
29
 
12
30
  BsyInputComponent.reopenClass({
@@ -1,8 +1,14 @@
1
1
  <label for="{{id}}">{{label}}</label>
2
+ {{#if icon}}
3
+ <i class="icon-{{icon}} {{iconSize}}"></i>
4
+ {{/if}}
2
5
  {{one-way-input
3
6
  value=value
4
7
  update=update
5
- class="form-control"
8
+ class=inputClassNames
6
9
  type=type
7
10
  id=inputId
11
+ readonly=readonly
12
+ placeholder=placeholder
13
+ disabled=disabled
8
14
  }}
@@ -3,6 +3,7 @@
3
3
  selected=selected
4
4
  options=options
5
5
  searchEnabled=searchEnabled
6
+ searchField=searchField
6
7
  onchange=onchange
7
8
  id=inputId
8
9
  class="form-control"
@@ -10,7 +10,6 @@
10
10
  border-radius: $input-border-radius;
11
11
  @include box-shadow(none);
12
12
  padding: 0 $grid-gutter-width 0 0;
13
- height: $input-height-base;
14
13
 
15
14
  &.chosen-default span {
16
15
  visibility: hidden;
@@ -72,6 +71,10 @@
72
71
  margin-top: -3px;
73
72
  }
74
73
 
74
+ .chosen-container-single .chosen-single {
75
+ height: $input-height-base;
76
+ }
77
+
75
78
  .chosen-container-multi .chosen-choices {
76
79
  li.search-choice {
77
80
  background: none;
@@ -64,6 +64,31 @@
64
64
  transition-timing-function: cubic-bezier(.4,0,.2,1);
65
65
  }
66
66
 
67
+ &.has-icon {
68
+ i {
69
+ position: absolute;
70
+ bottom: 12px;
71
+ color: $gray-light;
72
+
73
+ &.icon--sm {
74
+ bottom: 14px;
75
+ }
76
+
77
+ &.icon--lg {
78
+ bottom: 18px;
79
+ font-size: 20px;
80
+ }
81
+ }
82
+
83
+ input {
84
+ padding-left: 20px;
85
+
86
+ &.input-lg {
87
+ padding-left: 30px;
88
+ }
89
+ }
90
+ }
91
+
67
92
  &.filled label {
68
93
  color: $label-color-filled;
69
94
  font-size: $label-font-size-filled;
@@ -1210,6 +1210,56 @@ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas a blandit quam
1210
1210
  </form>
1211
1211
  ~~~
1212
1212
 
1213
+ <div class="example">
1214
+ <div class="sheet-header">
1215
+ <h3 id="input-group-with-icon">Input group with icon</h3>
1216
+ </div>
1217
+
1218
+ <p>Add icon to input field adding class <code>.has-icon</code> to the <code>.form-group</code>.
1219
+ Create bigger or smaller icons using classes like <code>.icon--lg</code>. Use these classes
1220
+ in conjunction with <code>.input-lg</code> for the input field for example to match its height.</p>
1221
+
1222
+ <div class="bs-example bs-sheet" data-example-id="input-group-with-icon">
1223
+ <form>
1224
+ <div class="form-group has-icon">
1225
+ <label for="inputGroupLarge">Large input group</label>
1226
+ <i class="icon-notifications icon--lg"></i>
1227
+ <input class="form-control input-lg" type="text" id="inputGroupLarge">
1228
+ </div>
1229
+ <div class="form-group has-icon">
1230
+ <label for="inputGroupDefault">Default input group</label>
1231
+ <i class="icon-notifications"></i>
1232
+ <input class="form-control" type="text" id="inputGroupDefault">
1233
+ </div>
1234
+ <div class="form-group has-icon">
1235
+ <label for="inputGroupSmall">Small input group</label>
1236
+ <i class="icon-notifications icon--sm"></i>
1237
+ <input class="form-control input-sm" type="text" id="inputGroupSmall">
1238
+ </div>
1239
+ </form>
1240
+ </div>
1241
+ </div>
1242
+
1243
+ ~~~ html
1244
+ <form>
1245
+ <div class="form-group has-icon">
1246
+ <label for="inputGroupLarge">Large input group</label>
1247
+ <i class="icon-notifications icon--lg"></i>
1248
+ <input class="form-control input-lg" type="text" id="inputGroupLarge">
1249
+ </div>
1250
+ <div class="form-group has-icon">
1251
+ <label for="inputGroupDefault">Default input group</label>
1252
+ <i class="icon-notifications"></i>
1253
+ <input class="form-control" type="text" id="inputGroupDefault">
1254
+ </div>
1255
+ <div class="form-group has-icon">
1256
+ <label for="inputGroupSmall">Small input group</label>
1257
+ <i class="icon-notifications icon--sm"></i>
1258
+ <input class="form-control input-sm" type="text" id="inputGroupSmall">
1259
+ </div>
1260
+ </form>
1261
+ ~~~
1262
+
1213
1263
  <div class="example">
1214
1264
  <div class="sheet-header">
1215
1265
  <h3 id="height-sizing">Height sizing</h3>
@@ -1,5 +1,5 @@
1
1
  module Bootstrap
2
2
  module BookingSync
3
- VERSION = "1.0.4"
3
+ VERSION = "1.0.5"
4
4
  end
5
5
  end
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "ember-cli-bootstrap-bookingsync-sass",
3
- "version": "1.0.3",
3
+ "version": "1.0.5",
4
4
  "description": "Sass-powered version of Bootstrap with BookingSync theme.",
5
5
  "directories": {
6
6
  "doc": "doc",
@@ -28,6 +28,27 @@
28
28
  </div>
29
29
  </div>
30
30
 
31
+ {{bsy-input
32
+ currentFirstName
33
+ label="Large first name with icon"
34
+ update=(action (mut currentFirstName))
35
+ inputId="firstNameLarge"
36
+ icon="owner"
37
+ size="lg"}}
38
+ {{bsy-input
39
+ currentFirstName
40
+ label="Default first name with icon"
41
+ update=(action (mut currentFirstName))
42
+ inputId="firstNameDefault"
43
+ icon="owner"}}
44
+ {{bsy-input
45
+ currentFirstName
46
+ label="Small first name with icon"
47
+ update=(action (mut currentFirstName))
48
+ inputId="firstNameSmall"
49
+ icon="owner"
50
+ size="sm"}}
51
+
31
52
  {{#bsy-input-addon}}
32
53
  {{#bsy-input-addon.addon}}${{/bsy-input-addon.addon}}
33
54
  {{bsy-input-addon.input currentAmount
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: bootstrap-bookingsync-sass
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.0.4
4
+ version: 1.0.5
5
5
  platform: ruby
6
6
  authors:
7
7
  - Sebastien Grosjean
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2017-06-14 00:00:00.000000000 Z
11
+ date: 2017-10-01 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bootstrap-sass