diff --git a/core/bourbon/library/_font-stacks.scss b/core/bourbon/library/_font-stacks.scss index abd607ddb..e1676ba19 100644 --- a/core/bourbon/library/_font-stacks.scss +++ b/core/bourbon/library/_font-stacks.scss @@ -71,8 +71,6 @@ $font-stack-verdana: ( /// A variable that outputs a system font stack. /// -/// @link https://goo.gl/LHRZIf -/// /// @type list /// /// @example scss @@ -82,10 +80,11 @@ $font-stack-verdana: ( /// /// // CSS Output /// .element { -/// font-family: -apple-system, BlinkMacSystemFont, "Avenir Next", "Avenir", "Segoe UI", "Lucida Grande", "Helvetica Neue", "Helvetica", "Fira Sans", "Roboto", "Noto", "Droid Sans", "Cantarell", "Oxygen", "Ubuntu", "Franklin Gothic Medium", "Century Gothic", "Liberation Sans", sans-serif; +/// font-family: system-ui, -apple-system, BlinkMacSystemFont, "Avenir Next", "Avenir", "Segoe UI", "Lucida Grande", "Helvetica Neue", "Helvetica", "Fira Sans", "Roboto", "Noto", "Droid Sans", "Cantarell", "Oxygen", "Ubuntu", "Franklin Gothic Medium", "Century Gothic", "Liberation Sans", sans-serif; /// } $font-stack-system: ( + system-ui, -apple-system, BlinkMacSystemFont, "Avenir Next", diff --git a/spec/bourbon/library/font_stacks_spec.rb b/spec/bourbon/library/font_stacks_spec.rb index 7fd08e93c..035e516a9 100644 --- a/spec/bourbon/library/font_stacks_spec.rb +++ b/spec/bourbon/library/font_stacks_spec.rb @@ -21,10 +21,10 @@ '"Lucida Typewriter", monospace' monaco = '"Monaco", "Consolas", "Lucida Console", monospace' - system = '-apple-system, BlinkMacSystemFont, "Avenir Next", "Avenir", ' + - '"Segoe UI", "Lucida Grande", "Helvetica Neue", "Helvetica", ' + - '"Fira Sans", "Roboto", "Noto", "Droid Sans", "Cantarell", ' + - '"Oxygen", "Ubuntu", "Franklin Gothic Medium", ' + + system = 'system-ui, -apple-system, BlinkMacSystemFont, "Avenir Next", ' + + '"Avenir", "Segoe UI", "Lucida Grande", "Helvetica Neue", ' + + '"Helvetica", "Fira Sans", "Roboto", "Noto", "Droid Sans", ' + + '"Cantarell", "Oxygen", "Ubuntu", "Franklin Gothic Medium", ' + '"Century Gothic", "Liberation Sans", sans-serif' expect(".helvetica").to have_value(helvetica)