Skip to content
This repository was archived by the owner on May 30, 2023. It is now read-only.

CHANGELOG.md

Latest commit

 

History

History
executable file
·
1186 lines (1038 loc) · 44.4 KB

CHANGELOG.md

File metadata and controls

executable file
·
1186 lines (1038 loc) · 44.4 KB
Raw

OrbitCSS Changelog

v2.0.0

Core changes

  • Removed node-sass package in favor of dart-sass.

  • Added support for CSS variables. Customization of your theme can now be done without using SASS.

  • Added createColor() function. It takes a color as a parameter and returns a formatted color based on the value of the $color-type variable. Supported values are 'hsl', 'rgba' and 'hex'. This ensures consistency throughout the framework.

  • Added createHSLColor($color) function. This accepts any CSS color value and returns the HSL equivalent.

  • Added createRGBAColor($color) function. This accepts any CSS color value and returns the RGBA equivalent.

  • Added createHexColor($color) function. This accepts any CSS color value and returns the HEX equivalent.

  • Removed a handful of functions from _function.scss. See the deprecations section for a full list.

  • Added $color-type variable to _colors.scss. This variable controls the framework wide format for colors to be generated. Supported values are 'hsl', 'rgba' and 'hex'.

  • Removed link and disabled from the $color-palette list. These colors still exist and can be referenced as per usual.

  • Added new secondary color to the color palette.

  • CSS variables added for each color along with a lighter and darker version, a text color and an alert color.

  • Replaced most variables in _general.scss with CSS variables.

  • Added has-no-transition helper to the global helpers. It sets the transition property of an element to none.

  • title and subtitle changed to heading and subheading. Variables updated to reflect this change.

  • Added the is-subheading modifier to replace the subtitle modifier.

  • Controls for background and font color added to the hero__content and hero__footer element. Background color can no longer be set on the hero block.

  • Added a max width control to images within the top__brand element.

  • Various changes to the appearance of certain module elements.

  • Removed color($key) function.

  • Removed title-size($key) function.

  • Removed has-bg-link and has-text-link modifiers from the color module.

  • Removed the set of is-*-title modifiers from the Typography module.

  • Removed the subtitle modifier from the Typography module.

  • Add CSS variable support to all modules. Refer to the documentation of each module for the list of CSS variables.

New Sass variables

