Skip to content

Releases: philmtd/css-fx-layout

v3.0.5

22 Nov 12:12
ac5ef69
Compare
Choose a tag to compare

This release removes deprecation warnings when using one of the latest versions of scss. Deprecated @import uses and function calls have been replaced with the recommended alternatives.

What's Changed

  • chore(deps-dev): bump @babel/traverse from 7.22.1 to 7.23.2 by @dependabot in #30
  • update dev-dependencies, migrate scss code by @philmtd in #38

Full Changelog: v3.0.4...v3.0.5

v3.0.4

29 May 17:23
a576184
Compare
Choose a tag to compare

New Features: Flex-Layout migration script

There is now an automatic migration script available. If you are coming from Angular Flex-Layout this should make the migration even easier for you.
You can call the script like this: npx css-fx-layout migrate [path/to/src]. Consult the documentation for a detailed migration guide.
As this is only an indirect feature of the actual library this release did not get a minor-version bump. (feat: add flex-layout migration script by @philmtd in #26)

What's Changed

  • dev dependency updates

Full Changelog: v3.0.3...v3.0.4

v3.0.3

26 May 16:11
af9e39c
Compare
Choose a tag to compare

Bug Fixes

  • fix: correct sm breakpoint size to match the one from flex-layout as intended by @philmtd in #25, thanks to @dungvq23 for reporting the bug

Full Changelog: v3.0.2...v3.0.3

v3.0.2

07 Mar 21:14
1361f14
Compare
Choose a tag to compare

Bug Fixes

  • fix: use improved auto-flex in data-flex, too by @philmtd in #22

Full Changelog: v3.0.1...v3.0.2

v3.0.1

07 Mar 19:47
00dd2b3
Compare
Choose a tag to compare

Bug Fixes

  • fix(attributes): auto-apply flex layout only if no layout attribute is present by @philmtd in #21

Full Changelog: v3.0.0...v3.0.1

v3.0.0

24 Feb 13:14
8c75a9a
Compare
Choose a tag to compare

This release is a large step towards an easier migration from Angular Flex-Layout. Thank you to @lievenjanssen for his work in multiple PRs!
3.0.0 introduces some breaking changes, which should be easy to resolve, though.

We also added a migration guide from Angular Flex-Layout to our documentation.

New Features

  • Flex basis alias support (e.g. data-flex="30" / .fx-flex--30)
  • Support to create gap values from a list instead of generating incrementally from one number to another using the mixins gap-attribute-selectors-from-list or gap-class-selectors-from-list
  • New data-flex-fill / .fx-flex-fill selectors
  • New data-flex-align / .fx-flex-align selectors

What's Changed

  • Flex basis alias support by @lievenjanssen in #13
  • Layout gap value list support by @lievenjanssen in #12
  • Flex size support by @lievenjanssen in #15
  • chore: remove media size selectors phone, tablet and desktop in favor of the newer selectors by @philmtd in #16
  • Increment support for layout gap mixins by @lievenjanssen in #17
  • add real unit tests by @philmtd in #14
  • feat: improved documentation by @philmtd in #18
  • feat: add more flex layout support by @philmtd in #19
    • adds an fxFlexFill alternative
    • adds an fxFlexAlign alternative
    • adds flex-row properties to containers where it is missing and where layout-align is used
    • adds a documentation page on how to migrate from Flex Layout
    • renames data-fx-flex to data-flex because it was the only attribute selector with the fx prefix, which was confusing
    • removes data-fx-flex-grow in favor of data-flex="grow"

Breaking Changes

  • data-fx-flex has been renamed to data-flex
  • data-fx-flex-grow has been removed in favor of data-flex="grow"
  • The generator mixins for the gap selectors (gap-class-selectors and gap-attribute-selectors) have a new parameter $increment as their third parameter.
    You need to set this to 1 to get the previous behaviour.
  • Removes the old, initial css-fx-layout media sizes phone, tablet and desktop in favor of the existing Flex-Layout media sizes

New Contributors

Full Changelog: v2.1.0...v3.0.0

v2.1.0

03 Jan 18:05
v2.1.0
c0b3b02
Compare
Choose a tag to compare

Features

This release adds a responsive API including the commonly known breakpoint sizes of Flex Layout.
In order to use the default responsive API selectors please set the bool parameter of the mixins generating the selectors to true (see the "Getting started"
in the README). It is disabled per default because it negatively affects the size of the generated code and not all projects
may need this.

  • add responsive API using flex layout media sizes
  • add mixins to default API
  • add flex-row properties to parent containers of elements using .fx-flex/data-fx-flex if they are missing

v2.0.0

27 Dec 16:57
v2.0.0
b088ec8
Compare
Choose a tag to compare

Breaking Changes and New Features

The library now only exposes mixins which can be used to generate the desired CSS selectors.
There also won't be pre-compiled CSS files available with the releases anymore.

The available selectors don't change. You only have to include the library differently. Please
consult the README or the Wiki for detailed instructions on how to get you
started with css-fx-layout.

v1.1.1

26 Dec 22:42
a632aed
Compare
Choose a tag to compare
  • fix release process
  • use the css gap property for layout-gap: this may break functionality in older browsers but fixes other layout issues
  • add fx-flex and fx-flex-grow

v1.0.1

31 Aug 12:24
Compare
Choose a tag to compare

Bug Fixes

  • allow the simultaneous usage of wrap and reverse in the data-layout attribute (#4)