v4.0.0-beta.1

Major Updates:

This is an beta release for the next version of Figuration. It might not ready for prime time yet, but we should be getting close.

This release contains mostly bug fixes, but does add a few new features such as:

• Modals now have a side alignment variant.
• Allowing setting of the root font-size.

Be sure to also check out the lists of previous changes:

• v4.0.0-alpha.1
• v4.0.0-alpha.2
• v4.0.0-alpha.3
• v4.0.0-alpha.4
• v4.0.0-alpha.5
• v4.0.0-alpha.6

CSS

• #450: Forms-Custom check/radio/switch: Fix for position of browser default validation message.
• #451: Content-Button: Remove unneeded specificity overrides for .btn-block.
• #452 Reboot: Add variable for body text alignment.
• #454: Forms-File Browser: Fix focus state for IE.
• #456: Forms: Add variable for font-weight for .form-check-label.
• #458: Fix wrapping in code blocks.
• #459: Reboot: Update some items and remove outdated rules.
• #460: Table: Add alignment variables.
• #461: Add SVG encoder and revise some icons,
• #464: Form: Revert legend changes and add min-height to textarea.form-control.
• #465: Tweak shadows a bit.
• #466: Fix font path in visual tests.
• #467: Use disabled attribute with sibling selectors due to Edge bug.
• #468: Input Group: Allow inputs to shrink smaller than the content.
• #469: Form-Check: Fix wrapping of labels in Firefox.
• #471: Dropdown: Revise alignment class names.
• #472: Reboot: Fix date/time input appearance.
• #474: Remove position: relative; from .collapsing.
• #477: Reboot: Allow setting root font size, value for rem.
• #478: Simplify some disabled styles and fix some cursor issues.
• #484: Stop using percent for relative font sizing.
• #487: Forms: Update name of validation icon setting.
• #489: Modal: Add side aligned variants.

JS

• #453: Dropdown: Fix some issues with positioning.
• #457: Dropdown: Handle no target menu in clearMenus().
• #463: Modal: Adjust resetting scrollTop when modal body is not found.
• #473: Allow passing of a customized Popper.js configuration to supported widgets.
• #475: Dont allow mixed operators.
• #476: Dropdown: Fix closing and menu alignment.
• #488: Popover: Fix drag functionality after popper integration.

Docs

• #455: Fix IE favicon path.
• #462: Use data attribute for clipboard tooltips.
• #470: Add some docs about theme colors and palette system.
• #479: Update reboot docs regarding font-size.
• #482: Update to Jekyll 4.

Build

• #480: Drop some outdated browser versions.
• #481: Add maps for RTL CSS.
• #483: Improve Travis caching.
• #485: Eslint: report on unused disabled directives.
• #486: Use a better unused variable checker for Sass.

v4.0.0-alpha.6

This is republish for v4.0.0-alpha.6, since the original one was based against the wrong branch.

NOT PRODUCTION READY!!

This is an alpha release for the next version of Figuration. It is not ready for prime time yet, and many more breaking changes will be coming. There is also the possibility of many pieces still being in a broken state.

Be sure to also check out the lists of previous changes:

• v4.0.0-alpha.1
• v4.0.0-alpha.2
• v4.0.0-alpha.3
• v4.0.0-alpha.4
• v4.0.0-alpha.5

Major Updates:

• Rebuilt the Dropdown widget to use a recursive concept.
  • .open now used on on the trigger and menu/submenu items instead of on the parent container.
  • Tab now moves between menu items, instead of closing the menu and moving on.
  • Improved the container handling when moving menu around in the DOM.
  • Tweaked some layout to tighten up the dropdown menu visual spacing.
  • Dropped the 'attachment' border radius reset on the menu corners.
  • Disabled one the of unit tests since the keydown does not seem to work in an automated way.
• Integrate Popper.js with Tooltip, Popover, and Dropdown.
  • Replaces the locate routines for Tooltip/Popover with a much more robust library.
  • Adds location capabilities to Dropdown. A feature that has been wanted for a long time.
  • Some Tooltip unit tests have been removed as they dealt with our own location implementation, and are no longer needed.

CSS