Variable Module Default value
$hero-background-color Hero hsl(0deg, 0%, 100%, 1)
$hero-color Hero hsl(0deg, 0%, 22%, 1)
$input-error-background Form hsl(348deg, 100%, 58%, 0.2)
$input-error-border-color Form hsl(347deg, 100%, 58%, 1)
$input-error-color Form hsl(0deg, 0%, 22%, 1)
$input-border-width Form 1px
$select-loading-speed Form .8s
$select-loading-width Form 2px
$select-loading-color Form hsl(32deg, 12%, 82%, 1)
$top-shadow Top (Navbar) none
$top-brand-color Top (Navbar) inherit
$top-brand-max-logo-width Top (Navbar) 200px
$top-link-background Top (Navbar) hsl(0deg, 0%, 66%, 0.15)
$top-social-hover-color Top (Navbar) inherit
$menu-list-background Menu transparent
$menu-list-hover-background Menu hsl(0deg, 0%, 75%, 0.09)
$menu-list-hover-color Menu hsl(0deg, 0%, 22%, 1)
$menu-divider-width Menu 1px
$menu-divider-color Menu hsl(210deg, 16%, 92%, 1)
$menu-expandable-border-width Menu 1px
$menu-expandable-border-color Menu hsl(210deg, 16%, 92%, 1)
$pagination-border-color Pagination transparent
$pagination-border-width Pagination 1px
$pagination-border-radius Pagination 0
$pagination-hover-color Pagination hsl(0deg, 0%, 22%, 1)
$pagination-bordered-color Pagination hsl(0deg, 0%, 22%, 1)
$pagination-bordered-border-color Pagination 4px
$pagination-bordered-active-border-color Pagination hsl(255deg, 73%, 58%, 1)
$pagination-bordered-active-color Pagination hsl(0deg, 0%, 100%, 1)
$pagination-bordered-hover-background Pagination hsl(0deg, 0%, 100%, 1)
$pagination-bordered-hover-border-color Pagination hsl(33, 12%, 72%, 1)
$pagination-bordered-hover-color Pagination hsl(0deg, 0%, 22%, 1)
$accordion-border-width Accordion 1px
$accordion-border-color Accordion hsl(0deg, 0%, 90%, 1)
$accordion-title-background-color Accordion transparent
$accordion-content-color Accordion hsl(0deg, 0%, 22%, 1)
$accordion-content-background Accordion hsl(0deg, 0%, 100%, 1)
$alert-background-color Alert hsl(0deg, 0%, 100%, 1)
$alert-color Alert hsl(0deg, 0%, 22%, 1)
$button-hover-background Button hsl(0deg, 0%, 100%, 1)
$button-hover-color Button hsl(0deg, 0%, 22%, 1)
$button-rounded-radius Button 6px
$button-loading-speed Button 0.8s
$dropdown-color Dropdown hsl(0deg, 0%, 22%, 1)
$dropdown-border-width Dropdown 1px
$dropdown-border-color Dropdown hsl(0deg, 0%, 80%, 0.34)
$dropdown-link-hover-color Dropdown inherit
$image-thumb-border-width Image 1px
$image-thumb-border-color Image hsl(33, 12%, 82%, 1)
$modal-color Modal hsl(0deg, 0%, 22%, 1)
$table-background-color Table hsl(0deg, 0%, 100%, 1)
$table-color Table hsl(0deg, 0%, 22%, 1)
$tab-item-background Tabs hsl(0deg, 0%, 100%, 1)
$tab-item-active-background Tabs hsl(0deg, 0%, 100%, 1)
$tab-item-hover-color Tabs hsl(234deg, 100%, 64%, 1)
$tab-item-hover-background Tabs hsl(0deg, 0%, 100%, 1)
$tab-content-background Tabs transparent
$tab-content-color Tabs hsl(0deg, 0%, 22%, 1)
$secondary Colors #ff5e82
$theme-font-color Base hsl(0deg, 0%, 22%, 1)
$theme-background-color Base hsl(0deg, 0%, 100%, 1)

Removed Sass variables

Variable Module Replaced with
$select-arrow-height Form -
$input-border Form $input-border-color
$input-border-width
$top-burger-height Top (Navbar) -
$menu-list-hover Menu $menu-list-hover-background
$menu-divider Menu $menu-divider-color
$menu-divider-width
$menu-expandable-border Menu $menu-expandable-border-color
$menu-expandable-border-width
$pagination-border Pagination $pagination-border-color
$pagination-border-width
$pagination-rounded Pagination $pagination-rounded-radius
$pagination-bordered Pagination $pagination-bordered-border-color
$pagination-bordered-active Pagination $pagination-bordered-active-background
$pagination-bordered-hover Pagination $pagination-bordered-hover-border-color
$accordion-border Accordion $accordion-border-color
$accordion-border-width
$button-border-style Button -
$button-text-align Button -
$button-loading-animation Button $button-loading-speed
$card-border-style Card -
$dropdown-border Dropdown $dropdown-border-color
$dropdown-border-width
$dropdown-radius Dropdown $dropdown-border-radius
$dropdown-link-hover Dropdown $dropdown-link-hover-background
$image-thumb-border Image $image-thumb-border-color
$image-thumb-border-width
$media-border-style Media -
$tag-border-style Tags -
$body-font-color Base $theme-font-color

v1.1.1

Notes

Forgot to update version number in compiled css. This is a trivial patch - but it needs to be done.

v1.1.0

Notes

Apologies for the necessary deprecations.

