diff --git a/config.rb b/config.rb index 8781f5e..cdcf1be 100644 --- a/config.rb +++ b/config.rb @@ -72,8 +72,10 @@ Dir['old_source/documentation/breaking-changes/**'].each do |file| end for url in %w[d/random-with-units documentation/breaking-changes/random-with-units - d/breaking-changes/color-units documentation/breaking-changes/color-units] do - redirect url, to: "/documentation/breaking-changes/function-units" + d/color-units documentation/breaking-changes/color-units] do + # Middleman and GitHub Pages require the origin URL to contain an extension, + # otherwise it will serve the redirect as "octet-stream". + redirect "#{url}.html", to: "/documentation/breaking-changes/function-units" end redirect 'tutorial.html', to: '/guide' diff --git a/old_source/documentation/at-rules/import.html.md.erb b/old_source/documentation/at-rules/import.html.md.erb index 090e600..23ebd0e 100644 --- a/old_source/documentation/at-rules/import.html.md.erb +++ b/old_source/documentation/at-rules/import.html.md.erb @@ -36,8 +36,8 @@ required to have quotes. This makes it very difficult for people (or tools) to tell where anything is defined. - * Because everything's global, libraries must prefix to all their members to - avoid naming collisions. + * Because everything's global, libraries must add a prefix to all their + members to avoid naming collisions. * [`@extend` rules][] are also global, which makes it difficult to predict which style rules will be extended. diff --git a/old_source/documentation/breaking-changes.html.md.erb b/old_source/documentation/breaking-changes.html.md.erb index 7ca5807..f657e50 100644 --- a/old_source/documentation/breaking-changes.html.md.erb +++ b/old_source/documentation/breaking-changes.html.md.erb @@ -40,3 +40,8 @@ These breaking changes are coming soon or have recently been released: * [The syntax for CSS custom property values changed](breaking-changes/css-vars) in Dart Sass 1.0.0, LibSass 3.5.0, and Ruby Sass 3.5.0. + +## Early Opt-In + +Dart Sass users can opt in to treat deprecations as errors early using the +[`--fatal-deprecation` command line option](cli/dart-sass#fatal-deprecation). diff --git a/old_source/documentation/cli/dart-sass.html.md.erb b/old_source/documentation/cli/dart-sass.html.md.erb index 2ea24a5..4153422 100644 --- a/old_source/documentation/cli/dart-sass.html.md.erb +++ b/old_source/documentation/cli/dart-sass.html.md.erb @@ -437,6 +437,98 @@ path] to be a "dependency". This flag doesn't affect the [`@warn` rule] or the $ sass --load-path=node_modules --quiet-deps style.scss style.css ``` +#### `--fatal-deprecation` + +<% impl_status dart: '1.59.0' %> + + +This option tells Sass to treat a particular type of deprecation warning as +an error. For example, this command tells Sass to treat deprecation +warnings for `/`-as-division as errors: + +```shellsession +$ sass --fatal-deprecation=slash-div style.scss style.css +Error: Using / for division outside of calc() is deprecated and will be removed in Dart Sass 2.0.0. + +Recommendation: math.div(4, 2) or calc(4 / 2) + +More info and automated migrator: https://sass-lang.com/d/slash-div + +This is only an error because you've set the slash-div deprecation to be fatal. +Remove this setting if you need to keep using this feature. + ╷ +1 │ a { b: (4/2); } + │ ^^^ + ╵ + style.scss 1:9 root stylesheet +``` + +The following deprecation IDs can be passed to this option: + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
IDVersionDescription
call-string0.0.0Passing a string directly to meta.call().
elseif1.3.2Using @elseif instead of @else if.
moz-document1.7.2Using @-moz-document (except for the empty url prefix hack).
new-global1.17.2Declaring new variables with !global.
color-module-compat1.23.0Using color module functions in place of plain CSS functions.
slash-div1.33.0Using the / operator for division.
bogus-combinators1.54.0Leading, trailing, and repeated combinators.
strict-unary1.55.0Ambiguous + and - operators.
function-units1.56.0Passing invalid units to built-in functions.
+ +Alternatively, you can pass a Dart Sass version to treat all deprecations that +were present in that version as errors. For example, +`--fatal-deprecation=1.33.0` would treat all deprecations in the +table above up to and including `slash-div` as errors, but leave any newer +deprecations as warnings. + + #### `--trace` This flag tells Sass to print the full Dart or JavaScript stack trace when an diff --git a/old_source/documentation/modules/math.html.md.erb b/old_source/documentation/modules/math.html.md.erb index 9777fa4..66fd414 100644 --- a/old_source/documentation/modules/math.html.md.erb +++ b/old_source/documentation/modules/math.html.md.erb @@ -9,14 +9,75 @@ title: sass:math <% function 'math.$e' do %> <% impl_status dart: '1.25.0', libsass: false, ruby: false %> - Equal to the value of the [mathematical constant *e*][]. + The closest 64-bit floating point approximation of the [mathematical constant + *e*][]. [mathematical constant *e*]: https://en.wikipedia.org/wiki/E_(mathematical_constant) <% example(autogen_css: false) do %> @debug math.$e; // 2.7182818285 === - @debug math.$e // 2.7182818285 + @debug math.$e // 2.7182818285 + <% end %> +<% end %> + + +<% function 'math.$epsilon' do %> + <% impl_status dart: '1.55.0', libsass: false, ruby: false %> + + The difference between 1 and the smallest 64-bit floating point number greater + than 1 according to floating-point comparisons. Because of Sass numbers' [10 + digits of precision](../values/numbers), in many cases this will appear to + be 0. +<% end %> + +<% function 'math.$max-number' do %> + <% impl_status dart: '1.55.0', libsass: false, ruby: false %> + + The maximum finite number that can be represented as a 64-bit floating point + number. + + <% example(autogen_css: false) do %> + @debug math.$max-number; // 179769313486231570000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000 + === + @debug math.$max-number // 179769313486231570000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000000 + <% end %> +<% end %> + + +<% function 'math.$max-safe-integer' do %> + <% impl_status dart: '1.55.0', libsass: false, ruby: false %> + + The maximum integer `n` such that both `n` and `n + 1` can be precisely + represented as a 64-bit floating-point number. + + <% example(autogen_css: false) do %> + @debug math.$max-safe-integer; // 9007199254740991 + === + @debug math.$max-safe-integer // 9007199254740991 + <% end %> +<% end %> + + +<% function 'math.$min-number' do %> + <% impl_status dart: '1.55.0', libsass: false, ruby: false %> + + The smallest positive number that can be represented as a 64-bit floating + point number. Because of Sass numbers' [10 digits of + precision](../values/numbers), in many cases this will appear to be 0. +<% end %> + + +<% function 'math.$min-safe-integer' do %> + <% impl_status dart: '1.55.0', libsass: false, ruby: false %> + + The minimum integer `n` such that both `n` and `n - 1` can be precisely + represented as a 64-bit floating-point number. + + <% example(autogen_css: false) do %> + @debug math.$min-safe-integer; // -9007199254740991 + === + @debug math.$min-safe-integer // -9007199254740991 <% end %> <% end %> @@ -24,14 +85,14 @@ title: sass:math <% function 'math.$pi' do %> <% impl_status dart: '1.25.0', libsass: false, ruby: false %> - Equal to the value of the [mathematical constant *π*][]. + The closest 64-bit floating point approximation of the [mathematical constant *π*][]. [mathematical constant *π*]: https://en.wikipedia.org/wiki/Pi <% example(autogen_css: false) do %> @debug math.$pi; // 3.1415926536 === - @debug math.$pi // 3.1415926536 + @debug math.$pi // 3.1415926536 <% end %> <% end %> diff --git a/old_source/documentation/modules/meta.html.md.erb b/old_source/documentation/modules/meta.html.md.erb index eb06e39..142c2f2 100644 --- a/old_source/documentation/modules/meta.html.md.erb +++ b/old_source/documentation/modules/meta.html.md.erb @@ -229,6 +229,8 @@ title: sass:meta function definition. `$module` must be a string matching the namespace of a [`@use` rule][] in the current file. + [`@use` rule]: ../at-rules/use + <% example(autogen_css: false) do %> @use "sass:math"; diff --git a/old_source/documentation/modules/string.html.md.erb b/old_source/documentation/modules/string.html.md.erb index 35f411f..58d92f5 100644 --- a/old_source/documentation/modules/string.html.md.erb +++ b/old_source/documentation/modules/string.html.md.erb @@ -50,7 +50,7 @@ title: sass:string @debug string.insert("Roboto Bold", " Mono", -6) // "Roboto Mono Bold" <% end %> - If of `$index` is higher than the length of `$string`, `$insert` is added to + If `$index` is higher than the length of `$string`, `$insert` is added to the end. If `$index` is smaller than the negative length of the string, `$insert` is added to the beginning. @@ -101,6 +101,29 @@ title: sass:string <% end %> +<% function 'string.split($string, $separator, $limit: null)', + returns: 'list' do %> + <% impl_status dart: '1.57.0', libsass: false, ruby: false %> + + Returns a bracketed, comma-separated list of substrings of `$string` that are + separated by `$separator`. The `$separator`s aren't included in these + substrings. + + If `$limit` is a number `1` or higher, this splits on at most that many + `$separator`s (and so returns at most `$limit + 1` strings). The last + substring contains the rest of the string, including any remaining + `$separator`s. + + <% example(autogen_css: false) do %> + @debug string.split("Segoe UI Emoji", " "); // ["Segoe", "UI", "Emoji"] + @debug string.split("Segoe UI Emoji", " ", $limit: 1); // ["Segoe", "UI Emoji"] + === + @debug string.split("Segoe UI Emoji", " ") // ["Segoe", "UI", "Emoji"] + @debug string.split("Segoe UI Emoji", " ", $limit: 1) // ["Segoe", "UI Emoji"] + <% end %> +<% end %> + + <% function 'string.to-upper-case($string)', 'to-upper-case($string)', returns: 'string' do %> diff --git a/old_source/documentation/operators/string.html.md.erb b/old_source/documentation/operators/string.html.md.erb index ffadc09..abd42e8 100644 --- a/old_source/documentation/operators/string.html.md.erb +++ b/old_source/documentation/operators/string.html.md.erb @@ -46,7 +46,7 @@ that can be written to CSS, with a few exceptions: <% heads_up do %> It's often cleaner and clearer to use [interpolation][] to create strings, - rather than relying on this operators. + rather than relying on these operators. [interpolation]: ../interpolation <% end %> diff --git a/old_source/documentation/syntax/comments.html.md.erb b/old_source/documentation/syntax/comments.html.md.erb index 2c95417..42a42db 100644 --- a/old_source/documentation/syntax/comments.html.md.erb +++ b/old_source/documentation/syntax/comments.html.md.erb @@ -54,7 +54,7 @@ written with `//` are never emitted as CSS, but unlike SCSS everything indented beneath the opening `//` is also commented out. Indented syntax comments that start with `/*` work with indentation the same -way, except that they are compiled to CSS. Because the extend of the comment is +way, except that they are compiled to CSS. Because the extent of the comment is based on indentation, the closing `*/` is optional. Also like SCSS, `/*` comments can contain [interpolation][] and can start with `/*!` to avoid being stripped in compressed mode. diff --git a/old_source/documentation/values/calculations.html.md.erb b/old_source/documentation/values/calculations.html.md.erb index 455dd3c..9b29952 100644 --- a/old_source/documentation/values/calculations.html.md.erb +++ b/old_source/documentation/values/calculations.html.md.erb @@ -116,6 +116,51 @@ exactly where calculations are allowed and where they aren't. @debug calc($width * 2); // calc((100% + 10px) * 2); <% end %> +## Constants + +<% impl_status dart: "1.60.0", libsass: false, ruby: false %> + +Calculations can also contain constants, which are written as CSS identifiers. +For forwards-compatibility with future CSS specs, *all* identifiers are allowed, +and by default they're just treated as unquoted strings that are passed-through +as-is. + +<% example(autogen_css: false) do %> + @debug calc(h + 30deg); // calc(h + 30deg); + === + @debug calc(h + 30deg) // calc(h + 30deg); +<% end %> + +Sass automatically resolves a few special constant names that are specified in +CSS to unitless numbers: + +* `pi` is a shorthand for the [mathematical constant *π*]. + + [mathematical constant *π*]: https://en.wikipedia.org/wiki/Pi + +* `e` is a shorthand for the [mathematical constant *e*]. + + [mathematical constant *e*]: https://en.wikipedia.org/wiki/E_(mathematical_constant) + +* `infinity`, `-infinity`, and `NaN` represent the corresponding floating-point + values. + +<% example(autogen_css: false) do %> + @use 'sass:math'; + + @debug calc(pi); // 3.1415926536 + @debug calc(e); // 2.7182818285 + @debug calc(infinity) > math.$max-number; // true + @debug calc(-infinity) < math.$min-number; // true + === + @use 'sass:math' + + @debug calc(pi) // 3.1415926536 + @debug calc(e) // 2.7182818285 + @debug calc(infinity) > math.$max-number // true + @debug calc(-infinity) < math.$min-number // true +<% end %> + ## `min()` and `max()` <% impl_status dart: ">=1.11.0 <1.42.0", libsass: false, ruby: false, feature: "Special function syntax" do %> diff --git a/old_source/documentation/values/numbers.html.md.erb b/old_source/documentation/values/numbers.html.md.erb index 48893e4..81c3f13 100644 --- a/old_source/documentation/values/numbers.html.md.erb +++ b/old_source/documentation/values/numbers.html.md.erb @@ -51,8 +51,9 @@ been spotty, Sass always compiles it to fully expanded numbers. forwards-compatibility. <% end %> -Sass numbers support up to 10 digits of precision after the decimal point. This -means a few different things: +Sass numbers are represented internally as 64-bit floating point values. They +support up to 10 digits of precision after the decimal point when serialized to +CSS and for the purposes of equality. This means a few different things: * Only the first ten digits of a number after the decimal point will be included in the generated CSS. diff --git a/old_source/install.html.haml b/old_source/install.html.haml index 04dd35d..e00cb8a 100644 --- a/old_source/install.html.haml +++ b/old_source/install.html.haml @@ -21,17 +21,6 @@ no_container: true (Paid) Mac - %li - = link_to 'Hammer', 'http://hammerformac.com/' - (Paid) - Mac - - %li - = link_to 'LiveReload', 'http://livereload.com/' - (Paid, Open Source) - Mac - Windows - %li = link_to 'Prepros', 'https://prepros.io/' (Paid) @@ -39,13 +28,6 @@ no_container: true Windows Linux - %li - = link_to 'Scout-App', 'http://scout-app.io/' - (Free, Open Source) - Windows - Linux - Mac - :markdown ## Libraries diff --git a/source/install.md b/source/install.md index a8691d7..5f39c12 100644 --- a/source/install.md +++ b/source/install.md @@ -17,10 +17,7 @@ most of the applications for free but a few of them are paid apps (and totally worth it). - [CodeKit](https://codekitapp.com/) (Paid) Mac -- [Hammer](https://hammerformac.com/) (Paid) Mac -- [LiveReload](http://livereload.com/) (Paid, Open Source) Mac Windows - [Prepros](https://prepros.io/) (Paid) Mac Windows Linux -- [Scout-App](https://scout-app.io/) (Free, Open Source) Windows Linux Mac ## Libraries