• #434: Component-Cards: Improve handling of card header tabs.
• #435: Utilities-Embed: Remove redundant properties from .embed-fluid.
• #436: Utilities-Screen Reader: Fix .sr-only-*-down media breakpoints.
• #438: Add information error messages when invalid breakpoints used.
• #439: Utilities-Flexbox: Reduce default number of order utils.
• #440: Component-Navbar: Add vars for brand coloring and fix divider var use.
• #441: Move _forms.scss to proper location.
• #443: Component-List: Remove negative margins from bordered items.
• #444: Code-Pre: Inherit color by default.
• #445: Utilities-Links: Add stretched links.
• #446: Widget-Modal: Add scrollable .modal-body variant.
• #448: Widget-Dropdown: Remove outline override.

JS

• #437: Widget-Dropown: Rebuild using recursive concept.
• #442: Integrate Popper.js with Tooltip, Popover, and Dropdown.

Docs

• #447: Fix some form validation doc issues.

Build

v4.0.0-alpha.5

NOT PRODUCTION READY!!

This is an alpha release for the next version of Figuration. It is not ready for prime time yet, and many more breaking changes will be coming. There is also the possibility of many pieces still being in a broken state.

Be sure to also check out the lists of previous changes:

• v4.0.0-alpha.1
• v4.0.0-alpha.2
• v4.0.0-alpha.3
• v4.0.0-alpha.4

Major Updates:

• Internet Explorer 10 is no longer supported by Figuration.
• Badges: These have been greatly simplified, to stop them frombeing another version of .btn. Removed the notion of color and theme variants, along with hover and focus states. Now the use of
  color utilities is the method for creating variants.
• Forms: A major overhaul has been done! The custom form variants have been merged and hopefully simplified. Here is a quick list of the changes:
  • Forms elements use em sizing now, allowing for easier size adjustments.
  • Combine custom selects into .form-control, and extended with some specific rules.
  • Update validation icon handling for selects to put icon on left side, like textarea due to scrollbar issues.
  • Shorten .form-control-label into .form-label.
  • Rework custom chekbox, radio, and switch to get rid of the 'indicator' label portion.
  • Merge custom checkbox, radio and switch into .form-check?
  • Rework custom file input markup to use HTML content instead of CSS content for button.
  • Change .custom-file{-*} into .form-file{-*}.
  • Change .custom-range into .form-range.

CSS

• #392: _assert-ascending(): Dont' check value if the previous unit was a percent.
• #393: Fix overflow issue with sr-only.
• #394: Remove indiscriminate outline suppression for tabindex="-1" elements.
• #396: Alert: Don't override <hr> color.
• #397: Utilities-Border: Add .radius-pill utility.
• #399: Badges: Simplify and move to use of utilities.
• #400: Utilities-Color: Drop hover/focus states for background utils.
• #402: Utilities-Spacing: Split out maps for padding and margins.
• #403: Utilities-Typography: Add wrap, word break, color reset, and decoration none utils.
• #405: Utilities-Sizing: Add sizing settings and viewport utils.
• #406: Component-Grid: Drop responsive gutter widths in favor of utilities.
• #407: Utilities-Typography: Add responsive font size utils.
• #408: Utility-Borders: Use new setting for radius size variants.
• #409: Component-Navbar: Adjust container handling.
• #411: Component-List: Remove incorrect display: block; from .list-item.
• #413: Content-Button: Add settings for .btn-link color.
• #414: Allow for em padding on form items.
• #415: Component sizing: Convert to using em units.
• #417: Content-Forms: Only generate proper pseudo-classes for form validation.
• #418: Utilities-Embed: Use map for embed-fluid ratios.
• #419: Content-Forms: Overhauled the forms!
• #422: Reboot and typography cleanup.
• #424: Component-Dropdown: Remove float.
• #425: Component-Progress: Adjust animation.
• #427: Component-Input group: Simpllify .form-file-label border radius reset.
• #428: Utility-Screen reader: Add !important to sr-only() mixin, add more focusable variants.
• #429: Component-Input Group: Use flex-basis instead of width.

JS

• #431: Dropdown: Fix links not working.

Docs

• #395: Add aria-label to sidebar and page toc navigation sections.
• #398: Update vendor JS.
• #412: Fix dropdown menus in navbar examples.
• #426: Clean up redundant .col-12 use.
• #432: Overhaul docs as part of version bump.

Build