Improvements

  • Items within a list using the is-inline-list modifier will now wrap.
  • Added a top-margin of 0.3rem to dt elements that are preceded by a dd element. This adds a little more breathing room.
  • Removed the _form.scss module. This should have been removed version 1.0.
  • Removed bottom-margin from heading tags when used in a top__brand element.
  • Removed the redundant form/form.scss file.
  • Removed absolute positioning from the top__burger element when the is-mobile-responsive modifier is active.
  • Added 'square' to the $image-square-sizes list and removed the $image-square-size variable.
  • Changed the default value of $tab-border-radius to 0. Previous value was 6px.
  • Added is-loading modifier to the is-select container.
  • New form variable $select-loading-animation with value spinner .8s linear infinite.
  • New form variable $select-loading-width with value 2px.
  • New form variable $select-loading-color with value $light-grey.

Bug fixes

  • Tab list item padding was being applied to the li element instead of the a element. All content within a tab list item must be placed within the a element.
  • The is-flex-start grid modifier is now using the align-items CSS property instead of align-content.
  • Menu list item padding was being applied to the li element instead of the a element. All content within a menu list item must be placed within the a element.
  • Removed the on hover underline for a elements in pagination list items.
  • Pagination list item padding was being applied to the li element instead of the a element. All content within a pagination list item must be placed within the a element.
  • The is-active modifier now works on top__burger elements that do not have the has-animate modifier.
  • The top__burger element now appears vertically centered within the top bar.
  • The is-mobile-response.is-open modifier did not work on top elements with containers. This has been corrected.
  • Active list items within the is-expandable list now use the correct background color.
  • Button addon groups where taking up 100% width when nested within a button group. These have been corrected to auto width.
  • Tag groups and addons now have 100% width.

Deprecations

  • The tabs__title element will be removed this patch. Please use a regular list item or create your own title element.
  • The tabs__item element will be removed this patch. To create a tabs list item you only need a regular li element within a list that contains the tabs__list class.
  • The has-borders modifier in the tabs module has been replaced with has-border.
  • The $tab-bar-color variable will be removed and replaced with $tab-border-color. The default value remains the same.
  • The $tab-bar-width variable will be removed and replaced with $tab-border-width. The default value remains the same.
  • The menu__slidedown element will be removed this patch. Please use the is-expandable modifier instead.
  • The $menu-slidedown-border variable will be removed this patch and replaced with $menu-expandable-border. The default value remains the same.
  • The $menu-slidedown-margin variable will be removed this patch and replaced with $menu-expandable-margin. The default value remains the same.
  • The $menu-slidedown-padding-left variable will be removed this patch and replaced with $menu-expandable-padding-left. The default value remains the same.
  • The $menu-slidedown-item-padding variable will be removed this patch and replaced with $menu-expandable-item-padding. The default value remains the same.
  • The $image-square-size variable has been removed. You can edit this value with the $image-square-sizes variable instead.

v1.0.1

Improvements

  • Add $input-background-color variable. Use this to override the default $white background color on form elements.
  • Add $input-color variable. Use this to override the default inherit text color on form elements.

Bug fixes

  • Corrected .top__links li element not applying by removing rogue comma.
  • The $top-link-hover-decoration variable now applies to any nested link elements.
  • .top__burger now sits in the top right corner when the .is-mobile-responsive modifier is being used.

v1.0.0

Core changes

  • Reorganised structure of the scss folder. Helpers have been moved into the base folder as these are all part of OrbitCSS's base core.
  • /helpers/general.scss can now be found at /base/helpers.scss.
  • An include all file has been added for each folder allowing developers to include the entire contents instead of each single file.
  • The switch and slider elements have been separated into two modules independently from the general form module.
  • The media module has been moved to the elements directory.
  • /navigation/navbar has been renamed to /navigation/top.
  • .has-start, .has-centered and .has-end helpers have been added to the OrbitCSS global helpers. These will align child flex content using the CSS justify-content property.
  • Core functions and mixins moved to their own file at /base/functions.scss.
  • The .has-padding-only-sides global helper has been removed. Replace existing implementations with class="has-no-padding-top has-no-padding-bottom".
  • New mixin element-color has been added. Read more about how to use it in the OrbitCSS documentation.

