diff --git a/package.json b/package.json index cfde240..cdb097e 100644 --- a/package.json +++ b/package.json @@ -90,6 +90,7 @@ "devDependencies": {} }, "dependencies": { + "aurelia-animator-css": "^1.0.4", "aurelia-bootstrapper": "2.1.1", "aurelia-dialog": "^2.0.0-rc.3", "aurelia-event-aggregator": "1.0.1", diff --git a/sample/package.json b/sample/package.json index 30ce9ce..f5c36b5 100644 --- a/sample/package.json +++ b/sample/package.json @@ -34,6 +34,7 @@ "whatwg-fetch": "^2.0.3" }, "dependencies": { + "aurelia-animator-css": "^1.0.4", "aurelia-bootstrapper": "2.1.1", "aurelia-dialog": "^2.0.0-rc.3", "aurelia-event-aggregator": "1.0.1", @@ -75,4 +76,4 @@ "written-number": "^0.8.1", "zenscroll": "^4.0.0" } -} \ No newline at end of file +} diff --git a/sample/src/routes/jquery/float-label.html b/sample/src/routes/jquery/float-label.html index f6b1ca3..dde7680 100644 --- a/sample/src/routes/jquery/float-label.html +++ b/sample/src/routes/jquery/float-label.html @@ -41,7 +41,9 @@

Float Labels Sizing +
+
@@ -51,7 +53,9 @@

Float Labels Color +
+
@@ -89,7 +93,9 @@

Float Labels
  • You can choose your setting by direction property.
    • +
    +
    @@ -108,7 +114,7 @@

    Float Labels - containerless + custom attribute @@ -131,63 +137,72 @@

    Float Labels class string - oneWay + oneTime Set custom classes to the label component style string - oneWay + oneTime Set custom styles to the label component padding-top string - oneWay + oneTime Set custom padding-top to the label component right string - oneWay + oneTime The right property sets or returns the right position of a positioned element. left string - oneWay + oneTime The left property sets or returns the left position of a positioned element. color string - oneWay + oneTime black You can set any kind of colors to the label component font-size string - oneWay + oneTime Set font-size to the label component - direction + text string oneWay + + Set text to the label component. this is primary property. + + + + direction + string + oneTime auto Set the direction to the label component. The default value is auto - and the component decides based on text align and html direction. You can set it - to ltr and rtl too. + and the component decides based on text align and html direction. You can set + it + to ltr and rtl too. - + diff --git a/sample/yarn.lock b/sample/yarn.lock index adab70e..00a2562 100644 --- a/sample/yarn.lock +++ b/sample/yarn.lock @@ -273,6 +273,15 @@ atob@^2.1.1: resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9" integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg== +aurelia-animator-css@^1.0.4: + version "1.0.4" + resolved "https://registry.yarnpkg.com/aurelia-animator-css/-/aurelia-animator-css-1.0.4.tgz#8336ab84f9a8bf60a4536e99145e73a80c0f0dac" + integrity sha1-gzarhPmov2CkU26ZFF5zqAwPDaw= + dependencies: + aurelia-metadata "^1.0.0" + aurelia-pal "^1.0.0" + aurelia-templating "^1.0.0" + aurelia-binding@^2.0.0, aurelia-binding@^2.1.4: version "2.1.5" resolved "https://registry.yarnpkg.com/aurelia-binding/-/aurelia-binding-2.1.5.tgz#69ac582be0d6835e69cdbc062a73eb72755d164b" diff --git a/src/custom-attributes/jquery/float-label/at-float-label.ts b/src/custom-attributes/jquery/float-label/at-float-label.ts index ff29d16..a204788 100644 --- a/src/custom-attributes/jquery/float-label/at-float-label.ts +++ b/src/custom-attributes/jquery/float-label/at-float-label.ts @@ -15,23 +15,23 @@ import 'aureliatoolbelt-thirdparty/jquery.float-label/jquery.float-label.css'; @customAttribute('at-float-label') @inject(Element) export class AureliaToolbeltFloatLabel { - @bindable({ defaultBindingMode: bindingMode.oneWay }) + @bindable({ defaultBindingMode: bindingMode.oneTime }) public class: string = ''; - @bindable({ defaultBindingMode: bindingMode.oneWay }) + @bindable({ defaultBindingMode: bindingMode.oneTime }) public style: string = ''; - @bindable({ defaultBindingMode: bindingMode.oneWay }) + @bindable({ defaultBindingMode: bindingMode.oneTime }) public direction: FloatInputDirection = 'auto'; @bindable({ defaultBindingMode: bindingMode.oneWay, primaryProperty: true }) public text: string = ''; - @bindable({ defaultBindingMode: bindingMode.oneWay }) + @bindable({ defaultBindingMode: bindingMode.oneTime }) public right: string = ''; - @bindable({ defaultBindingMode: bindingMode.oneWay }) + @bindable({ defaultBindingMode: bindingMode.oneTime }) public left: string = ''; - @bindable({ defaultBindingMode: bindingMode.oneWay }) + @bindable({ defaultBindingMode: bindingMode.oneTime }) public paddingTop: string = ''; - @bindable({ defaultBindingMode: bindingMode.oneWay }) + @bindable({ defaultBindingMode: bindingMode.oneTime }) public color: string = ''; - @bindable({ defaultBindingMode: bindingMode.oneWay }) + @bindable({ defaultBindingMode: bindingMode.oneTime }) public fontSize: string = ''; private label: HTMLLabelElement; diff --git a/yarn.lock b/yarn.lock index 738481a..f5b333e 100644 --- a/yarn.lock +++ b/yarn.lock @@ -478,6 +478,15 @@ atob@^2.1.1: resolved "https://registry.yarnpkg.com/atob/-/atob-2.1.2.tgz#6d9517eb9e030d2436666651e86bd9f6f13533c9" integrity sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg== +aurelia-animator-css@^1.0.4: + version "1.0.4" + resolved "https://registry.yarnpkg.com/aurelia-animator-css/-/aurelia-animator-css-1.0.4.tgz#8336ab84f9a8bf60a4536e99145e73a80c0f0dac" + integrity sha1-gzarhPmov2CkU26ZFF5zqAwPDaw= + dependencies: + aurelia-metadata "^1.0.0" + aurelia-pal "^1.0.0" + aurelia-templating "^1.0.0" + aurelia-binding@^2.0.0, aurelia-binding@^2.1.4: version "2.1.5" resolved "https://registry.yarnpkg.com/aurelia-binding/-/aurelia-binding-2.1.5.tgz#69ac582be0d6835e69cdbc062a73eb72755d164b"