• #401: Drop IE 10 from official support
• #404: Stylelint: Blacklist the font size property - use the responsive font size mixin.
• #416: Add postcss-calc to build process.
• #420: Update jQuery to v3.4.1.
• #421, #423, #430: Karma for unit tests.

v4.0.0-alpha.4

NOT PRODUCTION READY!!

This is an alpha release for the next version of Figuration. It is not ready for prime time yet, and many more breaking changes will be coming. There is also the possibility of many pieces still being in a broken state.

Be sure to also check out the lists of previous changes:

• v4.0.0-alpha.1
• v4.0.0-alpha.2
• v4.0.0-alpha.3

Major Updates:

• This Alpha release features mostly bug-fixes with some smaller updates.
• We have started using null values for some variables in _settings.scss. This has the benefit of not producing output for certain CSS rules. Mostly relating to fonts and text colors.
• Some variable names in __settings-options.scss have been moved around for utilities.
• Overflow utility classes have been added.

CSS

• #330: Incorporate some normalize.css updates.
• #331: Breakpoints - use unitless math with increased precision, check for null.
• #332: Force use of transition mixin, add settings variable for reduced motion.
• #333: Allow passing light and dark overrides in contrast functions.
• #334: Update handling for close/drag icons when anchors.
• #336: Adjust handling of disabled .nav-link items.
• #337: Add Noto Sans to font stack.
• #339: Adjust modal for mobile devices where the address bar can hide.
• #340: Allow translating custom file browse button via HTML.
• #341: Allow grid, container, and gutter width maps to merge.
• #346: Prevent skip ink for abbreviations.
• #347: Cards: Inherit text color for card header and footer.
• #352: Button Group: Allow buttons to grow to fit parent button group.
• #356: Reboot: Remove -ms-overflow-style, add iOS tap highlight override.
• #358: Remove shrink-to-fit from responsive meta tag.
• #360: Utilities: Text and background color utilities: Dont' generate CSS when delta for hover state is 0.
• #361: Enforce use of border-radius mixins.
• #362: Cards: Simplify .card-group radius resets.
• #363: Utilities: Add overflow utils, also make position and display use list of properties for generation.
• #364: Reboot: Prevent word wrap in <select > inputs for Safari.
• #366: Mixins: Handle when box-shadow has a none value.
• #369: Remove screen from media-query in transition mixin.
• #370: Add Sass map for form validation states.
• #371: Use null values to reduce some uneeded ouput.
• #372: Dropdown: Add setting for font-size.
• #373: Reduce output for tooltip and popover arrows.
• #375: Progress: Make animated variant take into account transition options.
• #376: Add some additional color variables.
• #377: Custom select - stop default caret from obscuring content in IE.
• #379: Dropdown: Prevent item from overflowing when no horizontal menu padding.
• #381: Simplify <code> visuals, but extend options.
• #382: Adjust <kbd> with additional settings.
• #383: Have _assert functions use the same argument pattern.
• #384: Add optional button and input font family settings.
• #385: Add ascending sort for $grid-breakpoints and $container-max-widths maps.
• #388: Some updates to responsive font size, and use mixin for more font-size rules.

JS

• #335: Util: Add transition-delay to get total transition time.
• #342: Tab: Remove transition check.
• #344: Dropdown: additional event callback properties.
• #353: Modal: Add basic enforceFocus test.
• #354: Modal: Usearia-modal with modals.
• #365: Tooltip: Fix custom placement when passing offset values.
• #380: Tab: Additional unit tests related to .in for the panes.
• #386: Popover: Stop some cases of a popover narrowing when hitting right side of window.
• #387: Dropdown: Don't close menu when an internal <label> is clicked.
• #390: Dropdown: Remove use of aria-haspopup.

Docs

• #343: Quick Start Template: Move <title> tag after <meta> tags.
• #345: Remove custom plugins.
• #348: Use utils for container and tabResponsive examples.
• #350: Update some reboot examples.
• #351: Add note about Sass precision being increased to 6 (default is 5).
• #367: Add styling to accordion card example.
• #368: Use Jekyll var for Twitter consistently.
• #374: Update examples with tabindex="-1" and/or aria-disabled="true" for disabled items.
• #378: Remove some uneeded horizontal padding from some grid and negative margin examples.
• #389: Accordion example, fix border and radius if only one card.

Build