Typography

  • .has-centered and .has-end helpers have been removed from the ul.is-inline-list helper. As these are now global helpers, any previous use will function as normal and no changes are required.
  • All link elements now implement text-decoration: underline; on hover state. Previously this was controlled via use of the .is-hover-underline helper.
  • Removed the .is-hover-underline helper.

Form

  • Form module has been split up unto three modules for the general form content, switch and slider.
  • The .is-small helper for the switch module has been removed. If you still require this class you can copy the code from a previous version of OrbitCSS.
  • The .upload element has been removed. This should have never existed and predates initial OrbitCSS releases. Use the .is-file-input element class instead.

Grid

  • .has-centered and .has-end helpers have been removed from the grid element. As these are now global helpers any previous use will function as normal and no changes are required.

Breadcrumb

  • .has-centered and .has-end helpers have been removed from the breadcrumb element. As this previously applied to the child ul element you will now have to add these helpers directly to the ul element. For example replace:
<nav class="breadcrumb has-centered">
	<ul>...</ul>
</nav>

WITH

<nav class="breadcrumb">
	<ul class="has-centered">...</ul>
</nav>

Top

  • Module renamed from navbar to top.
  • .has-centered and .has-end helpers have been removed from the top element. As this previously applied to the child .container element (only when one was present) you will now have to add these helpers directly to the .container element. For example replace:
<nav class="top has-centered">
	<div class="container">...</div>
</nav>

WITH

<nav class="top">
	<div class="container has-centered">...</div>
</nav>
  • Added $top-link-hover-decoration variable. Allows you to add underline styling to top links.
  • Added $top-link-hover-color variable. Allows you to set a text color for links in the hover state.
  • Added $top-link-active-background variable. Allows you to set a background color for links that are in the active state via the is-active helper.
  • Moved the .is-active helper up to the li element instead of the actual a element. This allows for active styling to be applied to list items that are not actually links.
  • Removed the .is-even helper due to lack of browser support for justify-content: space-evenly.
  • Remove the .is-neat helper. It's use case was too specific.
  • Previously all ul elements would be hidden on small view ports. This is no longer the case and all elements are visible without the use of the .is-mobile-responsive helper.
  • Added $top-social-padding variable. This is applied directly to the .top__social element.
  • Overhauled the .is-mobile-responsive helper. All .top__links and .top__social elements will stack neatly when on small view port. Content can be triggered by adding .is-open to the .top element.
  • The .top__burger element has been overhauled. Only one span is required within the element:
<div class="top__burger">
	<span></span>
</div>
  • Added $top-burger-padding variable. This is applied directly to the .top__burger element.
  • Removed the $top-burger-bar-width variable.
  • Added $top-burger-bar-gap variable. This defines the spacing between each of the bars in the burger.
  • Removed .top__links--mobile modifier.
  • Added the .top__buttons element. This will provide clean styling for buttons in the nav bar.
  • Added $top-button-padding variable. This is applied directly to the .top__buttons element.

Pagination

  • .has-centered and .has-end helpers have been removed from the pagination element. As these are now global helpers any previous use will function as normal and no changes are required.
  • Padding now applies to the li element instead of the nested link element.

Alert

  • The alert-color mixin has been removed. Any implementation of it should now make use of the global element-color mixin.
  • The $alert-radius has been updated to 0. This removes rounded corners on the alert element by default.

Button

  • The button-color mixin has been removed. Any implementation of it should now make use of the global element-color mixin.
  • .has-centered and .has-end helpers have been removed from the .is-button-group and .is-addon-group elements. As these are now global helpers any previous use will function as normal and no changes are required.

