v2.0.0-beta3

Live Demo →
API Documentation →

Changes Since v2.0.0-beta2:

• 245dd2a Do not force position: relative on the host element

• 5faadf8 Cleanup unused style on the host element

• 9d46ffb Fix slotted selector for icons to work with IE

• e1ddad5 Use fixed height for the button, drop IE alignment workaround

v2.0.0-beta2 — Styles Adjustments

Live Demo →
API Documentation →

Changes Since v2.0.0-beta1:

• fccbb6d Fix tertiary-inline button theme to be aligned properly
• 4d349fe Fix primary button active styles for touch devices
• d1857ab Fix slotted iron-icon selector for polyfilled browsers
• cc054bf Force box-sizing: content-box for slotted Vaadin icons

v2.0.0-beta1 — First Beta version using Lumo theme by default

Live Demo →
API Documentation →

⚠️ Breaking Changes Since v1.x:

• The element uses Lumo theme by default. The previous default theme has been dropped. You can import the unstyled version from the src/vaadin-button.html
• Removed the wrapping native button and the "button" styling part. The element still uses native button under the hood, but that one is now considered as implementation detail
• The CSS position is now set to relative on host element forced with !important

New Features Since v1.x:

• Added three new styling parts:
  • part="label": wrapper for the default slot
  • part="prefix": wrapper for the named slot with name="prefix"
  • part="suffix": wrapper for the named slot with name="suffix"

Changes Since v2.0.0-alpha6:

• 2127755 Align with skeleton: use node 8.9 in CI, bump polymer-cli to 1.6.0
• 81a8ab4 Update eslint and stylelint to check ./src and ./theme
• ec565a3 Remove active and focused state when disconnected from the DOM

v2.0.0-alpha6

Live Demo →
API Documentation →

Changes Since v2.0.0-alpha5:

• 9797202 Align with skeleton: update eslint-plugin-html and gulp-stylelint

• cbb7814 Use --lumo-icons-size-m

• e31b126 Add explicit iron-icon dependency for demos

• e28fd6e Switch back to using function closures

v2.0.0-alpha5 — Lumo version

Live Demo →
API Documentation →

⚠️ Breaking Changes:

• The element now uses vaadin-lumo-styles dependency instead of vaadin-valo-styles. When using with other Vaadin Elements, installing latest alpha versions is strongly recommended, to avoid having both packages installed and imported.

Changes Since v2.0.0-alpha4:

• 27bcbd4 Fix build
• 1bbfc12 Migrate Valo to Lumo

v2.0.0-alpha4

Live Demo →
API Documentation →

Changes Since v2.0.0-alpha3:

• 26de455 Adjust hover and active state styles
  • Fix active style for macOS “tap-to-click”
  • Adjust primary button hover and active styles
  • Adjust the tertiary type activation style
• 6645d60 Align with skeleton: add separate file for test suites
• 3942091 Remove test ignore [skip ci]
• 055177d Fix ./theme path for polymer lint in CI
• df0a6a8 Update polymer lint in CI to check ./src and ./theme
• f2b45d9 Align mixins, add missing annotation
• 7b36c80 Fix demo code indentation

v2.0.0-alpha3 — Valo dependency update

Live Demo →
API Documentation →

⚠️ Breaking Changes:

• The element now uses vaadin-valo-styles dependency instead of vaadin-valo-theme. When using with other Vaadin Elements, installing latest alpha versions is strongly recommended, to avoid having both packages installed and imported.

Changes Since v2.0.0-alpha2:

• c97ed13 Use correct import for Valo icons
• 43bd4fd Update Valo dependency
• d31f084 Add Getting Started and File Structure docs sections
• b93a42d Use the --valo-icon-size property

v2.0.0-alpha2 — Styling parts structure change

Live Demo →
API Documentation →

⚠️ Breaking Changes:

• Remove the wrapping native button (and the "button" styling part)
• The CSS position is now set to relative on host element forced with !important

New Features:

• Added three new styling parts:
  • part="label": wrapper for the default slot
  • part="prefix": wrapper for the named slot with name="prefix"
  • part="suffix": wrapper for the named slot with name="suffix"

Changes Since v2.0.0-alpha1:

• 10b5b2d Fix host vertical align

• d04626d Fix tests

• 4eb80c3 Force relative positioning on the host

• b9fc85a FFS demos, part 2

  • Use shared styles from vaadin-demo-helpers
  • Align examples with the new vaadin-button slots and theme variations:

• 973fc25 Fix ElementMixin route

• b668736 FFS theme, part 2

  • Fix vertical alignment to work naturally in all browsers
  • Added three new styling parts, named "label", "prefix" and "suffix"
  • Split the Valo theme module into multiple style modules
  • Add a test page for the Valo theme and its variations

• d4a6944 FFS theme

  • Remove use of unnecessary --valo-font-size property
  • Add an intermediate property for sizing the button
    --valo-button-size
  • Remove box-shadows and update the background colors (which allows us
    to remove the --_valo-button-background-color tweak property for the
    dark palette)
  • Don’t transition background color and text color
  • Simplify hover and active styles (they also now work nicely on touch
    devices as well)
  • Remove horizontal margins (now aligns the same as text-field when
    stacked vertically)
  • Remove margins from icons when theme="icon" is used (so they are
    always centered inside the button)
  • Update screenshot to match the new style

• 7f499b8 FFS demos

  • Remove superfluous examples (tabindex, autofocus)
  • Add an "icon" example to the basic examples
  • Extract a11y examples to a separate page
  • Improve Valo theme examples (include all the variations)
  • Add additional documentation in plain-text
  • Use "Vaadin Button" instead of "vaadin-button" when talking about the
    UI component. Use <vaadin-button> when talking about the element
    specifically.

• e0d877e Use Vaadin.ElementMixin

• db08dc0 Update README.md

v2.0.0-alpha1 - Use Valo theme by default

Live Demo →
API Documentation →

Changes Since v1.0.4:

• 48a8960 Bump vaadin-control-state-mixin to v2.0.0

• f2c1bad Add Valo theme variations demos [skip ci]

• 9a39812 Added basic example screenshot file.

• 4a94c6c Add ThemableMixin documentation to Styling docs.

• cf4ae73 Disable package-lock.json

• 7d5346c Use Valo theme by default

• ad28c20 Remove duplicate import

• 029889d Remove xvfb for saucelabs. Use wct instead of polymer-cli

• 9770d4e Include a static getter for the element version

• a327e66 Bump safari version

• 8b361df Add hidden attribute styles

• 56a6daa Update .travis.yml

• 2afdeba Fix yargs version

• a4972d2 Remove lighthouse performance test

• 792b412 Update vaadin-button.html

• 559e4e7 Update README.md

v1.0.5

Live Demo →
API Documentation →

Changes Since v1.0.4:

• 9770d4e Include a static getter for the element version
• 8b361df Add hidden attribute styles
• 2afdeba Fix yargs version
• a4972d2 Remove lighthouse performance test
• 792b412 Update vaadin-button.html
• 559e4e7 Update README.md