• #338: Travis should use latest Chrome.
• #349: Stylelint: Enforce lowercase class names.
• #355: Fix Sauce test for Android.

v4.0.0-alpha.3

NOT PRODUCTION READY!!

This is an alpha release for the next version of Figuration. It is not ready for prime time yet, and many more breaking changes will be coming. There is also the possibility of many pieces still being in a broken state.

Be sure to also check out the lists of previous changes:

• v4.0.0-alpha.1
• v4.0.0-alpha.2

Major Updates:

• There are now Sass variables to disable generation of portions of the CSS. Useful when creating a custom theme, and you don't need the entire framework. Now you can trim out the pieces that are not being used.
• Responsive horizontal cards have been added. By using both the grid and some additional classes and markup, you can create cards that can switch from the standard stacked layout to a horizontal format.
• Documentation for the majority of the Sass variables has been added. The sections for color and palette system still need to be written.

CSS

• Add $enable-* vars in _settings-options.scss to control subsets of CSS generation:
  • #303: Utilities
  • #312: Core and Content (does not include color/palette items)
  • #313: Components
  • #325: Utility icons
  • #326: Widget components
• #305: Modal: Add vars for transform.
• #306: Grid: Remove min-height, no longer needed with flexbox.
• #307: Button: Allow .btn text to wrap.
• #309: Card: Add horizontal layout variant.
• #310: Reboot: Remove -webkit-text-decoration-skip to allow browser to determine underline style.
• #311: Grid: .col-*-auto should be max-width: 100%.
• #314: Fix drag and drop for custom file input .
• #318: Disable pointer events on dropdown and list items.
• #319: Add font size vars for buttons and inputs.
• #321: Add font weight vars for form control input and label.
• #322: Add str-replace to all SVG strings and optimize data URIs.
• #323: Remove user-select from .custom-control pseudo element.
• #324: Improve card header and footer theming.
• #327: Reduce specificity in lists and add missing pagination active border.

JS

• #308: Util: Fix transition duration check and remove selector escaping.

Docs

• Added related Sass variables and mixins for:
  • Utilities
  • Core
  • Content
  • Components
  • Widget components
• #315: Fix naming to .jumbotron-fluid.
• #317: Add note for card image overlay.
• #328: Add blog example.

Build

• #316: Added more linting rules to .stylelintrc.

v4.0.0-alpha.2

NOT PRODUCTION READY!!

This is a very early alpha stage release for the next version of Figuration. It is not ready for prime time yet, and many more breaking changes will be coming. There is also the possibility of many pieces still being in a broken state.

Be sure to also check out the list of changes made in v4.0.0-alpha.1!

Major Updates:

• Switch is no longer a separate component. Functionality has been replaced by the new .custom-switch form control.
• Slider widget has been removed and replaced with the new .custom-range styled <input type="range">.
• Local JS tests now run in headless Chrome.
• Modal header/footer now uses flexbox for layout.
• Form validation icons are back.

CSS

• #280: Custom Forms: Add styling for input type="range". Also updated player with basic support too.
• #281: Reworked .custom-control inputs. Simplified and consolidated switch component into custom forms.
• #282: Add CSS variables to :root for theme colors, breakpoints, and font stacks.
• #283: Allow greater flexibility for customizing the breadcrumb divider.
• #284: Fix some possible namespacing issues.
• #285: Add support for the Close icon within Badges.
• #286: Use per cell box-shadows for striped and hover tables.
• #287: Inherit border-color for .custom-file-label, and adjust height and positions for .custom-control.
• #288: Remove max-width from .table for Safari issue.
• #289: Re-implement validation icons.
• #290: Increase $shadow reuse for some components.
• #291: Utilities: Added auto-generated negative margins based on $spacers map.
• #292: Add more settings for close and drag items. Fixes close color issue in tooltips.
• #293: Add 'Noto Color Emoji' to font stack for newer Linux system support.
• #294: Reboot: Reduce specificity of SVG handling.
• #295: Allow active buttons to use background-image.
• #296: Add relative lighter and bolder font-weight utilities.
• #297: Stop floating .close by default.
  • Modal header and footer now use flexbox for layout.
  • Popover visuals reworked a bit