Card

  • The .has-no-padding helper has been removed from the card element. As this previously removed the padding from the child header, content and footer you will have to add .has-no-padding to each of these elements individually.
  • Removed the .card--modal modifier. Card elements can now just be placed directly in the modal.
  • Removed the .is-rounded helper class and changed the default value of the $card-radius variable to 0.

Modal

  • The $modal-overlay-background variable can now be overridden.
  • Removed the .card--modal modifier. Card elements can now just be placed directly in the modal.
  • Removed the .has-padding helper from the .modal__content element. Padding is now set as the default and can be overridden with the global .has-no-padding helper.
  • Set the default value of the $modal-radius variable to 0.

Tabs

  • .has-centered and .has-end helpers have been removed from the tabs element. As this previously applied to the child .tabs__list element you will now have to add these helpers directly to the .tabs__list element. For example replace:
<div class="tabs has-centered">
	<ul class="tabs__list">...</ul>
</div>

WITH

<div class="tabs">
	<ul class="tabs__list has-centered">...</ul>
</div>
  • Remove the .has-rounded-borders helper from the .tabs__item element. Border radius can now be controlled with the $tab-border-radius variable.
  • Added the $tab-border-radius variable with a default value of 0. This variable can be used to control the border radius of the tab list items.

Tags

  • The tag-color mixin has been removed. Any implementation of it should now make use of the global element-color mixin.
  • .has-centered and .has-end helpers have been removed from the .is-tag-group and .is-addon-group elements. As these are now global helpers any previous use will function as normal and no changes are required.

Menu

  • The .link__list a styling has been moved to the li element. This allows for list items that do not have links. The exception is .menu__slidedown elements. The styling will isntead be inherited by the first child.
  • Remove the 100% width and no margin default that was applied to all buttons within a menu.
  • Removed the .is-open modifier on the slide down menu. To trigger an open state; only the .is-active modifier needs to be applied to the parent item.
  • Restructure to prevent nested content inheriting the properties of the core menu elements.

Section

  • Added 1rem left & right padding to all 3 section sizes.

Accordion

  • Removed the .is-open modifier on the .accordion__content element. To trigger an open state; the .is-active modifier needs to be applied to a direct parent of the .accordion__content element.

Table

  • Removed the .has-scroll helper.
  • Added .is-table-container element. Wrapping a table with this class will enable horizontal scrolling.

Dropdown

  • Changed the default value of the $dropdown-radius variable to 0.
  • Removed the margin override from dropdown buttons.

Bug fixes

  • Flex is now only applied to elements with .hero__content who are a direct descendant of the .hero.is-full element.
  • Using .is-end and .is-center will only apply to direct descendants of the .card__footer element and not all descendants.
  • Span and label styling is only applied to direct descendants of .is-input-group element. This was causing elements such as buttons using icons to display incorrectly.

0.4.4

Bug fixes

  • Corrected bottom margin when using multiple subtitles after a title element.
  • Dropdown element arrow now calculating EMs based on font base size.
  • Removed the margin on ul elements using the .is-inline-list helper.
  • Using the .is-rounded and .is-thumbnail helpers together now forces the rounded border radius.
  • Avoid .has-text-muted being overriden by adding !important.

Improvements

  • Added .has-centered and .has-end alignment helpers for the ul element.
  • Added .has-no-padding-left and .has-no-padding-right general helper classes.
  • Added pointer cursor to the burger menu.
  • Changed the structure of the .button--close element to support color inheritance.

Variable changes

Variable From To
$button-cross-width 2px 1px
$button-cross-color $white inherit

Deprecations

  • $button-cross-height variable.

0.4.3

