Skip to content

Releases: ScalesCSS/scalescss

5.0.3

30 Apr 20:12

Choose a tag to compare

Stack Object

Patch to fix margin bottom on last child when stacked.

5.0.2

30 Apr 20:08

Choose a tag to compare

Stack Object

Patch to remove right margins on last child.

5.0.0

30 Apr 19:22

Choose a tag to compare

Stack Object

The "Stack Split" object was renamed to "Stack" and refactored. Stack now lays items out in a column and can be modified to lay items out in a row at a certain breakpoint.

New Classes

  • .Stack
  • .Stack__item
  • .Stack--split@xs
  • .Stack--split@s
  • .Stack--split@m
  • .Stack--split@l
  • .Stack--split@xl
  • .Stack--tiny
  • .Stack--small
  • .Stack--medium
  • .Stack--large
  • .Stack--huge

New Variables

  • $stack-spacing-tiny
  • $stack-spacing-small
  • $stack-spacing-medium
  • $stack-spacing-large
  • $stack-spacing-huge
  • $split-breakpoint-xs
  • $split-breakpoint-s
  • $split-breakpoint-m
  • $split-breakpoint-l
  • $split-breakpoint-xl

4.0.0

19 Apr 13:53

Choose a tag to compare

Centered Column Layout Object

The Centered Column layout object is intended to wrap main content when the desired effect is one column that centers itself on large displays.

New Classes

  • .CenteredColumn

New Variables

  • $centered-column-width

Horizontal List

Refactored to use flexbox and added spacing variables to control the space between items in a list. Also added variables to control how the spacing is distributed when a delimiter is used.

New Classes

  • .HorizontalList--spacing-tiny
  • .HorizontalList--spacing-small
  • .HorizontalList--spacing-medium
  • .HorizontalList--spacing-large
  • .HorizontalList--spacing-huge
  • .HorizontalList--delimited-split-distribution
  • .HorizontalList--delimited-left-distribution
  • .HorizontalList--delimited-right-distribution

New Variables

  • $horizontal-list-spacing
  • $horizontal-list-spacing-tiny
  • $horizontal-list-spacing-small
  • $horizontal-list-spacing-medium
  • $horizontal-list-spacing-large
  • $horizontal-list-spacing-huge

Side by Side Object

This new pattern allows you to place items horizontally next to each other. If you only have 2 items, there is an option to split their widths 25/75 or 75/25 instead of the default 50/50.

New Classes

  • .SideBySide
  • .SideBySide__item
  • .SideBySide__item--one-quarter
  • .SideBySide__item--three-quarters

New Variables

  • $side-by-side-gutter

Split Stack Object

This new pattern keeps items stacked vertically until theres enough room for them to be side by side.

New Classes

  • .StackSplit
  • .StackSplit__item

New Variables

  • $stack-split-gutter

3.5.0

30 Apr 15:36

Choose a tag to compare

Lists

Added a .List class and a new variable to control the left margin.

New variables

  • $list-margin-left

Tables

Added new variables to control table heading and table cell alignments

New Variables

  • $table-heading-alignment
  • $table-cell-alignment

Buttons

Added new variables to control font size, font family, font weight, and line height of button text.

New Variables

  • $btn-font-size
  • $btn-font-family
  • $btn-font-weight
  • $btn-line-height

3.4.0

30 Apr 15:29

Choose a tag to compare

Typography

Headings

Added the ability to specify heading color and weight.

New variables

  • $h1-color
  • $h2-color
  • $h3-color
  • $h4-color
  • $h5-color
  • $h6-color
  • $h1-weight
  • $h2-weight
  • $h3-weight
  • $h4-weight
  • $h5-weight
  • $h6-weight

3.3.0

07 Feb 12:19

Choose a tag to compare

Stylelint and Prettier

Sass-lint has been replaced with Stylelint and Prettier. There is a pre-commit hook set up that will run the code through Prettier and Stylelint and reformat accordingly.

3.2.0 - Hacktoberfest Release

09 Nov 22:17

Choose a tag to compare

This release mainly includes contributions from Hacktoberfest, a yearly open source contribution event sponsored by @digitalocean and @github.

Special thanks to @cenksoykan for submitting 3 PRs and @digilou for submitting 1 PR!

Contributing

Added a CONTRIBUTING.md file to make getting started with contribution easier.

Sass Lint

Changed the "No Duplicate Properties" rule to exclude "display" which will allow you to put multiple display properties on a selector. This is useful when doing fallbacks.

Typography

Links

Added the ability to modify the default link state colors and decoration.

New variables

  • $anchor-link-color
  • $anchor-visited-color
  • $anchor-hover-color
  • $anchor-active-color
  • $anchor-link-decoration
  • $anchor-hover-decoration

Heading line-height

Added the ability to change the line-height of headings independently of the base line-height.

New variables

  • $heading-line-height
  • $h1-line-height
  • $h2-line-height
  • $h3-line-height
  • $h4-line-height
  • $h5-line-height
  • $h6-line-height

Box

Added a default value to the Box mixin which is equal to the $box-padding variable

3.1.1

09 Nov 16:39

Choose a tag to compare

v3.1.1

v3.1.1

3.1.0

26 Jun 19:35

Choose a tag to compare

Sass Lint

Added a sass-lint.yml file and updated all of the packages to conform to the linter rules.

Reset

Added a new variable to change the default color of <hr> elements

  • $horizontal-rule-color

Buttons

Fixed the disabled class from .is-disabled to .is-Disabled