• #298: Make close and drag inherit color by default,
• #299: Add min-width to .custom-range when inside .form-inline - due to IE collapsing the input.
• #302: Remove outdated switch vars, use transition mixin for .custom-switch

JS

• #301: Drop Slider as a bundled widget. It has been moved to: https://github.com/cast-org/figuration-slider
  • Updated Player widget with removed support for Slider and replaced with support for <input type="range">.

Docs

• #300: Correct the use of .card-img-top/bottom to being placed on the image itself for proper rounding.

Build

• Update minimum NodeJS version to v8 for build tools, due to grunt-sass requirement.
• Browserlist moved to .browserlistrc due to inheritance issue
• Local JS tests now use headless chrome / puppeteer instead of phantomjs, due to updated grunt-contrib-qunit.

v4.0.0-alpha.1

NOT PRODUCTION READY!!

This is a very early alpha stage release for the next version of Figuration. It is not ready for prime time yet, and many more breaking changes will be coming. There is also the possibility of many pieces still being in a broken state.

Major Updates:

• Reworked color palette and coloring system.
• Component specific sizing and coloring has been added.
• Optional responsive font sizing via scaling or stepping.
• Overhauled buttons and forms, again.
• BS v4 style form validation! Yay!
• Dropped the button widget, and replace with CSS-only solution.
• Tons more stuff that should be referenced in the preview documentation.
  • Note: The migration docs are way behind in updates and do not reference all the changes.

CSS

• 9bdb18b: Add Sass color contrast functions and lookup table
• 19be5a8: Use :disabled rather than [disabled] selector
• #234: Allow spacers to be extended
• #235: Responsive Typography - includes both a fluid and a scaled variant
• #238, #242: Color and palette overhaul - lighten base colors, add a light/dark , use palette levels more consistently
• #241: Drop the gridlines component - to be replaced later with border utilities
• #243: Consolidate component colors
• Dropped background color and padding from .breadcrumb wrapper.
• Dropped contextual color variants from cards in favor of utilities.
• Fixed wrapping of text within .progress-bar under certain circumstances.
• #244: Cards are now flexbox and their color variants have been removed in favor of utilities.
• #245: Screen reader only: Disable clip-path due to performance issue in Chrome
• #246: Reverting the focus box-shadow and going back to consolidated hover/focus states
• #247: Add CSS-only checkbox/radio buttons
• #249: Rework cursor rules, add back pointer to controls, remove not-allowed since half the time it was overruled with pointer-events: none
• #250: Drop push/pull from grid
• #251: Utilities: Rename .flex-order to .order
• #252: List component - replacing List Group and .list-inline
• #253: Collapse - only alter display for collapsed items not being shown
• #254: Add list group as a modifier to the List component
• #255: Fix possible layout issue for card columns in Chrome
• #258: Future proof disabled clicks on disabled .btn-link
• #259: Allow customizing blockquote footer prepend content
• #260: Tables: Overhaul tables to start with a basic layout and change with modifier classes
• #261: Fix mouse cursors for .close and .drag
• #262: Modal: fix centered variant for IE
• 30184f9, 8189eb8: Badges: Add badge group
• #264: Rework input group- updated z-index and dropped opacity from .form-control border
• #265: Rework pagination component to simplify visuals and add modifier classes
• #266, #270: More color rework: add ability to manage color themes and mixing per component
• #267: Rework some utilities
  • Removed .text-hide and the text-hide() mixin. Other methods are available, such as .sr-only and .hidden/.invisible which have varying affects on screen-readers.
  • Added .flex-grow-0/1 and .flex-shrink-0/1 toggle classes to flex utils.
  • Added .font-family-* utils for sans-serif, serif, and monospace.
  • Renamed utilities/_text.scss to utilities/_typography.scss for consistency with doc page.
  • Added map for additional .embed-fluid aspect ratios.
  • Renamed component/_embed.scss to utilities/_ebmed.scss for consistency with doc page.
  • Added some box-shadow utils for outset and inset shadows.
  • Simplified the print display utils, the .print-only-* variants were removed.