Bug fixes

  • $dropdown-radius now actually changes the border radius for a dropdown element.
  • $tag-addon-radius now controls the border radius for tags in addon groups.
  • $slider-track-height now correctly sets the height for the sliderTrack() mixin.
  • Remove redundant $top-burger-bar-width variable from the navbar module.
  • $subtitle-color now editable.
  • Burger menu now has the correct width when .is-active helper is active.
  • Labels and spans in input groups now resize correctly when the $font-base variable is changed.
  • Switches now resize correctly when the $font-base variable is changed.
  • Corrected padding on the dropdown element when the .has-arrow is active and the $font-base variable has been changed.
  • Corrected positioning of select element's arrow when the $font-base variable has been changed.

Improvements

  • Removed margin-right from any button using the .is-full helper in a button group.
  • Added the $label-font-size and $label-line-height variables for form label customization.

Variable changes

Variable From To
$label-font-size calculateRem(16)
$label-line-height 1.6

Notes

  • The .is-small helper for the switch element will be removed in version 0.5.0. The small version of the switch does not benefit the framework and is too specific.

0.4.2

Improvements

  • Move the a element into typography.scss.

Bug fixes

  • Fix .has-link-inherit not applying to deeper nested links.
  • Correct typo in changelog for v0.4.1.

0.4.1

Improvements

  • Add .is-active helper to button element.
  • Add .is-flex-start helper to the grid element.
  • Add .has-link-inherit helper to force child link elements to inherit the text color of the parent.
  • Add .is-hover-underline helper.
  • New variable $list-item-padding to set the padding on li elements in ordered and unordered lists.
  • Add .is-inline-list helper to the unordered list element.
  • Set burger bar color based on border color instead of background color.

Bug fixes

  • Make $card-header-color variable overridable.
  • Fix border display on focus state for form elements within an input group.
  • Fix variable height bug for form elements within an input group in Chrome.
  • Nested unordered lists no longer inherit the list-style-type styling of a parent unordered list with the .has-no-list-style helper.

Deprecations

  • $top-burger-bar-width variable.

Variable changes

Variable From To
$list-item-padding 0
$top-burger-bar-height 2px 1px
$top-burger-color $white inherit

0.4.0

Notes

Before upgrading check the use of the .is-{size}-only and .is-{screen}-offset-{size} helper classes throughout your code and update as per the below improvements.

Improvements

  • Change column offset responsive helpers to read .is-offset-{screen}-{size} instead of .is-{screen}-offset-{size}.
  • Change all of the responsive .is-{screen}-only helpers to display only for the given view port (not larger).
  • Add .is-tablet-up helper to display on the medium and up viewport.
  • Add .is-tablet-down helper to display on the medium and small viewports.
  • Add .is-desktop-up helper to display on the large and up viewport.
  • Add .is-desktop-down helper to display on the large, medium and small viewports.
  • Add .is-desktop-auto helper.
  • Add .is-desktop-x-auto helper.
  • Create the column-size() mixin to make column sizing easier to manage.
  • Reduce overall size of orbit.css and orbit.min.css.

Bug fixes

  • Fix typo in the column offset responsive helpers.

0.3.2

Bug fixes

  • Correct class name for the .has-no-wrap helper.
  • Add padding-right to select element to prevent text/arrow overlap.

0.3.1

Improvements

  • Add .has-no-wrap helper class. Applies white-space: nowrap.
  • Add border radius to the .card__header and .card__footer elements when the card block has the .is-rounded modifier.
  • Add $card-header-color variable.

Deprecations

  • Remove the .is-reversed grid modifier.

Variable changes

Variable From To
$breadcrumb-disabled-color lighten($dark-grey, 35%) $muted
$card-header-color $black

0.3.0

Bug fixes

  • Fix the double scrolling issue when using cards in a modal.
  • Add !default to all custom variables that are missing this.

Improvements

  • Add position: relative to .card__content class.
  • Make the modal module mobile-first.
  • Add the $input-border-radius variable for all input, textarea and select elements.
  • Improve the .is-checkbox and .is-radio elements to prevent wrapping.
  • Make the grid module mobile-first.
  • Add the $pagination-background variable.
  • Add the $pagination-bordered-background variable.
  • Make the pagination module mobile-first.
  • Add $medium variable.
  • Add $large variable.
  • Add $x-large variable.
  • Add .is-desktop-x-{size} grid classes.
  • Add .is-desktop-x-only class.
  • Add .is-tablet-only class.

