Mellow CSS 0.13

[Studio384]

Mellow CSS 0.13 is a major feature update including various changes. It introduces a number of major design changes including enhancements to the dark color palettes, a new default blue color, redesigned buttons and input groups, and an improved bottom bar design.

Highlights

• Revamped dark color system: the dark color system has been revamped to provide a better spread of color weights.
• New button design: the buttons have received a major overhaul.
• System theme for nav: the nav component now has a system theme.
• Smaller Javascript: removes tab Javascript and drops support for jQuery.

Changelog

Changes

• cb93978 The default blue color has been made brighter by changing the base color from #0068d8 to #007bff.
• 7c4f443 The base grey color has been updated to contain slighly more blue, changing it from #6b707a to #616a7a.
• 2bdc3ca The default border radius has been lowered from .5rem to .4rem.
• 89fca25 Introduces updated button style with solid colored buttons.
• 86b5c4b Revamps input groups with new text design, less effects.
• 0c97460 0591928 Reworks the dialog, offcanvas, and backdrop styling to improve accessibility.
• a492d80 6890e66 The dark color palettes have been revamped with the following changes.
  • All colors from weight 600 and to 100 have been moved up one level, the color previously at weight 50 has been removed.
  • The color weights 600, 700, and 800 are now distributed between weights 500 and 900 evenly.
• ddd0b95 Adjusts the default border color.
• bf0883c e135cb4 11c996a Improved bottom bar design to truncate long labels and better spacing around icons.
• 48b18cd Updates the default dark color from 72% to 84% of the shade of grey.
• b6eef28 Adds the $system and $system-inverse variables.
• 28907b0 Updates and cleans up the Offcanvas Javascript.
• 1ee26b0 Adds the accent color to the $colors variable map to reduce the boilerplate and make sure the accent color is always in sync with the other colors.
• 3f1657c The range input now shows a fill for the active track (Firefox and Edge only).
• 6d9c845 Reduces excessive contrast between the header and footer background of a card in the dark theme.
• 1b2d22e Adds the nav-system class for navigation bars that follow the system style.

Removed

• b95febd Removes the Javascript implementation for tabs, use Mellow UI for this instead.

Documentation

• 7ce8cfb Various minor styling updates.
• e282632 Fixes errors in the dialog demos, fixes show() demo to actually use show() and not showModal().
• 0fa250d Fixes "default summary style" example to not use button classesn, fixes misplaced color classes in color examples.

Fixes

• bc9b013 Replaces all useages of logical style properties with the directional properties.
• 5966b49 Fixes a bug where the backdrop could appear underneath elements that were not offcanvas or dialog.
• ba0e9a7 Fixes the inconsistency where .alert wouldn't use the accent color by default.
• 5c2baff Fixes the inconsistency where .label wouldn't use the accent color by default.
• 9004535 Fixes breadcrumb links not using the pointer cursor.