• #268: Add prefers-reduced-motion media query to disable transitions based on user preference.
• #269: Add responsive border utils to replace the previously removed gridline functionality.
• #271: Responsive components and utilities can use a subset of the keys from $grid-breakpoints to generate less CSS when using custom settings.
• #274: Add per component/utility sizing maps, added line-height, and fixed some input height calcs.
• #275: Overhaul form and custom-form elements. Rework input-group. Add BS's form validation methodology.
• #276: Simplify the button states. No more notion of an 'active:hover' state, this has been merged into just an 'active' state. The focus ring box-shadows are back, and now use a defined color for the outer box-shadow.
• #277: Drop the .dropdown-toggle-* items as they seem too specific. Replace with .btn-icon and the .caret icon util. Also add .btn-group-end to match with input group.
• #278: Adjust how form elements in dropdown menus are implemented. Adjust player widget to match.

JS

• #248: Drop button widget
• #253: Lazy: Drop jQuery animations (slim build does not support them), add optional fade-in animation
• #263: Replace deprecated jQuery methods.
• #272: Drag: Don't start drag if a disabled handle is used or if the element where drag is attached is disabled.

Docs

• #236: Initial items for Responsive Typography
• Started the migration doc page.
• #257: Collapse: add note about animation and padding

Build

• #237: Moved jQuery to peerDependencies in the package.json
• 705d743: Add missing properties to .order check in stylelintrc
• #256: Increase browser support
• #273: Move to ESLint from JSCS and JSHint.

v3.0.5

CSS

• 424e7c3: Move print styles to end of CSS
• eae5e11: Make custom file input 100% width to match other form controls
• 0e38790: Adjust input group handling for custom select and file
• 260e61e: More additive border utils
• 80d0122: Add responsive .order-0 flexbox util
• 643e2de: Reboot: Remove touch-action:manipulation click optimization
• 438f254: Mixins: Hover - fix pseudo orders, update note regarding sticky hover/focus on iOS
• 2fbe4cd: Input Group: Use direct children selectors on form items
• d76bf19: Fix breakpoint mixins for custom breakpoint maps

Docs

• 834265d: Fix custom file language example
• 9e46186: Update overflow handling for examples
• ff8fbfa: Add example for tooltip/popover with disabled elements
• 422714e: Update browser compatibility note for position: sticky

Build

• f126567: Clarify lint-vars.js output messages

v3.0.4

CSS

• faa10d3: Progress: label adjustment
• ed911f2: Tooltip: Convert arrrow to us rem
• b572d0b: Popover: Convert arrow to use rem, and simplify related settings
• 7147d18: Cards: Fix nested cards for groups, decks, and columns
• b24126f: Adjust height handling for select items with size attribute
• 7059f4e: Pagination: Add support for text item with new .page-text
• 51023bc, 52b3610, 3ea60aa: Modal: Fix vertically centered modal overflow
• d7d8d57: Button Group: Simplify selectors and remove uneeded float

JS

• 2352532: Player: Increase step values for volume and seek sliders
• cfe9f25: Slider: Update aria attributes to reduce redundant screen reader speech
• ae202ae: Player: Output a percent value for volume level on aria attribute
• 1e97cd7: Tooltip: remove delay as it can cause tooltip to not be read in some instances
• 9ef446f, 6572d42: Util: Add escaping IDs for older jQuery versions
• 88cf6cb: Lazy: Normalize the visible check to latest jQuery method
• 66f3750: Player: Consolidate 'cuechange' event enable and disable routines
• a77f358: Player: Add text-based description functionality
• b16c541: Tooltip: Fix positioning for items inside fixed/absolute containers, such as modals
• aa360b4: Tooltip: Rework keyboard navigation handling, triggers are now part of the chain when tab navigating, no more trying to auto-skip over them

Docs

• f0a3599: Tab: Fix Javascript example
• 2d0d8fd: Collapse: Add a11y note regarding role="button"
• 023458d: Examples: Stop copy button from being hidden from screen readers
• 5daf0b0: Examples: Reduce tooltip init calls for clipboard buttons
• bbc322d: Custom Forms: Fix custom file language example
• 5fe7a2a: Forms: Remove float from example
• f3a1155: Move MutationObserver polyfill to vendor directory
• 72505e6, 1be2bb5: Update to Font Awesome 5
• 3153457: Tootlip/Popover: Update with new keyboard nav changes

Build

• 7fb4859, 63f8c17: Borrow lint-vars.js from BS

v3.0.3

Wow, messed up the previous release, and pushed a bit too fast.

Same as v3.0.2, but fixes the broken package.json version numbers.