Deprecations

  • $medium-min variable.
  • $large-min variable.

Variable changes

Variable From To
$small-max 768px 767px

0.2.1

Bug fixes

  • Correct the flex-flow for the .tabs__list element.
  • Correct the flex property for the .grid .column element.
  • Fix .is-loading spinner display issue on Chrome/Safari.

Improvements

  • Force 100% width for modals of all sizes on mobile viewport.
  • Add the $accordion-background variable.
  • Add $custom-palette variable to support extending the $color-palette variable.

0.2.0

Improvements

  • Improve flex properties for the Card element.
  • Add .is-shrink class to the .card element.
  • Improve flex properties for the Breadcrumb element to ensure additional ul elements are not inline.
  • Move the .has-centered and .has-end from the ul element to the .breadcrumb element.
  • Improve flex properties for the Alert element.
  • Add transparent background to buttons with the .is-outline helper class.
  • Improve flex properties for the Grid system.
  • Add .is-mobile-auto helper class to allow for equal width columns on smaller views.
  • Add flex properties to the .is-checkbox and .is-radio elements.
  • Improve flex properties for the Hero element.
  • Improve flex properties for the Image element.
  • Improve flex properties for the Media element.
  • Remove width property from .menu element.
  • Improve flex properties for the Modal element.
  • Improve flex properties for the Top element.
  • Improve flex properties for the Tabs element.
  • Reorder color variables to support simpler customization.

Deprecations

  • Remove the $container-max-width variable.

Variable changes

Variable From To
$container-padding 10px 20px
Variable From To
$menu-slidedown-border 1px solid #e9ecef 1px solid $light-grey

0.1.7

Bug fixes

  • Removed the previously depreciated class .is-mobile-column from grid.sccs.

Deprecations

  • The .is-outline class for the .tabs__item element has been removed.

0.1.6

Bug fixes

  • Fix put in place to correct the display issue for .is-loading buttons on mobile view.

Improvements

  • Added styling for .tabs__item:hover.
  • Removed the padding from .containers on mobile viewport.
  • 100% width has been added back to the .container element.
  • Added the .is-mobile-shrink and .is-desktop-shrink column classes.
  • Changed .margin-top property to -0.4em for both .is-select::after and .has-arrow::after.
  • Changed width and height properties to 0.625em for .has-arrow::after.
  • Flex properties added to the .card element to ensure .card__content grows to available space.
  • Added $white background to all form elements.
  • The .box-sizing: border-box property has been applied to all elements.

Deprecations

  • The .is-outline class for the .tabs__item element will be removed in the next patch. Has currently been removed from the documentation.

Variable changes

Variable From To
$select-arrow-height 0.375em 0.625em
$select-arrow-width 0.375em 0.625em

0.1.5

Bug fixes

  • Reorder grid sizes to ensure desktop columns are given priority
  • Remove 100% width from container

0.1.4

Bug fixes

  • Fix calcColWidth() function converting units to string.

0.1.3

Bug fixes

  • Set default input and select border radius to 0. Select elements had rounded borders on Safari.

Improvements

  • Move accordion.scss to to the elements directory.
  • Added calcColWidth(int) function to the grid.
  • Add column support for the desktop viewport.
  • Added padding to the container element on small viewports.

0.1.2

Bug fixes

  • Added a default statement to the $title-font-family variable.

Improvements

  • Added support for a .is-mobile-column class. Prevents a column with no pre-defined size from taking on 100% width on mobile devices.

0.1.1

Bug fixes

  • Changed CSS ordering to prevent grid visibility overriding the helper visibility classes
  • Fixed mobile only column display issue

Improvements

  • Added a .has-no-list-style class for ul elements.
  • Changed $card-padding variable to $card-header-padding.