From 7ddb751615c564fa278e4f0fea87907184923e31 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Thu, 8 Dec 2022 16:23:48 -0800 Subject: [PATCH 01/45] [Color 4] Update tests for Color Level 4 (#1846) This updates most tests for the currently-implemented chunk of the Color 4 feature. A few tests that need more thorough reworking (such as being moved out of `error/` for things that are no longer intended to be errors) are marked as "todo" instead. See #1828 See sass/sass#2831 --- .github/workflows/ci.yml | 28 +- Gemfile | 15 - Gemfile.lock | 106 --- js-api-spec/value/color.test.ts | 36 +- {lib-js => lib}/cli-args.ts | 0 {lib-js => lib}/compiler.ts | 1 - {lib-js => lib}/interactor.ts | 0 {lib-js => lib}/lint-reporter.ts | 0 lib/sass_spec.rb | 18 - lib/sass_spec/annotate.rb | 6 - lib/sass_spec/annotate/cli.rb | 240 ----- lib/sass_spec/capture_with_timeout.rb | 110 --- lib/sass_spec/cli.rb | 121 --- lib/sass_spec/directory.rb | 273 ------ lib/sass_spec/engine_adapter.rb | 129 --- lib/sass_spec/interactor.rb | 88 -- lib/sass_spec/runner.rb | 108 --- lib/sass_spec/test.rb | 659 ------------- lib/sass_spec/test_case.rb | 196 ---- lib/sass_spec/test_case_metadata.rb | 128 --- lib/sass_spec/util.rb | 37 - lib/sass_spec/version.rb | 4 - {lib-js => lib}/spec-directory/cleanup.ts | 0 {lib-js => lib}/spec-directory/hrx.ts | 0 {lib-js => lib}/spec-directory/index.ts | 0 {lib-js => lib}/spec-directory/options.ts | 0 .../spec-directory/real-directory.ts | 0 .../spec-directory/spec-directory.ts | 0 {lib-js => lib}/spec-directory/spec-path.ts | 0 .../spec-directory/virtual-directory.ts | 0 {lib-js => lib}/tabulator.ts | 0 {lib-js => lib}/test-case/compare.ts | 0 {lib-js => lib}/test-case/expected.ts | 0 {lib-js => lib}/test-case/index.ts | 0 {lib-js => lib}/test-case/test-case.ts | 0 {lib-js => lib}/test-case/util.ts | 0 lint-spec.ts | 8 +- sass-spec.rb | 51 - sass-spec.ts | 10 +- .../color/adjust_color/error/args.hrx | 2 +- .../color/adjust_color/error/bounds.hrx | 11 + .../adjust_color/error/mixed_formats.hrx | 14 +- .../core_functions/color/adjust_color/hsl.hrx | 75 ++ .../core_functions/color/adjust_color/hwb.hrx | 8 +- .../color/adjust_color/units.hrx | 21 +- spec/core_functions/color/adjust_hue.hrx | 27 +- spec/core_functions/color/blackness.hrx | 10 +- .../color/change_color/error/args.hrx | 2 +- .../color/change_color/error/bounds.hrx | 11 + .../change_color/error/mixed_formats.hrx | 14 +- .../core_functions/color/change_color/hsl.hrx | 65 ++ .../core_functions/color/change_color/hwb.hrx | 4 +- .../color/change_color/units.hrx | 21 +- spec/core_functions/color/complement.hrx | 9 +- spec/core_functions/color/darken.hrx | 15 + spec/core_functions/color/desaturate.hrx | 25 + spec/core_functions/color/grayscale.hrx | 15 + .../color/hsl/error/one_arg.hrx | 32 +- .../color/hsl/three_args/units.hrx | 2 +- .../color/hsl/three_args/w3c/blue_to_red.hrx | 2 +- .../color/hsl/three_args/w3c/hue.hrx | 36 +- .../color/hwb/error/four_args.hrx | 46 +- .../color/hwb/error/one_arg.hrx | 70 +- .../color/hwb/error/three_args.hrx | 6 +- spec/core_functions/color/hwb/four_args.hrx | 14 +- spec/core_functions/color/hwb/one_arg.hrx | 18 +- .../color/hwb/three_args/named.hrx | 3 +- .../color/hwb/three_args/units.hrx | 6 +- .../hwb/three_args/w3c/blue_magentas.hrx | 44 +- .../color/hwb/three_args/w3c/blues.hrx | 26 +- .../color/hwb/three_args/w3c/cyan_blues.hrx | 44 +- .../color/hwb/three_args/w3c/cyans.hrx | 26 +- .../color/hwb/three_args/w3c/green_cyans.hrx | 44 +- .../color/hwb/three_args/w3c/greens.hrx | 26 +- .../color/hwb/three_args/w3c/magenta_reds.hrx | 44 +- .../color/hwb/three_args/w3c/magentas.hrx | 26 +- .../color/hwb/three_args/w3c/oranges.hrx | 44 +- .../color/hwb/three_args/w3c/reds.hrx | 26 +- .../hwb/three_args/w3c/yellow_greens.hrx | 44 +- .../color/hwb/three_args/w3c/yellows.hrx | 26 +- spec/core_functions/color/invert.hrx | 9 +- spec/core_functions/color/lighten.hrx | 15 + spec/core_functions/color/mix.hrx | 8 +- .../color/rgb/error/one_arg.hrx | 32 +- .../color/rgb/four_args/clamped.hrx | 12 + .../color/rgb/one_arg/alpha.hrx | 12 + .../color/rgb/one_arg/no_alpha.hrx | 32 +- .../color/rgb/three_args/percents.hrx | 20 +- .../color/rgb/three_args/unitless.hrx | 12 + spec/core_functions/color/saturate.hrx | 10 + .../color/scale_color/error/args.hrx | 2 +- .../color/scale_color/error/mixed_formats.hrx | 15 +- spec/core_functions/color/scale_color/hsl.hrx | 45 + spec/core_functions/color/scale_color/hwb.hrx | 20 +- spec/core_functions/color/scale_color/rgb.hrx | 50 + spec/core_functions/color/whiteness.hrx | 10 +- spec/core_functions/meta/call.hrx | 2 +- spec/core_functions/meta/keywords.hrx | 2 +- spec/core_functions/modules/color.hrx | 2 +- spec/core_functions/selector/parse/error.hrx | 6 +- spec/core_functions/string/quote.hrx | 2 +- spec/libsass-closed-issues/issue_1101.hrx | 5 + spec/libsass-closed-issues/issue_1285.hrx | 20 + spec/libsass-closed-issues/issue_2374.hrx | 85 +- spec/libsass-closed-issues/issue_238760.hrx | 2 +- spec/libsass-closed-issues/issue_2462.hrx | 5 + spec/libsass-closed-issues/issue_2472.hrx | 15 +- spec/libsass-todo-issues/issue_2818.hrx | 2 +- spec/libsass/bourbon.hrx | 4 +- .../color-functions/other/change-color/h.hrx | 542 +++++------ .../color-functions/other/change-color/l.hrx | 104 ++ .../color-functions/other/change-color/s.hrx | 105 ++ spec/libsass/color-functions/rgb/rgb/b.hrx | 198 ++-- spec/libsass/color-functions/rgb/rgb/g.hrx | 198 ++-- spec/libsass/color-functions/rgb/rgb/r.hrx | 198 ++-- spec/libsass/color-functions/rgb/rgba/b.hrx | 198 ++-- spec/libsass/color-functions/rgb/rgba/g.hrx | 198 ++-- spec/libsass/color-functions/rgb/rgba/r.hrx | 198 ++-- spec/libsass/color-functions/saturate.hrx | 103 ++ spec/libsass/test.hrx | 2 +- spec/non_conformant/colors/basic.hrx | 2 +- spec/non_conformant/colors/change-color.hrx | 8 + .../errors/fn-change-color-1.hrx | 4 +- spec/values/calculation/calc/error/value.hrx | 4 +- test/cli-args.test.ts | 4 +- test/compiler.test.ts | 2 +- test/fixtures/mock-compiler.ts | 4 +- test/interactor/loop.test.ts | 6 +- test/interactor/options.test.ts | 4 +- test/spec-directory/cleanup.test.ts | 2 +- test/spec-directory/hrx.test.ts | 4 +- test/spec-directory/iteration.test.ts | 2 +- test/spec-directory/mutations.test.ts | 2 +- test/spec-directory/options.test.ts | 2 +- test/spot-check.test.ts | 2 +- test/test-case/actual.test.ts | 6 +- test/test-case/compare.test.ts | 2 +- test/test-case/expected.test.ts | 4 +- test/test-case/mutation.test.ts | 4 +- test/test-case/result.test.ts | 4 +- tests/cli_spec.rb | 38 - tests/directory_spec.rb | 900 ------------------ tests/fixtures/basic/basic.hrx | 9 - tests/fixtures/limit/basic.hrx | 51 - tests/fixtures/todo/basic.hrx | 29 - tests/sass_stub | 16 - tests/spec_helper.rb | 62 -- tests/test_case_metadata_spec.rb | 101 -- tsconfig.json | 2 +- 149 files changed, 2332 insertions(+), 4824 deletions(-) delete mode 100644 Gemfile delete mode 100644 Gemfile.lock rename {lib-js => lib}/cli-args.ts (100%) rename {lib-js => lib}/compiler.ts (99%) rename {lib-js => lib}/interactor.ts (100%) rename {lib-js => lib}/lint-reporter.ts (100%) delete mode 100644 lib/sass_spec.rb delete mode 100644 lib/sass_spec/annotate.rb delete mode 100644 lib/sass_spec/annotate/cli.rb delete mode 100644 lib/sass_spec/capture_with_timeout.rb delete mode 100644 lib/sass_spec/cli.rb delete mode 100644 lib/sass_spec/directory.rb delete mode 100644 lib/sass_spec/engine_adapter.rb delete mode 100644 lib/sass_spec/interactor.rb delete mode 100644 lib/sass_spec/runner.rb delete mode 100644 lib/sass_spec/test.rb delete mode 100644 lib/sass_spec/test_case.rb delete mode 100644 lib/sass_spec/test_case_metadata.rb delete mode 100644 lib/sass_spec/util.rb delete mode 100644 lib/sass_spec/version.rb rename {lib-js => lib}/spec-directory/cleanup.ts (100%) rename {lib-js => lib}/spec-directory/hrx.ts (100%) rename {lib-js => lib}/spec-directory/index.ts (100%) rename {lib-js => lib}/spec-directory/options.ts (100%) rename {lib-js => lib}/spec-directory/real-directory.ts (100%) rename {lib-js => lib}/spec-directory/spec-directory.ts (100%) rename {lib-js => lib}/spec-directory/spec-path.ts (100%) rename {lib-js => lib}/spec-directory/virtual-directory.ts (100%) rename {lib-js => lib}/tabulator.ts (100%) rename {lib-js => lib}/test-case/compare.ts (100%) rename {lib-js => lib}/test-case/expected.ts (100%) rename {lib-js => lib}/test-case/index.ts (100%) rename {lib-js => lib}/test-case/test-case.ts (100%) rename {lib-js => lib}/test-case/util.ts (100%) delete mode 100755 sass-spec.rb delete mode 100644 tests/cli_spec.rb delete mode 100644 tests/directory_spec.rb delete mode 100644 tests/fixtures/basic/basic.hrx delete mode 100644 tests/fixtures/limit/basic.hrx delete mode 100644 tests/fixtures/todo/basic.hrx delete mode 100755 tests/sass_stub delete mode 100644 tests/spec_helper.rb delete mode 100644 tests/test_case_metadata_spec.rb diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 7ec8be5099..77a214fd37 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -12,19 +12,8 @@ on: pull_request: jobs: - unit_tests_rb: - name: "Unit tests | Ruby" - runs-on: ubuntu-latest - - steps: - - uses: actions/checkout@v2 - - uses: ruby/setup-ruby@v1 - with: {bundler-cache: true} - - name: Run tests - run: bundle exec rspec tests/ - - unit_tests_ts: - name: "Unit tests | Typescript" + unit_tests: + name: "Unit tests" runs-on: ubuntu-latest steps: @@ -59,17 +48,21 @@ jobs: - run: npm run lint-spec dart_sass_language: - name: "Language | Dart Sass" + name: "Language | Dart Sass | Dart ${{ matrix.dart_channel }}" runs-on: ubuntu-latest if: "github.event_name != 'pull_request' || !contains(github.event.pull_request.body, 'skip dart-sass')" + strategy: + matrix: + dart_channel: [stable, dev] + steps: - uses: actions/checkout@v2 - uses: actions/setup-node@v2 with: {node-version: "${{ env.NODE_VERSION }}"} - run: npm install - uses: dart-lang/setup-dart@v1 - with: {sdk: stable} + with: {sdk: "${{ matrix.dart_channel }}"} - name: Install dart-sass run: | @@ -164,7 +157,10 @@ jobs: js_api_sass_embedded: name: "JS API | sass-embedded | Node ${{ matrix.node_version }} | ${{ matrix.os }}" runs-on: "${{ matrix.os }}" - if: "github.event_name != 'pull_request' || !contains(github.event.pull_request.body, 'skip sass-embedded')" + if: >- + github.event_name != 'pull_request' || + (!contains(github.event.pull_request.body, 'skip sass-embedded') && + !contains(github.event.pull_request.body, 'skip dart-sass')) strategy: fail-fast: false diff --git a/Gemfile b/Gemfile deleted file mode 100644 index 13c6c6cbf0..0000000000 --- a/Gemfile +++ /dev/null @@ -1,15 +0,0 @@ -source 'https://rubygems.org' - -require 'pp' # https://github.com/fakefs/fakefs#fakefs-----typeerror-superclass-mismatch-for-class-file - -gem "minitest", "~> 5.8" -gem "command_line_reporter", '~> 3.0' -gem "ruby-terminfo", '~> 0.1.1' -gem "diffy", '~> 3.4' -gem "hrx", '~> 1.0' - -gem 'rspec' -gem 'aruba' -gem 'fakefs' - - diff --git a/Gemfile.lock b/Gemfile.lock deleted file mode 100644 index cbbd714862..0000000000 --- a/Gemfile.lock +++ /dev/null @@ -1,106 +0,0 @@ -GEM - remote: https://rubygems.org/ - specs: - activesupport (7.0.3.1) - concurrent-ruby (~> 1.0, >= 1.0.2) - i18n (>= 1.6, < 2) - minitest (>= 5.1) - tzinfo (~> 2.0) - aruba (1.0.1) - childprocess (~> 3.0) - contracts (~> 0.16.0) - cucumber (>= 2.4, < 5.0) - ffi (~> 1.9) - rspec-expectations (~> 3.4) - thor (~> 1.0) - builder (3.2.4) - childprocess (3.0.0) - colored (1.2) - command_line_reporter (3.3.6) - colored (>= 1.2) - concurrent-ruby (1.1.10) - contracts (0.16.0) - cucumber (4.1.0) - builder (~> 3.2, >= 3.2.3) - cucumber-core (~> 7.1, >= 7.1.0) - cucumber-create-meta (~> 1.0.0, >= 1.0.0) - cucumber-cucumber-expressions (~> 10.1, >= 10.1.0) - cucumber-gherkin (~> 14.0, >= 14.0.1) - cucumber-html-formatter (~> 7.0, >= 7.0.0) - cucumber-messages (~> 12.2, >= 12.2.0) - cucumber-wire (~> 3.1, >= 3.1.0) - diff-lcs (~> 1.3, >= 1.3, < 1.4) - multi_test (~> 0.1, >= 0.1.2) - sys-uname (~> 1.0, >= 1.0.2) - cucumber-core (7.1.0) - cucumber-gherkin (~> 14.0, >= 14.0.1) - cucumber-messages (~> 12.2, >= 12.2.0) - cucumber-tag-expressions (~> 2.0, >= 2.0.4) - cucumber-create-meta (1.0.0) - cucumber-messages (~> 12.2, >= 12.2.0) - sys-uname (~> 1.2, >= 1.2.1) - cucumber-cucumber-expressions (10.3.0) - cucumber-gherkin (14.2.0) - cucumber-messages (~> 12.4, >= 12.4.0) - cucumber-html-formatter (7.2.0) - cucumber-messages (~> 12.4, >= 12.4.0) - cucumber-messages (12.4.0) - protobuf-cucumber (~> 3.10, >= 3.10.8) - cucumber-tag-expressions (2.0.4) - cucumber-wire (3.1.0) - cucumber-core (~> 7.1, >= 7.1.0) - cucumber-cucumber-expressions (~> 10.1, >= 10.1.0) - cucumber-messages (~> 12.2, >= 12.2.0) - diff-lcs (1.3) - diffy (3.4.1) - fakefs (1.2.2) - ffi (1.15.5) - hrx (1.0.0) - linked-list (~> 0.0.13) - i18n (1.12.0) - concurrent-ruby (~> 1.0) - linked-list (0.0.13) - middleware (0.1.0) - minitest (5.11.3) - multi_test (0.1.2) - protobuf-cucumber (3.10.8) - activesupport (>= 3.2) - middleware - thor - thread_safe - rspec (3.8.0) - rspec-core (~> 3.8.0) - rspec-expectations (~> 3.8.0) - rspec-mocks (~> 3.8.0) - rspec-core (3.8.2) - rspec-support (~> 3.8.0) - rspec-expectations (3.8.6) - diff-lcs (>= 1.2.0, < 2.0) - rspec-support (~> 3.8.0) - rspec-mocks (3.8.1) - diff-lcs (>= 1.2.0, < 2.0) - rspec-support (~> 3.8.0) - rspec-support (3.8.3) - ruby-terminfo (0.1.1) - sys-uname (1.2.2) - ffi (~> 1.1) - thor (1.2.1) - thread_safe (0.3.6) - tzinfo (2.0.5) - concurrent-ruby (~> 1.0) - -PLATFORMS - ruby - -DEPENDENCIES - aruba - command_line_reporter (~> 3.0) - diffy (~> 3.4) - fakefs - hrx (~> 1.0) - minitest (~> 5.8) - rspec - ruby-terminfo (~> 0.1.1) - -BUNDLED WITH - 2.1.2 diff --git a/js-api-spec/value/color.test.ts b/js-api-spec/value/color.test.ts index 919be53009..8b8342eb6e 100644 --- a/js-api-spec/value/color.test.ts +++ b/js-api-spec/value/color.test.ts @@ -69,7 +69,8 @@ describe('SassColor', () => { expect(() => rgb(255, 255, 255, 1)).not.toThrow(); }); - it('disallows invalid values', () => { + // TODO(#1828): Update these expectations + it.skip('disallows invalid values', () => { expect(() => rgb(-1, 0, 0, 0)).toThrow(); expect(() => rgb(0, -1, 0, 0)).toThrow(); expect(() => rgb(0, 0, -1, 0)).toThrow(); @@ -80,7 +81,8 @@ describe('SassColor', () => { expect(() => rgb(0, 0, 0, 1.1)).toThrow(); }); - it('rounds channels to the nearest integer', () => { + // TODO(#1828): Update these expectations + it.skip('rounds channels to the nearest integer', () => { expect(rgb(0.1, 50.4, 90.3)).toEqualWithHash(rgb(0, 50, 90)); expect(rgb(-0.1, 50.5, 90.7)).toEqualWithHash(rgb(0, 51, 91)); }); @@ -178,15 +180,16 @@ describe('SassColor', () => { it('has HWB channels', () => { expect(color.hue).toBe(120); - expect(color.whiteness).toBe(24.313725490196077); - expect(color.blackness).toBe(40.3921568627451); + expect(color.whiteness).toBe(24.360000000000003); + expect(color.blackness).toBe(40.36000000000001); }); it('has an alpha channel', () => { expect(color.alpha).toBe(1); }); - it('equals the same color', () => { + // TODO(#1828): Update these expectations + it.skip('equals the same color', () => { expect(color).toEqualWithHash(rgb(62, 152, 62)); expect(color).toEqualWithHash(hsl(120, 42, 42)); expect(color).toEqualWithHash( @@ -214,21 +217,22 @@ describe('SassColor', () => { it('has HSL channels', () => { expect(color.hue).toBe(120); - expect(color.saturation).toBe(16.078431372549026); + expect(color.saturation).toBe(16.000000000000007); expect(color.lightness).toBe(50); }); it('has HWB channels', () => { expect(color.hue).toBe(120); - expect(color.whiteness).toBe(41.96078431372549); - expect(color.blackness).toBe(41.96078431372548); + expect(color.whiteness).toBe(42); + expect(color.blackness).toBe(42); }); it('has an alpha channel', () => { expect(color.alpha).toBe(1); }); - it('equals the same color', () => { + // TODO(#1828): Update these expectations + it.skip('equals the same color', () => { expect(color).toEqualWithHash(rgb(107, 148, 107)); expect(color).toEqualWithHash(hsl(120, 16.078431372549026, 50)); expect(color).toEqualWithHash( @@ -272,7 +276,8 @@ describe('SassColor', () => { expect(color.change({alpha: 1}).alpha).toBe(1); }); - it('disallows invalid values', () => { + // TODO(#1828): Update these expectations + it.skip('disallows invalid values', () => { expect(() => color.change({red: -1})).toThrow(); expect(() => color.change({red: 256})).toThrow(); expect(() => color.change({green: -1})).toThrow(); @@ -283,7 +288,8 @@ describe('SassColor', () => { expect(() => color.change({alpha: 1.1})).toThrow(); }); - it('rounds channels to the nearest integer', () => { + // TODO(#1828): Update these expectations + it.skip('rounds channels to the nearest integer', () => { expect( color.change({red: 0.1, green: 50.4, blue: 90.3}) ).toEqualWithHash(rgb(0, 50, 90)); @@ -371,11 +377,11 @@ describe('SassColor', () => { it('allows valid values', () => { expect(color.change({whiteness: 0}).whiteness).toBe(0); - expect(color.change({whiteness: 100}).whiteness).toBe(60.0); - expect(color.change({blackness: 0}).blackness).toBe(0); - expect(color.change({blackness: 100}).blackness).toBe( - 93.33333333333333 + expect(color.change({whiteness: 100}).whiteness).toBe( + 60.141509433962256 ); + expect(color.change({blackness: 0}).blackness).toBe(0); + expect(color.change({blackness: 100}).blackness).toBe(93.4065934065934); expect(color.change({alpha: 0}).alpha).toBe(0); expect(color.change({alpha: 1}).alpha).toBe(1); }); diff --git a/lib-js/cli-args.ts b/lib/cli-args.ts similarity index 100% rename from lib-js/cli-args.ts rename to lib/cli-args.ts diff --git a/lib-js/compiler.ts b/lib/compiler.ts similarity index 99% rename from lib-js/compiler.ts rename to lib/compiler.ts index c03c8c22c4..a35a466a16 100644 --- a/lib-js/compiler.ts +++ b/lib/compiler.ts @@ -116,7 +116,6 @@ export class DartCompiler implements Compiler { throw new Error(`${repoPath} is not a valid Dart Sass repository`); } const dartFile = ` -// @dart=2.9 import "dart:convert"; import "dart:io"; diff --git a/lib-js/interactor.ts b/lib/interactor.ts similarity index 100% rename from lib-js/interactor.ts rename to lib/interactor.ts diff --git a/lib-js/lint-reporter.ts b/lib/lint-reporter.ts similarity index 100% rename from lib-js/lint-reporter.ts rename to lib/lint-reporter.ts diff --git a/lib/sass_spec.rb b/lib/sass_spec.rb deleted file mode 100644 index 92b579cccb..0000000000 --- a/lib/sass_spec.rb +++ /dev/null @@ -1,18 +0,0 @@ -require 'rubygems/version' - -module SassSpec - SPEC_DIR = File.expand_path('../../spec', __FILE__) - LANGUAGE_VERSIONS = %w( - 3.5 - 3.6 - 3.7 - 3.8 - 4.0 - ) - MIN_LANGUAGE_VERSION = Gem::Version.new(LANGUAGE_VERSIONS.first) - MAX_LANGUAGE_VERSION = Gem::Version.new(LANGUAGE_VERSIONS.last) -end - -require_relative 'sass_spec/test_case_metadata' -require_relative 'sass_spec/cli' -require_relative 'sass_spec/runner' diff --git a/lib/sass_spec/annotate.rb b/lib/sass_spec/annotate.rb deleted file mode 100644 index 69dbe471aa..0000000000 --- a/lib/sass_spec/annotate.rb +++ /dev/null @@ -1,6 +0,0 @@ -module SassSpec - module Annotate - end -end - -require_relative "annotate/cli" diff --git a/lib/sass_spec/annotate/cli.rb b/lib/sass_spec/annotate/cli.rb deleted file mode 100644 index 361b84c78f..0000000000 --- a/lib/sass_spec/annotate/cli.rb +++ /dev/null @@ -1,240 +0,0 @@ -# encoding: utf-8 -require 'set' -require 'yaml' -require 'command_line_reporter' - -require_relative 'directory' - -class SassSpec::Annotate::CLI - include CommandLineReporter - - def self.assert_legal_version(version) - if version && !SassSpec::LANGUAGE_VERSIONS.include?(version) - warn "Version #{version} is not valid. " + - "Did you mean one of: #{SassSpec::LANGUAGE_VERSIONS.join(', ')}" - return false - end - true - end - - def self.assert_not_file!(string, expected) - if File.exist?(string) || string.include?(File::SEPARATOR) - warn "Expected #{expected} but got a file path. Did you forget the argument?" - return false - end - true - end - - def self.parse(args) - runner_options = { - } - options = { - } - parser = OptionParser.new do |opts| - opts.banner = < PID of the command, -# :status => Process::Status of the command, -# :stdout => the standard output of the command, -# :stderr => the standard error of the command, -# :timeout => whether the command was timed out, -# } -module CaptureWithTimeout - def capture3_with_timeout(*cmd) - spawn_opts = Hash === cmd.last ? cmd.pop.dup : {} - opts = { - :stdin_data => spawn_opts.delete(:stdin_data) || "", - :binmode => spawn_opts.delete(:binmode) || false, - :timeout => spawn_opts.delete(:timeout), - :signal => spawn_opts.delete(:signal) || "TERM", - :kill_after => spawn_opts.delete(:kill_after), - } - - in_r, in_w = IO.pipe - out_r, out_w = IO.pipe - err_r, err_w = IO.pipe - in_w.sync = true - - if opts[:binmode] - in_w.binmode - out_r.binmode - err_r.binmode - end - - spawn_opts[:in] = in_r - spawn_opts[:out] = out_w - spawn_opts[:err] = err_w - - result = { - :pid => nil, - :status => nil, - :stdout => nil, - :stderr => nil, - :timeout => false, - } - - out_reader = nil - err_reader = nil - wait_thr = nil - - begin - Timeout.timeout(opts[:timeout]) do - result[:pid] = spawn(*cmd, spawn_opts) - wait_thr = Process.detach(result[:pid]) - in_r.close - out_w.close - err_w.close - - out_reader = Thread.new { out_r.read } - err_reader = Thread.new { err_r.read } - - in_w.write opts[:stdin_data] - in_w.close - - result[:status] = wait_thr.value - end - rescue Timeout::Error - result[:timeout] = true - pid = spawn_opts[:pgroup] ? -result[:pid] : result[:pid] - Process.kill(opts[:signal], pid) - if opts[:kill_after] - unless wait_thr.join(opts[:kill_after]) - Process.kill("KILL", pid) - end - end - ensure - result[:status] = wait_thr.value if wait_thr - result[:stdout] = out_reader.value if out_reader - result[:stderr] = err_reader.value if err_reader - out_r.close unless out_r.closed? - err_r.close unless err_r.closed? - end - - result - end -end diff --git a/lib/sass_spec/cli.rb b/lib/sass_spec/cli.rb deleted file mode 100644 index ffe9ab346e..0000000000 --- a/lib/sass_spec/cli.rb +++ /dev/null @@ -1,121 +0,0 @@ -require_relative 'engine_adapter' - -module SassSpec::CLI - require 'optparse' - - def self.parse - options = { - engine_adapter: nil, - spec_directory: nil, - generate: false, - tap: false, - skip: false, - verbose: false, - filter: "", - implementation: 'sass' - } - - OptionParser.new do |opts| - opts.banner = "Usage: ./sass-spec.rb [options] [spec_directory...] - -Examples: - Run `sassc --style compressed input.scss`: - ./sass-spec.rb -c 'sass --style compressed' - - Run tests only in the spec/basic folder: - ./sass-spec.rb spec/basic - -This script will search for all files under the spec (or specified) directory -that are named input.scss. It will then run a specified binary and check that -the output matches the expected output. If you want set up your own test suite, -follow a similar hierarchy as described in the initial comment of this script -for your test hierarchy. - -This command can also be used to annotate tests to control which tests are ran -and when. For details: ./sass-spec.rb annotate -h - -Make sure the command you provide prints to stdout. - -" - - opts.on("-v", "--verbose", "Run verbosely") do - options[:verbose] = true - end - - opts.on("-t", "--tap", "Output TAP compatible report") do - options[:tap] = true - end - - opts.on("-c", "--command COMMAND", "Sets a specific binary to run") do |v| - options[:engine_adapter] = ExecutableEngineAdapter.new(v) - options[:engine_adapter].args = options[:cmd_args] - end - - opts.on("--dart PATH", "Run Dart Sass, whose repo should be at the given path.") do |path| - options[:engine_adapter] = DartEngineAdapter.new(path) - options[:engine_adapter].args = options[:cmd_args] - end - - opts.on("--cmd-args ARGS", "Pass ARGS to command or Dart Sass.") do |args| - if (adapter = options[:engine_adapter]) && adapter.is_a?(DartEngineAdapter) - adapter.args = args - elsif (adapter = options[:engine_adapter]) && adapter.is_a?(ExecutableEngineAdapter) - adapter.args = args - else - options[:cmd_args] = args - end - end - - opts.on("-g", "--generate", "Run test(s) and generate expected output file(s).") do - options[:generate] = true - end - - opts.on("--run-todo", "Run any tests marked as todo. Defaults to false.") do - options[:run_todo] = true - end - - opts.on("--probe-todo", "Run and report tests marked as todo that unexpectedly pass. Defaults to false.") do - options[:probe_todo] = options[:run_todo] = true - end - - opts.on("--impl NAME", "Sets the name of the implementation being tested. Defaults to 'sass'") do |name| - options[:implementation] = name - end - - opts.on("--filter PATTERN", "Run tests that match the pattern you provide") do |pattern| - options[:filter] = pattern - end - - opts.on("--limit NUMBER", "Limit the number of tests run to this positive integer.") do |limit| - raise "--limit must receive a positive integer" if limit.to_i < 0 - options[:limit] = limit.to_i - end - - opts.on("--migrate-impl", "Copy tests that fail and make them pass for the current implementation.") do - options[:migrate_impl] = true - end - - opts.on("--silent", "Don't show any logs") do - options[:silent] = true - end - - opts.on("--check-annotations", "Check if any test annotations are unnecessary.") do - options[:check_annotations] = true - end - - opts.on("--interactive", "When a test fails, enter into a dialog for how to handle it.") do - options[:interactive] = true - end - end.parse! - - raise "Must specify either --dart or --command." if options[:engine_adapter].nil? - - options[:spec_dirs_to_run] = ARGV.dup.map{|d| File.expand_path(d)} if ARGV.any? - - if options[:implementation] && options[:engine_adapter].respond_to?(:set_description) - options[:engine_adapter].set_description(options[:implementation]) - end - - options - end -end diff --git a/lib/sass_spec/directory.rb b/lib/sass_spec/directory.rb deleted file mode 100644 index 8ad68cc56a..0000000000 --- a/lib/sass_spec/directory.rb +++ /dev/null @@ -1,273 +0,0 @@ -require 'fileutils' -require 'hrx' -require 'pathname' -require 'set' - -require_relative 'util' - -# A directory that may represent either a physical directory on disk or a -# directory within an HRX::Archive. -class SassSpec::Directory - # A cache of parsed HRX files, indexed by their corresponding directory paths. - def self._hrx_cache - @hrx_cache ||= {} - end - - # The directory's path, possibly including components within an HRX file. - attr_reader :path - - # Returns whether this is a virtual HRX directory. - def hrx? - !!@archive - end - - # Creates a Directory from a `path`, which may go into an HRX file. For - # example, if `path` is `path/to/archive/subdir` and `path/to/archive.hrx` - # exists, this will load `subdir` from within `path/to/archive.hrx`. - def initialize(path) - @path = Pathname.new(path) - @path = @path.relative_path_from(Pathname.new(Dir.pwd)) if @path.absolute? - - # Always use forward slashes on Windows, because HRX requires them. - @path = Pathname.new(@path.to_s.gsub(/\\/, '/')) if Gem.win_platform? - - if %w[.. .].include?(@path.each_filename.first) - raise ArgumentError.new("#{path} must be beneath the working directory") - end - - return if Dir.exist?(@path) - - SassSpec::Util.each_directory(@path).with_index do |dir, i| - archive_path = dir + ".hrx" - if self.class._hrx_cache[dir] || File.exist?(archive_path) - @parent_archive_path = archive_path - @parent_archive = self.class._hrx_cache[dir] ||= HRX::Archive.load(archive_path) - - @path_in_parent = @path.each_filename.drop(i + 1).join("/") - @archive = - if @path_in_parent.empty? - @parent_archive - else - @parent_archive.child_archive(@path_in_parent) - end - - return - end - end - - raise ArgumentError.new("#{path} doesn't exist") - end - - # Returns the parent as a SassSpec::Directory, or `nil` if this is the root - # spec directory. - def parent - dirname = File.dirname(@path) - dirname == "." ? nil : SassSpec::Directory.new(dirname) - end - - # Returns a list of all files in this directory that match `pattern`, relative - # to the directory root. - # - # This includes files within HRX files in this directory. - def glob(pattern) - if hrx? - @archive.glob(pattern).select {|e| e.is_a?(HRX::File)}.map(&:path) - else - recursive = pattern.include?("**") - physical_pattern = - if recursive - "{#{File.join(@path, pattern)},#{File.join(@path, '**/*.hrx')}}" - else - File.join(@path, pattern) - end - - seen = Set.new - Dir.glob(physical_pattern, File::FNM_EXTGLOB).flat_map do |path| - # Dir.glob() can emit the same path multiple times if multiple `{}` - # patterns cover it. - next [] if seen.include?(path) - seen << path - - next [] if Dir.exists?(path) - - absolute = Pathname.new(path).expand_path - relative = absolute.relative_path_from(@path.expand_path).to_s - next relative unless path.end_with?(".hrx") - next [] unless recursive - - dir = path[0...-".hrx".length] - relative_dir = relative[0...-".hrx".length] - archive = self.class._hrx_cache[dir] ||= HRX::Archive.load(path) - archive.glob(pattern).map {|inner| "#{relative_dir}/#{inner.path}"} - end - end - end - - # Returns whether a file exists at `path` within this directory. - def file?(path) - if hrx? - @archive[path].is_a?(HRX::File) - elsif (dir, basename = split_if_nested(path)) - dir.file?(basename) - else - File.file?(File.join(@path, path)) - end - rescue ArgumentError, HRX::Error - # If we get a directory-doesn't-exist error for a nested directory, return - # false. This could catch unrelated errors, but it's probably not likely - # enough to be worth creating a custom exception class. - return false - end - - # Reads the file at `path` within this directory. - def read(path) - if hrx? - @archive.read(path) - elsif (dir, basename = split_if_nested(path)) - dir.read(basename) - else - File.read(File.join(@path, path), binmode: true, encoding: "ASCII-8BIT") - end - end - - # Writes `contents` to `path` within this directory. - def write(path, contents) - if hrx? - @archive.write(path, contents, comment: :copy) - _write! - elsif (dir, basename = split_if_nested(path)) - dir.write(basename, contents) - else - File.write(File.join(@path, path), contents, binmode: true) - end - end - - # Deletes the file at `path` within this directory. - # - # If `if_exists` is `true`, don't throw an error if the file doesn't exist. - def delete(path, if_exists: false) - return if if_exists && !file?(path) - if hrx? - @archive.delete(path) - _write! - elsif (dir, basename = split_if_nested(path)) - dir.delete(basename, if_exists: if_exists) - else - File.unlink(File.join(@path, path)) - end - end - - # Renames the file at `old` to `new`. - def rename(old, new) - old_dir, old_basename = split_if_nested(old) || [self, old] - new_dir, new_basename = split_if_nested(new) || [self, new] - - if old_dir.hrx? && new_dir.hrx? - unless old_file = old_dir.archive[old_basename] - raise "#@path/old doesn't exist" - end - - new_dir.archive.add( - HRX::File.new(new_basename, old_file.content, comment: old_file.comment), - after: new_dir == old_dir ? old_file.path : nil) - new_dir._write! - - old_dir.delete(old_basename) - else - new_dir.write(new_basename, old_dir.read(old_basename)) - old_dir.delete(old_basename) - end - end - - # Deletes this directory and everything it contains. - def delete_dir! - if hrx? - if @parent_archive.equal?(@archive) - _delete_parent! - else - @parent_archive.delete(@path_in_parent, recursive: true) - _write! - end - else - FileUtils.rm_rf(@path) - end - end - - # If this directory refers to an HRX file, runs a block with the archive's - # directory and all its contents physically present on the filesystem next to - # the archive. - # - # If this is a normal directory, runs the block with the filesystem as-is. - def with_real_files - return yield unless @archive - - files = @archive.entries.select {|entry| entry.is_a?(HRX::File)}.to_a - if parent && parent.hrx? && files.any? {|file| _reaches_out?(file)} - return parent.with_real_files {yield} - end - - outermost_new_dir = SassSpec::Util.each_directory(@path).find {|dir| !Dir.exist?(dir)} - - files.each do |file| - path = File.join(@path, file.path) - FileUtils.mkdir_p(File.dirname(path)) - File.write(path, file.content) - end - yield - ensure - FileUtils.rm_rf(outermost_new_dir) if outermost_new_dir - end - - # Returns an HRX representation of this directory. - def to_hrx - archive = HRX::Archive.new - glob("**/*").each do |path| - archive << HRX::File.new("#{self.path}/#{path}", read(path)) - end - archive.to_hrx - end - - def inspect - "#" - end - - def to_s - @path.to_s - end - - protected - - # The directory's underlying HRX archive. `nil` if `hrx?` is `false`. - attr_reader :archive - - # Writes `@parent_archive` to disk. - def _write! - if @parent_archive.entries.empty? - _delete_parent! - else - @parent_archive.write!(@parent_archive_path) - end - end - - private - - # If `path` points to a subdirectory of this directory, returns the nested - # `Directory` object and the basename of the file. Otherwise, returns `nil`. - def split_if_nested(path) - dirname, basename = File.split(path) - dirname == '.' ? nil : [SassSpec::Directory.new(@path.join(dirname)), basename] - end - - # Returns whether `file` contains enough `../` references to reach outside - # this directory. - def _reaches_out?(file) - depth = file.path.count("/") - file.content.scan(%r{(?:\.\./)+}).any? {|match| match.count("/") > depth} - end - - # Deletes `@parent_archive` from disk and from the archive cache. - def _delete_parent! - File.unlink(@parent_archive_path) - self.class._hrx_cache.delete(@parent_archive_path.sub(/\.hrx$/, '')) - end -end diff --git a/lib/sass_spec/engine_adapter.rb b/lib/sass_spec/engine_adapter.rb deleted file mode 100644 index 7f4bf095b4..0000000000 --- a/lib/sass_spec/engine_adapter.rb +++ /dev/null @@ -1,129 +0,0 @@ -require 'open3' -require_relative 'capture_with_timeout' - -class EngineAdapter - - def describe - not_implemented - end - - # Compile a Sass file and return the results - # @return [css_output, std_error, status_code] - def compile(sass_filename, precision) - not_implemented - end - - private - - def not_implemented - raise RuntimeError, "Not yet implemented" - end -end - -class ExecutableEngineAdapter < EngineAdapter - include CaptureWithTimeout - attr_accessor :args - - def initialize(command, description = nil) - @command = command - @timeout = 90 - @description = description || command - @version = `#{@command} --version` - end - - def set_description(description) - @description = description - end - - def describe - @description - end - - def compile(sass_filename, precision) - command = File.absolute_path(@command) - dirname, basename = File.split(sass_filename) - result = capture3_with_timeout( - command, "--precision", precision.to_s, "--style", "expanded", - "-I", File.expand_path("../../../spec", __FILE__), *@args&.split(/\s+/), basename, - binmode: true, timeout: @timeout, chdir: dirname) - - if result[:timeout] - ["", "Execution timed out after #{@timeout}s", -1] - else - [result[:stdout], result[:stderr], result[:status].exitstatus] - end - end - - def to_s - "#{@description} #{@version}" - end -end - -class DartEngineAdapter < EngineAdapter - attr_accessor :args - - def initialize(path) - @path = path - Tempfile.open("dart-sass-spec") do |f| - f.write(<<-DART) - // @dart=2.9 - import "dart:convert"; - import "dart:io"; - - import "#{File.absolute_path @path}/bin/sass.dart" as sass; - - main() async { - await for (var line in new LineSplitter().bind(utf8.decoder.bind(stdin))) { - if (line.startsWith("!cd ")) { - Directory.current = line.substring("!cd ".length); - continue; - } - - try { - await sass.main(line.split(" ").where((arg) => arg.isNotEmpty).toList()); - } catch (error, stackTrace) { - stderr.writeln("Unhandled exception:"); - stderr.writeln(error); - stderr.writeln(stackTrace); - exitCode = 255; - } - - stdout.add([0xFF]); - stdout.write(exitCode); - stdout.add([0xFF]); - stderr.add([0xFF]); - exitCode = 0; - } - } - DART - @stdin, @stdout, @stderr = Open3.popen3("dart --enable-asserts --packages=#{@path}/.packages #{f.path}") - @stdout.set_encoding 'binary' - @stderr.set_encoding 'binary' - end - @version = `dart #{@path}/bin/sass.dart --version` - end - - def describe - "dart-sass" - end - - def compile(sass_filename, precision) - dirname, basename = File.split(sass_filename) - @stdin.puts "!cd #{File.absolute_path(dirname)}" - @stdin.puts("--no-color --no-unicode -I #{File.expand_path("../../../spec", __FILE__)} " + - "#{@args} #{basename}") - [next_chunk(@stdout), next_chunk(@stderr), next_chunk(@stdout).to_i] - end - - def to_s - "Dart Sass #{@version}" - end - - private - - def next_chunk(io) - result = io.gets("\xFF".force_encoding('binary')) - return '' unless result - return result[0...-1] - end -end diff --git a/lib/sass_spec/interactor.rb b/lib/sass_spec/interactor.rb deleted file mode 100644 index 450d529613..0000000000 --- a/lib/sass_spec/interactor.rb +++ /dev/null @@ -1,88 +0,0 @@ -module SassSpec - class Interactor - - class Choice < Struct.new(:shortcut, :message, :block) - def run_block! - block.call if block - end - end - - def initialize(id = nil) - @choices = [] - @choice = nil - @id = id - end - - def prompt(message) - @prompt = message - end - - def choice(shortcut, message, &block) - @choices << Choice.new(shortcut, message, block) - end - - def restart! - @choice = nil - end - - def display_choices!(memory) - puts - puts @prompt if @prompt - @choices.each_with_index do |c, i| - puts "#{c.shortcut}. #{c.message}" - end - if @id && memory - puts "Note: If you end your choice with a ! then next time this happens,\n"+ - "we'll use that option without prompting you.\n" - end - print "Please select an option > " - end - - def run!(memory = nil) - if @id && memory && memory[@id] - @choices.detect{|c| c.shortcut == memory[@id]}.run_block! - return memory[@id] - end - if @choices.size == 0 - raise ArgumentError, "No choices to run." - end - @choice = nil - until @choice - display_choices!(memory) - input = $stdin.gets.strip - puts - - if input && input.end_with?("!") - repeat = true - input.slice!(-1) - end - - @choice = input - if (choice = @choices.find {|c| c.shortcut == @choice}) - choice.run_block! # We run this in the loop so restart! can be invoked. - else - @choice = nil - end - end - @choice # we return the shortcut so re-ordering choices doesn't change result - ensure - if @id && memory && repeat && @choice - memory[@id] = @choice - end - end - - def self.interact - interactor = new - yield interactor - interactor.run! - end - - def self.interact_with_memory(memory, id) - interactor = new(id) - yield interactor - interactor.run!(memory) - end - end -end - - diff --git a/lib/sass_spec/runner.rb b/lib/sass_spec/runner.rb deleted file mode 100644 index b88489c617..0000000000 --- a/lib/sass_spec/runner.rb +++ /dev/null @@ -1,108 +0,0 @@ -require 'minitest' - -require_relative 'test' -require_relative 'test_case' -require_relative 'directory' - -class SassSpec::Runner - - def initialize(options = {}) - @options = options - end - - def get_input_dirs - (@options[:spec_dirs_to_run] || [SassSpec::SPEC_DIR]).map do |d| - dir = - # If the user passes a directory, use that. If it fails, they may have - # passed a file *in* a directory, so try using the parent. If *that* - # fails, raise the original error. - begin - SassSpec::Directory.new(d) - rescue => e - begin - SassSpec::Directory.new(File.dirname(d)) - rescue - raise e - end - end - end - end - - def get_input_files - get_input_dirs.flat_map do |dir| - dir.glob("**/input.s[ac]ss").map {|f| File.join(dir.path, f)} - end.uniq - end - - def run - unless @options[:silent] || @options[:tap] - puts "Recursively searching under #{get_input_dirs.join(", ")} for test files to test #{@options[:engine_adapter]}." - end - - test_cases = _get_cases - SassSpec::Test.create_tests(test_cases, @options) - - minioptions = [] - if @options[:verbose] - minioptions.push '--verbose' - end - - if @options[:tap] - require 'minitap' - Minitest.reporter = Minitap::TapY - end - - result = Minitest.run(minioptions) - - if @options[:run_todo] - passing = [] - test_cases.each do |test_case| - if test_case.todo? && test_case.result? - passing << test_case.dir.to_s - end - end - if !passing.empty? - puts "The following tests pass but were marked as TODO for #{@options[:engine_adapter].describe}:" - puts passing.join("\n") - else - puts "Note: All tests marked as TODO for #{@options[:engine_adapter].describe} are still failing." - end - end - - result - end - - def impl - @options[:engine_adapter].describe - end - - def _get_cases - cases = [] - get_input_files().each do |filename| - dir = SassSpec::Directory.new(File.dirname(filename)) - metadata = SassSpec::TestCaseMetadata.new(dir) - - unless metadata.valid_for_impl?(impl) - if @options[:verbose] - warn "#{metadata.name} does not apply to #{impl}" - end - next - end - - next unless filename.include?(@options[:filter] || "") - - test_case = SassSpec::TestCase.new(dir, @options[:engine_adapter].describe) - - # unless File.exist?(test_case.expected_path) - # if @options[:verbose] - # warn "Expected output file missing. Skipping #{test_case.name}." - # end - # next - # end - - cases.push(test_case) - end - cases - end - -end diff --git a/lib/sass_spec/test.rb b/lib/sass_spec/test.rb deleted file mode 100644 index ff4e1b93f5..0000000000 --- a/lib/sass_spec/test.rb +++ /dev/null @@ -1,659 +0,0 @@ -require 'minitest' -require 'thread' -require 'fileutils' -require 'yaml' -require_relative "interactor" -require_relative "util" - -# Holder to put and run test cases -class SassSpec::Test < Minitest::Test - def self.create_tests(test_cases, options = {}) - options[:limit] ||= test_cases.length + 1 - test_cases[0...options[:limit]].each do |test_case| - define_method("test__#{test_case.name}") do - runner = SassSpecRunner.new(test_case, options) - test_case.finalize(runner.run) - self.assertions += runner.assertions - end - end - end -end - -class SassSpecRunner - include MiniTest::Assertions - - attr_accessor :assertions - - @@interaction_memory = {} - - def initialize(test_case, options = {}) - @assertions = 0 - @test_case = test_case - @options = options - end - - def run - if @test_case.todo? && !@options[:run_todo] - skip "Skipped #{@test_case.name}" - end - - unless @test_case.dir.hrx? - @test_case.dir.glob("*").each {|p| assert_filename_length!(File.join(@test_case.dir.path, p))} - end - - @output, @error, @status = @test_case.run(@options[:engine_adapter]) - @output = @output.gsub(/\r\n/, "\n") - @normalized_output = SassSpec::Util.normalize_output(@output) - @error = SassSpec::Util.normalize_error(@error) - - if @options[:generate] - overwrite_test! - return true - end - - # Allow checks to throw `:done` to indicate that no more checks need to be - # performed. We throw rather than returning a boolean so that we can do - # checks in nested functions without worrying about piping return values. - catch :done do - check_annotations! - handle_conflicting_files! - handle_missing_output! - handle_unexpected_error! - handle_unexpected_pass! - handle_output_difference! - - # Run these checks last because `handle_stderr_difference!` can skip the - # test if `@test_case.warning_todo?` is set, and we only want to check for - # an unnecessary TODO if the test isn't skipped because of a TODO. - handle_stderr_difference! - handle_unnecessary_todo! - end - - return true - end - - private - - ## Failure handlers - - def check_annotations! - return unless @options[:check_annotations] - - ignored_warning_impls = @test_case.metadata.warnings_ignored_for - - if ignored_warning_impls.any? && @error.empty? - message = "No warning issued, but warnings are ignored for #{ignored_warning_impls.join(', ')}" - choice = interact(:ignore_warning_nonexistant, :fail) do |i| - i.prompt message - - i.choice('R', "Remove ignored status for #{ignored_warning_impls.join(', ')}") do - change_options(remove_ignore_warning_for: ignored_warning_impls) - end - - fail_or_exit_choice(i) - end - - assert choice != :fail, message - end - - todo_warning_impls = @test_case.metadata.all_warning_todos - if todo_warning_impls.any? && @error.length == 0 - message = "No warning issued, but warnings are pending for #{todo_warning_impls.join(', ')}" - choice = interact(:todo_warning_nonexistant, :fail) do |i| - i.prompt message - - i.choice('R', "Remove TODO status for #{todo_warning_impls.join(', ')}") do - change_options(remove_warning_todo: todo_warning_impls) - end - - fail_or_exit_choice(i) - end - - assert choice != :fail, message - end - end - - def handle_conflicting_files! - if @test_case.file?("error", impl: true) - impl = true - elsif @test_case.file?("error") - impl = false - else - return - end - - output_file_exists = @test_case.file?("output.css", impl: impl) - warning_file_exists = @test_case.file?("warning", impl: impl) - return unless output_file_exists || warning_file_exists - - choice = interact(:conflicting_files, :fail) do |i| - i.prompt "Test has both error and success outputs." - - show_test_case_choice(i) - show_output_choice(i) - - delete_choice(i) - - i.choice('S', 'Keep the success output.') do - @test_case.delete("error", impl: :auto) - throw :done - end - - i.choice('E', 'Keep the error output.') do - @test_case.delete("output.css") if output_file_exists - @test_case.delete("warning") if warning_file_exists - throw :done - end - - migrate_warning_choice(i) unless warning_file_exists - update_output_choice(i) - fail_or_exit_choice(i) - end - - assert choice != :fail, "Expected #{@test_case.expected_path} file does not exist" - end - - def handle_missing_output! - return if @test_case.should_fail? || @test_case.expected - - skip_test_case!("TODO test is failing") if probe_todo? - - choice = interact(:missing_output, :fail) do |i| - i.prompt "Expected output file does not exist." - - show_test_case_choice(i) - show_output_choice(i) - delete_choice(i) - update_output_choice(i) - fail_or_exit_choice(i) - end - - assert choice != :fail, "Expected output.css file does not exist" - end - - def handle_unexpected_error! - return if @status == 0 || @test_case.should_fail? - - if !@options[:interactive] && @options[:migrate_impl] - migrate_impl! - throw :done - end - - skip_test_case!("TODO test is failing") if @test_case.todo? - - choice = interact(:unexpected_error, :fail) do |i| - i.prompt "An unexpected compiler error was encountered." - - show_test_case_choice(i) - - i.choice('e', "Show me the error.") do - display_text_block(@error) - i.restart! - end - - update_output_choice(i) - migrate_impl_choice(i) - todo_choice(i) - ignore_choice(i) - fail_or_exit_choice(i) - end - throw :done unless choice == :fail - - assert_equal 0, @status, - "Command `#{@options[:engine_adapter]}` did not complete:\n\n#{@error}" - end - - def handle_unexpected_pass! - return unless @status == 0 && @test_case.should_fail? - - if !@options[:interactive] && @options[:migrate_impl] - migrate_impl! - throw :done - end - - skip_test_case!("TODO test is failing") if probe_todo? - - choice = interact(:unexpected_pass, :fail) do |i| - i.prompt "A failure was expected but it compiled instead." - - show_test_case_choice(i) - - i.choice('o', "Show me the output.") do - display_text_block(@output) - i.restart! - end - - migrate_warning_choice(i) - update_output_choice(i) - migrate_impl_choice(i) - todo_choice(i) - fail_or_exit_choice(i) - end - throw :done unless choice == :fail - - refute_equal @status, 0, "Test case should fail, but it did not" - end - - def handle_output_difference! - return if @test_case.should_fail? || @normalized_output == @test_case.expected - - if !@options[:interactive] && @options[:migrate_impl] - migrate_impl! - throw :done - end - - skip_test_case!("TODO test is failing") if probe_todo? - - interact(:output_difference, :fail) do |i| - i.prompt "Output does not match expectation." - - show_test_case_choice(i) - - i.choice('d', "show diff.") do - require 'diffy' - display_text_block( - Diffy::Diff.new("Expected\n" + @test_case.expected, - "Actual\n" + @normalized_output).to_s(:color)) - i.restart! - end - - update_output_choice(i) - migrate_impl_choice(i) - todo_choice(i) - ignore_choice(i) - fail_or_exit_choice(i) - end - - assert_equal @test_case.expected, @normalized_output, "expected did not match output" - end - - def handle_unnecessary_todo! - return if probe_todo? && !@options[:interactive] - return unless @test_case.todo? || @test_case.warning_todo? - - interact(:unnecessary_todo, :fail) do |i| - i.prompt "Test is passing but marked as TODO." - - show_test_case_choice(i) - - unless @output.empty? - i.choice('o', "Show me the output.") do - display_text_block(@output) - i.restart! - end - end - - i.choice('R', "Remove TODO status for #{@test_case.impl}.") do - change_options(remove_todo: [@test_case.impl], remove_warning_todo: [@test_case.impl]) - throw :done - end - - i.choice('f', "Mark as skipped.") do - skip_test_case!("TODO test is passing") - end - - i.choice('X', "Exit testing.") do - raise Interrupt - end - end - - assert_equal @test_case.expected, @normalized_output, "expected did not match output" - end - - def handle_stderr_difference! - unless @test_case.should_fail? - if @test_case.ignore_warning? - return - elsif @test_case.warning_todo? && !@options[:run_todo] - skip_test_case! "Skipped warning check for #{@test_case.name}" - end - end - - error_msg = extract_error_message(@error) - expected_error_msg = extract_error_message( - @test_case.expected_error || @test_case.expected_warning) - - return if expected_error_msg == error_msg - skip_test_case!("TODO test is failing") if probe_todo? - - message = - if error_msg.empty? - if @test_case.should_fail? - "An error message was expected but wasn't produced." - else - "A warning was expected but wasn't produced." - end - elsif expected_error_msg.empty? - "An unexpected warning was produced." - else - if @test_case.should_fail? - "Error message doesn't match the expected error." - else - "Warning doesn't match the expected warning." - end - end - - type = @test_case.should_fail? ? :expected_error_different : :expected_warning_different - interact(type, :fail) do |i| - i.prompt(message) - - show_test_case_choice(i) - - unless error_msg.empty? - i.choice('e', "Show #{@test_case.should_fail? ? 'error' : 'warning'}.") do - display_text_block(error_msg) - i.restart! - end - end - - i.choice('d', "Show diff.") do - require 'diffy' - display_text_block( - Diffy::Diff.new("Expected\n#{expected_error_msg}", - "Actual\n#{error_msg}").to_s(:color)) - i.restart! - end - - update_output_choice(i) - migrate_impl_choice(i) - todo_warning_choice(i) - ignore_warning_choice(i) - fail_or_exit_choice(i) - end - - assert_equal expected_error_msg, error_msg, message - end - - ## Interaction utilities - - # If the runner is running in interactive mode, runs the interaction defined - # in the block and returns the result. Otherwise, just returns the default - # value. - def interact(prompt_id, default, &block) - if @options[:interactive] - print "\nIn test case: #{@test_case.name}" - return SassSpec::Interactor.interact_with_memory(@@interaction_memory, prompt_id, &block) - else - return default - end - end - - def show_test_case_choice(i) - i.choice('t', "Show me the test case.") do - display_text_block(@test_case.dir.to_hrx) - i.restart! - end - end - - def show_output_choice(i) - if @status == 0 - i.choice('o', "Show me the output generated.") do - display_text_block(@output) - i.restart! - end - - if @error.length > 0 - i.choice('e', "Show me the warning generated.") do - display_text_block(@error) - i.restart! - end - end - else - i.choice('e', "Show me the error generated.") do - display_text_block(@error) - i.restart! - end - end - end - - def migrate_warning_choice(i) - i.choice('W', "Migrate the error to a warning.") do - @test_case.rename("error", "warning") - throw :done - end - end - - def update_output_choice(i) - i.choice('O', "Update expected output and pass test.") do - overwrite_test! - throw :done - end - end - - def migrate_impl_choice(i) - i.choice('I', "Migrate copy of test to pass on #{@test_case.impl}.") do - migrate_impl! || i.restart! - throw :done - end - end - - def todo_choice(i) - return if @test_case.todo? - i.choice('T', "Mark spec as todo for #{@test_case.impl}.") do - change_options(add_todo: [@test_case.impl]) - throw :done - end - end - - def ignore_choice(i) - i.choice('G', "Ignore test for #{@test_case.impl} FOREVER.") do - change_options( - add_ignore_for: [@test_case.impl], - remove_warning_todo: [@test_case.impl], - remove_todo: [@test_case.impl]) - throw :done - end - end - - def delete_choice(i) - i.choice('D', "Delete test.") do - if delete_test! - throw :done - else - i.restart! - end - end - end - - def todo_warning_choice(i) - return if @test_case.warning_todo? - i.choice('T', "Mark warning as todo for #{@test_case.impl}.") do - change_options(add_warning_todo: [@test_case.impl]) - throw :done - end - end - - def ignore_warning_choice(i) - i.choice('G', "Ignore warning for #{@test_case.impl}.") do - change_options(add_ignore_warning_for: [@test_case.impl]) - throw :done - end - end - - def fail_or_exit_choice(i) - i.choice('f', "Mark as failed.") - i.choice('X', "Exit testing.") do - raise Interrupt - end - end - - # Deletes the current test case. - # - # In interactive mode, prompts the user and returns `false` if they decide not - # to delete the test. - def delete_test! - result = interact(:delete_test, :proceed) do |i| - files = @test_case.dir.glob("**/*") - i.prompt("The following files will be removed:\n * " + files.join("\n * ")) - - i.choice('D', "Delete them.") do - @test_case.dir.delete_dir! - end - - i.choice('x', "I changed my mind.") {} - end - result == :proceed || result == "D" - end - - # Adds separate outputs for the test that are compatible with the current - # implementation. - def migrate_impl! - if @status == 0 - if @test_case.expected != @normalized_output || @test_case.should_fail? - @test_case.write("output.css", @output, impl: true) - end - - if extract_error_message(@test_case.expected_warning) != extract_error_message(@error) - @test_case.write("warning", @error, impl: true) - end - else - actual_error = @test_case.expected_error && extract_error_message(@test_case.expected_error) - if actual_error != extract_error_message(@error) - @test_case.write("error", @error, impl: true) - end - end - - change_options(remove_warning_todo: [@test_case.impl], remove_todo: [@test_case.impl]) - end - - ## Other utilities - - # Returns whether the current test case is marked as TODO, but is still being - # run because --probe-todo was passed. These specs shouldn't produce errors - # when they fail. - def probe_todo? - @options[:probe_todo] && (@test_case.todo? || @test_case.warning_todo?) - end - - def skip_test_case!(reason = nil) - msg = "Skipped #{@test_case.name}" - if reason - msg << ": #{reason}" - else - msg << "." - end - skip msg - end - - ANSI_ESCAPES = /[\u001b\u009b][\[()#;?]*(?:[0-9]{1,4}(?:;[0-9]{0,4})*)?[0-9A-ORZcf-nqry=><]/ - def display_text_block(text) - if text.empty? - puts "*" * 20 + " (empty) " + "*" * 20 - return - end - - delim = "*" * text.gsub(ANSI_ESCAPES, '').lines.map{|l| l.rstrip.size}.max - - puts delim - puts text - puts delim - end - - def overwrite_test! - if @status == 0 - @test_case.write("output.css", @output, impl: :auto) - @test_case.delete("error", if_exists: true, impl: :auto) - - if @error.empty? - @test_case.delete("warning", if_exists: true, impl: :auto) - else - @test_case.write("warning", @error, impl: :auto) - end - else - @test_case.write("error", @error, impl: :auto) - @test_case.delete("output.css", if_exists: true, impl: :auto) - @test_case.delete("warning", if_exists: true, impl: :auto) - end - - change_options(remove_warning_todo: [@test_case.impl], remove_todo: [@test_case.impl]) - end - - def change_options(new_options) - existing_options = if @test_case.file?("options.yml") - YAML.load(@test_case.read("options.yml")) - else - {} - end - - existing_options = SassSpec::TestCaseMetadata.merge_options(existing_options, new_options) - - if existing_options.any? - @test_case.write("options.yml", existing_options.to_yaml) - else - @test_case.delete("options.yml", if_exists: true) - end - end - - GEMFILE_PREFIX_LENGTH = 68 - # When running sass-spec as a gem from github very long filenames can cause - # installation issues. This checks that the paths in use will work. - def assert_filename_length!(filename) - name = relative_name = filename.to_s.sub(SassSpec::SPEC_DIR, "") - assert false, "Filename #{name} must no more than #{256 - GEMFILE_PREFIX_LENGTH} characters long" if name.size > (256 - GEMFILE_PREFIX_LENGTH) - - if name.size <= 100 then - prefix = "" - else - parts = name.split(/\//) - newname = parts.pop - nxt = "" - - loop do - nxt = parts.pop - break if newname.size + 1 + nxt.size > 100 - newname = nxt + "/" + newname - end - - prefix = (parts + [nxt]).join "/" - name = newname - - assert false, "base name (#{name}) of #{relative_name} must no more than 100 characters long" if name.size > 100 - assert false, "prefix (#{prefix}) of #{relative_name} must no more than #{155 - GEMFILE_PREFIX_LENGTH} characters long" if prefix.size > (155 - GEMFILE_PREFIX_LENGTH) - end - return nil - end - - def extract_error_message(error) - # We want to make sure dart-sass continues to generate correct stack traces - # and text highlights, so we check its full error messages. - if @options[:engine_adapter].describe == 'dart-sass' - return clean_debug_path(error.rstrip) - end - - error_message = "" - consume_next_line = false - error.each_line do |line| - if consume_next_line - next if line.strip == "" - error_message += line - break - end - if (line =~ /(DEPRECATION )?WARNING/) - if line.rstrip.end_with?(":") - error_message = line.rstrip + "\n" - consume_next_line = true - next - else - error_message = line - break - end - end - if (line =~ /Error:/) - error_message = line - break - end - end - clean_debug_path(error_message.rstrip) - end - - def clean_debug_path(error) - error.gsub(/^.*?(input.scss:\d+ DEBUG:)/, '\1') - .gsub(/\/+/, "/") - .gsub(/^#{Regexp.quote(SassSpec::SPEC_DIR.gsub(/\\/, '\/'))}\//, "/sass/sass-spec/") - .gsub(/^#{Regexp.quote(SassSpec::SPEC_DIR)}\//, "/sass/sass-spec/") - .gsub(/(?:\/todo_|_todo\/)/, "/") - .gsub(/\/libsass\-[a-z]+\-tests\//, "/") - .gsub(/\/libsass\-[a-z]+\-issues/, "/libsass-issues") - .strip - end -end diff --git a/lib/sass_spec/test_case.rb b/lib/sass_spec/test_case.rb deleted file mode 100644 index 19dae3878b..0000000000 --- a/lib/sass_spec/test_case.rb +++ /dev/null @@ -1,196 +0,0 @@ -require 'pathname' -require_relative 'util' - -# This represents a specific test case. -class SassSpec::TestCase - attr_reader :metadata, :dir, :impl - - # The path to the input file for this test case. - # - # Note that this file is not guaranteed to exist on disk, since this test case - # may be loaded from an HRX file. - attr_reader :input_path - - # The Sass or SCSS input for this test case. - attr_reader :input - - # The normalized expected CSS output. This is `nil` if the test is expected to - # fail, or if it's malformed and has no expectations. - attr_reader :expected - - # The normalized expected warning text. This is `nil` if the test is expected - # to fail, or if it's malformed and has no expectations. It's `""` if the test - # is expected to succeed without warnings. - attr_reader :expected_warning - - # The normalized expected error message. This is `nil` if the test is expected - # to succeed, or if it's malformed and has no expectations. - attr_reader :expected_error - - # Returns the test case for the given SassSpec::Directory and implementation - # name. - def initialize(dir, impl) - @dir = dir - @impl = impl - @metadata = SassSpec::TestCaseMetadata.new(dir) - @result = false - - input_files = @dir.glob("input.*") - if input_files.empty? - raise ArgumentError.new("No input file found in #{@dir}") - elsif input_files.size > 1 - raise ArgumentError.new("Multiple input files found in #{@dir}") - end - @input = @dir.read(input_files.first) - - # If there's an impl-specific output file, then this is a success test. - # Otherwise, it's an error test if there's *any* error file, impl-specific - # or otherwise. - if !file?("output.css", impl: true) && file?("error", impl: :auto) - @expected_error = SassSpec::Util.normalize_error(read("error", impl: :auto)) - else - if file?("output.css", impl: :auto) - output = read("output.css", impl: :auto) - # we seem to get CP850 otherwise - # this provokes equal test to fail - output = String.new(output).force_encoding('ASCII-8BIT') - @expected = SassSpec::Util.normalize_output(output) - end - - @expected_warning = - if file?("warning", impl: :auto) - SassSpec::Util.normalize_error(read("warning", impl: :auto)) - else - "" - end - end - end - - def result? - @result - end - - def finalize(result) - @result = result - end - - def name - @metadata.name - end - - def should_fail? - !!expected_error - end - - def todo? - @metadata.todo?(impl) - end - - def warning_todo? - @metadata.warning_todo?(impl) - end - - def ignore? - @metadata.ignore_for?(impl) - end - - def ignore_warning? - @metadata.ignore_warning_for?(impl) - end - - # Returns whether a file exists at `path` within this test case's directory. - # - # If `impl` is `true`, this adds an implementation-specific suffix to the - # path. If `impl` is false (the default), it does not. If `impl` is `:auto`, - # it returns true if either the implementation-specific file or the base file - # exists. - def file?(path, impl: false) - path = _path(path, impl) - path && @dir.file?(path) - end - - # Reads the file at `path` within this test case's directory. - # - # If `impl` is `true`, this adds an implementation-specific suffix to the - # path. If `impl` is false (the default), it does not. If `impl` is `:auto`, - # it returns the contents of implementation-specific file if it exists, or the - # base file if *it* exists, or throws an error if neither exists. - def read(path, impl: false) - unless resolved_path = _path(path, impl) - raise "#@dir/#{path} doesn't exist" - end - - @dir.read(resolved_path) - end - - # Writes `contents` to `path` within this test case's directory. - # - # If `impl` is `true`, this adds an implementation-specific suffix to the - # path. If `impl` is false (the default), it does not. If `impl` is `:auto`, - # it writes to the implementation-specific file if it exists, and the base - # file otherwise. - def write(path, contents, impl: false) - @dir.write(_path(path, impl) || path, contents) - end - - # Deletes the file at `path` within this test case's directory. - # - # If `if_exists` is `true`, don't throw an error if the file doesn't exist. - # - # If `impl` is `true`, this adds an implementation-specific suffix to the - # path. If `impl` is false (the default), it does not. If `impl` is `:auto`, - # it deletes the implementation-specific file if it exists, or the base file - # if *it* exists, or throws an error if neither exists. - def delete(path, if_exists: false, impl: false) - unless resolved_path = _path(path, impl) - return if if_exists - raise "#@dir/#{path} doesn't exist" - end - - @dir.delete(resolved_path, if_exists: if_exists) - end - - # Renames the file at `old` to `new` within this test case's directory. - # - # If `impl` is `true`, this adds an implementation-specific suffix to both - # paths. If `impl` is false (the default), it does not. If `impl` is `:auto`, - # it renames the implementation-specific file if it exists to an - # implementation-specific version of `new`, or the base file if *it* exists to - # `new`, or throws an error if neither exist. - def rename(old, new, impl: false) - unless resolved_old = _path(old, impl) - raise "#@dir/#{old} doesn't exist" - end - - new = _path(new, true) if resolved_old.include?("-#{@impl}") - @dir.rename(resolved_old, new) - end - - # Invokes EngineAdapter#compile on this test case and returns the result. - def run(engine_adapter) - @dir.with_real_files do - engine_adapter.compile( - File.join(@dir.path, @dir.glob("input.*").first), - @metadata.precision || 10) - end - end - - private - - # Returns the path of `path` within `dir`. - # - # If `impl` is `true`, this adds an implementation-specific suffix to the - # path. If `impl` is false (the default), it does not. If `impl` is `:auto`, - # it returns the implementation-specific file if it exists, or the base file - # if *it* exists, or `nil` if neither exists. - def _path(path, impl) - return path unless impl - - extension = File.extname(path) - path_without_extension = extension.empty? ? path : path[0...-extension.length] - path_with_impl = "#{path_without_extension}-#{@impl}#{extension}" - - return path_with_impl if impl == true || @dir.file?(path_with_impl) - return path if @dir.file?(path) - end -end diff --git a/lib/sass_spec/test_case_metadata.rb b/lib/sass_spec/test_case_metadata.rb deleted file mode 100644 index 813beccaa6..0000000000 --- a/lib/sass_spec/test_case_metadata.rb +++ /dev/null @@ -1,128 +0,0 @@ -require 'pathname' -require 'yaml' - -module SassSpec - class TestCaseMetadata - def self.cache - @metadata_cache ||= {} - end - - # If you change this, also change Annotate::CLI#annotate_path - def self.merge_options(existing_opts, new_opts) - existing_opts = existing_opts.dup - - new_opts.each do |key, value| - if added_key = key[/^add_(.*)/, 1] - added_key = added_key.to_sym - (existing_opts[added_key] ||= []) - .concat(value) - .uniq! - elsif removed_key = key[/^remove_((?:warning_)?todo)/, 1] - removed_key = removed_key.to_sym - (existing_opts[removed_key] ||= []) - .delete_if {|name| value.include?(_normalize_todo(name))} - existing_opts.delete(removed_key) if existing_opts[removed_key].empty? - elsif removed_key = key[/^remove_(.*)/, 1] - removed_key = removed_key.to_sym - (existing_opts[removed_key] ||= []) - .delete_if {|name| value.include?(name)} - existing_opts.delete(removed_key) if existing_opts[removed_key].empty? - elsif value.nil? - existing_opts.delete(key) - else - existing_opts[key] = value - end - end - - existing_opts - end - - ACCUMULATED_OPTIONS = [:todo, :warning_todo, :ignore_for, :ignore_warning_for, :only_on, :warning_only_on] - - attr_reader :options - - # The name of the test. - # - # This is a standardized format of the test's directory name. - attr_reader :name - - # Parses metadata for the test case at the given SassSpec::Directory. - def initialize(test_case_dir) - @name = test_case_dir.to_s - @options = resolve_options(test_case_dir) - end - - def resolve_options(dir) - self.class.cache[dir.path] ||= _resolve_options(dir).tap do |options| - _normalize_todos(options, :todo) - _normalize_todos(options, :warning_todo) - end.freeze - end - - def _resolve_options(dir) - self_options = dir.file?("options.yml") ? YAML.load(dir.read("options.yml")) : {} - raise "#{dir.path}/options.yml is not a map!" unless self_options.is_a?(Hash) - return self_options unless parent = dir.parent - - parent_options = resolve_options(parent) - rv = parent_options.merge(self_options) do |key, parent_value, self_value| - if ACCUMULATED_OPTIONS.include?(key) - (Array(parent_value) + Array(self_value)).uniq - else - self_value - end - end - rv - end - - # Normalize a list of TODOs to convert GitHub issue references to - # implementation names. - def _normalize_todos(options, field) - if options.include?(field) - options[field] = options[field] - .map {|name| self.class._normalize_todo(name)} - .to_set - end - end - - # Normalize a single TODO value to convert a GitHub issue reference to an - # implementation name. - def self._normalize_todo(value) - value =~ %r{^sass/(.*)#} ? $1 : value - end - - def todo?(impl) - @options[:todo] && @options[:todo].include?(impl) - end - - def warning_todo?(impl) - @options[:warning_todo] && @options[:warning_todo].include?(impl) - end - - def all_warning_todos - @options[:warning_todo] || [] - end - - def ignore_for?(impl) - (@options[:ignore_for] && @options[:ignore_for].include?(impl)) || - (@options[:only_on] && !@options[:only_on].include?(impl)) - end - - def ignore_warning_for?(impl) - (@options[:ignore_warning_for] && @options[:ignore_warning_for].include?(impl)) || - (@options[:warning_only_on] && @options[:warning_only_on].include?(impl)) - end - - def warnings_ignored_for - @options[:ignore_warning_for] || [] - end - - def precision - @options[:precision] - end - - def valid_for_impl?(impl) - !ignore_for?(impl) - end - end -end diff --git a/lib/sass_spec/util.rb b/lib/sass_spec/util.rb deleted file mode 100644 index aa54c99c1e..0000000000 --- a/lib/sass_spec/util.rb +++ /dev/null @@ -1,37 +0,0 @@ -module SassSpec::Util - class << self - # Normalizes the whitespace in the given CSS to make it easier to compare - # across implementations. - def normalize_output(css) - css.gsub(/(?:\r?\n)+/, "\n").force_encoding("utf-8") - end - - # Normalizes the path names and whitespace in the given error message. - def normalize_error(error) - # TODO(nweiz): Delete path normalization when sass/libsass#2861 is fixed. - error.gsub(/(?:\/todo_|_todo\/)/, "/") # hide todo pre/suffix - .gsub(/\/libsass\-[a-z]+\-tests\//, "/") # hide test directory - .gsub(/\/libsass\-[a-z]+\-issues\//, "/libsass-issues/") # normalize issue specs - .gsub(/(([\w\/.\-\\:]+?[\/\\])|([\/\\]|(?!:\s)))spec[\/\\]+/, "/sass/spec/") # normalize abs paths - .sub(/(?:\r?\n)*\z/, "\n") # make sure we have exactly one trailing linefeed - .sub(/\A(?:\r?\s)+\z/, "") # clear the whole file if only whitespace - .gsub(/\r\n/, "\n") # remove Windows line feeds - .force_encoding("utf-8") - end - - # Yields each directory in `path`, from the outermost to the innermost. - def each_directory(path) - return to_enum(__method__, path) unless block_given? - - path_so_far = nil - Pathname.new(path).each_filename do |dir| - if path_so_far.nil? - path_so_far = String.new(dir) - else - path_so_far << File::SEPARATOR << dir - end - yield path_so_far - end - end - end -end diff --git a/lib/sass_spec/version.rb b/lib/sass_spec/version.rb deleted file mode 100644 index 9975b5e057..0000000000 --- a/lib/sass_spec/version.rb +++ /dev/null @@ -1,4 +0,0 @@ -module SassSpec - VERSION = "3.3.3" -end - diff --git a/lib-js/spec-directory/cleanup.ts b/lib/spec-directory/cleanup.ts similarity index 100% rename from lib-js/spec-directory/cleanup.ts rename to lib/spec-directory/cleanup.ts diff --git a/lib-js/spec-directory/hrx.ts b/lib/spec-directory/hrx.ts similarity index 100% rename from lib-js/spec-directory/hrx.ts rename to lib/spec-directory/hrx.ts diff --git a/lib-js/spec-directory/index.ts b/lib/spec-directory/index.ts similarity index 100% rename from lib-js/spec-directory/index.ts rename to lib/spec-directory/index.ts diff --git a/lib-js/spec-directory/options.ts b/lib/spec-directory/options.ts similarity index 100% rename from lib-js/spec-directory/options.ts rename to lib/spec-directory/options.ts diff --git a/lib-js/spec-directory/real-directory.ts b/lib/spec-directory/real-directory.ts similarity index 100% rename from lib-js/spec-directory/real-directory.ts rename to lib/spec-directory/real-directory.ts diff --git a/lib-js/spec-directory/spec-directory.ts b/lib/spec-directory/spec-directory.ts similarity index 100% rename from lib-js/spec-directory/spec-directory.ts rename to lib/spec-directory/spec-directory.ts diff --git a/lib-js/spec-directory/spec-path.ts b/lib/spec-directory/spec-path.ts similarity index 100% rename from lib-js/spec-directory/spec-path.ts rename to lib/spec-directory/spec-path.ts diff --git a/lib-js/spec-directory/virtual-directory.ts b/lib/spec-directory/virtual-directory.ts similarity index 100% rename from lib-js/spec-directory/virtual-directory.ts rename to lib/spec-directory/virtual-directory.ts diff --git a/lib-js/tabulator.ts b/lib/tabulator.ts similarity index 100% rename from lib-js/tabulator.ts rename to lib/tabulator.ts diff --git a/lib-js/test-case/compare.ts b/lib/test-case/compare.ts similarity index 100% rename from lib-js/test-case/compare.ts rename to lib/test-case/compare.ts diff --git a/lib-js/test-case/expected.ts b/lib/test-case/expected.ts similarity index 100% rename from lib-js/test-case/expected.ts rename to lib/test-case/expected.ts diff --git a/lib-js/test-case/index.ts b/lib/test-case/index.ts similarity index 100% rename from lib-js/test-case/index.ts rename to lib/test-case/index.ts diff --git a/lib-js/test-case/test-case.ts b/lib/test-case/test-case.ts similarity index 100% rename from lib-js/test-case/test-case.ts rename to lib/test-case/test-case.ts diff --git a/lib-js/test-case/util.ts b/lib/test-case/util.ts similarity index 100% rename from lib-js/test-case/util.ts rename to lib/test-case/util.ts diff --git a/lint-spec.ts b/lint-spec.ts index ffb227c39d..ec7ecdbdb0 100644 --- a/lint-spec.ts +++ b/lint-spec.ts @@ -3,10 +3,10 @@ import fs from 'fs'; import p from 'path'; import yargs from 'yargs/yargs'; -import {LintReporter} from './lib-js/lint-reporter'; -import {fromPath, SpecDirectory} from './lib-js/spec-directory'; -import RealDirectory from './lib-js/spec-directory/real-directory'; -import VirtualDirectory from './lib-js/spec-directory/virtual-directory'; +import {LintReporter} from './lib/lint-reporter'; +import {fromPath, SpecDirectory} from './lib/spec-directory'; +import RealDirectory from './lib/spec-directory/real-directory'; +import VirtualDirectory from './lib/spec-directory/virtual-directory'; async function lintAllTests(fix: boolean) { try { diff --git a/sass-spec.rb b/sass-spec.rb deleted file mode 100755 index 2f903763e0..0000000000 --- a/sass-spec.rb +++ /dev/null @@ -1,51 +0,0 @@ -#!/usr/bin/env ruby - -#This script requires a standard directory hierarchy which might be a bit cumbersome to set up -# -#The hierarchy looks like this near the leaves: -#... -#|-test_subclass_1 -#| |-test_1 -#| | |-input.scss -#| | --output.css -#| --test_2 -#| |-input.scss -#| --output.css -#|-test_subclass_2 -#| |-test_1 -#| | |-input.scss -#| | --output.css -#... -#the point is to have all the tests in their own folder in a file named input* with -#the output of running a command on it in the file output* in the same directory - -require_relative 'lib/sass_spec' - - -module Minitest - class Skip < Assertion - def result_code - "-" - end - end -end - -if ARGV[0] == "annotate" - require_relative 'lib/sass_spec/annotate' - begin - (cli = SassSpec::Annotate::CLI.parse(ARGV[1..-1])) || exit(1) - rescue OptionParser::InvalidOption => e - warn e.message + "\n\n" - SassSpec::Annotate::CLI.parse(%w(-h)) - exit 1 - end - cli.annotate || exit(1) -else - begin - SassSpec::Runner.new(SassSpec::CLI.parse()).run || exit(1) - rescue ArgumentError => e - warn e.message - warn e.backtrace - exit 1 - end -end diff --git a/sass-spec.ts b/sass-spec.ts index b2081699b2..70b435c245 100644 --- a/sass-spec.ts +++ b/sass-spec.ts @@ -1,8 +1,8 @@ -import {fromPath} from './lib-js/spec-directory'; -import {Interactor} from './lib-js/interactor'; -import {parseArgs, CliArgs} from './lib-js/cli-args'; -import TestCase from './lib-js/test-case'; -import Tabulator from './lib-js/tabulator'; +import {fromPath} from './lib/spec-directory'; +import {Interactor} from './lib/interactor'; +import {parseArgs, CliArgs} from './lib/cli-args'; +import TestCase from './lib/test-case'; +import Tabulator from './lib/tabulator'; async function runAllTests() { let args_: CliArgs | undefined; diff --git a/spec/core_functions/color/adjust_color/error/args.hrx b/spec/core_functions/color/adjust_color/error/args.hrx index 62998521f1..29f111d8b2 100644 --- a/spec/core_functions/color/adjust_color/error/args.hrx +++ b/spec/core_functions/color/adjust_color/error/args.hrx @@ -44,7 +44,7 @@ Error: Only one positional argument is allowed. All other arguments must be pass a {b: adjust-color(red, $ambience: 10%)} <===> unknown/error -Error: No argument named $ambience. +Error: $ambience: Color space rgb doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $ambience: 10%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/adjust_color/error/bounds.hrx b/spec/core_functions/color/adjust_color/error/bounds.hrx index 03e71f05b1..45348042dc 100644 --- a/spec/core_functions/color/adjust_color/error/bounds.hrx +++ b/spec/core_functions/color/adjust_color/error/bounds.hrx @@ -1,3 +1,14 @@ +<===> README.md +According to the new color space spec, out-of-bounds values should be allowed +(and clamped for strictly bounded spaces). See sass/sass-spec#1828. + +<===> options.yml +--- +:todo: +- dart-sass + +<===> +================================================================================ <===> red/too_low/input.scss a {b: adjust-color(red, $red: -256)} diff --git a/spec/core_functions/color/adjust_color/error/mixed_formats.hrx b/spec/core_functions/color/adjust_color/error/mixed_formats.hrx index aeff43825f..7d5e5f8443 100644 --- a/spec/core_functions/color/adjust_color/error/mixed_formats.hrx +++ b/spec/core_functions/color/adjust_color/error/mixed_formats.hrx @@ -2,7 +2,7 @@ a {b: adjust-color(red, $red: 1, $hue: 1)} <===> red_and_hue/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $hue: Color space rgb doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $red: 1, $hue: 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -23,7 +23,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `adjus a {b: adjust-color(red, $green: 1, $saturation: 1%)} <===> green_and_saturation/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $saturation: Color space rgb doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $green: 1, $saturation: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -44,7 +44,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `adjus a {b: adjust-color(red, $blue: 1, $lightness: 1%)} <===> blue_and_lightness/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $lightness: Color space rgb doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $blue: 1, $lightness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -70,7 +70,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `adjus a {b: adjust-color(red, $red: 1, $blackness: 1%)} <===> red_and_blackness/error -Error: RGB parameters may not be passed along with HWB parameters. +Error: $blackness: Color space rgb doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $red: 1, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -88,7 +88,7 @@ Error: RGB parameters may not be passed along with HWB parameters. a {b: adjust-color(red, $green: 1, $whiteness: 1%)} <===> green_and_whiteness/error -Error: RGB parameters may not be passed along with HWB parameters. +Error: $whiteness: Color space rgb doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $green: 1, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -106,7 +106,7 @@ Error: RGB parameters may not be passed along with HWB parameters. a {b: adjust-color(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error -Error: HSL parameters may not be passed along with HWB parameters. +Error: $blackness: Color space hsl doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $saturation: 1%, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -124,7 +124,7 @@ Error: HSL parameters may not be passed along with HWB parameters. a {b: adjust-color(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error -Error: HSL parameters may not be passed along with HWB parameters. +Error: $whiteness: Color space hsl doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $lightness: 1%, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/adjust_color/hsl.hrx b/spec/core_functions/color/adjust_color/hsl.hrx index 0f9bb4749f..b2fdf41ad2 100644 --- a/spec/core_functions/color/adjust_color/hsl.hrx +++ b/spec/core_functions/color/adjust_color/hsl.hrx @@ -2,6 +2,11 @@ a {b: adjust-color(red, $hue: 359)} <===> hue/max/output.css +a { + b: rgb(255, 0, 4.25); +} + +<===> hue/max/output-libsass.css a { b: #ff0004; } @@ -52,6 +57,11 @@ a { a {b: adjust-color(red, $hue: 123)} <===> hue/middle/output.css +a { + b: rgb(0, 255, 12.75); +} + +<===> hue/middle/output-libsass.css a { b: #00ff0d; } @@ -62,6 +72,11 @@ a { a {b: adjust-color(red, $hue: 0.5)} <===> hue/fraction/output.css +a { + b: rgb(255, 2.125, 0); +} + +<===> hue/fraction/output-libsass.css a { b: #ff0200; } @@ -102,6 +117,11 @@ a { a {b: adjust-color(plum, $saturation: -100%)} <===> saturation/min/output.css +a { + b: rgb(190.5, 190.5, 190.5); +} + +<===> saturation/min/output-libsass.css a { b: #bfbfbf; } @@ -112,6 +132,11 @@ a { a {b: adjust-color(plum, $saturation: -48%)} <===> saturation/min_remaining/output.css +a { + b: rgb(190.5, 190.5, 190.5); +} + +<===> saturation/min_remaining/output-libsass.css a { b: #bfbfbf; } @@ -122,6 +147,11 @@ a { a {b: adjust-color(plum, $saturation: 14%)} <===> saturation/high/output.css +a { + b: rgb(230.03, 150.97, 230.03); +} + +<===> saturation/high/output-libsass.css a { b: #e697e6; } @@ -132,6 +162,11 @@ a { a {b: adjust-color(plum, $saturation: -14%)} <===> saturation/low/output.css +a { + b: rgb(211.97, 169.03, 211.97); +} + +<===> saturation/low/output-libsass.css a { b: #d4a9d4; } @@ -172,6 +207,11 @@ a { a {b: adjust-color(red, $lightness: 0.5%)} <===> lightness/fraction/output.css +a { + b: rgb(255, 2.55, 2.55); +} + +<===> lightness/fraction/output-libsass.css a { b: #ff0303; } @@ -202,6 +242,11 @@ a { a {b: adjust-color(red, $lightness: 14%)} <===> lightness/high/output.css +a { + b: rgb(255, 71.4, 71.4); +} + +<===> lightness/high/output-libsass.css a { b: #ff4747; } @@ -212,6 +257,11 @@ a { a {b: adjust-color(red, $lightness: -14%)} <===> lightness/low/output.css +a { + b: rgb(183.6, 0, 0); +} + +<===> lightness/low/output-libsass.css a { b: #b80000; } @@ -222,6 +272,11 @@ a { a {b: adjust-color(black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> all/output.css +a { + b: rgb(151.776, 104.7744, 93.024); +} + +<===> all/output-libsass.css a { b: #98695d; } @@ -232,6 +287,11 @@ a { a {b: adjust-color(rgba(black, 0.7), $hue: 12, $saturation: 24%, $lightness: 48%)} <===> alpha_input/output.css +a { + b: rgba(151.776, 104.7744, 93.024, 0.7); +} + +<===> alpha_input/output-libsass.css a { b: rgba(152, 105, 93, 0.7); } @@ -242,6 +302,11 @@ a { a {b: adjust-color(black, $hue: 12, $saturation: 24%, $lightness: 48%, $alpha: -0.7)} <===> alpha_arg/output.css +a { + b: rgba(151.776, 104.7744, 93.024, 0.3); +} + +<===> alpha_arg/output-libsass.css a { b: rgba(152, 105, 93, 0.3); } @@ -253,6 +318,11 @@ a { a {b: adjust-color(black, $hue: 12, $saturation: 24%, $lightness: 48%, $alpha: 0.7)} <===> alpha_arg_above_max/output.css +a { + b: rgb(151.776, 104.7744, 93.024); +} + +<===> alpha_arg_above_max/output-libsass.css a { b: #98695d; } @@ -263,6 +333,11 @@ a { a {b: adjust-color($color: black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> named/output.css +a { + b: rgb(151.776, 104.7744, 93.024); +} + +<===> named/output-libsass.css a { b: #98695d; } diff --git a/spec/core_functions/color/adjust_color/hwb.hrx b/spec/core_functions/color/adjust_color/hwb.hrx index 4b75bded41..2777269cba 100644 --- a/spec/core_functions/color/adjust_color/hwb.hrx +++ b/spec/core_functions/color/adjust_color/hwb.hrx @@ -10,7 +10,7 @@ a {b: adjust-color(#cc6666, $whiteness: 100%)} <===> whiteness/max/output.css a { - b: #d5d5d5; + b: rgb(212.5, 212.5, 212.5); } <===> @@ -20,7 +20,7 @@ a {b: adjust-color(#cc6666, $whiteness: 60%)} <===> whiteness/max_remaining/output.css a { - b: #d5d5d5; + b: rgb(212.5, 212.5, 212.5); } <===> @@ -80,7 +80,7 @@ a {b: adjust-color(#993333, $blackness: 100%)} <===> blackness/max/output.css a { - b: #2b2b2b; + b: rgb(42.5, 42.5, 42.5); } <===> @@ -90,7 +90,7 @@ a {b: adjust-color(#993333, $blackness: 60%)} <===> blackness/max_remaining/output.css a { - b: #2b2b2b; + b: rgb(42.5, 42.5, 42.5); } <===> diff --git a/spec/core_functions/color/adjust_color/units.hrx b/spec/core_functions/color/adjust_color/units.hrx index 987319ca38..34d343c0cc 100644 --- a/spec/core_functions/color/adjust_color/units.hrx +++ b/spec/core_functions/color/adjust_color/units.hrx @@ -57,7 +57,7 @@ a {b: adjust-color(red, $hue: 60rad)} <===> hue/angle/output.css a { - b: #00b4ff; + b: rgb(0, 179.576224164, 255); } <===> @@ -66,6 +66,11 @@ a { a {b: adjust-color(red, $saturation: -10%)} <===> saturation/percent/output.css +a { + b: rgb(242.25, 12.75, 12.75); +} + +<===> saturation/percent/output-libsass.css a { b: #f20d0d; } @@ -76,6 +81,11 @@ a { a {b: adjust-color(red, $saturation: -10)} <===> saturation/unitless/output.css +a { + b: rgb(242.25, 12.75, 12.75); +} + +<===> saturation/unitless/output-libsass.css a { b: #f20d0d; } @@ -93,12 +103,19 @@ More info: https://sass-lang.com/d/function-units ' input.scss 1:7 root stylesheet +<===> saturation/unitless/warning-libsass + <===> ================================================================================ <===> saturation/unknown/input.scss a {b: adjust-color(red, $saturation: -10in)} <===> saturation/unknown/output.css +a { + b: rgb(242.25, 12.75, 12.75); +} + +<===> saturation/unknown/output-libsass.css a { b: #f20d0d; } @@ -116,6 +133,8 @@ More info: https://sass-lang.com/d/function-units ' input.scss 1:7 root stylesheet +<===> saturation/unknown/warning-libsass + <===> ================================================================================ <===> lightness/percent/input.scss diff --git a/spec/core_functions/color/adjust_hue.hrx b/spec/core_functions/color/adjust_hue.hrx index 9e34ad835b..0259bda088 100644 --- a/spec/core_functions/color/adjust_hue.hrx +++ b/spec/core_functions/color/adjust_hue.hrx @@ -2,6 +2,11 @@ a {b: adjust-hue(red, 359)} <===> max/output.css +a { + b: rgb(255, 0, 4.25); +} + +<===> max/output-libsass.css a { b: #ff0004; } @@ -52,6 +57,11 @@ a { a {b: adjust-hue(red, 123)} <===> middle/output.css +a { + b: rgb(0, 255, 12.75); +} + +<===> middle/output-libsass.css a { b: #00ff0d; } @@ -62,6 +72,11 @@ a { a {b: adjust-hue(red, 0.5)} <===> fraction/output.css +a { + b: rgb(255, 2.125, 0); +} + +<===> fraction/output-libsass.css a { b: #ff0200; } @@ -72,6 +87,11 @@ a { a {b: adjust-hue(rgba(red, 0.1), 359)} <===> alpha/output.css +a { + b: rgba(255, 0, 4.25, 0.1); +} + +<===> alpha/output-libsass.css a { b: rgba(255, 0, 4, 0.1); } @@ -137,7 +157,7 @@ a {b: adjust-hue(red, 60rad)} <===> units/angle/output.css a { - b: #00b4ff; + b: rgb(0, 179.576224164, 255); } <===> @@ -146,6 +166,11 @@ a { a {b: adjust-hue($color: red, $degrees: 123)} <===> named/output.css +a { + b: rgb(0, 255, 12.75); +} + +<===> named/output-libsass.css a { b: #00ff0d; } diff --git a/spec/core_functions/color/blackness.hrx b/spec/core_functions/color/blackness.hrx index 468d9d2691..cfb0fe2c48 100644 --- a/spec/core_functions/color/blackness.hrx +++ b/spec/core_functions/color/blackness.hrx @@ -33,7 +33,7 @@ a {b: color.blackness(color.hwb(0, 0%, 50%))} <===> middle/zero_whiteness/output.css a { - b: 49.8039215686%; + b: 50%; } <===> @@ -44,7 +44,7 @@ a {b: color.blackness(color.hwb(0, 50%, 50%))} <===> middle/half_whiteness/output.css a { - b: 49.8039215686%; + b: 50%; } <===> @@ -55,7 +55,7 @@ a {b: color.blackness(color.hwb(0, 70%, 70%))} <===> middle/high_whiteness/output.css a { - b: 49.8039215686%; + b: 50%; } <===> @@ -66,7 +66,7 @@ a {b: color.blackness(color.hwb(0, 0%, 0.5%))} <===> fraction/output.css a { - b: 0.3921568627%; + b: 0.5%; } <===> @@ -77,7 +77,7 @@ a {b: color.blackness($color: color.hwb(0, 0%, 42%))} <===> named/output.css a { - b: 41.9607843137%; + b: 42%; } <===> diff --git a/spec/core_functions/color/change_color/error/args.hrx b/spec/core_functions/color/change_color/error/args.hrx index 03fced9034..5344849483 100644 --- a/spec/core_functions/color/change_color/error/args.hrx +++ b/spec/core_functions/color/change_color/error/args.hrx @@ -44,7 +44,7 @@ Error: Only one positional argument is allowed. All other arguments must be pass a {b: change-color(red, $ambience: 10%)} <===> unknown/error -Error: No argument named $ambience. +Error: $ambience: Color space rgb doesn't have a channel with this name. , 1 | a {b: change-color(red, $ambience: 10%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/change_color/error/bounds.hrx b/spec/core_functions/color/change_color/error/bounds.hrx index ae90fcc5d0..1436662ada 100644 --- a/spec/core_functions/color/change_color/error/bounds.hrx +++ b/spec/core_functions/color/change_color/error/bounds.hrx @@ -1,3 +1,14 @@ +<===> README.md +According to the new color space spec, out-of-bounds values should be allowed +(and clamped for strictly bounded spaces). See sass/sass-spec#1828. + +<===> options.yml +--- +:todo: +- dart-sass + +<===> +================================================================================ <===> red/too_low/input.scss a {b: change-color(red, $red: -1)} diff --git a/spec/core_functions/color/change_color/error/mixed_formats.hrx b/spec/core_functions/color/change_color/error/mixed_formats.hrx index e4a874343b..2b7744929e 100644 --- a/spec/core_functions/color/change_color/error/mixed_formats.hrx +++ b/spec/core_functions/color/change_color/error/mixed_formats.hrx @@ -2,7 +2,7 @@ a {b: change-color(red, $red: 1, $hue: 1)} <===> red_and_hue/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $hue: Color space rgb doesn't have a channel with this name. , 1 | a {b: change-color(red, $red: 1, $hue: 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -23,7 +23,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `chang a {b: change-color(red, $green: 1, $saturation: 1%)} <===> green_and_saturation/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $saturation: Color space rgb doesn't have a channel with this name. , 1 | a {b: change-color(red, $green: 1, $saturation: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -44,7 +44,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `chang a {b: change-color(red, $blue: 1, $lightness: 1%)} <===> blue_and_lightness/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $lightness: Color space rgb doesn't have a channel with this name. , 1 | a {b: change-color(red, $blue: 1, $lightness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -70,7 +70,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `chang a {b: adjust-color(red, $red: 1, $blackness: 1%)} <===> red_and_blackness/error -Error: RGB parameters may not be passed along with HWB parameters. +Error: $blackness: Color space rgb doesn't have a channel with this name. , 1 | a {b: adjust-color(red, $red: 1, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -88,7 +88,7 @@ Error: RGB parameters may not be passed along with HWB parameters. a {b: change-color(red, $green: 1, $whiteness: 1%)} <===> green_and_whiteness/error -Error: RGB parameters may not be passed along with HWB parameters. +Error: $whiteness: Color space rgb doesn't have a channel with this name. , 1 | a {b: change-color(red, $green: 1, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -106,7 +106,7 @@ Error: RGB parameters may not be passed along with HWB parameters. a {b: change-color(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error -Error: HSL parameters may not be passed along with HWB parameters. +Error: $blackness: Color space hsl doesn't have a channel with this name. , 1 | a {b: change-color(red, $saturation: 1%, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -124,7 +124,7 @@ Error: HSL parameters may not be passed along with HWB parameters. a {b: change-color(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error -Error: HSL parameters may not be passed along with HWB parameters. +Error: $whiteness: Color space hsl doesn't have a channel with this name. , 1 | a {b: change-color(red, $lightness: 1%, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/change_color/hsl.hrx b/spec/core_functions/color/change_color/hsl.hrx index 30d597c4ff..bace6cb6c4 100644 --- a/spec/core_functions/color/change_color/hsl.hrx +++ b/spec/core_functions/color/change_color/hsl.hrx @@ -2,6 +2,11 @@ a {b: change-color(red, $hue: 359)} <===> hue/max/output.css +a { + b: rgb(255, 0, 4.25); +} + +<===> hue/max/output-libsass.css a { b: #ff0004; } @@ -52,6 +57,11 @@ a { a {b: change-color(red, $hue: 123)} <===> hue/middle/output.css +a { + b: rgb(0, 255, 12.75); +} + +<===> hue/middle/output-libsass.css a { b: #00ff0d; } @@ -62,6 +72,11 @@ a { a {b: change-color(red, $hue: 0.5)} <===> hue/fraction/output.css +a { + b: rgb(255, 2.125, 0); +} + +<===> hue/fraction/output-libsass.css a { b: #ff0200; } @@ -82,6 +97,11 @@ a { a {b: change-color(plum, $saturation: 0%)} <===> saturation/min/output.css +a { + b: rgb(190.5, 190.5, 190.5); +} + +<===> saturation/min/output-libsass.css a { b: #bfbfbf; } @@ -92,6 +112,11 @@ a { a {b: change-color(plum, $saturation: 76%)} <===> saturation/high/output.css +a { + b: rgb(239.52, 141.48, 239.52); +} + +<===> saturation/high/output-libsass.css a { b: #f08df0; } @@ -102,6 +127,11 @@ a { a {b: change-color(plum, $saturation: 14%)} <===> saturation/low/output.css +a { + b: rgb(199.53, 181.47, 199.53); +} + +<===> saturation/low/output-libsass.css a { b: #c8b5c8; } @@ -122,6 +152,11 @@ a { a {b: change-color(red, $lightness: 0.5%)} <===> lightness/fraction/output.css +a { + b: rgb(2.55, 0, 0); +} + +<===> lightness/fraction/output-libsass.css a { b: #030000; } @@ -142,6 +177,11 @@ a { a {b: change-color(red, $lightness: 63%)} <===> lightness/high/output.css +a { + b: rgb(255, 66.3, 66.3); +} + +<===> lightness/high/output-libsass.css a { b: #ff4242; } @@ -152,6 +192,11 @@ a { a {b: change-color(red, $lightness: 27%)} <===> lightness/low/output.css +a { + b: rgb(137.7, 0, 0); +} + +<===> lightness/low/output-libsass.css a { b: #8a0000; } @@ -162,6 +207,11 @@ a { a {b: change-color(black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> all/output.css +a { + b: rgb(151.776, 104.7744, 93.024); +} + +<===> all/output-libsass.css a { b: #98695d; } @@ -172,6 +222,11 @@ a { a {b: change-color(rgba(black, 0.7), $hue: 12, $saturation: 24%, $lightness: 48%)} <===> alpha_input/output.css +a { + b: rgba(151.776, 104.7744, 93.024, 0.7); +} + +<===> alpha_input/output-libsass.css a { b: rgba(152, 105, 93, 0.7); } @@ -182,6 +237,11 @@ a { a {b: change-color(black, $hue: 12, $saturation: 24%, $lightness: 48%, $alpha: 0.7)} <===> alpha_arg/output.css +a { + b: rgba(151.776, 104.7744, 93.024, 0.7); +} + +<===> alpha_arg/output-libsass.css a { b: rgba(152, 105, 93, 0.7); } @@ -192,6 +252,11 @@ a { a {b: change-color($color: black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> named/output.css +a { + b: rgb(151.776, 104.7744, 93.024); +} + +<===> named/output-libsass.css a { b: #98695d; } diff --git a/spec/core_functions/color/change_color/hwb.hrx b/spec/core_functions/color/change_color/hwb.hrx index b0573580a2..7c51983a2d 100644 --- a/spec/core_functions/color/change_color/hwb.hrx +++ b/spec/core_functions/color/change_color/hwb.hrx @@ -10,7 +10,7 @@ a {b: change-color(#cc6666, $whiteness: 100%)} <===> whiteness/max/output.css a { - b: #d5d5d5; + b: rgb(212.5, 212.5, 212.5); } <===> @@ -50,7 +50,7 @@ a {b: change-color(#993333, $blackness: 100%)} <===> blackness/max/output.css a { - b: #2b2b2b; + b: rgb(42.5, 42.5, 42.5); } <===> diff --git a/spec/core_functions/color/change_color/units.hrx b/spec/core_functions/color/change_color/units.hrx index e1abb73bf7..ef5844f94e 100644 --- a/spec/core_functions/color/change_color/units.hrx +++ b/spec/core_functions/color/change_color/units.hrx @@ -57,7 +57,7 @@ a {b: change-color(red, $hue: 60rad)} <===> hue/angle/output.css a { - b: #00b4ff; + b: rgb(0, 179.576224164, 255); } <===> @@ -66,6 +66,11 @@ a { a {b: change-color(red, $saturation: 50%)} <===> saturation/percent/output.css +a { + b: rgb(191.25, 63.75, 63.75); +} + +<===> saturation/percent/output-libsass.css a { b: #bf4040; } @@ -76,6 +81,11 @@ a { a {b: change-color(red, $saturation: 50)} <===> saturation/unitless/output.css +a { + b: rgb(191.25, 63.75, 63.75); +} + +<===> saturation/unitless/output-libsass.css a { b: #bf4040; } @@ -93,12 +103,19 @@ More info: https://sass-lang.com/d/function-units ' input.scss 1:7 root stylesheet +<===> saturation/unitless/warning-libsass + <===> ================================================================================ <===> saturation/unknown/input.scss a {b: change-color(red, $saturation: 50in)} <===> saturation/unknown/output.css +a { + b: rgb(191.25, 63.75, 63.75); +} + +<===> saturation/unknown/output-libsass.css a { b: #bf4040; } @@ -116,6 +133,8 @@ More info: https://sass-lang.com/d/function-units ' input.scss 1:7 root stylesheet +<===> saturation/unknown/warning-libsass + <===> ================================================================================ <===> lightness/percent/input.scss diff --git a/spec/core_functions/color/complement.hrx b/spec/core_functions/color/complement.hrx index 64aa7f8a9b..c64f1d8de0 100644 --- a/spec/core_functions/color/complement.hrx +++ b/spec/core_functions/color/complement.hrx @@ -88,8 +88,8 @@ Error: Missing argument $color. | ^^^^^^^^^^^^ invocation ' ,--> sass:color -1 | @function complement($color) { - | ================== declaration +1 | @function complement($color, $space: null) { + | ================================ declaration ' input.scss 1:7 root stylesheet @@ -102,6 +102,11 @@ Error: Function complement is missing argument $color. <===> ================================================================================ +<===> error/too_many_args/options.yml +--- +:todo: +- dart-sass + <===> error/too_many_args/input.scss a {b: complement(red, 1)} diff --git a/spec/core_functions/color/darken.hrx b/spec/core_functions/color/darken.hrx index ab75a0353f..ee73cb7a93 100644 --- a/spec/core_functions/color/darken.hrx +++ b/spec/core_functions/color/darken.hrx @@ -32,6 +32,11 @@ a { a {b: darken(red, 14%)} <===> middle/output.css +a { + b: rgb(183.6, 0, 0); +} + +<===> middle/output-libsass.css a { b: #b80000; } @@ -42,6 +47,11 @@ a { a {b: darken(red, 0.5%)} <===> fraction/output.css +a { + b: rgb(252.45, 0, 0); +} + +<===> fraction/output-libsass.css a { b: #fc0000; } @@ -62,6 +72,11 @@ a { a {b: darken($color: red, $amount: 14%)} <===> named/output.css +a { + b: rgb(183.6, 0, 0); +} + +<===> named/output-libsass.css a { b: #b80000; } diff --git a/spec/core_functions/color/desaturate.hrx b/spec/core_functions/color/desaturate.hrx index 16edfdb5fb..f9adddf67f 100644 --- a/spec/core_functions/color/desaturate.hrx +++ b/spec/core_functions/color/desaturate.hrx @@ -2,6 +2,11 @@ a {b: desaturate(plum, 100%)} <===> max/output.css +a { + b: rgb(190.5, 190.5, 190.5); +} + +<===> max/output-libsass.css a { b: #bfbfbf; } @@ -12,6 +17,11 @@ a { a {b: desaturate(plum, 48%)} <===> max_remaining/output.css +a { + b: rgb(190.5, 190.5, 190.5); +} + +<===> max_remaining/output-libsass.css a { b: #bfbfbf; } @@ -32,6 +42,11 @@ a { a {b: desaturate(plum, 14%)} <===> middle/output.css +a { + b: rgb(211.97, 169.03, 211.97); +} + +<===> middle/output-libsass.css a { b: #d4a9d4; } @@ -42,6 +57,11 @@ a { a {b: desaturate(rgba(plum, 0.3), 100%)} <===> alpha/output.css +a { + b: rgba(190.5, 190.5, 190.5, 0.3); +} + +<===> alpha/output-libsass.css a { b: rgba(191, 191, 191, 0.3); } @@ -52,6 +72,11 @@ a { a {b: desaturate($color: plum, $amount: 14%)} <===> named/output.css +a { + b: rgb(211.97, 169.03, 211.97); +} + +<===> named/output-libsass.css a { b: #d4a9d4; } diff --git a/spec/core_functions/color/grayscale.hrx b/spec/core_functions/color/grayscale.hrx index b1243b71a1..79d7bcc331 100644 --- a/spec/core_functions/color/grayscale.hrx +++ b/spec/core_functions/color/grayscale.hrx @@ -32,6 +32,11 @@ a { a {b: grayscale(red)} <===> max_saturation/output.css +a { + b: rgb(127.5, 127.5, 127.5); +} + +<===> max_saturation/output-libsass.css a { b: gray; } @@ -42,6 +47,11 @@ a { a {b: grayscale(#633736)} <===> mid_saturation/output.css +a { + b: rgb(76.5, 76.5, 76.5); +} + +<===> mid_saturation/output-libsass.css a { b: #4d4d4d; } @@ -52,6 +62,11 @@ a { a {b: grayscale(rgba(#633736, 0.3))} <===> alpha/output.css +a { + b: rgba(76.5, 76.5, 76.5, 0.3); +} + +<===> alpha/output-libsass.css a { b: rgba(77, 77, 77, 0.3); } diff --git a/spec/core_functions/color/hsl/error/one_arg.hrx b/spec/core_functions/color/hsl/error/one_arg.hrx index f73d8084ea..f34eb43259 100644 --- a/spec/core_functions/color/hsl/error/one_arg.hrx +++ b/spec/core_functions/color/hsl/error/one_arg.hrx @@ -11,7 +11,7 @@ a { } <===> list/empty/error -Error: Missing element $hue. +Error: $channels: Color component list may not be empty. , 2 | b: hsl(()); | ^^^^^^^ @@ -26,7 +26,7 @@ a { } <===> list/comma_separated/error -Error: $channels must be a space-separated list. +Error: $channels: Expected a space- or slash-separated list, was (0, 100%, 50%) , 2 | b: hsl((0, 100%, 50%)); | ^^^^^^^^^^^^^^^^^^^ @@ -41,7 +41,7 @@ a { } <===> list/bracketed/error -Error: $channels must be an unbracketed list. +Error: $channels: Expected an unbracketed list, was [0 100% 50%] , 2 | b: hsl([0 100% 50%]); | ^^^^^^^^^^^^^^^^^ @@ -56,7 +56,7 @@ a { } <===> list/one_element/error -Error: Missing element $saturation. +Error: $channels: The hsl color space has 3 channels but 0 has 1. , 2 | b: hsl(0); | ^^^^^^ @@ -71,7 +71,7 @@ a { } <===> list/two_elements/error -Error: Missing element $lightness. +Error: $channels: The hsl color space has 3 channels but (0 100%) has 2. , 2 | b: hsl(0 100%); | ^^^^^^^^^^^ @@ -86,7 +86,7 @@ a { } <===> list/four_elements/error -Error: Only 3 elements allowed, but 4 were passed. +Error: $channels: The hsl color space has 3 channels but (0 100% 50% 0.4) has 4. , 2 | b: hsl(0 100% 50% 0.4); | ^^^^^^^^^^^^^^^^^^^ @@ -101,7 +101,7 @@ a { } <===> type/hue/error -Error: $hue: "foo" is not a number. +Error: $channels: Expected hue "foo" to be a number. , 2 | b: hsl("foo" 100% 50%); | ^^^^^^^^^^^^^^^^^^^ @@ -116,7 +116,7 @@ a { } <===> type/saturation/error -Error: $saturation: "foo" is not a number. +Error: $channels: Expected saturation "foo" to be a number. , 2 | b: hsl(0 "foo" 50%); | ^^^^^^^^^^^^^^^^ @@ -131,7 +131,7 @@ a { } <===> type/lightness/error -Error: $lightness: "foo" is not a number. +Error: $channels: Expected lightness "foo" to be a number. , 2 | b: hsl(0 100% "foo"); | ^^^^^^^^^^^^^^^^^ @@ -146,7 +146,7 @@ a { } <===> quoted_var_slash/error -Error: $lightness: "var(--foo) / 0.4" is not a number. +Error: $channels: Expected lightness "var(--foo) / 0.4" to be a number. , 2 | b: hsl(0 100% "var(--foo) / 0.4"); | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -187,7 +187,7 @@ Error: Only 2 slash-separated elements allowed, but 3 were passed. a {b: hsl(list.slash((), 1))} <===> slash_list/channels/empty/error -Error: Missing element $hue. +Error: $channels: Color component list may not be empty. , 2 | a {b: hsl(list.slash((), 1))} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -201,7 +201,7 @@ Error: Missing element $hue. a {b: hsl(list.slash((0, 100%, 50%), 1))} <===> slash_list/channels/comma_separated/error -Error: $channels must be a space-separated list. +Error: $channels: Expected a space-separated list, was (0, 100%, 50%) , 2 | a {b: hsl(list.slash((0, 100%, 50%), 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -215,7 +215,7 @@ Error: $channels must be a space-separated list. a {b: hsl(list.slash([0 100% 50%], 1))} <===> slash_list/channels/bracketed/error -Error: $channels must be an unbracketed list. +Error: $channels: Expected an unbracketed list, was [0 100% 50%] , 2 | a {b: hsl(list.slash([0 100% 50%], 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -229,7 +229,7 @@ Error: $channels must be an unbracketed list. a {b: hsl(list.slash(0, 1))} <===> slash_list/channels/one_element/error -Error: Missing element $saturation. +Error: $channels: The hsl color space has 3 channels but (0 / 1) has 1. , 2 | a {b: hsl(list.slash(0, 1))} | ^^^^^^^^^^^^^^^^^^^^^ @@ -243,7 +243,7 @@ Error: Missing element $saturation. a {b: hsl(list.slash(0 100%, 1))} <===> slash_list/channels/two_elements/error -Error: Missing element $lightness. +Error: $channels: The hsl color space has 3 channels but (0 100% / 1) has 2. , 2 | a {b: hsl(list.slash(0 100%, 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -257,7 +257,7 @@ Error: Missing element $lightness. a {b: hsl(list.slash(0 100% 50% 0.4, 1))} <===> slash_list/channels/four_elements/error -Error: Only 3 elements allowed, but 4 were passed. +Error: $channels: The hsl color space has 3 channels but (0 100% 50% 0.4 / 1) has 4. , 2 | a {b: hsl(list.slash(0 100% 50% 0.4, 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/hsl/three_args/units.hrx b/spec/core_functions/color/hsl/three_args/units.hrx index 0e5cbf22b0..0ce6017e58 100644 --- a/spec/core_functions/color/hsl/three_args/units.hrx +++ b/spec/core_functions/color/hsl/three_args/units.hrx @@ -70,7 +70,7 @@ a {b: hsl(60rad, 100%, 50%)} <===> hue/angle/output.css a { - b: hsl(197.7467707849deg, 100%, 50%); + b: hsl(3437.7467707849deg, 100%, 50%); } <===> hue/angle/output-libsass.css diff --git a/spec/core_functions/color/hsl/three_args/w3c/blue_to_red.hrx b/spec/core_functions/color/hsl/three_args/w3c/blue_to_red.hrx index 42d72741e6..39018a3f07 100644 --- a/spec/core_functions/color/hsl/three_args/w3c/blue_to_red.hrx +++ b/spec/core_functions/color/hsl/three_args/w3c/blue_to_red.hrx @@ -25,7 +25,7 @@ a { step-8: hsl(324deg, 100%, 50%); step-9: hsl(336deg, 100%, 50%); step-10: hsl(348deg, 100%, 50%); - step-11: hsl(0deg, 100%, 50%); + step-11: hsl(360deg, 100%, 50%); } <===> output-libsass.css diff --git a/spec/core_functions/color/hsl/three_args/w3c/hue.hrx b/spec/core_functions/color/hsl/three_args/w3c/hue.hrx index 7340195e62..0133d16d1e 100644 --- a/spec/core_functions/color/hsl/three_args/w3c/hue.hrx +++ b/spec/core_functions/color/hsl/three_args/w3c/hue.hrx @@ -17,44 +17,44 @@ <===> output.css red { hue-0: hsl(0deg, 100%, 50%); - hue--360: hsl(0deg, 100%, 50%); - hue-360: hsl(0deg, 100%, 50%); - hue-6120: hsl(0deg, 100%, 50%); + hue--360: hsl(-360deg, 100%, 50%); + hue-360: hsl(360deg, 100%, 50%); + hue-6120: hsl(6120deg, 100%, 50%); } yellow { hue-60: hsl(60deg, 100%, 50%); - hue--300: hsl(60deg, 100%, 50%); - hue-420: hsl(60deg, 100%, 50%); - hue--9660: hsl(60deg, 100%, 50%); + hue--300: hsl(-300deg, 100%, 50%); + hue-420: hsl(420deg, 100%, 50%); + hue--9660: hsl(-9660deg, 100%, 50%); } green { hue-120: hsl(120deg, 100%, 50%); - hue--240: hsl(120deg, 100%, 50%); - hue-480: hsl(120deg, 100%, 50%); - hue-99840: hsl(120deg, 100%, 50%); + hue--240: hsl(-240deg, 100%, 50%); + hue-480: hsl(480deg, 100%, 50%); + hue-99840: hsl(99840deg, 100%, 50%); } cyan { hue-180: hsl(180deg, 100%, 50%); - hue--180: hsl(180deg, 100%, 50%); - hue-540: hsl(180deg, 100%, 50%); - hue--900: hsl(180deg, 100%, 50%); + hue--180: hsl(-180deg, 100%, 50%); + hue-540: hsl(540deg, 100%, 50%); + hue--900: hsl(-900deg, 100%, 50%); } blue { hue-240: hsl(240deg, 100%, 50%); - hue--120: hsl(240deg, 100%, 50%); - hue-600: hsl(240deg, 100%, 50%); - hue--104880: hsl(240deg, 100%, 50%); + hue--120: hsl(-120deg, 100%, 50%); + hue-600: hsl(600deg, 100%, 50%); + hue--104880: hsl(-104880deg, 100%, 50%); } purple { hue-300: hsl(300deg, 100%, 50%); - hue--60: hsl(300deg, 100%, 50%); - hue-660: hsl(300deg, 100%, 50%); - hue-2820: hsl(300deg, 100%, 50%); + hue--60: hsl(-60deg, 100%, 50%); + hue-660: hsl(660deg, 100%, 50%); + hue-2820: hsl(2820deg, 100%, 50%); } <===> output-libsass.css diff --git a/spec/core_functions/color/hwb/error/four_args.hrx b/spec/core_functions/color/hwb/error/four_args.hrx index 1e0ec96897..b202806b4f 100644 --- a/spec/core_functions/color/hwb/error/four_args.hrx +++ b/spec/core_functions/color/hwb/error/four_args.hrx @@ -3,7 +3,7 @@ a {b: color.hwb("foo", 30%, 40%, 0.5)} <===> hue/type/error -Error: $hue: "foo" is not a number. +Error: Expected hue "foo" to be a number. , 2 | a {b: color.hwb("foo", 30%, 40%, 0.5)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -12,6 +12,11 @@ Error: $hue: "foo" is not a number. <===> ================================================================================ +<===> hue/var/options.yml +--- +:todo: +- dart-sass + <===> hue/var/input.scss @use 'sass:color'; a {b: color.hwb(var(--c), 30%, 40%, 0.5)} @@ -31,7 +36,7 @@ Error: $hue: var(--c) is not a number. a {b: color.hwb(0, "foo", 40%, 0.5)} <===> whiteness/type/error -Error: $whiteness: "foo" is not a number. +Error: Expected whiteness "foo" to be a number. , 2 | a {b: color.hwb(0, "foo", 40%, 0.5)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -68,6 +73,11 @@ Error: $whiteness: Expected 30px to have unit "%". <===> ================================================================================ +<===> whiteness/too_high/options.yml +--- +:todo: +- dart-sass + <===> whiteness/too_high/input.scss @use 'sass:color'; a {b: color.hwb(0, 101%, 40%, 0.5)} @@ -82,6 +92,11 @@ Error: $whiteness: Expected 101% to be within 0% and 100%. <===> ================================================================================ +<===> whiteness/too_low/options.yml +--- +:todo: +- dart-sass + <===> whiteness/too_low/input.scss @use 'sass:color'; a {b: color.hwb(0, -1%, 40%, 0.5)} @@ -96,6 +111,11 @@ Error: $whiteness: Expected -1% to be within 0% and 100%. <===> ================================================================================ +<===> whiteness/var/options.yml +--- +:todo: +- dart-sass + <===> whiteness/var/input.scss @use 'sass:color'; a {b: color.hwb(0, var(--c), 40%, 0.5)} @@ -115,7 +135,7 @@ Error: $whiteness: var(--c) is not a number. a {b: color.hwb(0, 30%, "foo", 0.5)} <===> blackness/type/error -Error: $blackness: "foo" is not a number. +Error: Expected blackness "foo" to be a number. , 2 | a {b: color.hwb(0, 30%, "foo", 0.5)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -152,6 +172,11 @@ Error: $blackness: Expected 40px to have unit "%". <===> ================================================================================ +<===> blackness/too_high/options.yml +--- +:todo: +- dart-sass + <===> blackness/too_high/input.scss @use 'sass:color'; a {b: color.hwb(0, 30%, 101%, 0.5)} @@ -166,6 +191,11 @@ Error: $blackness: Expected 101% to be within 0% and 100%. <===> ================================================================================ +<===> blackness/too_low/options.yml +--- +:todo: +- dart-sass + <===> blackness/too_low/input.scss @use 'sass:color'; a {b: color.hwb(0, 30%, -1%, 0.5)} @@ -180,6 +210,11 @@ Error: $blackness: Expected -1% to be within 0% and 100%. <===> ================================================================================ +<===> blackness/var/options.yml +--- +:todo: +- dart-sass + <===> blackness/var/input.scss @use 'sass:color'; a {b: color.hwb(0, 30%, var(--c), 0.5)} @@ -208,6 +243,11 @@ Error: $alpha: Expected 0.5px to have no units or "%". <===> ================================================================================ +<===> alpha/var/options.yml +--- +:todo: +- dart-sass + <===> alpha/var/input.scss @use 'sass:color'; a {b: color.hwb(0, 0%, 0%, var(--c))} diff --git a/spec/core_functions/color/hwb/error/one_arg.hrx b/spec/core_functions/color/hwb/error/one_arg.hrx index 003348e8c6..2affeadd29 100644 --- a/spec/core_functions/color/hwb/error/one_arg.hrx +++ b/spec/core_functions/color/hwb/error/one_arg.hrx @@ -3,7 +3,7 @@ a {b: color.hwb(())} <===> list/empty/error -Error: Missing element $hue. +Error: $channels: Color component list may not be empty. , 2 | a {b: color.hwb(())} | ^^^^^^^^^^^^^ @@ -17,7 +17,7 @@ Error: Missing element $hue. a {b: color.hwb((0, 30%, 40%))} <===> list/comma_separated/error -Error: $channels must be a space-separated list. +Error: $channels: Expected a space- or slash-separated list, was (0, 30%, 40%) , 2 | a {b: color.hwb((0, 30%, 40%))} | ^^^^^^^^^^^^^^^^^^^^^^^^ @@ -31,7 +31,7 @@ Error: $channels must be a space-separated list. a {b: color.hwb([0 30% 40%])} <===> list/bracketed/error -Error: $channels must be an unbracketed list. +Error: $channels: Expected an unbracketed list, was [0 30% 40%] , 2 | a {b: color.hwb([0 30% 40%])} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -45,7 +45,7 @@ Error: $channels must be an unbracketed list. a {b: color.hwb(0)} <===> list/one_element/error -Error: Missing element $whiteness. +Error: $channels: The hwb color space has 3 channels but 0 has 1. , 2 | a {b: color.hwb(0)} | ^^^^^^^^^^^^ @@ -59,7 +59,7 @@ Error: Missing element $whiteness. a {b: color.hwb(0 30%)} <===> list/two_elements/error -Error: Missing element $blackness. +Error: $channels: The hwb color space has 3 channels but (0 30%) has 2. , 2 | a {b: color.hwb(0 30%)} | ^^^^^^^^^^^^^^^^ @@ -73,7 +73,7 @@ Error: Missing element $blackness. a {b: color.hwb(0 30% 40% 0.4)} <===> list/four_elements/error -Error: Only 3 elements allowed, but 4 were passed. +Error: $channels: The hwb color space has 3 channels but (0 30% 40% 0.4) has 4. , 2 | a {b: color.hwb(0 30% 40% 0.4)} | ^^^^^^^^^^^^^^^^^^^^^^^^ @@ -87,7 +87,7 @@ Error: Only 3 elements allowed, but 4 were passed. a {b: color.hwb("foo" 30% 40%)} <===> hue/type/error -Error: $hue: "foo" is not a number. +Error: $channels: Expected hue "foo" to be a number. , 2 | a {b: color.hwb("foo" 30% 40%)} | ^^^^^^^^^^^^^^^^^^^^^^^^ @@ -96,6 +96,11 @@ Error: $hue: "foo" is not a number. <===> ================================================================================ +<===> hue/var/options.yml +--- +:todo: +- dart-sass + <===> hue/var/input.scss @use 'sass:color'; a {b: color.hwb(var(--c) 30% 40%)} @@ -115,7 +120,7 @@ Error: $hue: var(--c) is not a number. a {b: color.hwb(0 "foo" 40%)} <===> whiteness/type/error -Error: $whiteness: "foo" is not a number. +Error: $channels: Expected whiteness "foo" to be a number. , 2 | a {b: color.hwb(0 "foo" 40%)} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -152,6 +157,11 @@ Error: $whiteness: Expected 30px to have unit "%". <===> ================================================================================ +<===> whiteness/too_high/options.yml +--- +:todo: +- dart-sass + <===> whiteness/too_high/input.scss @use 'sass:color'; a {b: color.hwb(0 101% 40%)} @@ -166,6 +176,11 @@ Error: $whiteness: Expected 101% to be within 0% and 100%. <===> ================================================================================ +<===> whiteness/too_low/options.yml +--- +:todo: +- dart-sass + <===> whiteness/too_low/input.scss @use 'sass:color'; a {b: color.hwb(0 -1% 40%)} @@ -180,6 +195,11 @@ Error: $whiteness: Expected -1% to be within 0% and 100%. <===> ================================================================================ +<===> whiteness/var/options.yml +--- +:todo: +- dart-sass + <===> whiteness/var/input.scss @use 'sass:color'; a {b: color.hwb(0 var(--c) 40%)} @@ -199,7 +219,7 @@ Error: $whiteness: var(--c) is not a number. a {b: color.hwb(0 30% "foo")} <===> blackness/type/error -Error: $blackness: "foo" is not a number. +Error: $channels: Expected blackness "foo" to be a number. , 2 | a {b: color.hwb(0 30% "foo")} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -236,6 +256,11 @@ Error: $blackness: Expected 40px to have unit "%". <===> ================================================================================ +<===> blackness/too_high/options.yml +--- +:todo: +- dart-sass + <===> blackness/too_high/input.scss @use 'sass:color'; a {b: color.hwb(0 30% 101%)} @@ -250,6 +275,11 @@ Error: $blackness: Expected 101% to be within 0% and 100%. <===> ================================================================================ +<===> blackness/too_low/options.yml +--- +:todo: +- dart-sass + <===> blackness/too_low/input.scss @use 'sass:color'; a {b: color.hwb(0 30% -1%)} @@ -262,6 +292,13 @@ Error: $blackness: Expected -1% to be within 0% and 100%. ' input.scss 2:7 root stylesheet +<===> +================================================================================ +<===> blackness/var/options.yml +--- +:todo: +- dart-sass + <===> ================================================================================ <===> blackness/var/no_alpha/input.scss @@ -294,18 +331,23 @@ Error: Expected numeric channels, got "hwb(0 30% var(--c)/0.5px)". ================================================================================ <===> alpha/unit/input.scss @use 'sass:color'; -a {b: color.hwb(0 0 0 / 0.5px)} +a {b: color.hwb(0 0% 0% / 0.5px)} <===> alpha/unit/error -Error: $whiteness: Expected 0 to have unit "%". +Error: $alpha: Expected 0.5px to have no units or "%". , -2 | a {b: color.hwb(0 0 0 / 0.5px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^ +2 | a {b: color.hwb(0 0% 0% / 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 2:7 root stylesheet <===> ================================================================================ +<===> alpha/var/options.yml +--- +:todo: +- dart-sass + <===> alpha/var/input.scss @use 'sass:color'; a {b: color.hwb(0 0 0 / var(--c))} @@ -325,7 +367,7 @@ Error: Expected numeric channels, got "hwb(0 0 0/var(--c))". a {b: color.hwb(0 30% "var(--foo) / 0.4")} <===> quoted_var_slash/error -Error: $blackness: "var(--foo) / 0.4" is not a number. +Error: $channels: Expected blackness "var(--foo) / 0.4" to be a number. , 2 | a {b: color.hwb(0 30% "var(--foo) / 0.4")} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/hwb/error/three_args.hrx b/spec/core_functions/color/hwb/error/three_args.hrx index 4550021c60..558f605fa9 100644 --- a/spec/core_functions/color/hwb/error/three_args.hrx +++ b/spec/core_functions/color/hwb/error/three_args.hrx @@ -3,7 +3,7 @@ a {b: color.hwb("foo", 100%, 50%)} <===> hue/type/error -Error: $hue: "foo" is not a number. +Error: Expected hue "foo" to be a number. , 2 | a {b: color.hwb("foo", 100%, 50%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -25,7 +25,7 @@ Error: argument `$hue` of `hwb($hue, $whiteness, $blackness)` must be a number a {b: color.hwb(0, "foo", 50%)} <===> whiteness/type/error -Error: $whiteness: "foo" is not a number. +Error: Expected whiteness "foo" to be a number. , 2 | a {b: color.hwb(0, "foo", 50%)} | ^^^^^^^^^^^^^^^^^^^^^^^^ @@ -47,7 +47,7 @@ Error: argument `$whiteness` of `hwb($hue, $whiteness, $blackness)` must be a nu a {b: color.hwb(0, 100%, "foo")} <===> blackness/type/error -Error: $blackness: "foo" is not a number. +Error: Expected blackness "foo" to be a number. , 2 | a {b: color.hwb(0, 100%, "foo")} | ^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/hwb/four_args.hrx b/spec/core_functions/color/hwb/four_args.hrx index 562bacabab..10ac54f206 100644 --- a/spec/core_functions/color/hwb/four_args.hrx +++ b/spec/core_functions/color/hwb/four_args.hrx @@ -4,7 +4,7 @@ a {b: color.hwb(0, 0%, 0%, -10%)} <===> alpha/percent/negative/output.css a { - b: rgba(255, 0, 0, 0); + b: hsla(0deg, 100%, 50%, 0); } <===> @@ -15,7 +15,7 @@ a {b: color.hwb(0, 0%, 0%, 0%)} <===> alpha/percent/min/output.css a { - b: rgba(255, 0, 0, 0); + b: hsla(0deg, 100%, 50%, 0); } <===> @@ -26,7 +26,7 @@ a {b: color.hwb(0, 0%, 0%, 45.6%)} <===> alpha/percent/positive/output.css a { - b: rgba(255, 0, 0, 0.456); + b: hsla(0deg, 100%, 50%, 0.456); } <===> @@ -59,7 +59,7 @@ a {b: color.hwb(0, 0%, 0%, -10)} <===> alpha/unitless/negative/output.css a { - b: rgba(255, 0, 0, 0); + b: hsla(0deg, 100%, 50%, 0); } <===> @@ -70,7 +70,7 @@ a {b: color.hwb(0, 0%, 0%, 0)} <===> alpha/unitless/min/output.css a { - b: rgba(255, 0, 0, 0); + b: hsla(0deg, 100%, 50%, 0); } <===> @@ -81,7 +81,7 @@ a {b: color.hwb(0, 0%, 0%, 0.456)} <===> alpha/unitless/positive/output.css a { - b: rgba(255, 0, 0, 0.456); + b: hsla(0deg, 100%, 50%, 0.456); } <===> @@ -114,5 +114,5 @@ a {b: color.hwb($hue: 180, $whiteness: 30%, $blackness: 40%, $alpha: 0.4)} <===> named/output.css a { - b: rgba(77, 153, 153, 0.4); + b: hsla(180deg, 33.3333333333%, 45%, 0.4); } diff --git a/spec/core_functions/color/hwb/one_arg.hrx b/spec/core_functions/color/hwb/one_arg.hrx index 85d4d19265..180e4b6e5e 100644 --- a/spec/core_functions/color/hwb/one_arg.hrx +++ b/spec/core_functions/color/hwb/one_arg.hrx @@ -4,7 +4,7 @@ a {b: color.hwb(180 30% 40% / 0)} <===> alpha/in_gamut/transparent/output.css a { - b: rgba(77, 153, 153, 0); + b: hsla(180deg, 33.3333333333%, 45%, 0); } <===> @@ -15,7 +15,7 @@ a {b: color.hwb(180 30% 40% / 1)} <===> alpha/in_gamut/opaque/output.css a { - b: #4d9999; + b: hsl(180deg, 33.3333333333%, 45%); } <===> @@ -26,7 +26,7 @@ a {b: color.hwb(180 30% 40% / 0.5)} <===> alpha/in_gamut/partial/output.css a { - b: rgba(77, 153, 153, 0.5); + b: hsla(180deg, 33.3333333333%, 45%, 0.5); } <===> @@ -37,7 +37,7 @@ a {b: color.hwb($channels: 180 30% 40% / 0.4)} <===> alpha/in_gamut/named/output.css a { - b: rgba(77, 153, 153, 0.4); + b: hsla(180deg, 33.3333333333%, 45%, 0.4); } <===> @@ -50,7 +50,7 @@ a {b: (color.hwb(180 30% 40% / 0.4))} <===> alpha/in_gamut/parenthesized/output.css a { - b: rgba(77, 153, 153, 0.4); + b: hsla(180deg, 33.3333333333%, 45%, 0.4); } <===> @@ -61,7 +61,7 @@ a {b: color.hwb(0 30% 40% / 1.1)} <===> alpha/clamped/above/output.css a { - b: #994d4d; + b: hsl(0deg, 33.3333333333%, 45%); } <===> @@ -72,7 +72,7 @@ a {b: color.hwb(0 30% 40% / -0.1)} <===> alpha/clamped/below/output.css a { - b: rgba(153, 77, 77, 0); + b: hsla(0deg, 33.3333333333%, 45%, 0); } <===> @@ -83,7 +83,7 @@ a {b: color.hwb(180 30% 40%)} <===> no_alpha/output.css a { - b: #4d9999; + b: hsl(180deg, 33.3333333333%, 45%); } <===> @@ -94,5 +94,5 @@ a {b: color.hwb($channels: 180 30% 40% / 0.4)} <===> named/output.css a { - b: rgba(77, 153, 153, 0.4); + b: hsla(180deg, 33.3333333333%, 45%, 0.4); } diff --git a/spec/core_functions/color/hwb/three_args/named.hrx b/spec/core_functions/color/hwb/three_args/named.hrx index 90680131ba..2f8eca8a7c 100644 --- a/spec/core_functions/color/hwb/three_args/named.hrx +++ b/spec/core_functions/color/hwb/three_args/named.hrx @@ -4,6 +4,5 @@ a {b: color.hwb($hue: 0, $whiteness: 30%, $blackness: 40%)} <===> output.css a { - b: #994d4d; + b: hsl(0deg, 33.3333333333%, 45%); } - diff --git a/spec/core_functions/color/hwb/three_args/units.hrx b/spec/core_functions/color/hwb/three_args/units.hrx index 2c422d22fb..26ff6f60db 100644 --- a/spec/core_functions/color/hwb/three_args/units.hrx +++ b/spec/core_functions/color/hwb/three_args/units.hrx @@ -4,7 +4,7 @@ a {b: color.hwb(0deg, 30%, 40%)} <===> hue/deg/output.css a { - b: #994d4d; + b: hsl(0deg, 33.3333333333%, 45%); } <===> @@ -15,7 +15,7 @@ a {b: color.hwb(1rad, 30%, 40%)} <===> hue/rad/output.css a { - b: #99964d; + b: hsl(57.2957795131deg, 33.3333333333%, 45%); } <===> @@ -26,7 +26,7 @@ a {b: color.hwb(1in, 30%, 40%)} <===> hue/non_angle/output.css a { - b: #994e4d; + b: hsl(1deg, 33.3333333333%, 45%); } <===> hue/non_angle/warning diff --git a/spec/core_functions/color/hwb/three_args/w3c/blue_magentas.hrx b/spec/core_functions/color/hwb/three_args/w3c/blue_magentas.hrx index 5eeac1e6e0..1de1809a9f 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/blue_magentas.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/blue_magentas.hrx @@ -4,55 +4,55 @@ <===> output.css whiteness-0 { - blackness-0: #8000ff; + blackness-0: hsl(270deg, 100%, 50%); blackness-20: #6600cc; - blackness-40: #4d0099; + blackness-40: hsl(270deg, 100%, 30%); blackness-60: #330066; - blackness-80: #1a0033; + blackness-80: hsl(270deg, 100%, 10%); blackness-100: black; } whiteness-20 { blackness-0: #9933ff; - blackness-20: #8033cc; + blackness-20: hsl(270deg, 60%, 50%); blackness-40: rebeccapurple; - blackness-60: #4d3366; + blackness-60: hsl(270deg, 33.3333333333%, 30%); blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { - blackness-0: #b366ff; + blackness-0: hsl(270deg, 100%, 70%); blackness-20: #9966cc; - blackness-40: #806699; + blackness-40: hsl(270deg, 20%, 50%); blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #cc99ff; - blackness-20: #b399cc; + blackness-20: hsl(270deg, 33.3333333333%, 70%); blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { - blackness-0: #e6ccff; + blackness-0: hsl(270deg, 100%, 90%); blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/blues.hrx b/spec/core_functions/color/hwb/three_args/w3c/blues.hrx index 135c9b2e59..138c196a77 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/blues.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/blues.hrx @@ -18,7 +18,7 @@ whiteness-20 { blackness-40: #333399; blackness-60: #333366; blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { @@ -27,32 +27,32 @@ whiteness-40 { blackness-40: #666699; blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #9999ff; blackness-20: #9999cc; blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { blackness-0: #ccccff; blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/cyan_blues.hrx b/spec/core_functions/color/hwb/three_args/w3c/cyan_blues.hrx index 11146aa6c9..e37cc4016c 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/cyan_blues.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/cyan_blues.hrx @@ -4,55 +4,55 @@ <===> output.css whiteness-0 { - blackness-0: #0080ff; + blackness-0: hsl(210deg, 100%, 50%); blackness-20: #0066cc; - blackness-40: #004d99; + blackness-40: hsl(210deg, 100%, 30%); blackness-60: #003366; - blackness-80: #001a33; + blackness-80: hsl(210deg, 100%, 10%); blackness-100: black; } whiteness-20 { blackness-0: #3399ff; - blackness-20: #3380cc; + blackness-20: hsl(210deg, 60%, 50%); blackness-40: #336699; - blackness-60: #334d66; + blackness-60: hsl(210deg, 33.3333333333%, 30%); blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { - blackness-0: #66b3ff; + blackness-0: hsl(210deg, 100%, 70%); blackness-20: #6699cc; - blackness-40: #668099; + blackness-40: hsl(210deg, 20%, 50%); blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #99ccff; - blackness-20: #99b3cc; + blackness-20: hsl(210deg, 33.3333333333%, 70%); blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { - blackness-0: #cce6ff; + blackness-0: hsl(210deg, 100%, 90%); blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/cyans.hrx b/spec/core_functions/color/hwb/three_args/w3c/cyans.hrx index 21d546362d..c98a63e6c6 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/cyans.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/cyans.hrx @@ -18,7 +18,7 @@ whiteness-20 { blackness-40: #339999; blackness-60: #336666; blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { @@ -27,32 +27,32 @@ whiteness-40 { blackness-40: #669999; blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #99ffff; blackness-20: #99cccc; blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { blackness-0: #ccffff; blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/green_cyans.hrx b/spec/core_functions/color/hwb/three_args/w3c/green_cyans.hrx index 13ed6d59c0..f9ba8875ec 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/green_cyans.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/green_cyans.hrx @@ -4,55 +4,55 @@ <===> output.css whiteness-0 { - blackness-0: #00ff80; + blackness-0: hsl(150deg, 100%, 50%); blackness-20: #00cc66; - blackness-40: #00994d; + blackness-40: hsl(150deg, 100%, 30%); blackness-60: #006633; - blackness-80: #00331a; + blackness-80: hsl(150deg, 100%, 10%); blackness-100: black; } whiteness-20 { blackness-0: #33ff99; - blackness-20: #33cc80; + blackness-20: hsl(150deg, 60%, 50%); blackness-40: #339966; - blackness-60: #33664d; + blackness-60: hsl(150deg, 33.3333333333%, 30%); blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { - blackness-0: #66ffb3; + blackness-0: hsl(150deg, 100%, 70%); blackness-20: #66cc99; - blackness-40: #669980; + blackness-40: hsl(150deg, 20%, 50%); blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #99ffcc; - blackness-20: #99ccb3; + blackness-20: hsl(150deg, 33.3333333333%, 70%); blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { - blackness-0: #ccffe6; + blackness-0: hsl(150deg, 100%, 90%); blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/greens.hrx b/spec/core_functions/color/hwb/three_args/w3c/greens.hrx index eda752e084..eaa5bd93f2 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/greens.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/greens.hrx @@ -18,7 +18,7 @@ whiteness-20 { blackness-40: #339933; blackness-60: #336633; blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { @@ -27,32 +27,32 @@ whiteness-40 { blackness-40: #669966; blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #99ff99; blackness-20: #99cc99; blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { blackness-0: #ccffcc; blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/magenta_reds.hrx b/spec/core_functions/color/hwb/three_args/w3c/magenta_reds.hrx index 41d254bd5e..0ec6ed2327 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/magenta_reds.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/magenta_reds.hrx @@ -4,55 +4,55 @@ <===> output.css whiteness-0 { - blackness-0: #ff0080; + blackness-0: hsl(330deg, 100%, 50%); blackness-20: #cc0066; - blackness-40: #99004d; + blackness-40: hsl(330deg, 100%, 30%); blackness-60: #660033; - blackness-80: #33001a; + blackness-80: hsl(330deg, 100%, 10%); blackness-100: black; } whiteness-20 { blackness-0: #ff3399; - blackness-20: #cc3380; + blackness-20: hsl(330deg, 60%, 50%); blackness-40: #993366; - blackness-60: #66334d; + blackness-60: hsl(330deg, 33.3333333333%, 30%); blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { - blackness-0: #ff66b3; + blackness-0: hsl(330deg, 100%, 70%); blackness-20: #cc6699; - blackness-40: #996680; + blackness-40: hsl(330deg, 20%, 50%); blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #ff99cc; - blackness-20: #cc99b3; + blackness-20: hsl(330deg, 33.3333333333%, 70%); blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { - blackness-0: #ffcce6; + blackness-0: hsl(330deg, 100%, 90%); blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/magentas.hrx b/spec/core_functions/color/hwb/three_args/w3c/magentas.hrx index 4d288342cf..ff59010e3a 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/magentas.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/magentas.hrx @@ -18,7 +18,7 @@ whiteness-20 { blackness-40: #993399; blackness-60: #663366; blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { @@ -27,32 +27,32 @@ whiteness-40 { blackness-40: #996699; blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #ff99ff; blackness-20: #cc99cc; blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { blackness-0: #ffccff; blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/oranges.hrx b/spec/core_functions/color/hwb/three_args/w3c/oranges.hrx index 8075f9a5ab..2653728396 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/oranges.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/oranges.hrx @@ -4,55 +4,55 @@ <===> output.css whiteness-0 { - blackness-0: #ff8000; + blackness-0: hsl(30deg, 100%, 50%); blackness-20: #cc6600; - blackness-40: #994d00; + blackness-40: hsl(30deg, 100%, 30%); blackness-60: #663300; - blackness-80: #331a00; + blackness-80: hsl(30deg, 100%, 10%); blackness-100: black; } whiteness-20 { blackness-0: #ff9933; - blackness-20: #cc8033; + blackness-20: hsl(30deg, 60%, 50%); blackness-40: #996633; - blackness-60: #664d33; + blackness-60: hsl(30deg, 33.3333333333%, 30%); blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { - blackness-0: #ffb366; + blackness-0: hsl(30deg, 100%, 70%); blackness-20: #cc9966; - blackness-40: #998066; + blackness-40: hsl(30deg, 20%, 50%); blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #ffcc99; - blackness-20: #ccb399; + blackness-20: hsl(30deg, 33.3333333333%, 70%); blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { - blackness-0: #ffe6cc; + blackness-0: hsl(30deg, 100%, 90%); blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/reds.hrx b/spec/core_functions/color/hwb/three_args/w3c/reds.hrx index 846cbd3240..20bd6a78bc 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/reds.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/reds.hrx @@ -18,7 +18,7 @@ whiteness-20 { blackness-40: #993333; blackness-60: #663333; blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { @@ -27,32 +27,32 @@ whiteness-40 { blackness-40: #996666; blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #ff9999; blackness-20: #cc9999; blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { blackness-0: #ffcccc; blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/yellow_greens.hrx b/spec/core_functions/color/hwb/three_args/w3c/yellow_greens.hrx index 24ff268a9e..0e478a1356 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/yellow_greens.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/yellow_greens.hrx @@ -4,55 +4,55 @@ <===> output.css whiteness-0 { - blackness-0: #80ff00; + blackness-0: hsl(90deg, 100%, 50%); blackness-20: #66cc00; - blackness-40: #4d9900; + blackness-40: hsl(90deg, 100%, 30%); blackness-60: #336600; - blackness-80: #1a3300; + blackness-80: hsl(90deg, 100%, 10%); blackness-100: black; } whiteness-20 { blackness-0: #99ff33; - blackness-20: #80cc33; + blackness-20: hsl(90deg, 60%, 50%); blackness-40: #669933; - blackness-60: #4d6633; + blackness-60: hsl(90deg, 33.3333333333%, 30%); blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { - blackness-0: #b3ff66; + blackness-0: hsl(90deg, 100%, 70%); blackness-20: #99cc66; - blackness-40: #809966; + blackness-40: hsl(90deg, 20%, 50%); blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #ccff99; - blackness-20: #b3cc99; + blackness-20: hsl(90deg, 33.3333333333%, 70%); blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { - blackness-0: #e6ffcc; + blackness-0: hsl(90deg, 100%, 90%); blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/hwb/three_args/w3c/yellows.hrx b/spec/core_functions/color/hwb/three_args/w3c/yellows.hrx index 76322fe532..ebdbed7039 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/yellows.hrx +++ b/spec/core_functions/color/hwb/three_args/w3c/yellows.hrx @@ -18,7 +18,7 @@ whiteness-20 { blackness-40: #999933; blackness-60: #666633; blackness-80: #333333; - blackness-100: #2b2b2b; + blackness-100: hsl(0deg, 0%, 16.6666666667%); } whiteness-40 { @@ -27,32 +27,32 @@ whiteness-40 { blackness-40: #999966; blackness-60: #666666; blackness-80: #555555; - blackness-100: #494949; + blackness-100: hsl(0deg, 0%, 28.5714285714%); } whiteness-60 { blackness-0: #ffff99; blackness-20: #cccc99; blackness-40: #999999; - blackness-60: gray; - blackness-80: #6d6d6d; - blackness-100: #606060; + blackness-60: hsl(0deg, 0%, 50%); + blackness-80: hsl(0deg, 0%, 42.8571428571%); + blackness-100: hsl(0deg, 0%, 37.5%); } whiteness-80 { blackness-0: #ffffcc; blackness-20: #cccccc; blackness-40: #aaaaaa; - blackness-60: #929292; - blackness-80: gray; - blackness-100: #717171; + blackness-60: hsl(0deg, 0%, 57.1428571429%); + blackness-80: hsl(0deg, 0%, 50%); + blackness-100: hsl(0deg, 0%, 44.4444444444%); } whiteness-100 { blackness-0: white; - blackness-20: #d5d5d5; - blackness-40: #b6b6b6; - blackness-60: #9f9f9f; - blackness-80: #8e8e8e; - blackness-100: gray; + blackness-20: hsl(0deg, 0%, 83.3333333333%); + blackness-40: hsl(0deg, 0%, 71.4285714286%); + blackness-60: hsl(0deg, 0%, 62.5%); + blackness-80: hsl(0deg, 0%, 55.5555555556%); + blackness-100: hsl(0deg, 0%, 50%); } diff --git a/spec/core_functions/color/invert.hrx b/spec/core_functions/color/invert.hrx index fb0d8976a6..0f85750e29 100644 --- a/spec/core_functions/color/invert.hrx +++ b/spec/core_functions/color/invert.hrx @@ -182,8 +182,8 @@ Error: Missing argument $color. | ^^^^^^^^ invocation ' ,--> sass:color -1 | @function invert($color, $weight: 100%) { - | ============================= declaration +1 | @function invert($color, $weight: 100%, $space: null) { + | =========================================== declaration ' input.scss 1:7 root stylesheet @@ -196,6 +196,11 @@ Error: Function invert is missing argument $color. <===> ================================================================================ +<===> error/too_many_args/options.yml +--- +:todo: +- dart-sass + <===> error/too_many_args/input.scss a {b: invert(turquoise, 0%, 1)} diff --git a/spec/core_functions/color/lighten.hrx b/spec/core_functions/color/lighten.hrx index c628ee432b..3bbd9a97da 100644 --- a/spec/core_functions/color/lighten.hrx +++ b/spec/core_functions/color/lighten.hrx @@ -32,6 +32,11 @@ a { a {b: lighten(red, 14%)} <===> middle/output.css +a { + b: rgb(255, 71.4, 71.4); +} + +<===> middle/output-libsass.css a { b: #ff4747; } @@ -42,6 +47,11 @@ a { a {b: lighten(red, 0.5%)} <===> fraction/output.css +a { + b: rgb(255, 2.55, 2.55); +} + +<===> fraction/output-libsass.css a { b: #ff0303; } @@ -62,6 +72,11 @@ a { a {b: lighten($color: red, $amount: 14%)} <===> named/output.css +a { + b: rgb(255, 71.4, 71.4); +} + +<===> named/output-libsass.css a { b: #ff4747; } diff --git a/spec/core_functions/color/mix.hrx b/spec/core_functions/color/mix.hrx index 2f6d21c09d..cb1e74bed9 100644 --- a/spec/core_functions/color/mix.hrx +++ b/spec/core_functions/color/mix.hrx @@ -268,6 +268,10 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ +<===> error/too_many_args/options.yml +:todo: + - dart-sass + <===> error/too_many_args/input.scss a {b: mix(red, blue, 100, 1)} @@ -302,8 +306,8 @@ Error: Missing argument $color2. | ^^^^^^^^ invocation ' ,--> sass:color -1 | @function mix($color1, $color2, $weight: 50%) { - | =================================== declaration +1 | @function mix($color1, $color2, $weight: 50%, $method: null) { + | ================================================== declaration ' input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/rgb/error/one_arg.hrx b/spec/core_functions/color/rgb/error/one_arg.hrx index 28225d6b9c..dde5bfa30c 100644 --- a/spec/core_functions/color/rgb/error/one_arg.hrx +++ b/spec/core_functions/color/rgb/error/one_arg.hrx @@ -11,7 +11,7 @@ a { } <===> list/empty/error -Error: Missing element $red. +Error: $channels: Color component list may not be empty. , 2 | b: rgb(()); | ^^^^^^^ @@ -26,7 +26,7 @@ a { } <===> list/one_element/error -Error: Missing element $green. +Error: $channels: The rgb color space has 3 channels but 1 has 1. , 2 | b: rgb(1); | ^^^^^^ @@ -41,7 +41,7 @@ a { } <===> list/two_elements/error -Error: Missing element $blue. +Error: $channels: The rgb color space has 3 channels but (1 2) has 2. , 2 | b: rgb(1 2); | ^^^^^^^^ @@ -56,7 +56,7 @@ a { } <===> list/four_elements/error -Error: Only 3 elements allowed, but 4 were passed. +Error: $channels: The rgb color space has 3 channels but (1 2 3 0.4) has 4. , 2 | b: rgb(1 2 3 0.4); | ^^^^^^^^^^^^^^ @@ -71,7 +71,7 @@ a { } <===> list/comma_separated/error -Error: $channels must be a space-separated list. +Error: $channels: Expected a space- or slash-separated list, was (1, 2, 3) , 2 | b: rgb((1, 2, 3)); | ^^^^^^^^^^^^^^ @@ -86,7 +86,7 @@ a { } <===> list/bracketed/error -Error: $channels must be an unbracketed list. +Error: $channels: Expected an unbracketed list, was [1 2 3] , 2 | b: rgb([1 2 3]); | ^^^^^^^^^^^^ @@ -101,7 +101,7 @@ a { } <===> type/red/error -Error: $red: "foo" is not a number. +Error: $channels: Expected red "foo" to be a number. , 2 | b: rgb("foo" 2 3); | ^^^^^^^^^^^^^^ @@ -116,7 +116,7 @@ a { } <===> type/green/error -Error: $green: "foo" is not a number. +Error: $channels: Expected green "foo" to be a number. , 2 | b: rgb(1 "foo" 3); | ^^^^^^^^^^^^^^ @@ -131,7 +131,7 @@ a { } <===> type/blue/error -Error: $blue: "foo" is not a number. +Error: $channels: Expected blue "foo" to be a number. , 2 | b: rgb(1 2 "foo"); | ^^^^^^^^^^^^^^ @@ -146,7 +146,7 @@ a { } <===> quoted_var_slash/error -Error: $blue: "var(--foo) / 0.4" is not a number. +Error: $channels: Expected blue "var(--foo) / 0.4" to be a number. , 2 | b: rgb(1 2 "var(--foo) / 0.4"); | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -187,7 +187,7 @@ Error: Only 2 slash-separated elements allowed, but 3 were passed. a {b: rgb(list.slash((), 1))} <===> slash_list/channels/empty/error -Error: Missing element $red. +Error: $channels: Color component list may not be empty. , 2 | a {b: rgb(list.slash((), 1))} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -201,7 +201,7 @@ Error: Missing element $red. a {b: rgb(list.slash((1, 2, 3), 1))} <===> slash_list/channels/comma_separated/error -Error: $channels must be a space-separated list. +Error: $channels: Expected a space-separated list, was (1, 2, 3) , 2 | a {b: rgb(list.slash((1, 2, 3), 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -215,7 +215,7 @@ Error: $channels must be a space-separated list. a {b: rgb(list.slash([1 2 3], 1))} <===> slash_list/channels/bracketed/error -Error: $channels must be an unbracketed list. +Error: $channels: Expected an unbracketed list, was [1 2 3] , 2 | a {b: rgb(list.slash([1 2 3], 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -229,7 +229,7 @@ Error: $channels must be an unbracketed list. a {b: rgb(list.slash(1, 1))} <===> slash_list/channels/one_element/error -Error: Missing element $green. +Error: $channels: The rgb color space has 3 channels but (1 / 1) has 1. , 2 | a {b: rgb(list.slash(1, 1))} | ^^^^^^^^^^^^^^^^^^^^^ @@ -243,7 +243,7 @@ Error: Missing element $green. a {b: rgb(list.slash(1 2, 1))} <===> slash_list/channels/two_elements/error -Error: Missing element $blue. +Error: $channels: The rgb color space has 3 channels but (1 2 / 1) has 2. , 2 | a {b: rgb(list.slash(1 2, 1))} | ^^^^^^^^^^^^^^^^^^^^^^^ @@ -257,7 +257,7 @@ Error: Missing element $blue. a {b: rgb(list.slash(1 2 3 0.4, 1))} <===> slash_list/channels/four_elements/error -Error: Only 3 elements allowed, but 4 were passed. +Error: $channels: The rgb color space has 3 channels but (1 2 3 0.4 / 1) has 4. , 2 | a {b: rgb(list.slash(1 2 3 0.4, 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/rgb/four_args/clamped.hrx b/spec/core_functions/color/rgb/four_args/clamped.hrx index ea4e6788df..ca9c6caf7a 100644 --- a/spec/core_functions/color/rgb/four_args/clamped.hrx +++ b/spec/core_functions/color/rgb/four_args/clamped.hrx @@ -3,6 +3,10 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ +<===> red/options.yml +:todo: + - dart-sass + <===> red/input.scss a {b: rgb(256, 0, 0, 0.5)} @@ -13,6 +17,10 @@ a { <===> ================================================================================ +<===> green/options.yml +:todo: + - dart-sass + <===> green/input.scss a {b: rgb(0, -1, 0, 0.5)} @@ -23,6 +31,10 @@ a { <===> ================================================================================ +<===> blue/options.yml +:todo: + - dart-sass + <===> blue/input.scss a {b: rgb(0, 0, 9999, 0.5)} diff --git a/spec/core_functions/color/rgb/one_arg/alpha.hrx b/spec/core_functions/color/rgb/one_arg/alpha.hrx index 4de884a8cd..c9b346d325 100644 --- a/spec/core_functions/color/rgb/one_arg/alpha.hrx +++ b/spec/core_functions/color/rgb/one_arg/alpha.hrx @@ -64,6 +64,10 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ +<===> clamped/red/options.yml +:todo: + - dart-sass + <===> clamped/red/input.scss a {b: rgb(256 0 0 / 0.5)} @@ -74,6 +78,10 @@ a { <===> ================================================================================ +<===> clamped/green/options.yml +:todo: + - dart-sass + <===> clamped/green/input.scss a {b: rgb(0 -1 0 / 0.5)} @@ -84,6 +92,10 @@ a { <===> ================================================================================ +<===> clamped/blue/options.yml +:todo: + - dart-sass + <===> clamped/blue/input.scss a {b: rgb(0 0 9999 / 0.5)} diff --git a/spec/core_functions/color/rgb/one_arg/no_alpha.hrx b/spec/core_functions/color/rgb/one_arg/no_alpha.hrx index 6d1dc4b243..efcd185a4e 100644 --- a/spec/core_functions/color/rgb/one_arg/no_alpha.hrx +++ b/spec/core_functions/color/rgb/one_arg/no_alpha.hrx @@ -48,6 +48,10 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ +<===> unitless/clamped/red/options.yml +:todo: + - dart-sass + <===> unitless/clamped/red/input.scss a {b: rgb(256 0 0)} @@ -58,6 +62,10 @@ a { <===> ================================================================================ +<===> unitless/clamped/green/options.yml +:todo: + - dart-sass + <===> unitless/clamped/green/input.scss a {b: rgb(0 -1 0)} @@ -68,6 +76,10 @@ a { <===> ================================================================================ +<===> unitless/clamped/blue/options.yml +:todo: + - dart-sass + <===> unitless/clamped/blue/input.scss a {b: rgb(0 0 9999)} @@ -89,7 +101,7 @@ a {b: rgb(7.1% 20.4% 33.9%)} <===> percents/all/percent/output.css a { - b: rgb(18, 52, 86); + b: rgb(18.105, 52.02, 86.445); } <===> @@ -99,7 +111,7 @@ a {b: rgb(74.7% 173 93%)} <===> percents/unitless/green/output.css a { - b: rgb(190, 173, 237); + b: rgb(190.485, 173, 237.15); } <===> @@ -109,7 +121,7 @@ a {b: rgb(190 68% 237)} <===> percents/percent/green/output.css a { - b: rgb(190, 173, 237); + b: rgb(190, 173.4, 237); } <===> @@ -119,7 +131,7 @@ a {b: rgb(0% 100% 50%)} <===> percents/boundaries/output.css a { - b: rgb(0, 255, 128); + b: rgb(0, 255, 127.5); } <===> @@ -129,6 +141,10 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ +<===> percents/clamped/red/options.yml +:todo: + - dart-sass + <===> percents/clamped/red/input.scss a {b: rgb(100.1% 0 0)} @@ -139,6 +155,10 @@ a { <===> ================================================================================ +<===> percents/clamped/green/options.yml +:todo: + - dart-sass + <===> percents/clamped/green/input.scss a {b: rgb(0 -0.1% 0)} @@ -149,6 +169,10 @@ a { <===> ================================================================================ +<===> percents/clamped/blue/options.yml +:todo: + - dart-sass + <===> percents/clamped/blue/input.scss a {b: rgb(0 0 200%)} diff --git a/spec/core_functions/color/rgb/three_args/percents.hrx b/spec/core_functions/color/rgb/three_args/percents.hrx index 28fca22495..b49becab10 100644 --- a/spec/core_functions/color/rgb/three_args/percents.hrx +++ b/spec/core_functions/color/rgb/three_args/percents.hrx @@ -9,7 +9,7 @@ a {b: rgb(7.1%, 20.4%, 33.9%)} <===> all/percent/output.css a { - b: rgb(18, 52, 86); + b: rgb(18.105, 52.02, 86.445); } <===> all/percent/output-libsass.css @@ -24,7 +24,7 @@ a {b: rgb(74.7%, 173, 93%)} <===> unitless/green/output.css a { - b: rgb(190, 173, 237); + b: rgb(190.485, 173, 237.15); } <===> unitless/green/output-libsass.css @@ -39,7 +39,7 @@ a {b: rgb(190, 68%, 237)} <===> percent/green/output.css a { - b: rgb(190, 173, 237); + b: rgb(190, 173.4, 237); } <===> percent/green/output-libsass.css @@ -54,7 +54,7 @@ a {b: rgb(0%, 100%, 50%)} <===> boundaries/output.css a { - b: rgb(0, 255, 128); + b: rgb(0, 255, 127.5); } <===> boundaries/output-libsass.css @@ -69,6 +69,10 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ +<===> clamped/red/options.yml +:todo: + - dart-sass + <===> clamped/red/input.scss a {b: rgb(100.1%, 0, 0)} @@ -84,6 +88,10 @@ a { <===> ================================================================================ +<===> clamped/green/options.yml +:todo: + - dart-sass + <===> clamped/green/input.scss a {b: rgb(0, -0.1%, 0)} @@ -99,6 +107,10 @@ a { <===> ================================================================================ +<===> clamped/blue/options.yml +:todo: + - dart-sass + <===> clamped/blue/input.scss a {b: rgb(0, 0, 200%)} diff --git a/spec/core_functions/color/rgb/three_args/unitless.hrx b/spec/core_functions/color/rgb/three_args/unitless.hrx index fc560da604..2f1f4262b9 100644 --- a/spec/core_functions/color/rgb/three_args/unitless.hrx +++ b/spec/core_functions/color/rgb/three_args/unitless.hrx @@ -68,6 +68,10 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ +<===> clamped/red/options.yml +:todo: + - dart-sass + <===> clamped/red/input.scss a {b: rgb(256, 0, 0)} @@ -83,6 +87,10 @@ a { <===> ================================================================================ +<===> clamped/green/options.yml +:todo: + - dart-sass + <===> clamped/green/input.scss a {b: rgb(0, -1, 0)} @@ -98,6 +106,10 @@ a { <===> ================================================================================ +<===> clamped/blue/options.yml +:todo: + - dart-sass + <===> clamped/blue/input.scss a {b: rgb(0, 0, 9999)} diff --git a/spec/core_functions/color/saturate.hrx b/spec/core_functions/color/saturate.hrx index 45b58c2ee4..913e6c8a60 100644 --- a/spec/core_functions/color/saturate.hrx +++ b/spec/core_functions/color/saturate.hrx @@ -74,6 +74,11 @@ a { a {b: saturate(plum, 14%)} <===> two_args/middle/output.css +a { + b: rgb(230.03, 150.97, 230.03); +} + +<===> two_args/middle/output-libsass.css a { b: #e697e6; } @@ -94,6 +99,11 @@ a { a {b: saturate($color: plum, $amount: 14%)} <===> two_args/named/output.css +a { + b: rgb(230.03, 150.97, 230.03); +} + +<===> two_args/named/output-libsass.css a { b: #e697e6; } diff --git a/spec/core_functions/color/scale_color/error/args.hrx b/spec/core_functions/color/scale_color/error/args.hrx index bd3c6c6b5a..f3a9931c2d 100644 --- a/spec/core_functions/color/scale_color/error/args.hrx +++ b/spec/core_functions/color/scale_color/error/args.hrx @@ -49,7 +49,7 @@ Error: Only one positional argument is allowed. All other arguments must be pass a {b: scale-color(red, $hue: 10%)} <===> unknown/error -Error: No argument named $hue. +Error: $hue: Channel isn't scalable. , 1 | a {b: scale-color(red, $hue: 10%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/scale_color/error/mixed_formats.hrx b/spec/core_functions/color/scale_color/error/mixed_formats.hrx index 92d2ac71fe..a73c1f0a34 100644 --- a/spec/core_functions/color/scale_color/error/mixed_formats.hrx +++ b/spec/core_functions/color/scale_color/error/mixed_formats.hrx @@ -2,7 +2,7 @@ a {b: scale-color(red, $red: 1%, $saturation: 1%)} <===> red_and_saturation/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $saturation: Color space rgb doesn't have a channel with this name. , 1 | a {b: scale-color(red, $red: 1%, $saturation: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -23,7 +23,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `scale a {b: scale-color(red, $green: 1%, $saturation: 1%)} <===> green_and_saturation/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $saturation: Color space rgb doesn't have a channel with this name. , 1 | a {b: scale-color(red, $green: 1%, $saturation: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -44,7 +44,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `scale a {b: scale-color(red, $blue: 1%, $lightness: 1%)} <===> blue_and_lightness/error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $lightness: Color space rgb doesn't have a channel with this name. , 1 | a {b: scale-color(red, $blue: 1%, $lightness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -70,7 +70,7 @@ Error: Cannot specify HSL and RGB values for a color at the same time for `scale a {b: scale-color(red, $red: 1%, $blackness: 1%)} <===> red_and_blackness/error -Error: RGB parameters may not be passed along with HWB parameters. +Error: $blackness: Color space rgb doesn't have a channel with this name. , 1 | a {b: scale-color(red, $red: 1%, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -88,7 +88,7 @@ Error: RGB parameters may not be passed along with HWB parameters. a {b: scale-color(red, $green: 1%, $whiteness: 1%)} <===> green_and_whiteness/error -Error: RGB parameters may not be passed along with HWB parameters. +Error: $whiteness: Color space rgb doesn't have a channel with this name. , 1 | a {b: scale-color(red, $green: 1%, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -106,7 +106,7 @@ Error: RGB parameters may not be passed along with HWB parameters. a {b: scale-color(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error -Error: HSL parameters may not be passed along with HWB parameters. +Error: $blackness: Color space hsl doesn't have a channel with this name. , 1 | a {b: scale-color(red, $saturation: 1%, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -124,10 +124,9 @@ Error: HSL parameters may not be passed along with HWB parameters. a {b: scale-color(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error -Error: HSL parameters may not be passed along with HWB parameters. +Error: $whiteness: Color space hsl doesn't have a channel with this name. , 1 | a {b: scale-color(red, $lightness: 1%, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet - diff --git a/spec/core_functions/color/scale_color/hsl.hrx b/spec/core_functions/color/scale_color/hsl.hrx index 2ec6a59500..7cb73a3b16 100644 --- a/spec/core_functions/color/scale_color/hsl.hrx +++ b/spec/core_functions/color/scale_color/hsl.hrx @@ -22,6 +22,11 @@ a { a {b: scale-color(plum, $saturation: -100%)} <===> saturation/min/output.css +a { + b: rgb(190.5, 190.5, 190.5); +} + +<===> saturation/min/output-libsass.css a { b: #bfbfbf; } @@ -32,6 +37,11 @@ a { a {b: scale-color(plum, $saturation: 67%)} <===> saturation/high/output.css +a { + b: rgb(243.78, 137.22, 243.78); +} + +<===> saturation/high/output-libsass.css a { b: #f489f4; } @@ -42,6 +52,11 @@ a { a {b: scale-color(plum, $saturation: -43%)} <===> saturation/low/output.css +a { + b: rgb(207.885, 173.115, 207.885); +} + +<===> saturation/low/output-libsass.css a { b: #d0add0; } @@ -82,6 +97,11 @@ a { a {b: scale-color(red, $lightness: 94%)} <===> lightness/high/output.css +a { + b: rgb(255, 239.7, 239.7); +} + +<===> lightness/high/output-libsass.css a { b: #fff0f0; } @@ -92,6 +112,11 @@ a { a {b: scale-color(red, $lightness: -14%)} <===> lightness/low/output.css +a { + b: rgb(219.3, 0, 0); +} + +<===> lightness/low/output-libsass.css a { b: #db0000; } @@ -102,6 +127,11 @@ a { a {b: scale-color(turquoise, $saturation: 24%, $lightness: -48%)} <===> all/output.css +a { + b: rgb(15.8934486486, 133.8665513514, 122.0692410811); +} + +<===> all/output-libsass.css a { b: #10867a; } @@ -112,6 +142,11 @@ a { a {b: scale-color(rgba(turquoise, 0.7), $saturation: 24%, $lightness: -48%)} <===> alpha_input/output.css +a { + b: rgba(15.8934486486, 133.8665513514, 122.0692410811, 0.7); +} + +<===> alpha_input/output-libsass.css a { b: rgba(16, 134, 122, 0.7); } @@ -122,6 +157,11 @@ a { a {b: scale-color(turquoise, $saturation: 24%, $lightness: -48%, $alpha: -70%)} <===> alpha_arg/output.css +a { + b: rgba(15.8934486486, 133.8665513514, 122.0692410811, 0.3); +} + +<===> alpha_arg/output-libsass.css a { b: rgba(16, 134, 122, 0.3); } @@ -132,6 +172,11 @@ a { a {b: scale-color($color: turquoise, $saturation: 24%, $lightness: -48%)} <===> named/output.css +a { + b: rgb(15.8934486486, 133.8665513514, 122.0692410811); +} + +<===> named/output-libsass.css a { b: #10867a; } diff --git a/spec/core_functions/color/scale_color/hwb.hrx b/spec/core_functions/color/scale_color/hwb.hrx index 2d2ab6e4c7..7b79f14252 100644 --- a/spec/core_functions/color/scale_color/hwb.hrx +++ b/spec/core_functions/color/scale_color/hwb.hrx @@ -10,7 +10,7 @@ a {b: scale-color(#66cc99, $whiteness: 100%)} <===> whiteness/max/output.css a { - b: #d5d5d5; + b: rgb(212.5, 212.5, 212.5); } <===> @@ -40,7 +40,7 @@ a {b: scale-color(#33cc80, $whiteness: 50%)} <===> whiteness/high/output.css a { - b: #99ccb3; + b: rgb(153, 204, 178.6666666667); } <===> @@ -50,7 +50,7 @@ a {b: scale-color(#66cc99, $whiteness: -50%)} <===> whiteness/low/output.css a { - b: #33cc80; + b: rgb(51, 204, 127.5); } <===> @@ -60,7 +60,7 @@ a {b: scale-color(#339966, $blackness: 100%)} <===> blackness/max/output.css a { - b: #2b2b2b; + b: rgb(42.5, 42.5, 42.5); } <===> @@ -90,7 +90,7 @@ a {b: scale-color(#33cc80, $blackness: 50%)} <===> blackness/high/output.css a { - b: #33664d; + b: rgb(51, 102, 76.6666666667); } <===> @@ -100,7 +100,7 @@ a {b: scale-color(#339966, $blackness: -50%)} <===> blackness/low/output.css a { - b: #33cc80; + b: rgb(51, 204, 127.5); } <===> @@ -110,7 +110,7 @@ a {b: scale-color(#66cc99, $whiteness: -50%, $blackness: 50%)} <===> all/output.css a { - b: #33664d; + b: rgb(51, 102, 76.5); } <===> @@ -120,7 +120,7 @@ a {b: scale-color(rgba(#66cc99, 0.7), $whiteness: -50%, $blackness: 50%)} <===> alpha_input/output.css a { - b: rgba(51, 102, 77, 0.7); + b: rgba(51, 102, 76.5, 0.7); } <===> @@ -130,7 +130,7 @@ a {b: scale-color(#66cc99, $whiteness: -50%, $blackness: 50%, $alpha: -70%)} <===> alpha_arg/output.css a { - b: rgba(51, 102, 77, 0.3); + b: rgba(51, 102, 76.5, 0.3); } <===> @@ -140,5 +140,5 @@ a {b: scale-color($color: #66cc99, $whiteness: -50%, $blackness: 50%)} <===> named/output.css a { - b: #33664d; + b: rgb(51, 102, 76.5); } diff --git a/spec/core_functions/color/scale_color/rgb.hrx b/spec/core_functions/color/scale_color/rgb.hrx index 25b93dc925..74a5137e4c 100644 --- a/spec/core_functions/color/scale_color/rgb.hrx +++ b/spec/core_functions/color/scale_color/rgb.hrx @@ -32,6 +32,11 @@ a { a {b: scale-color(lightcoral, $red: -33%)} <===> red/low/output.css +a { + b: rgb(160.8, 128, 128); +} + +<===> red/low/output-libsass.css a { b: #a18080; } @@ -42,6 +47,11 @@ a { a {b: scale-color(turquoise, $red: 86%)} <===> red/high/output.css +a { + b: rgb(228.26, 224, 208); +} + +<===> red/high/output-libsass.css a { b: #e4e0d0; } @@ -82,6 +92,11 @@ a { a {b: scale-color(seagreen, $green: -86%)} <===> green/low/output.css +a { + b: rgb(46, 19.46, 87); +} + +<===> green/low/output-libsass.css a { b: #2e1357; } @@ -92,6 +107,11 @@ a { a {b: scale-color(cadetblue, $green: 12%)} <===> green/high/output.css +a { + b: rgb(95, 169.64, 160); +} + +<===> green/high/output-libsass.css a { b: #5faaa0; } @@ -132,6 +152,11 @@ a { a {b: scale-color(slategray, $blue: -16%)} <===> blue/low/output.css +a { + b: rgb(112, 128, 120.96); +} + +<===> blue/low/output-libsass.css a { b: #708079; } @@ -142,6 +167,11 @@ a { a {b: scale-color(salmon, $blue: 42%)} <===> blue/high/output.css +a { + b: rgb(250, 128, 173.22); +} + +<===> blue/high/output-libsass.css a { b: #fa80ad; } @@ -152,6 +182,11 @@ a { a {b: scale-color(sienna, $red: 12%, $green: 24%, $blue: 48%)} <===> all/output.css +a { + b: rgb(171.4, 123.52, 145.8); +} + +<===> all/output-libsass.css a { b: #ab7c92; } @@ -162,6 +197,11 @@ a { a {b: scale-color(rgba(sienna, 0.3), $red: 12%, $green: 24%, $blue: 48%)} <===> alpha_input/output.css +a { + b: rgba(171.4, 123.52, 145.8, 0.3); +} + +<===> alpha_input/output-libsass.css a { b: rgba(171, 124, 146, 0.3); } @@ -172,6 +212,11 @@ a { a {b: scale-color(sienna, $red: 12%, $green: 24%, $blue: 48%, $alpha: -70%)} <===> alpha_arg/output.css +a { + b: rgba(171.4, 123.52, 145.8, 0.3); +} + +<===> alpha_arg/output-libsass.css a { b: rgba(171, 124, 146, 0.3); } @@ -182,6 +227,11 @@ a { a {b: scale-color($color: sienna, $red: 12%, $green: 24%, $blue: 48%)} <===> named/output.css +a { + b: rgb(171.4, 123.52, 145.8); +} + +<===> named/output-libsass.css a { b: #ab7c92; } diff --git a/spec/core_functions/color/whiteness.hrx b/spec/core_functions/color/whiteness.hrx index ab0c5c8a4e..acc7117889 100644 --- a/spec/core_functions/color/whiteness.hrx +++ b/spec/core_functions/color/whiteness.hrx @@ -33,7 +33,7 @@ a {b: color.whiteness(color.hwb(0, 50%, 0%))} <===> middle/zero_blackness/output.css a { - b: 50.1960784314%; + b: 50%; } <===> @@ -44,7 +44,7 @@ a {b: color.whiteness(color.hwb(0, 50%, 50%))} <===> middle/half_blackness/output.css a { - b: 50.1960784314%; + b: 50%; } <===> @@ -55,7 +55,7 @@ a {b: color.whiteness(color.hwb(0, 70%, 70%))} <===> middle/high_blackness/output.css a { - b: 50.1960784314%; + b: 50%; } <===> @@ -66,7 +66,7 @@ a {b: color.whiteness(color.hwb(0, 0.5%, 0%))} <===> fraction/output.css a { - b: 0.3921568627%; + b: 0.5%; } <===> @@ -77,7 +77,7 @@ a {b: color.whiteness($color: color.hwb(0, 42%, 0%))} <===> named/output.css a { - b: 41.9607843137%; + b: 42%; } <===> diff --git a/spec/core_functions/meta/call.hrx b/spec/core_functions/meta/call.hrx index 3fb1c6fa9e..b2ae9163f5 100644 --- a/spec/core_functions/meta/call.hrx +++ b/spec/core_functions/meta/call.hrx @@ -205,7 +205,7 @@ Error: Function call is missing argument $function. a {b: call(get-function("rgb"), 1)} <===> error/invalid_args/error -Error: Missing element $green. +Error: $channels: The rgb color space has 3 channels but 1 has 1. , 1 | a {b: call(get-function("rgb"), 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/meta/keywords.hrx b/spec/core_functions/meta/keywords.hrx index b14132567b..304ef20133 100644 --- a/spec/core_functions/meta/keywords.hrx +++ b/spec/core_functions/meta/keywords.hrx @@ -150,7 +150,7 @@ a { a {b: keywords(1 2 3)} <===> error/type/non_arg_list/error -Error: $args: 1 2 3 is not an argument list. +Error: $args: (1 2 3) is not an argument list. , 1 | a {b: keywords(1 2 3)} | ^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/modules/color.hrx b/spec/core_functions/modules/color.hrx index 85aafb72cc..a6746a29b9 100644 --- a/spec/core_functions/modules/color.hrx +++ b/spec/core_functions/modules/color.hrx @@ -125,7 +125,7 @@ a {b: color.scale(#abcdef, $red: 10%)} <===> scale/output.css a { - b: #b3cdef; + b: rgb(179.4, 205, 239); } <===> diff --git a/spec/core_functions/selector/parse/error.hrx b/spec/core_functions/selector/parse/error.hrx index d6c6158ffe..851e12d6c9 100644 --- a/spec/core_functions/selector/parse/error.hrx +++ b/spec/core_functions/selector/parse/error.hrx @@ -120,7 +120,7 @@ a list of strings, or a list of lists of strings. a {b: selector-parse(append((), append((), c)))} <===> outer_space/error -Error: $selector: c is not a valid selector: it must be a string, +Error: $selector: (c) is not a valid selector: it must be a string, a list of strings, or a list of lists of strings. , 1 | a {b: selector-parse(append((), append((), c)))} @@ -141,7 +141,7 @@ a list of strings, or a list of lists of strings. a {b: selector-parse(list.slash(c d, e f))} <===> slash_list/top_level/error -Error: $selector: c d / e f is not a valid selector: it must be a string, +Error: $selector: (c d / e f) is not a valid selector: it must be a string, a list of strings, or a list of lists of strings. , 2 | a {b: selector-parse(list.slash(c d, e f))} @@ -156,7 +156,7 @@ a list of strings, or a list of lists of strings. a {b: selector-parse((list.slash(c, d), list.slash(e, f)))} <===> slash_list/in_comma_list/error -Error: $selector: c / d, e / f is not a valid selector: it must be a string, +Error: $selector: (c / d, e / f) is not a valid selector: it must be a string, a list of strings, or a list of lists of strings. , 2 | a {b: selector-parse((list.slash(c, d), list.slash(e, f)))} diff --git a/spec/core_functions/string/quote.hrx b/spec/core_functions/string/quote.hrx index 8d42978d48..9743d3f309 100644 --- a/spec/core_functions/string/quote.hrx +++ b/spec/core_functions/string/quote.hrx @@ -79,7 +79,7 @@ a { a {b: quote((1, 2, 3))} <===> error/type/error -Error: $string: 1, 2, 3 is not a string. +Error: $string: (1, 2, 3) is not a string. , 1 | a {b: quote((1, 2, 3))} | ^^^^^^^^^^^^^^^^ diff --git a/spec/libsass-closed-issues/issue_1101.hrx b/spec/libsass-closed-issues/issue_1101.hrx index 0439c858c4..ece3cfe2eb 100644 --- a/spec/libsass-closed-issues/issue_1101.hrx +++ b/spec/libsass-closed-issues/issue_1101.hrx @@ -4,6 +4,11 @@ foo { bar: adjust-color($foo, $hue: -6deg, $lightness: -16%, $saturation: -7%); } <===> output.css +foo { + bar: rgb(214.2, 214.2, 214.2); +} + +<===> output-libsass.css foo { bar: #d6d6d6; } diff --git a/spec/libsass-closed-issues/issue_1285.hrx b/spec/libsass-closed-issues/issue_1285.hrx index a327dc4405..d6821f0b4c 100644 --- a/spec/libsass-closed-issues/issue_1285.hrx +++ b/spec/libsass-closed-issues/issue_1285.hrx @@ -13,15 +13,35 @@ } <===> output.css +.box-1 { + color: rgb(229.5, 0, 0); +} + +.box-2 { + color: #cc0000; +} + +.box-3 { + color: rgb(178.5, 0, 0); +} + +.outside-child { + background-color: blue; +} + +<===> output-libsass.css .box-1 { color: #e60000; } + .box-2 { color: #cc0000; } + .box-3 { color: #b30000; } + .outside-child { background-color: blue; } diff --git a/spec/libsass-closed-issues/issue_2374.hrx b/spec/libsass-closed-issues/issue_2374.hrx index 93e0bfe184..be9934d733 100644 --- a/spec/libsass-closed-issues/issue_2374.hrx +++ b/spec/libsass-closed-issues/issue_2374.hrx @@ -30,6 +30,83 @@ $colors: ( background-color: white; } +.yellow-100 { + background-color: rgb(255, 254.7755102041, 252.8); +} + +.yellow-200 { + background-color: rgb(255, 253.7346938776, 242.6); +} + +.yellow-300 { + background-color: rgb(255, 252.693877551, 232.4); +} + +.yellow-400 { + background-color: rgb(255, 251.6530612245, 222.2); +} + +.yellow-500 { + background-color: rgb(255, 250.612244898, 212); +} + +.yellow-600 { + background-color: rgb(255, 249.5714285714, 201.8); +} + +.yellow-700 { + background-color: rgb(255, 248.5306122449, 191.6); +} + +.yellow-800 { + background-color: rgb(255, 247.4897959184, 181.4); +} + +.yellow-900 { + background-color: rgb(255, 246.4489795918, 171.2); +} + +.yellow-0 { + background-color: #ffff33; +} + +.yellow-100 { + background-color: #ffff33; +} + +.yellow-200 { + background-color: #ffff33; +} + +.red-0 { + background-color: #ff3333; +} + +.red-100 { + background-color: #ff3333; +} + +.red-200 { + background-color: #ff3333; +} + +.blue-0 { + background-color: #3333ff; +} + +.blue-100 { + background-color: #3333ff; +} + +.blue-200 { + background-color: #3333ff; +} + +<===> output-libsass.css +.yellow-0 { + background-color: white; +} + .yellow-100 { background-color: #fffffd; } @@ -109,7 +186,7 @@ Always quote color names when using them as strings or map keys (for example, "y If you really want to use the color value here, use '"" + $name'. , -7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; | ^^^^^ ' input.scss 7:12 root stylesheet @@ -120,7 +197,7 @@ Always quote color names when using them as strings or map keys (for example, "y If you really want to use the color value here, use '"" + $name'. , -20 | .#{$name}-#{($i*100)} { +20 | .#{$name}-#{($i*100)} { | ^^^^^ ' input.scss 20:12 root stylesheet @@ -131,7 +208,7 @@ Always quote color names when using them as strings or map keys (for example, "r If you really want to use the color value here, use '"" + $name'. , -20 | .#{$name}-#{($i*100)} { +20 | .#{$name}-#{($i*100)} { | ^^^^^ ' input.scss 20:12 root stylesheet @@ -142,7 +219,7 @@ Always quote color names when using them as strings or map keys (for example, "b If you really want to use the color value here, use '"" + $name'. , -20 | .#{$name}-#{($i*100)} { +20 | .#{$name}-#{($i*100)} { | ^^^^^ ' input.scss 20:12 root stylesheet diff --git a/spec/libsass-closed-issues/issue_238760.hrx b/spec/libsass-closed-issues/issue_238760.hrx index 3fceda3103..17ec8b9341 100644 --- a/spec/libsass-closed-issues/issue_238760.hrx +++ b/spec/libsass-closed-issues/issue_238760.hrx @@ -2,7 +2,7 @@ $id: inspect((a#b:c)...) <===> error Error: Variable keyword argument map must have string keys. -a #b is not a string in (a #b: c). +(a #b) is not a string in (a #b: c). , 1 | $id: inspect((a#b:c)...) | ^^^^^^^ diff --git a/spec/libsass-closed-issues/issue_2462.hrx b/spec/libsass-closed-issues/issue_2462.hrx index 5352dfeaa5..420b17bb39 100644 --- a/spec/libsass-closed-issues/issue_2462.hrx +++ b/spec/libsass-closed-issues/issue_2462.hrx @@ -4,6 +4,11 @@ b { } <===> output.css +b { + color: rgb(236.75, 54.25, 90.75); +} + +<===> output-libsass.css b { color: #ed365b; } diff --git a/spec/libsass-closed-issues/issue_2472.hrx b/spec/libsass-closed-issues/issue_2472.hrx index df01eb139c..98b6b3d5a9 100644 --- a/spec/libsass-closed-issues/issue_2472.hrx +++ b/spec/libsass-closed-issues/issue_2472.hrx @@ -22,6 +22,15 @@ $arg: join((), 5%); function2: dark2(#102030, 5%); } <===> output.css +.single { + direct: rgb(9.625, 19.25, 28.875); + arg: rgb(9.625, 19.25, 28.875); + call: rgb(9.625, 19.25, 28.875); + function: rgb(9.625, 19.25, 28.875); + function2: rgb(9.625, 19.25, 28.875); +} + +<===> output-libsass.css .single { direct: #0a131d; arg: #0a131d; @@ -65,10 +74,10 @@ Recommendation: call(get-function("darken")) <===> warning-libsass DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal -in Sass 4.0. Use call(function-reference(foobar)) instead. +in Sass 4.0. Use call(get-function("darken")) instead. DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal -in Sass 4.0. Use call(function-reference(foobar)) instead. +in Sass 4.0. Use call(get-function("darken")) instead. DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal -in Sass 4.0. Use call(function-reference(foobar)) instead. +in Sass 4.0. Use call(get-function("darken")) instead. diff --git a/spec/libsass-todo-issues/issue_2818.hrx b/spec/libsass-todo-issues/issue_2818.hrx index 893fcdcff4..88a45bcded 100644 --- a/spec/libsass-todo-issues/issue_2818.hrx +++ b/spec/libsass-todo-issues/issue_2818.hrx @@ -5,5 +5,5 @@ test { color: $base; } <===> output.css test { - color: #e4dede; + color: rgb(228.27, 222.33, 222.33); } diff --git a/spec/libsass/bourbon.hrx b/spec/libsass/bourbon.hrx index 57fa049a3a..0c2cf91adc 100644 --- a/spec/libsass/bourbon.hrx +++ b/spec/libsass/bourbon.hrx @@ -1928,8 +1928,8 @@ div { background-image: url("/images/a.png"), url("images/b.png"); background-image: url("/images/a.png"), -webkit-linear-gradient(white 0, yellow 50%, transparent 50%); background-image: url("/images/a.png"), linear-gradient( white 0, yellow 50%, transparent 50%); - background-image: -webkit-linear-gradient(hsla(0deg, 100%, 100%, 0.25) 0%, hsla(0deg, 100%, 100%, 0.08) 50%, transparent 50%), -webkit-linear-gradient(#4e7ba3, #3e6181); - background-image: linear-gradient( hsla(0deg, 100%, 100%, 0.25) 0%, hsla(0deg, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient( #4e7ba3, #3e6181); + background-image: -webkit-linear-gradient(hsla(0deg, 100%, 100%, 0.25) 0%, hsla(0deg, 100%, 100%, 0.08) 50%, transparent 50%), -webkit-linear-gradient(#4e7ba3, rgb(61.5619834711, 97.0785123967, 129.4380165289)); + background-image: linear-gradient( hsla(0deg, 100%, 100%, 0.25) 0%, hsla(0deg, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient( #4e7ba3, rgb(61.5619834711, 97.0785123967, 129.4380165289)); background-image: -webkit-url("/images/a.png")-gradient(center), -webkit-url("images/b.png")-gradient(left); background-image: url("/images/a.png")-gradient( center), url("images/b.png")-gradient( left); } diff --git a/spec/libsass/color-functions/other/change-color/h.hrx b/spec/libsass/color-functions/other/change-color/h.hrx index 469b0feb61..b8b2de1b09 100644 --- a/spec/libsass/color-functions/other/change-color/h.hrx +++ b/spec/libsass/color-functions/other/change-color/h.hrx @@ -366,367 +366,367 @@ foo { <===> output.css foo { - c-1: #ff0004; + c-1: rgb(255, 0, 4.25); c0: red; - c1: #ff0400; - c2: #ff0900; - c3: #ff0d00; + c1: rgb(255, 4.25, 0); + c2: rgb(255, 8.5, 0); + c3: rgb(255, 12.75, 0); c4: #ff1100; - c5: #ff1500; - c6: #ff1a00; - c7: #ff1e00; + c5: rgb(255, 21.25, 0); + c6: rgb(255, 25.5, 0); + c7: rgb(255, 29.75, 0); c8: #ff2200; - c9: #ff2600; - c10: #ff2b00; - c11: #ff2f00; + c9: rgb(255, 38.25, 0); + c10: rgb(255, 42.5, 0); + c11: rgb(255, 46.75, 0); c12: #ff3300; - c13: #ff3700; - c14: #ff3c00; - c15: #ff4000; + c13: rgb(255, 55.25, 0); + c14: rgb(255, 59.5, 0); + c15: rgb(255, 63.75, 0); c16: #ff4400; - c17: #ff4800; - c18: #ff4d00; - c19: #ff5100; + c17: rgb(255, 72.25, 0); + c18: rgb(255, 76.5, 0); + c19: rgb(255, 80.75, 0); c20: #ff5500; - c21: #ff5900; - c22: #ff5e00; - c23: #ff6200; + c21: rgb(255, 89.25, 0); + c22: rgb(255, 93.5, 0); + c23: rgb(255, 97.75, 0); c24: #ff6600; - c25: #ff6a00; - c26: #ff6f00; - c27: #ff7300; + c25: rgb(255, 106.25, 0); + c26: rgb(255, 110.5, 0); + c27: rgb(255, 114.75, 0); c28: #ff7700; - c29: #ff7b00; - c30: #ff8000; - c31: #ff8400; + c29: rgb(255, 123.25, 0); + c30: rgb(255, 127.5, 0); + c31: rgb(255, 131.75, 0); c32: #ff8800; - c33: darkorange; - c34: #ff9100; - c35: #ff9500; + c33: rgb(255, 140.25, 0); + c34: rgb(255, 144.5, 0); + c35: rgb(255, 148.75, 0); c36: #ff9900; - c37: #ff9d00; - c38: #ffa200; - c39: #ffa600; + c37: rgb(255, 157.25, 0); + c38: rgb(255, 161.5, 0); + c39: rgb(255, 165.75, 0); c40: #ffaa00; - c41: #ffae00; - c42: #ffb300; - c43: #ffb700; + c41: rgb(255, 174.25, 0); + c42: rgb(255, 178.5, 0); + c43: rgb(255, 182.75, 0); c44: #ffbb00; - c45: #ffbf00; - c46: #ffc400; - c47: #ffc800; + c45: rgb(255, 191.25, 0); + c46: rgb(255, 195.5, 0); + c47: rgb(255, 199.75, 0); c48: #ffcc00; - c49: #ffd000; - c50: #ffd500; - c51: #ffd900; + c49: rgb(255, 208.25, 0); + c50: rgb(255, 212.5, 0); + c51: rgb(255, 216.75, 0); c52: #ffdd00; - c53: #ffe100; - c54: #ffe600; - c55: #ffea00; + c53: rgb(255, 225.25, 0); + c54: rgb(255, 229.5, 0); + c55: rgb(255, 233.75, 0); c56: #ffee00; - c57: #fff200; - c58: #fff700; - c59: #fffb00; + c57: rgb(255, 242.25, 0); + c58: rgb(255, 246.5, 0); + c59: rgb(255, 250.75, 0); c60: yellow; - c61: #fbff00; - c62: #f7ff00; - c63: #f2ff00; + c61: rgb(250.75, 255, 0); + c62: rgb(246.5, 255, 0); + c63: rgb(242.25, 255, 0); c64: #eeff00; - c65: #eaff00; - c66: #e6ff00; - c67: #e1ff00; + c65: rgb(233.75, 255, 0); + c66: rgb(229.5, 255, 0); + c67: rgb(225.25, 255, 0); c68: #ddff00; - c69: #d9ff00; - c70: #d5ff00; - c71: #d0ff00; + c69: rgb(216.75, 255, 0); + c70: rgb(212.5, 255, 0); + c71: rgb(208.25, 255, 0); c72: #ccff00; - c73: #c8ff00; - c74: #c4ff00; - c75: #bfff00; + c73: rgb(199.75, 255, 0); + c74: rgb(195.5, 255, 0); + c75: rgb(191.25, 255, 0); c76: #bbff00; - c77: #b7ff00; - c78: #b3ff00; - c79: #aeff00; + c77: rgb(182.75, 255, 0); + c78: rgb(178.5, 255, 0); + c79: rgb(174.25, 255, 0); c80: #aaff00; - c81: #a6ff00; - c82: #a2ff00; - c83: #9dff00; + c81: rgb(165.75, 255, 0); + c82: rgb(161.5, 255, 0); + c83: rgb(157.25, 255, 0); c84: #99ff00; - c85: #95ff00; - c86: #91ff00; - c87: #8cff00; + c85: rgb(148.75, 255, 0); + c86: rgb(144.5, 255, 0); + c87: rgb(140.25, 255, 0); c88: #88ff00; - c89: #84ff00; - c90: #80ff00; - c91: #7bff00; + c89: rgb(131.75, 255, 0); + c90: rgb(127.5, 255, 0); + c91: rgb(123.25, 255, 0); c92: #77ff00; - c93: #73ff00; - c94: #6fff00; - c95: #6aff00; + c93: rgb(114.75, 255, 0); + c94: rgb(110.5, 255, 0); + c95: rgb(106.25, 255, 0); c96: #66ff00; - c97: #62ff00; - c98: #5eff00; - c99: #59ff00; + c97: rgb(97.75, 255, 0); + c98: rgb(93.5, 255, 0); + c99: rgb(89.25, 255, 0); c100: #55ff00; - c101: #51ff00; - c102: #4dff00; - c103: #48ff00; + c101: rgb(80.75, 255, 0); + c102: rgb(76.5, 255, 0); + c103: rgb(72.25, 255, 0); c104: #44ff00; - c105: #40ff00; - c106: #3cff00; - c107: #37ff00; + c105: rgb(63.75, 255, 0); + c106: rgb(59.5, 255, 0); + c107: rgb(55.25, 255, 0); c108: #33ff00; - c109: #2fff00; - c110: #2bff00; - c111: #26ff00; + c109: rgb(46.75, 255, 0); + c110: rgb(42.5, 255, 0); + c111: rgb(38.25, 255, 0); c112: #22ff00; - c113: #1eff00; - c114: #1aff00; - c115: #15ff00; + c113: rgb(29.75, 255, 0); + c114: rgb(25.5, 255, 0); + c115: rgb(21.25, 255, 0); c116: #11ff00; - c117: #0dff00; - c118: #09ff00; - c119: #04ff00; + c117: rgb(12.75, 255, 0); + c118: rgb(8.5, 255, 0); + c119: rgb(4.25, 255, 0); c120: lime; - c121: #00ff04; - c122: #00ff09; - c123: #00ff0d; + c121: rgb(0, 255, 4.25); + c122: rgb(0, 255, 8.5); + c123: rgb(0, 255, 12.75); c124: #00ff11; - c125: #00ff15; - c126: #00ff1a; - c127: #00ff1e; + c125: rgb(0, 255, 21.25); + c126: rgb(0, 255, 25.5); + c127: rgb(0, 255, 29.75); c128: #00ff22; - c129: #00ff26; - c130: #00ff2b; - c131: #00ff2f; + c129: rgb(0, 255, 38.25); + c130: rgb(0, 255, 42.5); + c131: rgb(0, 255, 46.75); c132: #00ff33; - c133: #00ff37; - c134: #00ff3c; - c135: #00ff40; + c133: rgb(0, 255, 55.25); + c134: rgb(0, 255, 59.5); + c135: rgb(0, 255, 63.75); c136: #00ff44; - c137: #00ff48; - c138: #00ff4d; - c139: #00ff51; + c137: rgb(0, 255, 72.25); + c138: rgb(0, 255, 76.5); + c139: rgb(0, 255, 80.75); c140: #00ff55; - c141: #00ff59; - c142: #00ff5e; - c143: #00ff62; + c141: rgb(0, 255, 89.25); + c142: rgb(0, 255, 93.5); + c143: rgb(0, 255, 97.75); c144: #00ff66; - c145: #00ff6a; - c146: #00ff6f; - c147: #00ff73; + c145: rgb(0, 255, 106.25); + c146: rgb(0, 255, 110.5); + c147: rgb(0, 255, 114.75); c148: #00ff77; - c149: #00ff7b; - c150: #00ff80; - c151: #00ff84; + c149: rgb(0, 255, 123.25); + c150: rgb(0, 255, 127.5); + c151: rgb(0, 255, 131.75); c152: #00ff88; - c153: #00ff8c; - c154: #00ff91; - c155: #00ff95; + c153: rgb(0, 255, 140.25); + c154: rgb(0, 255, 144.5); + c155: rgb(0, 255, 148.75); c156: #00ff99; - c157: #00ff9d; - c158: #00ffa2; - c159: #00ffa6; + c157: rgb(0, 255, 157.25); + c158: rgb(0, 255, 161.5); + c159: rgb(0, 255, 165.75); c160: #00ffaa; - c161: #00ffae; - c162: #00ffb3; - c163: #00ffb7; + c161: rgb(0, 255, 174.25); + c162: rgb(0, 255, 178.5); + c163: rgb(0, 255, 182.75); c164: #00ffbb; - c165: #00ffbf; - c166: #00ffc4; - c167: #00ffc8; + c165: rgb(0, 255, 191.25); + c166: rgb(0, 255, 195.5); + c167: rgb(0, 255, 199.75); c168: #00ffcc; - c169: #00ffd0; - c170: #00ffd5; - c171: #00ffd9; + c169: rgb(0, 255, 208.25); + c170: rgb(0, 255, 212.5); + c171: rgb(0, 255, 216.75); c172: #00ffdd; - c173: #00ffe1; - c174: #00ffe6; - c175: #00ffea; + c173: rgb(0, 255, 225.25); + c174: rgb(0, 255, 229.5); + c175: rgb(0, 255, 233.75); c176: #00ffee; - c177: #00fff2; - c178: #00fff7; - c179: #00fffb; + c177: rgb(0, 255, 242.25); + c178: rgb(0, 255, 246.5); + c179: rgb(0, 255, 250.75); c180: aqua; - c181: #00fbff; - c182: #00f7ff; - c183: #00f2ff; + c181: rgb(0, 250.75, 255); + c182: rgb(0, 246.5, 255); + c183: rgb(0, 242.25, 255); c184: #00eeff; - c185: #00eaff; - c186: #00e6ff; - c187: #00e1ff; + c185: rgb(0, 233.75, 255); + c186: rgb(0, 229.5, 255); + c187: rgb(0, 225.25, 255); c188: #00ddff; - c189: #00d9ff; - c190: #00d5ff; - c191: #00d0ff; + c189: rgb(0, 216.75, 255); + c190: rgb(0, 212.5, 255); + c191: rgb(0, 208.25, 255); c192: #00ccff; - c193: #00c8ff; - c194: #00c4ff; - c195: deepskyblue; + c193: rgb(0, 199.75, 255); + c194: rgb(0, 195.5, 255); + c195: rgb(0, 191.25, 255); c196: #00bbff; - c197: #00b7ff; - c198: #00b3ff; - c199: #00aeff; + c197: rgb(0, 182.75, 255); + c198: rgb(0, 178.5, 255); + c199: rgb(0, 174.25, 255); c200: #00aaff; - c201: #00a6ff; - c202: #00a2ff; - c203: #009dff; + c201: rgb(0, 165.75, 255); + c202: rgb(0, 161.5, 255); + c203: rgb(0, 157.25, 255); c204: #0099ff; - c205: #0095ff; - c206: #0091ff; - c207: #008cff; + c205: rgb(0, 148.75, 255); + c206: rgb(0, 144.5, 255); + c207: rgb(0, 140.25, 255); c208: #0088ff; - c209: #0084ff; - c210: #0080ff; - c211: #007bff; + c209: rgb(0, 131.75, 255); + c210: rgb(0, 127.5, 255); + c211: rgb(0, 123.25, 255); c212: #0077ff; - c213: #0073ff; - c214: #006fff; - c215: #006aff; + c213: rgb(0, 114.75, 255); + c214: rgb(0, 110.5, 255); + c215: rgb(0, 106.25, 255); c216: #0066ff; - c217: #0062ff; - c218: #005eff; - c219: #0059ff; + c217: rgb(0, 97.75, 255); + c218: rgb(0, 93.5, 255); + c219: rgb(0, 89.25, 255); c220: #0055ff; - c221: #0051ff; - c222: #004dff; - c223: #0048ff; + c221: rgb(0, 80.75, 255); + c222: rgb(0, 76.5, 255); + c223: rgb(0, 72.25, 255); c224: #0044ff; - c225: #0040ff; - c226: #003cff; - c227: #0037ff; + c225: rgb(0, 63.75, 255); + c226: rgb(0, 59.5, 255); + c227: rgb(0, 55.25, 255); c228: #0033ff; - c229: #002fff; - c230: #002bff; - c231: #0026ff; + c229: rgb(0, 46.75, 255); + c230: rgb(0, 42.5, 255); + c231: rgb(0, 38.25, 255); c232: #0022ff; - c233: #001eff; - c234: #001aff; - c235: #0015ff; + c233: rgb(0, 29.75, 255); + c234: rgb(0, 25.5, 255); + c235: rgb(0, 21.25, 255); c236: #0011ff; - c237: #000dff; - c238: #0009ff; - c239: #0004ff; + c237: rgb(0, 12.75, 255); + c238: rgb(0, 8.5, 255); + c239: rgb(0, 4.25, 255); c240: blue; - c241: #0400ff; - c242: #0900ff; - c243: #0d00ff; + c241: rgb(4.25, 0, 255); + c242: rgb(8.5, 0, 255); + c243: rgb(12.75, 0, 255); c244: #1100ff; - c245: #1500ff; - c246: #1a00ff; - c247: #1e00ff; + c245: rgb(21.25, 0, 255); + c246: rgb(25.5, 0, 255); + c247: rgb(29.75, 0, 255); c248: #2200ff; - c249: #2600ff; - c250: #2b00ff; - c251: #2f00ff; + c249: rgb(38.25, 0, 255); + c250: rgb(42.5, 0, 255); + c251: rgb(46.75, 0, 255); c252: #3300ff; - c253: #3700ff; - c254: #3c00ff; - c255: #4000ff; + c253: rgb(55.25, 0, 255); + c254: rgb(59.5, 0, 255); + c255: rgb(63.75, 0, 255); c256: #4400ff; - c257: #4800ff; - c258: #4d00ff; - c259: #5100ff; + c257: rgb(72.25, 0, 255); + c258: rgb(76.5, 0, 255); + c259: rgb(80.75, 0, 255); c260: #5500ff; - c261: #5900ff; - c262: #5e00ff; - c263: #6200ff; + c261: rgb(89.25, 0, 255); + c262: rgb(93.5, 0, 255); + c263: rgb(97.75, 0, 255); c264: #6600ff; - c265: #6a00ff; - c266: #6f00ff; - c267: #7300ff; + c265: rgb(106.25, 0, 255); + c266: rgb(110.5, 0, 255); + c267: rgb(114.75, 0, 255); c268: #7700ff; - c269: #7b00ff; - c270: #8000ff; - c271: #8400ff; + c269: rgb(123.25, 0, 255); + c270: rgb(127.5, 0, 255); + c271: rgb(131.75, 0, 255); c272: #8800ff; - c273: #8c00ff; - c274: #9100ff; - c275: #9500ff; + c273: rgb(140.25, 0, 255); + c274: rgb(144.5, 0, 255); + c275: rgb(148.75, 0, 255); c276: #9900ff; - c277: #9d00ff; - c278: #a200ff; - c279: #a600ff; + c277: rgb(157.25, 0, 255); + c278: rgb(161.5, 0, 255); + c279: rgb(165.75, 0, 255); c280: #aa00ff; - c281: #ae00ff; - c282: #b300ff; - c283: #b700ff; + c281: rgb(174.25, 0, 255); + c282: rgb(178.5, 0, 255); + c283: rgb(182.75, 0, 255); c284: #bb00ff; - c285: #bf00ff; - c286: #c400ff; - c287: #c800ff; + c285: rgb(191.25, 0, 255); + c286: rgb(195.5, 0, 255); + c287: rgb(199.75, 0, 255); c288: #cc00ff; - c289: #d000ff; - c290: #d500ff; - c291: #d900ff; + c289: rgb(208.25, 0, 255); + c290: rgb(212.5, 0, 255); + c291: rgb(216.75, 0, 255); c292: #dd00ff; - c293: #e100ff; - c294: #e600ff; - c295: #ea00ff; + c293: rgb(225.25, 0, 255); + c294: rgb(229.5, 0, 255); + c295: rgb(233.75, 0, 255); c296: #ee00ff; - c297: #f200ff; - c298: #f700ff; - c299: #fb00ff; + c297: rgb(242.25, 0, 255); + c298: rgb(246.5, 0, 255); + c299: rgb(250.75, 0, 255); c300: fuchsia; - c301: #ff00fb; - c302: #ff00f7; - c303: #ff00f2; + c301: rgb(255, 0, 250.75); + c302: rgb(255, 0, 246.5); + c303: rgb(255, 0, 242.25); c304: #ff00ee; - c305: #ff00ea; - c306: #ff00e6; - c307: #ff00e1; + c305: rgb(255, 0, 233.75); + c306: rgb(255, 0, 229.5); + c307: rgb(255, 0, 225.25); c308: #ff00dd; - c309: #ff00d9; - c310: #ff00d5; - c311: #ff00d0; + c309: rgb(255, 0, 216.75); + c310: rgb(255, 0, 212.5); + c311: rgb(255, 0, 208.25); c312: #ff00cc; - c313: #ff00c8; - c314: #ff00c4; - c315: #ff00bf; + c313: rgb(255, 0, 199.75); + c314: rgb(255, 0, 195.5); + c315: rgb(255, 0, 191.25); c316: #ff00bb; - c317: #ff00b7; - c318: #ff00b3; - c319: #ff00ae; + c317: rgb(255, 0, 182.75); + c318: rgb(255, 0, 178.5); + c319: rgb(255, 0, 174.25); c320: #ff00aa; - c321: #ff00a6; - c322: #ff00a2; - c323: #ff009d; + c321: rgb(255, 0, 165.75); + c322: rgb(255, 0, 161.5); + c323: rgb(255, 0, 157.25); c324: #ff0099; - c325: #ff0095; - c326: #ff0091; - c327: #ff008c; + c325: rgb(255, 0, 148.75); + c326: rgb(255, 0, 144.5); + c327: rgb(255, 0, 140.25); c328: #ff0088; - c329: #ff0084; - c330: #ff0080; - c331: #ff007b; + c329: rgb(255, 0, 131.75); + c330: rgb(255, 0, 127.5); + c331: rgb(255, 0, 123.25); c332: #ff0077; - c333: #ff0073; - c334: #ff006f; - c335: #ff006a; + c333: rgb(255, 0, 114.75); + c334: rgb(255, 0, 110.5); + c335: rgb(255, 0, 106.25); c336: #ff0066; - c337: #ff0062; - c338: #ff005e; - c339: #ff0059; + c337: rgb(255, 0, 97.75); + c338: rgb(255, 0, 93.5); + c339: rgb(255, 0, 89.25); c340: #ff0055; - c341: #ff0051; - c342: #ff004d; - c343: #ff0048; + c341: rgb(255, 0, 80.75); + c342: rgb(255, 0, 76.5); + c343: rgb(255, 0, 72.25); c344: #ff0044; - c345: #ff0040; - c346: #ff003c; - c347: #ff0037; + c345: rgb(255, 0, 63.75); + c346: rgb(255, 0, 59.5); + c347: rgb(255, 0, 55.25); c348: #ff0033; - c349: #ff002f; - c350: #ff002b; - c351: #ff0026; + c349: rgb(255, 0, 46.75); + c350: rgb(255, 0, 42.5); + c351: rgb(255, 0, 38.25); c352: #ff0022; - c353: #ff001e; - c354: #ff001a; - c355: #ff0015; + c353: rgb(255, 0, 29.75); + c354: rgb(255, 0, 25.5); + c355: rgb(255, 0, 21.25); c356: #ff0011; - c357: #ff000d; - c358: #ff0009; - c359: #ff0004; + c357: rgb(255, 0, 12.75); + c358: rgb(255, 0, 8.5); + c359: rgb(255, 0, 4.25); c360: red; } diff --git a/spec/libsass/color-functions/other/change-color/l.hrx b/spec/libsass/color-functions/other/change-color/l.hrx index 445bc6b558..59dbd1002e 100644 --- a/spec/libsass/color-functions/other/change-color/l.hrx +++ b/spec/libsass/color-functions/other/change-color/l.hrx @@ -105,6 +105,110 @@ foo { } <===> output.css +foo { + c0: black; + c1: rgb(5.1, 0, 0); + c2: rgb(10.2, 0, 0); + c3: rgb(15.3, 0, 0); + c4: rgb(20.4, 0, 0); + c5: rgb(25.5, 0, 0); + c6: rgb(30.6, 0, 0); + c7: rgb(35.7, 0, 0); + c8: rgb(40.8, 0, 0); + c9: rgb(45.9, 0, 0); + c10: #330000; + c11: rgb(56.1, 0, 0); + c12: rgb(61.2, 0, 0); + c13: rgb(66.3, 0, 0); + c14: rgb(71.4, 0, 0); + c15: rgb(76.5, 0, 0); + c16: rgb(81.6, 0, 0); + c17: rgb(86.7, 0, 0); + c18: rgb(91.8, 0, 0); + c19: rgb(96.9, 0, 0); + c20: #660000; + c21: rgb(107.1, 0, 0); + c22: rgb(112.2, 0, 0); + c23: rgb(117.3, 0, 0); + c24: rgb(122.4, 0, 0); + c25: rgb(127.5, 0, 0); + c26: rgb(132.6, 0, 0); + c27: rgb(137.7, 0, 0); + c28: rgb(142.8, 0, 0); + c29: rgb(147.9, 0, 0); + c30: #990000; + c31: rgb(158.1, 0, 0); + c32: rgb(163.2, 0, 0); + c33: rgb(168.3, 0, 0); + c34: rgb(173.4, 0, 0); + c35: rgb(178.5, 0, 0); + c36: rgb(183.6, 0, 0); + c37: rgb(188.7, 0, 0); + c38: rgb(193.8, 0, 0); + c39: rgb(198.9, 0, 0); + c40: #cc0000; + c41: rgb(209.1, 0, 0); + c42: rgb(214.2, 0, 0); + c43: rgb(219.3, 0, 0); + c44: rgb(224.4, 0, 0); + c45: rgb(229.5, 0, 0); + c46: rgb(234.6, 0, 0); + c47: rgb(239.7, 0, 0); + c48: rgb(244.8, 0, 0); + c49: rgb(249.9, 0, 0); + c50: red; + c51: rgb(255, 5.1, 5.1); + c52: rgb(255, 10.2, 10.2); + c53: rgb(255, 15.3, 15.3); + c54: rgb(255, 20.4, 20.4); + c55: rgb(255, 25.5, 25.5); + c56: rgb(255, 30.6, 30.6); + c57: rgb(255, 35.7, 35.7); + c58: rgb(255, 40.8, 40.8); + c59: rgb(255, 45.9, 45.9); + c60: #ff3333; + c61: rgb(255, 56.1, 56.1); + c62: rgb(255, 61.2, 61.2); + c63: rgb(255, 66.3, 66.3); + c64: rgb(255, 71.4, 71.4); + c65: rgb(255, 76.5, 76.5); + c66: rgb(255, 81.6, 81.6); + c67: rgb(255, 86.7, 86.7); + c68: rgb(255, 91.8, 91.8); + c69: rgb(255, 96.9, 96.9); + c70: #ff6666; + c71: rgb(255, 107.1, 107.1); + c72: rgb(255, 112.2, 112.2); + c73: rgb(255, 117.3, 117.3); + c74: rgb(255, 122.4, 122.4); + c75: rgb(255, 127.5, 127.5); + c76: rgb(255, 132.6, 132.6); + c77: rgb(255, 137.7, 137.7); + c78: rgb(255, 142.8, 142.8); + c79: rgb(255, 147.9, 147.9); + c80: #ff9999; + c81: rgb(255, 158.1, 158.1); + c82: rgb(255, 163.2, 163.2); + c83: rgb(255, 168.3, 168.3); + c84: rgb(255, 173.4, 173.4); + c85: rgb(255, 178.5, 178.5); + c86: rgb(255, 183.6, 183.6); + c87: rgb(255, 188.7, 188.7); + c88: rgb(255, 193.8, 193.8); + c89: rgb(255, 198.9, 198.9); + c90: #ffcccc; + c91: rgb(255, 209.1, 209.1); + c92: rgb(255, 214.2, 214.2); + c93: rgb(255, 219.3, 219.3); + c94: rgb(255, 224.4, 224.4); + c95: rgb(255, 229.5, 229.5); + c96: rgb(255, 234.6, 234.6); + c97: rgb(255, 239.7, 239.7); + c98: rgb(255, 244.8, 244.8); + c99: rgb(255, 249.9, 249.9); +} + +<===> output-libsass.css foo { c0: black; c1: #050000; diff --git a/spec/libsass/color-functions/other/change-color/s.hrx b/spec/libsass/color-functions/other/change-color/s.hrx index 6be178c555..18671b71a7 100644 --- a/spec/libsass/color-functions/other/change-color/s.hrx +++ b/spec/libsass/color-functions/other/change-color/s.hrx @@ -106,6 +106,111 @@ foo { } <===> output.css +foo { + c0: rgb(127.5, 127.5, 127.5); + c1: rgb(128.775, 126.225, 126.225); + c2: rgb(130.05, 124.95, 124.95); + c3: rgb(131.325, 123.675, 123.675); + c4: rgb(132.6, 122.4, 122.4); + c5: rgb(133.875, 121.125, 121.125); + c6: rgb(135.15, 119.85, 119.85); + c7: rgb(136.425, 118.575, 118.575); + c8: rgb(137.7, 117.3, 117.3); + c9: rgb(138.975, 116.025, 116.025); + c10: rgb(140.25, 114.75, 114.75); + c11: rgb(141.525, 113.475, 113.475); + c12: rgb(142.8, 112.2, 112.2); + c13: rgb(144.075, 110.925, 110.925); + c14: rgb(145.35, 109.65, 109.65); + c15: rgb(146.625, 108.375, 108.375); + c16: rgb(147.9, 107.1, 107.1); + c17: rgb(149.175, 105.825, 105.825); + c18: rgb(150.45, 104.55, 104.55); + c19: rgb(151.725, 103.275, 103.275); + c20: #996666; + c21: rgb(154.275, 100.725, 100.725); + c22: rgb(155.55, 99.45, 99.45); + c23: rgb(156.825, 98.175, 98.175); + c24: rgb(158.1, 96.9, 96.9); + c25: rgb(159.375, 95.625, 95.625); + c26: rgb(160.65, 94.35, 94.35); + c27: rgb(161.925, 93.075, 93.075); + c28: rgb(163.2, 91.8, 91.8); + c29: rgb(164.475, 90.525, 90.525); + c30: rgb(165.75, 89.25, 89.25); + c31: rgb(167.025, 87.975, 87.975); + c32: rgb(168.3, 86.7, 86.7); + c33: rgb(169.575, 85.425, 85.425); + c34: rgb(170.85, 84.15, 84.15); + c35: rgb(172.125, 82.875, 82.875); + c36: rgb(173.4, 81.6, 81.6); + c37: rgb(174.675, 80.325, 80.325); + c38: rgb(175.95, 79.05, 79.05); + c39: rgb(177.225, 77.775, 77.775); + c40: rgb(178.5, 76.5, 76.5); + c41: rgb(179.775, 75.225, 75.225); + c42: rgb(181.05, 73.95, 73.95); + c43: rgb(182.325, 72.675, 72.675); + c44: rgb(183.6, 71.4, 71.4); + c45: rgb(184.875, 70.125, 70.125); + c46: rgb(186.15, 68.85, 68.85); + c47: rgb(187.425, 67.575, 67.575); + c48: rgb(188.7, 66.3, 66.3); + c49: rgb(189.975, 65.025, 65.025); + c50: rgb(191.25, 63.75, 63.75); + c51: rgb(192.525, 62.475, 62.475); + c52: rgb(193.8, 61.2, 61.2); + c53: rgb(195.075, 59.925, 59.925); + c54: rgb(196.35, 58.65, 58.65); + c55: rgb(197.625, 57.375, 57.375); + c56: rgb(198.9, 56.1, 56.1); + c57: rgb(200.175, 54.825, 54.825); + c58: rgb(201.45, 53.55, 53.55); + c59: rgb(202.725, 52.275, 52.275); + c60: #cc3333; + c61: rgb(205.275, 49.725, 49.725); + c62: rgb(206.55, 48.45, 48.45); + c63: rgb(207.825, 47.175, 47.175); + c64: rgb(209.1, 45.9, 45.9); + c65: rgb(210.375, 44.625, 44.625); + c66: rgb(211.65, 43.35, 43.35); + c67: rgb(212.925, 42.075, 42.075); + c68: rgb(214.2, 40.8, 40.8); + c69: rgb(215.475, 39.525, 39.525); + c70: rgb(216.75, 38.25, 38.25); + c71: rgb(218.025, 36.975, 36.975); + c72: rgb(219.3, 35.7, 35.7); + c73: rgb(220.575, 34.425, 34.425); + c74: rgb(221.85, 33.15, 33.15); + c75: rgb(223.125, 31.875, 31.875); + c76: rgb(224.4, 30.6, 30.6); + c77: rgb(225.675, 29.325, 29.325); + c78: rgb(226.95, 28.05, 28.05); + c79: rgb(228.225, 26.775, 26.775); + c80: rgb(229.5, 25.5, 25.5); + c81: rgb(230.775, 24.225, 24.225); + c82: rgb(232.05, 22.95, 22.95); + c83: rgb(233.325, 21.675, 21.675); + c84: rgb(234.6, 20.4, 20.4); + c85: rgb(235.875, 19.125, 19.125); + c86: rgb(237.15, 17.85, 17.85); + c87: rgb(238.425, 16.575, 16.575); + c88: rgb(239.7, 15.3, 15.3); + c89: rgb(240.975, 14.025, 14.025); + c90: rgb(242.25, 12.75, 12.75); + c91: rgb(243.525, 11.475, 11.475); + c92: rgb(244.8, 10.2, 10.2); + c93: rgb(246.075, 8.925, 8.925); + c94: rgb(247.35, 7.65, 7.65); + c95: rgb(248.625, 6.375, 6.375); + c96: rgb(249.9, 5.1, 5.1); + c97: rgb(251.175, 3.825, 3.825); + c98: rgb(252.45, 2.55, 2.55); + c99: rgb(253.725, 1.275, 1.275); + c100: red; +} + +<===> output-libsass.css foo { c0: gray; c1: #817e7e; diff --git a/spec/libsass/color-functions/rgb/rgb/b.hrx b/spec/libsass/color-functions/rgb/rgb/b.hrx index d35334d1a5..bb1eb123a1 100644 --- a/spec/libsass/color-functions/rgb/rgb/b.hrx +++ b/spec/libsass/color-functions/rgb/rgb/b.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, 0, -1); c0: rgb(0, 0, 0); c1: rgb(0, 0, 1); c2: rgb(0, 0, 2); @@ -625,113 +625,113 @@ foo { c253: rgb(0, 0, 253); c254: rgb(0, 0, 254); c255: rgb(0, 0, 255); - c256: rgb(0, 0, 255); + c256: rgb(0, 0, 256); } foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, 0, -2.55); c0: rgb(0, 0, 0); - c1: rgb(0, 0, 3); - c2: rgb(0, 0, 5); - c3: rgb(0, 0, 8); - c4: rgb(0, 0, 10); - c5: rgb(0, 0, 13); - c6: rgb(0, 0, 15); - c7: rgb(0, 0, 18); - c8: rgb(0, 0, 20); - c9: rgb(0, 0, 23); - c10: rgb(0, 0, 26); - c11: rgb(0, 0, 28); - c12: rgb(0, 0, 31); - c13: rgb(0, 0, 33); - c14: rgb(0, 0, 36); - c15: rgb(0, 0, 38); - c16: rgb(0, 0, 41); - c17: rgb(0, 0, 43); - c18: rgb(0, 0, 46); - c19: rgb(0, 0, 48); + c1: rgb(0, 0, 2.55); + c2: rgb(0, 0, 5.1); + c3: rgb(0, 0, 7.65); + c4: rgb(0, 0, 10.2); + c5: rgb(0, 0, 12.75); + c6: rgb(0, 0, 15.3); + c7: rgb(0, 0, 17.85); + c8: rgb(0, 0, 20.4); + c9: rgb(0, 0, 22.95); + c10: rgb(0, 0, 25.5); + c11: rgb(0, 0, 28.05); + c12: rgb(0, 0, 30.6); + c13: rgb(0, 0, 33.15); + c14: rgb(0, 0, 35.7); + c15: rgb(0, 0, 38.25); + c16: rgb(0, 0, 40.8); + c17: rgb(0, 0, 43.35); + c18: rgb(0, 0, 45.9); + c19: rgb(0, 0, 48.45); c20: rgb(0, 0, 51); - c21: rgb(0, 0, 54); - c22: rgb(0, 0, 56); - c23: rgb(0, 0, 59); - c24: rgb(0, 0, 61); - c25: rgb(0, 0, 64); - c26: rgb(0, 0, 66); - c27: rgb(0, 0, 69); - c28: rgb(0, 0, 71); - c29: rgb(0, 0, 74); - c30: rgb(0, 0, 77); - c31: rgb(0, 0, 79); - c32: rgb(0, 0, 82); - c33: rgb(0, 0, 84); - c34: rgb(0, 0, 87); - c35: rgb(0, 0, 89); - c36: rgb(0, 0, 92); - c37: rgb(0, 0, 94); - c38: rgb(0, 0, 97); - c39: rgb(0, 0, 99); + c21: rgb(0, 0, 53.55); + c22: rgb(0, 0, 56.1); + c23: rgb(0, 0, 58.65); + c24: rgb(0, 0, 61.2); + c25: rgb(0, 0, 63.75); + c26: rgb(0, 0, 66.3); + c27: rgb(0, 0, 68.85); + c28: rgb(0, 0, 71.4); + c29: rgb(0, 0, 73.95); + c30: rgb(0, 0, 76.5); + c31: rgb(0, 0, 79.05); + c32: rgb(0, 0, 81.6); + c33: rgb(0, 0, 84.15); + c34: rgb(0, 0, 86.7); + c35: rgb(0, 0, 89.25); + c36: rgb(0, 0, 91.8); + c37: rgb(0, 0, 94.35); + c38: rgb(0, 0, 96.9); + c39: rgb(0, 0, 99.45); c40: rgb(0, 0, 102); - c41: rgb(0, 0, 105); - c42: rgb(0, 0, 107); - c43: rgb(0, 0, 110); - c44: rgb(0, 0, 112); - c45: rgb(0, 0, 115); - c46: rgb(0, 0, 117); - c47: rgb(0, 0, 120); - c48: rgb(0, 0, 122); - c49: rgb(0, 0, 125); - c50: rgb(0, 0, 128); - c51: rgb(0, 0, 130); - c52: rgb(0, 0, 133); - c53: rgb(0, 0, 135); - c54: rgb(0, 0, 138); - c55: rgb(0, 0, 140); - c56: rgb(0, 0, 143); - c57: rgb(0, 0, 145); - c58: rgb(0, 0, 148); - c59: rgb(0, 0, 150); + c41: rgb(0, 0, 104.55); + c42: rgb(0, 0, 107.1); + c43: rgb(0, 0, 109.65); + c44: rgb(0, 0, 112.2); + c45: rgb(0, 0, 114.75); + c46: rgb(0, 0, 117.3); + c47: rgb(0, 0, 119.85); + c48: rgb(0, 0, 122.4); + c49: rgb(0, 0, 124.95); + c50: rgb(0, 0, 127.5); + c51: rgb(0, 0, 130.05); + c52: rgb(0, 0, 132.6); + c53: rgb(0, 0, 135.15); + c54: rgb(0, 0, 137.7); + c55: rgb(0, 0, 140.25); + c56: rgb(0, 0, 142.8); + c57: rgb(0, 0, 145.35); + c58: rgb(0, 0, 147.9); + c59: rgb(0, 0, 150.45); c60: rgb(0, 0, 153); - c61: rgb(0, 0, 156); - c62: rgb(0, 0, 158); - c63: rgb(0, 0, 161); - c64: rgb(0, 0, 163); - c65: rgb(0, 0, 166); - c66: rgb(0, 0, 168); - c67: rgb(0, 0, 171); - c68: rgb(0, 0, 173); - c69: rgb(0, 0, 176); - c70: rgb(0, 0, 179); - c71: rgb(0, 0, 181); - c72: rgb(0, 0, 184); - c73: rgb(0, 0, 186); - c74: rgb(0, 0, 189); - c75: rgb(0, 0, 191); - c76: rgb(0, 0, 194); - c77: rgb(0, 0, 196); - c78: rgb(0, 0, 199); - c79: rgb(0, 0, 201); + c61: rgb(0, 0, 155.55); + c62: rgb(0, 0, 158.1); + c63: rgb(0, 0, 160.65); + c64: rgb(0, 0, 163.2); + c65: rgb(0, 0, 165.75); + c66: rgb(0, 0, 168.3); + c67: rgb(0, 0, 170.85); + c68: rgb(0, 0, 173.4); + c69: rgb(0, 0, 175.95); + c70: rgb(0, 0, 178.5); + c71: rgb(0, 0, 181.05); + c72: rgb(0, 0, 183.6); + c73: rgb(0, 0, 186.15); + c74: rgb(0, 0, 188.7); + c75: rgb(0, 0, 191.25); + c76: rgb(0, 0, 193.8); + c77: rgb(0, 0, 196.35); + c78: rgb(0, 0, 198.9); + c79: rgb(0, 0, 201.45); c80: rgb(0, 0, 204); - c81: rgb(0, 0, 207); - c82: rgb(0, 0, 209); - c83: rgb(0, 0, 212); - c84: rgb(0, 0, 214); - c85: rgb(0, 0, 217); - c86: rgb(0, 0, 219); - c87: rgb(0, 0, 222); - c88: rgb(0, 0, 224); - c89: rgb(0, 0, 227); - c90: rgb(0, 0, 230); - c91: rgb(0, 0, 232); - c92: rgb(0, 0, 235); - c93: rgb(0, 0, 237); - c94: rgb(0, 0, 240); - c95: rgb(0, 0, 242); - c96: rgb(0, 0, 245); - c97: rgb(0, 0, 247); - c98: rgb(0, 0, 250); - c99: rgb(0, 0, 252); + c81: rgb(0, 0, 206.55); + c82: rgb(0, 0, 209.1); + c83: rgb(0, 0, 211.65); + c84: rgb(0, 0, 214.2); + c85: rgb(0, 0, 216.75); + c86: rgb(0, 0, 219.3); + c87: rgb(0, 0, 221.85); + c88: rgb(0, 0, 224.4); + c89: rgb(0, 0, 226.95); + c90: rgb(0, 0, 229.5); + c91: rgb(0, 0, 232.05); + c92: rgb(0, 0, 234.6); + c93: rgb(0, 0, 237.15); + c94: rgb(0, 0, 239.7); + c95: rgb(0, 0, 242.25); + c96: rgb(0, 0, 244.8); + c97: rgb(0, 0, 247.35); + c98: rgb(0, 0, 249.9); + c99: rgb(0, 0, 252.45); c100: rgb(0, 0, 255); - c101: rgb(0, 0, 255); + c101: rgb(0, 0, 257.55); } <===> output-libsass.css diff --git a/spec/libsass/color-functions/rgb/rgb/g.hrx b/spec/libsass/color-functions/rgb/rgb/g.hrx index 57311e601f..9b53794a42 100644 --- a/spec/libsass/color-functions/rgb/rgb/g.hrx +++ b/spec/libsass/color-functions/rgb/rgb/g.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, -1, 0); c0: rgb(0, 0, 0); c1: rgb(0, 1, 0); c2: rgb(0, 2, 0); @@ -625,113 +625,113 @@ foo { c253: rgb(0, 253, 0); c254: rgb(0, 254, 0); c255: rgb(0, 255, 0); - c256: rgb(0, 255, 0); + c256: rgb(0, 256, 0); } foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, -2.55, 0); c0: rgb(0, 0, 0); - c1: rgb(0, 3, 0); - c2: rgb(0, 5, 0); - c3: rgb(0, 8, 0); - c4: rgb(0, 10, 0); - c5: rgb(0, 13, 0); - c6: rgb(0, 15, 0); - c7: rgb(0, 18, 0); - c8: rgb(0, 20, 0); - c9: rgb(0, 23, 0); - c10: rgb(0, 26, 0); - c11: rgb(0, 28, 0); - c12: rgb(0, 31, 0); - c13: rgb(0, 33, 0); - c14: rgb(0, 36, 0); - c15: rgb(0, 38, 0); - c16: rgb(0, 41, 0); - c17: rgb(0, 43, 0); - c18: rgb(0, 46, 0); - c19: rgb(0, 48, 0); + c1: rgb(0, 2.55, 0); + c2: rgb(0, 5.1, 0); + c3: rgb(0, 7.65, 0); + c4: rgb(0, 10.2, 0); + c5: rgb(0, 12.75, 0); + c6: rgb(0, 15.3, 0); + c7: rgb(0, 17.85, 0); + c8: rgb(0, 20.4, 0); + c9: rgb(0, 22.95, 0); + c10: rgb(0, 25.5, 0); + c11: rgb(0, 28.05, 0); + c12: rgb(0, 30.6, 0); + c13: rgb(0, 33.15, 0); + c14: rgb(0, 35.7, 0); + c15: rgb(0, 38.25, 0); + c16: rgb(0, 40.8, 0); + c17: rgb(0, 43.35, 0); + c18: rgb(0, 45.9, 0); + c19: rgb(0, 48.45, 0); c20: rgb(0, 51, 0); - c21: rgb(0, 54, 0); - c22: rgb(0, 56, 0); - c23: rgb(0, 59, 0); - c24: rgb(0, 61, 0); - c25: rgb(0, 64, 0); - c26: rgb(0, 66, 0); - c27: rgb(0, 69, 0); - c28: rgb(0, 71, 0); - c29: rgb(0, 74, 0); - c30: rgb(0, 77, 0); - c31: rgb(0, 79, 0); - c32: rgb(0, 82, 0); - c33: rgb(0, 84, 0); - c34: rgb(0, 87, 0); - c35: rgb(0, 89, 0); - c36: rgb(0, 92, 0); - c37: rgb(0, 94, 0); - c38: rgb(0, 97, 0); - c39: rgb(0, 99, 0); + c21: rgb(0, 53.55, 0); + c22: rgb(0, 56.1, 0); + c23: rgb(0, 58.65, 0); + c24: rgb(0, 61.2, 0); + c25: rgb(0, 63.75, 0); + c26: rgb(0, 66.3, 0); + c27: rgb(0, 68.85, 0); + c28: rgb(0, 71.4, 0); + c29: rgb(0, 73.95, 0); + c30: rgb(0, 76.5, 0); + c31: rgb(0, 79.05, 0); + c32: rgb(0, 81.6, 0); + c33: rgb(0, 84.15, 0); + c34: rgb(0, 86.7, 0); + c35: rgb(0, 89.25, 0); + c36: rgb(0, 91.8, 0); + c37: rgb(0, 94.35, 0); + c38: rgb(0, 96.9, 0); + c39: rgb(0, 99.45, 0); c40: rgb(0, 102, 0); - c41: rgb(0, 105, 0); - c42: rgb(0, 107, 0); - c43: rgb(0, 110, 0); - c44: rgb(0, 112, 0); - c45: rgb(0, 115, 0); - c46: rgb(0, 117, 0); - c47: rgb(0, 120, 0); - c48: rgb(0, 122, 0); - c49: rgb(0, 125, 0); - c50: rgb(0, 128, 0); - c51: rgb(0, 130, 0); - c52: rgb(0, 133, 0); - c53: rgb(0, 135, 0); - c54: rgb(0, 138, 0); - c55: rgb(0, 140, 0); - c56: rgb(0, 143, 0); - c57: rgb(0, 145, 0); - c58: rgb(0, 148, 0); - c59: rgb(0, 150, 0); + c41: rgb(0, 104.55, 0); + c42: rgb(0, 107.1, 0); + c43: rgb(0, 109.65, 0); + c44: rgb(0, 112.2, 0); + c45: rgb(0, 114.75, 0); + c46: rgb(0, 117.3, 0); + c47: rgb(0, 119.85, 0); + c48: rgb(0, 122.4, 0); + c49: rgb(0, 124.95, 0); + c50: rgb(0, 127.5, 0); + c51: rgb(0, 130.05, 0); + c52: rgb(0, 132.6, 0); + c53: rgb(0, 135.15, 0); + c54: rgb(0, 137.7, 0); + c55: rgb(0, 140.25, 0); + c56: rgb(0, 142.8, 0); + c57: rgb(0, 145.35, 0); + c58: rgb(0, 147.9, 0); + c59: rgb(0, 150.45, 0); c60: rgb(0, 153, 0); - c61: rgb(0, 156, 0); - c62: rgb(0, 158, 0); - c63: rgb(0, 161, 0); - c64: rgb(0, 163, 0); - c65: rgb(0, 166, 0); - c66: rgb(0, 168, 0); - c67: rgb(0, 171, 0); - c68: rgb(0, 173, 0); - c69: rgb(0, 176, 0); - c70: rgb(0, 179, 0); - c71: rgb(0, 181, 0); - c72: rgb(0, 184, 0); - c73: rgb(0, 186, 0); - c74: rgb(0, 189, 0); - c75: rgb(0, 191, 0); - c76: rgb(0, 194, 0); - c77: rgb(0, 196, 0); - c78: rgb(0, 199, 0); - c79: rgb(0, 201, 0); + c61: rgb(0, 155.55, 0); + c62: rgb(0, 158.1, 0); + c63: rgb(0, 160.65, 0); + c64: rgb(0, 163.2, 0); + c65: rgb(0, 165.75, 0); + c66: rgb(0, 168.3, 0); + c67: rgb(0, 170.85, 0); + c68: rgb(0, 173.4, 0); + c69: rgb(0, 175.95, 0); + c70: rgb(0, 178.5, 0); + c71: rgb(0, 181.05, 0); + c72: rgb(0, 183.6, 0); + c73: rgb(0, 186.15, 0); + c74: rgb(0, 188.7, 0); + c75: rgb(0, 191.25, 0); + c76: rgb(0, 193.8, 0); + c77: rgb(0, 196.35, 0); + c78: rgb(0, 198.9, 0); + c79: rgb(0, 201.45, 0); c80: rgb(0, 204, 0); - c81: rgb(0, 207, 0); - c82: rgb(0, 209, 0); - c83: rgb(0, 212, 0); - c84: rgb(0, 214, 0); - c85: rgb(0, 217, 0); - c86: rgb(0, 219, 0); - c87: rgb(0, 222, 0); - c88: rgb(0, 224, 0); - c89: rgb(0, 227, 0); - c90: rgb(0, 230, 0); - c91: rgb(0, 232, 0); - c92: rgb(0, 235, 0); - c93: rgb(0, 237, 0); - c94: rgb(0, 240, 0); - c95: rgb(0, 242, 0); - c96: rgb(0, 245, 0); - c97: rgb(0, 247, 0); - c98: rgb(0, 250, 0); - c99: rgb(0, 252, 0); + c81: rgb(0, 206.55, 0); + c82: rgb(0, 209.1, 0); + c83: rgb(0, 211.65, 0); + c84: rgb(0, 214.2, 0); + c85: rgb(0, 216.75, 0); + c86: rgb(0, 219.3, 0); + c87: rgb(0, 221.85, 0); + c88: rgb(0, 224.4, 0); + c89: rgb(0, 226.95, 0); + c90: rgb(0, 229.5, 0); + c91: rgb(0, 232.05, 0); + c92: rgb(0, 234.6, 0); + c93: rgb(0, 237.15, 0); + c94: rgb(0, 239.7, 0); + c95: rgb(0, 242.25, 0); + c96: rgb(0, 244.8, 0); + c97: rgb(0, 247.35, 0); + c98: rgb(0, 249.9, 0); + c99: rgb(0, 252.45, 0); c100: rgb(0, 255, 0); - c101: rgb(0, 255, 0); + c101: rgb(0, 257.55, 0); } <===> output-libsass.css diff --git a/spec/libsass/color-functions/rgb/rgb/r.hrx b/spec/libsass/color-functions/rgb/rgb/r.hrx index 230a34bba6..6a5212d66e 100644 --- a/spec/libsass/color-functions/rgb/rgb/r.hrx +++ b/spec/libsass/color-functions/rgb/rgb/r.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, -1, 0); c0: rgb(0, 0, 0); c1: rgb(0, 1, 0); c2: rgb(0, 2, 0); @@ -625,113 +625,113 @@ foo { c253: rgb(0, 253, 0); c254: rgb(0, 254, 0); c255: rgb(0, 255, 0); - c256: rgb(0, 255, 0); + c256: rgb(0, 256, 0); } foo { - c-1: rgb(0, 0, 0); + c-1: rgb(-2.55, 0, 0); c0: rgb(0, 0, 0); - c1: rgb(3, 0, 0); - c2: rgb(5, 0, 0); - c3: rgb(8, 0, 0); - c4: rgb(10, 0, 0); - c5: rgb(13, 0, 0); - c6: rgb(15, 0, 0); - c7: rgb(18, 0, 0); - c8: rgb(20, 0, 0); - c9: rgb(23, 0, 0); - c10: rgb(26, 0, 0); - c11: rgb(28, 0, 0); - c12: rgb(31, 0, 0); - c13: rgb(33, 0, 0); - c14: rgb(36, 0, 0); - c15: rgb(38, 0, 0); - c16: rgb(41, 0, 0); - c17: rgb(43, 0, 0); - c18: rgb(46, 0, 0); - c19: rgb(48, 0, 0); + c1: rgb(2.55, 0, 0); + c2: rgb(5.1, 0, 0); + c3: rgb(7.65, 0, 0); + c4: rgb(10.2, 0, 0); + c5: rgb(12.75, 0, 0); + c6: rgb(15.3, 0, 0); + c7: rgb(17.85, 0, 0); + c8: rgb(20.4, 0, 0); + c9: rgb(22.95, 0, 0); + c10: rgb(25.5, 0, 0); + c11: rgb(28.05, 0, 0); + c12: rgb(30.6, 0, 0); + c13: rgb(33.15, 0, 0); + c14: rgb(35.7, 0, 0); + c15: rgb(38.25, 0, 0); + c16: rgb(40.8, 0, 0); + c17: rgb(43.35, 0, 0); + c18: rgb(45.9, 0, 0); + c19: rgb(48.45, 0, 0); c20: rgb(51, 0, 0); - c21: rgb(54, 0, 0); - c22: rgb(56, 0, 0); - c23: rgb(59, 0, 0); - c24: rgb(61, 0, 0); - c25: rgb(64, 0, 0); - c26: rgb(66, 0, 0); - c27: rgb(69, 0, 0); - c28: rgb(71, 0, 0); - c29: rgb(74, 0, 0); - c30: rgb(77, 0, 0); - c31: rgb(79, 0, 0); - c32: rgb(82, 0, 0); - c33: rgb(84, 0, 0); - c34: rgb(87, 0, 0); - c35: rgb(89, 0, 0); - c36: rgb(92, 0, 0); - c37: rgb(94, 0, 0); - c38: rgb(97, 0, 0); - c39: rgb(99, 0, 0); + c21: rgb(53.55, 0, 0); + c22: rgb(56.1, 0, 0); + c23: rgb(58.65, 0, 0); + c24: rgb(61.2, 0, 0); + c25: rgb(63.75, 0, 0); + c26: rgb(66.3, 0, 0); + c27: rgb(68.85, 0, 0); + c28: rgb(71.4, 0, 0); + c29: rgb(73.95, 0, 0); + c30: rgb(76.5, 0, 0); + c31: rgb(79.05, 0, 0); + c32: rgb(81.6, 0, 0); + c33: rgb(84.15, 0, 0); + c34: rgb(86.7, 0, 0); + c35: rgb(89.25, 0, 0); + c36: rgb(91.8, 0, 0); + c37: rgb(94.35, 0, 0); + c38: rgb(96.9, 0, 0); + c39: rgb(99.45, 0, 0); c40: rgb(102, 0, 0); - c41: rgb(105, 0, 0); - c42: rgb(107, 0, 0); - c43: rgb(110, 0, 0); - c44: rgb(112, 0, 0); - c45: rgb(115, 0, 0); - c46: rgb(117, 0, 0); - c47: rgb(120, 0, 0); - c48: rgb(122, 0, 0); - c49: rgb(125, 0, 0); - c50: rgb(128, 0, 0); - c51: rgb(130, 0, 0); - c52: rgb(133, 0, 0); - c53: rgb(135, 0, 0); - c54: rgb(138, 0, 0); - c55: rgb(140, 0, 0); - c56: rgb(143, 0, 0); - c57: rgb(145, 0, 0); - c58: rgb(148, 0, 0); - c59: rgb(150, 0, 0); + c41: rgb(104.55, 0, 0); + c42: rgb(107.1, 0, 0); + c43: rgb(109.65, 0, 0); + c44: rgb(112.2, 0, 0); + c45: rgb(114.75, 0, 0); + c46: rgb(117.3, 0, 0); + c47: rgb(119.85, 0, 0); + c48: rgb(122.4, 0, 0); + c49: rgb(124.95, 0, 0); + c50: rgb(127.5, 0, 0); + c51: rgb(130.05, 0, 0); + c52: rgb(132.6, 0, 0); + c53: rgb(135.15, 0, 0); + c54: rgb(137.7, 0, 0); + c55: rgb(140.25, 0, 0); + c56: rgb(142.8, 0, 0); + c57: rgb(145.35, 0, 0); + c58: rgb(147.9, 0, 0); + c59: rgb(150.45, 0, 0); c60: rgb(153, 0, 0); - c61: rgb(156, 0, 0); - c62: rgb(158, 0, 0); - c63: rgb(161, 0, 0); - c64: rgb(163, 0, 0); - c65: rgb(166, 0, 0); - c66: rgb(168, 0, 0); - c67: rgb(171, 0, 0); - c68: rgb(173, 0, 0); - c69: rgb(176, 0, 0); - c70: rgb(179, 0, 0); - c71: rgb(181, 0, 0); - c72: rgb(184, 0, 0); - c73: rgb(186, 0, 0); - c74: rgb(189, 0, 0); - c75: rgb(191, 0, 0); - c76: rgb(194, 0, 0); - c77: rgb(196, 0, 0); - c78: rgb(199, 0, 0); - c79: rgb(201, 0, 0); + c61: rgb(155.55, 0, 0); + c62: rgb(158.1, 0, 0); + c63: rgb(160.65, 0, 0); + c64: rgb(163.2, 0, 0); + c65: rgb(165.75, 0, 0); + c66: rgb(168.3, 0, 0); + c67: rgb(170.85, 0, 0); + c68: rgb(173.4, 0, 0); + c69: rgb(175.95, 0, 0); + c70: rgb(178.5, 0, 0); + c71: rgb(181.05, 0, 0); + c72: rgb(183.6, 0, 0); + c73: rgb(186.15, 0, 0); + c74: rgb(188.7, 0, 0); + c75: rgb(191.25, 0, 0); + c76: rgb(193.8, 0, 0); + c77: rgb(196.35, 0, 0); + c78: rgb(198.9, 0, 0); + c79: rgb(201.45, 0, 0); c80: rgb(204, 0, 0); - c81: rgb(207, 0, 0); - c82: rgb(209, 0, 0); - c83: rgb(212, 0, 0); - c84: rgb(214, 0, 0); - c85: rgb(217, 0, 0); - c86: rgb(219, 0, 0); - c87: rgb(222, 0, 0); - c88: rgb(224, 0, 0); - c89: rgb(227, 0, 0); - c90: rgb(230, 0, 0); - c91: rgb(232, 0, 0); - c92: rgb(235, 0, 0); - c93: rgb(237, 0, 0); - c94: rgb(240, 0, 0); - c95: rgb(242, 0, 0); - c96: rgb(245, 0, 0); - c97: rgb(247, 0, 0); - c98: rgb(250, 0, 0); - c99: rgb(252, 0, 0); + c81: rgb(206.55, 0, 0); + c82: rgb(209.1, 0, 0); + c83: rgb(211.65, 0, 0); + c84: rgb(214.2, 0, 0); + c85: rgb(216.75, 0, 0); + c86: rgb(219.3, 0, 0); + c87: rgb(221.85, 0, 0); + c88: rgb(224.4, 0, 0); + c89: rgb(226.95, 0, 0); + c90: rgb(229.5, 0, 0); + c91: rgb(232.05, 0, 0); + c92: rgb(234.6, 0, 0); + c93: rgb(237.15, 0, 0); + c94: rgb(239.7, 0, 0); + c95: rgb(242.25, 0, 0); + c96: rgb(244.8, 0, 0); + c97: rgb(247.35, 0, 0); + c98: rgb(249.9, 0, 0); + c99: rgb(252.45, 0, 0); c100: rgb(255, 0, 0); - c101: rgb(255, 0, 0); + c101: rgb(257.55, 0, 0); } <===> output-libsass.css diff --git a/spec/libsass/color-functions/rgb/rgba/b.hrx b/spec/libsass/color-functions/rgb/rgba/b.hrx index 2f1273b139..f816c99213 100644 --- a/spec/libsass/color-functions/rgb/rgba/b.hrx +++ b/spec/libsass/color-functions/rgb/rgba/b.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, 0, -1); c0: rgb(0, 0, 0); c1: rgb(0, 0, 1); c2: rgb(0, 0, 2); @@ -625,113 +625,113 @@ foo { c253: rgb(0, 0, 253); c254: rgb(0, 0, 254); c255: rgb(0, 0, 255); - c256: rgb(0, 0, 255); + c256: rgb(0, 0, 256); } foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, 0, -2.55); c0: rgb(0, 0, 0); - c1: rgb(0, 0, 3); - c2: rgb(0, 0, 5); - c3: rgb(0, 0, 8); - c4: rgb(0, 0, 10); - c5: rgb(0, 0, 13); - c6: rgb(0, 0, 15); - c7: rgb(0, 0, 18); - c8: rgb(0, 0, 20); - c9: rgb(0, 0, 23); - c10: rgb(0, 0, 26); - c11: rgb(0, 0, 28); - c12: rgb(0, 0, 31); - c13: rgb(0, 0, 33); - c14: rgb(0, 0, 36); - c15: rgb(0, 0, 38); - c16: rgb(0, 0, 41); - c17: rgb(0, 0, 43); - c18: rgb(0, 0, 46); - c19: rgb(0, 0, 48); + c1: rgb(0, 0, 2.55); + c2: rgb(0, 0, 5.1); + c3: rgb(0, 0, 7.65); + c4: rgb(0, 0, 10.2); + c5: rgb(0, 0, 12.75); + c6: rgb(0, 0, 15.3); + c7: rgb(0, 0, 17.85); + c8: rgb(0, 0, 20.4); + c9: rgb(0, 0, 22.95); + c10: rgb(0, 0, 25.5); + c11: rgb(0, 0, 28.05); + c12: rgb(0, 0, 30.6); + c13: rgb(0, 0, 33.15); + c14: rgb(0, 0, 35.7); + c15: rgb(0, 0, 38.25); + c16: rgb(0, 0, 40.8); + c17: rgb(0, 0, 43.35); + c18: rgb(0, 0, 45.9); + c19: rgb(0, 0, 48.45); c20: rgb(0, 0, 51); - c21: rgb(0, 0, 54); - c22: rgb(0, 0, 56); - c23: rgb(0, 0, 59); - c24: rgb(0, 0, 61); - c25: rgb(0, 0, 64); - c26: rgb(0, 0, 66); - c27: rgb(0, 0, 69); - c28: rgb(0, 0, 71); - c29: rgb(0, 0, 74); - c30: rgb(0, 0, 77); - c31: rgb(0, 0, 79); - c32: rgb(0, 0, 82); - c33: rgb(0, 0, 84); - c34: rgb(0, 0, 87); - c35: rgb(0, 0, 89); - c36: rgb(0, 0, 92); - c37: rgb(0, 0, 94); - c38: rgb(0, 0, 97); - c39: rgb(0, 0, 99); + c21: rgb(0, 0, 53.55); + c22: rgb(0, 0, 56.1); + c23: rgb(0, 0, 58.65); + c24: rgb(0, 0, 61.2); + c25: rgb(0, 0, 63.75); + c26: rgb(0, 0, 66.3); + c27: rgb(0, 0, 68.85); + c28: rgb(0, 0, 71.4); + c29: rgb(0, 0, 73.95); + c30: rgb(0, 0, 76.5); + c31: rgb(0, 0, 79.05); + c32: rgb(0, 0, 81.6); + c33: rgb(0, 0, 84.15); + c34: rgb(0, 0, 86.7); + c35: rgb(0, 0, 89.25); + c36: rgb(0, 0, 91.8); + c37: rgb(0, 0, 94.35); + c38: rgb(0, 0, 96.9); + c39: rgb(0, 0, 99.45); c40: rgb(0, 0, 102); - c41: rgb(0, 0, 105); - c42: rgb(0, 0, 107); - c43: rgb(0, 0, 110); - c44: rgb(0, 0, 112); - c45: rgb(0, 0, 115); - c46: rgb(0, 0, 117); - c47: rgb(0, 0, 120); - c48: rgb(0, 0, 122); - c49: rgb(0, 0, 125); - c50: rgb(0, 0, 128); - c51: rgb(0, 0, 130); - c52: rgb(0, 0, 133); - c53: rgb(0, 0, 135); - c54: rgb(0, 0, 138); - c55: rgb(0, 0, 140); - c56: rgb(0, 0, 143); - c57: rgb(0, 0, 145); - c58: rgb(0, 0, 148); - c59: rgb(0, 0, 150); + c41: rgb(0, 0, 104.55); + c42: rgb(0, 0, 107.1); + c43: rgb(0, 0, 109.65); + c44: rgb(0, 0, 112.2); + c45: rgb(0, 0, 114.75); + c46: rgb(0, 0, 117.3); + c47: rgb(0, 0, 119.85); + c48: rgb(0, 0, 122.4); + c49: rgb(0, 0, 124.95); + c50: rgb(0, 0, 127.5); + c51: rgb(0, 0, 130.05); + c52: rgb(0, 0, 132.6); + c53: rgb(0, 0, 135.15); + c54: rgb(0, 0, 137.7); + c55: rgb(0, 0, 140.25); + c56: rgb(0, 0, 142.8); + c57: rgb(0, 0, 145.35); + c58: rgb(0, 0, 147.9); + c59: rgb(0, 0, 150.45); c60: rgb(0, 0, 153); - c61: rgb(0, 0, 156); - c62: rgb(0, 0, 158); - c63: rgb(0, 0, 161); - c64: rgb(0, 0, 163); - c65: rgb(0, 0, 166); - c66: rgb(0, 0, 168); - c67: rgb(0, 0, 171); - c68: rgb(0, 0, 173); - c69: rgb(0, 0, 176); - c70: rgb(0, 0, 179); - c71: rgb(0, 0, 181); - c72: rgb(0, 0, 184); - c73: rgb(0, 0, 186); - c74: rgb(0, 0, 189); - c75: rgb(0, 0, 191); - c76: rgb(0, 0, 194); - c77: rgb(0, 0, 196); - c78: rgb(0, 0, 199); - c79: rgb(0, 0, 201); + c61: rgb(0, 0, 155.55); + c62: rgb(0, 0, 158.1); + c63: rgb(0, 0, 160.65); + c64: rgb(0, 0, 163.2); + c65: rgb(0, 0, 165.75); + c66: rgb(0, 0, 168.3); + c67: rgb(0, 0, 170.85); + c68: rgb(0, 0, 173.4); + c69: rgb(0, 0, 175.95); + c70: rgb(0, 0, 178.5); + c71: rgb(0, 0, 181.05); + c72: rgb(0, 0, 183.6); + c73: rgb(0, 0, 186.15); + c74: rgb(0, 0, 188.7); + c75: rgb(0, 0, 191.25); + c76: rgb(0, 0, 193.8); + c77: rgb(0, 0, 196.35); + c78: rgb(0, 0, 198.9); + c79: rgb(0, 0, 201.45); c80: rgb(0, 0, 204); - c81: rgb(0, 0, 207); - c82: rgb(0, 0, 209); - c83: rgb(0, 0, 212); - c84: rgb(0, 0, 214); - c85: rgb(0, 0, 217); - c86: rgb(0, 0, 219); - c87: rgb(0, 0, 222); - c88: rgb(0, 0, 224); - c89: rgb(0, 0, 227); - c90: rgb(0, 0, 230); - c91: rgb(0, 0, 232); - c92: rgb(0, 0, 235); - c93: rgb(0, 0, 237); - c94: rgb(0, 0, 240); - c95: rgb(0, 0, 242); - c96: rgb(0, 0, 245); - c97: rgb(0, 0, 247); - c98: rgb(0, 0, 250); - c99: rgb(0, 0, 252); + c81: rgb(0, 0, 206.55); + c82: rgb(0, 0, 209.1); + c83: rgb(0, 0, 211.65); + c84: rgb(0, 0, 214.2); + c85: rgb(0, 0, 216.75); + c86: rgb(0, 0, 219.3); + c87: rgb(0, 0, 221.85); + c88: rgb(0, 0, 224.4); + c89: rgb(0, 0, 226.95); + c90: rgb(0, 0, 229.5); + c91: rgb(0, 0, 232.05); + c92: rgb(0, 0, 234.6); + c93: rgb(0, 0, 237.15); + c94: rgb(0, 0, 239.7); + c95: rgb(0, 0, 242.25); + c96: rgb(0, 0, 244.8); + c97: rgb(0, 0, 247.35); + c98: rgb(0, 0, 249.9); + c99: rgb(0, 0, 252.45); c100: rgb(0, 0, 255); - c101: rgb(0, 0, 255); + c101: rgb(0, 0, 257.55); } <===> output-libsass.css diff --git a/spec/libsass/color-functions/rgb/rgba/g.hrx b/spec/libsass/color-functions/rgb/rgba/g.hrx index 274c0389dc..16d61c5d17 100644 --- a/spec/libsass/color-functions/rgb/rgba/g.hrx +++ b/spec/libsass/color-functions/rgb/rgba/g.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, -1, 0); c0: rgb(0, 0, 0); c1: rgb(0, 1, 0); c2: rgb(0, 2, 0); @@ -625,113 +625,113 @@ foo { c253: rgb(0, 253, 0); c254: rgb(0, 254, 0); c255: rgb(0, 255, 0); - c256: rgb(0, 255, 0); + c256: rgb(0, 256, 0); } foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, -2.55, 0); c0: rgb(0, 0, 0); - c1: rgb(0, 3, 0); - c2: rgb(0, 5, 0); - c3: rgb(0, 8, 0); - c4: rgb(0, 10, 0); - c5: rgb(0, 13, 0); - c6: rgb(0, 15, 0); - c7: rgb(0, 18, 0); - c8: rgb(0, 20, 0); - c9: rgb(0, 23, 0); - c10: rgb(0, 26, 0); - c11: rgb(0, 28, 0); - c12: rgb(0, 31, 0); - c13: rgb(0, 33, 0); - c14: rgb(0, 36, 0); - c15: rgb(0, 38, 0); - c16: rgb(0, 41, 0); - c17: rgb(0, 43, 0); - c18: rgb(0, 46, 0); - c19: rgb(0, 48, 0); + c1: rgb(0, 2.55, 0); + c2: rgb(0, 5.1, 0); + c3: rgb(0, 7.65, 0); + c4: rgb(0, 10.2, 0); + c5: rgb(0, 12.75, 0); + c6: rgb(0, 15.3, 0); + c7: rgb(0, 17.85, 0); + c8: rgb(0, 20.4, 0); + c9: rgb(0, 22.95, 0); + c10: rgb(0, 25.5, 0); + c11: rgb(0, 28.05, 0); + c12: rgb(0, 30.6, 0); + c13: rgb(0, 33.15, 0); + c14: rgb(0, 35.7, 0); + c15: rgb(0, 38.25, 0); + c16: rgb(0, 40.8, 0); + c17: rgb(0, 43.35, 0); + c18: rgb(0, 45.9, 0); + c19: rgb(0, 48.45, 0); c20: rgb(0, 51, 0); - c21: rgb(0, 54, 0); - c22: rgb(0, 56, 0); - c23: rgb(0, 59, 0); - c24: rgb(0, 61, 0); - c25: rgb(0, 64, 0); - c26: rgb(0, 66, 0); - c27: rgb(0, 69, 0); - c28: rgb(0, 71, 0); - c29: rgb(0, 74, 0); - c30: rgb(0, 77, 0); - c31: rgb(0, 79, 0); - c32: rgb(0, 82, 0); - c33: rgb(0, 84, 0); - c34: rgb(0, 87, 0); - c35: rgb(0, 89, 0); - c36: rgb(0, 92, 0); - c37: rgb(0, 94, 0); - c38: rgb(0, 97, 0); - c39: rgb(0, 99, 0); + c21: rgb(0, 53.55, 0); + c22: rgb(0, 56.1, 0); + c23: rgb(0, 58.65, 0); + c24: rgb(0, 61.2, 0); + c25: rgb(0, 63.75, 0); + c26: rgb(0, 66.3, 0); + c27: rgb(0, 68.85, 0); + c28: rgb(0, 71.4, 0); + c29: rgb(0, 73.95, 0); + c30: rgb(0, 76.5, 0); + c31: rgb(0, 79.05, 0); + c32: rgb(0, 81.6, 0); + c33: rgb(0, 84.15, 0); + c34: rgb(0, 86.7, 0); + c35: rgb(0, 89.25, 0); + c36: rgb(0, 91.8, 0); + c37: rgb(0, 94.35, 0); + c38: rgb(0, 96.9, 0); + c39: rgb(0, 99.45, 0); c40: rgb(0, 102, 0); - c41: rgb(0, 105, 0); - c42: rgb(0, 107, 0); - c43: rgb(0, 110, 0); - c44: rgb(0, 112, 0); - c45: rgb(0, 115, 0); - c46: rgb(0, 117, 0); - c47: rgb(0, 120, 0); - c48: rgb(0, 122, 0); - c49: rgb(0, 125, 0); - c50: rgb(0, 128, 0); - c51: rgb(0, 130, 0); - c52: rgb(0, 133, 0); - c53: rgb(0, 135, 0); - c54: rgb(0, 138, 0); - c55: rgb(0, 140, 0); - c56: rgb(0, 143, 0); - c57: rgb(0, 145, 0); - c58: rgb(0, 148, 0); - c59: rgb(0, 150, 0); + c41: rgb(0, 104.55, 0); + c42: rgb(0, 107.1, 0); + c43: rgb(0, 109.65, 0); + c44: rgb(0, 112.2, 0); + c45: rgb(0, 114.75, 0); + c46: rgb(0, 117.3, 0); + c47: rgb(0, 119.85, 0); + c48: rgb(0, 122.4, 0); + c49: rgb(0, 124.95, 0); + c50: rgb(0, 127.5, 0); + c51: rgb(0, 130.05, 0); + c52: rgb(0, 132.6, 0); + c53: rgb(0, 135.15, 0); + c54: rgb(0, 137.7, 0); + c55: rgb(0, 140.25, 0); + c56: rgb(0, 142.8, 0); + c57: rgb(0, 145.35, 0); + c58: rgb(0, 147.9, 0); + c59: rgb(0, 150.45, 0); c60: rgb(0, 153, 0); - c61: rgb(0, 156, 0); - c62: rgb(0, 158, 0); - c63: rgb(0, 161, 0); - c64: rgb(0, 163, 0); - c65: rgb(0, 166, 0); - c66: rgb(0, 168, 0); - c67: rgb(0, 171, 0); - c68: rgb(0, 173, 0); - c69: rgb(0, 176, 0); - c70: rgb(0, 179, 0); - c71: rgb(0, 181, 0); - c72: rgb(0, 184, 0); - c73: rgb(0, 186, 0); - c74: rgb(0, 189, 0); - c75: rgb(0, 191, 0); - c76: rgb(0, 194, 0); - c77: rgb(0, 196, 0); - c78: rgb(0, 199, 0); - c79: rgb(0, 201, 0); + c61: rgb(0, 155.55, 0); + c62: rgb(0, 158.1, 0); + c63: rgb(0, 160.65, 0); + c64: rgb(0, 163.2, 0); + c65: rgb(0, 165.75, 0); + c66: rgb(0, 168.3, 0); + c67: rgb(0, 170.85, 0); + c68: rgb(0, 173.4, 0); + c69: rgb(0, 175.95, 0); + c70: rgb(0, 178.5, 0); + c71: rgb(0, 181.05, 0); + c72: rgb(0, 183.6, 0); + c73: rgb(0, 186.15, 0); + c74: rgb(0, 188.7, 0); + c75: rgb(0, 191.25, 0); + c76: rgb(0, 193.8, 0); + c77: rgb(0, 196.35, 0); + c78: rgb(0, 198.9, 0); + c79: rgb(0, 201.45, 0); c80: rgb(0, 204, 0); - c81: rgb(0, 207, 0); - c82: rgb(0, 209, 0); - c83: rgb(0, 212, 0); - c84: rgb(0, 214, 0); - c85: rgb(0, 217, 0); - c86: rgb(0, 219, 0); - c87: rgb(0, 222, 0); - c88: rgb(0, 224, 0); - c89: rgb(0, 227, 0); - c90: rgb(0, 230, 0); - c91: rgb(0, 232, 0); - c92: rgb(0, 235, 0); - c93: rgb(0, 237, 0); - c94: rgb(0, 240, 0); - c95: rgb(0, 242, 0); - c96: rgb(0, 245, 0); - c97: rgb(0, 247, 0); - c98: rgb(0, 250, 0); - c99: rgb(0, 252, 0); + c81: rgb(0, 206.55, 0); + c82: rgb(0, 209.1, 0); + c83: rgb(0, 211.65, 0); + c84: rgb(0, 214.2, 0); + c85: rgb(0, 216.75, 0); + c86: rgb(0, 219.3, 0); + c87: rgb(0, 221.85, 0); + c88: rgb(0, 224.4, 0); + c89: rgb(0, 226.95, 0); + c90: rgb(0, 229.5, 0); + c91: rgb(0, 232.05, 0); + c92: rgb(0, 234.6, 0); + c93: rgb(0, 237.15, 0); + c94: rgb(0, 239.7, 0); + c95: rgb(0, 242.25, 0); + c96: rgb(0, 244.8, 0); + c97: rgb(0, 247.35, 0); + c98: rgb(0, 249.9, 0); + c99: rgb(0, 252.45, 0); c100: rgb(0, 255, 0); - c101: rgb(0, 255, 0); + c101: rgb(0, 257.55, 0); } <===> output-libsass.css diff --git a/spec/libsass/color-functions/rgb/rgba/r.hrx b/spec/libsass/color-functions/rgb/rgba/r.hrx index f4a78f87da..2d2220b590 100644 --- a/spec/libsass/color-functions/rgb/rgba/r.hrx +++ b/spec/libsass/color-functions/rgb/rgba/r.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, 0, 0); + c-1: rgb(0, -1, 0); c0: rgb(0, 0, 0); c1: rgb(0, 1, 0); c2: rgb(0, 2, 0); @@ -625,113 +625,113 @@ foo { c253: rgb(0, 253, 0); c254: rgb(0, 254, 0); c255: rgb(0, 255, 0); - c256: rgb(0, 255, 0); + c256: rgb(0, 256, 0); } foo { - c-1: rgb(0, 0, 0); + c-1: rgb(-2.55, 0, 0); c0: rgb(0, 0, 0); - c1: rgb(3, 0, 0); - c2: rgb(5, 0, 0); - c3: rgb(8, 0, 0); - c4: rgb(10, 0, 0); - c5: rgb(13, 0, 0); - c6: rgb(15, 0, 0); - c7: rgb(18, 0, 0); - c8: rgb(20, 0, 0); - c9: rgb(23, 0, 0); - c10: rgb(26, 0, 0); - c11: rgb(28, 0, 0); - c12: rgb(31, 0, 0); - c13: rgb(33, 0, 0); - c14: rgb(36, 0, 0); - c15: rgb(38, 0, 0); - c16: rgb(41, 0, 0); - c17: rgb(43, 0, 0); - c18: rgb(46, 0, 0); - c19: rgb(48, 0, 0); + c1: rgb(2.55, 0, 0); + c2: rgb(5.1, 0, 0); + c3: rgb(7.65, 0, 0); + c4: rgb(10.2, 0, 0); + c5: rgb(12.75, 0, 0); + c6: rgb(15.3, 0, 0); + c7: rgb(17.85, 0, 0); + c8: rgb(20.4, 0, 0); + c9: rgb(22.95, 0, 0); + c10: rgb(25.5, 0, 0); + c11: rgb(28.05, 0, 0); + c12: rgb(30.6, 0, 0); + c13: rgb(33.15, 0, 0); + c14: rgb(35.7, 0, 0); + c15: rgb(38.25, 0, 0); + c16: rgb(40.8, 0, 0); + c17: rgb(43.35, 0, 0); + c18: rgb(45.9, 0, 0); + c19: rgb(48.45, 0, 0); c20: rgb(51, 0, 0); - c21: rgb(54, 0, 0); - c22: rgb(56, 0, 0); - c23: rgb(59, 0, 0); - c24: rgb(61, 0, 0); - c25: rgb(64, 0, 0); - c26: rgb(66, 0, 0); - c27: rgb(69, 0, 0); - c28: rgb(71, 0, 0); - c29: rgb(74, 0, 0); - c30: rgb(77, 0, 0); - c31: rgb(79, 0, 0); - c32: rgb(82, 0, 0); - c33: rgb(84, 0, 0); - c34: rgb(87, 0, 0); - c35: rgb(89, 0, 0); - c36: rgb(92, 0, 0); - c37: rgb(94, 0, 0); - c38: rgb(97, 0, 0); - c39: rgb(99, 0, 0); + c21: rgb(53.55, 0, 0); + c22: rgb(56.1, 0, 0); + c23: rgb(58.65, 0, 0); + c24: rgb(61.2, 0, 0); + c25: rgb(63.75, 0, 0); + c26: rgb(66.3, 0, 0); + c27: rgb(68.85, 0, 0); + c28: rgb(71.4, 0, 0); + c29: rgb(73.95, 0, 0); + c30: rgb(76.5, 0, 0); + c31: rgb(79.05, 0, 0); + c32: rgb(81.6, 0, 0); + c33: rgb(84.15, 0, 0); + c34: rgb(86.7, 0, 0); + c35: rgb(89.25, 0, 0); + c36: rgb(91.8, 0, 0); + c37: rgb(94.35, 0, 0); + c38: rgb(96.9, 0, 0); + c39: rgb(99.45, 0, 0); c40: rgb(102, 0, 0); - c41: rgb(105, 0, 0); - c42: rgb(107, 0, 0); - c43: rgb(110, 0, 0); - c44: rgb(112, 0, 0); - c45: rgb(115, 0, 0); - c46: rgb(117, 0, 0); - c47: rgb(120, 0, 0); - c48: rgb(122, 0, 0); - c49: rgb(125, 0, 0); - c50: rgb(128, 0, 0); - c51: rgb(130, 0, 0); - c52: rgb(133, 0, 0); - c53: rgb(135, 0, 0); - c54: rgb(138, 0, 0); - c55: rgb(140, 0, 0); - c56: rgb(143, 0, 0); - c57: rgb(145, 0, 0); - c58: rgb(148, 0, 0); - c59: rgb(150, 0, 0); + c41: rgb(104.55, 0, 0); + c42: rgb(107.1, 0, 0); + c43: rgb(109.65, 0, 0); + c44: rgb(112.2, 0, 0); + c45: rgb(114.75, 0, 0); + c46: rgb(117.3, 0, 0); + c47: rgb(119.85, 0, 0); + c48: rgb(122.4, 0, 0); + c49: rgb(124.95, 0, 0); + c50: rgb(127.5, 0, 0); + c51: rgb(130.05, 0, 0); + c52: rgb(132.6, 0, 0); + c53: rgb(135.15, 0, 0); + c54: rgb(137.7, 0, 0); + c55: rgb(140.25, 0, 0); + c56: rgb(142.8, 0, 0); + c57: rgb(145.35, 0, 0); + c58: rgb(147.9, 0, 0); + c59: rgb(150.45, 0, 0); c60: rgb(153, 0, 0); - c61: rgb(156, 0, 0); - c62: rgb(158, 0, 0); - c63: rgb(161, 0, 0); - c64: rgb(163, 0, 0); - c65: rgb(166, 0, 0); - c66: rgb(168, 0, 0); - c67: rgb(171, 0, 0); - c68: rgb(173, 0, 0); - c69: rgb(176, 0, 0); - c70: rgb(179, 0, 0); - c71: rgb(181, 0, 0); - c72: rgb(184, 0, 0); - c73: rgb(186, 0, 0); - c74: rgb(189, 0, 0); - c75: rgb(191, 0, 0); - c76: rgb(194, 0, 0); - c77: rgb(196, 0, 0); - c78: rgb(199, 0, 0); - c79: rgb(201, 0, 0); + c61: rgb(155.55, 0, 0); + c62: rgb(158.1, 0, 0); + c63: rgb(160.65, 0, 0); + c64: rgb(163.2, 0, 0); + c65: rgb(165.75, 0, 0); + c66: rgb(168.3, 0, 0); + c67: rgb(170.85, 0, 0); + c68: rgb(173.4, 0, 0); + c69: rgb(175.95, 0, 0); + c70: rgb(178.5, 0, 0); + c71: rgb(181.05, 0, 0); + c72: rgb(183.6, 0, 0); + c73: rgb(186.15, 0, 0); + c74: rgb(188.7, 0, 0); + c75: rgb(191.25, 0, 0); + c76: rgb(193.8, 0, 0); + c77: rgb(196.35, 0, 0); + c78: rgb(198.9, 0, 0); + c79: rgb(201.45, 0, 0); c80: rgb(204, 0, 0); - c81: rgb(207, 0, 0); - c82: rgb(209, 0, 0); - c83: rgb(212, 0, 0); - c84: rgb(214, 0, 0); - c85: rgb(217, 0, 0); - c86: rgb(219, 0, 0); - c87: rgb(222, 0, 0); - c88: rgb(224, 0, 0); - c89: rgb(227, 0, 0); - c90: rgb(230, 0, 0); - c91: rgb(232, 0, 0); - c92: rgb(235, 0, 0); - c93: rgb(237, 0, 0); - c94: rgb(240, 0, 0); - c95: rgb(242, 0, 0); - c96: rgb(245, 0, 0); - c97: rgb(247, 0, 0); - c98: rgb(250, 0, 0); - c99: rgb(252, 0, 0); + c81: rgb(206.55, 0, 0); + c82: rgb(209.1, 0, 0); + c83: rgb(211.65, 0, 0); + c84: rgb(214.2, 0, 0); + c85: rgb(216.75, 0, 0); + c86: rgb(219.3, 0, 0); + c87: rgb(221.85, 0, 0); + c88: rgb(224.4, 0, 0); + c89: rgb(226.95, 0, 0); + c90: rgb(229.5, 0, 0); + c91: rgb(232.05, 0, 0); + c92: rgb(234.6, 0, 0); + c93: rgb(237.15, 0, 0); + c94: rgb(239.7, 0, 0); + c95: rgb(242.25, 0, 0); + c96: rgb(244.8, 0, 0); + c97: rgb(247.35, 0, 0); + c98: rgb(249.9, 0, 0); + c99: rgb(252.45, 0, 0); c100: rgb(255, 0, 0); - c101: rgb(255, 0, 0); + c101: rgb(257.55, 0, 0); } <===> output-libsass.css diff --git a/spec/libsass/color-functions/saturate.hrx b/spec/libsass/color-functions/saturate.hrx index 167059777d..b64b142b85 100644 --- a/spec/libsass/color-functions/saturate.hrx +++ b/spec/libsass/color-functions/saturate.hrx @@ -104,6 +104,109 @@ foo { } <===> output.css +foo { + c0: hsl(100deg, 0%, 50%); + c1: hsl(100deg, 1%, 50%); + c2: hsl(100deg, 2%, 50%); + c3: hsl(100deg, 3%, 50%); + c4: hsl(100deg, 4%, 50%); + c5: hsl(100deg, 5%, 50%); + c6: hsl(100deg, 6%, 50%); + c7: hsl(100deg, 7%, 50%); + c8: hsl(100deg, 8%, 50%); + c9: hsl(100deg, 9%, 50%); + c10: hsl(100deg, 10%, 50%); + c11: hsl(100deg, 11%, 50%); + c12: hsl(100deg, 12%, 50%); + c13: hsl(100deg, 13%, 50%); + c14: hsl(100deg, 14%, 50%); + c15: hsl(100deg, 15%, 50%); + c16: hsl(100deg, 16%, 50%); + c17: hsl(100deg, 17%, 50%); + c18: hsl(100deg, 18%, 50%); + c19: hsl(100deg, 19%, 50%); + c20: hsl(100deg, 20%, 50%); + c21: hsl(100deg, 21%, 50%); + c22: hsl(100deg, 22%, 50%); + c23: hsl(100deg, 23%, 50%); + c24: hsl(100deg, 24%, 50%); + c25: hsl(100deg, 25%, 50%); + c26: hsl(100deg, 26%, 50%); + c27: hsl(100deg, 27%, 50%); + c28: hsl(100deg, 28%, 50%); + c29: hsl(100deg, 29%, 50%); + c30: hsl(100deg, 30%, 50%); + c31: hsl(100deg, 31%, 50%); + c32: hsl(100deg, 32%, 50%); + c33: hsl(100deg, 33%, 50%); + c34: hsl(100deg, 34%, 50%); + c35: hsl(100deg, 35%, 50%); + c36: hsl(100deg, 36%, 50%); + c37: hsl(100deg, 37%, 50%); + c38: hsl(100deg, 38%, 50%); + c39: hsl(100deg, 39%, 50%); + c41: hsl(100deg, 41%, 50%); + c42: hsl(100deg, 42%, 50%); + c43: hsl(100deg, 43%, 50%); + c44: hsl(100deg, 44%, 50%); + c45: hsl(100deg, 45%, 50%); + c46: hsl(100deg, 46%, 50%); + c47: hsl(100deg, 47%, 50%); + c48: hsl(100deg, 48%, 50%); + c49: hsl(100deg, 49%, 50%); + c50: hsl(100deg, 50%, 50%); + c51: hsl(100deg, 51%, 50%); + c52: hsl(100deg, 52%, 50%); + c53: hsl(100deg, 53%, 50%); + c54: hsl(100deg, 54%, 50%); + c55: hsl(100deg, 55%, 50%); + c56: hsl(100deg, 56%, 50%); + c57: hsl(100deg, 57%, 50%); + c58: hsl(100deg, 58%, 50%); + c59: hsl(100deg, 59%, 50%); + c60: hsl(100deg, 60%, 50%); + c61: hsl(100deg, 61%, 50%); + c62: hsl(100deg, 62%, 50%); + c63: hsl(100deg, 63%, 50%); + c64: hsl(100deg, 64%, 50%); + c65: hsl(100deg, 65%, 50%); + c66: hsl(100deg, 66%, 50%); + c67: hsl(100deg, 67%, 50%); + c68: hsl(100deg, 68%, 50%); + c69: hsl(100deg, 69%, 50%); + c70: hsl(100deg, 70%, 50%); + c71: hsl(100deg, 71%, 50%); + c72: hsl(100deg, 72%, 50%); + c73: hsl(100deg, 73%, 50%); + c74: hsl(100deg, 74%, 50%); + c75: hsl(100deg, 75%, 50%); + c76: hsl(100deg, 76%, 50%); + c77: hsl(100deg, 77%, 50%); + c78: hsl(100deg, 78%, 50%); + c79: hsl(100deg, 79%, 50%); + c81: hsl(100deg, 81%, 50%); + c82: hsl(100deg, 82%, 50%); + c83: hsl(100deg, 83%, 50%); + c84: hsl(100deg, 84%, 50%); + c85: hsl(100deg, 85%, 50%); + c86: hsl(100deg, 86%, 50%); + c87: hsl(100deg, 87%, 50%); + c88: hsl(100deg, 88%, 50%); + c89: hsl(100deg, 89%, 50%); + c90: hsl(100deg, 90%, 50%); + c91: hsl(100deg, 91%, 50%); + c92: hsl(100deg, 92%, 50%); + c93: hsl(100deg, 93%, 50%); + c94: hsl(100deg, 94%, 50%); + c95: hsl(100deg, 95%, 50%); + c96: hsl(100deg, 96%, 50%); + c97: hsl(100deg, 97%, 50%); + c98: hsl(100deg, 98%, 50%); + c99: hsl(100deg, 99%, 50%); + c100: hsl(100deg, 100%, 50%); +} + +<===> output-libsass.css foo { c0: gray; c1: #7f817e; diff --git a/spec/libsass/test.hrx b/spec/libsass/test.hrx index 3b53f01844..6d10939b86 100644 --- a/spec/libsass/test.hrx +++ b/spec/libsass/test.hrx @@ -109,7 +109,7 @@ span { g: #782005; h: hsl(25deg, 100%, 80%); h: rgba(204, 86, 0, 0.8); - h: rgba(204, 85, 0, 0.8); + h: hsla(25deg, 100%, 40%, 0.8); i: hsla(25deg, 100%, 40%, 0.8); foo: url("http://blah/flah/grah"); foo: url(http://foo/bar/buzz.css); diff --git a/spec/non_conformant/colors/basic.hrx b/spec/non_conformant/colors/basic.hrx index c0cd43abfa..7c2f22b9ba 100644 --- a/spec/non_conformant/colors/basic.hrx +++ b/spec/non_conformant/colors/basic.hrx @@ -14,7 +14,7 @@ p { color: red green blue; color: redhux; color: redgreen; - foo: rgb(200, 255, 255); + foo: rgb(200, 382.5, 433.5); } <===> output-libsass.css diff --git a/spec/non_conformant/colors/change-color.hrx b/spec/non_conformant/colors/change-color.hrx index ce7d4ec719..d327e98c80 100644 --- a/spec/non_conformant/colors/change-color.hrx +++ b/spec/non_conformant/colors/change-color.hrx @@ -6,6 +6,14 @@ p { color: change-color(hsl(25, 100%, 80%), $lightness: 40%, $alpha: 0.8); } <===> output.css +p { + color: #102005; + color: rgba(16, 32, 48, 0.325); + color: #782005; + color: hsla(25deg, 100%, 40%, 0.8); +} + +<===> output-libsass.css p { color: #102005; color: rgba(16, 32, 48, 0.325); diff --git a/spec/non_conformant/errors/fn-change-color-1.hrx b/spec/non_conformant/errors/fn-change-color-1.hrx index b634dacd26..223771f1c9 100644 --- a/spec/non_conformant/errors/fn-change-color-1.hrx +++ b/spec/non_conformant/errors/fn-change-color-1.hrx @@ -3,9 +3,9 @@ foo { test: change-color(red, $red: 0.5, $hue: 0.2); } <===> error -Error: RGB parameters may not be passed along with HSL parameters. +Error: $hue: Color space rgb doesn't have a channel with this name. , -2 | test: change-color(red, $red: 0.5, $hue: 0.2); +2 | test: change-color(red, $red: 0.5, $hue: 0.2); | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 2:9 root stylesheet diff --git a/spec/values/calculation/calc/error/value.hrx b/spec/values/calculation/calc/error/value.hrx index 5eee0e63ba..a36a0b6aa0 100644 --- a/spec/values/calculation/calc/error/value.hrx +++ b/spec/values/calculation/calc/error/value.hrx @@ -60,7 +60,7 @@ $a: 1 2 3; b {c: calc($a)} <===> variable/list/error -Error: Value 1 2 3 can't be used in a calculation. +Error: Value (1 2 3) can't be used in a calculation. , 2 | b {c: calc($a)} | ^^ @@ -159,7 +159,7 @@ Error: Value get-function("get-function") can't be used in a calculation. b {c: calc(a())} <===> function/list/error -Error: Value 1 2 3 can't be used in a calculation. +Error: Value (1 2 3) can't be used in a calculation. , 2 | b {c: calc(a())} | ^^^ diff --git a/test/cli-args.test.ts b/test/cli-args.test.ts index c06c5b0654..4d9ae499cf 100644 --- a/test/cli-args.test.ts +++ b/test/cli-args.test.ts @@ -1,8 +1,8 @@ import yargs from 'yargs'; -import {parseArgs, CliArgs} from '../lib-js/cli-args'; +import {parseArgs, CliArgs} from '../lib/cli-args'; // mock the compiler, since we don't actually care that it's created -jest.mock('../lib-js/compiler'); +jest.mock('../lib/compiler'); function wrap(yargs: yargs.Argv<{}>): yargs.Argv<{}> { return yargs.fail((msg, error) => { diff --git a/test/compiler.test.ts b/test/compiler.test.ts index 937ab35e53..b3c4c2515f 100644 --- a/test/compiler.test.ts +++ b/test/compiler.test.ts @@ -1,7 +1,7 @@ import {promises as fs} from 'fs'; import os from 'os'; import path from 'path'; -import {DartCompiler} from '../lib-js/compiler'; +import {DartCompiler} from '../lib/compiler'; describe('DartCompiler', () => { it('gracefully handles an executable that crashes on launch', async () => { diff --git a/test/fixtures/mock-compiler.ts b/test/fixtures/mock-compiler.ts index 29c41c165e..e33a8e1f9a 100644 --- a/test/fixtures/mock-compiler.ts +++ b/test/fixtures/mock-compiler.ts @@ -1,6 +1,6 @@ import yaml from 'js-yaml'; -import {Compiler, Stdio} from '../../lib-js/compiler'; -import {SpecDirectory} from '../../lib-js/spec-directory'; +import {Compiler, Stdio} from '../../lib/compiler'; +import {SpecDirectory} from '../../lib/spec-directory'; class MockCompiler extends Compiler { constructor(private readonly specDir: SpecDirectory) { diff --git a/test/interactor/loop.test.ts b/test/interactor/loop.test.ts index 7098470853..788f1c0024 100644 --- a/test/interactor/loop.test.ts +++ b/test/interactor/loop.test.ts @@ -1,7 +1,7 @@ -import {Interactor} from '../../lib-js/interactor'; +import {Interactor} from '../../lib/interactor'; import {Readable, Writable} from 'stream'; -import {fromContents} from '../../lib-js/spec-directory'; -import TestCase from '../../lib-js/test-case'; +import {fromContents} from '../../lib/spec-directory'; +import TestCase from '../../lib/test-case'; import {mockCompiler} from '../fixtures/mock-compiler'; class MemoryWritable extends Writable { diff --git a/test/interactor/options.test.ts b/test/interactor/options.test.ts index dddff97b42..153f8917a3 100644 --- a/test/interactor/options.test.ts +++ b/test/interactor/options.test.ts @@ -1,5 +1,5 @@ -import {TestCaseArg, optionsFor} from '../../lib-js/interactor'; -import {SassResult, TestResult} from '../../lib-js/test-case/util'; +import {TestCaseArg, optionsFor} from '../../lib/interactor'; +import {SassResult, TestResult} from '../../lib/test-case/util'; interface MockTestCaseArg { impl?: string; diff --git a/test/spec-directory/cleanup.test.ts b/test/spec-directory/cleanup.test.ts index f482e7b47b..bbd4ddaba2 100644 --- a/test/spec-directory/cleanup.test.ts +++ b/test/spec-directory/cleanup.test.ts @@ -1,4 +1,4 @@ -import {withAsyncCleanup} from '../../lib-js/spec-directory/cleanup'; +import {withAsyncCleanup} from '../../lib/spec-directory/cleanup'; describe('withAsyncCleanup', () => { it('does the cleanup function on normal exit', async () => { diff --git a/test/spec-directory/hrx.test.ts b/test/spec-directory/hrx.test.ts index 8cacbc2fbe..21c1ccbf3d 100644 --- a/test/spec-directory/hrx.test.ts +++ b/test/spec-directory/hrx.test.ts @@ -1,5 +1,5 @@ -import {fromContents} from '../../lib-js/spec-directory'; -import {toHrx} from '../../lib-js/spec-directory/hrx'; +import {fromContents} from '../../lib/spec-directory'; +import {toHrx} from '../../lib/spec-directory/hrx'; describe('toHrx', () => { async function expectHrx( diff --git a/test/spec-directory/iteration.test.ts b/test/spec-directory/iteration.test.ts index bd5184f440..0004bfe973 100644 --- a/test/spec-directory/iteration.test.ts +++ b/test/spec-directory/iteration.test.ts @@ -1,5 +1,5 @@ import path from 'path'; -import {fromPath, SpecDirectory} from '../../lib-js/spec-directory'; +import {fromPath, SpecDirectory} from '../../lib/spec-directory'; describe('SpecDirectory iteration', () => { describe('forEachTest', () => { diff --git a/test/spec-directory/mutations.test.ts b/test/spec-directory/mutations.test.ts index 936b8d8bec..27bbf16c65 100644 --- a/test/spec-directory/mutations.test.ts +++ b/test/spec-directory/mutations.test.ts @@ -1,5 +1,5 @@ import path from 'path'; -import {fromPath} from '../../lib-js/spec-directory'; +import {fromPath} from '../../lib/spec-directory'; // Tests for methods on SpecDirectory that mutate its contents describe('SpecDirectory mutations', () => { diff --git a/test/spec-directory/options.test.ts b/test/spec-directory/options.test.ts index 6413ce029d..119c0194f0 100644 --- a/test/spec-directory/options.test.ts +++ b/test/spec-directory/options.test.ts @@ -1,4 +1,4 @@ -import {fromContents} from '../../lib-js/spec-directory'; +import {fromContents} from '../../lib/spec-directory'; describe('SpecDirectory options', () => { it('works in the basic case', async () => { diff --git a/test/spot-check.test.ts b/test/spot-check.test.ts index c5cb8a1141..dee3c66443 100644 --- a/test/spot-check.test.ts +++ b/test/spot-check.test.ts @@ -1,5 +1,5 @@ import * as p from 'path'; -import * as specDirectory from '../lib-js/spec-directory'; +import * as specDirectory from '../lib/spec-directory'; // Spot checks for common spec errors. diff --git a/test/test-case/actual.test.ts b/test/test-case/actual.test.ts index f495e02619..4690ab68f5 100644 --- a/test/test-case/actual.test.ts +++ b/test/test-case/actual.test.ts @@ -1,7 +1,7 @@ -import {fromContents} from '../../lib-js/spec-directory'; +import {fromContents} from '../../lib/spec-directory'; import {mockCompiler} from '../fixtures/mock-compiler'; -import TestCase from '../../lib-js/test-case'; -import {SassResult} from '../../lib-js/test-case/util'; +import TestCase from '../../lib/test-case'; +import {SassResult} from '../../lib/test-case/util'; describe('TestCase::actual()', () => { async function getResults(contents: string): Promise { diff --git a/test/test-case/compare.test.ts b/test/test-case/compare.test.ts index 1553208265..adf8e74129 100644 --- a/test/test-case/compare.test.ts +++ b/test/test-case/compare.test.ts @@ -2,7 +2,7 @@ import { extractErrorMessage, extractWarningMessages, normalizeOutput, -} from '../../lib-js/test-case/compare'; +} from '../../lib/test-case/compare'; describe('result comparison', () => { describe('normalizeOutput', () => { diff --git a/test/test-case/expected.test.ts b/test/test-case/expected.test.ts index bd1e239ad4..96d7ddcb47 100644 --- a/test/test-case/expected.test.ts +++ b/test/test-case/expected.test.ts @@ -1,5 +1,5 @@ -import {fromContents} from '../../lib-js/spec-directory'; -import {getExpectedResult} from '../../lib-js/test-case/expected'; +import {fromContents} from '../../lib/spec-directory'; +import {getExpectedResult} from '../../lib/test-case/expected'; describe('getExpectedResult()', () => { describe('output', () => { diff --git a/test/test-case/mutation.test.ts b/test/test-case/mutation.test.ts index 3e7ba4718d..ee48f929e5 100644 --- a/test/test-case/mutation.test.ts +++ b/test/test-case/mutation.test.ts @@ -1,5 +1,5 @@ -import {fromContents, SpecDirectory} from '../../lib-js/spec-directory'; -import TestCase from '../../lib-js/test-case'; +import {fromContents, SpecDirectory} from '../../lib/spec-directory'; +import TestCase from '../../lib/test-case'; import {mockCompiler} from '../fixtures/mock-compiler'; function makeHrx(files: Record) { diff --git a/test/test-case/result.test.ts b/test/test-case/result.test.ts index c2b50c7cf9..d51f2a0088 100644 --- a/test/test-case/result.test.ts +++ b/test/test-case/result.test.ts @@ -1,6 +1,6 @@ -import {fromContents} from '../../lib-js/spec-directory'; +import {fromContents} from '../../lib/spec-directory'; import {mockCompiler} from '../fixtures/mock-compiler'; -import TestCase, {TestResult} from '../../lib-js/test-case'; +import TestCase, {TestResult} from '../../lib/test-case'; // TODO most of these tests can be factored out into tests that comparing two results work describe('TestCase::result()', () => { diff --git a/tests/cli_spec.rb b/tests/cli_spec.rb deleted file mode 100644 index 058a4019f2..0000000000 --- a/tests/cli_spec.rb +++ /dev/null @@ -1,38 +0,0 @@ -# frozen_string_literal: true - -require_relative 'spec_helper' - -RSpec.describe 'run tests', type: :aruba do - it 'runs a single spec' do - run_sass('basic') - - expect(last_command_started).to be_successfully_executed - end - - it 'should not run todo specs by default' do - run_sass('todo') - - expect(last_command_started).to be_successfully_executed - expect(test_results(last_command_started.output)[:skips]).to eq 1 - end - - it 'should run todo specs with --run-todo flag' do - run_sass('todo', ["--run-todo"]) - - expect(last_command_started).to be_successfully_executed - expect(test_results(last_command_started.output)[:skips]).to eq 0 - end - - it 'should not allow limit to take a negative number' do - run_sass('limit', ["--limit -10"]) - - expect(last_command_started).to_not be_successfully_executed - end - - it 'should not allow limit to take a negative number' do - run_sass('limit', ["--run-todo", "--limit 3"]) - - expect(last_command_started).to be_successfully_executed - expect(test_results(last_command_started.output)[:runs]).to eq 3 - end -end diff --git a/tests/directory_spec.rb b/tests/directory_spec.rb deleted file mode 100644 index dafe881940..0000000000 --- a/tests/directory_spec.rb +++ /dev/null @@ -1,900 +0,0 @@ -# coding: utf-8 -# frozen_string_literal: true - -require_relative 'spec_helper' -require 'sass_spec' - -RSpec::Matchers.define_negated_matcher :not_include, :include - -# A regexp that matches an error message that indicates that a file/directory -# doesn't exist. -DOESNT_EXIST = /No such file or directory|doesn't exist|There is no directory/ - -describe SassSpec::Directory do - include_context :uses_fs - after(:each) { SassSpec::Directory._hrx_cache.clear } - - def directory(folder=nil) - SassSpec::Directory.new(dir(folder)) - end - - it 'throws an error if the path is the working directory' do - expect { SassSpec::Directory.new('.') }.to raise_error(". must be beneath the working directory") - end - - it 'throws an error if the path is outside the working directory' do - FileUtils.mkdir_p '/foo/bar/baz' - Dir.chdir '/foo/bar/baz' - expect { SassSpec::Directory.new('/foo') }.to raise_error("/foo must be beneath the working directory") - end - - context 'in a real directory' do - before(:each) { FileUtils.mkdir_p 'spec' } - - it "throws an error if the path doesn't exist" do - expect { directory('foo') }.to raise_error DOESNT_EXIST - end - - describe '#path' do - it 'returns the path relative to the working directory' do - expect(directory.path).to be == Pathname.new(dir) - end - - it 'returns a relative path even if passed an absolute path' do - expect(SassSpec::Directory.new(File.expand_path(dir)).path).to be == Pathname.new(dir) - end - - it 'uses forward slashes even on Windows' do - FileUtils.mkdir_p dir('foo/bar/baz') - expect(directory('foo/bar/baz').path.to_s).to include('/').and not_include("\\") - end - end - - describe '#hrx?' do - it 'returns false' do - expect(directory).not_to be_hrx - end - end - - describe '#parent' do - it 'returns nil if the parent is the cwd' do - expect(directory.parent).to be nil - end - - it 'returns a new directory' do - FileUtils.mkdir_p dir('foo/bar/baz') - expect(directory('foo/bar/baz').parent.to_s).to be == 'spec/foo/bar' - end - end - - describe '#glob' do - it 'returns matching physical files in the directory' do - File.write(dir('foo.txt'), '') - File.write(dir('bar.txt'), '') - File.write(dir('baz'), '') - expect(directory.glob('*.txt')).to contain_exactly('foo.txt', 'bar.txt') - end - - it 'returns matching physical files recursively beneath the directory' do - FileUtils.mkdir_p(dir('foo/bar/baz')) - File.write(dir('foo/bar/baz/zip'), '') - File.write(dir('foo/bar/zap.txt'), '') - File.write(dir('foo/zop'), '') - File.write(dir('qux.txt'), '') - expect(directory.glob('**/*.txt')).to contain_exactly('foo/bar/zap.txt', 'qux.txt') - end - - it 'returns files recursively within an HRX archive' do - FileUtils.mkdir_p(dir('foo')) - File.write(dir('foo/bar.hrx'), < baz/zip.txt -zip -<===> qux/zap -zap -<===> zop.txt -zop -END - expect(directory.glob('**/*.txt')) - .to contain_exactly('foo/bar/baz/zip.txt', 'foo/bar/zop.txt') - end - - it 'returns all files recursively within the directory or an HRX archive' do - FileUtils.mkdir_p(dir('foo')) - File.write(dir('foo/bar.hrx'), < baz/zip -zip -<===> zap -zap -END - File.write(dir('foo/qux'), '') - File.write(dir('bang'), '') - expect(directory.glob('**/*')) - .to contain_exactly('foo/bar/baz/zip', 'foo/bar/zap', 'foo/qux', 'bang') - end - - it "doesn't return an HRX archive itself" do - File.write(dir('foo.hrx'), '') - expect(directory.glob('*')).to be_empty - end - - it "ignores HRX archives when run non-recursively" do - File.write(dir('foo.hrx'), '<===> bar.txt\nbar') - expect(directory.glob('*.txt')).to be_empty - end - end - - describe '#file?' do - it 'returns true if the given file exists' do - File.write(dir('qux.txt'), 'hello!') - expect(directory.file?('qux.txt')).to be true - end - - it 'returns true if the given file exists in a subdirectory' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - expect(directory.file?('foo/bar/baz/qux.txt')).to be true - end - - it 'returns true if the given file exists in an HRX archive' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), < baz/qux.txt -hello! -END - expect(directory.file?('foo/bar/baz/qux.txt')).to be true - end - - it 'treats the path as relative to the directory' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - expect(directory('foo/bar/baz').file?('qux.txt')).to be true - end - - it "returns false if the given file doesn't exist" do - expect(directory.file?('qux.txt')).to be false - end - - it "returns false if the given file doesn't exist in a subdirectory" do - expect(directory.file?('foo/bar/baz/qux.txt')).to be false - end - - it "returns false if the given file doesn't exist in an HRX archive" do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), '') - expect(directory.file?('foo/bar/baz/qux.txt')).to be false - end - - it "returns false if a directory with the given name exists" do - FileUtils.mkdir dir('subdir') - expect(directory.file?('subdir')).to be false - end - end - - describe '#read' do - it 'returns the contents of the given file' do - File.write(dir('qux.txt'), 'hello!') - expect(directory.read('qux.txt')).to be == 'hello!' - end - - it 'returns the contents of a file in a subdirectory' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - expect(directory.read('foo/bar/baz/qux.txt')).to be == 'hello!' - end - - it 'returns the contents of a file in an HRX archive' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), "<===> baz/qux.txt\nhello!") - expect(directory.read('foo/bar/baz/qux.txt')).to be == 'hello!' - end - - it 'treats the path as relative to the directory' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - expect(directory('foo/bar/baz').read('qux.txt')).to be == 'hello!' - end - - context 'with a real filesystem' do - # FakeFS doesn't seem to respect `File.read()`'s encoding. - include_context :uses_real_fs - - it 'reads the file as binary' do - FileUtils.mkdir_p 'spec' - File.write('spec/qux.txt', '👭') - expect(SassSpec::Directory.new('spec').read('qux.txt')) - .to be == '👭'.dup.force_encoding('ASCII-8BIT') - end - end - - it "throws an error if the file doesn't exist" do - expect { directory.read('qux.txt') }.to raise_error DOESNT_EXIST - end - - it "throws an error if the given file doesn't exist in a subdirectory" do - expect { expect(directory.read('foo/bar/baz/qux.txt')) }.to raise_error DOESNT_EXIST - end - - it "throws an error if the given file doesn't exist in an HRX archive" do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), '') - expect { directory.read('foo/bar/baz/qux.txt') }.to raise_error DOESNT_EXIST - end - end - - describe '#write' do - it 'writes the contents of the given file' do - directory.write('qux.txt', 'hello!') - expect(File.read(dir('qux.txt'))).to be == 'hello!' - end - - it 'writes the file in a subdirectory' do - FileUtils.mkdir_p dir('foo/bar/baz') - directory.write('foo/bar/baz/qux.txt', 'hello!') - expect(File.read(dir('foo/bar/baz/qux.txt'))).to be == 'hello!' - end - - it 'writes the file in an HRX archive' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), '') - directory.write('foo/bar/baz.txt', 'hello!') - expect(File.read(dir('foo/bar.hrx'))).to be == "<===> baz.txt\nhello!" - end - - it 'writes the contents of a file in an HRX archive' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), "<===> baz/qux.txt\nhello!") - expect(directory.read('foo/bar/baz/qux.txt')).to be == 'hello!' - end - - it 'treats the path as relative to the directory' do - FileUtils.mkdir_p dir('foo/bar/baz') - directory('foo/bar/baz').write('qux.txt', 'hello!') - expect(File.read(dir('foo/bar/baz/qux.txt'))).to be == 'hello!' - end - - it "throws an error if the given subdirectory doesn't exist" do - expect { expect(directory.write('foo/bar/baz/qux.txt', 'hello!')) } - .to raise_error DOESNT_EXIST - end - - it "throws an error if the given subdirectory doesn't exist within an HRX archive" do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), '') - expect { expect(directory.write('foo/bar/baz/qux.txt', 'hello!')) } - .to raise_error DOESNT_EXIST - end - end - - describe '#delete' do - it 'deletes the given file' do - File.write(dir('qux.txt'), '') - directory.delete('qux.txt') - expect(File.exists?(dir('qux.txt'))).to be false - end - - it 'deletes the file in a subdirectory' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - directory.delete('foo/bar/baz/qux.txt') - expect(File.exists?(dir('foo/bar/baz/qux.txt'))).to be false - end - - it 'deletes the file in an HRX archive' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), < baz/bang.txt -bang! -<===> baz/qux.txt -qux? -<===> zip/zap.txt -zop~ -END - directory.delete('foo/bar/baz/qux.txt') - expect(File.read(dir('foo/bar.hrx'))).to be == < baz/bang.txt -bang! -<===> zip/zap.txt -zop~ -END - end - - it 'treats the path as relative to the directory' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), '') - directory('foo/bar/baz').delete('qux.txt') - expect(File.exists?(dir('foo/bar/baz/qux.txt'))).to be false - end - - it "throws an error if the file doesn't exist" do - expect { directory.delete('qux.txt') }.to raise_error DOESNT_EXIST - end - - it "throws an error if the given subdirectory doesn't exist" do - expect { expect(directory.delete('foo/bar/baz/qux.txt')) }.to raise_error DOESNT_EXIST - end - - it "throws an error if the given subdirectory doesn't exist within an HRX archive" do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), '') - expect { expect(directory.delete('foo/bar/baz/qux.txt')) } - .to raise_error DOESNT_EXIST - end - - context 'with if_exists' do - it 'deletes the given file' do - File.write(dir('qux.txt'), '') - directory.delete('qux.txt', if_exists: true) - expect(File.exists?(dir('qux.txt'))).to be false - end - - it "does nothing if the file doesn't exist" do - expect { directory.delete('qux.txt', if_exists: true) }.not_to raise_error - end - end - end - - describe '#rename' do - it 'moves the given file' do - File.write(dir('qux.txt'), 'hello!') - directory.rename('qux.txt', 'zip.txt') - expect(File.read(dir('zip.txt'))).to be == 'hello!' - expect(File.exists?(dir('qux.txt'))).to be false - end - - it 'moves the file within a subdirectory' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - directory.rename('foo/bar/baz/qux.txt', 'foo/bar/baz/zip.txt') - expect(File.read(dir('foo/bar/baz/zip.txt'))).to be == 'hello!' - expect(File.exists?(dir('foo/bar/baz/qux.txt'))).to be false - end - - it 'moves the file between subdirectories' do - FileUtils.mkdir_p dir('foo/bar/baz') - FileUtils.mkdir_p dir('do/re/me') - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - directory.rename('foo/bar/baz/qux.txt', 'do/re/me/fa.txt') - expect(File.read(dir('do/re/me/fa.txt'))).to be == 'hello!' - expect(File.exists?(dir('foo/bar/baz/qux.txt'))).to be false - end - - it 'moves the file within an HRX archive' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), "<===> baz/qux.txt\nhello!") - directory.rename('foo/bar/baz/qux.txt', 'foo/bar/baz/zap.txt') - expect(File.read(dir('foo/bar.hrx'))).to be == "<===> baz/zap.txt\nhello!" - end - - it 'moves the file out of an HRX archive' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), "<===> baz/qux.txt\nhello!") - directory.rename('foo/bar/baz/qux.txt', 'qux.txt') - expect(File.exists?(dir('foo/bar.hrx'))).to be false - expect(File.read(dir('qux.txt'))).to be === 'hello!' - end - - it 'moves the file into an HRX archive' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), '') - File.write(dir('qux.txt'), 'hello!') - directory.rename('qux.txt', 'foo/bar/baz.txt') - expect(File.exists?(dir('qux.txt'))).to be false - expect(File.read(dir('foo/bar.hrx'))).to be === "<===> baz.txt\nhello!" - end - - it 'moves the file between HRX archives' do - FileUtils.mkdir_p dir('foo') - File.write(dir('foo/bar.hrx'), "<===> baz/qux.txt\nhello!") - File.write(dir('foo/zip.hrx'), '') - directory.rename('foo/bar/baz/qux.txt', 'foo/zip/zap.txt') - expect(File.exists?(dir('foo/bar.hrx'))).to be false - expect(File.read(dir('foo/zip.hrx'))).to be === "<===> zap.txt\nhello!" - end - - it 'treats the path as relative to the directory' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - directory('foo/bar/baz').rename('qux.txt', 'zip.txt') - expect(File.read(dir('foo/bar/baz/zip.txt'))).to be == 'hello!' - expect(File.exists?(dir('foo/bar/baz/qux.txt'))).to be false - end - - it "throws an error if the file doesn't exist" do - expect { directory.rename('qux.txt', 'zap.txt') }.to raise_error DOESNT_EXIST - end - - it "throws an error if the target directory doesn't exist" do - File.write(dir('qux.txt'), 'hello!') - expect { directory.rename('qux.txt', 'foo/zap.txt') }.to raise_error DOESNT_EXIST - end - end - - describe '#delete_dir!' do - it 'deletes the directory' do - directory.delete_dir! - expect(Dir.exists?(dir)).to be false - end - - it 'deletes the directory even if it contains files' do - File.write(dir('foo.txt'), '') - File.write(dir('bar.txt'), '') - File.write(dir('baz.txt'), '') - directory.delete_dir! - expect(Dir.exists?(dir)).to be false - end - - it 'deletes the directory even if it contains subdirectories' do - FileUtils.mkdir_p dir('foo/bar/baz') - File.write(dir('foo/bar/baz/qux.txt'), '') - directory.delete_dir! - end - - it 'treats the path as relative to the directory' do - FileUtils.mkdir_p dir('foo/bar/baz') - directory('foo/bar/baz').delete_dir! - expect(Dir.exists?(dir('foo/bar/baz'))).to be false - expect(Dir.exists?(dir('foo/bar'))).to be true - end - end - - describe '#with_real_files' do - it 'runs the block without any filesystem changes' do - dir = directory - dir.write('qux.txt', 'hello!') - dir.with_real_files do - expect(File.read(dir('qux.txt'))).to be == 'hello!' - end - end - - it 'forwards the return value from the block' do - expect(directory.with_real_files {:result}).to be :result - end - end - - describe '#to_hrx' do - it 'returns an empty string for an empty directory' do - expect(directory.to_hrx).to be_empty - end - - it 'returns files in the directory' do - dir = directory - dir.write('foo.txt', 'foo') - dir.write('bar.txt', 'bar') - dir.write('baz.txt', 'baz') - - # Slice the string because directory ordering is not guaranteed. - expect(dir.to_hrx.split("\n").each_slice(2).map {|s| s.join("\n")}).to contain_exactly( - "<===> spec/foo.txt\nfoo", - "<===> spec/bar.txt\nbar", - "<===> spec/baz.txt\nbaz" - ) - end - - it 'returns files in subdirectories' do - FileUtils.mkdir_p(dir('foo/bar/baz')) - File.write(dir('foo/bar/baz/qux.txt'), 'hello!') - expect(directory.to_hrx).to be == "<===> spec/foo/bar/baz/qux.txt\nhello!" - end - - it 'returns files in HRX archives' do - File.write(dir('archive.hrx'), < foo.txt -foo -<===> subdir/bar.txt -bar -END - expect(directory.to_hrx).to be == < spec/archive/foo.txt -foo -<===> spec/archive/subdir/bar.txt -bar -END - end - end - end - - context 'in an HRX directory' do - it "throws an error if the path doesn't exist" do - File.write('spec.hrx', '') - expect { directory('foo') }.to raise_error DOESNT_EXIST - end - - describe '#path' do - it 'returns the path relative to the working directory' do - File.write('spec.hrx', '') - expect(directory.path).to be == Pathname.new(dir) - end - - it 'returns a relative path even if passed an absolute path' do - File.write('spec.hrx', '') - expect(SassSpec::Directory.new(File.expand_path(dir)).path).to be == Pathname.new(dir) - end - - it 'uses forward slashes even on Windows' do - File.write('spec.hrx', "<===> foo/bar/baz/bang.txt\nbang") - expect(directory('foo/bar/baz').path.to_s).to include('/').and not_include("\\") - end - end - - describe '#hrx?' do - it 'returns false' do - File.write('spec.hrx', '') - expect(directory).to be_hrx - end - end - - describe '#parent' do - it 'returns nil if the parent is the cwd' do - File.write('spec.hrx', '') - expect(directory.parent).to be nil - end - - it 'returns a new directory' do - File.write('spec.hrx', "<===> foo/bar/baz/bang.txt\nbang") - FileUtils.mkdir_p dir('foo/bar/baz') - expect(directory('foo/bar/baz').parent.to_s).to be == 'spec/foo/bar' - end - end - - describe '#glob' do - it 'returns matching files in the directory' do - File.write('spec.hrx', < foo.txt -foo -<===> bar.txt -bar -<===> baz -baz -END - expect(directory.glob('*.txt')).to contain_exactly('foo.txt', 'bar.txt') - end - - it "doesn't return directories" do - File.write('spec.hrx', "<===> foo/\n") - expect(directory.glob('*')).to be_empty - end - end - - describe '#file?' do - it 'returns true if the given file exists' do - File.write('spec.hrx', "<===> qux.txt\nhello!") - expect(directory.file?('qux.txt')).to be true - end - - it 'returns true if the given file exists in a subdirectory' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - expect(directory.file?('foo/bar/baz/qux.txt')).to be true - end - - it 'treats the path as relative to the directory' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - expect(directory('foo/bar/baz').file?('qux.txt')).to be true - end - - it "returns false if the given file doesn't exist" do - File.write('spec.hrx', '') - expect(directory.file?('qux.txt')).to be false - end - - it "returns false if the given file doesn't exist in a subdirectory" do - File.write('spec.hrx', '') - expect(directory.file?('foo/bar/baz/qux.txt')).to be false - end - - it "returns false if a directory with the given name exists" do - File.write('spec.hrx', "<===> subdir/\n") - expect(directory.file?('subdir')).to be false - end - end - - describe '#read' do - it 'returns the contents of the given file' do - File.write('spec.hrx', "<===> qux.txt\nhello!") - expect(directory.read('qux.txt')).to be == 'hello!' - end - - it 'returns the contents of a file in a subdirectory' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - expect(directory.read('foo/bar/baz/qux.txt')).to be == 'hello!' - end - - it 'treats the path as relative to the directory' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - expect(directory('foo/bar/baz').read('qux.txt')).to be == 'hello!' - end - - it "throws an error if the file doesn't exist" do - File.write('spec.hrx', '') - expect { directory.read('qux.txt') }.to raise_error(/There is no file/) - end - - it "throws an error if the given file doesn't exist in a subdirectory" do - File.write('spec.hrx', '') - expect { expect(directory.read('foo/bar/baz/qux.txt')) }.to raise_error(/There is no file/) - end - end - - describe '#write' do - it 'writes the contents of the given file' do - File.write('spec.hrx', '') - directory.write('qux.txt', 'hello!') - expect(File.read('spec.hrx')).to be == "<===> qux.txt\nhello!" - end - - it 'writes the file in a subdirectory' do - File.write('spec.hrx', '') - directory.write('foo/bar/baz/qux.txt', 'hello!') - expect(File.read('spec.hrx')).to be == "<===> foo/bar/baz/qux.txt\nhello!" - end - - it 'treats the path as relative to the directory' do - File.write('spec.hrx', "<===> foo/bar/baz/zap.txt\nzap") - directory('foo/bar/baz').write('qux.txt', "hello!\n") - expect(File.read('spec.hrx')).to be == < foo/bar/baz/zap.txt -zap -<===> foo/bar/baz/qux.txt -hello! -END - end - end - - describe '#delete' do - it 'deletes the given file' do - File.write('spec.hrx', < qux.txt -hello -<===> zap.txt -world -END - directory.delete('qux.txt') - expect(File.read('spec.hrx')).to be == "<===> zap.txt\nworld\n" - end - - it "deletes the HRX file if the given file is the last one" do - File.write('spec.hrx', "<===> qux.txt\nhello!") - directory.delete('qux.txt') - expect(File.exists?('spec.hrx')).to be false - end - - it 'deletes the file in a subdirectory' do - File.write('spec.hrx', < foo/bar/baz/qux.txt -hello -<===> zap.txt -world -END - directory.delete('foo/bar/baz/qux.txt') - expect(File.read('spec.hrx')).to be == "<===> zap.txt\nworld\n" - end - - it 'treats the path as relative to the directory' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - directory('foo/bar/baz').delete('qux.txt') - expect(File.exists?('spec.hrx')).to be false - end - - it "throws an error if the file doesn't exist" do - File.write('spec.hrx', '') - expect { directory.delete('qux.txt') }.to raise_error(/doesn't exist/) - end - - it "throws an error if the given subdirectory doesn't exist" do - File.write('spec.hrx', '') - expect { expect(directory.delete('foo/bar/baz/qux.txt')) }.to raise_error DOESNT_EXIST - end - - context 'with if_exists' do - it 'deletes the given file' do - File.write('spec.hrx', < qux.txt -hello -<===> zap.txt -world -END - directory.delete('qux.txt', if_exists: true) - expect(File.read('spec.hrx')).to be == "<===> zap.txt\nworld\n" - end - - it "does nothing if the file doesn't exist" do - File.write('spec.hrx', "<===> zap.txt\nworld") - expect { directory.delete('qux.txt', if_exists: true) }.not_to raise_error - expect(File.read('spec.hrx')).to be == "<===> zap.txt\nworld" - end - end - end - - describe '#rename' do - it 'moves the given file' do - File.write('spec.hrx', "<===> qux.txt\nhello!") - directory.rename('qux.txt', 'zip.txt') - expect(File.read('spec.hrx')).to be == "<===> zip.txt\nhello!" - end - - it 'preserves an HRX comment' do - File.write('spec.hrx', < -comment! -<===> qux.txt -hello! -END - directory.rename('qux.txt', 'zip.txt') - expect(File.read('spec.hrx')).to be == < -comment! -<===> zip.txt -hello! -END - end - - it 'moves the file within a subdirectory' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - directory.rename('foo/bar/baz/qux.txt', 'foo/bar/baz/zip.txt') - expect(File.read('spec.hrx')).to be == "<===> foo/bar/baz/zip.txt\nhello!" - end - - it 'moves the file between subdirectories' do - File.write('spec.hrx', < foo/bar/baz/qux.txt -hello! - -<===> do/re/me/zap.txt -zap -END - directory.rename('foo/bar/baz/qux.txt', 'do/re/me/fa.txt') - expect(File.read('spec.hrx')).to be == < do/re/me/zap.txt -zap - -<===> do/re/me/fa.txt -hello! -END - end - - it 'treats the path as relative to the directory' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - directory('foo/bar/baz').rename('qux.txt', 'zip.txt') - expect(File.read('spec.hrx')).to be == "<===> foo/bar/baz/zip.txt\nhello!" - end - - it "throws an error if the file doesn't exist" do - File.write('spec.hrx', '') - expect { directory.rename('qux.txt', 'zap.txt') }.to raise_error(/doesn't exist/) - end - - it "throws an error if the target directory doesn't exist" do - File.write('spec.hrx', "<===> foo/qux.txt\nhello!") - expect { directory.rename('qux.txt', 'foo/zap.txt') }.to raise_error DOESNT_EXIST - end - end - - describe '#delete_dir!' do - it 'deletes the entire HRX file' do - File.write('spec.hrx', '') - directory.delete_dir! - expect(File.exists?('spec.hrx')).to be false - end - - it 'deletes a subdirectory within an HRX file' do - File.write('spec.hrx', < foo/bar/baz.txt -baz -<===> foo/bar/bang.txt -bang -<===> foo/qux.txt -qux -END - directory('foo/bar').delete_dir! - File.write('spec.hrx', "<===> foo/qux.txt\nqux") - end - - it "deletes a parent HRX file if it's now empty" do - File.write('spec.hrx', < foo/bar/baz.txt -baz -<===> foo/bar/bang.txt -bang -END - directory('foo/bar').delete_dir! - expect(File.exists?('spec.hrx')).to be false - end - end - - describe '#with_real_files' do - it 'creates physical files for files in the archive' do - File.write('spec.hrx', < foo.txt -foo -<===> bar.txt -bar -<===> baz.txt -baz -END - - directory.with_real_files do - expect(File.read('spec/foo.txt')).to be == 'foo' - expect(File.read('spec/bar.txt')).to be == 'bar' - expect(File.read('spec/baz.txt')).to be == "baz\n" - end - end - - it 'deletes physical files after the block' do - File.write('spec.hrx', "<===> foo.txt\nfoo") - directory.with_real_files {} - expect(Dir.exists?('spec')).to be false - end - - it 'only materializes a subdirectory if necessary' do - File.write('spec.hrx', < foo/bar/baz/qux.txt -qux -<===> foo/bar/baz.txt -baz -<===> foo/bar.txt -bar -END - - directory('foo/bar/baz').with_real_files do - expect(File.read('spec/foo/bar/baz/qux.txt')).to be == 'qux' - expect(File.exists?('spec/foo/bar/baz.txt')).to be false - expect(File.exists?('spec/foo/bar.txt')).to be false - end - end - - it 'deletes the parent directory after a subdirectory is materialized' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - directory('foo/bar/baz').with_real_files {} - expect(Dir.exists?('spec')).to be false - end - - it 'only materializes a parent directory if the subdirectory reaches out' do - File.write('spec.hrx', < foo/bar/baz/qux.txt -../../bar.txt -<===> foo/bar.txt -bar -<===> foo.txt -foo -END - - directory('foo/bar/baz').with_real_files do - expect(File.read('spec/foo/bar/baz/qux.txt')).to be == '../../bar.txt' - expect(File.read('spec/foo/bar.txt')).to be == 'bar' - expect(File.exists?('spec/foo.txt')).to be false - end - end - end - - describe '#to_hrx' do - it 'returns an empty string for an empty directory' do - File.write('spec.hrx', '') - expect(directory.to_hrx).to be_empty - end - - it 'returns files in the directory' do - File.write('spec.hrx', < foo.txt -foo -<===> bar.txt -bar -<===> baz.txt -baz -END - - expect(directory.to_hrx).to be == < spec/foo.txt -foo -<===> spec/bar.txt -bar -<===> spec/baz.txt -baz -END - end - - it 'returns files in subdirectories' do - File.write('spec.hrx', "<===> foo/bar/baz/qux.txt\nhello!") - expect(directory.to_hrx).to be == "<===> spec/foo/bar/baz/qux.txt\nhello!" - end - end - end -end diff --git a/tests/fixtures/basic/basic.hrx b/tests/fixtures/basic/basic.hrx deleted file mode 100644 index f4632693c4..0000000000 --- a/tests/fixtures/basic/basic.hrx +++ /dev/null @@ -1,9 +0,0 @@ -<===> input.scss -p { - color: #ff8000; -} -<===> output.css -input: ["--precision", "10", "--style", "expanded", "input.scss"] -file: p { - color: #ff8000; -} diff --git a/tests/fixtures/limit/basic.hrx b/tests/fixtures/limit/basic.hrx deleted file mode 100644 index 6d02c21713..0000000000 --- a/tests/fixtures/limit/basic.hrx +++ /dev/null @@ -1,51 +0,0 @@ -<===> limit/1/input.scss -p { - color: #ff8000; -} - -<===> limit/1/output.css -input: ["--precision", "10", "--style", "expanded", "input.scss"] -file: p { - color: #ff8000; -} - -<===> -============================================================ -<===> limit/2/input.scss -p { - color: #ff8000; -} - -<===> limit/2/output.css -input: ["--precision", "10", "--style", "expanded", "input.scss"] -file: p { - color: #ff8000; -} - -<===> -============================================================ -<===> limit/3/input.scss -p { - color: #ff8000; -} - -<===> limit/3/output.css -input: ["--precision", "10", "--style", "expanded", "input.scss"] -file: p { - color: #ff8000; -} - -<===> -============================================================ -<===> limit/4/input.scss -p { - color: #ff8000; -} - -<===> limit/4/output.css -input: ["--precision", "10", "--style", "expanded", "input.scss"] -file: p { - color: #ff8000; -} - -<===> diff --git a/tests/fixtures/todo/basic.hrx b/tests/fixtures/todo/basic.hrx deleted file mode 100644 index f580d4e45b..0000000000 --- a/tests/fixtures/todo/basic.hrx +++ /dev/null @@ -1,29 +0,0 @@ -<===> no_todo/input.scss -p { - color: #ff8000; -} - -<===> no_todo/output.css -input: ["--precision", "10", "--style", "expanded", "input.scss"] -file: p { - color: #ff8000; -} - -<===> -============================================================= -<===> todo/options.yml ---- -:todo: -- sass/sass#0000 - -<===> todo/input.scss -p { - color: #ff8000; -} - -<===> todo/output.css -input: ["--precision", "10", "--style", "expanded", "input.scss"] -file: p { - color: #ff8000; -} - diff --git a/tests/sass_stub b/tests/sass_stub deleted file mode 100755 index f560e3c232..0000000000 --- a/tests/sass_stub +++ /dev/null @@ -1,16 +0,0 @@ -#!/usr/bin/env ruby -# This program stubs out the Sass CLI. It does not apply any Sass -# transformations and simply outputs the input file to stdout. - -# Version flag needs to return a value. -if ARGV.last == '--version' - puts '0.1' -else - # sass-spec passes in full paths to the -I command. We should - # omit that path. - args = ARGV - arg_position_I = ARGV.index("-I") - # Array is shifted post_delete, so -I path will be at arg_position_I on second delete. - 2.times { ARGV.delete_at(arg_position_I) } if arg_position_I - puts ["input: #{args.inspect}", "file: #{File.read(ARGV.last)}"].join("\n") -end diff --git a/tests/spec_helper.rb b/tests/spec_helper.rb deleted file mode 100644 index 99d432f09d..0000000000 --- a/tests/spec_helper.rb +++ /dev/null @@ -1,62 +0,0 @@ -# coding: utf-8 -# frozen_string_literal: true - -require 'fakefs/spec_helpers' -require 'rspec' -require 'aruba/rspec' - -Aruba.configure do |config| - config.allow_absolute_paths = true -end - -# Given the output of sass-spec, -# return the number of tests in -# each state (success, failed, etc) -def test_results(output) - results = {} - matches = output.match( - /(?\d+) runs, (?\d+) assertions, (?\d+) failures, (?\d+) errors, (?\d+) skips/ - ) - matches.names.each { |k, v| results[k.to_sym] = matches[k].to_i } - results -end - -# Gives a command string that Aruba should run for a unit test. -# This command calls sass-spec using the sass stub. -# It takes in the name of a fixture folder and an array of additional flags. -def run_sass(fixture_folder, additional_flags = []) - copy "#{Dir.pwd}/tests/fixtures/#{fixture_folder}", 'tmp/aruba/spec' - run_command([ - "#{Dir.pwd}/sass-spec.rb #{additional_flags.join(' ')}", - "--command '#{Dir.pwd}/tests/sass_stub'", - 'tmp/aruba/spec' - ].join(' ')) -end - -# A context with a mocked filesystem. -shared_context :uses_fs do - include FakeFS::SpecHelpers - - # Returns `subdir` within the root spec directory. If `subdir` isn't passed, - # returns `'spec'` on its own. - def dir(subdir=nil) - subdir ? File.join('spec', subdir) : 'spec' - end -end - -# A context with a real temporary filesystem, for cases where mock_fs doesn't -# quite work. -shared_context :uses_real_fs do - before(:each) { FakeFS.deactivate! } - - around do |example| - Dir.mktmpdir('sass-spec-tests-') do |dir| - @dir = dir - Dir.chdir(dir) { example.run } - end - end - - def dir(subdir=nil) - subdir ? File.join('spec', subdir) : 'spec' - end -end diff --git a/tests/test_case_metadata_spec.rb b/tests/test_case_metadata_spec.rb deleted file mode 100644 index 1ac15dde7c..0000000000 --- a/tests/test_case_metadata_spec.rb +++ /dev/null @@ -1,101 +0,0 @@ -# frozen_string_literal: true - -require_relative 'spec_helper' -require 'sass_spec' - -describe SassSpec::TestCaseMetadata do - include_context :uses_fs - after(:each) { SassSpec::TestCaseMetadata.cache.clear } - - def create_options_yaml(folder=nil, dictionary) - dir = self.dir(folder) - FileUtils.mkdir_p(dir) - File.write(File.join(dir, 'options.yml'), dictionary.to_yaml) - end - - def metadata(folder=nil) - SassSpec::TestCaseMetadata.new(SassSpec::Directory.new(self.dir(folder))) - end - - describe '#initialize' do - it 'should load all options from the directory' do - create_options_yaml(foo: 'bar', baz: 'qux', zip: 'zap') - expect(metadata.options).to be == {foo: 'bar', baz: 'qux', zip: 'zap'} - end - - context 'with a parent directory' do - it 'should include options from the parent and child' do - create_options_yaml(foo: 'bar') - create_options_yaml('child', baz: 'qux') - create_options_yaml('child/grandchild', zip: 'zap') - expect(metadata('child/grandchild').options).to be == {foo: 'bar', baz: 'qux', zip: 'zap'} - end - - it 'should prefer child options to parent options' do - create_options_yaml(foo: 'parent') - create_options_yaml('child', foo: 'child') - expect(metadata('child').options).to be == {foo: 'child'} - end - - it 'should consider directories without options to have empty options' do - create_options_yaml(foo: 'bar') - create_options_yaml('child/grandchild', baz: 'qux') - expect(metadata('child/grandchild').options).to be == {foo: 'bar', baz: 'qux'} - end - - context 'and mergeable options' do - it 'should add each value to a list' do - create_options_yaml(ignore_for: 'dart-sass') - create_options_yaml('child', ignore_for: 'libsass') - create_options_yaml('child/grandchild', ignore_for: 'future-sass') - expect(metadata('child/grandchild').options).to( - be == {ignore_for: %w[dart-sass libsass future-sass]}) - end - - it 'should concatenate list values' do - create_options_yaml(ignore_for: 'dart-sass') - create_options_yaml('child', ignore_for: ['libsass', 'future-sass']) - expect(metadata('child').options).to( - be == {ignore_for: %w[dart-sass libsass future-sass]}) - end - end - end - end - - it 'should ignore impl when given ignore_for' do - create_options_yaml(ignore_for: ['dart-sass']) - expect(metadata.ignore_for?('dart-sass')).to be true - end - - it 'should ignore impl when given only_on' do - create_options_yaml(only_on: ['dart-sass']) - expect(metadata.ignore_for?('libsass')).to be true - end - - it 'should have precision' do - create_options_yaml(precision: 10) - expect(metadata.precision).to eq 10 - end - - context 'with todos' do - it 'should load todos from implementation names' do - create_options_yaml(todo: ['libsass']) - expect(metadata.todo?('libsass')).to be true - end - - it 'should load warning_todos from implementation names' do - create_options_yaml(warning_todo: ['libsass']) - expect(metadata.warning_todo?('libsass')).to be true - end - - it 'should load todos from issue numbers' do - create_options_yaml(todo: ['sass/libsass#2342']) - expect(metadata.todo?('libsass')).to be true - end - - it 'should load warning_todos from issue numbers' do - create_options_yaml(warning_todo: ['sass/libsass#2342']) - expect(metadata.warning_todo?('libsass')).to be true - end - end -end diff --git a/tsconfig.json b/tsconfig.json index 27e36773f6..3d0b7633c2 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -5,5 +5,5 @@ "rootDir": ".", "lib": ["ES2020"] }, - "include": ["lib-js/**/*.ts", "test/**/*.ts"] + "include": ["lib/**/*.ts", "test/**/*.ts"] } From 017ff983cf00e883ae5992df09a737241d11102b Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Tue, 13 Dec 2022 17:12:57 -0800 Subject: [PATCH 02/45] Use feature branches for testing the JS API (#1853) This also skips a few color tests for the embedded host --- .github/workflows/ci.yml | 58 +++++++++++++++------------------ js-api-spec/value/color.test.ts | 58 ++++++++++++++++++++------------- 2 files changed, 63 insertions(+), 53 deletions(-) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 77a214fd37..86d68bdb4b 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -64,18 +64,15 @@ jobs: - uses: dart-lang/setup-dart@v1 with: {sdk: "${{ matrix.dart_channel }}"} - - name: Install dart-sass - run: | - GITHUB_REF=${PR_REF:-$CURRENT_REF} - if [[ "$GITHUB_REF" == refs/heads/feature.* ]]; then branch="${GITHUB_REF:11}"; else branch=main; fi - git clone https://github.com/sass/dart-sass.git ../dart-sass --depth 1 --branch "$branch" - (cd ../dart-sass; dart pub get) - env: - PR_REF: "${{ github.base_ref }}" - CURRENT_REF: "${{ github.ref }}" + - name: Dart Sass | Checkout + uses: sass/clone-linked-repo@v1 + with: {repo: sass/dart-sass, path: dart-sass} + - name: Dart Sass | dart pub get + run: dart pub get + working-directory: dart-sass - name: Run specs - run: npm run sass-spec -- --dart ../dart-sass + run: npm run sass-spec -- --dart dart-sass libsass: name: "Language | LibSass" @@ -88,7 +85,7 @@ jobs: with: {node-version: "${{ env.NODE_VERSION }}"} - run: npm install - - name: Install sassc + - name: Install SassC run: | export SASS_LIBSASS_PATH=$BUILD_DIR/../libsass export SASS_SASSC_PATH=$BUILD_DIR/../sassc @@ -131,16 +128,16 @@ jobs: - uses: dart-lang/setup-dart@v1 with: {sdk: stable} - - name: Install Dart Sass + - name: Dart Sass | Checkout + uses: sass/clone-linked-repo@v1 + with: {repo: sass/dart-sass, path: dart-sass} + - name: Dart Sass | Install run: | - git clone https://github.com/sass/dart-sass.git ../dart-sass --depth 1 - ( - cd ../dart-sass - dart pub get - dart pub run grinder pkg-npm-dev - cd build/npm - npm install - ) + dart pub get + dart pub run grinder pkg-npm-dev + cd build/npm + npm install + working-directory: dart-sass - name: Check out Sass specification uses: sass/clone-linked-repo@v1 @@ -149,7 +146,7 @@ jobs: path: language - name: Run specs - run: npm run js-api-spec -- --sassPackage ../dart-sass/build/npm --sassSassRepo language + run: npm run js-api-spec -- --sassPackage dart-sass/build/npm --sassSassRepo language # The versions should be kept up-to-date with the latest LTS Node releases. # They next need to be rotated October 2021. See @@ -186,16 +183,15 @@ jobs: version: ${{ env.PROTOC_VERSION }} repo-token: '${{ github.token }}' - - name: Install sass-embedded + - name: Node.js Embedded Host | Checkout + uses: sass/clone-linked-repo@v1 + with: {repo: sass/embedded-host-node, path: embedded-host-node} + - name: Node.js Embedded Host | Install run: | - git clone https://github.com/sass/embedded-host-node.git \ - ../embedded-host-node --depth 1 - ( - cd ../embedded-host-node - npm install - npm run init - npm run compile - ) + npm install + npm run init + npm run compile + working-directory: embedded-host-node - name: Check out Sass specification uses: sass/clone-linked-repo@v1 @@ -204,4 +200,4 @@ jobs: path: language - name: Run specs - run: npm run js-api-spec -- --sassPackage ../embedded-host-node --sassSassRepo language + run: npm run js-api-spec -- --sassPackage embedded-host-node --sassSassRepo language diff --git a/js-api-spec/value/color.test.ts b/js-api-spec/value/color.test.ts index 8b8342eb6e..0ecd495a52 100644 --- a/js-api-spec/value/color.test.ts +++ b/js-api-spec/value/color.test.ts @@ -4,7 +4,7 @@ import {Value, SassColor} from 'sass'; -import '../utils'; +import {skipForImpl} from '../utils'; /** A utility function for creating an RGB color. */ function rgb( @@ -178,10 +178,13 @@ describe('SassColor', () => { expect(color.lightness).toBe(42); }); - it('has HWB channels', () => { - expect(color.hue).toBe(120); - expect(color.whiteness).toBe(24.360000000000003); - expect(color.blackness).toBe(40.36000000000001); + // sass/embedded-host-node#170 + skipForImpl('sass-embedded', () => { + it('has HWB channels', () => { + expect(color.hue).toBe(120); + expect(color.whiteness).toBe(24.360000000000003); + expect(color.blackness).toBe(40.36000000000001); + }); }); it('has an alpha channel', () => { @@ -215,16 +218,22 @@ describe('SassColor', () => { expect(color.blue).toBe(107); }); - it('has HSL channels', () => { - expect(color.hue).toBe(120); - expect(color.saturation).toBe(16.000000000000007); - expect(color.lightness).toBe(50); + // sass/embedded-host-node#170 + skipForImpl('sass-embedded', () => { + it('has HSL channels', () => { + expect(color.hue).toBe(120); + expect(color.saturation).toBe(16.000000000000007); + expect(color.lightness).toBe(50); + }); }); - it('has HWB channels', () => { - expect(color.hue).toBe(120); - expect(color.whiteness).toBe(42); - expect(color.blackness).toBe(42); + // sass/embedded-host-node#170 + skipForImpl('sass-embedded', () => { + it('has HWB channels', () => { + expect(color.hue).toBe(120); + expect(color.whiteness).toBe(42); + expect(color.blackness).toBe(42); + }); }); it('has an alpha channel', () => { @@ -375,15 +384,20 @@ describe('SassColor', () => { ).toEqualWithHash(hwb(120, 42, 42, 0.5)); }); - it('allows valid values', () => { - expect(color.change({whiteness: 0}).whiteness).toBe(0); - expect(color.change({whiteness: 100}).whiteness).toBe( - 60.141509433962256 - ); - expect(color.change({blackness: 0}).blackness).toBe(0); - expect(color.change({blackness: 100}).blackness).toBe(93.4065934065934); - expect(color.change({alpha: 0}).alpha).toBe(0); - expect(color.change({alpha: 1}).alpha).toBe(1); + // sass/embedded-host-node#170 + skipForImpl('sass-embedded', () => { + it('allows valid values', () => { + expect(color.change({whiteness: 0}).whiteness).toBe(0); + expect(color.change({whiteness: 100}).whiteness).toBe( + 60.141509433962256 + ); + expect(color.change({blackness: 0}).blackness).toBe(0); + expect(color.change({blackness: 100}).blackness).toBe( + 93.4065934065934 + ); + expect(color.change({alpha: 0}).alpha).toBe(0); + expect(color.change({alpha: 1}).alpha).toBe(1); + }); }); it('disallows invalid values', () => { From 717b64de02fe12044eadc9821f6ced50be2f464b Mon Sep 17 00:00:00 2001 From: Sondra Date: Tue, 13 Dec 2022 19:23:49 -0700 Subject: [PATCH 03/45] Add tests for color.is-legacy() (#1842) --- spec/core_functions/color/is_legacy.hrx | 276 ++++++++++++++++++++++++ 1 file changed, 276 insertions(+) create mode 100644 spec/core_functions/color/is_legacy.hrx diff --git a/spec/core_functions/color/is_legacy.hrx b/spec/core_functions/color/is_legacy.hrx new file mode 100644 index 0000000000..f8acdbc79f --- /dev/null +++ b/spec/core_functions/color/is_legacy.hrx @@ -0,0 +1,276 @@ +<===> options.yml +--- +:ignore_for: +- libsass + +<===> +================================================================================ +<===> rgb/input.scss +@use "sass:color"; +a {b: color.is-legacy(rgb(0 255 0))} + +<===> rgb/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> rgba/input.scss +@use "sass:color"; +a {b: color.is-legacy(rgba(72 122 180 / .2))} + +<===> rgba/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hwb/input.scss +@use "sass:color"; +a {b: color.is-legacy(hwb(0 50% 0%))} + +<===> hwb/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hsl/input.scss +@use "sass:color"; +a {b: color.is-legacy(hsl(110 31% 32%))} + +<===> hsl/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hex/input.scss +@use "sass:color"; +a {b: color.is-legacy(#f2ece4)} + +<===> hex/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> named/input.scss +@use "sass:color"; +a {b: color.is-legacy($color: rgb(255 0 0))} + +<===> named/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> color_keyword/input.scss +@use "sass:color"; +a {b: color.is-legacy(midnightblue)} + +<===> color_keyword/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> srgb/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(srgb 0.45098 0.07843 0.823530))} + +<===> srgb/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> srgb-linear/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(srgb-linear 0.45098 0.07843 0.823530))} + +<===> srgb-linear/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> display-p3/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(display-p3 0.515 0.35 0.3 / 1))} + +<===> display-p3/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> a98-rgb/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(a98-rgb 0 1 0))} + +<===> a98-rgb/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> prophoto-rgb/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(prophoto-rgb 0.42444 0.934918 0.190922))} + +<===> prophoto-rgb/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> rec2020/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(rec2020 0.42053 0.979780 0.00579))} + +<===> rec2020/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> xyz/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(xyz 0.0426 0.0442 0.0364))} + +<===> xyz/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> xyz-d50/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(xyz-d50 0.2005 0.14089 0.4472))} + +<===> xyz-d50/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> xyz-d65/input.scss +@use "sass:color"; +a {b: color.is-legacy(color(xyz-d65 0.21661 0.14602 0.59452))} + +<===> xyz-d65/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> lab/input.scss +@use "sass:color"; +a {b: color.is-legacy(lab(5 110 115))} + +<===> lab/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> lch/input.scss +@use "sass:color"; +a {b: color.is-legacy(lch(90.6 52.8 197))} + +<===> lch/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> oklab/input.scss +@use "sass:color"; +a {b: color.is-legacy(oklab(0.44027 0.08818 -0.13386))} + +<===> oklab/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> oklch/input.scss +@use "sass:color"; +a {b: color.is-legacy(oklch(70% 0.1 200))} + +<===> oklch/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> error/too_few_args/input.scss +@use "sass:color"; +a {b: color.is-legacy()} + +<===> error/too_few_args/error +Error: Missing argument $color. + ,--> input.scss +2 | a {b: color.is-legacy()} + | ^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function is-legacy($color) { + | ================= declaration + ' + input.scss 2:7 root stylesheet + +<===> error/too_few_args/error + +<===> +================================================================================ +<===> error/too_many_args/input.scss +@use "sass:color"; +a {b: color.is-legacy(rgb(0 255 0), a)} + +<===> error/too_many_args/error +Error: Only 1 argument allowed, but 2 were passed. + ,--> input.scss +2 | a {b: color.is-legacy(rgb(0 255 0), a)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function is-legacy($color) { + | ================= declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/type/input.scss +@use "sass:color"; +a {b: color.is-legacy(1)} + +<===> error/type/error +Error: $color: 1 is not a color. + , +2 | a {b: color.is-legacy(1)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet From b81eadbb85540734c02bd9934e49115b4e8c22a4 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 16 Dec 2022 13:32:17 -0800 Subject: [PATCH 04/45] Don't auto-skip dart-sass-embedded along with dart-sass (#1857) I added this under the erroneous impression that we ran *language* tests against Dart Sass rather than just *JS API* tests. --- .github/workflows/ci.yml | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 86d68bdb4b..01a063f80b 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -154,10 +154,7 @@ jobs: js_api_sass_embedded: name: "JS API | sass-embedded | Node ${{ matrix.node_version }} | ${{ matrix.os }}" runs-on: "${{ matrix.os }}" - if: >- - github.event_name != 'pull_request' || - (!contains(github.event.pull_request.body, 'skip sass-embedded') && - !contains(github.event.pull_request.body, 'skip dart-sass')) + if: github.event_name != 'pull_request' || !contains(github.event.pull_request.body, 'skip sass-embedded') strategy: fail-fast: false From cf219a94d7e7fa60fa2d95b4f81ffe36a41b489f Mon Sep 17 00:00:00 2001 From: Sondra Date: Mon, 19 Dec 2022 16:59:27 -0700 Subject: [PATCH 05/45] Add tests for color.space() (#1851) Co-authored-by: dvdherron Co-authored-by: Natalie Weizenbaum --- spec/core_functions/color/space.hrx | 265 ++++++++++++++++++++++++++++ 1 file changed, 265 insertions(+) create mode 100644 spec/core_functions/color/space.hrx diff --git a/spec/core_functions/color/space.hrx b/spec/core_functions/color/space.hrx new file mode 100644 index 0000000000..5dc37f5baa --- /dev/null +++ b/spec/core_functions/color/space.hrx @@ -0,0 +1,265 @@ +<===> options.yml +--- +:ignore_for: +- libsass + +<===> +================================================================================ +<===> rgb/input.scss +@use "sass:color"; +a {b: color.space(rgb(0 255 0))} + +<===> rgb/output.css +a { + b: rgb; +} + +<===> +================================================================================ +<===> rgba/input.scss +@use "sass:color"; +a {b: color.space(rgba(72 122 180 / .2))} + +<===> rgba/output.css +a { + b: rgb; +} + +<===> +================================================================================ +<===> hwb/input.scss +@use "sass:color"; +a {b: color.space(hwb(0 50% 0%))} + +<===> hwb/output.css +a { + b: hwb; +} + +<===> +================================================================================ +<===> hsl/input.scss +@use "sass:color"; +a {b: color.space(hsl(110 31% 32%))} + +<===> hsl/output.css +a { + b: hsl; +} + +<===> +================================================================================ +<===> hex/input.scss +@use "sass:color"; +a {b: color.space(#f2ece4)} + +<===> hex/output.css +a { + b: rgb; +} + +<===> +================================================================================ +<===> named/input.scss +@use "sass:color"; +a {b: color.space($color: midnightblue)} + +<===> named/output.css +a { + b: rgb; +} + +<===> +================================================================================ +<===> srgb/input.scss +@use "sass:color"; +a {b: color.space(color(srgb 0.45098 0.07843 0.823530))} + +<===> srgb/output.css +a { + b: srgb; +} + +<===> +================================================================================ +<===> srgb-linear/input.scss +@use "sass:color"; +a {b: color.space(color(srgb-linear 0.45098 0.07843 0.823530))} + +<===> srgb-linear/output.css +a { + b: srgb-linear; +} + +<===> +================================================================================ +<===> display-p3/input.scss +@use "sass:color"; +a {b: color.space(color(display-p3 0.515 0.35 0.3 / 1))} + +<===> display-p3/output.css +a { + b: display-p3; +} + +<===> +================================================================================ +<===> a98-rgb/input.scss +@use "sass:color"; +a {b: color.space(color(a98-rgb 0 1 0))} + +<===> a98-rgb/output.css +a { + b: a98-rgb; +} + +<===> +================================================================================ +<===> prophoto-rgb/input.scss +@use "sass:color"; +a {b: color.space(color(prophoto-rgb 0.42444 0.934918 0.190922))} + +<===> prophoto-rgb/output.css +a { + b: prophoto-rgb; +} + +<===> +================================================================================ +<===> rec2020/input.scss +@use "sass:color"; +a {b: color.space(color(rec2020 0.42053 0.979780 0.00579))} + +<===> rec2020/output.css +a { + b: rec2020; +} + +<===> +================================================================================ +<===> xyz/input.scss +@use "sass:color"; +a {b: color.space(color(xyz 0.0426 0.0442 0.0364))} + +<===> xyz/output.css +a { + b: xyz; +} + +<===> +================================================================================ +<===> xyz-d50/input.scss +@use "sass:color"; +a {b: color.space(color(xyz-d50 0.2005 0.14089 0.4472))} + +<===> xyz-d50/output.css +a { + b: xyz-d50; +} + +<===> +================================================================================ +<===> xyz-d65/input.scss +@use "sass:color"; +a {b: color.space(color(xyz-d65 0.21661 0.14602 0.59452))} + +<===> xyz-d65/output.css +a { + b: xyz; +} + +<===> +================================================================================ +<===> lab/input.scss +@use "sass:color"; +a {b: color.space(lab(5 110 115))} + +<===> lab/output.css +a { + b: lab; +} + +<===> +================================================================================ +<===> lch/input.scss +@use "sass:color"; +a {b: color.space(lch(90.6 52.8 197))} + +<===> lch/output.css +a { + b: lch; +} + +<===> +================================================================================ +<===> oklab/input.scss +@use "sass:color"; +a {b: color.space(oklab(0.44027 0.08818 -0.13386))} + +<===> oklab/output.css +a { + b: oklab; +} + +<===> +================================================================================ +<===> oklch/input.scss +@use "sass:color"; +a {b: color.space(oklch(70% 0.1 200))} + +<===> oklch/output.css +a { + b: oklch; +} + +<===> +================================================================================ +<===> error/too_few_args/input.scss +@use "sass:color"; +a {b: color.space()} + +<===> error/too_few_args/error +Error: Missing argument $color. + ,--> input.scss +2 | a {b: color.space()} + | ^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function space($color) { + | ============= declaration + ' + input.scss 2:7 root stylesheet + +<===> error/too_few_args/error + +<===> +================================================================================ +<===> error/too_many_args/input.scss +@use "sass:color"; +a {b: color.space(rgb(0 255 0), a)} + +<===> error/too_many_args/error +Error: Only 1 argument allowed, but 2 were passed. + ,--> input.scss +2 | a {b: color.space(rgb(0 255 0), a)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function space($color) { + | ============= declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/type/input.scss +@use "sass:color"; +a {b: color.space(1)} + +<===> error/type/error +Error: $color: 1 is not a color. + , +2 | a {b: color.space(1)} + | ^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet From b380938bf88060838b96451dbc081d7ed8a80a7a Mon Sep 17 00:00:00 2001 From: david herron <41588129+dvdherron@users.noreply.github.com> Date: Tue, 20 Dec 2022 01:05:28 +0100 Subject: [PATCH 06/45] [Color 4] Update tests for color.grayscale() (#1850) Co-authored-by: Natalie Weizenbaum --- spec/core_functions/color/grayscale.hrx | 42 +++++++++++++++++++++++++ 1 file changed, 42 insertions(+) diff --git a/spec/core_functions/color/grayscale.hrx b/spec/core_functions/color/grayscale.hrx index 79d7bcc331..b71fbca7cd 100644 --- a/spec/core_functions/color/grayscale.hrx +++ b/spec/core_functions/color/grayscale.hrx @@ -92,6 +92,48 @@ a { b: white; } +<===> +================================================================================ +<===> non_legacy/rectangular/options.yml +:ignore_for: + - libsass + +<===> non_legacy/rectangular/input.scss +a {b: grayscale(lab(50 -30 40))} + +<===> non_legacy/rectangular/output.css +a { + b: lab(48.58892555% 0.0000000648 -0.0000078984); +} + +<===> +================================================================================ +<===> non_legacy/polar/options.yml +:ignore_for: + - libsass + +<===> non_legacy/polar/input.scss +a {b: grayscale(lch(54.3 107 40.9))} + +<===> non_legacy/polar/output.css +a { + b: lch(56.854581217% 0.0000089094 270.4698997617deg); +} + +<===> +================================================================================ +<===> non_legacy/predefined/options.yml +:ignore_for: + - libsass + +<===> non_legacy/predefined/input.scss +a {b: grayscale(color(xyz-d65 0.41 0.21 0.02))} + +<===> non_legacy/predefined/output.css +a { + b: color(xyz 0.232829773 0.2449664044 0.2667826176); +} + <===> ================================================================================ <===> error/too_few_args/input.scss From 5ac09ad556b50a3e7a77e13fde926e6991a0fd74 Mon Sep 17 00:00:00 2001 From: Sondra Date: Tue, 20 Dec 2022 14:53:33 -0700 Subject: [PATCH 07/45] Add tests for all Deprecated Functions (#1852) Co-authored-by: Stacy Kvernmo Co-authored-by: dvdherron Co-authored-by: Natalie Weizenbaum --- lib/compiler.ts | 11 +- spec/core_functions/color/adjust_hue.hrx | 187 +++ spec/core_functions/color/blackness.hrx | 101 +- spec/core_functions/color/blue.hrx | 58 + spec/core_functions/color/darken.hrx | 103 ++ spec/core_functions/color/desaturate.hrx | 89 ++ spec/core_functions/color/fade_in.hrx | 101 ++ spec/core_functions/color/fade_out.hrx | 89 ++ spec/core_functions/color/green.hrx | 58 + spec/core_functions/color/hue.hrx | 97 ++ spec/core_functions/color/lighten.hrx | 103 ++ spec/core_functions/color/lightness.hrx | 71 + spec/core_functions/color/red.hrx | 58 + spec/core_functions/color/saturate.hrx | 89 ++ spec/core_functions/color/saturation.hrx | 71 + spec/core_functions/color/whiteness.hrx | 91 ++ .../meta/get_function/different_module.hrx | 18 +- .../meta/get_function/same_module.hrx | 18 +- spec/core_functions/modules/color.hrx | 471 ------ spec/core_functions/modules/color/adjust.hrx | 8 + spec/core_functions/modules/color/alpha.hrx | 8 + spec/core_functions/modules/color/blue.hrx | 21 + spec/core_functions/modules/color/change.hrx | 8 + .../modules/color/complement.hrx | 8 + .../modules/color/css_overloads.hrx | 113 ++ spec/core_functions/modules/color/error.hrx | 201 +++ spec/core_functions/modules/color/green.hrx | 21 + spec/core_functions/modules/color/hue.hrx | 21 + .../modules/color/ie_hex_str.hrx | 8 + spec/core_functions/modules/color/invert.hrx | 8 + .../modules/color/lightness.hrx | 21 + spec/core_functions/modules/color/mix.hrx | 8 + spec/core_functions/modules/color/red.hrx | 21 + .../modules/color/saturation.hrx | 21 + spec/core_functions/modules/color/scale.hrx | 8 + spec/libsass-closed-issues/issue_100.hrx | 14 + spec/libsass-closed-issues/issue_1075.hrx | 13 + spec/libsass-closed-issues/issue_1132.hrx | 17 + spec/libsass-closed-issues/issue_1285.hrx | 44 + spec/libsass-closed-issues/issue_1969.hrx | 18 + spec/libsass-closed-issues/issue_2374.hrx | 143 ++ spec/libsass-closed-issues/issue_2462.hrx | 18 + spec/libsass-closed-issues/issue_2472.hrx | 67 + spec/libsass-closed-issues/issue_86.hrx | 89 ++ spec/libsass-closed-issues/issue_864.hrx | 18 + spec/libsass/bourbon.hrx | 22 +- spec/libsass/color-functions/saturate.hrx | 1291 +++++++++++++++++ .../basic/22_colors_with_alpha.hrx | 41 + .../190_test_options_passed_to_script.hrx | 18 + spec/non_conformant/scss/alpha.hrx | 41 + spec/non_conformant/scss/ie-backslash.hrx | 14 + .../values/colors/alpha_hex/initial_digit.hrx | 77 + .../colors/alpha_hex/initial_letter.hrx | 77 + 53 files changed, 3908 insertions(+), 502 deletions(-) delete mode 100644 spec/core_functions/modules/color.hrx create mode 100644 spec/core_functions/modules/color/adjust.hrx create mode 100644 spec/core_functions/modules/color/alpha.hrx create mode 100644 spec/core_functions/modules/color/blue.hrx create mode 100644 spec/core_functions/modules/color/change.hrx create mode 100644 spec/core_functions/modules/color/complement.hrx create mode 100644 spec/core_functions/modules/color/css_overloads.hrx create mode 100644 spec/core_functions/modules/color/error.hrx create mode 100644 spec/core_functions/modules/color/green.hrx create mode 100644 spec/core_functions/modules/color/hue.hrx create mode 100644 spec/core_functions/modules/color/ie_hex_str.hrx create mode 100644 spec/core_functions/modules/color/invert.hrx create mode 100644 spec/core_functions/modules/color/lightness.hrx create mode 100644 spec/core_functions/modules/color/mix.hrx create mode 100644 spec/core_functions/modules/color/red.hrx create mode 100644 spec/core_functions/modules/color/saturation.hrx create mode 100644 spec/core_functions/modules/color/scale.hrx diff --git a/lib/compiler.ts b/lib/compiler.ts index a35a466a16..654d0baf4d 100644 --- a/lib/compiler.ts +++ b/lib/compiler.ts @@ -94,10 +94,15 @@ export class DartCompiler implements Compiler { this.stdin.write(`!cd ${path}\n`); this.stdin.write([...this.initArgs, ...opts].join(' ') + '\n'); + const [stderr, stdout, status] = await Promise.all([ + this.stderr.next(), + this.stdout.next(), + this.stdout.next(), + ]); return { - stdout: (await this.stdout.next()).value, - stderr: (await this.stderr.next()).value, - status: +(await this.stdout.next()).value, + stdout: stdout.value, + stderr: stderr.value, + status: +status.value, }; } diff --git a/spec/core_functions/color/adjust_hue.hrx b/spec/core_functions/color/adjust_hue.hrx index 0259bda088..e9f34971d3 100644 --- a/spec/core_functions/color/adjust_hue.hrx +++ b/spec/core_functions/color/adjust_hue.hrx @@ -1,3 +1,7 @@ +<===> max/options.yml +:warning_todo: + - libsass + <===> max/input.scss a {b: adjust-hue(red, 359)} @@ -11,8 +15,25 @@ a { b: #ff0004; } +<===> max/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 359deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, 359)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> above_max/options.yml +:warning_todo: + - libsass + <===> above_max/input.scss a {b: adjust-hue(red, 540)} @@ -26,8 +47,25 @@ a { b: cyan; } +<===> above_max/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 540deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, 540)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> min/options.yml +:warning_todo: + - libsass + <===> min/input.scss a {b: adjust-hue(blue, 0)} @@ -36,8 +74,25 @@ a { b: blue; } +<===> min/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 0deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(blue, 0)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> negative/options.yml +:warning_todo: + - libsass + <===> negative/input.scss a {b: adjust-hue(red, -180)} @@ -51,8 +106,25 @@ a { b: cyan; } +<===> negative/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: -180deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, -180)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> middle/options.yml +:warning_todo: + - libsass + <===> middle/input.scss a {b: adjust-hue(red, 123)} @@ -66,8 +138,25 @@ a { b: #00ff0d; } +<===> middle/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 123deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, 123)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> fraction/options.yml +:warning_todo: + - libsass + <===> fraction/input.scss a {b: adjust-hue(red, 0.5)} @@ -81,8 +170,25 @@ a { b: #ff0200; } +<===> fraction/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 0.5deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, 0.5)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> alpha/options.yml +:warning_todo: + - libsass + <===> alpha/input.scss a {b: adjust-hue(rgba(red, 0.1), 359)} @@ -96,6 +202,19 @@ a { b: rgba(255, 0, 4, 0.1); } +<===> alpha/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 359deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(rgba(red, 0.1), 359)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> units/options.yml @@ -113,6 +232,19 @@ a { b: yellow; } +<===> units/deg/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 60deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, 60deg)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> units/unitless/input.scss @@ -123,6 +255,19 @@ a { b: yellow; } +<===> units/unitless/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 60deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, 60)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> units/unknown/input.scss @@ -146,6 +291,18 @@ See https://sass-lang.com/d/function-units ' input.scss 1:7 root stylesheet +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 60deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, 60in)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> units/angle/options.yml @@ -160,8 +317,25 @@ a { b: rgb(0, 179.576224164, 255); } +<===> units/angle/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 3437.7467707849deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue(red, 60rad)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> named/options.yml +:warning_todo: + - libsass + <===> named/input.scss a {b: adjust-hue($color: red, $degrees: 123)} @@ -175,6 +349,19 @@ a { b: #00ff0d; } +<===> named/warning +DEPRECATION WARNING: adjust-hue() is deprecated. Suggestion: + +color.adjust($color, $hue: 123deg) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: adjust-hue($color: red, $degrees: 123)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/blackness.hrx b/spec/core_functions/color/blackness.hrx index cfb0fe2c48..39b7a3d6f1 100644 --- a/spec/core_functions/color/blackness.hrx +++ b/spec/core_functions/color/blackness.hrx @@ -14,6 +14,19 @@ a { b: 100%; } +<===> max/warning +DEPRECATION WARNING: color.blackness() is deprecated. Suggestion: + +color.channel($color, blackness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.blackness(black)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -25,61 +38,139 @@ a { b: 0%; } +<===> min/warning +DEPRECATION WARNING: color.blackness() is deprecated. Suggestion: + +color.channel($color, blackness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.blackness(white)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> middle/zero_whiteness/input.scss @use 'sass:color'; -a {b: color.blackness(color.hwb(0, 0%, 50%))} +a {b: color.blackness(hwb(0 0% 50%))} <===> middle/zero_whiteness/output.css a { b: 50%; } +<===> middle/zero_whiteness/warning +DEPRECATION WARNING: color.blackness() is deprecated. Suggestion: + +color.channel($color, blackness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.blackness(hwb(0 0% 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> middle/half_whiteness/input.scss @use 'sass:color'; -a {b: color.blackness(color.hwb(0, 50%, 50%))} +a {b: color.blackness(hwb(0 50% 50%))} <===> middle/half_whiteness/output.css a { b: 50%; } +<===> middle/half_whiteness/warning +DEPRECATION WARNING: color.blackness() is deprecated. Suggestion: + +color.channel($color, blackness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.blackness(hwb(0 50% 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> middle/high_whiteness/input.scss @use 'sass:color'; -a {b: color.blackness(color.hwb(0, 70%, 70%))} +a {b: color.blackness(hwb(0 70% 70%))} <===> middle/high_whiteness/output.css a { b: 50%; } +<===> middle/high_whiteness/warning +DEPRECATION WARNING: color.blackness() is deprecated. Suggestion: + +color.channel($color, blackness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.blackness(hwb(0 70% 70%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> fraction/input.scss @use 'sass:color'; -a {b: color.blackness(color.hwb(0, 0%, 0.5%))} +a {b: color.blackness(hwb(0 0% 0.5%))} <===> fraction/output.css a { b: 0.5%; } +<===> fraction/warning +DEPRECATION WARNING: color.blackness() is deprecated. Suggestion: + +color.channel($color, blackness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.blackness(hwb(0 0% 0.5%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @use 'sass:color'; -a {b: color.blackness($color: color.hwb(0, 0%, 42%))} +a {b: color.blackness($color: hwb(0 0% 42%))} <===> named/output.css a { b: 42%; } +<===> named/warning +DEPRECATION WARNING: color.blackness() is deprecated. Suggestion: + +color.channel($color, blackness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.blackness($color: hwb(0 0% 42%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/blue.hrx b/spec/core_functions/color/blue.hrx index ac6e1fd4d8..e7700a76d3 100644 --- a/spec/core_functions/color/blue.hrx +++ b/spec/core_functions/color/blue.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: blue(rgb(0, 0, 255))} @@ -6,6 +12,19 @@ a { b: 255; } +<===> max/warning +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: blue(rgb(0, 0, 255))} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -16,6 +35,19 @@ a { b: 0; } +<===> min/warning +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: blue(rgb(0, 0, 0))} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -26,6 +58,19 @@ a { b: 123; } +<===> middle/warning +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: blue(rgb(0, 0, 123))} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -36,6 +81,19 @@ a { b: 234; } +<===> named/warning +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: blue($color: rgb(0, 0, 234))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/darken.hrx b/spec/core_functions/color/darken.hrx index ee73cb7a93..bc78a8ff40 100644 --- a/spec/core_functions/color/darken.hrx +++ b/spec/core_functions/color/darken.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: darken(red, 100%)} @@ -6,6 +12,20 @@ a { b: black; } +<===> max/warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -100%) +color.adjust($color, $lightness: -100%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: darken(red, 100%)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> max_remaining/input.scss @@ -16,6 +36,20 @@ a { b: black; } +<===> max_remaining/warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -100%) +color.adjust($color, $lightness: -50%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: darken(red, 50%)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -26,6 +60,19 @@ a { b: red; } +<===> min/warning +DEPRECATION WARNING: darken() is deprecated. Suggestion: + +color.adjust($color, $lightness: 0%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: darken(red, 0%)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -41,6 +88,20 @@ a { b: #b80000; } +<===> middle/warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -28%) +color.adjust($color, $lightness: -14%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: darken(red, 14%)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> fraction/input.scss @@ -56,6 +117,20 @@ a { b: #fc0000; } +<===> fraction/warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -1%) +color.adjust($color, $lightness: -0.5%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: darken(red, 0.5%)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> alpha/input.scss @@ -66,6 +141,20 @@ a { b: rgba(0, 0, 0, 0.2); } +<===> alpha/warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -100%) +color.adjust($color, $lightness: -100%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: darken(rgba(red, 0.2), 100%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -81,6 +170,20 @@ a { b: #b80000; } +<===> named/warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -28%) +color.adjust($color, $lightness: -14%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: darken($color: red, $amount: 14%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/desaturate.hrx b/spec/core_functions/color/desaturate.hrx index f9adddf67f..96ce6d04fc 100644 --- a/spec/core_functions/color/desaturate.hrx +++ b/spec/core_functions/color/desaturate.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: desaturate(plum, 100%)} @@ -11,6 +17,20 @@ a { b: #bfbfbf; } +<===> max/warning +DEPRECATION WARNING: desaturate() is deprecated. Suggestions: + +color.scale($color, $saturation: -100%) +color.adjust($color, $saturation: -100%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: desaturate(plum, 100%)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> max_remaining/input.scss @@ -26,6 +46,20 @@ a { b: #bfbfbf; } +<===> max_remaining/warning +DEPRECATION WARNING: desaturate() is deprecated. Suggestions: + +color.scale($color, $saturation: -100%) +color.adjust($color, $saturation: -48%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: desaturate(plum, 48%)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -36,6 +70,19 @@ a { b: plum; } +<===> min/warning +DEPRECATION WARNING: desaturate() is deprecated. Suggestion: + +color.adjust($color, $saturation: 0%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: desaturate(plum, 0%)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -51,6 +98,20 @@ a { b: #d4a9d4; } +<===> middle/warning +DEPRECATION WARNING: desaturate() is deprecated. Suggestions: + +color.scale($color, $saturation: -29.606557377%) +color.adjust($color, $saturation: -14%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: desaturate(plum, 14%)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> alpha/input.scss @@ -66,6 +127,20 @@ a { b: rgba(191, 191, 191, 0.3); } +<===> alpha/warning +DEPRECATION WARNING: desaturate() is deprecated. Suggestions: + +color.scale($color, $saturation: -100%) +color.adjust($color, $saturation: -100%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: desaturate(rgba(plum, 0.3), 100%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -81,6 +156,20 @@ a { b: #d4a9d4; } +<===> named/warning +DEPRECATION WARNING: desaturate() is deprecated. Suggestions: + +color.scale($color, $saturation: -29.606557377%) +color.adjust($color, $saturation: -14%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: desaturate($color: plum, $amount: 14%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/fade_in.hrx b/spec/core_functions/color/fade_in.hrx index b81ac09936..e9689205e8 100644 --- a/spec/core_functions/color/fade_in.hrx +++ b/spec/core_functions/color/fade_in.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: fade-in(rgba(red, 0.5), 1)} @@ -6,6 +12,20 @@ a { b: red; } +<===> max/warning +DEPRECATION WARNING: fade-in() is deprecated. Suggestions: + +color.scale($color, $alpha: 100%) +color.adjust($color, $alpha: 1) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-in(rgba(red, 0.5), 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> max_remaining/input.scss @@ -16,6 +36,20 @@ a { b: red; } +<===> max_remaining/warning +DEPRECATION WARNING: fade-in() is deprecated. Suggestions: + +color.scale($color, $alpha: 100%) +color.adjust($color, $alpha: 0.5) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-in(rgba(red, 0.5), 0.5)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -26,8 +60,25 @@ a { b: rgba(255, 0, 0, 0.5); } +<===> min/warning +DEPRECATION WARNING: fade-in() is deprecated. Suggestion: + +color.adjust($color, $alpha: 0) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-in(rgba(red, 0.5), 0)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> middle/options.yml +:warning_todo: + - libsass + <===> middle/input.scss a {b: fade-in(rgba(red, 0.5), 0.14)} @@ -36,8 +87,26 @@ a { b: rgba(255, 0, 0, 0.64); } +<===> middle/warning +DEPRECATION WARNING: fade-in() is deprecated. Suggestions: + +color.scale($color, $alpha: 28%) +color.adjust($color, $alpha: 0.14) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-in(rgba(red, 0.5), 0.14)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> named/options.yml +:warning_todo: + - libsass + <===> named/input.scss a {b: fade-in($color: rgba(red, 0.5), $amount: 0.14)} @@ -46,8 +115,26 @@ a { b: rgba(255, 0, 0, 0.64); } +<===> named/warning +DEPRECATION WARNING: fade-in() is deprecated. Suggestions: + +color.scale($color, $alpha: 28%) +color.adjust($color, $alpha: 0.14) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-in($color: rgba(red, 0.5), $amount: 0.14)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ +<===> opacify/options.yml +:warning_todo: + - libsass + <===> opacify/input.scss a {b: opacify($color: rgba(red, 0.5), $amount: 0.14)} @@ -56,6 +143,20 @@ a { b: rgba(255, 0, 0, 0.64); } +<===> opacify/warning +DEPRECATION WARNING: opacify() is deprecated. Suggestions: + +color.scale($color, $alpha: 28%) +color.adjust($color, $alpha: 0.14) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: opacify($color: rgba(red, 0.5), $amount: 0.14)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/fade_out.hrx b/spec/core_functions/color/fade_out.hrx index a2ae6beca7..1e5203090a 100644 --- a/spec/core_functions/color/fade_out.hrx +++ b/spec/core_functions/color/fade_out.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: fade-out(rgba(red, 0.5), 1)} @@ -6,6 +12,20 @@ a { b: rgba(255, 0, 0, 0); } +<===> max/warning +DEPRECATION WARNING: fade-out() is deprecated. Suggestions: + +color.scale($color, $alpha: -100%) +color.adjust($color, $alpha: -1) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-out(rgba(red, 0.5), 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> max_remaining/input.scss @@ -16,6 +36,20 @@ a { b: rgba(255, 0, 0, 0); } +<===> max_remaining/warning +DEPRECATION WARNING: fade-out() is deprecated. Suggestions: + +color.scale($color, $alpha: -100%) +color.adjust($color, $alpha: -0.5) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-out(rgba(red, 0.5), 0.5)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -26,6 +60,19 @@ a { b: rgba(255, 0, 0, 0.5); } +<===> min/warning +DEPRECATION WARNING: fade-out() is deprecated. Suggestion: + +color.adjust($color, $alpha: 0) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-out(rgba(red, 0.5), 0)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -36,6 +83,20 @@ a { b: rgba(255, 0, 0, 0.36); } +<===> middle/warning +DEPRECATION WARNING: fade-out() is deprecated. Suggestions: + +color.scale($color, $alpha: -28%) +color.adjust($color, $alpha: -0.14) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-out(rgba(red, 0.5), 0.14)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -46,6 +107,20 @@ a { b: rgba(255, 0, 0, 0.36); } +<===> named/warning +DEPRECATION WARNING: fade-out() is deprecated. Suggestions: + +color.scale($color, $alpha: -28%) +color.adjust($color, $alpha: -0.14) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-out($color: rgba(red, 0.5), $amount: 0.14)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> transparentize/input.scss @@ -56,6 +131,20 @@ a { b: rgba(255, 0, 0, 0.36); } +<===> transparentize/warning +DEPRECATION WARNING: transparentize() is deprecated. Suggestions: + +color.scale($color, $alpha: -28%) +color.adjust($color, $alpha: -0.14) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: transparentize($color: rgba(red, 0.5), $amount: 0.14)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/green.hrx b/spec/core_functions/color/green.hrx index aebb208e02..744c86924c 100644 --- a/spec/core_functions/color/green.hrx +++ b/spec/core_functions/color/green.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: green(rgb(0, 255, 0))} @@ -6,6 +12,19 @@ a { b: 255; } +<===> max/warning +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: green(rgb(0, 255, 0))} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -16,6 +35,19 @@ a { b: 0; } +<===> min/warning +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: green(rgb(0, 0, 0))} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -26,6 +58,19 @@ a { b: 123; } +<===> middle/warning +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: green(rgb(0, 123, 0))} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -36,6 +81,19 @@ a { b: 234; } +<===> named/warning +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: green($color: rgb(0, 234, 0))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/hue.hrx b/spec/core_functions/color/hue.hrx index 64b1b78e10..84f30d9bc2 100644 --- a/spec/core_functions/color/hue.hrx +++ b/spec/core_functions/color/hue.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: hue(hsl(359, 50%, 50%))} @@ -6,6 +12,19 @@ a { b: 359deg; } +<===> max/warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: hue(hsl(359, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> above_max/input.scss @@ -16,6 +35,19 @@ a { b: 180deg; } +<===> above_max/warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: hue(hsl(540, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -26,6 +58,19 @@ a { b: 0deg; } +<===> min/warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: hue(hsl(0, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> negative/input.scss @@ -36,6 +81,19 @@ a { b: 180deg; } +<===> negative/warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: hue(hsl(-180, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -46,6 +104,19 @@ a { b: 123deg; } +<===> middle/warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: hue(hsl(123, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> fraction/input.scss @@ -56,6 +127,19 @@ a { b: 0.5deg; } +<===> fraction/warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: hue(hsl(0.5, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -66,6 +150,19 @@ a { b: 234deg; } +<===> named/warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: hue($color: hsl(234, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/lighten.hrx b/spec/core_functions/color/lighten.hrx index 3bbd9a97da..985d1c3b6f 100644 --- a/spec/core_functions/color/lighten.hrx +++ b/spec/core_functions/color/lighten.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: lighten(red, 100%)} @@ -6,6 +12,20 @@ a { b: white; } +<===> max/warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 100%) +color.adjust($color, $lightness: 100%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lighten(red, 100%)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> max_remaining/input.scss @@ -16,6 +36,20 @@ a { b: white; } +<===> max_remaining/warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 100%) +color.adjust($color, $lightness: 50%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lighten(red, 50%)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -26,6 +60,19 @@ a { b: red; } +<===> min/warning +DEPRECATION WARNING: lighten() is deprecated. Suggestion: + +color.adjust($color, $lightness: 0%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lighten(red, 0%)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -41,6 +88,20 @@ a { b: #ff4747; } +<===> middle/warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 28%) +color.adjust($color, $lightness: 14%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lighten(red, 14%)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> fraction/input.scss @@ -56,6 +117,20 @@ a { b: #ff0303; } +<===> fraction/warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 1%) +color.adjust($color, $lightness: 0.5%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lighten(red, 0.5%)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> alpha/input.scss @@ -66,6 +141,20 @@ a { b: rgba(255, 255, 255, 0.4); } +<===> alpha/warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 100%) +color.adjust($color, $lightness: 100%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lighten(rgba(red, 0.4), 100%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -81,6 +170,20 @@ a { b: #ff4747; } +<===> named/warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 28%) +color.adjust($color, $lightness: 14%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lighten($color: red, $amount: 14%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/lightness.hrx b/spec/core_functions/color/lightness.hrx index 12852da0fc..f7d9e8de8e 100644 --- a/spec/core_functions/color/lightness.hrx +++ b/spec/core_functions/color/lightness.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: lightness(hsl(0, 100%, 100%))} @@ -6,6 +12,19 @@ a { b: 100%; } +<===> max/warning +DEPRECATION WARNING: lightness() is deprecated. Suggestion: + +color.channel($color, lightness) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lightness(hsl(0, 100%, 100%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -16,6 +35,19 @@ a { b: 0%; } +<===> min/warning +DEPRECATION WARNING: lightness() is deprecated. Suggestion: + +color.channel($color, lightness) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lightness(hsl(0, 100%, 0%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -26,6 +58,19 @@ a { b: 50%; } +<===> middle/warning +DEPRECATION WARNING: lightness() is deprecated. Suggestion: + +color.channel($color, lightness) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lightness(hsl(0, 100%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> fraction/input.scss @@ -36,6 +81,19 @@ a { b: 0.5%; } +<===> fraction/warning +DEPRECATION WARNING: lightness() is deprecated. Suggestion: + +color.channel($color, lightness) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lightness(hsl(0, 100%, 0.5%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -46,6 +104,19 @@ a { b: 42%; } +<===> named/warning +DEPRECATION WARNING: lightness() is deprecated. Suggestion: + +color.channel($color, lightness) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lightness($color: hsl(0, 100%, 42%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/red.hrx b/spec/core_functions/color/red.hrx index 965b77f586..c81c44c851 100644 --- a/spec/core_functions/color/red.hrx +++ b/spec/core_functions/color/red.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: red(rgb(255, 0, 0))} @@ -6,6 +12,19 @@ a { b: 255; } +<===> max/warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: red(rgb(255, 0, 0))} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -16,6 +35,19 @@ a { b: 0; } +<===> min/warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: red(rgb(0, 0, 0))} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -26,6 +58,19 @@ a { b: 123; } +<===> middle/warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: red(rgb(123, 0, 0))} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -36,6 +81,19 @@ a { b: 234; } +<===> named/warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: red($color: rgb(234, 0, 0))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/saturate.hrx b/spec/core_functions/color/saturate.hrx index 913e6c8a60..ac19cf5a78 100644 --- a/spec/core_functions/color/saturate.hrx +++ b/spec/core_functions/color/saturate.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> one_arg/README.md Sass supports saturate() with one argument for compatibility with [plain CSS][]. @@ -48,6 +54,20 @@ a { b: #ff7eff; } +<===> two_args/max/warning +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 100%) +color.adjust($color, $saturation: 100%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturate(plum, 100%)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> two_args/max_remaining/input.scss @@ -58,6 +78,20 @@ a { b: #ff7eff; } +<===> two_args/max_remaining/warning +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 100%) +color.adjust($color, $saturation: 53%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturate(plum, 53%)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> two_args/min/input.scss @@ -68,6 +102,19 @@ a { b: plum; } +<===> two_args/min/warning +DEPRECATION WARNING: saturate() is deprecated. Suggestion: + +color.adjust($color, $saturation: 0%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturate(plum, 0%)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> two_args/middle/input.scss @@ -83,6 +130,20 @@ a { b: #e697e6; } +<===> two_args/middle/warning +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 26.5588235294%) +color.adjust($color, $saturation: 14%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturate(plum, 14%)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> two_args/alpha/input.scss @@ -93,6 +154,20 @@ a { b: rgba(255, 126, 255, 0.5); } +<===> two_args/alpha/warning +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 100%) +color.adjust($color, $saturation: 100%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturate(rgba(plum, 0.5), 100%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> two_args/named/input.scss @@ -108,6 +183,20 @@ a { b: #e697e6; } +<===> two_args/named/warning +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 26.5588235294%) +color.adjust($color, $saturation: 14%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturate($color: plum, $amount: 14%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/saturation.hrx b/spec/core_functions/color/saturation.hrx index 5e4201534a..93c5f804d7 100644 --- a/spec/core_functions/color/saturation.hrx +++ b/spec/core_functions/color/saturation.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:warning_todo: + - libsass + +<===> +================================================================================ <===> max/input.scss a {b: saturation(hsl(0, 100%, 50%))} @@ -6,6 +12,19 @@ a { b: 100%; } +<===> max/warning +DEPRECATION WARNING: saturation() is deprecated. Suggestion: + +color.channel($color, saturation) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturation(hsl(0, 100%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -16,6 +35,19 @@ a { b: 0%; } +<===> min/warning +DEPRECATION WARNING: saturation() is deprecated. Suggestion: + +color.channel($color, saturation) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturation(hsl(0, 0%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> middle/input.scss @@ -26,6 +58,19 @@ a { b: 50%; } +<===> middle/warning +DEPRECATION WARNING: saturation() is deprecated. Suggestion: + +color.channel($color, saturation) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturation(hsl(0, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> fraction/input.scss @@ -36,6 +81,19 @@ a { b: 0.5%; } +<===> fraction/warning +DEPRECATION WARNING: saturation() is deprecated. Suggestion: + +color.channel($color, saturation) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturation(hsl(0, 0.5%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -46,6 +104,19 @@ a { b: 42%; } +<===> named/warning +DEPRECATION WARNING: saturation() is deprecated. Suggestion: + +color.channel($color, saturation) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturation($color: hsl(0, 42%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/whiteness.hrx b/spec/core_functions/color/whiteness.hrx index acc7117889..096e848270 100644 --- a/spec/core_functions/color/whiteness.hrx +++ b/spec/core_functions/color/whiteness.hrx @@ -14,6 +14,19 @@ a { b: 100%; } +<===> max/warning +DEPRECATION WARNING: color.whiteness() is deprecated. Suggestion: + +color.channel($color, whiteness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.whiteness(white)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> min/input.scss @@ -25,6 +38,19 @@ a { b: 0%; } +<===> min/warning +DEPRECATION WARNING: color.whiteness() is deprecated. Suggestion: + +color.channel($color, whiteness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.whiteness(black)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> middle/zero_blackness/input.scss @@ -36,6 +62,19 @@ a { b: 50%; } +<===> middle/zero_blackness/warning +DEPRECATION WARNING: color.whiteness() is deprecated. Suggestion: + +color.channel($color, whiteness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.whiteness(color.hwb(0, 50%, 0%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> middle/half_blackness/input.scss @@ -47,6 +86,19 @@ a { b: 50%; } +<===> middle/half_blackness/warning +DEPRECATION WARNING: color.whiteness() is deprecated. Suggestion: + +color.channel($color, whiteness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.whiteness(color.hwb(0, 50%, 50%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> middle/high_blackness/input.scss @@ -58,6 +110,19 @@ a { b: 50%; } +<===> middle/high_blackness/warning +DEPRECATION WARNING: color.whiteness() is deprecated. Suggestion: + +color.channel($color, whiteness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.whiteness(color.hwb(0, 70%, 70%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> fraction/input.scss @@ -69,6 +134,19 @@ a { b: 0.5%; } +<===> fraction/warning +DEPRECATION WARNING: color.whiteness() is deprecated. Suggestion: + +color.channel($color, whiteness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.whiteness(color.hwb(0, 0.5%, 0%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> named/input.scss @@ -80,6 +158,19 @@ a { b: 42%; } +<===> named/warning +DEPRECATION WARNING: color.whiteness() is deprecated. Suggestion: + +color.channel($color, whiteness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.whiteness($color: color.hwb(0, 42%, 0%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/meta/get_function/different_module.hrx b/spec/core_functions/meta/get_function/different_module.hrx index 7fb2c53e90..e5b13d264f 100644 --- a/spec/core_functions/meta/get_function/different_module.hrx +++ b/spec/core_functions/meta/get_function/different_module.hrx @@ -6,23 +6,23 @@ <===> ================================================================================ <===> defined/input.scss -@use "sass:color"; -a {b: call(get-function("red", $module: "color"), #abcdef)} +@use "sass:math"; +a {b: call(get-function("round", $module: "math"), 0.6)} <===> defined/output.css a { - b: 171; + b: 1; } <===> ================================================================================ <===> chosen_prefix/input.scss -@use "sass:color" as a; -b {c: call(get-function("red", $module: "a"), #abcdef)} +@use "sass:math" as a; +b {c: call(get-function("round", $module: "a"), 0.6)} <===> chosen_prefix/output.css b { - c: 171; + c: 1; } <===> @@ -121,10 +121,10 @@ a { - sass/libsass#2807 <===> named/input.scss -@use "sass:color"; -a {b: call(get-function($name: "red", $module: "color"), #abcdef)} +@use "sass:math"; +a {b: call(get-function($name: "round", $module: "math"), 0.6)} <===> named/output.css a { - b: 171; + b: 1; } diff --git a/spec/core_functions/meta/get_function/same_module.hrx b/spec/core_functions/meta/get_function/same_module.hrx index a35dcb2ced..ae4ee994b4 100644 --- a/spec/core_functions/meta/get_function/same_module.hrx +++ b/spec/core_functions/meta/get_function/same_module.hrx @@ -30,13 +30,13 @@ a { <===> ================================================================================ <===> built_in/input.scss -$lighten-fn: get-function(lighten); +$round-fn: get-function(round); -a {b: call($lighten-fn, red, 30%)} +a {b: call($round-fn, 0.6)} <===> built_in/output.css a { - b: #ff9999; + b: 1; } <===> @@ -56,18 +56,18 @@ a { <===> ================================================================================ <===> plain_css/input.scss -$sass-fn: get-function(lighten); -$css-fn: get-function(lighten, $css: true); +$sass-fn: get-function(round); +$css-fn: get-function(round, $css: true); a { - sass-fn: call($sass-fn, red, 30%); - css-fn: call($css-fn, red, 30%); + sass-fn: call($sass-fn, 0.6); + css-fn: call($css-fn, 0.6); } <===> plain_css/output.css a { - sass-fn: #ff9999; - css-fn: lighten(red, 30%); + sass-fn: 1; + css-fn: round(0.6); } <===> diff --git a/spec/core_functions/modules/color.hrx b/spec/core_functions/modules/color.hrx deleted file mode 100644 index a6746a29b9..0000000000 --- a/spec/core_functions/modules/color.hrx +++ /dev/null @@ -1,471 +0,0 @@ -<===> red/input.scss -@use "sass:color"; -a {b: color.red(#abcdef)} - -<===> red/output.css -a { - b: 171; -} - -<===> -================================================================================ -<===> green/input.scss -@use "sass:color"; -a {b: color.green(#abcdef)} - -<===> green/output.css -a { - b: 205; -} - -<===> -================================================================================ -<===> blue/input.scss -@use "sass:color"; -a {b: color.blue(#abcdef)} - -<===> blue/output.css -a { - b: 239; -} - -<===> -================================================================================ -<===> hue/input.scss -@use "sass:color"; -a {b: color.hue(#abcdef)} - -<===> hue/output.css -a { - b: 210deg; -} - -<===> -================================================================================ -<===> saturation/input.scss -@use "sass:color"; -a {b: color.saturation(#abcdef)} - -<===> saturation/output.css -a { - b: 68%; -} - -<===> -================================================================================ -<===> lightness/input.scss -@use "sass:color"; -a {b: color.lightness(#abcdef)} - -<===> lightness/output.css -a { - b: 80.3921568627%; -} - -<===> -================================================================================ -<===> mix/input.scss -@use "sass:color"; -a {b: color.mix(#abcdef, #daddee)} - -<===> mix/output.css -a { - b: #c3d5ef; -} - -<===> -================================================================================ -<===> complement/input.scss -@use "sass:color"; -a {b: color.complement(#abcdef)} - -<===> complement/output.css -a { - b: #efcdab; -} - -<===> -================================================================================ -<===> invert/input.scss -@use "sass:color"; -a {b: color.invert(#abcdef)} - -<===> invert/output.css -a { - b: #543210; -} - -<===> -================================================================================ -<===> alpha/input.scss -@use "sass:color"; -a {b: color.alpha(#abcdef)} - -<===> alpha/output.css -a { - b: 1; -} - -<===> -================================================================================ -<===> adjust/input.scss -@use "sass:color"; -a {b: color.adjust(#abcdef, $red: 10)} - -<===> adjust/output.css -a { - b: #b5cdef; -} - -<===> -================================================================================ -<===> scale/input.scss -@use "sass:color"; -a {b: color.scale(#abcdef, $red: 10%)} - -<===> scale/output.css -a { - b: rgb(179.4, 205, 239); -} - -<===> -================================================================================ -<===> change/input.scss -@use "sass:color"; -a {b: color.change(#abcdef, $red: 10)} - -<===> change/output.css -a { - b: #0acdef; -} - -<===> -================================================================================ -<===> ie_hex_str/input.scss -@use "sass:color"; -a {b: color.ie-hex-str(#abcdef)} - -<===> ie_hex_str/output.css -a { - b: #FFABCDEF; -} - -<===> -================================================================================ -<===> css_overloads/README.md -CSS overloads are still supported for module functions to ease the transition, -but they should produce deprecation warnings. - -<===> -================================================================================ -<===> css_overloads/grayscale/input.scss -@use "sass:color"; -a {b: color.grayscale(1)} - -<===> css_overloads/grayscale/output.css -a { - b: grayscale(1); -} - -<===> css_overloads/grayscale/warning -DEPRECATION WARNING: Passing a number (1) to color.grayscale() is deprecated. - -Recommendation: grayscale(1) - - , -2 | a {b: color.grayscale(1)} - | ^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> css_overloads/invert/input.scss -@use "sass:color"; -a {b: color.invert(1)} - -<===> css_overloads/invert/output.css -a { - b: invert(1); -} - -<===> css_overloads/invert/warning -DEPRECATION WARNING: Passing a number (1) to color.invert() is deprecated. - -Recommendation: invert(1) - - , -2 | a {b: color.invert(1)} - | ^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> css_overloads/alpha/one_arg/input.scss -@use "sass:color"; -a {b: color.alpha(c=d)} - -<===> css_overloads/alpha/one_arg/output.css -a { - b: alpha(c=d); -} - -<===> css_overloads/alpha/one_arg/warning -DEPRECATION WARNING: Using color.alpha() for a Microsoft filter is deprecated. - -Recommendation: alpha(c=d) - - , -2 | a {b: color.alpha(c=d)} - | ^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> css_overloads/alpha/multi_arg/input.scss -@use "sass:color"; -a {b: color.alpha(c=d, e=f, g=h)} - -<===> css_overloads/alpha/multi_arg/output.css -a { - b: alpha(c=d, e=f, g=h); -} - -<===> css_overloads/alpha/multi_arg/warning -DEPRECATION WARNING: Using color.alpha() for a Microsoft filter is deprecated. - -Recommendation: alpha(c=d, e=f, g=h) - - , -2 | a {b: color.alpha(c=d, e=f, g=h)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> css_overloads/opacity/input.scss -@use "sass:color"; -a {b: color.opacity(1)} - -<===> css_overloads/opacity/output.css -a { - b: opacity(1); -} - -<===> css_overloads/opacity/warning -DEPRECATION WARNING: Passing a number (1 to color.opacity() is deprecated. - -Recommendation: opacity(1) - - , -2 | a {b: color.opacity(1)} - | ^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/adjust_color/input.scss -@use "sass:color"; -a {b: color.adjust-color(#abcdef, $red: 10)} - -<===> error/adjust_color/error -Error: Undefined function. - , -2 | a {b: color.adjust-color(#abcdef, $red: 10)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/scale_color/input.scss -@use "sass:color"; -a {b: color.scale-color(#abcdef, $red: 10%)} - -<===> error/scale_color/error -Error: Undefined function. - , -2 | a {b: color.scale-color(#abcdef, $red: 10%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/change_color/input.scss -@use "sass:color"; -a {b: color.change-color(#abcdef, $red: 10)} - -<===> error/change_color/error -Error: Undefined function. - , -2 | a {b: color.change-color(#abcdef, $red: 10)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/adjust_hue/input.scss -@use "sass:color"; -a {b: color.adjust-hue(#abcdef, 10)} - -<===> error/adjust_hue/error -Error: The function adjust-hue() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $hue: 10) - -More info: https://sass-lang.com/documentation/functions/color#adjust-hue - , -2 | a {b: color.adjust-hue(#abcdef, 10)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/lighten/input.scss -@use "sass:color"; -a {b: color.lighten(#abcdef, 10%)} - -<===> error/lighten/error -Error: The function lighten() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $lightness: 10%) - -More info: https://sass-lang.com/documentation/functions/color#lighten - , -2 | a {b: color.lighten(#abcdef, 10%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/darken/input.scss -@use "sass:color"; -a {b: color.darken(#abcdef, 10%)} - -<===> error/darken/error -Error: The function darken() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $lightness: -10%) - -More info: https://sass-lang.com/documentation/functions/color#darken - , -2 | a {b: color.darken(#abcdef, 10%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/saturate/input.scss -@use "sass:color"; -a {b: color.saturate(#abcdef, 10%)} - -<===> error/saturate/error -Error: The function saturate() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $saturation: 10%) - -More info: https://sass-lang.com/documentation/functions/color#saturate - , -2 | a {b: color.saturate(#abcdef, 10%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/desaturate/input.scss -@use "sass:color"; -a {b: color.desaturate(#abcdef, 10%)} - -<===> error/desaturate/error -Error: The function desaturate() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $saturation: -10%) - -More info: https://sass-lang.com/documentation/functions/color#desaturate - , -2 | a {b: color.desaturate(#abcdef, 10%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/opacify/input.scss -@use "sass:color"; -a {b: color.opacify(#abcdef, 0.5)} - -<===> error/opacify/error -Error: The function opacify() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $alpha: 0.5) - -More info: https://sass-lang.com/documentation/functions/color#opacify - , -2 | a {b: color.opacify(#abcdef, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/fade_in/input.scss -@use "sass:color"; -a {b: color.fade-in(#abcdef, 0.5)} - -<===> error/fade_in/error -Error: The function fade-in() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $alpha: 0.5) - -More info: https://sass-lang.com/documentation/functions/color#fade-in - , -2 | a {b: color.fade-in(#abcdef, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/transparentize/input.scss -@use "sass:color"; -a {b: color.transparentize(#abcdef, 0.5)} - -<===> error/transparentize/error -Error: The function transparentize() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $alpha: -0.5) - -More info: https://sass-lang.com/documentation/functions/color#transparentize - , -2 | a {b: color.transparentize(#abcdef, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/fade_out/input.scss -@use "sass:color"; -a {b: color.fade-out(#abcdef, 0.5)} - -<===> error/fade_out/error -Error: The function fade-out() isn't in the sass:color module. - -Recommendation: color.adjust(#abcdef, $alpha: -0.5) - -More info: https://sass-lang.com/documentation/functions/color#fade-out - , -2 | a {b: color.fade-out(#abcdef, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/adjust.hrx b/spec/core_functions/modules/color/adjust.hrx new file mode 100644 index 0000000000..315bc9323b --- /dev/null +++ b/spec/core_functions/modules/color/adjust.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.adjust(#abcdef, $red: 10)} + +<===> output.css +a { + b: #b5cdef; +} diff --git a/spec/core_functions/modules/color/alpha.hrx b/spec/core_functions/modules/color/alpha.hrx new file mode 100644 index 0000000000..74d4e34fd2 --- /dev/null +++ b/spec/core_functions/modules/color/alpha.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.alpha(#abcdef)} + +<===> output.css +a { + b: 1; +} diff --git a/spec/core_functions/modules/color/blue.hrx b/spec/core_functions/modules/color/blue.hrx new file mode 100644 index 0000000000..29180df53b --- /dev/null +++ b/spec/core_functions/modules/color/blue.hrx @@ -0,0 +1,21 @@ +<===> input.scss +@use "sass:color"; +a {b: color.blue(#abcdef)} + +<===> output.css +a { + b: 239; +} + +<===> warning +DEPRECATION WARNING: color.blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.blue(#abcdef)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/change.hrx b/spec/core_functions/modules/color/change.hrx new file mode 100644 index 0000000000..4af8a6a242 --- /dev/null +++ b/spec/core_functions/modules/color/change.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.change(#abcdef, $red: 10)} + +<===> output.css +a { + b: #0acdef; +} diff --git a/spec/core_functions/modules/color/complement.hrx b/spec/core_functions/modules/color/complement.hrx new file mode 100644 index 0000000000..facd7558ae --- /dev/null +++ b/spec/core_functions/modules/color/complement.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.complement(#abcdef)} + +<===> output.css +a { + b: #efcdab; +} diff --git a/spec/core_functions/modules/color/css_overloads.hrx b/spec/core_functions/modules/color/css_overloads.hrx new file mode 100644 index 0000000000..89af6b73a0 --- /dev/null +++ b/spec/core_functions/modules/color/css_overloads.hrx @@ -0,0 +1,113 @@ +<===> README.md +CSS overloads are still supported for module functions to ease the transition, +but they should produce deprecation warnings. + +<===> +================================================================================ +<===> grayscale/input.scss +@use "sass:color"; +a {b: color.grayscale(1)} + +<===> grayscale/output.css +a { + b: grayscale(1); +} + +<===> grayscale/warning +DEPRECATION WARNING: Passing a number (1) to color.grayscale() is deprecated. + +Recommendation: grayscale(1) + + , +2 | a {b: color.grayscale(1)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> invert/input.scss +@use "sass:color"; +a {b: color.invert(1)} + +<===> invert/output.css +a { + b: invert(1); +} + +<===> invert/warning +DEPRECATION WARNING: Passing a number (1) to color.invert() is deprecated. + +Recommendation: invert(1) + + , +2 | a {b: color.invert(1)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> alpha/one_arg/input.scss +@use "sass:color"; +a {b: color.alpha(c=d)} + +<===> alpha/one_arg/output.css +a { + b: alpha(c=d); +} + +<===> alpha/one_arg/warning +DEPRECATION WARNING: Using color.alpha() for a Microsoft filter is deprecated. + +Recommendation: alpha(c=d) + + , +2 | a {b: color.alpha(c=d)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> alpha/multi_arg/input.scss +@use "sass:color"; +a {b: color.alpha(c=d, e=f, g=h)} + +<===> alpha/multi_arg/output.css +a { + b: alpha(c=d, e=f, g=h); +} + +<===> alpha/multi_arg/warning +DEPRECATION WARNING: Using color.alpha() for a Microsoft filter is deprecated. + +Recommendation: alpha(c=d, e=f, g=h) + + , +2 | a {b: color.alpha(c=d, e=f, g=h)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> opacity/input.scss +@use "sass:color"; +a {b: color.opacity(1)} + +<===> opacity/output.css +a { + b: opacity(1); +} + +<===> opacity/warning +DEPRECATION WARNING: Passing a number (1 to color.opacity() is deprecated. + +Recommendation: opacity(1) + + , +2 | a {b: color.opacity(1)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/error.hrx b/spec/core_functions/modules/color/error.hrx new file mode 100644 index 0000000000..d15430973d --- /dev/null +++ b/spec/core_functions/modules/color/error.hrx @@ -0,0 +1,201 @@ +<===> adjust_color/input.scss +@use "sass:color"; +a {b: color.adjust-color(#abcdef, $red: 10)} + +<===> adjust_color/error +Error: Undefined function. + , +2 | a {b: color.adjust-color(#abcdef, $red: 10)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> scale_color/input.scss +@use "sass:color"; +a {b: color.scale-color(#abcdef, $red: 10%)} + +<===> scale_color/error +Error: Undefined function. + , +2 | a {b: color.scale-color(#abcdef, $red: 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> change_color/input.scss +@use "sass:color"; +a {b: color.change-color(#abcdef, $red: 10)} + +<===> change_color/error +Error: Undefined function. + , +2 | a {b: color.change-color(#abcdef, $red: 10)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> adjust_hue/input.scss +@use "sass:color"; +a {b: color.adjust-hue(#abcdef, 10)} + +<===> adjust_hue/error +Error: The function adjust-hue() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $hue: 10) + +More info: https://sass-lang.com/documentation/functions/color#adjust-hue + , +2 | a {b: color.adjust-hue(#abcdef, 10)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> lighten/input.scss +@use "sass:color"; +a {b: color.lighten(#abcdef, 10%)} + +<===> lighten/error +Error: The function lighten() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $lightness: 10%) + +More info: https://sass-lang.com/documentation/functions/color#lighten + , +2 | a {b: color.lighten(#abcdef, 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> darken/input.scss +@use "sass:color"; +a {b: color.darken(#abcdef, 10%)} + +<===> darken/error +Error: The function darken() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $lightness: -10%) + +More info: https://sass-lang.com/documentation/functions/color#darken + , +2 | a {b: color.darken(#abcdef, 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> saturate/input.scss +@use "sass:color"; +a {b: color.saturate(#abcdef, 10%)} + +<===> saturate/error +Error: The function saturate() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $saturation: 10%) + +More info: https://sass-lang.com/documentation/functions/color#saturate + , +2 | a {b: color.saturate(#abcdef, 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> desaturate/input.scss +@use "sass:color"; +a {b: color.desaturate(#abcdef, 10%)} + +<===> desaturate/error +Error: The function desaturate() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $saturation: -10%) + +More info: https://sass-lang.com/documentation/functions/color#desaturate + , +2 | a {b: color.desaturate(#abcdef, 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> opacify/input.scss +@use "sass:color"; +a {b: color.opacify(#abcdef, 0.5)} + +<===> opacify/error +Error: The function opacify() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $alpha: 0.5) + +More info: https://sass-lang.com/documentation/functions/color#opacify + , +2 | a {b: color.opacify(#abcdef, 0.5)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> fade_in/input.scss +@use "sass:color"; +a {b: color.fade-in(#abcdef, 0.5)} + +<===> fade_in/error +Error: The function fade-in() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $alpha: 0.5) + +More info: https://sass-lang.com/documentation/functions/color#fade-in + , +2 | a {b: color.fade-in(#abcdef, 0.5)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> transparentize/input.scss +@use "sass:color"; +a {b: color.transparentize(#abcdef, 0.5)} + +<===> transparentize/error +Error: The function transparentize() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $alpha: -0.5) + +More info: https://sass-lang.com/documentation/functions/color#transparentize + , +2 | a {b: color.transparentize(#abcdef, 0.5)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> fade_out/input.scss +@use "sass:color"; +a {b: color.fade-out(#abcdef, 0.5)} + +<===> fade_out/error +Error: The function fade-out() isn't in the sass:color module. + +Recommendation: color.adjust(#abcdef, $alpha: -0.5) + +More info: https://sass-lang.com/documentation/functions/color#fade-out + , +2 | a {b: color.fade-out(#abcdef, 0.5)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/green.hrx b/spec/core_functions/modules/color/green.hrx new file mode 100644 index 0000000000..4799398cdb --- /dev/null +++ b/spec/core_functions/modules/color/green.hrx @@ -0,0 +1,21 @@ +<===> input.scss +@use "sass:color"; +a {b: color.green(#abcdef)} + +<===> output.css +a { + b: 205; +} + +<===> warning +DEPRECATION WARNING: color.green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.green(#abcdef)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/hue.hrx b/spec/core_functions/modules/color/hue.hrx new file mode 100644 index 0000000000..30a6f58d31 --- /dev/null +++ b/spec/core_functions/modules/color/hue.hrx @@ -0,0 +1,21 @@ +<===> input.scss +@use "sass:color"; +a {b: color.hue(#abcdef)} + +<===> output.css +a { + b: 210%; +} + +<===> warning +DEPRECATION WARNING: color.hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.hue(#abcdef)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/ie_hex_str.hrx b/spec/core_functions/modules/color/ie_hex_str.hrx new file mode 100644 index 0000000000..22dc21e0ca --- /dev/null +++ b/spec/core_functions/modules/color/ie_hex_str.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.ie-hex-str(#abcdef)} + +<===> output.css +a { + b: #FFABCDEF; +} diff --git a/spec/core_functions/modules/color/invert.hrx b/spec/core_functions/modules/color/invert.hrx new file mode 100644 index 0000000000..a90cbcf51f --- /dev/null +++ b/spec/core_functions/modules/color/invert.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.invert(#abcdef)} + +<===> output.css +a { + b: #543210; +} diff --git a/spec/core_functions/modules/color/lightness.hrx b/spec/core_functions/modules/color/lightness.hrx new file mode 100644 index 0000000000..8725ff5b01 --- /dev/null +++ b/spec/core_functions/modules/color/lightness.hrx @@ -0,0 +1,21 @@ +<===> input.scss +@use "sass:color"; +a {b: color.lightness(#abcdef)} + +<===> output.css +a { + b: 80.3921568627%; +} + +<===> warning +DEPRECATION WARNING: color.lightness() is deprecated. Suggestion: + +color.channel($color, lightness) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.lightness(#abcdef)} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/mix.hrx b/spec/core_functions/modules/color/mix.hrx new file mode 100644 index 0000000000..f17eb40e4c --- /dev/null +++ b/spec/core_functions/modules/color/mix.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.mix(#abcdef, #daddee)} + +<===> output.css +a { + b: #c3d5ef; +} diff --git a/spec/core_functions/modules/color/red.hrx b/spec/core_functions/modules/color/red.hrx new file mode 100644 index 0000000000..7451a39ef3 --- /dev/null +++ b/spec/core_functions/modules/color/red.hrx @@ -0,0 +1,21 @@ +<===> input.scss +@use "sass:color"; +a {b: color.red(#abcdef)} + +<===> output.css +a { + b: 171; +} + +<===> warning +DEPRECATION WARNING: color.red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.red(#abcdef)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/saturation.hrx b/spec/core_functions/modules/color/saturation.hrx new file mode 100644 index 0000000000..8d66b7cb5d --- /dev/null +++ b/spec/core_functions/modules/color/saturation.hrx @@ -0,0 +1,21 @@ +<===> input.scss +@use "sass:color"; +a {b: color.saturation(#abcdef)} + +<===> output.css +a { + b: 68%; +} + +<===> warning +DEPRECATION WARNING: color.saturation() is deprecated. Suggestion: + +color.channel($color, saturation) + +More info: https://sass-lang.com/d/color-functions + + , +2 | a {b: color.saturation(#abcdef)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/modules/color/scale.hrx b/spec/core_functions/modules/color/scale.hrx new file mode 100644 index 0000000000..6f806f8547 --- /dev/null +++ b/spec/core_functions/modules/color/scale.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.scale(#abcdef, $red: 10%)} + +<===> output.css +a { + b: rgb(179.4, 205, 239); +} diff --git a/spec/libsass-closed-issues/issue_100.hrx b/spec/libsass-closed-issues/issue_100.hrx index b2593a1a0a..a4b7afe7c7 100644 --- a/spec/libsass-closed-issues/issue_100.hrx +++ b/spec/libsass-closed-issues/issue_100.hrx @@ -12,3 +12,17 @@ test { test { background-color: #cc0000 \9 ; } + +<===> warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -20%) +color.adjust($color, $lightness: -10%) + +More info: https://sass-lang.com/d/color-functions + + , +3 | background-color: darken($endColor, 10%) \9; + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 3:21 root stylesheet diff --git a/spec/libsass-closed-issues/issue_1075.hrx b/spec/libsass-closed-issues/issue_1075.hrx index fbf2084c44..8697d18cf7 100644 --- a/spec/libsass-closed-issues/issue_1075.hrx +++ b/spec/libsass-closed-issues/issue_1075.hrx @@ -21,6 +21,19 @@ Recommendation: call(get-function("lighten")) ' input.scss 4:8 root stylesheet +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 20%) +color.adjust($color, $lightness: 10%) + +More info: https://sass-lang.com/d/color-functions + + , +4 | bar: call($name, $args...); + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 4:8 root stylesheet + <===> warning-libsass DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal in Sass 4.0. Use call(function-reference(lighten)) instead. diff --git a/spec/libsass-closed-issues/issue_1132.hrx b/spec/libsass-closed-issues/issue_1132.hrx index 41bde3ffbb..2eb4835680 100644 --- a/spec/libsass-closed-issues/issue_1132.hrx +++ b/spec/libsass-closed-issues/issue_1132.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss foo { @for $i from 0 through 360 { @@ -369,3 +373,16 @@ foo { i359: 359deg; i360: 0deg; } + +<===> warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +3 | i#{$i}: hue(hsl($i, 10%, 20%)); + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 3:13 root stylesheet diff --git a/spec/libsass-closed-issues/issue_1285.hrx b/spec/libsass-closed-issues/issue_1285.hrx index d6821f0b4c..4ecb8c3fcf 100644 --- a/spec/libsass-closed-issues/issue_1285.hrx +++ b/spec/libsass-closed-issues/issue_1285.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss .container { @for $i from 1 through 3 { @@ -45,3 +49,43 @@ .outside-child { background-color: blue; } + +<===> warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -10%) +color.adjust($color, $lightness: -5%) + +More info: https://sass-lang.com/d/color-functions + + , +4 | color: darken(red,($i * 5)); + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 4:14 root stylesheet + +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -20%) +color.adjust($color, $lightness: -10%) + +More info: https://sass-lang.com/d/color-functions + + , +4 | color: darken(red,($i * 5)); + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 4:14 root stylesheet + +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -30%) +color.adjust($color, $lightness: -15%) + +More info: https://sass-lang.com/d/color-functions + + , +4 | color: darken(red,($i * 5)); + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 4:14 root stylesheet diff --git a/spec/libsass-closed-issues/issue_1969.hrx b/spec/libsass-closed-issues/issue_1969.hrx index 23f1193028..a37b624a2d 100644 --- a/spec/libsass-closed-issues/issue_1969.hrx +++ b/spec/libsass-closed-issues/issue_1969.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss $base-text-color: #666; @@ -14,3 +18,17 @@ $header-text-color: calcNavbarTextColor($base-text-color); .test_class { color: #999999; } + +<===> warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 33.3333333333%) +color.adjust($color, $lightness: 20%) + +More info: https://sass-lang.com/d/color-functions + + , +10 | color: lighten($header-text-color, 20%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 10:16 root stylesheet diff --git a/spec/libsass-closed-issues/issue_2374.hrx b/spec/libsass-closed-issues/issue_2374.hrx index be9934d733..6bc9f66582 100644 --- a/spec/libsass-closed-issues/issue_2374.hrx +++ b/spec/libsass-closed-issues/issue_2374.hrx @@ -191,6 +191,136 @@ If you really want to use the color value here, use '"" + $name'. ' input.scss 7:12 root stylesheet +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 100%) +color.adjust($color, $lightness: 40%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 98.8775510204%) +color.adjust($color, $lightness: 38%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 93.6734693878%) +color.adjust($color, $lightness: 36%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 88.4693877551%) +color.adjust($color, $lightness: 34%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 83.2653061224%) +color.adjust($color, $lightness: 32%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 78.0612244898%) +color.adjust($color, $lightness: 30%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 72.8571428571%) +color.adjust($color, $lightness: 28%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 67.6530612245%) +color.adjust($color, $lightness: 26%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 62.4489795918%) +color.adjust($color, $lightness: 24%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 57.2448979592%) +color.adjust($color, $lightness: 22%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | .#{$name}-#{($i*100)} { background-color: lighten($color, $amount) }; + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:51 root stylesheet + WARNING: You probably don't mean to use the color value yellow in interpolation here. It may end up represented as yellow, which will likely produce invalid CSS. Always quote color names when using them as strings or map keys (for example, "yellow"). @@ -202,6 +332,19 @@ If you really want to use the color value here, use '"" + $name'. ' input.scss 20:12 root stylesheet +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 20%) +color.adjust($color, $lightness: 10%) + +More info: https://sass-lang.com/d/color-functions + + , +21 | background-color: lighten($color, 10) + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 21:29 root stylesheet + WARNING: You probably don't mean to use the color value red in interpolation here. It may end up represented as red, which will likely produce invalid CSS. Always quote color names when using them as strings or map keys (for example, "red"). diff --git a/spec/libsass-closed-issues/issue_2462.hrx b/spec/libsass-closed-issues/issue_2462.hrx index 420b17bb39..6ec5454ee5 100644 --- a/spec/libsass-closed-issues/issue_2462.hrx +++ b/spec/libsass-closed-issues/issue_2462.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss b { color: lighten(Crimson, 10%); @@ -12,3 +16,17 @@ b { b { color: #ed365b; } + +<===> warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 18.8888888889%) +color.adjust($color, $lightness: 10%) + +More info: https://sass-lang.com/d/color-functions + + , +2 | color: lighten(Crimson, 10%); + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:12 root stylesheet diff --git a/spec/libsass-closed-issues/issue_2472.hrx b/spec/libsass-closed-issues/issue_2472.hrx index 98b6b3d5a9..512b184643 100644 --- a/spec/libsass-closed-issues/issue_2472.hrx +++ b/spec/libsass-closed-issues/issue_2472.hrx @@ -40,6 +40,32 @@ $arg: join((), 5%); } <===> warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -39.84375%) +color.adjust($color, $lightness: -5%) + +More info: https://sass-lang.com/d/color-functions + + , +17 | direct: darken(#102030, 5%); + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 17:11 root stylesheet + +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -39.84375%) +color.adjust($color, $lightness: -5%) + +More info: https://sass-lang.com/d/color-functions + + , +18 | arg: darken(#102030, $arg...); + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 18:8 root stylesheet + DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal in Dart Sass 2.0.0. Recommendation: call(get-function("darken")) @@ -50,6 +76,19 @@ Recommendation: call(get-function("darken")) ' input.scss 19:9 root stylesheet +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -39.84375%) +color.adjust($color, $lightness: -5%) + +More info: https://sass-lang.com/d/color-functions + + , +19 | call: call('darken', #102030, $arg...); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 19:9 root stylesheet + DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal in Dart Sass 2.0.0. Recommendation: call(get-function("darken")) @@ -61,6 +100,20 @@ Recommendation: call(get-function("darken")) input.scss 5:11 dark() input.scss 20:13 root stylesheet +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -39.84375%) +color.adjust($color, $lightness: -5%) + +More info: https://sass-lang.com/d/color-functions + + , +5 | @return call('darken', $color, $args...); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 5:11 dark() + input.scss 20:13 root stylesheet + DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal in Dart Sass 2.0.0. Recommendation: call(get-function("darken")) @@ -72,6 +125,20 @@ Recommendation: call(get-function("darken")) input.scss 11:11 dark2() input.scss 21:14 root stylesheet +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -39.84375%) +color.adjust($color, $lightness: -5%) + +More info: https://sass-lang.com/d/color-functions + + , +11 | @return call('darken', $args...); + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 11:11 dark2() + input.scss 21:14 root stylesheet + <===> warning-libsass DEPRECATION WARNING: Passing a string to call() is deprecated and will be illegal in Sass 4.0. Use call(get-function("darken")) instead. diff --git a/spec/libsass-closed-issues/issue_86.hrx b/spec/libsass-closed-issues/issue_86.hrx index 236eb4c69d..b2eb389423 100644 --- a/spec/libsass-closed-issues/issue_86.hrx +++ b/spec/libsass-closed-issues/issue_86.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss .color-functions { $color: red; @@ -17,3 +21,88 @@ test-1: true; test-2: true; } + +<===> warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +3 | hue: hue($color); + | ^^^^^^^^^^^ + ' + input.scss 3:10 root stylesheet + +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +4 | hue-type: type-of(hue($color)); + | ^^^^^^^^^^^ + ' + input.scss 4:23 root stylesheet + +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +5 | hue-unit: unit(hue($color)); + | ^^^^^^^^^^^ + ' + input.scss 5:20 root stylesheet + +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +6 | hue-comparable: comparable(hue($color), hue($color)); + | ^^^^^^^^^^^ + ' + input.scss 6:32 root stylesheet + +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +6 | hue-comparable: comparable(hue($color), hue($color)); + | ^^^^^^^^^^^ + ' + input.scss 6:45 root stylesheet + +DEPRECATION WARNING: lightness() is deprecated. Suggestion: + +color.channel($color, lightness) + +More info: https://sass-lang.com/d/color-functions + + , +7 | test-1: comparable(lightness(red), 1%); + | ^^^^^^^^^^^^^^ + ' + input.scss 7:21 root stylesheet + +DEPRECATION WARNING: saturation() is deprecated. Suggestion: + +color.channel($color, saturation) + +More info: https://sass-lang.com/d/color-functions + + , +8 | test-2: comparable(saturation(red), 1%); + | ^^^^^^^^^^^^^^^ + ' + input.scss 8:21 root stylesheet diff --git a/spec/libsass-closed-issues/issue_864.hrx b/spec/libsass-closed-issues/issue_864.hrx index b19547d21b..d8fef4e11f 100644 --- a/spec/libsass-closed-issues/issue_864.hrx +++ b/spec/libsass-closed-issues/issue_864.hrx @@ -1,6 +1,24 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss div { color: desaturate(#999, 50%); } <===> output.css div { color: #999999; } + +<===> warning +DEPRECATION WARNING: desaturate() is deprecated. Suggestions: + +color.scale($color, $saturation: -100%) +color.adjust($color, $saturation: -50%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | div { color: desaturate(#999, 50%); } + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:14 root stylesheet diff --git a/spec/libsass/bourbon.hrx b/spec/libsass/bourbon.hrx index 0c2cf91adc..356dcdb0d7 100644 --- a/spec/libsass/bourbon.hrx +++ b/spec/libsass/bourbon.hrx @@ -1,10 +1,8 @@ <===> options.yml - :todo: -# This file starts failing when split, sass compiler seems to struggle when -# `input.scss` is a real file with `@import "a/b/c"` and `a/b` is actually an -# HRX file containing `c` in its root. -- lint-hrx + - lint-hrx +:warning_todo: + - libsass <===> input.scss @import "lib/_bourbon.scss"; @@ -1969,3 +1967,17 @@ div { background-image: -webkit-url("/images/a.png")-gradient( center), -webkit-url("images/b.png")-gradient( left); background-image: url("/images/a.png")-gradient( center), url("images/b.png")-gradient( left); } + +<===> warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -21.0743801653%) +color.adjust($color, $lightness: -10%) + +More info: https://sass-lang.com/d/color-functions + + , +25 | linear-gradient(#4e7ba3, darken(#4e7ba4, 10%))); + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 25:55 root stylesheet diff --git a/spec/libsass/color-functions/saturate.hrx b/spec/libsass/color-functions/saturate.hrx index b64b142b85..4c6464a824 100644 --- a/spec/libsass/color-functions/saturate.hrx +++ b/spec/libsass/color-functions/saturate.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss foo { c0: saturate(hsl(100, 0%, 50%), 0%); @@ -308,3 +312,1290 @@ foo { c99: #55fe01; c100: #55ff00; } + +<===> warning +DEPRECATION WARNING: saturate() is deprecated. Suggestion: + +color.adjust($color, $saturation: 0%) + +More info: https://sass-lang.com/d/color-functions + + , +2 | c0: saturate(hsl(100, 0%, 50%), 0%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 1%) +color.adjust($color, $saturation: 1%) + +More info: https://sass-lang.com/d/color-functions + + , +3 | c1: saturate(hsl(100, 0%, 50%), 1%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 3:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 2%) +color.adjust($color, $saturation: 2%) + +More info: https://sass-lang.com/d/color-functions + + , +4 | c2: saturate(hsl(100, 0%, 50%), 2%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 4:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 3%) +color.adjust($color, $saturation: 3%) + +More info: https://sass-lang.com/d/color-functions + + , +5 | c3: saturate(hsl(100, 0%, 50%), 3%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 5:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 4%) +color.adjust($color, $saturation: 4%) + +More info: https://sass-lang.com/d/color-functions + + , +6 | c4: saturate(hsl(100, 0%, 50%), 4%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 6:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 5%) +color.adjust($color, $saturation: 5%) + +More info: https://sass-lang.com/d/color-functions + + , +7 | c5: saturate(hsl(100, 0%, 50%), 5%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 7:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 6%) +color.adjust($color, $saturation: 6%) + +More info: https://sass-lang.com/d/color-functions + + , +8 | c6: saturate(hsl(100, 0%, 50%), 6%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 8:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 7%) +color.adjust($color, $saturation: 7%) + +More info: https://sass-lang.com/d/color-functions + + , +9 | c7: saturate(hsl(100, 0%, 50%), 7%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 9:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 8%) +color.adjust($color, $saturation: 8%) + +More info: https://sass-lang.com/d/color-functions + + , +10 | c8: saturate(hsl(100, 0%, 50%), 8%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 10:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 9%) +color.adjust($color, $saturation: 9%) + +More info: https://sass-lang.com/d/color-functions + + , +11 | c9: saturate(hsl(100, 0%, 50%), 9%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 11:7 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 10%) +color.adjust($color, $saturation: 10%) + +More info: https://sass-lang.com/d/color-functions + + , +12 | c10: saturate(hsl(100, 0%, 50%), 10%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 12:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 11%) +color.adjust($color, $saturation: 11%) + +More info: https://sass-lang.com/d/color-functions + + , +13 | c11: saturate(hsl(100, 0%, 50%), 11%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 13:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 12%) +color.adjust($color, $saturation: 12%) + +More info: https://sass-lang.com/d/color-functions + + , +14 | c12: saturate(hsl(100, 0%, 50%), 12%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 14:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 13%) +color.adjust($color, $saturation: 13%) + +More info: https://sass-lang.com/d/color-functions + + , +15 | c13: saturate(hsl(100, 0%, 50%), 13%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 15:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 14%) +color.adjust($color, $saturation: 14%) + +More info: https://sass-lang.com/d/color-functions + + , +16 | c14: saturate(hsl(100, 0%, 50%), 14%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 16:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 15%) +color.adjust($color, $saturation: 15%) + +More info: https://sass-lang.com/d/color-functions + + , +17 | c15: saturate(hsl(100, 0%, 50%), 15%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 17:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 16%) +color.adjust($color, $saturation: 16%) + +More info: https://sass-lang.com/d/color-functions + + , +18 | c16: saturate(hsl(100, 0%, 50%), 16%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 18:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 17%) +color.adjust($color, $saturation: 17%) + +More info: https://sass-lang.com/d/color-functions + + , +19 | c17: saturate(hsl(100, 0%, 50%), 17%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 19:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 18%) +color.adjust($color, $saturation: 18%) + +More info: https://sass-lang.com/d/color-functions + + , +20 | c18: saturate(hsl(100, 0%, 50%), 18%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 20:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 19%) +color.adjust($color, $saturation: 19%) + +More info: https://sass-lang.com/d/color-functions + + , +21 | c19: saturate(hsl(100, 0%, 50%), 19%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 21:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 20%) +color.adjust($color, $saturation: 20%) + +More info: https://sass-lang.com/d/color-functions + + , +22 | c20: saturate(hsl(100, 0%, 50%), 20%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 22:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 21%) +color.adjust($color, $saturation: 21%) + +More info: https://sass-lang.com/d/color-functions + + , +23 | c21: saturate(hsl(100, 0%, 50%), 21%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 23:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 22%) +color.adjust($color, $saturation: 22%) + +More info: https://sass-lang.com/d/color-functions + + , +24 | c22: saturate(hsl(100, 0%, 50%), 22%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 24:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 23%) +color.adjust($color, $saturation: 23%) + +More info: https://sass-lang.com/d/color-functions + + , +25 | c23: saturate(hsl(100, 0%, 50%), 23%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 25:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 24%) +color.adjust($color, $saturation: 24%) + +More info: https://sass-lang.com/d/color-functions + + , +26 | c24: saturate(hsl(100, 0%, 50%), 24%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 26:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 25%) +color.adjust($color, $saturation: 25%) + +More info: https://sass-lang.com/d/color-functions + + , +27 | c25: saturate(hsl(100, 0%, 50%), 25%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 27:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 26%) +color.adjust($color, $saturation: 26%) + +More info: https://sass-lang.com/d/color-functions + + , +28 | c26: saturate(hsl(100, 0%, 50%), 26%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 28:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 27%) +color.adjust($color, $saturation: 27%) + +More info: https://sass-lang.com/d/color-functions + + , +29 | c27: saturate(hsl(100, 0%, 50%), 27%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 29:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 28%) +color.adjust($color, $saturation: 28%) + +More info: https://sass-lang.com/d/color-functions + + , +30 | c28: saturate(hsl(100, 0%, 50%), 28%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 30:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 29%) +color.adjust($color, $saturation: 29%) + +More info: https://sass-lang.com/d/color-functions + + , +31 | c29: saturate(hsl(100, 0%, 50%), 29%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 31:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 30%) +color.adjust($color, $saturation: 30%) + +More info: https://sass-lang.com/d/color-functions + + , +32 | c30: saturate(hsl(100, 0%, 50%), 30%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 32:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 31%) +color.adjust($color, $saturation: 31%) + +More info: https://sass-lang.com/d/color-functions + + , +33 | c31: saturate(hsl(100, 0%, 50%), 31%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 33:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 32%) +color.adjust($color, $saturation: 32%) + +More info: https://sass-lang.com/d/color-functions + + , +34 | c32: saturate(hsl(100, 0%, 50%), 32%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 34:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 33%) +color.adjust($color, $saturation: 33%) + +More info: https://sass-lang.com/d/color-functions + + , +35 | c33: saturate(hsl(100, 0%, 50%), 33%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 35:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 34%) +color.adjust($color, $saturation: 34%) + +More info: https://sass-lang.com/d/color-functions + + , +36 | c34: saturate(hsl(100, 0%, 50%), 34%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 36:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 35%) +color.adjust($color, $saturation: 35%) + +More info: https://sass-lang.com/d/color-functions + + , +37 | c35: saturate(hsl(100, 0%, 50%), 35%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 37:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 36%) +color.adjust($color, $saturation: 36%) + +More info: https://sass-lang.com/d/color-functions + + , +38 | c36: saturate(hsl(100, 0%, 50%), 36%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 38:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 37%) +color.adjust($color, $saturation: 37%) + +More info: https://sass-lang.com/d/color-functions + + , +39 | c37: saturate(hsl(100, 0%, 50%), 37%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 39:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 38%) +color.adjust($color, $saturation: 38%) + +More info: https://sass-lang.com/d/color-functions + + , +40 | c38: saturate(hsl(100, 0%, 50%), 38%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 40:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 39%) +color.adjust($color, $saturation: 39%) + +More info: https://sass-lang.com/d/color-functions + + , +41 | c39: saturate(hsl(100, 0%, 50%), 39%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 41:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 41%) +color.adjust($color, $saturation: 41%) + +More info: https://sass-lang.com/d/color-functions + + , +43 | c41: saturate(hsl(100, 0%, 50%), 41%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 43:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 42%) +color.adjust($color, $saturation: 42%) + +More info: https://sass-lang.com/d/color-functions + + , +44 | c42: saturate(hsl(100, 0%, 50%), 42%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 44:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 43%) +color.adjust($color, $saturation: 43%) + +More info: https://sass-lang.com/d/color-functions + + , +45 | c43: saturate(hsl(100, 0%, 50%), 43%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 45:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 44%) +color.adjust($color, $saturation: 44%) + +More info: https://sass-lang.com/d/color-functions + + , +46 | c44: saturate(hsl(100, 0%, 50%), 44%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 46:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 45%) +color.adjust($color, $saturation: 45%) + +More info: https://sass-lang.com/d/color-functions + + , +47 | c45: saturate(hsl(100, 0%, 50%), 45%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 47:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 46%) +color.adjust($color, $saturation: 46%) + +More info: https://sass-lang.com/d/color-functions + + , +48 | c46: saturate(hsl(100, 0%, 50%), 46%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 48:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 47%) +color.adjust($color, $saturation: 47%) + +More info: https://sass-lang.com/d/color-functions + + , +49 | c47: saturate(hsl(100, 0%, 50%), 47%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 49:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 48%) +color.adjust($color, $saturation: 48%) + +More info: https://sass-lang.com/d/color-functions + + , +50 | c48: saturate(hsl(100, 0%, 50%), 48%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 50:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 49%) +color.adjust($color, $saturation: 49%) + +More info: https://sass-lang.com/d/color-functions + + , +51 | c49: saturate(hsl(100, 0%, 50%), 49%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 51:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 50%) +color.adjust($color, $saturation: 50%) + +More info: https://sass-lang.com/d/color-functions + + , +52 | c50: saturate(hsl(100, 0%, 50%), 50%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 52:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 51%) +color.adjust($color, $saturation: 51%) + +More info: https://sass-lang.com/d/color-functions + + , +53 | c51: saturate(hsl(100, 0%, 50%), 51%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 53:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 52%) +color.adjust($color, $saturation: 52%) + +More info: https://sass-lang.com/d/color-functions + + , +54 | c52: saturate(hsl(100, 0%, 50%), 52%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 54:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 53%) +color.adjust($color, $saturation: 53%) + +More info: https://sass-lang.com/d/color-functions + + , +55 | c53: saturate(hsl(100, 0%, 50%), 53%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 55:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 54%) +color.adjust($color, $saturation: 54%) + +More info: https://sass-lang.com/d/color-functions + + , +56 | c54: saturate(hsl(100, 0%, 50%), 54%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 56:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 55%) +color.adjust($color, $saturation: 55%) + +More info: https://sass-lang.com/d/color-functions + + , +57 | c55: saturate(hsl(100, 0%, 50%), 55%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 57:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 56%) +color.adjust($color, $saturation: 56%) + +More info: https://sass-lang.com/d/color-functions + + , +58 | c56: saturate(hsl(100, 0%, 50%), 56%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 58:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 57%) +color.adjust($color, $saturation: 57%) + +More info: https://sass-lang.com/d/color-functions + + , +59 | c57: saturate(hsl(100, 0%, 50%), 57%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 59:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 58%) +color.adjust($color, $saturation: 58%) + +More info: https://sass-lang.com/d/color-functions + + , +60 | c58: saturate(hsl(100, 0%, 50%), 58%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 60:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 59%) +color.adjust($color, $saturation: 59%) + +More info: https://sass-lang.com/d/color-functions + + , +61 | c59: saturate(hsl(100, 0%, 50%), 59%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 61:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 60%) +color.adjust($color, $saturation: 60%) + +More info: https://sass-lang.com/d/color-functions + + , +62 | c60: saturate(hsl(100, 0%, 50%), 60%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 62:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 61%) +color.adjust($color, $saturation: 61%) + +More info: https://sass-lang.com/d/color-functions + + , +63 | c61: saturate(hsl(100, 0%, 50%), 61%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 63:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 62%) +color.adjust($color, $saturation: 62%) + +More info: https://sass-lang.com/d/color-functions + + , +64 | c62: saturate(hsl(100, 0%, 50%), 62%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 64:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 63%) +color.adjust($color, $saturation: 63%) + +More info: https://sass-lang.com/d/color-functions + + , +65 | c63: saturate(hsl(100, 0%, 50%), 63%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 65:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 64%) +color.adjust($color, $saturation: 64%) + +More info: https://sass-lang.com/d/color-functions + + , +66 | c64: saturate(hsl(100, 0%, 50%), 64%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 66:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 65%) +color.adjust($color, $saturation: 65%) + +More info: https://sass-lang.com/d/color-functions + + , +67 | c65: saturate(hsl(100, 0%, 50%), 65%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 67:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 66%) +color.adjust($color, $saturation: 66%) + +More info: https://sass-lang.com/d/color-functions + + , +68 | c66: saturate(hsl(100, 0%, 50%), 66%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 68:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 67%) +color.adjust($color, $saturation: 67%) + +More info: https://sass-lang.com/d/color-functions + + , +69 | c67: saturate(hsl(100, 0%, 50%), 67%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 69:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 68%) +color.adjust($color, $saturation: 68%) + +More info: https://sass-lang.com/d/color-functions + + , +70 | c68: saturate(hsl(100, 0%, 50%), 68%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 70:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 69%) +color.adjust($color, $saturation: 69%) + +More info: https://sass-lang.com/d/color-functions + + , +71 | c69: saturate(hsl(100, 0%, 50%), 69%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 71:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 70%) +color.adjust($color, $saturation: 70%) + +More info: https://sass-lang.com/d/color-functions + + , +72 | c70: saturate(hsl(100, 0%, 50%), 70%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 72:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 71%) +color.adjust($color, $saturation: 71%) + +More info: https://sass-lang.com/d/color-functions + + , +73 | c71: saturate(hsl(100, 0%, 50%), 71%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 73:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 72%) +color.adjust($color, $saturation: 72%) + +More info: https://sass-lang.com/d/color-functions + + , +74 | c72: saturate(hsl(100, 0%, 50%), 72%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 74:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 73%) +color.adjust($color, $saturation: 73%) + +More info: https://sass-lang.com/d/color-functions + + , +75 | c73: saturate(hsl(100, 0%, 50%), 73%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 75:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 74%) +color.adjust($color, $saturation: 74%) + +More info: https://sass-lang.com/d/color-functions + + , +76 | c74: saturate(hsl(100, 0%, 50%), 74%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 76:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 75%) +color.adjust($color, $saturation: 75%) + +More info: https://sass-lang.com/d/color-functions + + , +77 | c75: saturate(hsl(100, 0%, 50%), 75%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 77:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 76%) +color.adjust($color, $saturation: 76%) + +More info: https://sass-lang.com/d/color-functions + + , +78 | c76: saturate(hsl(100, 0%, 50%), 76%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 78:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 77%) +color.adjust($color, $saturation: 77%) + +More info: https://sass-lang.com/d/color-functions + + , +79 | c77: saturate(hsl(100, 0%, 50%), 77%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 79:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 78%) +color.adjust($color, $saturation: 78%) + +More info: https://sass-lang.com/d/color-functions + + , +80 | c78: saturate(hsl(100, 0%, 50%), 78%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 80:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 79%) +color.adjust($color, $saturation: 79%) + +More info: https://sass-lang.com/d/color-functions + + , +81 | c79: saturate(hsl(100, 0%, 50%), 79%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 81:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 81%) +color.adjust($color, $saturation: 81%) + +More info: https://sass-lang.com/d/color-functions + + , +83 | c81: saturate(hsl(100, 0%, 50%), 81%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 83:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 82%) +color.adjust($color, $saturation: 82%) + +More info: https://sass-lang.com/d/color-functions + + , +84 | c82: saturate(hsl(100, 0%, 50%), 82%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 84:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 83%) +color.adjust($color, $saturation: 83%) + +More info: https://sass-lang.com/d/color-functions + + , +85 | c83: saturate(hsl(100, 0%, 50%), 83%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 85:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 84%) +color.adjust($color, $saturation: 84%) + +More info: https://sass-lang.com/d/color-functions + + , +86 | c84: saturate(hsl(100, 0%, 50%), 84%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 86:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 85%) +color.adjust($color, $saturation: 85%) + +More info: https://sass-lang.com/d/color-functions + + , +87 | c85: saturate(hsl(100, 0%, 50%), 85%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 87:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 86%) +color.adjust($color, $saturation: 86%) + +More info: https://sass-lang.com/d/color-functions + + , +88 | c86: saturate(hsl(100, 0%, 50%), 86%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 88:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 87%) +color.adjust($color, $saturation: 87%) + +More info: https://sass-lang.com/d/color-functions + + , +89 | c87: saturate(hsl(100, 0%, 50%), 87%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 89:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 88%) +color.adjust($color, $saturation: 88%) + +More info: https://sass-lang.com/d/color-functions + + , +90 | c88: saturate(hsl(100, 0%, 50%), 88%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 90:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 89%) +color.adjust($color, $saturation: 89%) + +More info: https://sass-lang.com/d/color-functions + + , +91 | c89: saturate(hsl(100, 0%, 50%), 89%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 91:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 90%) +color.adjust($color, $saturation: 90%) + +More info: https://sass-lang.com/d/color-functions + + , +92 | c90: saturate(hsl(100, 0%, 50%), 90%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 92:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 91%) +color.adjust($color, $saturation: 91%) + +More info: https://sass-lang.com/d/color-functions + + , +93 | c91: saturate(hsl(100, 0%, 50%), 91%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 93:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 92%) +color.adjust($color, $saturation: 92%) + +More info: https://sass-lang.com/d/color-functions + + , +94 | c92: saturate(hsl(100, 0%, 50%), 92%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 94:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 93%) +color.adjust($color, $saturation: 93%) + +More info: https://sass-lang.com/d/color-functions + + , +95 | c93: saturate(hsl(100, 0%, 50%), 93%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 95:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 94%) +color.adjust($color, $saturation: 94%) + +More info: https://sass-lang.com/d/color-functions + + , +96 | c94: saturate(hsl(100, 0%, 50%), 94%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 96:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 95%) +color.adjust($color, $saturation: 95%) + +More info: https://sass-lang.com/d/color-functions + + , +97 | c95: saturate(hsl(100, 0%, 50%), 95%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 97:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 96%) +color.adjust($color, $saturation: 96%) + +More info: https://sass-lang.com/d/color-functions + + , +98 | c96: saturate(hsl(100, 0%, 50%), 96%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 98:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 97%) +color.adjust($color, $saturation: 97%) + +More info: https://sass-lang.com/d/color-functions + + , +99 | c97: saturate(hsl(100, 0%, 50%), 97%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 99:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 98%) +color.adjust($color, $saturation: 98%) + +More info: https://sass-lang.com/d/color-functions + + , +100 | c98: saturate(hsl(100, 0%, 50%), 98%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 100:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 99%) +color.adjust($color, $saturation: 99%) + +More info: https://sass-lang.com/d/color-functions + + , +101 | c99: saturate(hsl(100, 0%, 50%), 99%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 101:8 root stylesheet + +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 100%) +color.adjust($color, $saturation: 100%) + +More info: https://sass-lang.com/d/color-functions + + , +102 | c100: saturate(hsl(100, 0%, 50%), 100%); + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 102:9 root stylesheet diff --git a/spec/non_conformant/basic/22_colors_with_alpha.hrx b/spec/non_conformant/basic/22_colors_with_alpha.hrx index f7f7b748c6..fdb2022831 100644 --- a/spec/non_conformant/basic/22_colors_with_alpha.hrx +++ b/spec/non_conformant/basic/22_colors_with_alpha.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss $x: rgb(0, 255, 255); @@ -53,3 +57,40 @@ div { goo: rgba(64, 0, 191, 0.75); boo: #edcba9; } + +<===> warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +15 | hoo: red($x); + | ^^^^^^^ + ' + input.scss 15:8 root stylesheet + +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +16 | moo: green($x); + | ^^^^^^^^^ + ' + input.scss 16:8 root stylesheet + +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +17 | poo: blue($x); + | ^^^^^^^^ + ' + input.scss 17:8 root stylesheet diff --git a/spec/non_conformant/scss-tests/190_test_options_passed_to_script.hrx b/spec/non_conformant/scss-tests/190_test_options_passed_to_script.hrx index d42969daa2..5d41814355 100644 --- a/spec/non_conformant/scss-tests/190_test_options_passed_to_script.hrx +++ b/spec/non_conformant/scss-tests/190_test_options_passed_to_script.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss foo {color: darken(black, 10%)} @@ -5,3 +9,17 @@ foo {color: darken(black, 10%)} foo { color: black; } + +<===> warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -100%) +color.adjust($color, $lightness: -10%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | foo {color: darken(black, 10%)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:13 root stylesheet diff --git a/spec/non_conformant/scss/alpha.hrx b/spec/non_conformant/scss/alpha.hrx index ef04c12dc9..71c6282a23 100644 --- a/spec/non_conformant/scss/alpha.hrx +++ b/spec/non_conformant/scss/alpha.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss $x: rgb(0, 255, 255); @@ -48,3 +52,40 @@ div { poo: 6; boo: #edcba9; } + +<===> warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +16 | hoo: red($x); + | ^^^^^^^ + ' + input.scss 16:8 root stylesheet + +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +17 | moo: green($x); + | ^^^^^^^^^ + ' + input.scss 17:8 root stylesheet + +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +18 | poo: blue($x); + | ^^^^^^^^ + ' + input.scss 18:8 root stylesheet diff --git a/spec/non_conformant/scss/ie-backslash.hrx b/spec/non_conformant/scss/ie-backslash.hrx index 9b6f077574..26b94b5a63 100644 --- a/spec/non_conformant/scss/ie-backslash.hrx +++ b/spec/non_conformant/scss/ie-backslash.hrx @@ -11,3 +11,17 @@ div { div { background-color: #cc0000 \9 ; } + +<===> warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -20%) +color.adjust($color, $lightness: -10%) + +More info: https://sass-lang.com/d/color-functions + + , +2 | background-color: darken(red, 10%) \9; + | ^^^^^^^^^^^^^^^^ + ' + input.scss 2:21 root stylesheet diff --git a/spec/values/colors/alpha_hex/initial_digit.hrx b/spec/values/colors/alpha_hex/initial_digit.hrx index 58d4eaa019..983c76b143 100644 --- a/spec/values/colors/alpha_hex/initial_digit.hrx +++ b/spec/values/colors/alpha_hex/initial_digit.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss a { four-digit: #0123; @@ -42,3 +46,76 @@ a { eight-digit-blue: 84; eight-digit-alpha: 0.1960784314; } + +<===> warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +6 | four-digit-red: red(#0123); + | ^^^^^^^^^^ + ' + input.scss 6:19 root stylesheet + +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +7 | four-digit-green: green(#0123); + | ^^^^^^^^^^^^ + ' + input.scss 7:21 root stylesheet + +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +8 | four-digit-blue: blue(#0123); + | ^^^^^^^^^^^ + ' + input.scss 8:20 root stylesheet + +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +11 | eight-digit-red: red(#98765432); + | ^^^^^^^^^^^^^^ + ' + input.scss 11:20 root stylesheet + +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +12 | eight-digit-green: green(#98765432); + | ^^^^^^^^^^^^^^^^ + ' + input.scss 12:22 root stylesheet + +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +13 | eight-digit-blue: blue(#98765432); + | ^^^^^^^^^^^^^^^ + ' + input.scss 13:21 root stylesheet diff --git a/spec/values/colors/alpha_hex/initial_letter.hrx b/spec/values/colors/alpha_hex/initial_letter.hrx index 4702055f89..ba2e150b44 100644 --- a/spec/values/colors/alpha_hex/initial_letter.hrx +++ b/spec/values/colors/alpha_hex/initial_letter.hrx @@ -1,3 +1,7 @@ +<===> options.yml +:warning_todo: + - libsass + <===> input.scss a { four-digit: #AbCd; @@ -42,3 +46,76 @@ a { eight-digit-blue: 239; eight-digit-alpha: 0.0705882353; } + +<===> warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +6 | four-digit-red: red(#abcd); + | ^^^^^^^^^^ + ' + input.scss 6:19 root stylesheet + +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +7 | four-digit-green: green(#abcd); + | ^^^^^^^^^^^^ + ' + input.scss 7:21 root stylesheet + +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +8 | four-digit-blue: blue(#abcd); + | ^^^^^^^^^^^ + ' + input.scss 8:20 root stylesheet + +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +11 | eight-digit-red: red(#ABCDEF12); + | ^^^^^^^^^^^^^^ + ' + input.scss 11:20 root stylesheet + +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +12 | eight-digit-green: green(#ABCDEF12); + | ^^^^^^^^^^^^^^^^ + ' + input.scss 12:22 root stylesheet + +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +13 | eight-digit-blue: blue(#ABCDEF12); + | ^^^^^^^^^^^^^^^ + ' + input.scss 13:21 root stylesheet From 0f0692e9bff11d788d3a3f1e185dd56897355834 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Wed, 18 Jan 2023 15:41:15 -0800 Subject: [PATCH 08/45] Fix a hue test with the wrong unit --- spec/core_functions/modules/color/hue.hrx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/spec/core_functions/modules/color/hue.hrx b/spec/core_functions/modules/color/hue.hrx index 30a6f58d31..db41d37652 100644 --- a/spec/core_functions/modules/color/hue.hrx +++ b/spec/core_functions/modules/color/hue.hrx @@ -4,7 +4,7 @@ a {b: color.hue(#abcdef)} <===> output.css a { - b: 210%; + b: 210deg; } <===> warning From e6687a23b90f6bf27d19f1b4252bda67895e249b Mon Sep 17 00:00:00 2001 From: david herron <41588129+dvdherron@users.noreply.github.com> Date: Tue, 31 Jan 2023 14:33:58 -0600 Subject: [PATCH 09/45] [Color 4] Update tests for color.mix() and color.complement() (#1843) --- package-lock.json | 466 +----------------- spec/core_functions/color/complement.hrx | 140 ++++-- spec/core_functions/color/mix.hrx | 424 ---------------- spec/core_functions/color/mix/alpha.hrx | 47 ++ .../core_functions/color/mix/both_weights.hrx | 70 +++ spec/core_functions/color/mix/error.hrx | 416 ++++++++++++++++ .../color/mix/explicit_method.hrx | 33 ++ .../color/mix/explicit_weight.hrx | 47 ++ .../color/mix/hue_interpolation.hrx | 33 ++ .../core_functions/color/mix/mixed_spaces.hrx | 11 + spec/core_functions/color/mix/named.hrx | 23 + spec/core_functions/color/mix/predefined.hrx | 43 ++ spec/core_functions/color/mix/units.hrx | 51 ++ spec/core_functions/color/mix/unweighted.hrx | 30 ++ 14 files changed, 924 insertions(+), 910 deletions(-) delete mode 100644 spec/core_functions/color/mix.hrx create mode 100644 spec/core_functions/color/mix/alpha.hrx create mode 100644 spec/core_functions/color/mix/both_weights.hrx create mode 100644 spec/core_functions/color/mix/error.hrx create mode 100644 spec/core_functions/color/mix/explicit_method.hrx create mode 100644 spec/core_functions/color/mix/explicit_weight.hrx create mode 100644 spec/core_functions/color/mix/hue_interpolation.hrx create mode 100644 spec/core_functions/color/mix/mixed_spaces.hrx create mode 100644 spec/core_functions/color/mix/named.hrx create mode 100644 spec/core_functions/color/mix/predefined.hrx create mode 100644 spec/core_functions/color/mix/units.hrx create mode 100644 spec/core_functions/color/mix/unweighted.hrx diff --git a/package-lock.json b/package-lock.json index 58b1c22b13..6332a27ad1 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,7 +1,7 @@ { "name": "sass-spec", "version": "3.5.4", - "lockfileVersion": 2, + "lockfileVersion": 1, "requires": true, "packages": { "": { @@ -7545,11 +7545,6 @@ "fastq": "^1.6.0" } }, - "@sindresorhus/is": { - "version": "0.14.0", - "resolved": "https://registry.npmjs.org/@sindresorhus/is/-/is-0.14.0.tgz", - "integrity": "sha512-9NET910DNaIPngYnLLPeg+Ogzqsi9uM4mSboU5y6p8S5DzMTVEsJZrawi+BoDNUVBa2DhJqQYUFvMDfgU062LQ==" - }, "@sinonjs/commons": { "version": "1.8.3", "resolved": "https://registry.npmjs.org/@sinonjs/commons/-/commons-1.8.3.tgz", @@ -7566,14 +7561,6 @@ "@sinonjs/commons": "^1.7.0" } }, - "@szmarczak/http-timer": { - "version": "1.1.2", - "resolved": "https://registry.npmjs.org/@szmarczak/http-timer/-/http-timer-1.1.2.tgz", - "integrity": "sha512-XIB2XbzHTN6ieIjfIMV9hlVcfPU26s2vafYWQcZHWXHOxiaRZYEDKEwdl129Zyg50+foYV2jCgtrqSA6qNuNSA==", - "requires": { - "defer-to-connect": "^1.0.1" - } - }, "@tootallnate/once": { "version": "1.1.2", "resolved": "https://registry.npmjs.org/@tootallnate/once/-/once-1.1.2.tgz", @@ -7885,8 +7872,7 @@ "acorn-jsx": { "version": "5.3.2", "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz", - "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==", - "requires": {} + "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==" }, "acorn-walk": { "version": "7.2.0", @@ -7921,14 +7907,6 @@ "uri-js": "^4.2.2" } }, - "ansi-align": { - "version": "3.0.1", - "resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-3.0.1.tgz", - "integrity": "sha512-IOfwwBF5iczOjp/WeY4YxyjqAFMQoZufdQWDd19SEExbVLNXqvpzSJ/M7Za4/sCPmQ0+GRquoA7bGcINcxew6w==", - "requires": { - "string-width": "^4.1.0" - } - }, "ansi-colors": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-4.1.1.tgz", @@ -8091,28 +8069,6 @@ "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.2.tgz", "integrity": "sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==" }, - "boxen": { - "version": "5.1.2", - "resolved": "https://registry.npmjs.org/boxen/-/boxen-5.1.2.tgz", - "integrity": "sha512-9gYgQKXx+1nP8mP7CzFyaUARhg7D3n1dF/FnErWmu9l6JvGpNUN278h0aSb+QjoiKSWG+iZ3uHrcqk0qrY9RQQ==", - "requires": { - "ansi-align": "^3.0.0", - "camelcase": "^6.2.0", - "chalk": "^4.1.0", - "cli-boxes": "^2.2.1", - "string-width": "^4.2.2", - "type-fest": "^0.20.2", - "widest-line": "^3.1.0", - "wrap-ansi": "^7.0.0" - }, - "dependencies": { - "camelcase": { - "version": "6.2.0", - "resolved": "https://registry.npmjs.org/camelcase/-/camelcase-6.2.0.tgz", - "integrity": "sha512-c7wVvbw3f37nuobQNtgsgG9POC9qMbNuMQmTCqZv23b6MIz0fcYpBiOlv9gEN/hdLdnZTDQhg6e9Dq5M1vKvfg==" - } - } - }, "brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", @@ -8168,35 +8124,6 @@ "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz", "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==" }, - "cacheable-request": { - "version": "6.1.0", - "resolved": "https://registry.npmjs.org/cacheable-request/-/cacheable-request-6.1.0.tgz", - "integrity": "sha512-Oj3cAGPCqOZX7Rz64Uny2GYAZNliQSqfbePrgAQ1wKAihYmCUnraBtJtKcGR4xz7wF+LoJC+ssFZvv5BgF9Igg==", - "requires": { - "clone-response": "^1.0.2", - "get-stream": "^5.1.0", - "http-cache-semantics": "^4.0.0", - "keyv": "^3.0.0", - "lowercase-keys": "^2.0.0", - "normalize-url": "^4.1.0", - "responselike": "^1.0.2" - }, - "dependencies": { - "get-stream": { - "version": "5.2.0", - "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-5.2.0.tgz", - "integrity": "sha512-nBF+F1rAZVCu/p7rjzgA+Yb4lfYXrpl7a6VmJrU8wF9I1CKvP/QwPNZHnOlwbTkY6dvtFIzFMSyQXbLoTQPRpA==", - "requires": { - "pump": "^3.0.0" - } - }, - "lowercase-keys": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-2.0.0.tgz", - "integrity": "sha512-tqNXrS78oMOE73NMxK4EMLQsQowWf8jKooH9g7xPavRT706R6bkQJ6DY2Te7QukaZsulxa30wQ7bk0pm4XiHmA==" - } - } - }, "callsites": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", @@ -8256,11 +8183,6 @@ "resolved": "https://registry.npmjs.org/clean-stack/-/clean-stack-2.2.0.tgz", "integrity": "sha512-4diC9HaTE+KRAMWhDhrGOECgWZxoevMc5TlkObMqNSsVU62PYzXZ/SMTjzyGAFF1YusgxGcSWTEXBhp0CPwQ1A==" }, - "cli-boxes": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/cli-boxes/-/cli-boxes-2.2.1.tgz", - "integrity": "sha512-y4coMcylgSCdVinjiDBuR8PCC2bLjyGTwEmPb9NHR/QaNU6EUOXcTY/s6VjGMD6ENSEaeQYHCY0GNGS5jfMwPw==" - }, "cli-cursor": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-3.1.0.tgz", @@ -8284,14 +8206,6 @@ "wrap-ansi": "^7.0.0" } }, - "clone-response": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/clone-response/-/clone-response-1.0.2.tgz", - "integrity": "sha1-0dyXOSAxTfZ/vrlCI7TuNQI56Ws=", - "requires": { - "mimic-response": "^1.0.0" - } - }, "co": { "version": "4.6.0", "resolved": "https://registry.npmjs.org/co/-/co-4.6.0.tgz", @@ -8328,19 +8242,6 @@ "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=" }, - "configstore": { - "version": "5.0.1", - "resolved": "https://registry.npmjs.org/configstore/-/configstore-5.0.1.tgz", - "integrity": "sha512-aMKprgk5YhBNyH25hj8wGt2+D52Sw1DRRIzqBwLp2Ya9mFmY8KPvvtvmna8SxVR9JMZ4kzMD68N22vlaRpkeFA==", - "requires": { - "dot-prop": "^5.2.0", - "graceful-fs": "^4.1.2", - "make-dir": "^3.0.0", - "unique-string": "^2.0.0", - "write-file-atomic": "^3.0.0", - "xdg-basedir": "^4.0.0" - } - }, "convert-source-map": { "version": "1.8.0", "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.8.0.tgz", @@ -8364,11 +8265,6 @@ "which": "^2.0.1" } }, - "crypto-random-string": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/crypto-random-string/-/crypto-random-string-2.0.0.tgz", - "integrity": "sha512-v1plID3y9r/lPhviJ1wrXpLeyUIGAZ2SHNYTEapm7/8A9nLPoyvVp3RK/EPFqn5kEznyWgYZNsRtYYIWbuG8KA==" - }, "cssom": { "version": "0.4.4", "resolved": "https://registry.npmjs.org/cssom/-/cssom-0.4.4.tgz", @@ -8462,24 +8358,11 @@ "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.3.1.tgz", "integrity": "sha512-V0pfhfr8suzyPGOx3nmq4aHqabehUZn6Ch9kyFpV79TGDTWFmHqUqXdabR7QHqxzrYolF4+tVmJhUG4OURg5dQ==" }, - "decompress-response": { - "version": "3.3.0", - "resolved": "https://registry.npmjs.org/decompress-response/-/decompress-response-3.3.0.tgz", - "integrity": "sha1-gKTdMjdIOEv6JICDYirt7Jgq3/M=", - "requires": { - "mimic-response": "^1.0.0" - } - }, "dedent": { "version": "0.7.0", "resolved": "https://registry.npmjs.org/dedent/-/dedent-0.7.0.tgz", "integrity": "sha1-JJXduvbrh0q7Dhvp3yLS5aVEMmw=" }, - "deep-extend": { - "version": "0.6.0", - "resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz", - "integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==" - }, "deep-is": { "version": "0.1.4", "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz", @@ -8490,11 +8373,6 @@ "resolved": "https://registry.npmjs.org/deepmerge/-/deepmerge-4.2.2.tgz", "integrity": "sha512-FJ3UgI4gIl+PHZm53knsuSFpE+nESMr7M4v9QcgB7S63Kj/6WqMiFQJpBBYz1Pt+66bZpP3Q7Lye0Oo9MPKEdg==" }, - "defer-to-connect": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/defer-to-connect/-/defer-to-connect-1.1.3.tgz", - "integrity": "sha512-0ISdNousHvZT2EiFlZeZAHBUvSxmKswVCEf8hW7KWgG4a8MVEu/3Vb6uWYozkjylyCxe0JBIiRB1jV45S70WVQ==" - }, "del": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/del/-/del-6.0.0.tgz", @@ -8561,19 +8439,6 @@ } } }, - "dot-prop": { - "version": "5.3.0", - "resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-5.3.0.tgz", - "integrity": "sha512-QM8q3zDe58hqUqjraQOmzZ1LIH9SWQJTlEKCH4kJ2oQvLZk7RbQXvtDM2XEq3fwkV9CCvvH4LA0AV+ogFsBM2Q==", - "requires": { - "is-obj": "^2.0.0" - } - }, - "duplexer3": { - "version": "0.1.4", - "resolved": "https://registry.npmjs.org/duplexer3/-/duplexer3-0.1.4.tgz", - "integrity": "sha1-7gHdHKwO08vH/b6jfcCo8c4ALOI=" - }, "electron-to-chromium": { "version": "1.3.886", "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.886.tgz", @@ -8589,14 +8454,6 @@ "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz", "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==" }, - "end-of-stream": { - "version": "1.4.4", - "resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz", - "integrity": "sha512-+uw1inIHVPQoaVuHzRyXd21icM+cnt4CzD5rW+NC1wjOUSTOs+Te7FOv7AhN7vS9x/oIyhLP5PR1H+phQAHu5Q==", - "requires": { - "once": "^1.4.0" - } - }, "enquirer": { "version": "2.3.6", "resolved": "https://registry.npmjs.org/enquirer/-/enquirer-2.3.6.tgz", @@ -8618,11 +8475,6 @@ "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", "integrity": "sha512-k0er2gUkLf8O0zKJiAhmkTnJlTvINGv7ygDNPbeIsX/TJjGJZHuh9B2UxbsaEkmlEo9MfhrSzmhIlhRlI2GXnw==" }, - "escape-goat": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/escape-goat/-/escape-goat-2.1.1.tgz", - "integrity": "sha512-8/uIhbG12Csjy2JEW7D9pHbreaVaS/OpN3ycnyvElTdwM5n6GY6W6e2IPemfvGZeUMqZ9A/3GqIZMgKnBhAw/Q==" - }, "escape-string-regexp": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz", @@ -8771,8 +8623,7 @@ "eslint-config-prettier": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/eslint-config-prettier/-/eslint-config-prettier-7.2.0.tgz", - "integrity": "sha512-rV4Qu0C3nfJKPOAhFujFxB7RMP+URFyQqqOZW9DMRD7ZDTFyjaIlETU3xzHELt++4ugC0+Jm084HQYkkJe+Ivg==", - "requires": {} + "integrity": "sha512-rV4Qu0C3nfJKPOAhFujFxB7RMP+URFyQqqOZW9DMRD7ZDTFyjaIlETU3xzHELt++4ugC0+Jm084HQYkkJe+Ivg==" }, "eslint-plugin-es": { "version": "3.0.1", @@ -9180,14 +9031,6 @@ "is-glob": "^4.0.1" } }, - "global-dirs": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/global-dirs/-/global-dirs-3.0.0.tgz", - "integrity": "sha512-v8ho2DS5RiCjftj1nD9NmnfaOzTdud7RRnVd9kFNOjqZbISlx5DQ+OrTkywgd0dIt7oFCvKetZSHoHcP3sDdiA==", - "requires": { - "ini": "2.0.0" - } - }, "globals": { "version": "13.12.0", "resolved": "https://registry.npmjs.org/globals/-/globals-13.12.0.tgz", @@ -9209,43 +9052,15 @@ "slash": "^3.0.0" } }, - "got": { - "version": "9.6.0", - "resolved": "https://registry.npmjs.org/got/-/got-9.6.0.tgz", - "integrity": "sha512-R7eWptXuGYxwijs0eV+v3o6+XH1IqVK8dJOEecQfTmkncw9AV4dcw/Dhxi8MdlqPthxxpZyizMzyg8RTmEsG+Q==", - "requires": { - "@sindresorhus/is": "^0.14.0", - "@szmarczak/http-timer": "^1.1.2", - "cacheable-request": "^6.0.0", - "decompress-response": "^3.3.0", - "duplexer3": "^0.1.4", - "get-stream": "^4.1.0", - "lowercase-keys": "^1.0.1", - "mimic-response": "^1.0.1", - "p-cancelable": "^1.0.0", - "to-readable-stream": "^1.0.0", - "url-parse-lax": "^3.0.0" - }, - "dependencies": { - "get-stream": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/get-stream/-/get-stream-4.1.0.tgz", - "integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==", - "requires": { - "pump": "^3.0.0" - } - } - } - }, "graceful-fs": { "version": "4.2.8", "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.8.tgz", "integrity": "sha512-qkIilPUYcNhJpd33n0GBXTB1MMPp14TxEsEs0pTrsSVucApsYzW5V+Q8Qxhik6KU3evy+qkAAowTByymK0avdg==" }, "gts": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/gts/-/gts-3.1.0.tgz", - "integrity": "sha512-Pbj3ob1VR1IRlEVEBNtKoQ1wHOa8cZz62KEojK8Fn/qeS2ClWI4gLNfhek3lD68aZSmUEg8TFb6AHXIwUMgyqQ==", + "version": "3.1.1", + "resolved": "https://registry.npmjs.org/gts/-/gts-3.1.1.tgz", + "integrity": "sha512-Jw44aBbzMnd1vtZs7tZt3LMstKQukCBg7N4CKVGzviIQ45Cz5b9lxDJGXVKj/9ySuGv6TYEeijZJGbiiVcM27w==", "requires": { "@typescript-eslint/eslint-plugin": "^4.2.0", "@typescript-eslint/parser": "^4.2.0", @@ -9261,7 +9076,6 @@ "ncp": "^2.0.0", "prettier": "^2.1.2", "rimraf": "^3.0.2", - "update-notifier": "^5.0.0", "write-file-atomic": "^3.0.3" } }, @@ -9283,11 +9097,6 @@ "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==" }, - "has-yarn": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/has-yarn/-/has-yarn-2.1.0.tgz", - "integrity": "sha512-UqBRqi4ju7T+TqGNdqAO0PaSVGsDGJUBQvk9eUWNGRY1CFGDzYhLWoM7JQEemnlvVcv/YEmc2wNW8BC24EnUsw==" - }, "hosted-git-info": { "version": "4.0.2", "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-4.0.2.tgz", @@ -9309,11 +9118,6 @@ "resolved": "https://registry.npmjs.org/html-escaper/-/html-escaper-2.0.2.tgz", "integrity": "sha512-H2iMtd0I4Mt5eYiapRdIDjp+XzelXQ0tFE4JS7YFwFevXXMmOp9myNrUvCg0D6ws8iqkRPBfKHgbwig1SmlLfg==" }, - "http-cache-semantics": { - "version": "4.1.0", - "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz", - "integrity": "sha512-carPklcUh7ROWRK7Cv27RPtdhYhUsela/ue5/jKzjegVvXDqM2ILE9Q2BGn9JZJh1g87cp56su/FgQSzcWS8cQ==" - }, "http-proxy-agent": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-4.0.1.tgz", @@ -9365,11 +9169,6 @@ "resolve-from": "^4.0.0" } }, - "import-lazy": { - "version": "2.1.0", - "resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-2.1.0.tgz", - "integrity": "sha1-BWmOPUXIjo1+nZLLBYTnfwlvPkM=" - }, "import-local": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/import-local/-/import-local-3.0.3.tgz", @@ -9403,11 +9202,6 @@ "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz", "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==" }, - "ini": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/ini/-/ini-2.0.0.tgz", - "integrity": "sha512-7PnF4oN3CvZF23ADhA5wRaYEQpJ8qygSkbtTXWBeXWXmEVRXK+1ITciHWwHhsjv1TmW0MgacIv6hEi5pX5NQdA==" - }, "inquirer": { "version": "7.3.3", "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-7.3.3.tgz", @@ -9441,21 +9235,6 @@ "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz", "integrity": "sha1-d8mYQFJ6qOyxqLppe4BkWnqSap0=" }, - "is-ci": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/is-ci/-/is-ci-2.0.0.tgz", - "integrity": "sha512-YfJT7rkpQB0updsdHLGWrvhBJfcfzNNawYDNIyQXJz0IViGf75O8EBPKSdvw2rF+LGCsX4FZ8tcr3b19LcZq4w==", - "requires": { - "ci-info": "^2.0.0" - }, - "dependencies": { - "ci-info": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/ci-info/-/ci-info-2.0.0.tgz", - "integrity": "sha512-5tK7EtrZ0N+OLFMthtqOj4fI2Jeb88C4CAZPu25LDVUgXJ0A3Js4PMGqrn0JU1W0Mh1/Z8wZzYPxqUrXeBboCQ==" - } - } - }, "is-core-module": { "version": "2.8.0", "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.8.0.tgz", @@ -9487,30 +9266,11 @@ "is-extglob": "^2.1.1" } }, - "is-installed-globally": { - "version": "0.4.0", - "resolved": "https://registry.npmjs.org/is-installed-globally/-/is-installed-globally-0.4.0.tgz", - "integrity": "sha512-iwGqO3J21aaSkC7jWnHP/difazwS7SFeIqxv6wEtLU8Y5KlzFTjyqcSIT0d8s4+dDhKytsk9PJZ2BkS5eZwQRQ==", - "requires": { - "global-dirs": "^3.0.0", - "is-path-inside": "^3.0.2" - } - }, - "is-npm": { - "version": "5.0.0", - "resolved": "https://registry.npmjs.org/is-npm/-/is-npm-5.0.0.tgz", - "integrity": "sha512-WW/rQLOazUq+ST/bCAVBp/2oMERWLsR7OrKyt052dNDk4DHcDE0/7QSXITlmi+VBcV13DfIbysG3tZJm5RfdBA==" - }, "is-number": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==" }, - "is-obj": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/is-obj/-/is-obj-2.0.0.tgz", - "integrity": "sha512-drqDG3cbczxxEJRoOXcOjtdp1J/lyp1mNn0xaznRs8+muBhgQcrnbspox5X5fOw0HnMnbfDzvnEMEtqDEJEo8w==" - }, "is-path-cwd": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/is-path-cwd/-/is-path-cwd-2.2.0.tgz", @@ -9541,11 +9301,6 @@ "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz", "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=" }, - "is-yarn-global": { - "version": "0.3.0", - "resolved": "https://registry.npmjs.org/is-yarn-global/-/is-yarn-global-0.3.0.tgz", - "integrity": "sha512-VjSeb/lHmkoyd8ryPVIKvOCn4D1koMqY+vqyjjUfc3xyKtP4dYOxM44sZrnqQSzSds3xyOrUTLTC9LVCVgLngw==" - }, "isexe": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz", @@ -9998,8 +9753,7 @@ "jest-pnp-resolver": { "version": "1.2.2", "resolved": "https://registry.npmjs.org/jest-pnp-resolver/-/jest-pnp-resolver-1.2.2.tgz", - "integrity": "sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w==", - "requires": {} + "integrity": "sha512-olV41bKSMm8BdnuMsewT4jqlZ8+3TCARAXjZGT9jcoSnrfUnRCqnMoF9XEeoWjbzObpqF9dRhHQj0Xb9QdF6/w==" }, "jest-regex-util": { "version": "27.0.6", @@ -10295,11 +10049,6 @@ "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz", "integrity": "sha512-OYu7XEzjkCQ3C5Ps3QIZsQfNpqoJyZZA99wd9aWd05NCtC5pWOkShK2mkL6HXQR6/Cy2lbNdPlZBpuQHXE63gA==" }, - "json-buffer": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.0.tgz", - "integrity": "sha1-Wx85evx11ne96Lz8Dkfh+aPZqJg=" - }, "json-parse-even-better-errors": { "version": "2.3.1", "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-2.3.1.tgz", @@ -10336,14 +10085,6 @@ } } }, - "keyv": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/keyv/-/keyv-3.1.0.tgz", - "integrity": "sha512-9ykJ/46SN/9KPM/sichzQ7OvXyGDYKGTaDlKMGCAlg2UK8KRy4jb0d8sFc+0Tt0YYnThq8X2RZgCg74RPxgcVA==", - "requires": { - "json-buffer": "3.0.0" - } - }, "kind-of": { "version": "6.0.3", "resolved": "https://registry.npmjs.org/kind-of/-/kind-of-6.0.3.tgz", @@ -10354,14 +10095,6 @@ "resolved": "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz", "integrity": "sha512-eTIzlVOSUR+JxdDFepEYcBMtZ9Qqdef+rnzWdRZuMbOywu5tO2w2N7rqjoANZ5k9vywhL6Br1VRjUIgTQx4E8w==" }, - "latest-version": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/latest-version/-/latest-version-5.1.0.tgz", - "integrity": "sha512-weT+r0kTkRQdCdYCNtkMwWXQTMEswKrFBkm4ckQOMVhhqhIMI1UT2hMj+1iigIhgSZm5gTmrRXBNoGUgaTY1xA==", - "requires": { - "package-json": "^6.3.0" - } - }, "leven": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/leven/-/leven-3.1.0.tgz", @@ -10459,11 +10192,6 @@ "resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz", "integrity": "sha1-WjUNoLERO4N+z//VgSy+WNbq4ZM=" }, - "lowercase-keys": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/lowercase-keys/-/lowercase-keys-1.0.1.tgz", - "integrity": "sha512-G2Lj61tXDnVFFOi8VZds+SoQjtQC3dgokKdDG2mTm1tx4m50NUHBOZSBwQQHyy0V12A0JTG4icfZQH+xPyh8VA==" - }, "lru-cache": { "version": "6.0.0", "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-6.0.0.tgz", @@ -10568,11 +10296,6 @@ "resolved": "https://registry.npmjs.org/mimic-fn/-/mimic-fn-2.1.0.tgz", "integrity": "sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==" }, - "mimic-response": { - "version": "1.0.1", - "resolved": "https://registry.npmjs.org/mimic-response/-/mimic-response-1.0.1.tgz", - "integrity": "sha512-j5EctnkH7amfV/q5Hgmoal1g2QHFJRraOtmx0JpIqkxhBhI/lJSl1nMpQ45hVarwNETOoWEimndZ4QK0RHxuxQ==" - }, "min-indent": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/min-indent/-/min-indent-1.0.1.tgz", @@ -10586,11 +10309,6 @@ "brace-expansion": "^1.1.7" } }, - "minimist": { - "version": "1.2.6", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.6.tgz", - "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==" - }, "minimist-options": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/minimist-options/-/minimist-options-4.1.0.tgz", @@ -10657,11 +10375,6 @@ "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz", "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==" }, - "normalize-url": { - "version": "4.5.1", - "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-4.5.1.tgz", - "integrity": "sha512-9UZCFRHQdNrfTpGg8+1INIg93B6zE0aXMVFkw1WFwvO4SlZywU6aLg5Of0Ap/PgcbSw4LNxvMWXMeugwMCX0AA==" - }, "npm-run-path": { "version": "4.0.1", "resolved": "https://registry.npmjs.org/npm-run-path/-/npm-run-path-4.0.1.tgz", @@ -10709,11 +10422,6 @@ "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", "integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=" }, - "p-cancelable": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/p-cancelable/-/p-cancelable-1.1.0.tgz", - "integrity": "sha512-s73XxOZ4zpt1edZYZzvhqFa6uvQc1vwUa0K0BdtIZgQMAJj9IbebH+JkgKZc9h+B05PKHLOTl4ajG1BmNrVZlw==" - }, "p-limit": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-2.3.0.tgz", @@ -10743,24 +10451,6 @@ "resolved": "https://registry.npmjs.org/p-try/-/p-try-2.2.0.tgz", "integrity": "sha512-R4nPAVTAU0B9D35/Gk3uJf/7XYbQcyohSKdvAxIRSNghFl4e71hVoGnBNQz9cWaXxO2I10KTC+3jMdvvoKw6dQ==" }, - "package-json": { - "version": "6.5.0", - "resolved": "https://registry.npmjs.org/package-json/-/package-json-6.5.0.tgz", - "integrity": "sha512-k3bdm2n25tkyxcjSKzB5x8kfVxlMdgsbPr0GkZcwHsLpba6cBjqCt1KlcChKEvxHIcTB1FVMuwoijZ26xex5MQ==", - "requires": { - "got": "^9.6.0", - "registry-auth-token": "^4.0.0", - "registry-url": "^5.0.0", - "semver": "^6.2.0" - }, - "dependencies": { - "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" - } - } - }, "parent-module": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/parent-module/-/parent-module-1.0.1.tgz", @@ -10841,11 +10531,6 @@ "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz", "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==" }, - "prepend-http": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/prepend-http/-/prepend-http-2.0.0.tgz", - "integrity": "sha1-6SQ0v6XqjBn0HN/UAddBo8gZ2Jc=" - }, "prettier": { "version": "2.4.1", "resolved": "https://registry.npmjs.org/prettier/-/prettier-2.4.1.tgz", @@ -10896,28 +10581,11 @@ "resolved": "https://registry.npmjs.org/psl/-/psl-1.8.0.tgz", "integrity": "sha512-RIdOzyoavK+hA18OGGWDqUTsCLhtA7IcZ/6NCs4fFJaHBDab+pDDmDIByWFRQJq2Cd7r1OoQxBGKOaztq+hjIQ==" }, - "pump": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/pump/-/pump-3.0.0.tgz", - "integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==", - "requires": { - "end-of-stream": "^1.1.0", - "once": "^1.3.1" - } - }, "punycode": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.1.1.tgz", "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==" }, - "pupa": { - "version": "2.1.1", - "resolved": "https://registry.npmjs.org/pupa/-/pupa-2.1.1.tgz", - "integrity": "sha512-l1jNAspIBSFqbT+y+5FosojNpVpF94nlI+wDUpqP9enwOTfHx9f0gh5nB96vl+6yTpsJsypeNrwfzPrKuHB41A==", - "requires": { - "escape-goat": "^2.0.0" - } - }, "queue-microtask": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/queue-microtask/-/queue-microtask-1.2.3.tgz", @@ -10928,29 +10596,6 @@ "resolved": "https://registry.npmjs.org/quick-lru/-/quick-lru-4.0.1.tgz", "integrity": "sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==" }, - "rc": { - "version": "1.2.8", - "resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz", - "integrity": "sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==", - "requires": { - "deep-extend": "^0.6.0", - "ini": "~1.3.0", - "minimist": "^1.2.0", - "strip-json-comments": "~2.0.1" - }, - "dependencies": { - "ini": { - "version": "1.3.8", - "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.8.tgz", - "integrity": "sha512-JV/yugV2uzW5iMRSiZAyDtQd+nxtUnjeLt0acNdw98kKLrvuRVyB80tsREOE7yvGVgalhZ6RNXCmEHkUKBKxew==" - }, - "strip-json-comments": { - "version": "2.0.1", - "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz", - "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=" - } - } - }, "react-is": { "version": "17.0.2", "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz", @@ -11026,22 +10671,6 @@ "resolved": "https://registry.npmjs.org/regexpp/-/regexpp-3.2.0.tgz", "integrity": "sha512-pq2bWo9mVD43nbts2wGv17XLiNLya+GklZ8kaDLV2Z08gDCsGpnKn9BFMepvWuHCbyVvY7J5o5+BVvoQbmlJLg==" }, - "registry-auth-token": { - "version": "4.2.1", - "resolved": "https://registry.npmjs.org/registry-auth-token/-/registry-auth-token-4.2.1.tgz", - "integrity": "sha512-6gkSb4U6aWJB4SF2ZvLb76yCBjcvufXBqvvEx1HbmKPkutswjW1xNVRY0+daljIYRbogN7O0etYSlbiaEQyMyw==", - "requires": { - "rc": "^1.2.8" - } - }, - "registry-url": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/registry-url/-/registry-url-5.1.0.tgz", - "integrity": "sha512-8acYXXTI0AkQv6RAOjE3vOaIXZkT9wo4LOFbBKYQEEnnMNBpKqdUrI6S4NT0KPIo/WVvJ5tE/X5LF/TQUf0ekw==", - "requires": { - "rc": "^1.2.8" - } - }, "require-directory": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz", @@ -11086,14 +10715,6 @@ "resolved": "https://registry.npmjs.org/resolve.exports/-/resolve.exports-1.1.0.tgz", "integrity": "sha512-J1l+Zxxp4XK3LUDZ9m60LRJF/mAe4z6a4xyabPHk7pvK5t35dACV32iIjJDFeWZFfZlO29w6SZ67knR0tHzJtQ==" }, - "responselike": { - "version": "1.0.2", - "resolved": "https://registry.npmjs.org/responselike/-/responselike-1.0.2.tgz", - "integrity": "sha1-kYcg7ztjHFZCvgaPFa3lpG9Loec=", - "requires": { - "lowercase-keys": "^1.0.0" - } - }, "restore-cursor": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-3.1.0.tgz", @@ -11163,21 +10784,6 @@ "lru-cache": "^6.0.0" } }, - "semver-diff": { - "version": "3.1.1", - "resolved": "https://registry.npmjs.org/semver-diff/-/semver-diff-3.1.1.tgz", - "integrity": "sha512-GX0Ix/CJcHyB8c4ykpHGIAvLyOwOobtM/8d+TQkAd81/bEjgPHrfba41Vpesr7jX/t8Uh+R3EX9eAS5be+jQYg==", - "requires": { - "semver": "^6.3.0" - }, - "dependencies": { - "semver": { - "version": "6.3.0", - "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", - "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==" - } - } - }, "shebang-command": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz", @@ -11438,11 +11044,6 @@ "resolved": "https://registry.npmjs.org/to-fast-properties/-/to-fast-properties-2.0.0.tgz", "integrity": "sha1-3F5pjL0HkmW8c+A3doGk5Og/YW4=" }, - "to-readable-stream": { - "version": "1.0.0", - "resolved": "https://registry.npmjs.org/to-readable-stream/-/to-readable-stream-1.0.0.tgz", - "integrity": "sha512-Iq25XBt6zD5npPhlLVXGFN3/gyR2/qODcKNNyTMd4vbm39HUaOiAM4PMq0eMVC/Tkxz+Zjdsc55g9yyz+Yq00Q==" - }, "to-regex-range": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz", @@ -11569,40 +11170,11 @@ "resolved": "https://registry.npmjs.org/typescript/-/typescript-4.4.4.tgz", "integrity": "sha512-DqGhF5IKoBl8WNf8C1gu8q0xZSInh9j1kJJMqT3a94w1JzVaBU4EXOSMrz9yDqMT0xt3selp83fuFMQ0uzv6qA==" }, - "unique-string": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/unique-string/-/unique-string-2.0.0.tgz", - "integrity": "sha512-uNaeirEPvpZWSgzwsPGtU2zVSTrn/8L5q/IexZmH0eH6SA73CmAA5U4GwORTxQAZs95TAXLNqeLoPPNO5gZfWg==", - "requires": { - "crypto-random-string": "^2.0.0" - } - }, "universalify": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/universalify/-/universalify-0.1.2.tgz", "integrity": "sha512-rBJeI5CXAlmy1pV+617WB9J63U6XcazHHF2f2dbJix4XzpUF0RS3Zbj0FGIOCAva5P/d/GBOYaACQ1w+0azUkg==" }, - "update-notifier": { - "version": "5.1.0", - "resolved": "https://registry.npmjs.org/update-notifier/-/update-notifier-5.1.0.tgz", - "integrity": "sha512-ItnICHbeMh9GqUy31hFPrD1kcuZ3rpxDZbf4KUDavXwS0bW5m7SLbDQpGX3UYr072cbrF5hFUs3r5tUsPwjfHw==", - "requires": { - "boxen": "^5.0.0", - "chalk": "^4.1.0", - "configstore": "^5.0.1", - "has-yarn": "^2.1.0", - "import-lazy": "^2.1.0", - "is-ci": "^2.0.0", - "is-installed-globally": "^0.4.0", - "is-npm": "^5.0.0", - "is-yarn-global": "^0.3.0", - "latest-version": "^5.1.0", - "pupa": "^2.1.1", - "semver": "^7.3.4", - "semver-diff": "^3.1.1", - "xdg-basedir": "^4.0.0" - } - }, "uri-js": { "version": "4.4.1", "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz", @@ -11611,14 +11183,6 @@ "punycode": "^2.1.0" } }, - "url-parse-lax": { - "version": "3.0.0", - "resolved": "https://registry.npmjs.org/url-parse-lax/-/url-parse-lax-3.0.0.tgz", - "integrity": "sha1-FrXK/Afb42dsGxmZF3gj1lA6yww=", - "requires": { - "prepend-http": "^2.0.0" - } - }, "v8-compile-cache": { "version": "2.3.0", "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz", @@ -11710,14 +11274,6 @@ "isexe": "^2.0.0" } }, - "widest-line": { - "version": "3.1.0", - "resolved": "https://registry.npmjs.org/widest-line/-/widest-line-3.1.0.tgz", - "integrity": "sha512-NsmoXalsWVDMGupxZ5R08ka9flZjjiLvHVAWYOKtiKM8ujtZWr9cRffak+uSE48+Ob8ObalXpwyeUiyDD6QFgg==", - "requires": { - "string-width": "^4.0.0" - } - }, "word-wrap": { "version": "1.2.3", "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.3.tgz", @@ -11752,13 +11308,7 @@ "ws": { "version": "7.5.5", "resolved": "https://registry.npmjs.org/ws/-/ws-7.5.5.tgz", - "integrity": "sha512-BAkMFcAzl8as1G/hArkxOxq3G7pjUqQ3gzYbLL0/5zNkph70e+lCoxBGnm6AW1+/aiNeV4fnKqZ8m4GZewmH2w==", - "requires": {} - }, - "xdg-basedir": { - "version": "4.0.0", - "resolved": "https://registry.npmjs.org/xdg-basedir/-/xdg-basedir-4.0.0.tgz", - "integrity": "sha512-PSNhEJDejZYV7h50BohL09Er9VaIefr2LMAf3OEmpCkjOi34eYyQYAXUTjEQtZJTKcF0E2UKTh+osDLsgNim9Q==" + "integrity": "sha512-BAkMFcAzl8as1G/hArkxOxq3G7pjUqQ3gzYbLL0/5zNkph70e+lCoxBGnm6AW1+/aiNeV4fnKqZ8m4GZewmH2w==" }, "xml-name-validator": { "version": "3.0.0", diff --git a/spec/core_functions/color/complement.hrx b/spec/core_functions/color/complement.hrx index c64f1d8de0..8957e1d755 100644 --- a/spec/core_functions/color/complement.hrx +++ b/spec/core_functions/color/complement.hrx @@ -31,6 +31,11 @@ a { b: gray; } +<===> grayscale/gray/output-libsass.css +a { + b: gray; +} + <===> ================================================================================ <===> grayscale/white/input.scss @@ -41,6 +46,11 @@ a { b: white; } +<===> grayscale/white/output-libsass.css +a { + b: white; +} + <===> ================================================================================ <===> grayscale/black/input.scss @@ -51,6 +61,11 @@ a { b: black; } +<===> grayscale/black/output-libsass.css +a { + b: black; +} + <===> ================================================================================ <===> alpha/input.scss @@ -61,23 +76,73 @@ a { b: rgba(224, 64, 80, 0.7); } +<===> alpha/output-libsass.css +a { + b: rgba(224, 64, 80, 0.7); +} + <===> ================================================================================ -<===> named/input.scss -a {b: complement($color: red)} +<===> explicit_space/options.yml +:ignore_for: + - libsass -<===> named/output.css +<===> explicit_space/input.scss +a {b: complement(red, hwb)} + +<===> explicit_space/output.css a { b: aqua; } -<===> named/output-libsass.css +<===> +================================================================================ +<===> non_legacy/options.yml +:ignore_for: + - libsass + +<===> non_legacy/input.scss +a {b: complement(lab(54.3 80.8 69.9), lch)} + +<===> non_legacy/output.css a { - b: cyan; + b: lab(54.3% -80.8 -69.9); +} + +<===> +================================================================================ +<===> predefined/options.yml +:ignore_for: + - libsass + +<===> predefined/input.scss +a {b: complement(color(srgb-linear 0.6 0 0.6), hwb)} + +<===> predefined/output.css +a { + b: color(srgb-linear 0 0.6 0); } <===> ================================================================================ +<===> named/options.yml +:ignore_for: + - libsass + +<===> named/input.scss +a {b: complement($color: red, $space: hwb)} + +<===> named/output.css +a { + b: aqua; +} + +<===> +================================================================================ +<===> error/too_few_args/options.yml +:ignore_for: + - libsass + <===> error/too_few_args/input.scss a {b: complement()} @@ -93,42 +158,27 @@ Error: Missing argument $color. ' input.scss 1:7 root stylesheet -<===> error/too_few_args/error-libsass -Error: Function complement is missing argument $color. - on line 1 of input.scss ->> a {b: complement()} - - ------^ - <===> ================================================================================ <===> error/too_many_args/options.yml ---- -:todo: -- dart-sass +:ignore_for: + - libsass <===> error/too_many_args/input.scss -a {b: complement(red, 1)} +a {b: complement(red, lch, 1)} <===> error/too_many_args/error -Error: Only 1 argument allowed, but 2 were passed. +Error: Only 2 arguments allowed, but 3 were passed. ,--> input.scss -1 | a {b: complement(red, 1)} - | ^^^^^^^^^^^^^^^^^^ invocation +1 | a {b: complement(red, lch, 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^ invocation ' ,--> sass:color -1 | @function complement($color) { - | ================== declaration +1 | @function complement($color, $space: null) { + | ================================ declaration ' input.scss 1:7 root stylesheet -<===> error/too_many_args/error-libsass -Error: wrong number of arguments (2 for 1) for `complement' - on line 1:7 of input.scss ->> a {b: complement(red, 1)} - - ------^ - <===> ================================================================================ <===> error/type/input.scss @@ -149,3 +199,37 @@ Error: argument `$color` of `complement($color)` must be a color >> a {b: complement(1)} ------^ + +<===> +================================================================================ +<===> error/null_space/non_legacy/options.yml +:ignore_for: + - libsass + +<===> error/null_space/non_legacy/input.scss +a {b: complement(oklch(0.63 0.26 29.2))} + +<===> error/null_space/non_legacy/error +Error: $space: null is not a string. + , +1 | a {b: complement(oklch(0.63 0.26 29.2))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/space/non_polar_angle/options.yml +:ignore_for: + - libsass + +<===> error/space/non_polar_angle/input.scss +a {b: complement(red, xyz)} + +<===> error/space/non_polar_angle/error +Error: $space: Color space xyz doesn't have a hue channel. + , +1 | a {b: complement(red, xyz)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/mix.hrx b/spec/core_functions/color/mix.hrx deleted file mode 100644 index cb1e74bed9..0000000000 --- a/spec/core_functions/color/mix.hrx +++ /dev/null @@ -1,424 +0,0 @@ -<===> unweighted/min_and_max/input.scss -// Each channel becomes the average of 255 and 0, which is 128 = 0xAA. -a {b: mix(#ff00ff, #00ff00)} - -<===> unweighted/min_and_max/output.css -a { - b: gray; -} - -<===> -================================================================================ -<===> unweighted/identical/input.scss -// If two channels have the same values, they should be the same in the output. -a {b: mix(#123456, #123456)} - -<===> unweighted/identical/output.css -a { - b: #123456; -} - -<===> -================================================================================ -<===> unweighted/average/input.scss -// All channels should be averaged across the two colors. -a {b: mix(#91e16f, #0144bf)} - -<===> unweighted/average/output.css -a { - b: #499397; -} - -<===> -================================================================================ -<===> explicit_weight/even/input.scss -a {b: mix(#91e16f, #0144bf, 50%)} - -<===> explicit_weight/even/output.css -a { - b: #499397; -} - -<===> -================================================================================ -<===> explicit_weight/first/input.scss -a {b: mix(#91e16f, #0144bf, 100%)} - -<===> explicit_weight/first/output.css -a { - b: #91e16f; -} - -<===> -================================================================================ -<===> explicit_weight/last/input.scss -a {b: mix(#91e16f, #0144bf, 0%)} - -<===> explicit_weight/last/output.css -a { - b: #0144bf; -} - -<===> -================================================================================ -<===> explicit_weight/firstwards/input.scss -a {b: mix(#91e16f, #0144bf, 92%)} - -<===> explicit_weight/firstwards/output.css -a { - b: #85d475; -} - -<===> -================================================================================ -<===> explicit_weight/lastwards/input.scss -a {b: mix(#91e16f, #0144bf, 43%)} - -<===> explicit_weight/lastwards/output.css -a { - b: #3f889d; -} - -<===> -================================================================================ -<===> alpha/even/input.scss -a {b: mix(rgba(#91e16f, 0.3), rgba(#0144bf, 0.3))} - -<===> alpha/even/output.css -a { - b: rgba(73, 147, 151, 0.3); -} - -<===> -================================================================================ -<===> alpha/first/input.scss -a {b: mix(#91e16f, transparent)} - -<===> alpha/first/output.css -a { - b: rgba(145, 225, 111, 0.5); -} - -<===> -================================================================================ -<===> alpha/last/input.scss -a {b: mix(transparent, #0144bf)} - -<===> alpha/last/output.css -a { - b: rgba(1, 68, 191, 0.5); -} - -<===> -================================================================================ -<===> alpha/firstwards/input.scss -a {b: mix(rgba(#91e16f, 0.8), rgba(#0144bf, 0.3))} - -<===> alpha/firstwards/output.css -a { - b: rgba(109, 186, 131, 0.55); -} - -<===> -================================================================================ -<===> alpha/lastwards/input.scss -a {b: mix(rgba(#91e16f, 0.4), rgba(#0144bf, 0.9))} - -<===> alpha/lastwards/output.css -a { - b: rgba(37, 107, 171, 0.65); -} - -<===> -================================================================================ -<===> both_weights/transparent/first/input.scss -a {b: mix(transparent, #0144bf, 70%)} - -<===> both_weights/transparent/first/output.css -a { - b: rgba(1, 68, 191, 0.3); -} - -<===> -================================================================================ -<===> both_weights/transparent/last/input.scss -a {b: mix(#91e16f, transparent, 70%)} - -<===> both_weights/transparent/last/output.css -a { - b: rgba(145, 225, 111, 0.7); -} - -<===> -================================================================================ -<===> both_weights/weighted/first/input.scss -a {b: mix(rgba(#91e16f, 0.2), rgba(#0144bf, 0.7), 100%)} - -<===> both_weights/weighted/first/output.css -a { - b: rgba(145, 225, 111, 0.2); -} - -<===> -================================================================================ -<===> both_weights/weighted/last/input.scss -a {b: mix(rgba(#91e16f, 0.2), rgba(#0144bf, 0.7), 0%)} - -<===> both_weights/weighted/last/output.css -a { - b: rgba(1, 68, 191, 0.7); -} - -<===> -================================================================================ -<===> both_weights/mixed/firstwards/input.scss -a {b: mix(rgba(#91e16f, 0.8), rgba(#0144bf, 0.3), 63%)} - -<===> both_weights/mixed/firstwards/output.css -a { - b: rgba(121, 199, 124, 0.615); -} - -<===> -================================================================================ -<===> both_weights/mixed/lastwards/input.scss -a {b: mix(rgba(#91e16f, 0.2), rgba(#0144bf, 0.7), 42%)} - -<===> both_weights/mixed/lastwards/output.css -a { - b: rgba(29, 99, 175, 0.49); -} - -<===> -================================================================================ -<===> both_weights/contradiction/input.scss -// When we weight entirely towards a transparent color, the formula for -// computing the combined alpha would divide by zero, so we just return -// transparent as a special case. -a {b: mix(transparent, #0144bf, 100%)} - -<===> both_weights/contradiction/output.css -a { - b: rgba(0, 0, 0, 0); -} - -<===> -================================================================================ -<===> named/input.scss -a {b: mix($color1: #91e16f, $color2: #0144bf, $weight: 92%)} - -<===> named/output.css -a { - b: #85d475; -} - -<===> -================================================================================ -<===> units/weight/unitless/options.yml -:ignore_for: - - libsass - -<===> units/weight/unitless/input.scss -a {b: mix(#91e16f, #0144bf, 50)} - -<===> units/weight/unitless/output.css -a { - b: #499397; -} - -<===> units/weight/unitless/warning -DEPRECATION WARNING: $weight: Passing a number without unit % (50) is deprecated. - -To preserve current behavior: $weight * 1% - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: mix(#91e16f, #0144bf, 50)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> units/weight/unknown/options.yml -:ignore_for: - - libsass - -<===> units/weight/unknown/input.scss -a {b: mix(#91e16f, #0144bf, 50px)} - -<===> units/weight/unknown/output.css -a { - b: #499397; -} - -<===> units/weight/unknown/warning -DEPRECATION WARNING: $weight: Passing a number without unit % (50px) is deprecated. - -To preserve current behavior: calc($weight / 1px * 1%) - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: mix(#91e16f, #0144bf, 50px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/too_many_args/options.yml -:todo: - - dart-sass - -<===> error/too_many_args/input.scss -a {b: mix(red, blue, 100, 1)} - -<===> error/too_many_args/error -Error: Only 3 arguments allowed, but 4 were passed. - ,--> input.scss -1 | a {b: mix(red, blue, 100, 1)} - | ^^^^^^^^^^^^^^^^^^^^^^ invocation - ' - ,--> sass:color -1 | @function mix($color1, $color2, $weight: 50%) { - | =================================== declaration - ' - input.scss 1:7 root stylesheet - -<===> error/too_many_args/error-libsass -Error: wrong number of arguments (4 for 3) for `mix' - on line 1:7 of input.scss ->> a {b: mix(red, blue, 100, 1)} - - ------^ - -<===> -================================================================================ -<===> error/too_few_args/input.scss -a {b: mix(red)} - -<===> error/too_few_args/error -Error: Missing argument $color2. - ,--> input.scss -1 | a {b: mix(red)} - | ^^^^^^^^ invocation - ' - ,--> sass:color -1 | @function mix($color1, $color2, $weight: 50%, $method: null) { - | ================================================== declaration - ' - input.scss 1:7 root stylesheet - -<===> error/too_few_args/error-libsass -Error: Function mix is missing argument $color2. - on line 1 of input.scss ->> a {b: mix(red)} - - ------^ - -<===> -================================================================================ -<===> error/type/color1/input.scss -a {b: mix(1, blue)} - -<===> error/type/color1/error -Error: $color1: 1 is not a color. - , -1 | a {b: mix(1, blue)} - | ^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> error/type/color1/error-libsass -Error: argument `$color1` of `mix($color1, $color2, $weight: 50%)` must be a color - on line 1:7 of input.scss, in function `mix` - from line 1:7 of input.scss ->> a {b: mix(1, blue)} - - ------^ - -<===> -================================================================================ -<===> error/type/color2/input.scss -a {b: mix(red, 1)} - -<===> error/type/color2/error -Error: $color2: 1 is not a color. - , -1 | a {b: mix(red, 1)} - | ^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> error/type/color2/error-libsass -Error: argument `$color2` of `mix($color1, $color2, $weight: 50%)` must be a color - on line 1:7 of input.scss, in function `mix` - from line 1:7 of input.scss ->> a {b: mix(red, 1)} - - ------^ - -<===> -================================================================================ -<===> error/type/weight/input.scss -a {b: mix(red, blue, green)} - -<===> error/type/weight/error -Error: $weight: green is not a number. - , -1 | a {b: mix(red, blue, green)} - | ^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> error/type/weight/error-libsass -Error: argument `$weight` of `mix($color1, $color2, $weight: 50%)` must be a number - on line 1:7 of input.scss, in function `mix` - from line 1:7 of input.scss ->> a {b: mix(red, blue, green)} - - ------^ - -<===> -================================================================================ -<===> error/bounds/too_low/input.scss -a {b: mix(red, blue, -0.001%)} - -<===> error/bounds/too_low/error -Error: $weight: Expected -0.001% to be within 0% and 100%. - , -1 | a {b: mix(red, blue, -0.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> error/bounds/too_low/error-libsass -Error: argument `$weight` of `mix($color1, $color2, $weight: 50%)` must be between -0 and 100 - on line 1:7 of input.scss, in function `mix` - from line 1:7 of input.scss ->> a {b: mix(red, blue, -0.001)} - - ------^ - -<===> -================================================================================ -<===> error/bounds/too_high/input.scss -a {b: mix(red, blue, 100.001%)} - -<===> error/bounds/too_high/error -Error: $weight: Expected 100.001% to be within 0% and 100%. - , -1 | a {b: mix(red, blue, 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> error/bounds/too_high/error-libsass -Error: argument `$weight` of `mix($color1, $color2, $weight: 50%)` must be between -0 and 100 - on line 1:7 of input.scss, in function `mix` - from line 1:7 of input.scss ->> a {b: mix(red, blue, 100.001)} - - ------^ diff --git a/spec/core_functions/color/mix/alpha.hrx b/spec/core_functions/color/mix/alpha.hrx new file mode 100644 index 0000000000..a6e8469c5a --- /dev/null +++ b/spec/core_functions/color/mix/alpha.hrx @@ -0,0 +1,47 @@ +<===> even/input.scss +a {b: mix(rgba(#91e16f, 0.3), rgba(#0144bf, 0.3))} + +<===> even/output.css +a { + b: rgba(73, 147, 151, 0.3); +} + +<===> +================================================================================ +<===> first/input.scss +a {b: mix(#91e16f, transparent)} + +<===> first/output.css +a { + b: rgba(145, 225, 111, 0.5); +} + +<===> +================================================================================ +<===> last/input.scss +a {b: mix(transparent, #0144bf)} + +<===> last/output.css +a { + b: rgba(1, 68, 191, 0.5); +} + +<===> +================================================================================ +<===> firstwards/input.scss +a {b: mix(rgba(#91e16f, 0.8), rgba(#0144bf, 0.3))} + +<===> firstwards/output.css +a { + b: rgba(109, 186, 131, 0.55); +} + +<===> +================================================================================ +<===> lastwards/input.scss +a {b: mix(rgba(#91e16f, 0.4), rgba(#0144bf, 0.9))} + +<===> lastwards/output.css +a { + b: rgba(37, 107, 171, 0.65); +} diff --git a/spec/core_functions/color/mix/both_weights.hrx b/spec/core_functions/color/mix/both_weights.hrx new file mode 100644 index 0000000000..d48a37a6b6 --- /dev/null +++ b/spec/core_functions/color/mix/both_weights.hrx @@ -0,0 +1,70 @@ +<===> transparent/first/input.scss +a {b: mix(transparent, #0144bf, 70%)} + +<===> transparent/first/output.css +a { + b: rgba(1, 68, 191, 0.3); +} + +<===> +================================================================================ +<===> transparent/last/input.scss +a {b: mix(#91e16f, transparent, 70%)} + +<===> transparent/last/output.css +a { + b: rgba(145, 225, 111, 0.7); +} + +<===> +================================================================================ +<===> weighted/first/input.scss +a {b: mix(rgba(#91e16f, 0.2), rgba(#0144bf, 0.7), 100%)} + +<===> weighted/first/output.css +a { + b: rgba(145, 225, 111, 0.2); +} + +<===> +================================================================================ +<===> weighted/last/input.scss +a {b: mix(rgba(#91e16f, 0.2), rgba(#0144bf, 0.7), 0%)} + +<===> weighted/last/output.css +a { + b: rgba(1, 68, 191, 0.7); +} + +<===> +================================================================================ +<===> mixed/firstwards/input.scss +a {b: mix(rgba(#91e16f, 0.8), rgba(#0144bf, 0.3), 63%)} + +<===> mixed/firstwards/output.css +a { + b: rgba(121, 199, 124, 0.615); +} + +<===> +================================================================================ +<===> mixed/lastwards/input.scss +a {b: mix(rgba(#91e16f, 0.2), rgba(#0144bf, 0.7), 42%)} + +<===> mixed/lastwards/output.css +a { + b: rgba(29, 99, 175, 0.49); +} + +<===> +================================================================================ +<===> contradiction/input.scss +// When we weight entirely towards a transparent color, the formula for +// computing the combined alpha would divide by zero, so we just return +// transparent as a special case. +a {b: mix(transparent, #0144bf, 100%)} + +<===> contradiction/output.css +a { + b: rgba(0, 0, 0, 0); +} diff --git a/spec/core_functions/color/mix/error.hrx b/spec/core_functions/color/mix/error.hrx new file mode 100644 index 0000000000..07d8ccc6dc --- /dev/null +++ b/spec/core_functions/color/mix/error.hrx @@ -0,0 +1,416 @@ +<===> too_many_args/options.yml +:ignore_for: + - libsass + +<===> too_many_args/input.scss +a {b: mix(red, blue, 30%, lch, 1)} + +<===> too_many_args/error +Error: Only 4 arguments allowed, but 5 were passed. + ,--> input.scss +1 | a {b: mix(red, blue, 30%, lch, 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function mix($color1, $color2, $weight: 50%, $method: null) { + | ================================================== declaration + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/options.yml +:ignore_for: + - libsass + +<===> too_few_args/input.scss +a {b: mix(red)} + +<===> too_few_args/error +Error: Missing argument $color2. + ,--> input.scss +1 | a {b: mix(red)} + | ^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function mix($color1, $color2, $weight: 50%, $method: null) { + | ================================================== declaration + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> null_method/non_legacy/color1/options.yml +:ignore_for: + - libsass + +<===> null_method/non_legacy/color1/input.scss +a {b: mix(lch(20% -20 0), red)} + +<===> null_method/non_legacy/color1/error +Error: $color1: To use color.mix() with non-legacy color lch(20% -20 0deg), you must provide a $method. + , +1 | a {b: mix(lch(20% -20 0), red)} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> null_method/non_legacy/color2/options.yml +:ignore_for: + - libsass + +<===> null_method/non_legacy/color2/input.scss +a {b: mix(red, lch(20% -20 0))} + +<===> null_method/non_legacy/color2/error +Error: $color2: To use color.mix() with non-legacy color lch(20% -20 0deg), you must provide a $method. + , +1 | a {b: mix(red, lch(20% -20 0))} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> color_interpolation_method/options.yml +:ignore_for: + - libsass + +<===> color_interpolation_method/input.scss +a {b: mix(red, blue, $method: brighter)} + +<===> color_interpolation_method/error +Error: $method: Unknown color space "brighter". + , +1 | a {b: mix(red, blue, $method: brighter)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> interpolation/number/options.yml +:ignore_for: + - libsass + +<===> interpolation/number/input.scss +a {b: mix(red, blue, $method: hsl 1)} + +<===> interpolation/number/error +Error: $method: 1 is not a string. + , +1 | a {b: mix(red, blue, $method: hsl 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> interpolation_list/separator/options.yml +:ignore_for: + - libsass + +<===> interpolation_list/separator/input.scss +a {b: mix(red, blue, $method: hsl, longer hue)} + +<===> interpolation_list/separator/error +Error: Positional arguments must come before keyword arguments. + , +1 | a {b: mix(red, blue, $method: hsl, longer hue)} + | ^^^^^^^^^^ + ' + input.scss 1:36 root stylesheet + +<===> +================================================================================ +<===> interpolation_list/slash/options.yml +:ignore_for: + - libsass + +<===> interpolation_list/slash/input.scss +a {b: mix(red, blue, $method: hsl/longer/hue)} + +<===> interpolation_list/slash/error +Error: $method: Unknown color space "hsl/longer/hue". + , +1 | a {b: mix(red, blue, $method: hsl/longer/hue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> interpolation_list/quoted/options.yml +:ignore_for: + - libsass + +<===> interpolation_list/quoted/input.scss +a {b: mix(red, blue, $method: "hsl longer hue")} + +<===> interpolation_list/quoted/error +Error: $method: Expected "hsl longer hue" to be an unquoted string. + , +1 | a {b: mix(red, blue, $method: "hsl longer hue")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> invalid_method/options.yml +:ignore_for: + - libsass + +<===> invalid_method/input.scss +a {b: mix(red, blue, $method: hsl longer shade)} + +<===> invalid_method/error +Error: $method: Expected unquoted string "hue" at the end of (hsl longer shade), was shade. + , +1 | a {b: mix(red, blue, $method: hsl longer shade)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> invalid_space/options.yml +:ignore_for: + - libsass + +<===> invalid_space/input.scss +a {b: mix(red, blue, $method: display-p3 shorter hue)} + +<===> invalid_space/error +Error: $method: Color space display-p3 can't be used for interpolation. + , +1 | a {b: mix(red, blue, $method: display-p3 shorter hue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> invalid_space_rgb/options.yml +:ignore_for: + - libsass + +<===> invalid_space_rgb/input.scss +a {b: mix(red, blue, $method: rgb)} + +<===> invalid_space_rgb/error +Error: $method: Color space rgb can't be used for interpolation. + , +1 | a {b: mix(red, blue, $method: rgb)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> extra_character_end/options.yml +:ignore_for: + - libsass + +<===> extra_character_end/input.scss +a {b: mix(red, blue, $method: hsl longer hue.)} + +<===> extra_character_end/error +Error: Expected identifier. + , +1 | a {b: mix(red, blue, $method: hsl longer hue.)} + | ^ + ' + input.scss 1:46 root stylesheet + +<===> +================================================================================ +<===> extra_character_start/options.yml +:ignore_for: + - libsass + +<===> extra_character_start/input.scss +a {b: mix(red, blue, $method: ,hsl longer hue)} + +<===> extra_character_start/error +Error: Expected expression. + , +1 | a {b: mix(red, blue, $method: ,hsl longer hue)} + | ^ + ' + input.scss 1:31 root stylesheet + +<===> +================================================================================ +<===> unknown_interpolation/options.yml +:ignore_for: + - libsass + +<===> unknown_interpolation/input.scss +a {b: mix(red, blue, $method: lch longerhue)} + +<===> unknown_interpolation/error +Error: $method: Unknown hue interpolation method longerhue. + , +1 | a {b: mix(red, blue, $method: lch longerhue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> rectangular_space_with_method/options.yml +:ignore_for: + - libsass + +<===> rectangular_space_with_method/input.scss +a {b: mix(red, blue, $method: srgb longer hue)} + +<===> rectangular_space_with_method/error +Error: $method: Hue interpolation method "HueInterpolationMethod.longer hue" may not be set for rectangular color space srgb. + , +1 | a {b: mix(red, blue, $method: srgb longer hue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> missing_hue_string/options.yml +:ignore_for: + - libsass + +<===> missing_hue_string/input.scss +a {b: mix(red, blue, $method: lch decreasing)} + +<===> missing_hue_string/error +Error: $method: Expected unquoted string "hue" after (lch decreasing). + , +1 | a {b: mix(red, blue, $method: lch decreasing)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> parentheses/options.yml +:ignore_for: + - libsass + +<===> parentheses/input.scss +a {b: mix(red, blue, $method: lch (decreasing hue))} + +<===> parentheses/error +Error: $method: (decreasing hue) is not a string. + , +1 | a {b: mix(red, blue, $method: lch (decreasing hue))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/color1/input.scss +a {b: mix(1, blue)} + +<===> type/color1/error +Error: $color1: 1 is not a color. + , +1 | a {b: mix(1, blue)} + | ^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> type/color1/error-libsass +Error: argument `$color1` of `mix($color1, $color2, $weight: 50%)` must be a color + on line 1:7 of input.scss, in function `mix` + from line 1:7 of input.scss +>> a {b: mix(1, blue)} + + ------^ + +<===> +================================================================================ +<===> type/color2/input.scss +a {b: mix(red, 1)} + +<===> type/color2/error +Error: $color2: 1 is not a color. + , +1 | a {b: mix(red, 1)} + | ^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> type/color2/error-libsass +Error: argument `$color2` of `mix($color1, $color2, $weight: 50%)` must be a color + on line 1:7 of input.scss, in function `mix` + from line 1:7 of input.scss +>> a {b: mix(red, 1)} + + ------^ + +<===> +================================================================================ +<===> type/weight/input.scss +a {b: mix(red, blue, green)} + +<===> type/weight/error +Error: $weight: green is not a number. + , +1 | a {b: mix(red, blue, green)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> type/weight/error-libsass +Error: argument `$weight` of `mix($color1, $color2, $weight: 50%)` must be a number + on line 1:7 of input.scss, in function `mix` + from line 1:7 of input.scss +>> a {b: mix(red, blue, green)} + + ------^ + +<===> +================================================================================ +<===> bounds/too_low/input.scss +a {b: mix(red, blue, -0.001%)} + +<===> bounds/too_low/error +Error: $weight: Expected -0.001% to be within 0% and 100%. + , +1 | a {b: mix(red, blue, -0.001%)} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> bounds/too_low/error-libsass +Error: argument `$weight` of `mix($color1, $color2, $weight: 50%)` must be between -0 and 100 + on line 1:7 of input.scss, in function `mix` + from line 1:7 of input.scss +>> a {b: mix(red, blue, -0.001)} + + ------^ + +<===> +================================================================================ +<===> bounds/too_high/input.scss +a {b: mix(red, blue, 100.001%)} + +<===> bounds/too_high/error +Error: $weight: Expected 100.001% to be within 0% and 100%. + , +1 | a {b: mix(red, blue, 100.001%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> bounds/too_high/error-libsass +Error: argument `$weight` of `mix($color1, $color2, $weight: 50%)` must be between -0 and 100 + on line 1:7 of input.scss, in function `mix` + from line 1:7 of input.scss +>> a {b: mix(red, blue, 100.001)} + + ------^ diff --git a/spec/core_functions/color/mix/explicit_method.hrx b/spec/core_functions/color/mix/explicit_method.hrx new file mode 100644 index 0000000000..2eb87f3cf7 --- /dev/null +++ b/spec/core_functions/color/mix/explicit_method.hrx @@ -0,0 +1,33 @@ +<===> options.yml +:ignore_for: + - libsass + +<===> +================================================================================ +<===> srgb/input.scss +a {b: mix(red, green, $method: xyz)} + +<===> srgb/output.css +a { + b: rgb(187.5160306784, 92.3735312967, 0); +} + +<===> +================================================================================ +<===> non_srgb/input.scss +a {b: mix(lab(54.3 80.8 69.9), lch(46.3 68 134), $method: oklch)} + +<===> non_srgb/output.css +a { + b: lab(50.3820989016% 23.739480318 159.7498257827); +} + +<===> +================================================================================ +<===> weighted/input.scss +a {b: mix(lab(54.3 80.8 69.9), lch(46.3 68 134), 30%, oklch)} + +<===> weighted/output.css +a { + b: lab(48.946809662% -7.9262399011 131.5295913021); +} diff --git a/spec/core_functions/color/mix/explicit_weight.hrx b/spec/core_functions/color/mix/explicit_weight.hrx new file mode 100644 index 0000000000..ed3a386480 --- /dev/null +++ b/spec/core_functions/color/mix/explicit_weight.hrx @@ -0,0 +1,47 @@ +<===> even/input.scss +a {b: mix(#91e16f, #0144bf, 50%)} + +<===> even/output.css +a { + b: #499397; +} + +<===> +================================================================================ +<===> first/input.scss +a {b: mix(#91e16f, #0144bf, 100%)} + +<===> first/output.css +a { + b: #91e16f; +} + +<===> +================================================================================ +<===> last/input.scss +a {b: mix(#91e16f, #0144bf, 0%)} + +<===> last/output.css +a { + b: #0144bf; +} + +<===> +================================================================================ +<===> firstwards/input.scss +a {b: mix(#91e16f, #0144bf, 92%)} + +<===> firstwards/output.css +a { + b: #85d475; +} + +<===> +================================================================================ +<===> lastwards/input.scss +a {b: mix(#91e16f, #0144bf, 43%)} + +<===> lastwards/output.css +a { + b: #3f889d; +} diff --git a/spec/core_functions/color/mix/hue_interpolation.hrx b/spec/core_functions/color/mix/hue_interpolation.hrx new file mode 100644 index 0000000000..c39bdafad7 --- /dev/null +++ b/spec/core_functions/color/mix/hue_interpolation.hrx @@ -0,0 +1,33 @@ +<===> options.yml +:ignore_for: + - libsass + +<===> +================================================================================ +<===> longer/input.scss +a {b: mix(red, green, $method: hsl longer hue)} + +<===> longer/output.css +a { + b: rgb(0, 0, 191.5); +} + +<===> +================================================================================ +<===> specified/input.scss +a {b: mix(red, green, $method: lch specified hue)} + +<===> specified/output.css +a { + b: rgb(145.2072868242, 115.9916273156, -48.1699603699); +} + +<===> +================================================================================ +<===> increasing/weighted/input.scss +a {b: mix(red, green, 20%, lch increasing hue)} + +<===> increasing/weighted/output.css +a { + b: rgb(75.3627215695, 127.0940173535, -38.3383580918); +} diff --git a/spec/core_functions/color/mix/mixed_spaces.hrx b/spec/core_functions/color/mix/mixed_spaces.hrx new file mode 100644 index 0000000000..4fff0860e9 --- /dev/null +++ b/spec/core_functions/color/mix/mixed_spaces.hrx @@ -0,0 +1,11 @@ +<===> options.yml +:ignore_for: + - libsass + +<===> input.scss +a {b: mix(hsl(0 100% 50%), green, $method: lch)} + +<===> output.css +a { + b: hsl(49.4586711601deg, 100%, 27.8089044382%); +} diff --git a/spec/core_functions/color/mix/named.hrx b/spec/core_functions/color/mix/named.hrx new file mode 100644 index 0000000000..f59d17a28f --- /dev/null +++ b/spec/core_functions/color/mix/named.hrx @@ -0,0 +1,23 @@ +<===> options.yml +:ignore_for: + - libsass + +<===> +================================================================================ +<===> polar_space/input.scss +a {b: mix($color1: #91e16f, $color2: #0144bf, $weight: 92%, $method: hsl decreasing hue)} + +<===> polar_space/output.css +a { + b: rgb(177.749777646, 225.4953896552, 98.9846103448); +} + +<===> +================================================================================ +<===> rectangular_space/input.scss +a {b: mix($color1: #91e16f, $color2: #0144bf, $weight: 92%, $method: lab)} + +<===> rectangular_space/output.css +a { + b: rgb(141.3483384924, 211.5499489073, 120.4340844852); +} diff --git a/spec/core_functions/color/mix/predefined.hrx b/spec/core_functions/color/mix/predefined.hrx new file mode 100644 index 0000000000..7456d48062 --- /dev/null +++ b/spec/core_functions/color/mix/predefined.hrx @@ -0,0 +1,43 @@ +<===> options.yml +:ignore_for: + - libsass + +<===> +================================================================================ +<===> rgb/input.scss +a {b: mix(color(display-p3 1 0 0), color(display-p3 0 1 0), 20%, oklch)} + +<===> rgb/output.css +a { + b: color(display-p3 0.6684751745 0.8535262883 -0.4281891831); +} + +<===> +================================================================================ +<===> rgb_explicit_method/input.scss +a {b: mix(color(display-p3 1 0 0), color(display-p3 0 1 0), 60%, $method: hsl)} + +<===> rgb_explicit_method/output.css +a { + b: color(display-p3 0.9849707148 0.9141322646 0.3079881122); +} + +<===> +================================================================================ +<===> xyz/input.scss +a {b: mix(color(xyz 0.15 0.24 0), color(xyz 1 .2 0), 65%, lch)} + +<===> xyz/output.css +a { + b: color(xyz 0.2607187352 0.230899759 -0.0359437687); +} + +<===> +================================================================================ +<===> xyz_explicit_method/input.scss +a {b: mix(color(xyz-d50 0.15 0.24 0), color(xyz-d65 1 .2 0), $method: hwb)} + +<===> xyz_explicit_method/output.css +a { + b: color(xyz-d50 0.3464867621 0.2923393699 0.0410088495); +} diff --git a/spec/core_functions/color/mix/units.hrx b/spec/core_functions/color/mix/units.hrx new file mode 100644 index 0000000000..7cde0f7b17 --- /dev/null +++ b/spec/core_functions/color/mix/units.hrx @@ -0,0 +1,51 @@ +<===> weight/unitless/options.yml +:ignore_for: + - libsass + +<===> weight/unitless/input.scss +a {b: mix(#91e16f, #0144bf, 50)} + +<===> weight/unitless/output.css +a { + b: #499397; +} + +<===> weight/unitless/warning +DEPRECATION WARNING: $weight: Passing a number without unit % (50) is deprecated. + +To preserve current behavior: $weight * 1% + +More info: https://sass-lang.com/d/function-units + + , +1 | a {b: mix(#91e16f, #0144bf, 50)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> weight/unknown/options.yml +:ignore_for: + - libsass + +<===> weight/unknown/input.scss +a {b: mix(#91e16f, #0144bf, 50px)} + +<===> weight/unknown/output.css +a { + b: #499397; +} + +<===> weight/unknown/warning +DEPRECATION WARNING: $weight: Passing a number without unit % (50px) is deprecated. + +To preserve current behavior: calc($weight / 1px * 1%) + +More info: https://sass-lang.com/d/function-units + + , +1 | a {b: mix(#91e16f, #0144bf, 50px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/mix/unweighted.hrx b/spec/core_functions/color/mix/unweighted.hrx new file mode 100644 index 0000000000..996ea22aeb --- /dev/null +++ b/spec/core_functions/color/mix/unweighted.hrx @@ -0,0 +1,30 @@ +<===> min_and_max/input.scss +// Each channel becomes the average of 255 and 0, which is 128 = 0xAA. +a {b: mix(#ff00ff, #00ff00)} + +<===> min_and_max/output.css +a { + b: gray; +} + +<===> +================================================================================ +<===> identical/input.scss +// If two channels have the same values, they should be the same in the output. +a {b: mix(#123456, #123456)} + +<===> identical/output.css +a { + b: #123456; +} + +<===> +================================================================================ +<===> average/input.scss +// All channels should be averaged across the two colors. +a {b: mix(#91e16f, #0144bf)} + +<===> average/output.css +a { + b: #499397; +} From 8c3ef6f1c197d35f4e2f6052e7232857d7c59407 Mon Sep 17 00:00:00 2001 From: Sondra Date: Tue, 31 Jan 2023 14:04:59 -0700 Subject: [PATCH 10/45] Add Tests for color.is-in-gamut() (#1866) Co-authored-by: dvdherron Co-authored-by: Natalie Weizenbaum --- spec/core_functions/color/is_in_gamut.hrx | 377 ++++++++++++++++++++++ 1 file changed, 377 insertions(+) create mode 100644 spec/core_functions/color/is_in_gamut.hrx diff --git a/spec/core_functions/color/is_in_gamut.hrx b/spec/core_functions/color/is_in_gamut.hrx new file mode 100644 index 0000000000..c572e479f8 --- /dev/null +++ b/spec/core_functions/color/is_in_gamut.hrx @@ -0,0 +1,377 @@ +<===> options.yml +--- +:ignore_for: +- libsass + +<===> +================================================================================ +<===> rgb/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(rgb(0 300 0))} + +<===> rgb/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> rgba/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(rgba(-1 122 180 / 0.4))} + +<===> rgba/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hwb/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(hwb(0 300% 0%))} + +<===> hwb/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hsl/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(hsl(0 0% -1%))} + +<===> hsl/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> srgb/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(srgb 0 0 1.5))} + +<===> srgb/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> srgb-linear/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(srgb-linear -1 0 0))} + +<===> srgb-linear/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> display-p3/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(display-p3 0 2 0))} + +<===> display-p3/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> a98-rgb/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(a98-rgb 0 1 -1))} + +<===> a98-rgb/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> prophoto-rgb/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(prophoto-rgb 2 0 0))} + +<===> prophoto-rgb/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> rec2020/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(rec2020 0.979780 -1 0.00579))} + +<===> rec2020/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> xyz/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(xyz 0.0426 0.0442 0.0364))} + +<===> xyz/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> xyz-d50/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(xyz-d50 0.2005 0.14089 0.4472))} + +<===> xyz-d50/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> xyz-d65/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(xyz-d65 0.21661 0.14602 0.59452))} + +<===> xyz-d65/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> lab/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(lab(5 110 115))} + +<===> lab/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> lch/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(lch(90.6 52.8 197))} + +<===> lch/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> oklab/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(oklab(0.44027 0.08818 -0.13386))} + +<===> oklab/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> oklch/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(oklch(70% 0.1 200))} + +<===> oklch/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hex/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(#f2ece4)} + +<===> hex/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> color_keyword/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(midnightblue)} + +<===> color_keyword/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> named/input.scss +@use "sass:color"; +a {b: color.is-in-gamut($color: color(display-p3 1 1 0), $space: srgb)} + +<===> named/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> space/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(display-p3 1 1 0), oklch)} + +<===> space/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> wide_narrow/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(color(display-p3 1 1 0), hwb)} + +<===> wide_narrow/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> narrow_wide/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(hsl(50 40% 30%), oklab)} + +<===> narrow_wide/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> oklab_lch/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(oklab(0.44027 0.08818 -0.13386), lch)} + +<===> oklab_lch/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> error/too_few_args/input.scss +@use "sass:color"; +a {b: color.is-in-gamut()} + +<===> error/too_few_args/error +Error: Missing argument $color. + ,--> input.scss +2 | a {b: color.is-in-gamut()} + | ^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function is-in-gamut($color, $space: null) { + | ================================= declaration + ' + input.scss 2:7 root stylesheet + +<===> error/too_few_args/error + +<===> +================================================================================ +<===> error/too_many_args/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(rgb(0 255 0), hwb, c)} + +<===> error/too_many_args/error +Error: Only 2 arguments allowed, but 3 were passed. + ,--> input.scss +2 | a {b: color.is-in-gamut(rgb(0 255 0), hwb, c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function is-in-gamut($color, $space: null) { + | ================================= declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/type/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(1)} + +<===> error/type/error +Error: $color: 1 is not a color. + , +2 | a {b: color.is-in-gamut(1)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/space_unknown/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(rgb(0 255 0), c)} + +<===> error/space_unknown/error +Error: $space: Unknown color space "c". + , +2 | a {b: color.is-in-gamut(rgb(0 255 0), c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/invalid_character_start/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(rgb(0 255 0), .hsl)} + +<===> error/invalid_character_start/error +Error: Expected digit. + , +2 | a {b: color.is-in-gamut(rgb(0 255 0), .hsl)} + | ^ + ' + input.scss 2:40 root stylesheet + +<===> +================================================================================ +<===> error/invalid_character_end/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(rgb(0 255 0), hsl.)} + +<===> error/invalid_character_end/error +Error: Expected identifier. + , +2 | a {b: color.is-in-gamut(rgb(0 255 0), hsl.)} + | ^ + ' + input.scss 2:43 root stylesheet + +<===> +================================================================================ +<===> error/quoted/input.scss +@use "sass:color"; +a {b: color.is-in-gamut(rgb(0 255 0), "hsl")} + +<===> error/quoted/error +Error: $space: Expected "hsl" to be an unquoted string. + , +2 | a {b: color.is-in-gamut(rgb(0 255 0), "hsl")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + From a0573aaf55d909886ad2e7ba7e828882728fbbcf Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Mon, 20 Mar 2023 18:23:36 -0700 Subject: [PATCH 11/45] Update specs for sass/sass#3497 --- .../color/hsl/three_args/units.hrx | 2 +- .../color/hsl/three_args/w3c/blue_to_red.hrx | 2 +- .../color/hsl/three_args/w3c/hue.hrx | 36 ++++++++-------- spec/core_functions/color/mix/error.hrx | 41 ++++++------------- .../color/mix/explicit_method.hrx | 12 ++++++ .../color/mix/hue_interpolation.hrx | 10 ----- 6 files changed, 45 insertions(+), 58 deletions(-) diff --git a/spec/core_functions/color/hsl/three_args/units.hrx b/spec/core_functions/color/hsl/three_args/units.hrx index 0ce6017e58..0e5cbf22b0 100644 --- a/spec/core_functions/color/hsl/three_args/units.hrx +++ b/spec/core_functions/color/hsl/three_args/units.hrx @@ -70,7 +70,7 @@ a {b: hsl(60rad, 100%, 50%)} <===> hue/angle/output.css a { - b: hsl(3437.7467707849deg, 100%, 50%); + b: hsl(197.7467707849deg, 100%, 50%); } <===> hue/angle/output-libsass.css diff --git a/spec/core_functions/color/hsl/three_args/w3c/blue_to_red.hrx b/spec/core_functions/color/hsl/three_args/w3c/blue_to_red.hrx index 39018a3f07..42d72741e6 100644 --- a/spec/core_functions/color/hsl/three_args/w3c/blue_to_red.hrx +++ b/spec/core_functions/color/hsl/three_args/w3c/blue_to_red.hrx @@ -25,7 +25,7 @@ a { step-8: hsl(324deg, 100%, 50%); step-9: hsl(336deg, 100%, 50%); step-10: hsl(348deg, 100%, 50%); - step-11: hsl(360deg, 100%, 50%); + step-11: hsl(0deg, 100%, 50%); } <===> output-libsass.css diff --git a/spec/core_functions/color/hsl/three_args/w3c/hue.hrx b/spec/core_functions/color/hsl/three_args/w3c/hue.hrx index 0133d16d1e..7340195e62 100644 --- a/spec/core_functions/color/hsl/three_args/w3c/hue.hrx +++ b/spec/core_functions/color/hsl/three_args/w3c/hue.hrx @@ -17,44 +17,44 @@ <===> output.css red { hue-0: hsl(0deg, 100%, 50%); - hue--360: hsl(-360deg, 100%, 50%); - hue-360: hsl(360deg, 100%, 50%); - hue-6120: hsl(6120deg, 100%, 50%); + hue--360: hsl(0deg, 100%, 50%); + hue-360: hsl(0deg, 100%, 50%); + hue-6120: hsl(0deg, 100%, 50%); } yellow { hue-60: hsl(60deg, 100%, 50%); - hue--300: hsl(-300deg, 100%, 50%); - hue-420: hsl(420deg, 100%, 50%); - hue--9660: hsl(-9660deg, 100%, 50%); + hue--300: hsl(60deg, 100%, 50%); + hue-420: hsl(60deg, 100%, 50%); + hue--9660: hsl(60deg, 100%, 50%); } green { hue-120: hsl(120deg, 100%, 50%); - hue--240: hsl(-240deg, 100%, 50%); - hue-480: hsl(480deg, 100%, 50%); - hue-99840: hsl(99840deg, 100%, 50%); + hue--240: hsl(120deg, 100%, 50%); + hue-480: hsl(120deg, 100%, 50%); + hue-99840: hsl(120deg, 100%, 50%); } cyan { hue-180: hsl(180deg, 100%, 50%); - hue--180: hsl(-180deg, 100%, 50%); - hue-540: hsl(540deg, 100%, 50%); - hue--900: hsl(-900deg, 100%, 50%); + hue--180: hsl(180deg, 100%, 50%); + hue-540: hsl(180deg, 100%, 50%); + hue--900: hsl(180deg, 100%, 50%); } blue { hue-240: hsl(240deg, 100%, 50%); - hue--120: hsl(-120deg, 100%, 50%); - hue-600: hsl(600deg, 100%, 50%); - hue--104880: hsl(-104880deg, 100%, 50%); + hue--120: hsl(240deg, 100%, 50%); + hue-600: hsl(240deg, 100%, 50%); + hue--104880: hsl(240deg, 100%, 50%); } purple { hue-300: hsl(300deg, 100%, 50%); - hue--60: hsl(-60deg, 100%, 50%); - hue-660: hsl(660deg, 100%, 50%); - hue-2820: hsl(2820deg, 100%, 50%); + hue--60: hsl(300deg, 100%, 50%); + hue-660: hsl(300deg, 100%, 50%); + hue-2820: hsl(300deg, 100%, 50%); } <===> output-libsass.css diff --git a/spec/core_functions/color/mix/error.hrx b/spec/core_functions/color/mix/error.hrx index 07d8ccc6dc..5dd3bf81a6 100644 --- a/spec/core_functions/color/mix/error.hrx +++ b/spec/core_functions/color/mix/error.hrx @@ -159,14 +159,14 @@ Error: $method: Expected "hsl longer hue" to be an unquoted string. <===> ================================================================================ -<===> invalid_method/options.yml +<===> invalid_method/wrong_hue_keyword/options.yml :ignore_for: - libsass -<===> invalid_method/input.scss +<===> invalid_method/wrong_hue_keyword/input.scss a {b: mix(red, blue, $method: hsl longer shade)} -<===> invalid_method/error +<===> invalid_method/wrong_hue_keyword/error Error: $method: Expected unquoted string "hue" at the end of (hsl longer shade), was shade. , 1 | a {b: mix(red, blue, $method: hsl longer shade)} @@ -176,37 +176,22 @@ Error: $method: Expected unquoted string "hue" at the end of (hsl longer shade), <===> ================================================================================ -<===> invalid_space/options.yml +<===> invalid_method/unsupported/options.yml :ignore_for: - libsass -<===> invalid_space/input.scss -a {b: mix(red, blue, $method: display-p3 shorter hue)} +<===> invalid_method/unsupported/input.scss +// "specified" was a method in an earlier draft of CSS Colors 4, but it was +// dropped because it required implementations to lazily normalize hues. +a {b: mix(red, blue, $method: hsl specified hue)} -<===> invalid_space/error -Error: $method: Color space display-p3 can't be used for interpolation. +<===> invalid_method/unsupported/error +Error: $method: Unknown hue interpolation method specified. , -1 | a {b: mix(red, blue, $method: display-p3 shorter hue)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ +3 | a {b: mix(red, blue, $method: hsl specified hue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> invalid_space_rgb/options.yml -:ignore_for: - - libsass - -<===> invalid_space_rgb/input.scss -a {b: mix(red, blue, $method: rgb)} - -<===> invalid_space_rgb/error -Error: $method: Color space rgb can't be used for interpolation. - , -1 | a {b: mix(red, blue, $method: rgb)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet + input.scss 3:7 root stylesheet <===> ================================================================================ diff --git a/spec/core_functions/color/mix/explicit_method.hrx b/spec/core_functions/color/mix/explicit_method.hrx index 2eb87f3cf7..d2c70c8898 100644 --- a/spec/core_functions/color/mix/explicit_method.hrx +++ b/spec/core_functions/color/mix/explicit_method.hrx @@ -22,6 +22,18 @@ a { b: lab(50.3820989016% 23.739480318 159.7498257827); } +<===> +================================================================================ +<===> previously_invalid/input.scss +// An earlier draft of CSS Colors 4 didn't allow some spaces because they were +// redundant with others, but they should be allowed now. +a {b: mix(lab(54.3 80.8 69.9), lch(46.3 68 134), $method: display-p3)} + +<===> previously_invalid/output.css +a { + b: lab(43.9078099681% 26.0060363023 48.9943374049); +} + <===> ================================================================================ <===> weighted/input.scss diff --git a/spec/core_functions/color/mix/hue_interpolation.hrx b/spec/core_functions/color/mix/hue_interpolation.hrx index c39bdafad7..b7b74beb16 100644 --- a/spec/core_functions/color/mix/hue_interpolation.hrx +++ b/spec/core_functions/color/mix/hue_interpolation.hrx @@ -12,16 +12,6 @@ a { b: rgb(0, 0, 191.5); } -<===> -================================================================================ -<===> specified/input.scss -a {b: mix(red, green, $method: lch specified hue)} - -<===> specified/output.css -a { - b: rgb(145.2072868242, 115.9916273156, -48.1699603699); -} - <===> ================================================================================ <===> increasing/weighted/input.scss From 8d48c8a8abb559dbe53c92b141521393d5108565 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Tue, 21 Mar 2023 15:00:54 -0700 Subject: [PATCH 12/45] Clone linked versions of the embedded compiler and protocol --- .github/workflows/ci.yml | 13 ++++++++++++- 1 file changed, 12 insertions(+), 1 deletion(-) diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 01a063f80b..8085ea4fea 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -180,13 +180,24 @@ jobs: version: ${{ env.PROTOC_VERSION }} repo-token: '${{ github.token }}' + # Clone linked versions of Dart Sass Embedded and the Embedded Protocol so + # that they match the current feature branch. + - name: Dart Sass Embedded | Checkout + uses: sass/clone-linked-repo@v1 + with: {repo: sass/dart-sass-embedded, path: dart-sass-embedded} + - name: Embedded Protocol | Checkout + uses: sass/clone-linked-repo@v1 + with: {repo: sass/embedded-protocol, path: embedded-protocol} + - name: Node.js Embedded Host | Checkout uses: sass/clone-linked-repo@v1 with: {repo: sass/embedded-host-node, path: embedded-host-node} - name: Node.js Embedded Host | Install run: | npm install - npm run init + npm run init -- \ + --compiler-path=../dart-sass-embedded \ + --protocol-path=../embedded-protocol npm run compile working-directory: embedded-host-node From acaa8b388766b8101c779085cc688d0570874a0d Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Wed, 2 Aug 2023 15:02:51 -0700 Subject: [PATCH 13/45] it.skip -> xit for Jasmine compatibility --- js-api-spec/value/color.test.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/js-api-spec/value/color.test.ts b/js-api-spec/value/color.test.ts index 5250056a86..b0678aea05 100644 --- a/js-api-spec/value/color.test.ts +++ b/js-api-spec/value/color.test.ts @@ -71,7 +71,7 @@ describe('SassColor', () => { }); // TODO(#1828): Update these expectations - it.skip('disallows invalid values', () => { + xit('disallows invalid values', () => { expect(() => rgb(-1, 0, 0, 0)).toThrow(); expect(() => rgb(0, -1, 0, 0)).toThrow(); expect(() => rgb(0, 0, -1, 0)).toThrow(); @@ -83,7 +83,7 @@ describe('SassColor', () => { }); // TODO(#1828): Update these expectations - it.skip('rounds channels to the nearest integer', () => { + xit('rounds channels to the nearest integer', () => { expect(rgb(0.1, 50.4, 90.3)).toEqualWithHash(rgb(0, 50, 90)); expect(rgb(-0.1, 50.5, 90.7)).toEqualWithHash(rgb(0, 51, 91)); }); @@ -193,7 +193,7 @@ describe('SassColor', () => { }); // TODO(#1828): Update these expectations - it.skip('equals the same color', () => { + xit('equals the same color', () => { expect(color).toEqualWithHash(rgb(62, 152, 62)); expect(color).toEqualWithHash(hsl(120, 42, 42)); expect(color).toEqualWithHash( @@ -242,7 +242,7 @@ describe('SassColor', () => { }); // TODO(#1828): Update these expectations - it.skip('equals the same color', () => { + xit('equals the same color', () => { expect(color).toEqualWithHash(rgb(107, 148, 107)); expect(color).toEqualWithHash(hsl(120, 16.078431372549026, 50)); expect(color).toEqualWithHash( @@ -287,7 +287,7 @@ describe('SassColor', () => { }); // TODO(#1828): Update these expectations - it.skip('disallows invalid values', () => { + xit('disallows invalid values', () => { expect(() => color.change({red: -1})).toThrow(); expect(() => color.change({red: 256})).toThrow(); expect(() => color.change({green: -1})).toThrow(); @@ -299,7 +299,7 @@ describe('SassColor', () => { }); // TODO(#1828): Update these expectations - it.skip('rounds channels to the nearest integer', () => { + xit('rounds channels to the nearest integer', () => { expect( color.change({red: 0.1, green: 50.4, blue: 90.3}) ).toEqualWithHash(rgb(0, 50, 90)); From b03c91eebb8bbc8281eab9e8d808b9668d8ce5c1 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Thu, 28 Sep 2023 11:08:48 -0700 Subject: [PATCH 14/45] [Color 4] Add tests for `lab()` (#1928) --- .../color/hsl/error/one_arg.hrx | 4 +- spec/core_functions/color/lab/_utils.scss | 27 ++ spec/core_functions/color/lab/alpha.hrx | 145 ++++++ spec/core_functions/color/lab/error.hrx | 259 +++++++++++ spec/core_functions/color/lab/no_alpha.hrx | 189 ++++++++ spec/core_functions/color/lab/options.yml | 3 + .../color/lab/special_functions/alpha.hrx | 430 ++++++++++++++++++ .../color/lab/special_functions/no_alpha.hrx | 280 ++++++++++++ .../lab/special_functions/slash_list.hrx | 36 ++ .../color/rgb/error/one_arg.hrx | 4 +- 10 files changed, 1373 insertions(+), 4 deletions(-) create mode 100644 spec/core_functions/color/lab/_utils.scss create mode 100644 spec/core_functions/color/lab/alpha.hrx create mode 100644 spec/core_functions/color/lab/error.hrx create mode 100644 spec/core_functions/color/lab/no_alpha.hrx create mode 100644 spec/core_functions/color/lab/options.yml create mode 100644 spec/core_functions/color/lab/special_functions/alpha.hrx create mode 100644 spec/core_functions/color/lab/special_functions/no_alpha.hrx create mode 100644 spec/core_functions/color/lab/special_functions/slash_list.hrx diff --git a/spec/core_functions/color/hsl/error/one_arg.hrx b/spec/core_functions/color/hsl/error/one_arg.hrx index f34eb43259..b603b431dd 100644 --- a/spec/core_functions/color/hsl/error/one_arg.hrx +++ b/spec/core_functions/color/hsl/error/one_arg.hrx @@ -159,7 +159,7 @@ Error: $channels: Expected lightness "var(--foo) / 0.4" to be a number. a {b: hsl(append((), 0 100% 100%, $separator: slash))} <===> slash_list/too_few_elements/error -Error: Only 2 slash-separated elements allowed, but 1 was passed. +Error: $channels: Only 2 slash-separated elements allowed, but 1 was passed. , 1 | a {b: hsl(append((), 0 100% 100%, $separator: slash))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -173,7 +173,7 @@ Error: Only 2 slash-separated elements allowed, but 1 was passed. a {b: hsl(list.slash(0 100% 100%, 0.4, 1))} <===> slash_list/too_many_elements/error -Error: Only 2 slash-separated elements allowed, but 3 were passed. +Error: $channels: Only 2 slash-separated elements allowed, but 3 were passed. , 2 | a {b: hsl(list.slash(0 100% 100%, 0.4, 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/lab/_utils.scss b/spec/core_functions/color/lab/_utils.scss new file mode 100644 index 0000000000..106fe41df4 --- /dev/null +++ b/spec/core_functions/color/lab/_utils.scss @@ -0,0 +1,27 @@ +@use 'sass:color'; +@use 'sass:list'; +@use 'sass:meta'; + +@function -real-channel($color, $channel) { + @if color.is-missing($color, $channel) { + @return none; + } @else { + @return color.channel($color, $channel); + } +} + +@mixin inspect($color) { + a { + value: $color; + @if meta.type-of($color) == string { + type: string; + } @else { + channels: list.slash( + -real-channel($color, 'lightness') + -real-channel($color, 'a') + -real-channel($color, 'b'), + -real-channel($color, 'alpha') + ); + } + } +} diff --git a/spec/core_functions/color/lab/alpha.hrx b/spec/core_functions/color/lab/alpha.hrx new file mode 100644 index 0000000000..bdb10dcb9a --- /dev/null +++ b/spec/core_functions/color/lab/alpha.hrx @@ -0,0 +1,145 @@ +<===> transparent/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(0 255 127 / 0)); + +<===> transparent/output.css +a { + value: lab(0% 255 127 / 0); + channels: 0% 255 127 / 0; +} + +<===> +================================================================================ +<===> opaque/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / 1)); + +<===> opaque/output.css +a { + value: lab(1% 2 3); + channels: 1% 2 3 / 1; +} + +<===> +================================================================================ +<===> partial/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / 0.4)); + +<===> partial/output.css +a { + value: lab(1% 2 3 / 0.4); + channels: 1% 2 3 / 0.4; +} + +<===> +================================================================================ +<===> percent/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / 40%)); + +<===> percent/output.css +a { + value: lab(1% 2 3 / 0.4); + channels: 1% 2 3 / 0.4; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab($channels: 1% 2 3 / 0.4)); + +<===> named/output.css +a { + value: lab(1% 2 3 / 0.4); + channels: 1% 2 3 / 0.4; +} + +<===> +================================================================================ +<===> slash_list/input.scss +@use "sass:list"; +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(list.slash(1% 2 3, 0.4))); + +<===> slash_list/output.css +a { + value: lab(1% 2 3 / 0.4); + channels: 1% 2 3 / 0.4; +} + +<===> +================================================================================ +<===> none/slash/b/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 none / 0.4)); + +<===> none/slash/b/output.css +a { + value: lab(1% 2 none / 0.4); + channels: 1% 2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash/alpha/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / none)); + +<===> none/slash/alpha/output.css +a { + value: lab(1% 2 3 / none); + channels: 1% 2 3 / none; +} + +<===> +================================================================================ +<===> none/slash/b_and_alpha/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 none / none)); + +<===> none/slash/b_and_alpha/output.css +a { + value: lab(1% 2 none / none); + channels: 1% 2 none / none; +} + +<===> +================================================================================ +<===> none/slash_list/b/input.scss +@use 'sass:list'; +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(list.slash(1% 2 none, 0.4))); + +<===> none/slash_list/b/output.css +a { + value: lab(1% 2 none / 0.4); + channels: 1% 2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash_list/alpha/input.scss +@use 'sass:list'; +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(list.slash(1% 2 3, none))); + +<===> none/slash_list/alpha/output.css +a { + value: lab(1% 2 3 / none); + channels: 1% 2 3 / none; +} + +<===> +================================================================================ +<===> none/slash_list/b_and_alpha/input.scss +@use 'sass:list'; +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(list.slash(1% 2 none, none))); + +<===> none/slash_list/b_and_alpha/output.css +a { + value: lab(1% 2 none / none); + channels: 1% 2 none / none; +} diff --git a/spec/core_functions/color/lab/error.hrx b/spec/core_functions/color/lab/error.hrx new file mode 100644 index 0000000000..0ae9a06947 --- /dev/null +++ b/spec/core_functions/color/lab/error.hrx @@ -0,0 +1,259 @@ +<===> unit/lightness/input.scss +a {b: lab(1px 2 3)} + +<===> unit/lightness/error +Error: $lightness: Expected 1px to have no units or "%". + , +1 | a {b: lab(1px 2 3)} + | ^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/a/input.scss +a {b: lab(1% 2px 3)} + +<===> unit/a/error +Error: $a: Expected 2px to have no units or "%". + , +1 | a {b: lab(1% 2px 3)} + | ^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/b/input.scss +a {b: lab(1% 2 3px)} + +<===> unit/b/error +Error: $b: Expected 3px to have no units or "%". + , +1 | a {b: lab(1% 2 3px)} + | ^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash/input.scss +a {b: lab(1% 2 3/0.4px)} + +<===> unit/alpha/slash/error +Error: $alpha: Expected 0.4px to have no units or "%". + , +1 | a {b: lab(1% 2 3/0.4px)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: lab(list.slash(1% 2 3, 0.4px))} + +<===> unit/alpha/slash_list/error +Error: $alpha: Expected 0.4px to have no units or "%". + , +2 | a {b: lab(list.slash(1% 2 3, 0.4px))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/lightness/input.scss +a {b: lab(c 2 3)} + +<===> type/lightness/error +Error: $channels: Expected lightness c to be a number. + , +1 | a {b: lab(c 2 3)} + | ^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/a/input.scss +a {b: lab(1% c 3)} + +<===> type/a/error +Error: $channels: Expected a c to be a number. + , +1 | a {b: lab(1% c 3)} + | ^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/b/input.scss +a {b: lab(1% 2 c)} + +<===> type/b/error +Error: $channels: Expected b c to be a number. + , +1 | a {b: lab(1% 2 c)} + | ^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: lab(list.slash(1% 2 3, c))} + +<===> type/alpha/slash_list/error +Error: $channels: c is not a number. + , +2 | a {b: lab(list.slash(1% 2 3, c))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/bracketed/input.scss +a {b: lab([1% 2 3])} + +<===> list/bracketed/error +Error: $channels: Expected an unbracketed list, was [1% 2 3] + , +1 | a {b: lab([1% 2 3])} + | ^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/comma/input.scss +a {b: lab((1%, 2, 3))} + +<===> list/comma/error +Error: $channels: Expected a space- or slash-separated list, was (1%, 2, 3) + , +1 | a {b: lab((1%, 2, 3))} + | ^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/three/input.scss +@use 'sass:list'; +a {b: lab(list.slash(1%, 2, 3))} + +<===> list/slash/three/error +Error: $channels: Only 2 slash-separated elements allowed, but 3 were passed. + , +2 | a {b: lab(list.slash(1%, 2, 3))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/one/input.scss +@use 'sass:list'; +$single-arg-slash-separated: list.append((), 1% 2 3, $separator: slash); +a {b: lab($single-arg-slash-separated)} + +<===> list/slash/one/error +Error: $channels: Only 2 slash-separated elements allowed, but 1 was passed. + , +3 | a {b: lab($single-arg-slash-separated)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/empty/input.scss +a {b: lab(())} + +<===> list/empty/error +Error: $channels: Color component list may not be empty. + , +1 | a {b: lab(())} + | ^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/empty_space/input.scss +@use 'sass:list'; +$empty-space: list.join((), (), $separator: space); +a {b: lab(())} + +<===> list/empty_space/error +Error: $channels: Color component list may not be empty. + , +3 | a {b: lab(())} + | ^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/too_few_channels/input.scss +a {b: lab(1% 2)} + +<===> list/too_few_channels/error +Error: $channels: The lab color space has 3 channels but (1% 2) has 2. + , +1 | a {b: lab(1% 2)} + | ^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/too_many_channels/input.scss +a {b: lab(1% 2 3 0.4)} + +<===> list/too_many_channels/error +Error: $channels: The lab color space has 3 channels but (1% 2 3 0.4) has 4. + , +1 | a {b: lab(1% 2 3 0.4)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/input.scss +a {b: lab()} + +<===> too_few_args/error +Error: Missing argument $channels. + ,--> input.scss +1 | a {b: lab()} + | ^^^^^ invocation + ' + ,--> sass:color +1 | @function lab($channels) { + | ============== declaration + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +a {b: lab(1%, 2, 3, 0.4)} + +<===> too_many_args/error +Error: Only 1 argument allowed, but 4 were passed. + ,--> input.scss +1 | a {b: lab(1%, 2, 3, 0.4)} + | ^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function lab($channels) { + | ============== declaration + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/lab/no_alpha.hrx b/spec/core_functions/color/lab/no_alpha.hrx new file mode 100644 index 0000000000..69e193f4e8 --- /dev/null +++ b/spec/core_functions/color/lab/no_alpha.hrx @@ -0,0 +1,189 @@ +<===> unitless/ab/in_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 -3)); + +<===> unitless/ab/in_range/output.css +a { + value: lab(1% 2 -3); + channels: 1% 2 -3 / 1; +} + +<===> +================================================================================ +<===> unitless/ab/above_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 126 300)); + +<===> unitless/ab/above_range/output.css +a { + value: lab(1% 126 300); + channels: 1% 126 300 / 1; +} + +<===> +================================================================================ +<===> unitless/ab/below_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% -126 -300)); + +<===> unitless/ab/below_range/output.css +a { + value: lab(1% -126 -300); + channels: 1% -126 -300 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/in_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(10 2 -3)); + +<===> unitless/lightness/in_range/output.css +a { + value: lab(10% 2 -3); + channels: 10% 2 -3 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/above_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(101 2 3)); + +<===> unitless/lightness/above_range/output.css +a { + value: lab(100% 2 3); + channels: 100% 2 3 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/below_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(-1 2 3)); + +<===> unitless/lightness/below_range/output.css +a { + value: lab(0% 2 3); + channels: 0% 2 3 / 1; +} + +<===> +================================================================================ +<===> percent/ab/in_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2% -3%)); + +<===> percent/ab/in_range/output.css +a { + value: lab(1% 2.5 -3.75); + channels: 1% 2.5 -3.75 / 1; +} + +<===> +================================================================================ +<===> percent/ab/above_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 101% 150%)); + +<===> percent/ab/above_range/output.css +a { + value: lab(1% 126.25 187.5); + channels: 1% 126.25 187.5 / 1; +} + +<===> +================================================================================ +<===> percent/ab/below_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% -101% -150%)); + +<===> percent/ab/below_range/output.css +a { + value: lab(1% -126.25 -187.5); + channels: 1% -126.25 -187.5 / 1; +} + +<===> +================================================================================ +<===> percent/lightness/in_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2% -3%)); + +<===> percent/lightness/in_range/output.css +a { + value: lab(1% 2.5 -3.75); + channels: 1% 2.5 -3.75 / 1; +} + +<===> +================================================================================ +<===> percent/lightness/above_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(110% 2 3)); + +<===> percent/lightness/above_range/output.css +a { + value: lab(100% 2 3); + channels: 100% 2 3 / 1; +} + +<===> +================================================================================ +<===> percent/lightness/below_range/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(-1% 2 3)); + +<===> percent/lightness/below_range/output.css +a { + value: lab(0% 2 3); + channels: 0% 2 3 / 1; +} + +<===> +================================================================================ +<===> none/lightness/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(none 2 3)); + +<===> none/lightness/output.css +a { + value: lab(none 2 3); + channels: none 2 3 / 1; +} + +<===> +================================================================================ +<===> none/a/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% none 3)); + +<===> none/a/output.css +a { + value: lab(1% none 3); + channels: 1% none 3 / 1; +} + +<===> +================================================================================ +<===> none/b/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 none)); + +<===> none/b/output.css +a { + value: lab(1% 2 none); + channels: 1% 2 none / 1; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab($channels: 1% 2 3)); + +<===> named/output.css +a { + value: lab(1% 2 3); + channels: 1% 2 3 / 1; +} diff --git a/spec/core_functions/color/lab/options.yml b/spec/core_functions/color/lab/options.yml new file mode 100644 index 0000000000..99ecec7ed1 --- /dev/null +++ b/spec/core_functions/color/lab/options.yml @@ -0,0 +1,3 @@ +--- +:ignore_for: +- libsass diff --git a/spec/core_functions/color/lab/special_functions/alpha.hrx b/spec/core_functions/color/lab/special_functions/alpha.hrx new file mode 100644 index 0000000000..85837f5972 --- /dev/null +++ b/spec/core_functions/color/lab/special_functions/alpha.hrx @@ -0,0 +1,430 @@ +<===> calc/string/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(unquote("calc(1%)") 2 3 / 0.4)); + +<===> calc/string/arg_1/output.css +a { + value: lab(calc(1%) 2 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> calc/string/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% unquote("calc(2)") 3 / 0.4)); + +<===> calc/string/arg_2/output.css +a { + value: lab(1% calc(2) 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> calc/string/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 unquote("calc(3)") / 0.4)); + +<===> calc/string/arg_3/output.css +a { + value: lab(1% 2 calc(3)/0.4); + type: string; +} + +<===> +================================================================================ +<===> calc/string/arg_4/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / unquote("calc(0.4)"))); + +<===> calc/string/arg_4/output.css +a { + value: lab(1% 2 3/calc(0.4)); + type: string; +} + +<===> +================================================================================ +<===> calc/calculation/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(calc(1px + 1%) 2 3 / 0.4)); + +<===> calc/calculation/arg_1/output.css +a { + value: lab(calc(1px + 1%) 2 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> calc/calculation/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% calc(1px + 1%) 3 / 0.4)); + +<===> calc/calculation/arg_2/output.css +a { + value: lab(1% calc(1px + 1%) 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> calc/calculation/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 calc(1px + 1%) / 0.4)); + +<===> calc/calculation/arg_3/output.css +a { + value: lab(1% 2 calc(1px + 1%)/0.4); + type: string; +} + +<===> +================================================================================ +<===> calc/calculation/arg_4/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / calc(1px + 1%))); + +<===> calc/calculation/arg_4/output.css +a { + value: lab(1% 2 3/calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(var(--foo) 2 3 / 0.4)); + +<===> var/arg_1/output.css +a { + value: lab(var(--foo) 2 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> var/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% var(--foo) 3 / 0.4)); + +<===> var/arg_2/output.css +a { + value: lab(1% var(--foo) 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> var/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 var(--foo) / 0.4)); + +<===> var/arg_3/output.css +a { + value: lab(1% 2 var(--foo)/0.4); + type: string; +} + +<===> +================================================================================ +<===> var/arg_4/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / var(--foo))); + +<===> var/arg_4/output.css +a { + value: lab(1% 2 3/var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> env/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(env(--foo) 2 3 / 0.4)); + +<===> env/arg_1/output.css +a { + value: lab(env(--foo) 2 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> env/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% env(--foo) 3 / 0.4)); + +<===> env/arg_2/output.css +a { + value: lab(1% env(--foo) 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> env/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 env(--foo) / 0.4)); + +<===> env/arg_3/output.css +a { + value: lab(1% 2 env(--foo)/0.4); + type: string; +} + +<===> +================================================================================ +<===> env/arg_4/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / env(--foo))); + +<===> env/arg_4/output.css +a { + value: lab(1% 2 3/env(--foo)); + type: string; +} + +<===> +================================================================================ +<===> min/string/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(unquote("min(1%)") 2 3 / 0.4)); + +<===> min/string/arg_1/output.css +a { + value: lab(min(1%) 2 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> min/string/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% unquote("min(2)") 3 / 0.4)); + +<===> min/string/arg_2/output.css +a { + value: lab(1% min(2) 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> min/string/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 unquote("min(3)") / 0.4)); + +<===> min/string/arg_3/output.css +a { + value: lab(1% 2 min(3)/0.4); + type: string; +} + +<===> +================================================================================ +<===> min/string/arg_4/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / unquote("min(0.4)"))); + +<===> min/string/arg_4/output.css +a { + value: lab(1% 2 3/min(0.4)); + type: string; +} + +<===> +================================================================================ +<===> max/string/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(unquote("max(1%)") 2 3 / 0.4)); + +<===> max/string/arg_1/output.css +a { + value: lab(max(1%) 2 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> max/string/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% unquote("max(2)") 3 / 0.4)); + +<===> max/string/arg_2/output.css +a { + value: lab(1% max(2) 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> max/string/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 unquote("max(3)") / 0.4)); + +<===> max/string/arg_3/output.css +a { + value: lab(1% 2 max(3)/0.4); + type: string; +} + +<===> +================================================================================ +<===> max/string/arg_4/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / unquote("max(0.4)"))); + +<===> max/string/arg_4/output.css +a { + value: lab(1% 2 3/max(0.4)); + type: string; +} + +<===> +================================================================================ +<===> clamp/string/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(unquote("clamp(1%, 2, 3)") 2 3 / 0.4)); + +<===> clamp/string/arg_1/output.css +a { + value: lab(clamp(1%, 2, 3) 2 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> clamp/string/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% unquote("clamp(2, 3, 4)") 3 / 0.4)); + +<===> clamp/string/arg_2/output.css +a { + value: lab(1% clamp(2, 3, 4) 3/0.4); + type: string; +} + +<===> +================================================================================ +<===> clamp/string/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 unquote("clamp(3, 4, 5)") / 0.4)); + +<===> clamp/string/arg_3/output.css +a { + value: lab(1% 2 clamp(3, 4, 5)/0.4); + type: string; +} + +<===> +================================================================================ +<===> clamp/string/arg_4/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / unquote("clamp(0.4, 0.5, 0.6)"))); + +<===> clamp/string/arg_4/output.css +a { + value: lab(1% 2 3/clamp(0.4, 0.5, 0.6)); + type: string; +} + +<===> +================================================================================ +<===> unknown/arg_3/with_number/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 b / 0.4)); + +<===> unknown/arg_3/with_number/output.css +a { + value: lab(1% 2 b/0.4); + type: string; +} + +<===> +================================================================================ +<===> unknown/arg_3/with_none/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 b / none)); + +<===> unknown/arg_3/with_none/output.css +a { + value: lab(1% 2 b/none); + type: string; +} + +<===> +================================================================================ +<===> unknown/arg_4/with_number/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 3 / b)); + +<===> unknown/arg_4/with_number/output.css +a { + value: lab(1% 2 3/b); + type: string; +} + +<===> +================================================================================ +<===> unknown/arg_4/with_none/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 none / b)); + +<===> unknown/arg_4/with_none/output.css +a { + value: lab(1% 2 none/b); + type: string; +} + +<===> +================================================================================ +<===> unknown/arg_3_and_4/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 b / c)); + +<===> unknown/arg_3_and_4/output.css +a { + value: lab(1% 2 b/c); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_2/input.scss +// var() is substituted before parsing, so it may contain multiple arguments. +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(var(--foo) 2 / 0.4)); + +<===> multi_argument_var/1_of_2/output.css +a { + value: lab(var(--foo) 2/0.4); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/2_of_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% var(--foo) / 0.4)); + +<===> multi_argument_var/2_of_2/output.css +a { + value: lab(1% var(--foo)/0.4); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(var(--foo) / 0.4)); + +<===> multi_argument_var/1_of_1/output.css +a { + value: lab(var(--foo)/0.4); + type: string; +} diff --git a/spec/core_functions/color/lab/special_functions/no_alpha.hrx b/spec/core_functions/color/lab/special_functions/no_alpha.hrx new file mode 100644 index 0000000000..c20e710403 --- /dev/null +++ b/spec/core_functions/color/lab/special_functions/no_alpha.hrx @@ -0,0 +1,280 @@ +<===> calc/string/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(unquote("calc(1%)") 2 3)); + +<===> calc/string/arg_1/output.css +a { + value: lab(calc(1%) 2 3); + type: string; +} + +<===> +================================================================================ +<===> calc/string/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% unquote("calc(2)") 3)); + +<===> calc/string/arg_2/output.css +a { + value: lab(1% calc(2) 3); + type: string; +} + +<===> +================================================================================ +<===> calc/string/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 unquote("calc(3)"))); + +<===> calc/string/arg_3/output.css +a { + value: lab(1% 2 calc(3)); + type: string; +} + +<===> +================================================================================ +<===> calc/calculation/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(calc(1px + 1%) 2 3)); + +<===> calc/calculation/arg_1/output.css +a { + value: lab(calc(1px + 1%) 2 3); + type: string; +} + +<===> +================================================================================ +<===> calc/calculation/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% calc(1px + 1%) 3)); + +<===> calc/calculation/arg_2/output.css +a { + value: lab(1% calc(1px + 1%) 3); + type: string; +} + +<===> +================================================================================ +<===> calc/calculation/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 calc(1px + 1%))); + +<===> calc/calculation/arg_3/output.css +a { + value: lab(1% 2 calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(var(--foo) 2 3)); + +<===> var/arg_1/output.css +a { + value: lab(var(--foo) 2 3); + type: string; +} + +<===> +================================================================================ +<===> var/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% var(--foo) 3)); + +<===> var/arg_2/output.css +a { + value: lab(1% var(--foo) 3); + type: string; +} + +<===> +================================================================================ +<===> var/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 var(--foo))); + +<===> var/arg_3/output.css +a { + value: lab(1% 2 var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> env/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(env(--foo) 2 3)); + +<===> env/arg_1/output.css +a { + value: lab(env(--foo) 2 3); + type: string; +} + +<===> +================================================================================ +<===> env/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% env(--foo) 3)); + +<===> env/arg_2/output.css +a { + value: lab(1% env(--foo) 3); + type: string; +} + +<===> +================================================================================ +<===> env/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 env(--foo))); + +<===> env/arg_3/output.css +a { + value: lab(1% 2 env(--foo)); + type: string; +} + +<===> +================================================================================ +<===> min/string/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(unquote("min(1%)") 2 3)); + +<===> min/string/arg_1/output.css +a { + value: lab(min(1%) 2 3); + type: string; +} + +<===> +================================================================================ +<===> min/string/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% unquote("min(2)") 3)); + +<===> min/string/arg_2/output.css +a { + value: lab(1% min(2) 3); + type: string; +} + +<===> +================================================================================ +<===> min/string/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 unquote("min(3)"))); + +<===> min/string/arg_3/output.css +a { + value: lab(1% 2 min(3)); + type: string; +} + +<===> +================================================================================ +<===> max/string/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(unquote("max(1%)") 2 3)); + +<===> max/string/arg_1/output.css +a { + value: lab(max(1%) 2 3); + type: string; +} + +<===> +================================================================================ +<===> max/string/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% unquote("max(2)") 3)); + +<===> max/string/arg_2/output.css +a { + value: lab(1% max(2) 3); + type: string; +} + +<===> +================================================================================ +<===> max/string/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 unquote("max(3)"))); + +<===> max/string/arg_3/output.css +a { + value: lab(1% 2 max(3)); + type: string; +} + +<===> +================================================================================ +<===> clamp/string/arg_1/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(unquote("clamp(1%, 2, 3)") 2 3)); + +<===> clamp/string/arg_1/output.css +a { + value: lab(clamp(1%, 2, 3) 2 3); + type: string; +} + +<===> +================================================================================ +<===> clamp/string/arg_2/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% unquote("clamp(2, 3, 4)") 3)); + +<===> clamp/string/arg_2/output.css +a { + value: lab(1% clamp(2, 3, 4) 3); + type: string; +} + +<===> +================================================================================ +<===> clamp/string/arg_3/input.scss +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(1% 2 unquote("clamp(3, 4, 5)"))); + +<===> clamp/string/arg_3/output.css +a { + value: lab(1% 2 clamp(3, 4, 5)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_2/input.scss +// var() is substituted before parsing, so it may contain multiple arguments. +a {b: lab(var(--foo) 2)} + +<===> multi_argument_var/1_of_2/output.css +a { + b: lab(var(--foo) 2); +} + +<===> +================================================================================ +<===> multi_argument_var/2_of_2/input.scss +a {b: lab(1% var(--foo))} + +<===> multi_argument_var/2_of_2/output.css +a { + b: lab(1% var(--foo)); +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/input.scss +a {b: lab(var(--foo))} + +<===> multi_argument_var/1_of_1/output.css +a { + b: lab(var(--foo)); +} diff --git a/spec/core_functions/color/lab/special_functions/slash_list.hrx b/spec/core_functions/color/lab/special_functions/slash_list.hrx new file mode 100644 index 0000000000..f99a640c53 --- /dev/null +++ b/spec/core_functions/color/lab/special_functions/slash_list.hrx @@ -0,0 +1,36 @@ +<===> channels/input.scss +@use "sass:list"; +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(list.slash(var(--foo), 0.4))); + +<===> channels/output.css +a { + value: lab(var(--foo) / 0.4); + type: string; +} + +<===> +================================================================================ +<===> some_channels/input.scss +@use "sass:list"; +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(list.slash(1% var(--foo), 0.4))); + +<===> some_channels/output.css +a { + value: lab(1% var(--foo) / 0.4); + type: string; +} + +<===> +================================================================================ +<===> alpha/input.scss +@use "sass:list"; +@use 'core_functions/color/lab/utils'; +@include utils.inspect(lab(list.slash(1% 2 3, var(--c)))); + +<===> alpha/output.css +a { + value: lab(1% 2 3 / var(--c)); + type: string; +} diff --git a/spec/core_functions/color/rgb/error/one_arg.hrx b/spec/core_functions/color/rgb/error/one_arg.hrx index dde5bfa30c..b16f12e29e 100644 --- a/spec/core_functions/color/rgb/error/one_arg.hrx +++ b/spec/core_functions/color/rgb/error/one_arg.hrx @@ -159,7 +159,7 @@ Error: $channels: Expected blue "var(--foo) / 0.4" to be a number. a {b: rgb(append((), 1 2 3, $separator: slash))} <===> slash_list/too_few_elements/error -Error: Only 2 slash-separated elements allowed, but 1 was passed. +Error: $channels: Only 2 slash-separated elements allowed, but 1 was passed. , 1 | a {b: rgb(append((), 1 2 3, $separator: slash))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -173,7 +173,7 @@ Error: Only 2 slash-separated elements allowed, but 1 was passed. a {b: rgb(list.slash(1 2 3, 0.4, 1))} <===> slash_list/too_many_elements/error -Error: Only 2 slash-separated elements allowed, but 3 were passed. +Error: $channels: Only 2 slash-separated elements allowed, but 3 were passed. , 2 | a {b: rgb(list.slash(1 2 3, 0.4, 1))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ From fab4c671340b8df036f1587aa8fe462e2f70fcc0 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Thu, 5 Oct 2023 18:18:53 -0700 Subject: [PATCH 15/45] Update specs for the merge --- .../color/hsl/one_arg/relative_color.hrx | 6 ++++++ spec/core_functions/color/hwb/error/one_arg.hrx | 2 +- spec/core_functions/color/lab/error.hrx | 10 +++++----- .../color/rgb/one_arg/relative_color.hrx | 6 ++++++ .../core_functions/meta/get_mixin/different_module.hrx | 9 ++++++--- 5 files changed, 24 insertions(+), 9 deletions(-) diff --git a/spec/core_functions/color/hsl/one_arg/relative_color.hrx b/spec/core_functions/color/hsl/one_arg/relative_color.hrx index 2dcc4f7cbf..887da29988 100644 --- a/spec/core_functions/color/hsl/one_arg/relative_color.hrx +++ b/spec/core_functions/color/hsl/one_arg/relative_color.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:todo: +- dart-sass + +<===> +================================================================================ <===> static/alpha/input.scss a {b: hsl(from #aaa h s l / 25%)} diff --git a/spec/core_functions/color/hwb/error/one_arg.hrx b/spec/core_functions/color/hwb/error/one_arg.hrx index 2affeadd29..39cf839885 100644 --- a/spec/core_functions/color/hwb/error/one_arg.hrx +++ b/spec/core_functions/color/hwb/error/one_arg.hrx @@ -334,7 +334,7 @@ Error: Expected numeric channels, got "hwb(0 30% var(--c)/0.5px)". a {b: color.hwb(0 0% 0% / 0.5px)} <===> alpha/unit/error -Error: $alpha: Expected 0.5px to have no units or "%". +Error: $alpha: Expected 0.5px to have unit "%" or no units. , 2 | a {b: color.hwb(0 0% 0% / 0.5px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/lab/error.hrx b/spec/core_functions/color/lab/error.hrx index 0ae9a06947..8ef5bf1f08 100644 --- a/spec/core_functions/color/lab/error.hrx +++ b/spec/core_functions/color/lab/error.hrx @@ -2,7 +2,7 @@ a {b: lab(1px 2 3)} <===> unit/lightness/error -Error: $lightness: Expected 1px to have no units or "%". +Error: $lightness: Expected 1px to have unit "%" or no units. , 1 | a {b: lab(1px 2 3)} | ^^^^^^^^^^^^ @@ -15,7 +15,7 @@ Error: $lightness: Expected 1px to have no units or "%". a {b: lab(1% 2px 3)} <===> unit/a/error -Error: $a: Expected 2px to have no units or "%". +Error: $a: Expected 2px to have unit "%" or no units. , 1 | a {b: lab(1% 2px 3)} | ^^^^^^^^^^^^^ @@ -28,7 +28,7 @@ Error: $a: Expected 2px to have no units or "%". a {b: lab(1% 2 3px)} <===> unit/b/error -Error: $b: Expected 3px to have no units or "%". +Error: $b: Expected 3px to have unit "%" or no units. , 1 | a {b: lab(1% 2 3px)} | ^^^^^^^^^^^^^ @@ -41,7 +41,7 @@ Error: $b: Expected 3px to have no units or "%". a {b: lab(1% 2 3/0.4px)} <===> unit/alpha/slash/error -Error: $alpha: Expected 0.4px to have no units or "%". +Error: $alpha: Expected 0.4px to have unit "%" or no units. , 1 | a {b: lab(1% 2 3/0.4px)} | ^^^^^^^^^^^^^^^^^ @@ -55,7 +55,7 @@ Error: $alpha: Expected 0.4px to have no units or "%". a {b: lab(list.slash(1% 2 3, 0.4px))} <===> unit/alpha/slash_list/error -Error: $alpha: Expected 0.4px to have no units or "%". +Error: $alpha: Expected 0.4px to have unit "%" or no units. , 2 | a {b: lab(list.slash(1% 2 3, 0.4px))} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/rgb/one_arg/relative_color.hrx b/spec/core_functions/color/rgb/one_arg/relative_color.hrx index bb44f0ef7d..f6456407ef 100644 --- a/spec/core_functions/color/rgb/one_arg/relative_color.hrx +++ b/spec/core_functions/color/rgb/one_arg/relative_color.hrx @@ -1,3 +1,9 @@ +<===> options.yml +:todo: +- dart-sass + +<===> +================================================================================ <===> static/alpha/input.scss a {b: rgb(from #aaa r g b / 25%)} diff --git a/spec/core_functions/meta/get_mixin/different_module.hrx b/spec/core_functions/meta/get_mixin/different_module.hrx index a963879124..ea68b2b103 100644 --- a/spec/core_functions/meta/get_mixin/different_module.hrx +++ b/spec/core_functions/meta/get_mixin/different_module.hrx @@ -4,7 +4,8 @@ a {@include meta.apply(meta.get-mixin("a", $module: "other"), #abcdef)} <===> defined/_other.scss -@mixin a($color) {b: red($color)} +@use "sass:color"; +@mixin a($color) {b: color.channel($color, 'red')} <===> defined/output.css a { @@ -19,7 +20,8 @@ a { b {@include meta.apply(meta.get-mixin("a", $module: "a"), #abcdef)} <===> chosen_prefix/_other.scss -@mixin a($color) {c: red($color)} +@use "sass:color"; +@mixin a($color) {c: color.channel($color, 'red')} <===> chosen_prefix/output.css b { @@ -121,7 +123,8 @@ a { a {@include meta.apply(meta.get-mixin($name: "a", $module: "other"), #abcdef)} <===> named/_other.scss -@mixin a($color) {b: red($color)} +@use "sass:color"; +@mixin a($color) {b: color.channel($color, 'red')} <===> named/output.css a { From 554a03a2148139c2623caf9bf39aa89811b34d71 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 6 Oct 2023 14:51:18 -0700 Subject: [PATCH 16/45] [Color 4] Add tests for oklab() (#1938) --- .../color/hsl/error/one_arg.hrx | 8 +- .../color/hwb/error/four_args.hrx | 6 +- .../color/hwb/error/one_arg.hrx | 8 +- .../color/hwb/error/three_args.hrx | 6 +- spec/core_functions/color/lab/error.hrx | 6 +- spec/core_functions/color/oklab/README.md | 2 + spec/core_functions/color/oklab/_utils.scss | 27 ++ spec/core_functions/color/oklab/alpha.hrx | 120 ++++++++ spec/core_functions/color/oklab/error.hrx | 259 ++++++++++++++++++ spec/core_functions/color/oklab/no_alpha.hrx | 189 +++++++++++++ spec/core_functions/color/oklab/options.yml | 3 + .../color/oklab/special_functions.hrx | 142 ++++++++++ .../color/rgb/error/one_arg.hrx | 8 +- 13 files changed, 763 insertions(+), 21 deletions(-) create mode 100644 spec/core_functions/color/oklab/README.md create mode 100644 spec/core_functions/color/oklab/_utils.scss create mode 100644 spec/core_functions/color/oklab/alpha.hrx create mode 100644 spec/core_functions/color/oklab/error.hrx create mode 100644 spec/core_functions/color/oklab/no_alpha.hrx create mode 100644 spec/core_functions/color/oklab/options.yml create mode 100644 spec/core_functions/color/oklab/special_functions.hrx diff --git a/spec/core_functions/color/hsl/error/one_arg.hrx b/spec/core_functions/color/hsl/error/one_arg.hrx index b603b431dd..d511c26aa4 100644 --- a/spec/core_functions/color/hsl/error/one_arg.hrx +++ b/spec/core_functions/color/hsl/error/one_arg.hrx @@ -101,7 +101,7 @@ a { } <===> type/hue/error -Error: $channels: Expected hue "foo" to be a number. +Error: $channels: Expected hue channel to be a number, was "foo". , 2 | b: hsl("foo" 100% 50%); | ^^^^^^^^^^^^^^^^^^^ @@ -116,7 +116,7 @@ a { } <===> type/saturation/error -Error: $channels: Expected saturation "foo" to be a number. +Error: $channels: Expected saturation channel to be a number, was "foo". , 2 | b: hsl(0 "foo" 50%); | ^^^^^^^^^^^^^^^^ @@ -131,7 +131,7 @@ a { } <===> type/lightness/error -Error: $channels: Expected lightness "foo" to be a number. +Error: $channels: Expected lightness channel to be a number, was "foo". , 2 | b: hsl(0 100% "foo"); | ^^^^^^^^^^^^^^^^^ @@ -146,7 +146,7 @@ a { } <===> quoted_var_slash/error -Error: $channels: Expected lightness "var(--foo) / 0.4" to be a number. +Error: $channels: Expected lightness channel to be a number, was "var(--foo) / 0.4". , 2 | b: hsl(0 100% "var(--foo) / 0.4"); | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/hwb/error/four_args.hrx b/spec/core_functions/color/hwb/error/four_args.hrx index 6600ef2038..3a26596ccb 100644 --- a/spec/core_functions/color/hwb/error/four_args.hrx +++ b/spec/core_functions/color/hwb/error/four_args.hrx @@ -3,7 +3,7 @@ a {b: color.hwb("foo", 30%, 40%, 0.5)} <===> hue/type/error -Error: Expected hue "foo" to be a number. +Error: Expected hue channel to be a number, was "foo". , 2 | a {b: color.hwb("foo", 30%, 40%, 0.5)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -36,7 +36,7 @@ Error: $hue: var(--c) is not a number. a {b: color.hwb(0, "foo", 40%, 0.5)} <===> whiteness/type/error -Error: Expected whiteness "foo" to be a number. +Error: Expected whiteness channel to be a number, was "foo". , 2 | a {b: color.hwb(0, "foo", 40%, 0.5)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -135,7 +135,7 @@ Error: $whiteness: var(--c) is not a number. a {b: color.hwb(0, 30%, "foo", 0.5)} <===> blackness/type/error -Error: Expected blackness "foo" to be a number. +Error: Expected blackness channel to be a number, was "foo". , 2 | a {b: color.hwb(0, 30%, "foo", 0.5)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/hwb/error/one_arg.hrx b/spec/core_functions/color/hwb/error/one_arg.hrx index 39cf839885..8740f3c491 100644 --- a/spec/core_functions/color/hwb/error/one_arg.hrx +++ b/spec/core_functions/color/hwb/error/one_arg.hrx @@ -87,7 +87,7 @@ Error: $channels: The hwb color space has 3 channels but (0 30% 40% 0.4) has 4. a {b: color.hwb("foo" 30% 40%)} <===> hue/type/error -Error: $channels: Expected hue "foo" to be a number. +Error: $channels: Expected hue channel to be a number, was "foo". , 2 | a {b: color.hwb("foo" 30% 40%)} | ^^^^^^^^^^^^^^^^^^^^^^^^ @@ -120,7 +120,7 @@ Error: $hue: var(--c) is not a number. a {b: color.hwb(0 "foo" 40%)} <===> whiteness/type/error -Error: $channels: Expected whiteness "foo" to be a number. +Error: $channels: Expected whiteness channel to be a number, was "foo". , 2 | a {b: color.hwb(0 "foo" 40%)} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -219,7 +219,7 @@ Error: $whiteness: var(--c) is not a number. a {b: color.hwb(0 30% "foo")} <===> blackness/type/error -Error: $channels: Expected blackness "foo" to be a number. +Error: $channels: Expected blackness channel to be a number, was "foo". , 2 | a {b: color.hwb(0 30% "foo")} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -367,7 +367,7 @@ Error: Expected numeric channels, got "hwb(0 0 0/var(--c))". a {b: color.hwb(0 30% "var(--foo) / 0.4")} <===> quoted_var_slash/error -Error: $channels: Expected blackness "var(--foo) / 0.4" to be a number. +Error: $channels: Expected blackness channel to be a number, was "var(--foo) / 0.4". , 2 | a {b: color.hwb(0 30% "var(--foo) / 0.4")} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/hwb/error/three_args.hrx b/spec/core_functions/color/hwb/error/three_args.hrx index 558f605fa9..1d3b955595 100644 --- a/spec/core_functions/color/hwb/error/three_args.hrx +++ b/spec/core_functions/color/hwb/error/three_args.hrx @@ -3,7 +3,7 @@ a {b: color.hwb("foo", 100%, 50%)} <===> hue/type/error -Error: Expected hue "foo" to be a number. +Error: Expected hue channel to be a number, was "foo". , 2 | a {b: color.hwb("foo", 100%, 50%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -25,7 +25,7 @@ Error: argument `$hue` of `hwb($hue, $whiteness, $blackness)` must be a number a {b: color.hwb(0, "foo", 50%)} <===> whiteness/type/error -Error: Expected whiteness "foo" to be a number. +Error: Expected whiteness channel to be a number, was "foo". , 2 | a {b: color.hwb(0, "foo", 50%)} | ^^^^^^^^^^^^^^^^^^^^^^^^ @@ -47,7 +47,7 @@ Error: argument `$whiteness` of `hwb($hue, $whiteness, $blackness)` must be a nu a {b: color.hwb(0, 100%, "foo")} <===> blackness/type/error -Error: Expected blackness "foo" to be a number. +Error: Expected blackness channel to be a number, was "foo". , 2 | a {b: color.hwb(0, 100%, "foo")} | ^^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/lab/error.hrx b/spec/core_functions/color/lab/error.hrx index 8ef5bf1f08..27363ac64a 100644 --- a/spec/core_functions/color/lab/error.hrx +++ b/spec/core_functions/color/lab/error.hrx @@ -68,7 +68,7 @@ Error: $alpha: Expected 0.4px to have unit "%" or no units. a {b: lab(c 2 3)} <===> type/lightness/error -Error: $channels: Expected lightness c to be a number. +Error: $channels: Expected lightness channel to be a number, was c. , 1 | a {b: lab(c 2 3)} | ^^^^^^^^^^ @@ -81,7 +81,7 @@ Error: $channels: Expected lightness c to be a number. a {b: lab(1% c 3)} <===> type/a/error -Error: $channels: Expected a c to be a number. +Error: $channels: Expected a channel to be a number, was c. , 1 | a {b: lab(1% c 3)} | ^^^^^^^^^^^ @@ -94,7 +94,7 @@ Error: $channels: Expected a c to be a number. a {b: lab(1% 2 c)} <===> type/b/error -Error: $channels: Expected b c to be a number. +Error: $channels: Expected b channel to be a number, was c. , 1 | a {b: lab(1% 2 c)} | ^^^^^^^^^^^ diff --git a/spec/core_functions/color/oklab/README.md b/spec/core_functions/color/oklab/README.md new file mode 100644 index 0000000000..5117c908e1 --- /dev/null +++ b/spec/core_functions/color/oklab/README.md @@ -0,0 +1,2 @@ +Some of the same behavior tested for `lab()` applies to this function as well, +but for terseness' sake isn't tested explicitly. diff --git a/spec/core_functions/color/oklab/_utils.scss b/spec/core_functions/color/oklab/_utils.scss new file mode 100644 index 0000000000..106fe41df4 --- /dev/null +++ b/spec/core_functions/color/oklab/_utils.scss @@ -0,0 +1,27 @@ +@use 'sass:color'; +@use 'sass:list'; +@use 'sass:meta'; + +@function -real-channel($color, $channel) { + @if color.is-missing($color, $channel) { + @return none; + } @else { + @return color.channel($color, $channel); + } +} + +@mixin inspect($color) { + a { + value: $color; + @if meta.type-of($color) == string { + type: string; + } @else { + channels: list.slash( + -real-channel($color, 'lightness') + -real-channel($color, 'a') + -real-channel($color, 'b'), + -real-channel($color, 'alpha') + ); + } + } +} diff --git a/spec/core_functions/color/oklab/alpha.hrx b/spec/core_functions/color/oklab/alpha.hrx new file mode 100644 index 0000000000..4f245830d1 --- /dev/null +++ b/spec/core_functions/color/oklab/alpha.hrx @@ -0,0 +1,120 @@ +<===> transparent/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(0 255 127 / 0)); + +<===> transparent/output.css +a { + value: oklab(0% 255 127 / 0); + channels: 0% 255 127 / 0; +} + +<===> +================================================================================ +<===> opaque/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 3 / 1)); + +<===> opaque/output.css +a { + value: oklab(1% 2 3); + channels: 1% 2 3 / 1; +} + +<===> +================================================================================ +<===> partial/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 3 / 0.4)); + +<===> partial/output.css +a { + value: oklab(1% 2 3 / 0.4); + channels: 1% 2 3 / 0.4; +} + +<===> +================================================================================ +<===> percent/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 3 / 40%)); + +<===> percent/output.css +a { + value: oklab(1% 2 3 / 0.4); + channels: 1% 2 3 / 0.4; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab($channels: 1% 2 3 / 0.4)); + +<===> named/output.css +a { + value: oklab(1% 2 3 / 0.4); + channels: 1% 2 3 / 0.4; +} + +<===> +================================================================================ +<===> slash_list/input.scss +@use "sass:list"; +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(list.slash(1% 2 3, 0.4))); + +<===> slash_list/output.css +a { + value: oklab(1% 2 3 / 0.4); + channels: 1% 2 3 / 0.4; +} + +<===> +================================================================================ +<===> none/slash/b/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 none / 0.4)); + +<===> none/slash/b/output.css +a { + value: oklab(1% 2 none / 0.4); + channels: 1% 2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash/alpha/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 3 / none)); + +<===> none/slash/alpha/output.css +a { + value: oklab(1% 2 3 / none); + channels: 1% 2 3 / none; +} + +<===> +================================================================================ +<===> none/slash_list/b/input.scss +@use 'sass:list'; +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(list.slash(1% 2 none, 0.4))); + +<===> none/slash_list/b/output.css +a { + value: oklab(1% 2 none / 0.4); + channels: 1% 2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash_list/alpha/input.scss +@use 'sass:list'; +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(list.slash(1% 2 3, none))); + +<===> none/slash_list/alpha/output.css +a { + value: oklab(1% 2 3 / none); + channels: 1% 2 3 / none; +} diff --git a/spec/core_functions/color/oklab/error.hrx b/spec/core_functions/color/oklab/error.hrx new file mode 100644 index 0000000000..b39e25c0d2 --- /dev/null +++ b/spec/core_functions/color/oklab/error.hrx @@ -0,0 +1,259 @@ +<===> unit/lightness/input.scss +a {b: oklab(1px 2 3)} + +<===> unit/lightness/error +Error: $lightness: Expected 1px to have unit "%" or no units. + , +1 | a {b: oklab(1px 2 3)} + | ^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/a/input.scss +a {b: oklab(1% 2px 3)} + +<===> unit/a/error +Error: $a: Expected 2px to have unit "%" or no units. + , +1 | a {b: oklab(1% 2px 3)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/b/input.scss +a {b: oklab(1% 2 3px)} + +<===> unit/b/error +Error: $b: Expected 3px to have unit "%" or no units. + , +1 | a {b: oklab(1% 2 3px)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash/input.scss +a {b: oklab(1% 2 3/0.4px)} + +<===> unit/alpha/slash/error +Error: $alpha: Expected 0.4px to have unit "%" or no units. + , +1 | a {b: oklab(1% 2 3/0.4px)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: oklab(list.slash(1% 2 3, 0.4px))} + +<===> unit/alpha/slash_list/error +Error: $alpha: Expected 0.4px to have unit "%" or no units. + , +2 | a {b: oklab(list.slash(1% 2 3, 0.4px))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/lightness/input.scss +a {b: oklab(c 2 3)} + +<===> type/lightness/error +Error: $channels: Expected lightness channel to be a number, was c. + , +1 | a {b: oklab(c 2 3)} + | ^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/a/input.scss +a {b: oklab(1% c 3)} + +<===> type/a/error +Error: $channels: Expected a channel to be a number, was c. + , +1 | a {b: oklab(1% c 3)} + | ^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/b/input.scss +a {b: oklab(1% 2 c)} + +<===> type/b/error +Error: $channels: Expected b channel to be a number, was c. + , +1 | a {b: oklab(1% 2 c)} + | ^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: oklab(list.slash(1% 2 3, c))} + +<===> type/alpha/slash_list/error +Error: $channels: c is not a number. + , +2 | a {b: oklab(list.slash(1% 2 3, c))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/bracketed/input.scss +a {b: oklab([1% 2 3])} + +<===> list/bracketed/error +Error: $channels: Expected an unbracketed list, was [1% 2 3] + , +1 | a {b: oklab([1% 2 3])} + | ^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/comma/input.scss +a {b: oklab((1%, 2, 3))} + +<===> list/comma/error +Error: $channels: Expected a space- or slash-separated list, was (1%, 2, 3) + , +1 | a {b: oklab((1%, 2, 3))} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/three/input.scss +@use 'sass:list'; +a {b: oklab(list.slash(1%, 2, 3))} + +<===> list/slash/three/error +Error: $channels: Only 2 slash-separated elements allowed, but 3 were passed. + , +2 | a {b: oklab(list.slash(1%, 2, 3))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/one/input.scss +@use 'sass:list'; +$single-arg-slash-separated: list.append((), 1% 2 3, $separator: slash); +a {b: oklab($single-arg-slash-separated)} + +<===> list/slash/one/error +Error: $channels: Only 2 slash-separated elements allowed, but 1 was passed. + , +3 | a {b: oklab($single-arg-slash-separated)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/empty/input.scss +a {b: oklab(())} + +<===> list/empty/error +Error: $channels: Color component list may not be empty. + , +1 | a {b: oklab(())} + | ^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/empty_space/input.scss +@use 'sass:list'; +$empty-space: list.join((), (), $separator: space); +a {b: oklab(())} + +<===> list/empty_space/error +Error: $channels: Color component list may not be empty. + , +3 | a {b: oklab(())} + | ^^^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/too_few_channels/input.scss +a {b: oklab(1% 2)} + +<===> list/too_few_channels/error +Error: $channels: The oklab color space has 3 channels but (1% 2) has 2. + , +1 | a {b: oklab(1% 2)} + | ^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/too_many_channels/input.scss +a {b: oklab(1% 2 3 0.4)} + +<===> list/too_many_channels/error +Error: $channels: The oklab color space has 3 channels but (1% 2 3 0.4) has 4. + , +1 | a {b: oklab(1% 2 3 0.4)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/input.scss +a {b: oklab()} + +<===> too_few_args/error +Error: Missing argument $channels. + ,--> input.scss +1 | a {b: oklab()} + | ^^^^^^^ invocation + ' + ,--> sass:color +1 | @function oklab($channels) { + | ================ declaration + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +a {b: oklab(1%, 2, 3, 0.4)} + +<===> too_many_args/error +Error: Only 1 argument allowed, but 4 were passed. + ,--> input.scss +1 | a {b: oklab(1%, 2, 3, 0.4)} + | ^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function oklab($channels) { + | ================ declaration + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/oklab/no_alpha.hrx b/spec/core_functions/color/oklab/no_alpha.hrx new file mode 100644 index 0000000000..89c41fc681 --- /dev/null +++ b/spec/core_functions/color/oklab/no_alpha.hrx @@ -0,0 +1,189 @@ +<===> unitless/ab/in_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 -3)); + +<===> unitless/ab/in_range/output.css +a { + value: oklab(1% 2 -3); + channels: 1% 2 -3 / 1; +} + +<===> +================================================================================ +<===> unitless/ab/above_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 126 300)); + +<===> unitless/ab/above_range/output.css +a { + value: oklab(1% 126 300); + channels: 1% 126 300 / 1; +} + +<===> +================================================================================ +<===> unitless/ab/below_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% -126 -300)); + +<===> unitless/ab/below_range/output.css +a { + value: oklab(1% -126 -300); + channels: 1% -126 -300 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/in_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(0.1 2 -3)); + +<===> unitless/lightness/in_range/output.css +a { + value: oklab(10% 2 -3); + channels: 10% 2 -3 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/above_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1.1 2 3)); + +<===> unitless/lightness/above_range/output.css +a { + value: oklab(100% 2 3); + channels: 100% 2 3 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/below_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(-0.1 2 3)); + +<===> unitless/lightness/below_range/output.css +a { + value: oklab(0% 2 3); + channels: 0% 2 3 / 1; +} + +<===> +================================================================================ +<===> percent/ab/in_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2% -3%)); + +<===> percent/ab/in_range/output.css +a { + value: oklab(1% 0.008 -0.012); + channels: 1% 0.008 -0.012 / 1; +} + +<===> +================================================================================ +<===> percent/ab/above_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 101% 150%)); + +<===> percent/ab/above_range/output.css +a { + value: oklab(1% 0.404 0.6); + channels: 1% 0.404 0.6 / 1; +} + +<===> +================================================================================ +<===> percent/ab/below_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% -101% -150%)); + +<===> percent/ab/below_range/output.css +a { + value: oklab(1% -0.404 -0.6); + channels: 1% -0.404 -0.6 / 1; +} + +<===> +================================================================================ +<===> percent/lightness/in_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2% -3%)); + +<===> percent/lightness/in_range/output.css +a { + value: oklab(1% 0.008 -0.012); + channels: 1% 0.008 -0.012 / 1; +} + +<===> +================================================================================ +<===> percent/lightness/above_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(110% 2 3)); + +<===> percent/lightness/above_range/output.css +a { + value: oklab(100% 2 3); + channels: 100% 2 3 / 1; +} + +<===> +================================================================================ +<===> percent/lightness/below_range/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(-1% 2 3)); + +<===> percent/lightness/below_range/output.css +a { + value: oklab(0% 2 3); + channels: 0% 2 3 / 1; +} + +<===> +================================================================================ +<===> none/lightness/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(none 2 3)); + +<===> none/lightness/output.css +a { + value: oklab(none 2 3); + channels: none 2 3 / 1; +} + +<===> +================================================================================ +<===> none/a/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% none 3)); + +<===> none/a/output.css +a { + value: oklab(1% none 3); + channels: 1% none 3 / 1; +} + +<===> +================================================================================ +<===> none/b/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 none)); + +<===> none/b/output.css +a { + value: oklab(1% 2 none); + channels: 1% 2 none / 1; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab($channels: 1% 2 3)); + +<===> named/output.css +a { + value: oklab(1% 2 3); + channels: 1% 2 3 / 1; +} diff --git a/spec/core_functions/color/oklab/options.yml b/spec/core_functions/color/oklab/options.yml new file mode 100644 index 0000000000..99ecec7ed1 --- /dev/null +++ b/spec/core_functions/color/oklab/options.yml @@ -0,0 +1,3 @@ +--- +:ignore_for: +- libsass diff --git a/spec/core_functions/color/oklab/special_functions.hrx b/spec/core_functions/color/oklab/special_functions.hrx new file mode 100644 index 0000000000..089f5057ff --- /dev/null +++ b/spec/core_functions/color/oklab/special_functions.hrx @@ -0,0 +1,142 @@ +<===> calculation/arg_1/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(calc(1px + 1%) 2 3)); + +<===> calculation/arg_1/output.css +a { + value: oklab(calc(1px + 1%) 2 3); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_2/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% calc(1px + 1%) 3)); + +<===> calculation/arg_2/output.css +a { + value: oklab(1% calc(1px + 1%) 3); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_3/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 calc(1px + 1%))); + +<===> calculation/arg_3/output.css +a { + value: oklab(1% 2 calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_4/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 3 / calc(1px + 1%))); + +<===> calculation/arg_4/output.css +a { + value: oklab(1% 2 3/calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_1/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(var(--foo) 2 3)); + +<===> var/arg_1/output.css +a { + value: oklab(var(--foo) 2 3); + type: string; +} + +<===> +================================================================================ +<===> var/arg_2/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% var(--foo) 3)); + +<===> var/arg_2/output.css +a { + value: oklab(1% var(--foo) 3); + type: string; +} + +<===> +================================================================================ +<===> var/arg_3/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 var(--foo))); + +<===> var/arg_3/output.css +a { + value: oklab(1% 2 var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_4/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% 2 3 / var(--foo))); + +<===> var/arg_4/output.css +a { + value: oklab(1% 2 3/var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_2/input.scss +// var() is substituted before parsing, so it may contain multiple arguments. +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(var(--foo) 2)); + +<===> multi_argument_var/1_of_2/output.css +a { + value: oklab(var(--foo) 2); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/2_of_2/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(1% var(--foo))); + +<===> multi_argument_var/2_of_2/output.css +a { + value: oklab(1% var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/no_alpha/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(var(--foo))); + +<===> multi_argument_var/1_of_1/no_alpha/output.css +a { + value: oklab(var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/alpha/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(var(--foo) / 0.4)); + +<===> multi_argument_var/1_of_1/alpha/output.css +a { + value: oklab(var(--foo)/0.4); + type: string; +} diff --git a/spec/core_functions/color/rgb/error/one_arg.hrx b/spec/core_functions/color/rgb/error/one_arg.hrx index b16f12e29e..59b4b91a47 100644 --- a/spec/core_functions/color/rgb/error/one_arg.hrx +++ b/spec/core_functions/color/rgb/error/one_arg.hrx @@ -101,7 +101,7 @@ a { } <===> type/red/error -Error: $channels: Expected red "foo" to be a number. +Error: $channels: Expected red channel to be a number, was "foo". , 2 | b: rgb("foo" 2 3); | ^^^^^^^^^^^^^^ @@ -116,7 +116,7 @@ a { } <===> type/green/error -Error: $channels: Expected green "foo" to be a number. +Error: $channels: Expected green channel to be a number, was "foo". , 2 | b: rgb(1 "foo" 3); | ^^^^^^^^^^^^^^ @@ -131,7 +131,7 @@ a { } <===> type/blue/error -Error: $channels: Expected blue "foo" to be a number. +Error: $channels: Expected blue channel to be a number, was "foo". , 2 | b: rgb(1 2 "foo"); | ^^^^^^^^^^^^^^ @@ -146,7 +146,7 @@ a { } <===> quoted_var_slash/error -Error: $channels: Expected blue "var(--foo) / 0.4" to be a number. +Error: $channels: Expected blue channel to be a number, was "var(--foo) / 0.4". , 2 | b: rgb(1 2 "var(--foo) / 0.4"); | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ From 248e9152b4e2c17edcce9c6d8e57f7d6bb5b982d Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Tue, 10 Oct 2023 13:44:37 -0700 Subject: [PATCH 17/45] Re-enable and expand tests for relative colors (#1947) See #3673 --- .../color/hsl/one_arg/relative_color.hrx | 13 +- spec/core_functions/color/hwb/one_arg.hrx | 148 ++++++++++++++++++ .../color/lab/relative_color.hrx | 146 +++++++++++++++++ spec/core_functions/color/oklab/alpha.hrx | 25 +++ spec/core_functions/color/oklab/no_alpha.hrx | 12 ++ .../color/rgb/one_arg/relative_color.hrx | 16 +- 6 files changed, 345 insertions(+), 15 deletions(-) create mode 100644 spec/core_functions/color/lab/relative_color.hrx diff --git a/spec/core_functions/color/hsl/one_arg/relative_color.hrx b/spec/core_functions/color/hsl/one_arg/relative_color.hrx index 887da29988..94a31093b8 100644 --- a/spec/core_functions/color/hsl/one_arg/relative_color.hrx +++ b/spec/core_functions/color/hsl/one_arg/relative_color.hrx @@ -1,9 +1,3 @@ -<===> options.yml -:todo: -- dart-sass - -<===> -================================================================================ <===> static/alpha/input.scss a {b: hsl(from #aaa h s l / 25%)} @@ -61,7 +55,6 @@ a { b: hsl(from var(--c) h s l); } - <===> ================================================================================ <===> different_case/alpha/input.scss @@ -93,6 +86,12 @@ a { b: hsl(from #aaa h s l / 25%); } +<===> +================================================================================ +<===> error/options.yml +:todo: + - dart-sass + <===> ================================================================================ <===> error/quoted/alpha/input.scss diff --git a/spec/core_functions/color/hwb/one_arg.hrx b/spec/core_functions/color/hwb/one_arg.hrx index b50f23c1e7..5dd6298313 100644 --- a/spec/core_functions/color/hwb/one_arg.hrx +++ b/spec/core_functions/color/hwb/one_arg.hrx @@ -96,3 +96,151 @@ a {b: color.hwb($channels: 180 30% 40% / 0.4)} a { b: hsla(180, 33.3333333333%, 45%, 0.4); } + +<===> +================================================================================ +<===> relative_color/static/alpha/input.scss +a {b: hwb(from #aaa h w b / 25%)} + +<===> relative_color/static/alpha/output.css +a { + b: hwb(from #aaa h w b/25%); +} + +<===> +================================================================================ +<===> relative_color/static/no_alpha/input.scss +a {b: hwb(from #aaa h w b)} + +<===> relative_color/static/no_alpha/output.css +a { + b: hwb(from #aaa h w b); +} + +<===> +================================================================================ +<===> relative_color/calc/alpha/input.scss +a {b: hwb(from #aaa calc(h + 180deg) w b / 25%)} + +<===> relative_color/calc/alpha/output.css +a { + b: hwb(from #aaa calc(h + 180deg) w b/25%); +} + +<===> +================================================================================ +<===> relative_color/calc/no_alpha/input.scss +a {b: hwb(from #aaa calc(h + 180deg) w b)} + +<===> relative_color/calc/no_alpha/output.css +a { + b: hwb(from #aaa calc(h + 180deg) w b); +} + +<===> +================================================================================ +<===> relative_color/var/alpha/input.scss +a {b: hwb(from var(--c) h w b / 25%)} + +<===> relative_color/var/alpha/output.css +a { + b: hwb(from var(--c) h w b/25%); +} + +<===> +================================================================================ +<===> relative_color/var/no_alpha/input.scss +a {b: hwb(from var(--c) h w b)} +<===> relative_color/var/no_alpha/output.css +a { + b: hwb(from var(--c) h w b); +} + +<===> +================================================================================ +<===> relative_color/different_case/alpha/input.scss +a {b: hwb(From #aaa h w b / 25%)} + +<===> relative_color/different_case/alpha/output.css +a { + b: hwb(From #aaa h w b/25%); +} + +<===> +================================================================================ +<===> relative_color/different_case/no_alpha/input.scss +a {b: hwb(From #aaa h w b)} + +<===> relative_color/different_case/no_alpha/output.css +a { + b: hwb(From #aaa h w b); +} + +<===> +================================================================================ +<===> relative_color/slash_list_alpha/input.scss +@use "sass:list"; +a {b: hwb(list.slash(from #aaa h w b, 25%))} + +<===> relative_color/slash_list_alpha/output.css +a { + b: hwb(from #aaa h w b / 25%); +} + +<===> +================================================================================ +<===> relative_color/error/options.yml +:todo: + - dart-sass + +<===> +================================================================================ +<===> relative_color/error/quoted/alpha/input.scss +a {b: hwb("from" #aaa h w b / 25%)} + +<===> relative_color/error/quoted/alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: hwb("from" #aaa h w b / 25%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/error/quoted/no_alpha/input.scss +a {b: hwb("from" #aaa h w b)} + +<===> relative_color/error/quoted/no_alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: hwb("from" #aaa h w b)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/error/wrong_keyword/alpha/input.scss +a {b: hwb(c #aaa h w b / 25%)} + +<===> relative_color/error/wrong_keyword/alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: hwb(c #aaa h w b / 25%)} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/error/wrong_keyword/no_alpha/input.scss +a {b: hwb(c #aaa h w b)} + +<===> relative_color/error/wrong_keyword/no_alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: hwb(c #aaa h w b)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/lab/relative_color.hrx b/spec/core_functions/color/lab/relative_color.hrx new file mode 100644 index 0000000000..e378f93761 --- /dev/null +++ b/spec/core_functions/color/lab/relative_color.hrx @@ -0,0 +1,146 @@ +<===> static/alpha/input.scss +a {b: lab(from #aaa l a b / 25%)} + +<===> static/alpha/output.css +a { + b: lab(from #aaa l a b/25%); +} + +<===> +================================================================================ +<===> static/no_alpha/input.scss +a {b: lab(from #aaa l a b)} + +<===> static/no_alpha/output.css +a { + b: lab(from #aaa l a b); +} + +<===> +================================================================================ +<===> calc/alpha/input.scss +a {b: lab(from #aaa calc(l + 0.2) a b / 25%)} + +<===> calc/alpha/output.css +a { + b: lab(from #aaa calc(l + 0.2) a b/25%); +} + +<===> +================================================================================ +<===> calc/no_alpha/input.scss +a {b: lab(from #aaa calc(l + 0.2) a b)} + +<===> calc/no_alpha/output.css +a { + b: lab(from #aaa calc(l + 0.2) a b); +} + +<===> +================================================================================ +<===> var/alpha/input.scss +a {b: lab(from var(--c) l a b / 25%)} + +<===> var/alpha/output.css +a { + b: lab(from var(--c) l a b/25%); +} + +<===> +================================================================================ +<===> var/no_alpha/input.scss +a {b: lab(from var(--c) l a b)} + +<===> var/no_alpha/output.css +a { + b: lab(from var(--c) l a b); +} + +<===> +================================================================================ +<===> different_case/alpha/input.scss +a {b: lab(From #aaa l a b / 25%)} + +<===> different_case/alpha/output.css +a { + b: lab(From #aaa l a b/25%); +} + +<===> +================================================================================ +<===> different_case/no_alpha/input.scss +a {b: lab(From #aaa l a b)} + +<===> different_case/no_alpha/output.css +a { + b: lab(From #aaa l a b); +} + +<===> +================================================================================ +<===> slash_list_alpha/input.scss +@use "sass:list"; +a {b: lab(list.slash(from #aaa r g b, 25%))} + +<===> slash_list_alpha/output.css +a { + b: lab(from #aaa r g b / 25%); +} + +<===> +================================================================================ +<===> error/options.yml +:todo: + - dart-sass + +<===> +================================================================================ +<===> error/quoted/alpha/input.scss +a {b: lab("from" #aaa l a b / 25%)} + +<===> error/quoted/alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: lab("from" #aaa l a b / 25%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/quoted/no_alpha/input.scss +a {b: lab("from" #aaa l a b)} + +<===> error/quoted/no_alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: lab("from" #aaa l a b)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/wrong_keyword/alpha/input.scss +a {b: lab(c #aaa l a b / 25%)} + +<===> error/wrong_keyword/alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: lab(c #aaa l a b / 25%)} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/wrong_keyword/no_alpha/input.scss +a {b: lab(c #aaa l a b)} + +<===> error/wrong_keyword/no_alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: lab(c #aaa l a b)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/oklab/alpha.hrx b/spec/core_functions/color/oklab/alpha.hrx index 4f245830d1..6ff6a62873 100644 --- a/spec/core_functions/color/oklab/alpha.hrx +++ b/spec/core_functions/color/oklab/alpha.hrx @@ -118,3 +118,28 @@ a { value: oklab(1% 2 3 / none); channels: 1% 2 3 / none; } + +<===> +================================================================================ +<===> relative_color/slash/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(from #aaa l a b / 25%)); + +<===> relative_color/slash/output.css +a { + value: oklab(from #aaa l a b/25%); + type: string; +} + +<===> +================================================================================ +<===> relative_color/slash_list/input.scss +@use 'sass:list'; +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(list.slash(from #aaa l a b, 25%))); + +<===> relative_color/slash_list/output.css +a { + value: oklab(from #aaa l a b / 25%); + type: string; +} diff --git a/spec/core_functions/color/oklab/no_alpha.hrx b/spec/core_functions/color/oklab/no_alpha.hrx index 89c41fc681..ffd32248db 100644 --- a/spec/core_functions/color/oklab/no_alpha.hrx +++ b/spec/core_functions/color/oklab/no_alpha.hrx @@ -176,6 +176,18 @@ a { channels: 1% 2 none / 1; } +<===> +================================================================================ +<===> relative_color/input.scss +@use 'core_functions/color/oklab/utils'; +@include utils.inspect(oklab(from #aaa l a b)); + +<===> relative_color/output.css +a { + value: oklab(from #aaa l a b); + type: string; +} + <===> ================================================================================ <===> named/input.scss diff --git a/spec/core_functions/color/rgb/one_arg/relative_color.hrx b/spec/core_functions/color/rgb/one_arg/relative_color.hrx index f6456407ef..38805f5091 100644 --- a/spec/core_functions/color/rgb/one_arg/relative_color.hrx +++ b/spec/core_functions/color/rgb/one_arg/relative_color.hrx @@ -1,9 +1,3 @@ -<===> options.yml -:todo: -- dart-sass - -<===> -================================================================================ <===> static/alpha/input.scss a {b: rgb(from #aaa r g b / 25%)} @@ -86,13 +80,19 @@ a { ================================================================================ <===> slash_list_alpha/input.scss @use "sass:list"; -a {b: rgb(list.slash(from #aaa h s l, 25%))} +a {b: rgb(list.slash(from #aaa r g b, 25%))} <===> slash_list_alpha/output.css a { - b: rgb(from #aaa h s l / 25%); + b: rgb(from #aaa r g b / 25%); } +<===> +================================================================================ +<===> error/options.yml +:todo: + - dart-sass + <===> ================================================================================ <===> error/quoted/alpha/input.scss From 79d5328d29a8216141aae7f51054fddd67c26324 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Wed, 11 Oct 2023 16:33:32 -0700 Subject: [PATCH 18/45] [Color 4] Add tests for lch() (#1944) --- spec/core_functions/color/lch/README.md | 2 + spec/core_functions/color/lch/_utils.scss | 27 ++ spec/core_functions/color/lch/alpha.hrx | 120 ++++++++ spec/core_functions/color/lch/error.hrx | 272 ++++++++++++++++++ spec/core_functions/color/lch/no_alpha.hrx | 189 ++++++++++++ spec/core_functions/color/lch/options.yml | 3 + .../color/lch/special_functions.hrx | 142 +++++++++ 7 files changed, 755 insertions(+) create mode 100644 spec/core_functions/color/lch/README.md create mode 100644 spec/core_functions/color/lch/_utils.scss create mode 100644 spec/core_functions/color/lch/alpha.hrx create mode 100644 spec/core_functions/color/lch/error.hrx create mode 100644 spec/core_functions/color/lch/no_alpha.hrx create mode 100644 spec/core_functions/color/lch/options.yml create mode 100644 spec/core_functions/color/lch/special_functions.hrx diff --git a/spec/core_functions/color/lch/README.md b/spec/core_functions/color/lch/README.md new file mode 100644 index 0000000000..5117c908e1 --- /dev/null +++ b/spec/core_functions/color/lch/README.md @@ -0,0 +1,2 @@ +Some of the same behavior tested for `lab()` applies to this function as well, +but for terseness' sake isn't tested explicitly. diff --git a/spec/core_functions/color/lch/_utils.scss b/spec/core_functions/color/lch/_utils.scss new file mode 100644 index 0000000000..508c32e306 --- /dev/null +++ b/spec/core_functions/color/lch/_utils.scss @@ -0,0 +1,27 @@ +@use 'sass:color'; +@use 'sass:list'; +@use 'sass:meta'; + +@function -real-channel($color, $channel) { + @if color.is-missing($color, $channel) { + @return none; + } @else { + @return color.channel($color, $channel); + } +} + +@mixin inspect($color) { + a { + value: $color; + @if meta.type-of($color) == string { + type: string; + } @else { + channels: list.slash( + -real-channel($color, 'lightness') + -real-channel($color, 'chroma') + -real-channel($color, 'hue'), + -real-channel($color, 'alpha') + ); + } + } +} diff --git a/spec/core_functions/color/lch/alpha.hrx b/spec/core_functions/color/lch/alpha.hrx new file mode 100644 index 0000000000..170b7b0b63 --- /dev/null +++ b/spec/core_functions/color/lch/alpha.hrx @@ -0,0 +1,120 @@ +<===> transparent/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 3deg / 0)); + +<===> transparent/output.css +a { + value: lch(1% 2 3deg / 0); + channels: 1% 2 3deg / 0; +} + +<===> +================================================================================ +<===> opaque/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 3deg / 1)); + +<===> opaque/output.css +a { + value: lch(1% 2 3deg); + channels: 1% 2 3deg / 1; +} + +<===> +================================================================================ +<===> partial/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 3deg / 0.4)); + +<===> partial/output.css +a { + value: lch(1% 2 3deg / 0.4); + channels: 1% 2 3deg / 0.4; +} + +<===> +================================================================================ +<===> percent/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 3deg / 40%)); + +<===> percent/output.css +a { + value: lch(1% 2 3deg / 0.4); + channels: 1% 2 3deg / 0.4; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch($channels: 1% 2 3deg / 0.4)); + +<===> named/output.css +a { + value: lch(1% 2 3deg / 0.4); + channels: 1% 2 3deg / 0.4; +} + +<===> +================================================================================ +<===> slash_list/input.scss +@use "sass:list"; +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(list.slash(1% 2 3deg, 0.4))); + +<===> slash_list/output.css +a { + value: lch(1% 2 3deg / 0.4); + channels: 1% 2 3deg / 0.4; +} + +<===> +================================================================================ +<===> none/slash/hue/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 none / 0.4)); + +<===> none/slash/hue/output.css +a { + value: lch(1% 2 none / 0.4); + channels: 1% 2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash/alpha/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 3deg / none)); + +<===> none/slash/alpha/output.css +a { + value: lch(1% 2 3deg / none); + channels: 1% 2 3deg / none; +} + +<===> +================================================================================ +<===> none/slash_list/hue/input.scss +@use 'sass:list'; +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(list.slash(1% 2 none, 0.4))); + +<===> none/slash_list/hue/output.css +a { + value: lch(1% 2 none / 0.4); + channels: 1% 2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash_list/alpha/input.scss +@use 'sass:list'; +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(list.slash(1% 2 3deg, none))); + +<===> none/slash_list/alpha/output.css +a { + value: lch(1% 2 3deg / none); + channels: 1% 2 3deg / none; +} diff --git a/spec/core_functions/color/lch/error.hrx b/spec/core_functions/color/lch/error.hrx new file mode 100644 index 0000000000..f79aefbf14 --- /dev/null +++ b/spec/core_functions/color/lch/error.hrx @@ -0,0 +1,272 @@ +<===> unit/lightness/input.scss +a {b: lch(1px 2 3deg)} + +<===> unit/lightness/error +Error: $lightness: Expected 1px to have unit "%" or no units. + , +1 | a {b: lch(1px 2 3deg)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/chroma/input.scss +a {b: lch(1% 2px 3deg)} + +<===> unit/chroma/error +Error: $chroma: Expected 2px to have unit "%" or no units. + , +1 | a {b: lch(1% 2px 3deg)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/hue/unrelated/input.scss +a {b: lch(1% 2 3px)} + +<===> unit/hue/unrelated/error +Error: $hue: Expected 3px to have an angle unit (deg, grad, rad, turn). + , +1 | a {b: lch(1% 2 3px)} + | ^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/hue/percent/input.scss +a {b: lch(1% 2 3%)} + +<===> unit/hue/percent/error +Error: $hue: Expected 3% to have an angle unit (deg, grad, rad, turn). + , +1 | a {b: lch(1% 2 3%)} + | ^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash/input.scss +a {b: lch(1% 2 3deg/0.4px)} + +<===> unit/alpha/slash/error +Error: $alpha: Expected 0.4px to have unit "%" or no units. + , +1 | a {b: lch(1% 2 3deg/0.4px)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: lch(list.slash(1% 2 3deg, 0.4px))} + +<===> unit/alpha/slash_list/error +Error: $alpha: Expected 0.4px to have unit "%" or no units. + , +2 | a {b: lch(list.slash(1% 2 3deg, 0.4px))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/lightness/input.scss +a {b: lch(c 2 3deg)} + +<===> type/lightness/error +Error: $channels: Expected lightness channel to be a number, was c. + , +1 | a {b: lch(c 2 3deg)} + | ^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/chroma/input.scss +a {b: lch(1% c 3deg)} + +<===> type/chroma/error +Error: $channels: Expected chroma channel to be a number, was c. + , +1 | a {b: lch(1% c 3deg)} + | ^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/hue/input.scss +a {b: lch(1% 2 c)} + +<===> type/hue/error +Error: $channels: Expected hue channel to be a number, was c. + , +1 | a {b: lch(1% 2 c)} + | ^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: lch(list.slash(1% 2 3deg, c))} + +<===> type/alpha/slash_list/error +Error: $channels: c is not a number. + , +2 | a {b: lch(list.slash(1% 2 3deg, c))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/bracketed/input.scss +a {b: lch([1% 2 3deg])} + +<===> list/bracketed/error +Error: $channels: Expected an unbracketed list, was [1% 2 3deg] + , +1 | a {b: lch([1% 2 3deg])} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/comma/input.scss +a {b: lch((1%, 2, 3deg))} + +<===> list/comma/error +Error: $channels: Expected a space- or slash-separated list, was (1%, 2, 3deg) + , +1 | a {b: lch((1%, 2, 3deg))} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/three/input.scss +@use 'sass:list'; +a {b: lch(list.slash(1%, 2, 3deg))} + +<===> list/slash/three/error +Error: $channels: Only 2 slash-separated elements allowed, but 3 were passed. + , +2 | a {b: lch(list.slash(1%, 2, 3deg))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/one/input.scss +@use 'sass:list'; +$single-arg-slash-separated: list.append((), 1% 2 3deg, $separator: slash); +a {b: lch($single-arg-slash-separated)} + +<===> list/slash/one/error +Error: $channels: Only 2 slash-separated elements allowed, but 1 was passed. + , +3 | a {b: lch($single-arg-slash-separated)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/empty/input.scss +a {b: lch(())} + +<===> list/empty/error +Error: $channels: Color component list may not be empty. + , +1 | a {b: lch(())} + | ^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/empty_space/input.scss +@use 'sass:list'; +$empty-space: list.join((), (), $separator: space); +a {b: lch(())} + +<===> list/empty_space/error +Error: $channels: Color component list may not be empty. + , +3 | a {b: lch(())} + | ^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/too_few_channels/input.scss +a {b: lch(1% 2)} + +<===> list/too_few_channels/error +Error: $channels: The lch color space has 3 channels but (1% 2) has 2. + , +1 | a {b: lch(1% 2)} + | ^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/too_many_channels/input.scss +a {b: lch(1% 2 3deg 0.4)} + +<===> list/too_many_channels/error +Error: $channels: The lch color space has 3 channels but (1% 2 3deg 0.4) has 4. + , +1 | a {b: lch(1% 2 3deg 0.4)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/input.scss +a {b: lch()} + +<===> too_few_args/error +Error: Missing argument $channels. + ,--> input.scss +1 | a {b: lch()} + | ^^^^^ invocation + ' + ,--> sass:color +1 | @function lch($channels) { + | ============== declaration + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +a {b: lch(1%, 2, 3deg, 0.4)} + +<===> too_many_args/error +Error: Only 1 argument allowed, but 4 were passed. + ,--> input.scss +1 | a {b: lch(1%, 2, 3deg, 0.4)} + | ^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function lch($channels) { + | ============== declaration + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/lch/no_alpha.hrx b/spec/core_functions/color/lch/no_alpha.hrx new file mode 100644 index 0000000000..65fc7e78b1 --- /dev/null +++ b/spec/core_functions/color/lch/no_alpha.hrx @@ -0,0 +1,189 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1 2 3deg)); + +<===> unitless/in_range/output.css +a { + value: lch(1% 2 3deg); + channels: 1% 2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(101 2 3deg)); + +<===> unitless/lightness/above_range/output.css +a { + value: lch(100% 2 3deg); + channels: 100% 2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(-1 2 3deg)); + +<===> unitless/lightness/below_range/output.css +a { + value: lch(0% 2 3deg); + channels: 0% 2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/chroma/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 0.5 3deg)); + +<===> unitless/chroma/above_range/output.css +a { + value: lch(1% 0.5 3deg); + channels: 1% 0.5 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/chroma/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% -0.1 3deg)); + +<===> unitless/chroma/below_range/output.css +a { + value: lch(1% -0.1 3deg); + channels: 1% -0.1 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/hue/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 361deg)); + +<===> unitless/hue/above_range/output.css +a { + value: lch(1% 2 1deg); + channels: 1% 2 1deg / 1; +} + +<===> +================================================================================ +<===> unitless/hue/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 -1deg)); + +<===> unitless/hue/below_range/output.css +a { + value: lch(1% 2 359deg); + channels: 1% 2 359deg / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2% 3deg)); + +<===> percent/in_range/output.css +a { + value: lch(1% 3 3deg); + channels: 1% 3 3deg / 1; +} + +<===> +================================================================================ +<===> percent/lightness/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(110% 2 3deg)); + +<===> percent/lightness/above_range/output.css +a { + value: lch(100% 2 3deg); + channels: 100% 2 3deg / 1; +} + +<===> +================================================================================ +<===> percent/lightness/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(-1% 2 3deg)); + +<===> percent/lightness/below_range/output.css +a { + value: lch(0% 2 3deg); + channels: 0% 2 3deg / 1; +} + +<===> +================================================================================ +<===> percent/chroma/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 101% 3deg)); + +<===> percent/chroma/above_range/output.css +a { + value: lch(1% 151.5 3deg); + channels: 1% 151.5 3deg / 1; +} + +<===> +================================================================================ +<===> percent/chroma/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% -1% 3deg)); + +<===> percent/chroma/below_range/output.css +a { + value: lch(1% -1.5 3deg); + channels: 1% -1.5 3deg / 1; +} + +<===> +================================================================================ +<===> none/lightness/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(none 2 3deg)); + +<===> none/lightness/output.css +a { + value: lch(none 2 3deg); + channels: none 2 3deg / 1; +} + +<===> +================================================================================ +<===> none/chroma/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% none 3deg)); + +<===> none/chroma/output.css +a { + value: lch(1% none 3deg); + channels: 1% none 3deg / 1; +} + +<===> +================================================================================ +<===> none/hue/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 none)); + +<===> none/hue/output.css +a { + value: lch(1% 2 none); + channels: 1% 2 none / 1; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch($channels: 1% 2 3deg)); + +<===> named/output.css +a { + value: lch(1% 2 3deg); + channels: 1% 2 3deg / 1; +} diff --git a/spec/core_functions/color/lch/options.yml b/spec/core_functions/color/lch/options.yml new file mode 100644 index 0000000000..99ecec7ed1 --- /dev/null +++ b/spec/core_functions/color/lch/options.yml @@ -0,0 +1,3 @@ +--- +:ignore_for: +- libsass diff --git a/spec/core_functions/color/lch/special_functions.hrx b/spec/core_functions/color/lch/special_functions.hrx new file mode 100644 index 0000000000..afcf9f8134 --- /dev/null +++ b/spec/core_functions/color/lch/special_functions.hrx @@ -0,0 +1,142 @@ +<===> calculation/arg_1/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(calc(1px + 1%) 2 3deg)); + +<===> calculation/arg_1/output.css +a { + value: lch(calc(1px + 1%) 2 3deg); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_2/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% calc(1px + 1%) 3deg)); + +<===> calculation/arg_2/output.css +a { + value: lch(1% calc(1px + 1%) 3deg); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_3/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 calc(1px + 1%))); + +<===> calculation/arg_3/output.css +a { + value: lch(1% 2 calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_4/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 3deg / calc(1px + 1%))); + +<===> calculation/arg_4/output.css +a { + value: lch(1% 2 3deg/calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_1/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(var(--foo) 2 3deg)); + +<===> var/arg_1/output.css +a { + value: lch(var(--foo) 2 3deg); + type: string; +} + +<===> +================================================================================ +<===> var/arg_2/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% var(--foo) 3deg)); + +<===> var/arg_2/output.css +a { + value: lch(1% var(--foo) 3deg); + type: string; +} + +<===> +================================================================================ +<===> var/arg_3/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 var(--foo))); + +<===> var/arg_3/output.css +a { + value: lch(1% 2 var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_4/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% 2 3deg / var(--foo))); + +<===> var/arg_4/output.css +a { + value: lch(1% 2 3deg/var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_2/input.scss +// var() is substituted before parsing, so it may contain multiple arguments. +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(var(--foo) 2deg)); + +<===> multi_argument_var/1_of_2/output.css +a { + value: lch(var(--foo) 2deg); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/2_of_2/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(1% var(--foo))); + +<===> multi_argument_var/2_of_2/output.css +a { + value: lch(1% var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/no_alpha/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(var(--foo))); + +<===> multi_argument_var/1_of_1/no_alpha/output.css +a { + value: lch(var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/alpha/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(lch(var(--foo) / 0.4)); + +<===> multi_argument_var/1_of_1/alpha/output.css +a { + value: lch(var(--foo)/0.4); + type: string; +} From 4ea6c4516fefdd68ff70d9d08dd4edcc13fa4fdc Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 13 Oct 2023 14:16:47 -0700 Subject: [PATCH 19/45] [Color 4] Add tests for the color() function (#1943) --- spec/core_functions/color/color/README.md | 2 + .../color/color/_rgb-utils.scss | 27 ++ .../color/color/_xyz-utils.scss | 27 ++ spec/core_functions/color/color/alpha.hrx | 145 +++++++++ spec/core_functions/color/color/error.hrx | 279 ++++++++++++++++++ spec/core_functions/color/color/no_alpha.hrx | 69 +++++ spec/core_functions/color/color/options.yml | 3 + .../color/color/spaces/a98_rgb.hrx | 165 +++++++++++ .../color/color/spaces/display_p3.hrx | 165 +++++++++++ .../color/color/spaces/prophoto_rgb.hrx | 165 +++++++++++ .../color/color/spaces/rec2020.hrx | 165 +++++++++++ .../color/color/spaces/srgb.hrx | 165 +++++++++++ .../color/color/spaces/srgb_linear.hrx | 165 +++++++++++ .../core_functions/color/color/spaces/xyz.hrx | 177 +++++++++++ .../color/color/spaces/xyz_d50.hrx | 165 +++++++++++ .../color/color/special_functions.hrx | 142 +++++++++ 16 files changed, 2026 insertions(+) create mode 100644 spec/core_functions/color/color/README.md create mode 100644 spec/core_functions/color/color/_rgb-utils.scss create mode 100644 spec/core_functions/color/color/_xyz-utils.scss create mode 100644 spec/core_functions/color/color/alpha.hrx create mode 100644 spec/core_functions/color/color/error.hrx create mode 100644 spec/core_functions/color/color/no_alpha.hrx create mode 100644 spec/core_functions/color/color/options.yml create mode 100644 spec/core_functions/color/color/spaces/a98_rgb.hrx create mode 100644 spec/core_functions/color/color/spaces/display_p3.hrx create mode 100644 spec/core_functions/color/color/spaces/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/color/spaces/rec2020.hrx create mode 100644 spec/core_functions/color/color/spaces/srgb.hrx create mode 100644 spec/core_functions/color/color/spaces/srgb_linear.hrx create mode 100644 spec/core_functions/color/color/spaces/xyz.hrx create mode 100644 spec/core_functions/color/color/spaces/xyz_d50.hrx create mode 100644 spec/core_functions/color/color/special_functions.hrx diff --git a/spec/core_functions/color/color/README.md b/spec/core_functions/color/color/README.md new file mode 100644 index 0000000000..5117c908e1 --- /dev/null +++ b/spec/core_functions/color/color/README.md @@ -0,0 +1,2 @@ +Some of the same behavior tested for `lab()` applies to this function as well, +but for terseness' sake isn't tested explicitly. diff --git a/spec/core_functions/color/color/_rgb-utils.scss b/spec/core_functions/color/color/_rgb-utils.scss new file mode 100644 index 0000000000..266f547729 --- /dev/null +++ b/spec/core_functions/color/color/_rgb-utils.scss @@ -0,0 +1,27 @@ +@use 'sass:color'; +@use 'sass:list'; +@use 'sass:meta'; + +@function -real-channel($color, $channel) { + @if color.is-missing($color, $channel) { + @return none; + } @else { + @return color.channel($color, $channel); + } +} + +@mixin inspect($color) { + a { + value: $color; + @if meta.type-of($color) == string { + type: string; + } @else { + channels: list.slash( + -real-channel($color, 'red') + -real-channel($color, 'green') + -real-channel($color, 'blue'), + -real-channel($color, 'alpha') + ); + } + } +} diff --git a/spec/core_functions/color/color/_xyz-utils.scss b/spec/core_functions/color/color/_xyz-utils.scss new file mode 100644 index 0000000000..8290223bd8 --- /dev/null +++ b/spec/core_functions/color/color/_xyz-utils.scss @@ -0,0 +1,27 @@ +@use 'sass:color'; +@use 'sass:list'; +@use 'sass:meta'; + +@function -real-channel($color, $channel) { + @if color.is-missing($color, $channel) { + @return none; + } @else { + @return color.channel($color, $channel); + } +} + +@mixin inspect($color) { + a { + value: $color; + @if meta.type-of($color) == string { + type: string; + } @else { + channels: list.slash( + -real-channel($color, 'x') + -real-channel($color, 'y') + -real-channel($color, 'z'), + -real-channel($color, 'alpha') + ); + } + } +} diff --git a/spec/core_functions/color/color/alpha.hrx b/spec/core_functions/color/color/alpha.hrx new file mode 100644 index 0000000000..3e672f8257 --- /dev/null +++ b/spec/core_functions/color/color/alpha.hrx @@ -0,0 +1,145 @@ +<===> transparent/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / 0)); + +<===> transparent/output.css +a { + value: color(srgb 0.1 0.2 0.3 / 0); + channels: 0.1 0.2 0.3 / 0; +} + +<===> +================================================================================ +<===> opaque/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / 1)); + +<===> opaque/output.css +a { + value: color(srgb 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> partial/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / 0.4)); + +<===> partial/output.css +a { + value: color(srgb 0.1 0.2 0.3 / 0.4); + channels: 0.1 0.2 0.3 / 0.4; +} + +<===> +================================================================================ +<===> percent/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / 40%)); + +<===> percent/output.css +a { + value: color(srgb 0.1 0.2 0.3 / 0.4); + channels: 0.1 0.2 0.3 / 0.4; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color($description: srgb 0.1 0.2 0.3 / 0.4)); + +<===> named/output.css +a { + value: color(srgb 0.1 0.2 0.3 / 0.4); + channels: 0.1 0.2 0.3 / 0.4; +} + +<===> +================================================================================ +<===> slash_list/input.scss +@use "sass:list"; +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(list.slash(srgb 0.1 0.2 0.3, 0.4))); + +<===> slash_list/output.css +a { + value: color(srgb 0.1 0.2 0.3 / 0.4); + channels: 0.1 0.2 0.3 / 0.4; +} + +<===> +================================================================================ +<===> none/slash/blue/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 none / 0.4)); + +<===> none/slash/blue/output.css +a { + value: color(srgb 0.1 0.2 none / 0.4); + channels: 0.1 0.2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash/alpha/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / none)); + +<===> none/slash/alpha/output.css +a { + value: color(srgb 0.1 0.2 0.3 / none); + channels: 0.1 0.2 0.3 / none; +} + +<===> +================================================================================ +<===> none/slash_list/blue/input.scss +@use 'sass:list'; +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(list.slash(srgb 0.1 0.2 none, 0.4))); + +<===> none/slash_list/blue/output.css +a { + value: color(srgb 0.1 0.2 none / 0.4); + channels: 0.1 0.2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash_list/alpha/input.scss +@use 'sass:list'; +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(list.slash(srgb 0.1 0.2 0.3, none))); + +<===> none/slash_list/alpha/output.css +a { + value: color(srgb 0.1 0.2 0.3 / none); + channels: 0.1 0.2 0.3 / none; +} + +<===> +================================================================================ +<===> relative_color/slash/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(from #aaa srgb r g b / 25%)); + +<===> relative_color/slash/output.css +a { + value: color(from #aaa srgb r g b/25%); + type: string; +} + +<===> +================================================================================ +<===> relative_color/slash_list/input.scss +@use 'sass:list'; +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(list.slash(from #aaa srgb r g b, 25%))); + +<===> relative_color/slash_list/output.css +a { + value: color(from #aaa srgb r g b / 25%); + type: string; +} diff --git a/spec/core_functions/color/color/error.hrx b/spec/core_functions/color/color/error.hrx new file mode 100644 index 0000000000..7bf9c7c8c4 --- /dev/null +++ b/spec/core_functions/color/color/error.hrx @@ -0,0 +1,279 @@ +<===> unit/red/input.scss +a {b: color(srgb 0.1px 0.2 0.3)} + +<===> unit/red/error +Error: $red: Expected 0.1px to have unit "%" or no units. + , +1 | a {b: color(srgb 0.1px 0.2 0.3)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/green/input.scss +a {b: color(srgb 0.1 0.2px 0.3)} + +<===> unit/green/error +Error: $green: Expected 0.2px to have unit "%" or no units. + , +1 | a {b: color(srgb 0.1 0.2px 0.3)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/blue/input.scss +a {b: color(srgb 0.1 0.2 0.3px)} + +<===> unit/blue/error +Error: $blue: Expected 0.3px to have unit "%" or no units. + , +1 | a {b: color(srgb 0.1 0.2 0.3px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash/input.scss +a {b: color(srgb 0.1 0.2 0.3/0.4px)} + +<===> unit/alpha/slash/error +Error: $alpha: Expected 0.4px to have unit "%" or no units. + , +1 | a {b: color(srgb 0.1 0.2 0.3/0.4px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: color(list.slash(srgb 0.1 0.2 0.3, 0.4px))} + +<===> unit/alpha/slash_list/error +Error: $alpha: Expected 0.4px to have unit "%" or no units. + , +2 | a {b: color(list.slash(srgb 0.1 0.2 0.3, 0.4px))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/red/input.scss +a {b: color(srgb c 0.2 0.3)} + +<===> type/red/error +Error: $description: Expected red channel to be a number, was c. + , +1 | a {b: color(srgb c 0.2 0.3)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/green/input.scss +a {b: color(srgb 0.1 c 0.3)} + +<===> type/green/error +Error: $description: Expected green channel to be a number, was c. + , +1 | a {b: color(srgb 0.1 c 0.3)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/blue/input.scss +a {b: color(srgb 0.1 0.2 c)} + +<===> type/blue/error +Error: $description: Expected blue channel to be a number, was c. + , +1 | a {b: color(srgb 0.1 0.2 c)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: color(list.slash(srgb 0.1 0.2 0.3, c))} + +<===> type/alpha/slash_list/error +Error: $description: c is not a number. + , +2 | a {b: color(list.slash(srgb 0.1 0.2 0.3, c))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/bracketed/input.scss +a {b: color([srgb 0.1 0.2 0.3])} + +<===> list/bracketed/error +Error: $description: Expected an unbracketed list, was [srgb 0.1 0.2 0.3] + , +1 | a {b: color([srgb 0.1 0.2 0.3])} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/comma/input.scss +a {b: color((srgb, 0.1, 0.2, 0.3))} + +<===> list/comma/error +Error: $description: Expected a space- or slash-separated list, was (srgb, 0.1, 0.2, 0.3) + , +1 | a {b: color((srgb, 0.1, 0.2, 0.3))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/three/input.scss +@use 'sass:list'; +a {b: color(list.slash(srgb 0.1, 0.2, 0.3))} + +<===> list/slash/three/error +Error: $description: Only 2 slash-separated elements allowed, but 3 were passed. + , +2 | a {b: color(list.slash(srgb 0.1, 0.2, 0.3))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/one/input.scss +@use 'sass:list'; +$single-arg-slash-separated: list.append((), srgb 0.1 0.2 0.3, $separator: slash); +a {b: color($single-arg-slash-separated)} + +<===> list/slash/one/error +Error: $description: Only 2 slash-separated elements allowed, but 1 was passed. + , +3 | a {b: color($single-arg-slash-separated)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/after_space/input.scss +a {b: color(srgb (0.1 0.2 0.3))} + +<===> list/after_space/error +Error: $description: Expected red channel to be a number, was (0.1 0.2 0.3). + , +1 | a {b: color(srgb (0.1 0.2 0.3))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/too_few_channels/input.scss +a {b: color(srgb 0.1 0.2)} + +<===> list/too_few_channels/error +Error: $description: The srgb color space has 3 channels but (srgb 0.1 0.2) has 2. + , +1 | a {b: color(srgb 0.1 0.2)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/too_many_channels/input.scss +a {b: color(srgb 0.1 0.2 0.3 0.4)} + +<===> list/too_many_channels/error +Error: $description: The srgb color space has 3 channels but (srgb 0.1 0.2 0.3 0.4) has 4. + , +1 | a {b: color(srgb 0.1 0.2 0.3 0.4)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/no_channels/input.scss +a {b: color(srgb)} + +<===> too_few_args/no_channels/error +Error: $description: The srgb color space has 3 channels but srgb has 0. + , +1 | a {b: color(srgb)} + | ^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/no_space/input.scss +a {b: color(1 2 3)} + +<===> too_few_args/no_space/error +Error: $description: 1 is not a string. + , +1 | a {b: color(1 2 3)} + | ^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/none/input.scss +a {b: color()} + +<===> too_few_args/none/error +Error: Missing argument $description. + ,--> input.scss +1 | a {b: color()} + | ^^^^^^^ invocation + ' + ,--> sass:color +1 | @function color($description) { + | =================== declaration + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +a {b: color(srgb 0.1 0.2 0.3 0.4)} + +<===> too_many_args/error +Error: $description: The srgb color space has 3 channels but (srgb 0.1 0.2 0.3 0.4) has 4. + , +1 | a {b: color(srgb 0.1 0.2 0.3 0.4)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unknown_space/input.scss +a {b: color(foo 1 2 3)} + +<===> unknown_space/error +Error: $description: Unknown color space "foo". + , +1 | a {b: color(foo 1 2 3)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/color/no_alpha.hrx b/spec/core_functions/color/color/no_alpha.hrx new file mode 100644 index 0000000000..2180771263 --- /dev/null +++ b/spec/core_functions/color/color/no_alpha.hrx @@ -0,0 +1,69 @@ +<===> none/red/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb none 0.2 0.3)); + +<===> none/red/output.css +a { + value: color(srgb none 0.2 0.3); + channels: none 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> none/green/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 none 0.3)); + +<===> none/green/output.css +a { + value: color(srgb 0.1 none 0.3); + channels: 0.1 none 0.3 / 1; +} + +<===> +================================================================================ +<===> none/blue/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 none 0.3)); + +<===> none/blue/output.css +a { + value: color(srgb 0.1 none 0.3); + channels: 0.1 none 0.3 / 1; +} + +<===> +================================================================================ +<===> case/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(sRGB 0.1 none 0.3)); + +<===> case/output.css +a { + value: color(srgb 0.1 none 0.3); + channels: 0.1 none 0.3 / 1; +} + +<===> +================================================================================ +<===> relative_color/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(from #aaa srgb r g b)); + +<===> relative_color/output.css +a { + value: color(from #aaa srgb r g b); + type: string; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color($description: srgb 0.1 0.2 0.3)); + +<===> named/output.css +a { + value: color(srgb 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} diff --git a/spec/core_functions/color/color/options.yml b/spec/core_functions/color/color/options.yml new file mode 100644 index 0000000000..99ecec7ed1 --- /dev/null +++ b/spec/core_functions/color/color/options.yml @@ -0,0 +1,3 @@ +--- +:ignore_for: +- libsass diff --git a/spec/core_functions/color/color/spaces/a98_rgb.hrx b/spec/core_functions/color/color/spaces/a98_rgb.hrx new file mode 100644 index 0000000000..2c073216f6 --- /dev/null +++ b/spec/core_functions/color/color/spaces/a98_rgb.hrx @@ -0,0 +1,165 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 0.3)); + +<===> unitless/in_range/output.css +a { + value: color(a98-rgb 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 1.1 0.2 0.3)); + +<===> unitless/red/above_range/output.css +a { + value: color(a98-rgb 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb -0.1 0.2 0.3)); + +<===> unitless/red/below_range/output.css +a { + value: color(a98-rgb -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 1.2 0.3)); + +<===> unitless/green/above_range/output.css +a { + value: color(a98-rgb 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 -0.2 0.3)); + +<===> unitless/green/below_range/output.css +a { + value: color(a98-rgb 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 1.3)); + +<===> unitless/blue/above_range/output.css +a { + value: color(a98-rgb 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 -0.3)); + +<===> unitless/blue/below_range/output.css +a { + value: color(a98-rgb 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 10% 20% 30%)); + +<===> percent/in_range/output.css +a { + value: color(a98-rgb 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 110% 0.2 0.3)); + +<===> percent/red/above_range/output.css +a { + value: color(a98-rgb 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb -10% 0.2 0.3)); + +<===> percent/red/below_range/output.css +a { + value: color(a98-rgb -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 120% 0.3)); + +<===> percent/green/above_range/output.css +a { + value: color(a98-rgb 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 -20% 0.3)); + +<===> percent/green/below_range/output.css +a { + value: color(a98-rgb 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 130%)); + +<===> percent/blue/above_range/output.css +a { + value: color(a98-rgb 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 -30%)); + +<===> percent/blue/below_range/output.css +a { + value: color(a98-rgb 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} diff --git a/spec/core_functions/color/color/spaces/display_p3.hrx b/spec/core_functions/color/color/spaces/display_p3.hrx new file mode 100644 index 0000000000..a7ae005057 --- /dev/null +++ b/spec/core_functions/color/color/spaces/display_p3.hrx @@ -0,0 +1,165 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 0.2 0.3)); + +<===> unitless/in_range/output.css +a { + value: color(display-p3 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 1.1 0.2 0.3)); + +<===> unitless/red/above_range/output.css +a { + value: color(display-p3 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 -0.1 0.2 0.3)); + +<===> unitless/red/below_range/output.css +a { + value: color(display-p3 -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 1.2 0.3)); + +<===> unitless/green/above_range/output.css +a { + value: color(display-p3 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 -0.2 0.3)); + +<===> unitless/green/below_range/output.css +a { + value: color(display-p3 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 0.2 1.3)); + +<===> unitless/blue/above_range/output.css +a { + value: color(display-p3 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 0.2 -0.3)); + +<===> unitless/blue/below_range/output.css +a { + value: color(display-p3 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 10% 20% 30%)); + +<===> percent/in_range/output.css +a { + value: color(display-p3 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 110% 0.2 0.3)); + +<===> percent/red/above_range/output.css +a { + value: color(display-p3 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 -10% 0.2 0.3)); + +<===> percent/red/below_range/output.css +a { + value: color(display-p3 -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 120% 0.3)); + +<===> percent/green/above_range/output.css +a { + value: color(display-p3 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 -20% 0.3)); + +<===> percent/green/below_range/output.css +a { + value: color(display-p3 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 0.2 130%)); + +<===> percent/blue/above_range/output.css +a { + value: color(display-p3 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(display-p3 0.1 0.2 -30%)); + +<===> percent/blue/below_range/output.css +a { + value: color(display-p3 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} diff --git a/spec/core_functions/color/color/spaces/prophoto_rgb.hrx b/spec/core_functions/color/color/spaces/prophoto_rgb.hrx new file mode 100644 index 0000000000..080f28eb0c --- /dev/null +++ b/spec/core_functions/color/color/spaces/prophoto_rgb.hrx @@ -0,0 +1,165 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 0.3)); + +<===> unitless/in_range/output.css +a { + value: color(prophoto-rgb 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 1.1 0.2 0.3)); + +<===> unitless/red/above_range/output.css +a { + value: color(prophoto-rgb 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb -0.1 0.2 0.3)); + +<===> unitless/red/below_range/output.css +a { + value: color(prophoto-rgb -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 1.2 0.3)); + +<===> unitless/green/above_range/output.css +a { + value: color(prophoto-rgb 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 -0.2 0.3)); + +<===> unitless/green/below_range/output.css +a { + value: color(prophoto-rgb 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 1.3)); + +<===> unitless/blue/above_range/output.css +a { + value: color(prophoto-rgb 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 -0.3)); + +<===> unitless/blue/below_range/output.css +a { + value: color(prophoto-rgb 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 10% 20% 30%)); + +<===> percent/in_range/output.css +a { + value: color(prophoto-rgb 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 110% 0.2 0.3)); + +<===> percent/red/above_range/output.css +a { + value: color(prophoto-rgb 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb -10% 0.2 0.3)); + +<===> percent/red/below_range/output.css +a { + value: color(prophoto-rgb -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 120% 0.3)); + +<===> percent/green/above_range/output.css +a { + value: color(prophoto-rgb 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 -20% 0.3)); + +<===> percent/green/below_range/output.css +a { + value: color(prophoto-rgb 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 130%)); + +<===> percent/blue/above_range/output.css +a { + value: color(prophoto-rgb 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 -30%)); + +<===> percent/blue/below_range/output.css +a { + value: color(prophoto-rgb 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} diff --git a/spec/core_functions/color/color/spaces/rec2020.hrx b/spec/core_functions/color/color/spaces/rec2020.hrx new file mode 100644 index 0000000000..c5df2d5f1f --- /dev/null +++ b/spec/core_functions/color/color/spaces/rec2020.hrx @@ -0,0 +1,165 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 0.2 0.3)); + +<===> unitless/in_range/output.css +a { + value: color(rec2020 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 1.1 0.2 0.3)); + +<===> unitless/red/above_range/output.css +a { + value: color(rec2020 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 -0.1 0.2 0.3)); + +<===> unitless/red/below_range/output.css +a { + value: color(rec2020 -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 1.2 0.3)); + +<===> unitless/green/above_range/output.css +a { + value: color(rec2020 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 -0.2 0.3)); + +<===> unitless/green/below_range/output.css +a { + value: color(rec2020 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 0.2 1.3)); + +<===> unitless/blue/above_range/output.css +a { + value: color(rec2020 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 0.2 -0.3)); + +<===> unitless/blue/below_range/output.css +a { + value: color(rec2020 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 10% 20% 30%)); + +<===> percent/in_range/output.css +a { + value: color(rec2020 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 110% 0.2 0.3)); + +<===> percent/red/above_range/output.css +a { + value: color(rec2020 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 -10% 0.2 0.3)); + +<===> percent/red/below_range/output.css +a { + value: color(rec2020 -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 120% 0.3)); + +<===> percent/green/above_range/output.css +a { + value: color(rec2020 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 -20% 0.3)); + +<===> percent/green/below_range/output.css +a { + value: color(rec2020 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 0.2 130%)); + +<===> percent/blue/above_range/output.css +a { + value: color(rec2020 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(rec2020 0.1 0.2 -30%)); + +<===> percent/blue/below_range/output.css +a { + value: color(rec2020 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} diff --git a/spec/core_functions/color/color/spaces/srgb.hrx b/spec/core_functions/color/color/spaces/srgb.hrx new file mode 100644 index 0000000000..6f3ac5d2ec --- /dev/null +++ b/spec/core_functions/color/color/spaces/srgb.hrx @@ -0,0 +1,165 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3)); + +<===> unitless/in_range/output.css +a { + value: color(srgb 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 1.1 0.2 0.3)); + +<===> unitless/red/above_range/output.css +a { + value: color(srgb 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb -0.1 0.2 0.3)); + +<===> unitless/red/below_range/output.css +a { + value: color(srgb -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 1.2 0.3)); + +<===> unitless/green/above_range/output.css +a { + value: color(srgb 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 -0.2 0.3)); + +<===> unitless/green/below_range/output.css +a { + value: color(srgb 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 1.3)); + +<===> unitless/blue/above_range/output.css +a { + value: color(srgb 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 -0.3)); + +<===> unitless/blue/below_range/output.css +a { + value: color(srgb 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 10% 20% 30%)); + +<===> percent/in_range/output.css +a { + value: color(srgb 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 110% 0.2 0.3)); + +<===> percent/red/above_range/output.css +a { + value: color(srgb 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb -10% 0.2 0.3)); + +<===> percent/red/below_range/output.css +a { + value: color(srgb -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 120% 0.3)); + +<===> percent/green/above_range/output.css +a { + value: color(srgb 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 -20% 0.3)); + +<===> percent/green/below_range/output.css +a { + value: color(srgb 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 130%)); + +<===> percent/blue/above_range/output.css +a { + value: color(srgb 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 -30%)); + +<===> percent/blue/below_range/output.css +a { + value: color(srgb 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} diff --git a/spec/core_functions/color/color/spaces/srgb_linear.hrx b/spec/core_functions/color/color/spaces/srgb_linear.hrx new file mode 100644 index 0000000000..9bb3cea1ca --- /dev/null +++ b/spec/core_functions/color/color/spaces/srgb_linear.hrx @@ -0,0 +1,165 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 0.3)); + +<===> unitless/in_range/output.css +a { + value: color(srgb-linear 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 1.1 0.2 0.3)); + +<===> unitless/red/above_range/output.css +a { + value: color(srgb-linear 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear -0.1 0.2 0.3)); + +<===> unitless/red/below_range/output.css +a { + value: color(srgb-linear -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 1.2 0.3)); + +<===> unitless/green/above_range/output.css +a { + value: color(srgb-linear 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 -0.2 0.3)); + +<===> unitless/green/below_range/output.css +a { + value: color(srgb-linear 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 1.3)); + +<===> unitless/blue/above_range/output.css +a { + value: color(srgb-linear 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> unitless/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 -0.3)); + +<===> unitless/blue/below_range/output.css +a { + value: color(srgb-linear 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 10% 20% 30%)); + +<===> percent/in_range/output.css +a { + value: color(srgb-linear 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 110% 0.2 0.3)); + +<===> percent/red/above_range/output.css +a { + value: color(srgb-linear 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/red/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear -10% 0.2 0.3)); + +<===> percent/red/below_range/output.css +a { + value: color(srgb-linear -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 120% 0.3)); + +<===> percent/green/above_range/output.css +a { + value: color(srgb-linear 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/green/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 -20% 0.3)); + +<===> percent/green/below_range/output.css +a { + value: color(srgb-linear 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/above_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 130%)); + +<===> percent/blue/above_range/output.css +a { + value: color(srgb-linear 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> percent/blue/below_range/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 -30%)); + +<===> percent/blue/below_range/output.css +a { + value: color(srgb-linear 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} diff --git a/spec/core_functions/color/color/spaces/xyz.hrx b/spec/core_functions/color/color/spaces/xyz.hrx new file mode 100644 index 0000000000..8970c45322 --- /dev/null +++ b/spec/core_functions/color/color/spaces/xyz.hrx @@ -0,0 +1,177 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 0.2 0.3)); + +<===> unitless/in_range/output.css +a { + value: color(xyz 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/x/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 1.1 0.2 0.3)); + +<===> unitless/x/above_range/output.css +a { + value: color(xyz 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/x/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz -0.1 0.2 0.3)); + +<===> unitless/x/below_range/output.css +a { + value: color(xyz -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/y/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 1.2 0.3)); + +<===> unitless/y/above_range/output.css +a { + value: color(xyz 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/y/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 -0.2 0.3)); + +<===> unitless/y/below_range/output.css +a { + value: color(xyz 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/z/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 0.2 1.3)); + +<===> unitless/z/above_range/output.css +a { + value: color(xyz 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> unitless/z/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 0.2 -0.3)); + +<===> unitless/z/below_range/output.css +a { + value: color(xyz 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 10% 20% 30%)); + +<===> percent/in_range/output.css +a { + value: color(xyz 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/x/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 110% 0.2 0.3)); + +<===> percent/x/above_range/output.css +a { + value: color(xyz 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/x/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz -10% 0.2 0.3)); + +<===> percent/x/below_range/output.css +a { + value: color(xyz -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/y/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 120% 0.3)); + +<===> percent/y/above_range/output.css +a { + value: color(xyz 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/y/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 -20% 0.3)); + +<===> percent/y/below_range/output.css +a { + value: color(xyz 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/z/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 0.2 130%)); + +<===> percent/z/above_range/output.css +a { + value: color(xyz 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> percent/z/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz 0.1 0.2 -30%)); + +<===> percent/z/below_range/output.css +a { + value: color(xyz 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> xyz_d65/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d65 0.1 0.2 0.3)); + +<===> xyz_d65/output.css +a { + value: color(xyz 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} diff --git a/spec/core_functions/color/color/spaces/xyz_d50.hrx b/spec/core_functions/color/color/spaces/xyz_d50.hrx new file mode 100644 index 0000000000..f836ab16f1 --- /dev/null +++ b/spec/core_functions/color/color/spaces/xyz_d50.hrx @@ -0,0 +1,165 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 0.3)); + +<===> unitless/in_range/output.css +a { + value: color(xyz-d50 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/x/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 1.1 0.2 0.3)); + +<===> unitless/x/above_range/output.css +a { + value: color(xyz-d50 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/x/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 -0.1 0.2 0.3)); + +<===> unitless/x/below_range/output.css +a { + value: color(xyz-d50 -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/y/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 1.2 0.3)); + +<===> unitless/y/above_range/output.css +a { + value: color(xyz-d50 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/y/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 -0.2 0.3)); + +<===> unitless/y/below_range/output.css +a { + value: color(xyz-d50 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> unitless/z/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 1.3)); + +<===> unitless/z/above_range/output.css +a { + value: color(xyz-d50 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> unitless/z/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 -0.3)); + +<===> unitless/z/below_range/output.css +a { + value: color(xyz-d50 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 10% 20% 30%)); + +<===> percent/in_range/output.css +a { + value: color(xyz-d50 0.1 0.2 0.3); + channels: 0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/x/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 110% 0.2 0.3)); + +<===> percent/x/above_range/output.css +a { + value: color(xyz-d50 1.1 0.2 0.3); + channels: 1.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/x/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 -10% 0.2 0.3)); + +<===> percent/x/below_range/output.css +a { + value: color(xyz-d50 -0.1 0.2 0.3); + channels: -0.1 0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/y/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 120% 0.3)); + +<===> percent/y/above_range/output.css +a { + value: color(xyz-d50 0.1 1.2 0.3); + channels: 0.1 1.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/y/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 -20% 0.3)); + +<===> percent/y/below_range/output.css +a { + value: color(xyz-d50 0.1 -0.2 0.3); + channels: 0.1 -0.2 0.3 / 1; +} + +<===> +================================================================================ +<===> percent/z/above_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 130%)); + +<===> percent/z/above_range/output.css +a { + value: color(xyz-d50 0.1 0.2 1.3); + channels: 0.1 0.2 1.3 / 1; +} + +<===> +================================================================================ +<===> percent/z/below_range/input.scss +@use 'core_functions/color/color/xyz-utils'; +@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 -30%)); + +<===> percent/z/below_range/output.css +a { + value: color(xyz-d50 0.1 0.2 -0.3); + channels: 0.1 0.2 -0.3 / 1; +} diff --git a/spec/core_functions/color/color/special_functions.hrx b/spec/core_functions/color/color/special_functions.hrx new file mode 100644 index 0000000000..c93bb051e5 --- /dev/null +++ b/spec/core_functions/color/color/special_functions.hrx @@ -0,0 +1,142 @@ +<===> calculation/arg_1/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb calc(1px + 1%) 0.2 0.3)); + +<===> calculation/arg_1/output.css +a { + value: color(srgb calc(1px + 1%) 0.2 0.3); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_2/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 calc(1px + 1%) 0.3)); + +<===> calculation/arg_2/output.css +a { + value: color(srgb 0.1 calc(1px + 1%) 0.3); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_3/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 calc(1px + 1%))); + +<===> calculation/arg_3/output.css +a { + value: color(srgb 0.1 0.2 calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_4/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / calc(1px + 1%))); + +<===> calculation/arg_4/output.css +a { + value: color(srgb 0.1 0.2 0.3/calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_1/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb var(--foo) 0.2 0.3)); + +<===> var/arg_1/output.css +a { + value: color(srgb var(--foo) 0.2 0.3); + type: string; +} + +<===> +================================================================================ +<===> var/arg_2/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 var(--foo) 0.3)); + +<===> var/arg_2/output.css +a { + value: color(srgb 0.1 var(--foo) 0.3); + type: string; +} + +<===> +================================================================================ +<===> var/arg_3/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 var(--foo))); + +<===> var/arg_3/output.css +a { + value: color(srgb 0.1 0.2 var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_4/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / var(--foo))); + +<===> var/arg_4/output.css +a { + value: color(srgb 0.1 0.2 0.3/var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_2/input.scss +// var() is substituted before parsing, so it may contain multiple arguments. +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb var(--foo) 0.3)); + +<===> multi_argument_var/1_of_2/output.css +a { + value: color(srgb var(--foo) 0.3); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/2_of_2/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb 0.1 var(--foo))); + +<===> multi_argument_var/2_of_2/output.css +a { + value: color(srgb 0.1 var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/no_alpha/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb var(--foo))); + +<===> multi_argument_var/1_of_1/no_alpha/output.css +a { + value: color(srgb var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/alpha/input.scss +@use 'core_functions/color/color/rgb-utils'; +@include rgb-utils.inspect(color(srgb var(--foo) / 0.4)); + +<===> multi_argument_var/1_of_1/alpha/output.css +a { + value: color(srgb var(--foo)/0.4); + type: string; +} From 081ffe5febb38397c652f9f48a298d50e2d6a955 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 13 Oct 2023 16:21:59 -0700 Subject: [PATCH 20/45] [Color 4] Add tests for oklch() (#1945) --- spec/core_functions/color/oklch/README.md | 2 + spec/core_functions/color/oklch/_utils.scss | 27 ++ spec/core_functions/color/oklch/alpha.hrx | 120 ++++++++ spec/core_functions/color/oklch/error.hrx | 272 ++++++++++++++++++ spec/core_functions/color/oklch/no_alpha.hrx | 189 ++++++++++++ spec/core_functions/color/oklch/options.yml | 3 + .../color/oklch/special_functions.hrx | 142 +++++++++ 7 files changed, 755 insertions(+) create mode 100644 spec/core_functions/color/oklch/README.md create mode 100644 spec/core_functions/color/oklch/_utils.scss create mode 100644 spec/core_functions/color/oklch/alpha.hrx create mode 100644 spec/core_functions/color/oklch/error.hrx create mode 100644 spec/core_functions/color/oklch/no_alpha.hrx create mode 100644 spec/core_functions/color/oklch/options.yml create mode 100644 spec/core_functions/color/oklch/special_functions.hrx diff --git a/spec/core_functions/color/oklch/README.md b/spec/core_functions/color/oklch/README.md new file mode 100644 index 0000000000..5117c908e1 --- /dev/null +++ b/spec/core_functions/color/oklch/README.md @@ -0,0 +1,2 @@ +Some of the same behavior tested for `lab()` applies to this function as well, +but for terseness' sake isn't tested explicitly. diff --git a/spec/core_functions/color/oklch/_utils.scss b/spec/core_functions/color/oklch/_utils.scss new file mode 100644 index 0000000000..508c32e306 --- /dev/null +++ b/spec/core_functions/color/oklch/_utils.scss @@ -0,0 +1,27 @@ +@use 'sass:color'; +@use 'sass:list'; +@use 'sass:meta'; + +@function -real-channel($color, $channel) { + @if color.is-missing($color, $channel) { + @return none; + } @else { + @return color.channel($color, $channel); + } +} + +@mixin inspect($color) { + a { + value: $color; + @if meta.type-of($color) == string { + type: string; + } @else { + channels: list.slash( + -real-channel($color, 'lightness') + -real-channel($color, 'chroma') + -real-channel($color, 'hue'), + -real-channel($color, 'alpha') + ); + } + } +} diff --git a/spec/core_functions/color/oklch/alpha.hrx b/spec/core_functions/color/oklch/alpha.hrx new file mode 100644 index 0000000000..acb10b5a46 --- /dev/null +++ b/spec/core_functions/color/oklch/alpha.hrx @@ -0,0 +1,120 @@ +<===> transparent/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / 0)); + +<===> transparent/output.css +a { + value: oklch(1% 0.2 3deg / 0); + channels: 1% 0.2 3deg / 0; +} + +<===> +================================================================================ +<===> opaque/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / 1)); + +<===> opaque/output.css +a { + value: oklch(1% 0.2 3deg); + channels: 1% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> partial/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / 0.4)); + +<===> partial/output.css +a { + value: oklch(1% 0.2 3deg / 0.4); + channels: 1% 0.2 3deg / 0.4; +} + +<===> +================================================================================ +<===> percent/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / 40%)); + +<===> percent/output.css +a { + value: oklch(1% 0.2 3deg / 0.4); + channels: 1% 0.2 3deg / 0.4; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch($channels: 1% 0.2 3deg / 0.4)); + +<===> named/output.css +a { + value: oklch(1% 0.2 3deg / 0.4); + channels: 1% 0.2 3deg / 0.4; +} + +<===> +================================================================================ +<===> slash_list/input.scss +@use "sass:list"; +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(list.slash(1% 0.2 3deg, 0.4))); + +<===> slash_list/output.css +a { + value: oklch(1% 0.2 3deg / 0.4); + channels: 1% 0.2 3deg / 0.4; +} + +<===> +================================================================================ +<===> none/slash/hue/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 none / 0.4)); + +<===> none/slash/hue/output.css +a { + value: oklch(1% 0.2 none / 0.4); + channels: 1% 0.2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash/alpha/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / none)); + +<===> none/slash/alpha/output.css +a { + value: oklch(1% 0.2 3deg / none); + channels: 1% 0.2 3deg / none; +} + +<===> +================================================================================ +<===> none/slash_list/hue/input.scss +@use 'sass:list'; +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(list.slash(1% 0.2 none, 0.4))); + +<===> none/slash_list/hue/output.css +a { + value: oklch(1% 0.2 none / 0.4); + channels: 1% 0.2 none / 0.4; +} + +<===> +================================================================================ +<===> none/slash_list/alpha/input.scss +@use 'sass:list'; +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(list.slash(1% 0.2 3deg, none))); + +<===> none/slash_list/alpha/output.css +a { + value: oklch(1% 0.2 3deg / none); + channels: 1% 0.2 3deg / none; +} diff --git a/spec/core_functions/color/oklch/error.hrx b/spec/core_functions/color/oklch/error.hrx new file mode 100644 index 0000000000..b71803e340 --- /dev/null +++ b/spec/core_functions/color/oklch/error.hrx @@ -0,0 +1,272 @@ +<===> unit/lightness/input.scss +a {b: oklch(1px 0.2 3deg)} + +<===> unit/lightness/error +Error: $lightness: Expected 1px to have unit "%" or no units. + , +1 | a {b: oklch(1px 0.2 3deg)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/chroma/input.scss +a {b: oklch(1% 2px 3deg)} + +<===> unit/chroma/error +Error: $chroma: Expected 2px to have unit "%" or no units. + , +1 | a {b: oklch(1% 2px 3deg)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/hue/unrelated/input.scss +a {b: oklch(1% 0.2 3px)} + +<===> unit/hue/unrelated/error +Error: $hue: Expected 3px to have an angle unit (deg, grad, rad, turn). + , +1 | a {b: oklch(1% 0.2 3px)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/hue/percent/input.scss +a {b: oklch(1% 0.2 3%)} + +<===> unit/hue/percent/error +Error: $hue: Expected 3% to have an angle unit (deg, grad, rad, turn). + , +1 | a {b: oklch(1% 0.2 3%)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash/input.scss +a {b: oklch(1% 0.2 3deg/0.4px)} + +<===> unit/alpha/slash/error +Error: $alpha: Expected 0.4px to have unit "%" or no units. + , +1 | a {b: oklch(1% 0.2 3deg/0.4px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> unit/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: oklch(list.slash(1% 0.2 3deg, 0.4px))} + +<===> unit/alpha/slash_list/error +Error: $alpha: Expected 0.4px to have unit "%" or no units. + , +2 | a {b: oklch(list.slash(1% 0.2 3deg, 0.4px))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/lightness/input.scss +a {b: oklch(c 0.2 3deg)} + +<===> type/lightness/error +Error: $channels: Expected lightness channel to be a number, was c. + , +1 | a {b: oklch(c 0.2 3deg)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/chroma/input.scss +a {b: oklch(1% c 3deg)} + +<===> type/chroma/error +Error: $channels: Expected chroma channel to be a number, was c. + , +1 | a {b: oklch(1% c 3deg)} + | ^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/hue/input.scss +a {b: oklch(1% 0.2 c)} + +<===> type/hue/error +Error: $channels: Expected hue channel to be a number, was c. + , +1 | a {b: oklch(1% 0.2 c)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/alpha/slash_list/input.scss +@use 'sass:list'; +a {b: oklch(list.slash(1% 0.2 3deg, c))} + +<===> type/alpha/slash_list/error +Error: $channels: c is not a number. + , +2 | a {b: oklch(list.slash(1% 0.2 3deg, c))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/bracketed/input.scss +a {b: oklch([1% 0.2 3deg])} + +<===> list/bracketed/error +Error: $channels: Expected an unbracketed list, was [1% 0.2 3deg] + , +1 | a {b: oklch([1% 0.2 3deg])} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/comma/input.scss +a {b: oklch((1%, 2, 3deg))} + +<===> list/comma/error +Error: $channels: Expected a space- or slash-separated list, was (1%, 2, 3deg) + , +1 | a {b: oklch((1%, 2, 3deg))} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/three/input.scss +@use 'sass:list'; +a {b: oklch(list.slash(1%, 2, 3deg))} + +<===> list/slash/three/error +Error: $channels: Only 2 slash-separated elements allowed, but 3 were passed. + , +2 | a {b: oklch(list.slash(1%, 2, 3deg))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> list/slash/one/input.scss +@use 'sass:list'; +$single-arg-slash-separated: list.append((), 1% 0.2 3deg, $separator: slash); +a {b: oklch($single-arg-slash-separated)} + +<===> list/slash/one/error +Error: $channels: Only 2 slash-separated elements allowed, but 1 was passed. + , +3 | a {b: oklch($single-arg-slash-separated)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/empty/input.scss +a {b: oklch(())} + +<===> list/empty/error +Error: $channels: Color component list may not be empty. + , +1 | a {b: oklch(())} + | ^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/empty_space/input.scss +@use 'sass:list'; +$empty-space: list.join((), (), $separator: space); +a {b: oklch(())} + +<===> list/empty_space/error +Error: $channels: Color component list may not be empty. + , +3 | a {b: oklch(())} + | ^^^^^^^^^ + ' + input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> list/too_few_channels/input.scss +a {b: oklch(1% 2)} + +<===> list/too_few_channels/error +Error: $channels: The oklch color space has 3 channels but (1% 2) has 2. + , +1 | a {b: oklch(1% 2)} + | ^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> list/too_many_channels/input.scss +a {b: oklch(1% 0.2 3deg 0.4)} + +<===> list/too_many_channels/error +Error: $channels: The oklch color space has 3 channels but (1% 0.2 3deg 0.4) has 4. + , +1 | a {b: oklch(1% 0.2 3deg 0.4)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/input.scss +a {b: oklch()} + +<===> too_few_args/error +Error: Missing argument $channels. + ,--> input.scss +1 | a {b: oklch()} + | ^^^^^^^ invocation + ' + ,--> sass:color +1 | @function oklch($channels) { + | ================ declaration + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +a {b: oklch(1%, 2, 3deg, 0.4)} + +<===> too_many_args/error +Error: Only 1 argument allowed, but 4 were passed. + ,--> input.scss +1 | a {b: oklch(1%, 2, 3deg, 0.4)} + | ^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function oklch($channels) { + | ================ declaration + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/oklch/no_alpha.hrx b/spec/core_functions/color/oklch/no_alpha.hrx new file mode 100644 index 0000000000..9b24e8e781 --- /dev/null +++ b/spec/core_functions/color/oklch/no_alpha.hrx @@ -0,0 +1,189 @@ +<===> unitless/in_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(0.1 0.2 3deg)); + +<===> unitless/in_range/output.css +a { + value: oklch(10% 0.2 3deg); + channels: 10% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1.1 0.2 3deg)); + +<===> unitless/lightness/above_range/output.css +a { + value: oklch(100% 0.2 3deg); + channels: 100% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(-0.1 0.2 3deg)); + +<===> unitless/lightness/below_range/output.css +a { + value: oklch(0% 0.2 3deg); + channels: 0% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/chroma/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.5 3deg)); + +<===> unitless/chroma/above_range/output.css +a { + value: oklch(1% 0.5 3deg); + channels: 1% 0.5 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/chroma/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% -0.1 3deg)); + +<===> unitless/chroma/below_range/output.css +a { + value: oklch(1% -0.1 3deg); + channels: 1% -0.1 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/hue/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 361deg)); + +<===> unitless/hue/above_range/output.css +a { + value: oklch(1% 0.2 1deg); + channels: 1% 0.2 1deg / 1; +} + +<===> +================================================================================ +<===> unitless/hue/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 -1deg)); + +<===> unitless/hue/below_range/output.css +a { + value: oklch(1% 0.2 359deg); + channels: 1% 0.2 359deg / 1; +} + +<===> +================================================================================ +<===> percent/in_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 2% 3deg)); + +<===> percent/in_range/output.css +a { + value: oklch(1% 0.008 3deg); + channels: 1% 0.008 3deg / 1; +} + +<===> +================================================================================ +<===> percent/lightness/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(110% 0.2 3deg)); + +<===> percent/lightness/above_range/output.css +a { + value: oklch(100% 0.2 3deg); + channels: 100% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> percent/lightness/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(-1% 0.2 3deg)); + +<===> percent/lightness/below_range/output.css +a { + value: oklch(0% 0.2 3deg); + channels: 0% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> percent/chroma/above_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 101% 3deg)); + +<===> percent/chroma/above_range/output.css +a { + value: oklch(1% 0.404 3deg); + channels: 1% 0.404 3deg / 1; +} + +<===> +================================================================================ +<===> percent/chroma/below_range/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% -1% 3deg)); + +<===> percent/chroma/below_range/output.css +a { + value: oklch(1% -0.004 3deg); + channels: 1% -0.004 3deg / 1; +} + +<===> +================================================================================ +<===> none/lightness/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(none 0.2 3deg)); + +<===> none/lightness/output.css +a { + value: oklch(none 0.2 3deg); + channels: none 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> none/chroma/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% none 3deg)); + +<===> none/chroma/output.css +a { + value: oklch(1% none 3deg); + channels: 1% none 3deg / 1; +} + +<===> +================================================================================ +<===> none/hue/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 none)); + +<===> none/hue/output.css +a { + value: oklch(1% 0.2 none); + channels: 1% 0.2 none / 1; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch($channels: 1% 0.2 3deg)); + +<===> named/output.css +a { + value: oklch(1% 0.2 3deg); + channels: 1% 0.2 3deg / 1; +} diff --git a/spec/core_functions/color/oklch/options.yml b/spec/core_functions/color/oklch/options.yml new file mode 100644 index 0000000000..99ecec7ed1 --- /dev/null +++ b/spec/core_functions/color/oklch/options.yml @@ -0,0 +1,3 @@ +--- +:ignore_for: +- libsass diff --git a/spec/core_functions/color/oklch/special_functions.hrx b/spec/core_functions/color/oklch/special_functions.hrx new file mode 100644 index 0000000000..8955526c40 --- /dev/null +++ b/spec/core_functions/color/oklch/special_functions.hrx @@ -0,0 +1,142 @@ +<===> calculation/arg_1/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(calc(1px + 1%) 0.2 3deg)); + +<===> calculation/arg_1/output.css +a { + value: oklch(calc(1px + 1%) 0.2 3deg); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_2/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% calc(1px + 1%) 3deg)); + +<===> calculation/arg_2/output.css +a { + value: oklch(1% calc(1px + 1%) 3deg); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_3/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 calc(1px + 1%))); + +<===> calculation/arg_3/output.css +a { + value: oklch(1% 0.2 calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> calculation/arg_4/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / calc(1px + 1%))); + +<===> calculation/arg_4/output.css +a { + value: oklch(1% 0.2 3deg/calc(1px + 1%)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_1/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(var(--foo) 0.2 3deg)); + +<===> var/arg_1/output.css +a { + value: oklch(var(--foo) 0.2 3deg); + type: string; +} + +<===> +================================================================================ +<===> var/arg_2/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% var(--foo) 3deg)); + +<===> var/arg_2/output.css +a { + value: oklch(1% var(--foo) 3deg); + type: string; +} + +<===> +================================================================================ +<===> var/arg_3/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 var(--foo))); + +<===> var/arg_3/output.css +a { + value: oklch(1% 0.2 var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> var/arg_4/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / var(--foo))); + +<===> var/arg_4/output.css +a { + value: oklch(1% 0.2 3deg/var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_2/input.scss +// var() is substituted before parsing, so it may contain multiple arguments. +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(var(--foo) 2deg)); + +<===> multi_argument_var/1_of_2/output.css +a { + value: oklch(var(--foo) 2deg); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/2_of_2/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(1% var(--foo))); + +<===> multi_argument_var/2_of_2/output.css +a { + value: oklch(1% var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/no_alpha/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(var(--foo))); + +<===> multi_argument_var/1_of_1/no_alpha/output.css +a { + value: oklch(var(--foo)); + type: string; +} + +<===> +================================================================================ +<===> multi_argument_var/1_of_1/alpha/input.scss +@use 'core_functions/color/lch/utils'; +@include utils.inspect(oklch(var(--foo) / 0.4)); + +<===> multi_argument_var/1_of_1/alpha/output.css +a { + value: oklch(var(--foo)/0.4); + type: string; +} From e409a9236a08d9934e9955b49d6154f4cc0fdd37 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Tue, 17 Oct 2023 15:00:19 -0700 Subject: [PATCH 21/45] [Color 4] Add tests for missing channels in legacy color spaces (#1948) This also adds tests for the global hwb() function. --- .../color/hsl/one_arg/alpha.hrx | 21 ++ .../color/hsl/one_arg/no_alpha.hrx | 30 ++ spec/core_functions/color/hwb/global.hrx | 289 ++++++++++++++++++ spec/core_functions/color/hwb/one_arg.hrx | 2 + .../color/rgb/one_arg/alpha.hrx | 21 ++ .../color/rgb/one_arg/no_alpha.hrx | 30 ++ 6 files changed, 393 insertions(+) create mode 100644 spec/core_functions/color/hwb/global.hrx diff --git a/spec/core_functions/color/hsl/one_arg/alpha.hrx b/spec/core_functions/color/hsl/one_arg/alpha.hrx index 4df1e93be0..2b23c7d420 100644 --- a/spec/core_functions/color/hsl/one_arg/alpha.hrx +++ b/spec/core_functions/color/hsl/one_arg/alpha.hrx @@ -97,3 +97,24 @@ a {b: hsl(list.slash(180 60% 50%, 0))} a { b: hsla(180, 60%, 50%, 0); } + +<===> +================================================================================ +<===> missing/slash/input.scss +a {b: hsl(180 60% 50% / none)} + +<===> missing/slash/output.css +a { + b: hsl(180deg 60% 50% / none); +} + +<===> +================================================================================ +<===> missing/slash_list/input.scss +@use 'sass:list'; +a {b: hsl(list.slash(180 60% 50%, none))} + +<===> missing/slash_list/output.css +a { + b: hsl(180deg 60% 50% / none); +} diff --git a/spec/core_functions/color/hsl/one_arg/no_alpha.hrx b/spec/core_functions/color/hsl/one_arg/no_alpha.hrx index 4363177b55..e175a51c15 100644 --- a/spec/core_functions/color/hsl/one_arg/no_alpha.hrx +++ b/spec/core_functions/color/hsl/one_arg/no_alpha.hrx @@ -122,6 +122,36 @@ More info: https://sass-lang.com/d/function-units ' input.scss 1:7 root stylesheet +<===> +================================================================================ +<===> missing/hue/input.scss +a {b: hsl(none 100% 50%)} + +<===> missing/hue/output.css +a { + b: hsl(none 100% 50%); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +a {b: hsl(0 none 50%)} + +<===> missing/saturation/output.css +a { + b: hsl(0deg none 50%); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +a {b: hsl(0 100% none)} + +<===> missing/lightness/output.css +a { + b: hsl(0deg 100% none); +} + <===> ================================================================================ <===> named/input.scss diff --git a/spec/core_functions/color/hwb/global.hrx b/spec/core_functions/color/hwb/global.hrx new file mode 100644 index 0000000000..98324996d8 --- /dev/null +++ b/spec/core_functions/color/hwb/global.hrx @@ -0,0 +1,289 @@ +<===> alpha/in_gamut/transparent/input.scss +a {b: hwb(180 30% 40% / 0)} + +<===> alpha/in_gamut/transparent/output.css +a { + b: hsla(180, 33.3333333333%, 45%, 0); +} + +<===> +================================================================================ +<===> alpha/in_gamut/opaque/input.scss +a {b: hwb(180 30% 40% / 1)} + +<===> alpha/in_gamut/opaque/output.css +a { + b: hsl(180, 33.3333333333%, 45%); +} + +<===> +================================================================================ +<===> alpha/in_gamut/partial/input.scss +a {b: hwb(180 30% 40% / 0.5)} + +<===> alpha/in_gamut/partial/output.css +a { + b: hsla(180, 33.3333333333%, 45%, 0.5); +} + +<===> +================================================================================ +<===> alpha/in_gamut/named/input.scss +a {b: hwb($channels: 180 30% 40% / 0.4)} + +<===> alpha/in_gamut/named/output.css +a { + b: hsla(180, 33.3333333333%, 45%, 0.4); +} + +<===> +================================================================================ +<===> alpha/in_gamut/parenthesized/input.scss +// Extra parens shouldn't cause the slash to be forced into division. +a {b: (hwb(180 30% 40% / 0.4))} + +<===> alpha/in_gamut/parenthesized/output.css +a { + b: hsla(180, 33.3333333333%, 45%, 0.4); +} + +<===> +================================================================================ +<===> alpha/clamped/above/input.scss +a {b: hwb(0 30% 40% / 1.1)} + +<===> alpha/clamped/above/output.css +a { + b: hsl(0, 33.3333333333%, 45%); +} + +<===> +================================================================================ +<===> alpha/clamped/below/input.scss +a {b: hwb(0 30% 40% / -0.1)} + +<===> alpha/clamped/below/output.css +a { + b: hsla(0, 33.3333333333%, 45%, 0); +} + +<===> +================================================================================ +<===> alpha/missing/slash/input.scss +a {b: hwb(0 30% 40% / none)} + +<===> alpha/missing/slash/output.css +a { + b: hwb(0deg 30% 40% / none); +} + +<===> +================================================================================ +<===> alpha/missing/slash_list/input.scss +@use 'sass:list'; +a {b: hwb(list.slash(0 30% 40%, none))} + +<===> alpha/missing/slash_list/output.css +a { + b: hwb(0deg 30% 40% / none); +} + +<===> +================================================================================ +<===> no_alpha/input.scss +a {b: hwb(180 30% 40%)} + +<===> no_alpha/output.css +a { + b: hsl(180, 33.3333333333%, 45%); +} + +<===> +================================================================================ +<===> named/input.scss +a {b: hwb($channels: 180 30% 40% / 0.4)} + +<===> named/output.css +a { + b: hsla(180, 33.3333333333%, 45%, 0.4); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +a {b: hwb(none 30% 40%)} + +<===> missing/hue/output.css +a { + b: hwb(none 30% 40%); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +a {b: hwb(0 none 40%)} + +<===> missing/whiteness/output.css +a { + b: hwb(0deg none 40%); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +a {b: hwb(0 30% none)} + +<===> missing/blackness/output.css +a { + b: hwb(0deg 30% none); +} + +<===> +================================================================================ +<===> relative_color/static/alpha/input.scss +a {b: hwb(from #aaa h w b / 25%)} + +<===> relative_color/static/alpha/output.css +a { + b: hwb(from #aaa h w b/25%); +} + +<===> +================================================================================ +<===> relative_color/static/no_alpha/input.scss +a {b: hwb(from #aaa h w b)} + +<===> relative_color/static/no_alpha/output.css +a { + b: hwb(from #aaa h w b); +} + +<===> +================================================================================ +<===> relative_color/calc/alpha/input.scss +a {b: hwb(from #aaa calc(h + 180deg) w b / 25%)} + +<===> relative_color/calc/alpha/output.css +a { + b: hwb(from #aaa calc(h + 180deg) w b/25%); +} + +<===> +================================================================================ +<===> relative_color/calc/no_alpha/input.scss +a {b: hwb(from #aaa calc(h + 180deg) w b)} + +<===> relative_color/calc/no_alpha/output.css +a { + b: hwb(from #aaa calc(h + 180deg) w b); +} + +<===> +================================================================================ +<===> relative_color/var/alpha/input.scss +a {b: hwb(from var(--c) h w b / 25%)} + +<===> relative_color/var/alpha/output.css +a { + b: hwb(from var(--c) h w b/25%); +} + +<===> +================================================================================ +<===> relative_color/var/no_alpha/input.scss +a {b: hwb(from var(--c) h w b)} +<===> relative_color/var/no_alpha/output.css +a { + b: hwb(from var(--c) h w b); +} + +<===> +================================================================================ +<===> relative_color/different_case/alpha/input.scss +a {b: hwb(From #aaa h w b / 25%)} + +<===> relative_color/different_case/alpha/output.css +a { + b: hwb(From #aaa h w b/25%); +} + +<===> +================================================================================ +<===> relative_color/different_case/no_alpha/input.scss +a {b: hwb(From #aaa h w b)} + +<===> relative_color/different_case/no_alpha/output.css +a { + b: hwb(From #aaa h w b); +} + +<===> +================================================================================ +<===> relative_color/slash_list_alpha/input.scss +@use "sass:list"; +a {b: hwb(list.slash(from #aaa h w b, 25%))} + +<===> relative_color/slash_list_alpha/output.css +a { + b: hwb(from #aaa h w b / 25%); +} + +<===> +================================================================================ +<===> relative_color/error/options.yml +:todo: + - dart-sass + +<===> +================================================================================ +<===> relative_color/error/quoted/alpha/input.scss +a {b: hwb("from" #aaa h w b / 25%)} + +<===> relative_color/error/quoted/alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: hwb("from" #aaa h w b / 25%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/error/quoted/no_alpha/input.scss +a {b: hwb("from" #aaa h w b)} + +<===> relative_color/error/quoted/no_alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: hwb("from" #aaa h w b)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/error/wrong_keyword/alpha/input.scss +a {b: hwb(c #aaa h w b / 25%)} + +<===> relative_color/error/wrong_keyword/alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: hwb(c #aaa h w b / 25%)} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/error/wrong_keyword/no_alpha/input.scss +a {b: hwb(c #aaa h w b)} + +<===> relative_color/error/wrong_keyword/no_alpha/error +Error: Only 3 elements allowed, but 5 were passed. + , +1 | a {b: hwb(c #aaa h w b)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + + diff --git a/spec/core_functions/color/hwb/one_arg.hrx b/spec/core_functions/color/hwb/one_arg.hrx index 5dd6298313..5f1bc2a3c1 100644 --- a/spec/core_functions/color/hwb/one_arg.hrx +++ b/spec/core_functions/color/hwb/one_arg.hrx @@ -244,3 +244,5 @@ Error: Only 3 elements allowed, but 5 were passed. | ^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + + diff --git a/spec/core_functions/color/rgb/one_arg/alpha.hrx b/spec/core_functions/color/rgb/one_arg/alpha.hrx index c9b346d325..0efd910ad7 100644 --- a/spec/core_functions/color/rgb/one_arg/alpha.hrx +++ b/spec/core_functions/color/rgb/one_arg/alpha.hrx @@ -154,3 +154,24 @@ a {b: rgb(list.slash(0 255 127, 0))} a { b: rgba(0, 255, 127, 0); } + +<===> +================================================================================ +<===> missing/slash/input.scss +a {b: rgb(0 255 127 / none)} + +<===> missing/slash/output.css +a { + b: rgb(0 255 127 / none); +} + +<===> +================================================================================ +<===> missing/slash_list/input.scss +@use 'sass:list'; +a {b: rgb(list.slash(0 255 127, none))} + +<===> missing/slash_list/output.css +a { + b: rgb(0 255 127 / none); +} diff --git a/spec/core_functions/color/rgb/one_arg/no_alpha.hrx b/spec/core_functions/color/rgb/one_arg/no_alpha.hrx index efcd185a4e..7b86b6c1ca 100644 --- a/spec/core_functions/color/rgb/one_arg/no_alpha.hrx +++ b/spec/core_functions/color/rgb/one_arg/no_alpha.hrx @@ -180,3 +180,33 @@ a {b: rgb(0 0 200%)} a { b: rgb(0, 0, 255); } + +<===> +================================================================================ +<===> missing/red/input.scss +a {b: rgb(none 52 66)} + +<===> missing/red/output.css +a { + b: rgb(none 52 66); +} + +<===> +================================================================================ +<===> missing/green/input.scss +a {b: rgb(18 none 66)} + +<===> missing/green/output.css +a { + b: rgb(18 none 66); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +a {b: rgb(18 52 none)} + +<===> missing/blue/output.css +a { + b: rgb(18 52 none); +} From 7c45b0b3fd657d56749b1bebfe7404bbf27676c4 Mon Sep 17 00:00:00 2001 From: James Stuckey Weber Date: Fri, 17 Nov 2023 18:27:53 -0500 Subject: [PATCH 22/45] [Color 4] JS API specs (#1949) Co-authored-by: Jonny Gerig Meyer --- js-api-spec/setup.ts | 128 ++++ js-api-spec/value/color.test.ts | 433 ------------ .../value/color/color-4-channels.test.ts | 308 +++++++++ .../value/color/color-4-conversions.test.ts | 204 ++++++ .../color/color-4-nonparametizable.test.ts | 66 ++ .../value/color/color-4-spaces.test.ts | 90 +++ js-api-spec/value/color/constructors.ts | 194 ++++++ .../value/color/interpolation-examples.ts | 447 ++++++++++++ js-api-spec/value/color/legacy.test.ts | 644 ++++++++++++++++++ js-api-spec/value/color/spaces.ts | 377 ++++++++++ js-api-spec/value/color/utils.ts | 44 ++ 11 files changed, 2502 insertions(+), 433 deletions(-) delete mode 100644 js-api-spec/value/color.test.ts create mode 100644 js-api-spec/value/color/color-4-channels.test.ts create mode 100644 js-api-spec/value/color/color-4-conversions.test.ts create mode 100644 js-api-spec/value/color/color-4-nonparametizable.test.ts create mode 100644 js-api-spec/value/color/color-4-spaces.test.ts create mode 100644 js-api-spec/value/color/constructors.ts create mode 100644 js-api-spec/value/color/interpolation-examples.ts create mode 100644 js-api-spec/value/color/legacy.test.ts create mode 100644 js-api-spec/value/color/spaces.ts create mode 100644 js-api-spec/value/color/utils.ts diff --git a/js-api-spec/setup.ts b/js-api-spec/setup.ts index 9f5bd41956..8eccfc2758 100644 --- a/js-api-spec/setup.ts +++ b/js-api-spec/setup.ts @@ -55,6 +55,29 @@ declare global { */ toEqualWithHash(value: immutable.ValueObject): T; + /** + * Matches a number that is equal to `value` using `SassNumber.equals()`. + */ + toFuzzyEqual(value: number): T; + + /** + * Matches a number that is equal to `value` to 5 decimal places. + */ + toLooselyEqual(value: number): T; + + /** + * Matches a SassColor where each channel in `value` is equal to 5 decimal + * places. + */ + toLooselyEqualColor(value: sass.SassColor): T; + + /** + * Matches an array against an Immutable List. Non-numeric values are + * exactly matched, and numbers are fuzzy matched using + * `SassNumber.equals()`. + */ + toFuzzyEqualList(value: unknown[]): T; + /** * Matches a value that's `null` or `undefined`. */ @@ -312,6 +335,99 @@ const toEqualIgnoringWhitespace = (received: unknown, actual: string) => { }; }; +const toFuzzyEqual = (received: unknown, actual: number) => { + if (typeof received !== 'number') { + throw new Error('Received value must be a number'); + } + return { + message: `expected ${received} to fuzzy equal ${actual}`, + pass: new sass.SassNumber(received).equals(new sass.SassNumber(actual)), + }; +}; + +const toLooselyEqual = (received: unknown, actual: number) => { + if (typeof received !== 'number') { + throw new Error('Received value must be a number'); + } + return { + message: `expected ${received} to loosely equal ${actual} to 5 decimal places`, + pass: Math.round((received * 10) ^ 5) === Math.round((actual * 10) ^ 5), + }; +}; + +// The max distance two Sass numbers can be from each another before they're +// considered different (2 decimals). +// +// Uses ** instead of Math.pow() for constant folding. +// TODO: Ideally this should be more precise, but ColorJS does not always match. +const epsilon = 10 ** -2; + +const toLooselyEqualColor = (received: unknown, actual: sass.SassColor) => { + function isSassColor(item: unknown): item is sass.SassColor { + return !!(item as sass.SassColor).assertColor(); + } + if (!isSassColor(received)) { + throw new Error('Received value must be a SassColor'); + } + const unequalIndices: number[] = []; + received.channelsOrNull.forEach((channel: number | null, index: number) => { + const actualChannel = actual.channelsOrNull.get(index); + if (channel === null) { + if (actualChannel !== null) unequalIndices.push(index); + } else if ( + actualChannel === null || + Math.abs(channel - actualChannel) > epsilon + ) { + unequalIndices.push(index); + } + }); + const plural = unequalIndices.length !== 1; + const indexMessage = `${plural ? 'indices' : 'index'} ${unequalIndices.join( + ',' + )}`; + return { + message: `expected ${received} to loosely equal ${actual}, but channels at ${indexMessage} differ`, + pass: unequalIndices.length === 0, + }; +}; + +const toFuzzyEqualList = (received: unknown, actual: unknown[]) => { + if (!immutable.List.isList(received)) { + throw new Error('Received value must be an Immutuable List'); + } + if (received.count() !== actual.length) { + return { + pass: false, + message: `expected List to have length ${ + actual.length + }, received ${received.count()}`, + }; + } + let pass = true; + let message = ''; + received.forEach((receivedItem, index) => { + const actualItem = actual[index]; + if (!pass) return; + if (typeof receivedItem !== typeof actualItem) { + pass = false; + message = `expected ${receivedItem} to be the same type as ${actual[index]} at index ${index}`; + } + if (typeof receivedItem === 'number' && typeof actualItem === 'number') { + pass = new sass.SassNumber(receivedItem).equals( + new sass.SassNumber(actualItem) + ); + message = `expected ${receivedItem} to fuzzy equal ${actual[index]} at index ${index}`; + } else { + pass = receivedItem === actualItem; + message = `expected non-numeric ${receivedItem} to exactly equal ${actual[index]} at index ${index}`; + } + }); + return { + message, + pass, + }; +}; + // Add custom matchers to Jasmine beforeAll(() => { jasmine.addMatchers({ @@ -330,6 +446,18 @@ beforeAll(() => { toEqualIgnoringWhitespace: () => ({ compare: toEqualIgnoringWhitespace, }), + toFuzzyEqual: () => ({ + compare: toFuzzyEqual, + }), + toLooselyEqual: () => ({ + compare: toLooselyEqual, + }), + toLooselyEqualColor: () => ({ + compare: toLooselyEqualColor, + }), + toFuzzyEqualList: () => ({ + compare: toFuzzyEqualList, + }), }); jasmine.addAsyncMatchers({ toThrowSassException: () => ({ diff --git a/js-api-spec/value/color.test.ts b/js-api-spec/value/color.test.ts deleted file mode 100644 index 89006fb5fd..0000000000 --- a/js-api-spec/value/color.test.ts +++ /dev/null @@ -1,433 +0,0 @@ -// Copyright 2021 Google Inc. Use of this source code is governed by an -// MIT-style license that can be found in the LICENSE file or at -// https://opensource.org/licenses/MIT. - -import {Value, SassColor} from 'sass'; - -import {skipForImpl} from '../utils'; - -/** A utility function for creating an RGB color. */ -function rgb( - red: number, - green: number, - blue: number, - alpha?: number -): SassColor { - return new SassColor({red, green, blue, alpha}); -} - -/** A utility function for creating an HSL color. */ -function hsl( - hue: number, - saturation: number, - lightness: number, - alpha?: number -): SassColor { - return new SassColor({hue, saturation, lightness, alpha}); -} - -/** A utility function for creating an HWB color. */ -function hwb( - hue: number, - whiteness: number, - blackness: number, - alpha?: number -): SassColor { - return new SassColor({hue, whiteness, blackness, alpha}); -} - -describe('SassColor', () => { - describe('construction', () => { - describe('type', () => { - let color: SassColor; - beforeEach(() => { - color = rgb(18, 52, 86); - }); - - it('is a value', () => { - expect(color).toBeInstanceOf(Value); - }); - - it('is a color', () => { - expect(color).toBeInstanceOf(SassColor); - expect(color.assertColor()).toBe(color); - }); - - it("isn't any other type", () => { - expect(() => color.assertBoolean()).toThrow(); - expect(() => color.assertCalculation()).toThrow(); - expect(() => color.assertFunction()).toThrow(); - expect(() => color.assertMap()).toThrow(); - expect(color.tryMap()).toBe(null); - expect(() => color.assertMixin()).toThrow(); - expect(() => color.assertNumber()).toThrow(); - expect(() => color.assertString()).toThrow(); - }); - }); - - describe('rgb()', () => { - it('allows valid values', () => { - expect(() => rgb(0, 0, 0, 0)).not.toThrow(); - expect(() => rgb(255, 255, 255, 1)).not.toThrow(); - }); - - // TODO(#1828): Update these expectations - xit('disallows invalid values', () => { - expect(() => rgb(-1, 0, 0, 0)).toThrow(); - expect(() => rgb(0, -1, 0, 0)).toThrow(); - expect(() => rgb(0, 0, -1, 0)).toThrow(); - expect(() => rgb(0, 0, 0, -0.1)).toThrow(); - expect(() => rgb(256, 0, 0, 0)).toThrow(); - expect(() => rgb(0, 256, 0, 0)).toThrow(); - expect(() => rgb(0, 0, 256, 0)).toThrow(); - expect(() => rgb(0, 0, 0, 1.1)).toThrow(); - }); - - // TODO(#1828): Update these expectations - xit('rounds channels to the nearest integer', () => { - expect(rgb(0.1, 50.4, 90.3)).toEqualWithHash(rgb(0, 50, 90)); - expect(rgb(-0.1, 50.5, 90.7)).toEqualWithHash(rgb(0, 51, 91)); - }); - }); - - describe('hsl()', () => { - it('allows valid values', () => { - expect(() => hsl(0, 0, 0, 0)).not.toThrow(); - expect(() => hsl(4320, 100, 100, 1)).not.toThrow(); - }); - - it('disallows invalid values', () => { - expect(() => hsl(0, -0.1, 0, 0)).toThrow(); - expect(() => hsl(0, 0, -0.1, 0)).toThrow(); - expect(() => hsl(0, 0, 0, -0.1)).toThrow(); - expect(() => hsl(0, 100.1, 0, 0)).toThrow(); - expect(() => hsl(0, 0, 100.1, 0)).toThrow(); - expect(() => hsl(0, 0, 0, 1.1)).toThrow(); - }); - }); - - describe('hwb()', () => { - it('allows valid values', () => { - expect(() => hwb(0, 0, 0, 0)).not.toThrow(); - expect(() => hwb(4320, 100, 100, 1)).not.toThrow(); - }); - - it('disallows invalid values', () => { - expect(() => hwb(0, -0.1, 0, 0)).toThrow(); - expect(() => hwb(0, 0, -0.1, 0)).toThrow(); - expect(() => hwb(0, 0, 0, -0.1)).toThrow(); - expect(() => hwb(0, 100.1, 0, 0)).toThrow(); - expect(() => hwb(0, 0, 100.1, 0)).toThrow(); - expect(() => hwb(0, 0, 0, 1.1)).toThrow(); - }); - }); - }); - - describe('an RGB color', () => { - let color: SassColor; - beforeEach(() => { - color = rgb(18, 52, 86); - }); - - it('has RGB channels', () => { - expect(color.red).toBe(18); - expect(color.green).toBe(52); - expect(color.blue).toBe(86); - }); - - it('has HSL channels', () => { - expect(color.hue).toBe(210); - expect(color.saturation).toBe(65.3846153846154); - expect(color.lightness).toBe(20.392156862745097); - }); - - it('has HWB channels', () => { - expect(color.hue).toBe(210); - expect(color.whiteness).toBe(7.0588235294117645); - expect(color.blackness).toBe(66.27450980392157); - }); - - it('has an alpha channel', () => { - expect(color.alpha).toBe(1); - }); - - it('equals the same color', () => { - expect(color).toEqualWithHash(rgb(18, 52, 86)); - expect(color).toEqualWithHash( - hsl(210, 65.3846153846154, 20.392156862745097) - ); - expect(color).toEqualWithHash( - hwb(210, 7.0588235294117645, 66.27450980392157) - ); - }); - }); - - describe('an HSL color', () => { - let color: SassColor; - beforeEach(() => { - color = hsl(120, 42, 42); - }); - - it('has RGB channels', () => { - expect(color.red).toBe(62); - expect(color.green).toBe(152); - expect(color.blue).toBe(62); - }); - - it('has HSL channels', () => { - expect(color.hue).toBe(120); - expect(color.saturation).toBe(42); - expect(color.lightness).toBe(42); - }); - - // sass/embedded-host-node#170 - skipForImpl('sass-embedded', () => { - it('has HWB channels', () => { - expect(color.hue).toBe(120); - expect(color.whiteness).toBe(24.360000000000003); - expect(color.blackness).toBe(40.36000000000001); - }); - }); - - it('has an alpha channel', () => { - expect(color.alpha).toBe(1); - }); - - // TODO(#1828): Update these expectations - xit('equals the same color', () => { - expect(color).toEqualWithHash(rgb(62, 152, 62)); - expect(color).toEqualWithHash(hsl(120, 42, 42)); - expect(color).toEqualWithHash( - hwb(120, 24.313725490196077, 40.3921568627451) - ); - }); - - it('allows negative hue', () => { - expect(hsl(-240, 42, 42).hue).toBe(120); - expect(hsl(-240, 42, 42)).toEqualWithHash(color); - }); - }); - - describe('an HWB color', () => { - let color: SassColor; - beforeEach(() => { - color = hwb(120, 42, 42); - }); - - it('has RGB channels', () => { - expect(color.red).toBe(107); - expect(color.green).toBe(148); - expect(color.blue).toBe(107); - }); - - // sass/embedded-host-node#170 - skipForImpl('sass-embedded', () => { - it('has HSL channels', () => { - expect(color.hue).toBe(120); - expect(color.saturation).toBe(16.000000000000007); - expect(color.lightness).toBe(50); - }); - }); - - // sass/embedded-host-node#170 - skipForImpl('sass-embedded', () => { - it('has HWB channels', () => { - expect(color.hue).toBe(120); - expect(color.whiteness).toBe(42); - expect(color.blackness).toBe(42); - }); - }); - - it('has an alpha channel', () => { - expect(color.alpha).toBe(1); - }); - - // TODO(#1828): Update these expectations - xit('equals the same color', () => { - expect(color).toEqualWithHash(rgb(107, 148, 107)); - expect(color).toEqualWithHash(hsl(120, 16.078431372549026, 50)); - expect(color).toEqualWithHash( - hwb(120, 41.96078431372549, 41.96078431372548) - ); - }); - - it('allows negative hue', () => { - expect(hwb(-240, 42, 42).hue).toBe(120); - expect(hwb(-240, 42, 42)).toEqualWithHash(color); - }); - }); - - describe('changing color values', () => { - let color: SassColor; - beforeEach(() => { - color = rgb(18, 52, 86); - }); - - describe('change() for RGB', () => { - it('changes RGB values', () => { - expect(color.change({red: 0})).toEqualWithHash(rgb(0, 52, 86)); - expect(color.change({green: 0})).toEqualWithHash(rgb(18, 0, 86)); - expect(color.change({blue: 0})).toEqualWithHash(rgb(18, 52, 0)); - expect(color.change({alpha: 0.5})).toEqualWithHash( - rgb(18, 52, 86, 0.5) - ); - expect( - color.change({red: 0, green: 0, blue: 0, alpha: 0.5}) - ).toEqualWithHash(rgb(0, 0, 0, 0.5)); - }); - - it('allows valid values', () => { - expect(color.change({red: 0}).red).toBe(0); - expect(color.change({red: 255}).red).toBe(255); - expect(color.change({green: 0}).green).toBe(0); - expect(color.change({green: 255}).green).toBe(255); - expect(color.change({blue: 0}).blue).toBe(0); - expect(color.change({blue: 255}).blue).toBe(255); - expect(color.change({alpha: 0}).alpha).toBe(0); - expect(color.change({alpha: 1}).alpha).toBe(1); - }); - - // TODO(#1828): Update these expectations - xit('disallows invalid values', () => { - expect(() => color.change({red: -1})).toThrow(); - expect(() => color.change({red: 256})).toThrow(); - expect(() => color.change({green: -1})).toThrow(); - expect(() => color.change({green: 256})).toThrow(); - expect(() => color.change({blue: -1})).toThrow(); - expect(() => color.change({blue: 256})).toThrow(); - expect(() => color.change({alpha: -0.1})).toThrow(); - expect(() => color.change({alpha: 1.1})).toThrow(); - }); - - // TODO(#1828): Update these expectations - xit('rounds channels to the nearest integer', () => { - expect( - color.change({red: 0.1, green: 50.4, blue: 90.3}) - ).toEqualWithHash(rgb(0, 50, 90)); - expect( - color.change({red: -0.1, green: 50.5, blue: 90.9}) - ).toEqualWithHash(rgb(0, 51, 91)); - }); - }); - - describe('change() for HSL', () => { - it('changes HSL values', () => { - expect(color.change({hue: 120})).toEqualWithHash( - hsl(120, 65.3846153846154, 20.392156862745097) - ); - expect(color.change({hue: -120})).toEqualWithHash( - hsl(240, 65.3846153846154, 20.392156862745097) - ); - expect(color.change({saturation: 42})).toEqualWithHash( - hsl(210, 42, 20.392156862745097) - ); - expect(color.change({lightness: 42})).toEqualWithHash( - hsl(210, 65.3846153846154, 42) - ); - expect(color.change({alpha: 0.5})).toEqualWithHash( - hsl(210, 65.3846153846154, 20.392156862745097, 0.5) - ); - expect( - color.change({ - hue: 120, - saturation: 42, - lightness: 42, - alpha: 0.5, - }) - ).toEqualWithHash(hsl(120, 42, 42, 0.5)); - }); - - it('allows valid values', () => { - expect(color.change({saturation: 0}).saturation).toBe(0); - expect(color.change({saturation: 100}).saturation).toBe(100); - expect(color.change({lightness: 0}).lightness).toBe(0); - expect(color.change({lightness: 100}).lightness).toBe(100); - expect(color.change({alpha: 0}).alpha).toBe(0); - expect(color.change({alpha: 1}).alpha).toBe(1); - }); - - it('disallows invalid values', () => { - expect(() => color.change({saturation: -0.1})).toThrow(); - expect(() => color.change({saturation: 100.1})).toThrow(); - expect(() => color.change({lightness: -0.1})).toThrow(); - expect(() => color.change({lightness: 100.1})).toThrow(); - expect(() => color.change({alpha: -0.1})).toThrow(); - expect(() => color.change({alpha: 1.1})).toThrow(); - }); - }); - - describe('change() for HWB', () => { - it('changes HWB values', () => { - expect(color.change({hue: 120})).toEqualWithHash( - hwb(120, 7.0588235294117645, 66.27450980392157) - ); - expect(color.change({hue: -120})).toEqualWithHash( - hwb(240, 7.0588235294117645, 66.27450980392157) - ); - expect(color.change({whiteness: 42})).toEqualWithHash( - hwb(210, 42, 66.27450980392157) - ); - expect(color.change({whiteness: 50})).toEqualWithHash( - hwb(210, 50, 66.27450980392157) - ); - expect(color.change({blackness: 42})).toEqualWithHash( - hwb(210, 7.0588235294117645, 42) - ); - expect(color.change({alpha: 0.5})).toEqualWithHash( - hwb(210, 7.0588235294117645, 66.27450980392157, 0.5) - ); - expect( - color.change({ - hue: 120, - whiteness: 42, - blackness: 42, - alpha: 0.5, - }) - ).toEqualWithHash(hwb(120, 42, 42, 0.5)); - }); - - // sass/embedded-host-node#170 - skipForImpl('sass-embedded', () => { - it('allows valid values', () => { - expect(color.change({whiteness: 0}).whiteness).toBe(0); - expect(color.change({whiteness: 100}).whiteness).toBe( - 60.141509433962256 - ); - expect(color.change({blackness: 0}).blackness).toBe(0); - expect(color.change({blackness: 100}).blackness).toBe( - 93.4065934065934 - ); - expect(color.change({alpha: 0}).alpha).toBe(0); - expect(color.change({alpha: 1}).alpha).toBe(1); - }); - }); - - it('disallows invalid values', () => { - expect(() => color.change({whiteness: -0.1})).toThrow(); - expect(() => color.change({whiteness: 100.1})).toThrow(); - expect(() => color.change({blackness: -0.1})).toThrow(); - expect(() => color.change({blackness: 100.1})).toThrow(); - expect(() => color.change({alpha: -0.1})).toThrow(); - expect(() => color.change({alpha: 1.1})).toThrow(); - }); - }); - - describe('changeAlpha()', () => { - it('changes the alpha value', () => { - expect(color.change({alpha: 0.5})).toEqualWithHash( - rgb(18, 52, 86, 0.5) - ); - }); - - it('allows valid alphas', () => { - expect(color.change({alpha: 0}).alpha).toBe(0); - expect(color.change({alpha: 1}).alpha).toBe(1); - }); - - it('rejects invalid alphas', () => { - expect(() => color.change({alpha: -0.1})).toThrow(); - expect(() => color.change({alpha: 1.1})).toThrow(); - }); - }); - }); -}); diff --git a/js-api-spec/value/color/color-4-channels.test.ts b/js-api-spec/value/color/color-4-channels.test.ts new file mode 100644 index 0000000000..ac0e3dc854 --- /dev/null +++ b/js-api-spec/value/color/color-4-channels.test.ts @@ -0,0 +1,308 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +// General space-specific info and construction + +import {SassColor} from 'sass'; +import type {ChannelNameXyz, ColorSpaceXyz, KnownColorSpace} from 'sass'; +import {List} from 'immutable'; + +import {spaces} from './spaces'; +import {channelCases, channelNames} from './utils'; +import {skipForImpl} from '../../utils'; + +const spaceNames = Object.keys(spaces) as KnownColorSpace[]; + +describe('Color 4 SassColor Channels', () => { + spaceNames.forEach(spaceId => { + const space = spaces[spaceId]; + + describe(space.name, () => { + let color: SassColor; + + beforeEach(() => { + color = space.constructor(...space.pink); + }); + + describe('channelsOrNull', () => { + it('returns a list', () => { + expect(color.channelsOrNull).toFuzzyEqualList(space.pink); + expect(color.channelsOrNull.size).toBe(space.channels.length); + expect(List.isList(color.channelsOrNull)).toBeTrue(); + }); + + it('returns channel value or null, excluding alpha', () => { + const pinkCases = channelCases(...space.pink); + pinkCases.forEach(channels => { + const _color = space.constructor(...channels); + expect(_color.channelsOrNull).toFuzzyEqualList( + channels.slice(0, 3) + ); + }); + }); + }); + + describe('channels', () => { + it('returns a list', () => { + expect(color.channels).toFuzzyEqualList(space.pink); + expect(color.channels.size).toBe(space.channels.length); + expect(List.isList(color.channels)).toBeTrue(); + }); + + it('returns channel value or 0, excluding alpha', () => { + const pinkCases = channelCases(...space.pink); + pinkCases.forEach(channels => { + const expected = channels.slice(0, 3).map(channel => channel || 0); + const _color = space.constructor(...channels); + expect(_color.channels).toFuzzyEqualList(expected); + }); + }); + }); + + it('isChannelMissing', () => { + const pinkCases = channelCases(...space.pink); + pinkCases.forEach(channels => { + const expected = channels.map(channel => channel === null); + // Undefined alpha is not missing + if (expected.length === 3) expected.push(false); + const _color = space.constructor(...channels); + expect(_color.isChannelMissing(space.channels[0])).toBe(expected[0]); + expect(_color.isChannelMissing(space.channels[1])).toBe(expected[1]); + expect(_color.isChannelMissing(space.channels[2])).toBe(expected[2]); + expect(_color.isChannelMissing('alpha')).toBe(expected[3]); + }); + }); + + describe('channel', () => { + describe('without space specified', () => { + it('throws an error if channel not in space', () => { + const channelsNotInSpace = new Set(channelNames); + space.channels.forEach(channel => + channelsNotInSpace.delete(channel) + ); + channelsNotInSpace.forEach(channel => { + expect(() => color.channel(channel)).toThrow(); + }); + }); + + it('returns value if no space specified', () => { + space.channels.forEach((channel, index) => { + expect(color.channel(channel)).toFuzzyEqual(space.pink[index]); + }); + expect(color.channel('alpha')).toEqual(1); + }); + + it('returns 0 for missing channels', () => { + const nullColor = space.constructor(null, null, null, null); + space.channels.forEach(channel => { + expect(nullColor.channel(channel)).toEqual(0); + }); + expect(nullColor.channel('alpha')).toEqual(0); + }); + }); + + describe('with space specified', () => { + spaceNames.forEach(destinationSpaceId => { + it(`throws an error if channel not in ${destinationSpaceId}`, () => { + const destinationSpace = spaces[destinationSpaceId]; + const channelsNotInSpace = new Set(channelNames); + destinationSpace.channels.forEach(channel => + channelsNotInSpace.delete(channel) + ); + channelsNotInSpace.forEach(channel => { + expect(() => + color.channel(channel as ChannelNameXyz, { + space: destinationSpace.name as ColorSpaceXyz, + }) + ).toThrow(); + }); + }); + }); + + spaceNames.forEach(destinationSpaceId => { + it(`returns value when ${destinationSpaceId} is specified`, () => { + const destinationSpace = spaces[destinationSpaceId]; + destinationSpace.channels.forEach((channel, index) => { + expect( + color.channel(channel as ChannelNameXyz, { + space: destinationSpace.name as ColorSpaceXyz, + }) + ).toLooselyEqual(destinationSpace.pink[index]); + }); + expect( + color.channel('alpha' as ChannelNameXyz, { + space: destinationSpace.name as ColorSpaceXyz, + }) + ).toEqual(1); + }); + }); + }); + }); + + describe('alpha', () => { + it('returns value if set', () => { + function colorWithAlpha(alpha: number | null) { + return space.constructor(...space.pink, alpha); + } + expect(colorWithAlpha(0).alpha).toBe(0); + expect(colorWithAlpha(1).alpha).toBe(1); + expect(colorWithAlpha(0.5).alpha).toBe(0.5); + }); + + it('returns 1 if not set', () => { + const noAlphaColor = space.constructor(0, 0, 0); + expect(noAlphaColor.alpha).toBe(1); + }); + + it('returns 0 if missing', () => { + const noAlphaColor = space.constructor(0, 0, 0, null); + expect(noAlphaColor.alpha).toBe(0); + }); + }); + + // TODO(sass#3654) Failing in dart-sass pending: + // https://github.com/sass/sass/issues/3654 + skipForImpl('dart-sass', () => { + describe('isChannelPowerless', () => { + function checkPowerless( + _color: SassColor, + powerless = [false, false, false] + ) { + it(`channels ${_color.channels.toArray()} is ${powerless}`, () => { + expect(_color.isChannelPowerless(space.channels[0])).toBe( + powerless[0] + ); + expect(_color.isChannelPowerless(space.channels[1])).toBe( + powerless[1] + ); + expect(_color.isChannelPowerless(space.channels[2])).toBe( + powerless[2] + ); + }); + } + const [ch1, ch2, ch3] = space.ranges; + if (space.hasPowerless) { + // test powerless channels + switch (space.name) { + case 'hwb': + // If the combined `whiteness` and `blackness` values (after + // normalization) are equal to `100%`, then the `hue` channel is + // powerless. + checkPowerless(space.constructor(ch1[0], 0, 100), [ + true, + false, + false, + ]); + checkPowerless(space.constructor(ch1[0], 100, 0), [ + true, + false, + false, + ]); + checkPowerless(space.constructor(ch1[0], 50, 50), [ + true, + false, + false, + ]); + checkPowerless(space.constructor(ch1[1], 0, 100), [ + true, + false, + false, + ]); + checkPowerless(space.constructor(ch1[1], 100, 0), [ + true, + false, + false, + ]); + checkPowerless(space.constructor(ch1[1], 50, 50), [ + true, + false, + false, + ]); + + checkPowerless(space.constructor(ch1[0], ch2[1], ch3[1])); + checkPowerless(space.constructor(ch1[0], ch2[0], ch3[0])); + checkPowerless(space.constructor(ch1[1], ch2[1], ch3[1])); + checkPowerless(space.constructor(ch1[1], ch2[0], ch3[0])); + + break; + + case 'hsl': + // hsl- If the saturation of an HSL color is 0%, then the hue component is powerless. + checkPowerless(space.constructor(ch1[0], 0, ch3[0]), [ + true, + false, + false, + ]); + checkPowerless(space.constructor(ch1[0], 0, ch3[1]), [ + true, + false, + false, + ]); + checkPowerless(space.constructor(ch1[1], 0, ch3[1]), [ + true, + false, + false, + ]); + checkPowerless(space.constructor(ch1[1], 0, ch3[0]), [ + true, + false, + false, + ]); + + checkPowerless(space.constructor(ch1[0], ch2[1], ch3[0])); + checkPowerless(space.constructor(ch1[0], ch2[1], ch3[1])); + checkPowerless(space.constructor(ch1[1], ch2[1], ch3[1])); + checkPowerless(space.constructor(ch1[1], ch2[1], ch3[0])); + break; + + case 'lch': + case 'oklch': + // (ok)lch- If the `chroma` value is 0%, then the `hue` channel is powerless. + checkPowerless(space.constructor(ch1[0], 0, ch3[0]), [ + false, + false, + true, + ]); + checkPowerless(space.constructor(ch1[0], 0, ch3[1]), [ + false, + false, + true, + ]); + checkPowerless(space.constructor(ch1[1], 0, ch3[1]), [ + false, + false, + true, + ]); + checkPowerless(space.constructor(ch1[1], 0, ch3[0]), [ + false, + false, + true, + ]); + + checkPowerless(space.constructor(ch1[0], ch2[1], ch3[0])); + checkPowerless(space.constructor(ch1[0], ch2[1], ch3[1])); + checkPowerless(space.constructor(ch1[1], ch2[1], ch3[1])); + checkPowerless(space.constructor(ch1[1], ch2[1], ch3[0])); + break; + + default: + throw new Error( + `Unimplemented isPowerless check for ${space.name}` + ); + } + } else { + checkPowerless(space.constructor(ch1[0], ch2[0], ch3[0])); + checkPowerless(space.constructor(ch1[1], ch2[0], ch3[0])); + checkPowerless(space.constructor(ch1[1], ch2[1], ch3[0])); + checkPowerless(space.constructor(ch1[1], ch2[1], ch3[1])); + checkPowerless(space.constructor(ch1[0], ch2[1], ch3[1])); + checkPowerless(space.constructor(ch1[0], ch2[0], ch3[1])); + checkPowerless(space.constructor(ch1[1], ch2[0], ch3[1])); + checkPowerless(space.constructor(ch1[0], ch2[1], ch3[0])); + } + }); + }); + }); + }); +}); diff --git a/js-api-spec/value/color/color-4-conversions.test.ts b/js-api-spec/value/color/color-4-conversions.test.ts new file mode 100644 index 0000000000..2c6ffa6f58 --- /dev/null +++ b/js-api-spec/value/color/color-4-conversions.test.ts @@ -0,0 +1,204 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +// General space-specific info and construction + +import {SassColor} from 'sass'; +import type { + ColorSpaceXyz, + HueInterpolationMethod, + KnownColorSpace, +} from 'sass'; + +import {skipForImpl} from '../../utils'; +import {spaces} from './spaces'; +import {interpolations} from './interpolation-examples'; + +const spaceNames = Object.keys(spaces) as KnownColorSpace[]; + +describe('Color 4 SassColors Conversions', () => { + spaceNames.forEach(spaceId => { + const space = spaces[spaceId]; + + describe(space.name, () => { + let color: SassColor, blue: SassColor; + beforeEach(() => { + color = space.constructor(...space.pink); + blue = space.constructor(...space.blue); + }); + + describe('toSpace', () => { + spaceNames.forEach(destinationSpaceId => { + it(`converts pink to ${destinationSpaceId}`, () => { + const destinationSpace = spaces[destinationSpaceId]; + const res = color.toSpace(destinationSpace.name); + expect(res.space).toBe(destinationSpace.name); + + const expected = destinationSpace.constructor( + ...destinationSpace.pink + ); + expect(res).toLooselyEqualColor(expected); + }); + }); + }); + + // TODO: Waiting on new ColorJS release to fix `hue` interpolation: + // https://github.com/LeaVerou/color.js/pull/338 + skipForImpl('sass-embedded', () => { + // TODO: Failing in dart-sass because `hue` should be normalized to the + // [0, 360) range + skipForImpl('dart-sass', () => { + describe('interpolate', () => { + it('interpolates examples', () => { + const examples = interpolations[space.name]; + examples.forEach(([input, output]) => { + const res = color.interpolate(blue, { + weight: input.weight, + method: input.method as HueInterpolationMethod, + }); + const outputColor = space.constructor(...output); + expect(res).toLooselyEqualColor(outputColor); + }); + }); + }); + }); + }); + + describe('change', () => { + it('changes all channels in own space', () => { + space.channels.forEach((channelName, index) => { + const expectedChannels = [ + space.pink[0], + space.pink[1], + space.pink[2], + ] as [number, number, number]; + expectedChannels[index] = 0; + expect(color.change({[channelName]: 0})).toLooselyEqualColor( + space.constructor(...expectedChannels) + ); + }); + expect(color.change({alpha: 0})).toLooselyEqualColor( + space.constructor(...space.pink, 0) + ); + }); + + it('change with explicit undefined makes no change', () => { + space.channels.forEach(channelName => { + expect( + color.change({[channelName]: undefined}) + ).toLooselyEqualColor(space.constructor(...space.pink)); + }); + expect(color.change({alpha: undefined})).toLooselyEqualColor( + space.constructor(...space.pink, 1) + ); + }); + + it('explicit null sets channel to missing', () => { + // Explicitly set space to avoid legacy null-alpha behavior, which is + // tested in Legacy suite. + space.channels.forEach((channelName, index) => { + const expectedChannels = [ + space.pink[0], + space.pink[1], + space.pink[2], + ] as [number | null, number | null, number | null]; + expectedChannels[index] = null; + const changed = color.change({ + [channelName]: null, + space: space.name as 'xyz', + }); + expect(changed).toLooselyEqualColor( + space.constructor(...expectedChannels) + ); + expect(changed.isChannelMissing(channelName)).toBeTrue(); + }); + expect( + color.change({alpha: null, space: space.name as 'xyz'}) + ).toLooselyEqualColor(space.constructor(...space.pink, null)); + }); + + spaceNames.forEach(destinationSpaceId => { + it(`changes all channels with space set to ${destinationSpaceId}`, () => { + const destinationSpace = spaces[destinationSpaceId]; + destinationSpace.channels.forEach((channel, index) => { + const destinationChannels = [ + destinationSpace.pink[0], + destinationSpace.pink[1], + destinationSpace.pink[2], + ] as [number, number, number]; + + // Certain channel values cause equality issues on 1-3 of 16*16*3 + // cases. 0.45 is a magic number that works around this until the + // root cause is determined. + const scale = 0.45; + const channelValue = destinationSpace.ranges[index][1] * scale; + + destinationChannels[index] = channelValue; + const expected = destinationSpace + .constructor(...destinationChannels) + .toSpace(space.name); + + expect( + color.change({ + [channel]: channelValue, + space: destinationSpace.name as ColorSpaceXyz, + }) + ).toLooselyEqualColor(expected); + }); + }); + }); + + it('should throw on invalid alpha', () => { + expect(() => color.change({alpha: -1})).toThrow(); + expect(() => color.change({alpha: 1.1})).toThrow(); + }); + if (space.channels.includes('lightness')) { + describe('out of range lightness', () => { + it('throws on negative lightness', () => { + expect(() => color.change({lightness: -1})).toThrow(); + }); + // TODO: Failing for oklab and oklch in dart-sass + skipForImpl('dart-sass', () => { + it('throws on lightness higher than bounds', () => { + const index = space.channels.findIndex( + channel => channel === 'lightness' + ); + const lightness = space.ranges[index][1] + 1; + expect(() => color.change({lightness})).toThrow(); + }); + }); + }); + } + }); + + describe('isInGamut', () => { + // Our `pink` color is in gamut for every space. + it('is true for in gamut colors in own space', () => { + expect(color.isInGamut()).toBe(true); + }); + + spaceNames.forEach(destinationSpaceId => { + it(`is true for in gamut colors in ${destinationSpaceId}`, () => { + const destinationSpace = spaces[destinationSpaceId]; + expect(color.isInGamut(destinationSpace.name)).toBe(true); + }); + }); + + it(`is ${!space.hasOutOfGamut} for out of range colors in own space`, () => { + const outOfGamut = space.constructor(...space.gamutExamples[0][0]); + expect(outOfGamut.isInGamut()).toBe(!space.hasOutOfGamut); + }); + }); + + describe('toGamut', () => { + space.gamutExamples.forEach(([input, output]) => { + it(`in own space, ${input} -> ${output}`, () => { + const res = space.constructor(...input).toGamut(); + expect(res).toLooselyEqualColor(space.constructor(...output)); + }); + }); + }); + }); + }); +}); diff --git a/js-api-spec/value/color/color-4-nonparametizable.test.ts b/js-api-spec/value/color/color-4-nonparametizable.test.ts new file mode 100644 index 0000000000..2609093359 --- /dev/null +++ b/js-api-spec/value/color/color-4-nonparametizable.test.ts @@ -0,0 +1,66 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +// Tests that can't be generally parameterized + +import {SassColor} from 'sass'; +import type { + ChannelName, + ChannelNameXyz, + ColorSpaceXyz, + KnownColorSpace, +} from 'sass'; + +import {skipForImpl} from '../../utils'; +import * as constructors from './constructors'; + +describe('Color 4 SassColors Non-parametizable', () => { + // TODO: Waiting on new ColorJS release to fix `toGamut` mapping: + // https://github.com/LeaVerou/color.js/pull/344 + skipForImpl('sass-embedded', () => { + it('toGamut with space', () => { + const cases: [SassColor, KnownColorSpace, SassColor][] = [ + [ + constructors.oklch(0.8, 2, 150), + 'display-p3', + constructors.oklch( + 0.8011972524233195, + 0.31025433677129627, + 149.69615588210382 + ), + ], + [ + constructors.oklch(0.8, 2, 150), + 'srgb', + constructors.oklch( + 0.8086628549532134, + 0.23694508940439973, + 147.5313920153958 + ), + ], + ]; + cases.forEach(([input, space, output]) => { + expect(input.toGamut(space)).toLooselyEqualColor(output); + }); + }); + }); + + it('channel with space specified, missing returns 0', () => { + const cases: [SassColor, KnownColorSpace, ChannelName][] = [ + [constructors.oklch(null, null, null), 'lch', 'hue'], + [constructors.oklch(null, null, null), 'lch', 'lightness'], + [constructors.oklch(null, null, null), 'hsl', 'hue'], + [constructors.oklch(null, null, null), 'hsl', 'lightness'], + [constructors.xyz(null, null, null), 'lab', 'lightness'], + ]; + + cases.forEach(([color, space, channel]) => { + expect( + color.channel(channel as ChannelNameXyz, { + space: space as ColorSpaceXyz, + }) + ).toBe(0); + }); + }); +}); diff --git a/js-api-spec/value/color/color-4-spaces.test.ts b/js-api-spec/value/color/color-4-spaces.test.ts new file mode 100644 index 0000000000..b83e9c2f78 --- /dev/null +++ b/js-api-spec/value/color/color-4-spaces.test.ts @@ -0,0 +1,90 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +// General space-specific info and construction + +import {Value, SassColor} from 'sass'; +import type {KnownColorSpace} from 'sass'; + +import {spaces} from './spaces'; +import {skipForImpl} from '../../utils'; + +const spaceNames = Object.keys(spaces) as KnownColorSpace[]; + +describe('Color 4 SassColors Spaces', () => { + spaceNames.forEach(spaceId => { + const space = spaces[spaceId]; + + describe(space.name, () => { + let color: SassColor; + beforeEach(() => { + color = space.constructor(...space.pink); + }); + + it('is a value', () => { + expect(color).toBeInstanceOf(Value); + }); + + it('is a color', () => { + expect(color).toBeInstanceOf(SassColor); + expect(color.assertColor()).toBe(color); + }); + + it("isn't any other type", () => { + expect(() => color.assertBoolean()).toThrow(); + expect(() => color.assertCalculation()).toThrow(); + expect(() => color.assertFunction()).toThrow(); + expect(() => color.assertMap()).toThrow(); + expect(color.tryMap()).toBe(null); + expect(() => color.assertMixin()).toThrow(); + expect(() => color.assertNumber()).toThrow(); + expect(() => color.assertString()).toThrow(); + }); + + describe('validation on construction', () => { + it('throws on invalid alpha', () => { + expect(() => { + space.constructor(...space.pink, -1); + }).toThrow(); + expect(() => { + space.constructor(...space.pink, 1.1); + }).toThrow(); + }); + + if (space.channels.includes('lightness')) { + describe('out of range lightness', () => { + it('throws on negative lightness', () => { + const index = space.channels.findIndex( + channel => channel === 'lightness' + ); + const channels = [...space.pink] as [number, number, number]; + channels[index] = -1; + expect(() => space.constructor(...channels)).toThrow(); + }); + + // TODO: Failing for oklab and oklch in dart-sass + skipForImpl('dart-sass', () => { + it('throws on lightness higher than bounds', () => { + const index = space.channels.findIndex( + channel => channel === 'lightness' + ); + const channels = [...space.pink] as [number, number, number]; + channels[index] = space.ranges[index][1] + 1; + expect(() => space.constructor(...channels)).toThrow(); + }); + }); + }); + } + }); + + it(`returns name for ${space.name}`, () => { + expect(color.space).toBe(space.name); + }); + + it(`isLegacy returns ${space.isLegacy} for ${space.name}`, () => { + expect(color.isLegacy).toBe(space.isLegacy); + }); + }); + }); +}); diff --git a/js-api-spec/value/color/constructors.ts b/js-api-spec/value/color/constructors.ts new file mode 100644 index 0000000000..f41b61e90b --- /dev/null +++ b/js-api-spec/value/color/constructors.ts @@ -0,0 +1,194 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +import {SassColor} from 'sass'; + +export type Constructor = ( + channel1: number | null, + channel2: number | null, + channel3: number | null, + alpha?: number | null +) => SassColor; + +/** A utility function for creating an RGB color without specifying a space. */ +export function legacyRGB( + red: number, + green: number, + blue: number, + alpha?: number +): SassColor { + return new SassColor({red, green, blue, alpha}); +} + +/** A utility function for creating an RGB color. */ +export function rgb( + red: number | null, + green: number | null, + blue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({red, green, blue, alpha, space: 'rgb'}); +} + +/** A utility function for creating an HSL color without specifying a space. */ +export function legacyHsl( + hue: number, + saturation: number, + lightness: number, + alpha?: number +): SassColor { + return new SassColor({hue, saturation, lightness, alpha}); +} + +/** A utility function for creating an HSL color. */ +export const hsl: Constructor = function ( + hue: number | null, + saturation: number | null, + lightness: number | null, + alpha?: number | null +): SassColor { + return new SassColor({hue, saturation, lightness, alpha, space: 'hsl'}); +}; + +/** A utility function for creating an HWB color without specifying a space. */ +export const legacyHwb: Constructor = function ( + hue: number | null, + whiteness: number | null, + blackness: number | null, + alpha?: number | null +): SassColor { + return new SassColor({hue, whiteness, blackness, alpha}); +}; + +/** A utility function for creating an HWB color. */ +export const hwb: Constructor = function ( + hue: number | null, + whiteness: number | null, + blackness: number | null, + alpha?: number | null +): SassColor { + return new SassColor({hue, whiteness, blackness, alpha, space: 'hwb'}); +}; + +/** A utility function for creating a Lab color. */ +export const lab: Constructor = function ( + lightness: number | null, + a: number | null, + b: number | null, + alpha?: number | null +): SassColor { + return new SassColor({lightness, a, b, alpha, space: 'lab'}); +}; +/** A utility function for creating a Oklab color. */ +export const oklab: Constructor = function ( + lightness: number | null, + a: number | null, + b: number | null, + alpha?: number | null +): SassColor { + return new SassColor({lightness, a, b, alpha, space: 'oklab'}); +}; +/** A utility function for creating an LCH color. */ +export const lch: Constructor = function ( + lightness: number | null, + chroma: number | null, + hue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({lightness, chroma, hue, alpha, space: 'lch'}); +}; +/** A utility function for creating a Oklab color. */ +export const oklch: Constructor = function ( + lightness: number | null, + chroma: number | null, + hue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({lightness, chroma, hue, alpha, space: 'oklch'}); +}; + +/** A utility function for creating an srgb color. */ +export const srgb: Constructor = function ( + red: number | null, + green: number | null, + blue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({red, green, blue, alpha, space: 'srgb'}); +}; +/** A utility function for creating an srgb-linear color. */ +export const srgbLinear: Constructor = function ( + red: number | null, + green: number | null, + blue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({red, green, blue, alpha, space: 'srgb-linear'}); +}; +/** A utility function for creating an rec2020 color. */ +export const rec2020: Constructor = function ( + red: number | null, + green: number | null, + blue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({red, green, blue, alpha, space: 'rec2020'}); +}; +/** A utility function for creating an display-p3 color. */ +export const displayP3: Constructor = function ( + red: number | null, + green: number | null, + blue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({red, green, blue, alpha, space: 'display-p3'}); +}; +/** A utility function for creating an a98-rgb color. */ +export const a98Rgb: Constructor = function ( + red: number | null, + green: number | null, + blue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({red, green, blue, alpha, space: 'a98-rgb'}); +}; +/** A utility function for creating a prophoto-rgb color. */ +export const prophotoRgb: Constructor = function ( + red: number | null, + green: number | null, + blue: number | null, + alpha?: number | null +): SassColor { + return new SassColor({red, green, blue, alpha, space: 'prophoto-rgb'}); +}; + +/** A utility function for creating a xyz color. */ +export const xyz: Constructor = function ( + x: number | null, + y: number | null, + z: number | null, + alpha?: number | null +): SassColor { + return new SassColor({x, y, z, alpha, space: 'xyz'}); +}; + +/** A utility function for creating a xyz-d50 color. */ +export const xyzD50: Constructor = function ( + x: number | null, + y: number | null, + z: number | null, + alpha?: number | null +): SassColor { + return new SassColor({x, y, z, alpha, space: 'xyz-d50'}); +}; + +/** A utility function for creating a xyz-d65 color. */ +export const xyzD65: Constructor = function ( + x: number | null, + y: number | null, + z: number | null, + alpha?: number | null +): SassColor { + return new SassColor({x, y, z, alpha, space: 'xyz-d65'}); +}; diff --git a/js-api-spec/value/color/interpolation-examples.ts b/js-api-spec/value/color/interpolation-examples.ts new file mode 100644 index 0000000000..e3de037883 --- /dev/null +++ b/js-api-spec/value/color/interpolation-examples.ts @@ -0,0 +1,447 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +type InterpolationExample = [ + {weight: number; method?: string}, + [number, number, number] +]; + +// These interpolations are the result of mixing `pink` as the primary color +// with `blue` as the secondary color, with the specified `weight` and for polar +// spaces, the hue interpolation method `method`. These were calculated using +// [Color.js](https://colorjs.io/). +export const interpolations: {[space: string]: InterpolationExample[]} = { + lab: [ + [ + { + weight: 0.5, + }, + [58.614201646094955, 10.016665992350433, -8.387820174394456], + ], + [ + { + weight: 1, + }, + [78.27047872644108, 35.20288139978972, 1.0168442562642044], + ], + [ + { + weight: 0, + }, + [38.95792456574883, -15.169549415088852, -17.792484605053115], + ], + ], + oklab: [ + [ + { + weight: 0.5, + }, + [0.6476500020040917, 0.02748550994678843, -0.023408287379941606], + ], + [ + { + weight: 1, + }, + [0.8241000000000002, 0.10608808442731632, 0.0015900762693974446], + ], + [ + { + weight: 0, + }, + [0.47120000400818335, -0.05111706453373946, -0.048406651029280656], + ], + ], + lch: [ + [ + { + weight: 0.5, + }, + [58.61420164622054, 29.299459370089924, 295.6021177856686], + ], + [ + { + weight: 1, + }, + [78.27047872644108, 35.21756424128674, 1.6545432253797685], + ], + [ + { + weight: 0, + }, + [38.957924566, 23.38135449889311, 229.5496923459574], + ], + [ + { + weight: 0.5, + method: 'shorter', + }, + [58.61420164622054, 29.299459370089924, 295.6021177856686], + ], + [ + { + weight: 0.5, + method: 'longer', + }, + [58.61420164622054, 29.299459370089924, 115.60211778566858], + ], + [ + { + weight: 0.5, + method: 'increasing', + }, + [58.61420164622054, 29.299459370089924, 115.60211778566858], + ], + [ + { + weight: 0.5, + method: 'decreasing', + }, + [58.61420164622054, 29.299459370089924, 295.6021177856686], + ], + ], + oklch: [ + [ + { + weight: 0.5, + }, + [0.6476500020040917, 0.08824999343187809, 292.1493505923757], + ], + [ + { + weight: 1, + }, + [0.8241, 0.1061, 0.8586999999999989], + ], + [ + { + weight: 0, + }, + [0.47120000400818335, 0.07039998686375618, 223.4400011847514], + ], + [ + { + weight: 0.5, + method: 'shorter', + }, + [0.6476500020040917, 0.08824999343187809, 292.1493505923757], + ], + [ + { + weight: 0.5, + method: 'longer', + }, + [0.6476500020040917, 0.08824999343187809, 112.1493505923757], + ], + [ + { + weight: 0.5, + method: 'increasing', + }, + [0.6476500020040917, 0.08824999343187809, 112.1493505923757], + ], + [ + { + weight: 0.5, + method: 'decreasing', + }, + [0.6476500020040917, 0.08824999343187809, 292.1493505923757], + ], + ], + srgb: [ + [ + { + weight: 0.5, + }, + [0.5744899843543774, 0.5252921410815925, 0.6147851204581418], + ], + [ + { + weight: 1, + }, + [0.9999785463111585, 0.6599448662991679, 0.758373017125016], + ], + [ + { + weight: 0, + }, + [0.14900142239759617, 0.39063941586401707, 0.47119722379126755], + ], + ], + 'srgb-linear': [ + [ + { + weight: 0.5, + }, + [0.5096647054609955, 0.25972630442483197, 0.36200193586790025], + ], + [ + { + weight: 1, + }, + [0.999951196094508, 0.3930503811476254, 0.5356603778005655], + ], + [ + { + weight: 0, + }, + [0.01937821482748292, 0.12640222770203852, 0.18834349393523497], + ], + ], + 'display-p3': [ + [ + { + weight: 0.5, + }, + [0.5836172975616658, 0.530184139982079, 0.609686907635745], + ], + [ + { + weight: 1, + }, + [0.9510333333617188, 0.6749909745845027, 0.7568568353546363], + ], + [ + { + weight: 0, + }, + [0.2162012617616128, 0.38537730537965537, 0.46251697991685353], + ], + ], + 'a98-rgb': [ + [ + { + weight: 0.5, + }, + [0.5865373142666512, 0.5222346343208055, 0.6071485436534567], + ], + [ + { + weight: 1, + }, + [0.9172837001828321, 0.6540226622083835, 0.7491144397116841], + ], + [ + { + weight: 0, + }, + [0.25579092835047035, 0.3904466064332277, 0.4651826475952292], + ], + ], + 'prophoto-rgb': [ + [ + { + weight: 0.5, + }, + [0.5427623847027483, 0.4757813439417372, 0.5419635636962455], + ], + [ + { + weight: 1, + }, + [0.842345736209146, 0.6470539622987257, 0.7003583323790157], + ], + [ + { + weight: 0, + }, + [0.2431790331963506, 0.3045087255847488, 0.38356879501347535], + ], + ], + rec2020: [ + [ + { + weight: 0.5, + }, + [0.5494120530883964, 0.4907232619435038, 0.5681615893671463], + ], + [ + { + weight: 1, + }, + [0.8837118321235519, 0.6578067923850563, 0.7273197917658354], + ], + [ + { + weight: 0, + }, + [0.21511227405324085, 0.32363973150195124, 0.4090033869684574], + ], + ], + xyz: [ + [ + { + weight: 0.5, + }, + [0.36838948901950813, 0.3202564721891328, 0.38490473490885063], + ], + [ + { + weight: 1, + }, + [0.6495957411726918, 0.5323965129525022, 0.575341840710865], + ], + [ + { + weight: 0, + }, + [0.08718323686632445, 0.10811643142576338, 0.19446762910683624], + ], + ], + 'xyz-d50': [ + [ + { + weight: 0.5, + }, + [0.3740759617070767, 0.3215358224064546, 0.2908164562135577], + ], + [ + { + weight: 1, + }, + [0.6640698533004002, 0.5367266625281085, 0.4345958246720296], + ], + [ + { + weight: 0, + }, + [0.08408207011375313, 0.10634498228480066, 0.14703708775508573], + ], + ], + rgb: [ + [ + { + weight: 0.5, + }, + [146.56944672156501, 134.1448156837381, 157.00580432872178], + ], + [ + { + weight: 1, + }, + [254.9945293093454, 168.28594090628783, 193.38511936687908], + ], + [ + { + weight: 0, + }, + [38.14436413378462, 100.00369046118837, 120.62648929056449], + ], + ], + hsl: [ + [ + { + weight: 0.5, + }, + [268.816848125996, 75.96890150160368, 57.00305146997975], + ], + [ + { + weight: 1, + }, + [342.6320467744765, 99.98738302509669, 82.99617063051632], + ], + [ + { + weight: 0, + }, + [195.00164947751546, 51.95041997811069, 31.009932309443187], + ], + [ + { + weight: 0.5, + method: 'shorter', + }, + [268.816848125996, 75.96890150160368, 57.00305146997975], + ], + [ + { + weight: 0.5, + method: 'longer', + }, + [88.816848125996, 75.96890150160368, 57.00305146997975], + ], + [ + { + weight: 0.5, + method: 'increasing', + }, + [88.816848125996, 75.96890150160368, 57.00305146997975], + ], + [ + { + weight: 0.5, + method: 'decreasing', + }, + [268.816848125996, 75.96890150160368, 57.00305146997975], + ], + ], + hwb: [ + [ + { + weight: 0.5, + }, + [268.816848125996, 40.447314434838205, 26.4412114948787], + ], + [ + { + weight: 1, + }, + [342.6320467744765, 65.99448662991679, 0.002145368884157506], + ], + [ + { + weight: 0, + }, + [195.00164947751546, 14.90014223975961, 52.880277620873244], + ], + [ + { + weight: 0.5, + method: 'shorter', + }, + [268.816848125996, 40.447314434838205, 26.4412114948787], + ], + [ + { + weight: 0.5, + method: 'longer', + }, + [88.816848125996, 40.447314434838205, 26.4412114948787], + ], + [ + { + weight: 0.5, + method: 'increasing', + }, + [88.816848125996, 40.447314434838205, 26.4412114948787], + ], + [ + { + weight: 0.5, + method: 'decreasing', + }, + [268.816848125996, 40.447314434838205, 26.4412114948787], + ], + ], + 'xyz-d65': [ + [ + { + weight: 0.5, + }, + [0.36838948901950813, 0.3202564721891328, 0.38490473490885063], + ], + [ + { + weight: 1, + }, + [0.6495957411726918, 0.5323965129525022, 0.575341840710865], + ], + [ + { + weight: 0, + }, + [0.08718323686632445, 0.10811643142576338, 0.19446762910683624], + ], + ], +}; diff --git a/js-api-spec/value/color/legacy.test.ts b/js-api-spec/value/color/legacy.test.ts new file mode 100644 index 0000000000..b07e420fca --- /dev/null +++ b/js-api-spec/value/color/legacy.test.ts @@ -0,0 +1,644 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +import {Value, SassColor} from 'sass'; +import {captureStdio, skipForImpl} from '../../utils'; +import {legacyRGB, legacyHsl, legacyHwb} from './constructors'; + +describe('Legacy SassColor', () => { + describe('construction', () => { + describe('type', () => { + let color: SassColor; + beforeEach(() => { + color = legacyRGB(18, 52, 86); + }); + + it('is a value', () => { + expect(color).toBeInstanceOf(Value); + }); + + it('is a color', () => { + expect(color).toBeInstanceOf(SassColor); + expect(color.assertColor()).toBe(color); + }); + + it("isn't any other type", () => { + expect(() => color.assertBoolean()).toThrow(); + expect(() => color.assertCalculation()).toThrow(); + expect(() => color.assertFunction()).toThrow(); + expect(() => color.assertMap()).toThrow(); + expect(color.tryMap()).toBe(null); + expect(() => color.assertMixin()).toThrow(); + expect(() => color.assertNumber()).toThrow(); + expect(() => color.assertString()).toThrow(); + }); + }); + + describe('rgb()', () => { + it('allows valid values', () => { + expect(() => legacyRGB(0, 0, 0, 0)).not.toThrow(); + expect(() => legacyRGB(255, 255, 255, 1)).not.toThrow(); + }); + + it('disallows invalid alpha values', () => { + expect(() => legacyRGB(0, 0, 0, -0.1)).toThrow(); + expect(() => legacyRGB(0, 0, 0, 1.1)).toThrow(); + }); + + it('allows out of range values which were invalid before color 4', () => { + expect(() => legacyRGB(-1, 0, 0, 0)).not.toThrow(); + expect(() => legacyRGB(0, -1, 0, 0)).not.toThrow(); + expect(() => legacyRGB(0, 0, -1, 0)).not.toThrow(); + expect(() => legacyRGB(256, 0, 0, 0)).not.toThrow(); + expect(() => legacyRGB(0, 256, 0, 0)).not.toThrow(); + expect(() => legacyRGB(0, 0, 256, 0)).not.toThrow(); + }); + + it('does not round channels to the nearest integer', () => { + expect(legacyRGB(0.1, 50.4, 90.3).channels).toFuzzyEqualList([ + 0.1, 50.4, 90.3, + ]); + expect(legacyRGB(-0.1, 50.5, 90.7).channels).toFuzzyEqualList([ + -0.1, 50.5, 90.7, + ]); + }); + + describe('deprecations', () => { + it('warns with null alpha and no space', () => { + const stdio = captureStdio(() => { + new SassColor({red: 1, green: 1, blue: 1, alpha: null}); + }); + expect(stdio.err).toMatch('null-alpha'); + }); + it("doesn't warn for undefined alpha and no space", () => { + const stdio = captureStdio(() => { + new SassColor({red: 1, green: 1, blue: 1, alpha: undefined}); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for no alpha and no space", () => { + const stdio = captureStdio(() => { + new SassColor({red: 1, green: 1, blue: 1}); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for undefined alpha and undefined space", () => { + const stdio = captureStdio(() => { + new SassColor({ + red: 1, + green: 1, + blue: 1, + alpha: undefined, + space: undefined, + }); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for null alpha with space", () => { + const stdio = captureStdio(() => { + new SassColor({ + red: 1, + green: 1, + blue: 1, + alpha: null, + space: 'rgb', + }); + }); + expect(stdio.err).toBeEmptyString(); + }); + }); + }); + + describe('hsl()', () => { + // TODO: Failing in dart-sass because saturation should not be clamped + skipForImpl('dart-sass', () => { + it('allows valid values', () => { + expect(() => legacyHsl(0, 0, 0, 0)).not.toThrow(); + expect(() => legacyHsl(4320, 100, 100, 1)).not.toThrow(); + expect(() => legacyHsl(0, -0.1, 0, 0)).not.toThrow(); + expect(() => legacyHsl(0, 100.1, 0, 0)).not.toThrow(); + }); + }); + + it('disallows invalid values', () => { + expect(() => legacyHsl(0, 0, -0.1, 0)).toThrow(); + expect(() => legacyHsl(0, 0, 0, -0.1)).toThrow(); + expect(() => legacyHsl(0, 0, 100.1, 0)).toThrow(); + expect(() => legacyHsl(0, 0, 0, 1.1)).toThrow(); + }); + + describe('deprecations', () => { + it('warns with null alpha and no space', () => { + const stdio = captureStdio(() => { + new SassColor({hue: 1, saturation: 1, lightness: 1, alpha: null}); + }); + expect(stdio.err).toMatch('null-alpha'); + }); + it("doesn't warn for undefined alpha and no space", () => { + const stdio = captureStdio(() => { + new SassColor({ + hue: 1, + saturation: 1, + lightness: 1, + alpha: undefined, + }); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for no alpha and no space", () => { + const stdio = captureStdio(() => { + new SassColor({hue: 1, saturation: 1, lightness: 1}); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for undefined alpha and undefined space", () => { + const stdio = captureStdio(() => { + new SassColor({ + hue: 1, + saturation: 1, + lightness: 1, + alpha: undefined, + space: undefined, + }); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for null alpha with space", () => { + const stdio = captureStdio(() => { + new SassColor({ + hue: 1, + saturation: 1, + lightness: 1, + alpha: null, + space: 'hsl', + }); + }); + expect(stdio.err).toBeEmptyString(); + }); + }); + }); + + describe('hwb()', () => { + // TODO: Failing in dart-sass because whiteness and blackness should not + // be clamped + skipForImpl('dart-sass', () => { + it('allows valid values', () => { + expect(() => legacyHwb(0, 0, 0, 0)).not.toThrow(); + expect(() => legacyHwb(4320, 100, 100, 1)).not.toThrow(); + expect(() => legacyHwb(0, -0.1, 0, 0)).not.toThrow(); + expect(() => legacyHwb(0, 0, -0.1, 0)).not.toThrow(); + expect(() => legacyHwb(0, 100.1, 0, 0)).not.toThrow(); + expect(() => legacyHwb(0, 0, 100.1, 0)).not.toThrow(); + }); + }); + + it('disallows invalid values', () => { + expect(() => legacyHwb(0, 0, 0, -0.1)).toThrow(); + expect(() => legacyHwb(0, 0, 0, 1.1)).toThrow(); + }); + + describe('deprecations', () => { + it('warns with null alpha and no space', () => { + const stdio = captureStdio(() => { + new SassColor({hue: 1, whiteness: 1, blackness: 1, alpha: null}); + }); + expect(stdio.err).toMatch('null-alpha'); + }); + it("doesn't warn for undefined alpha and no space", () => { + const stdio = captureStdio(() => { + new SassColor({ + hue: 1, + whiteness: 1, + blackness: 1, + alpha: undefined, + }); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for no alpha and no space", () => { + const stdio = captureStdio(() => { + new SassColor({hue: 1, whiteness: 1, blackness: 1}); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for undefined alpha and undefined space", () => { + const stdio = captureStdio(() => { + new SassColor({ + hue: 1, + whiteness: 1, + blackness: 1, + alpha: undefined, + space: undefined, + }); + }); + expect(stdio.err).toBeEmptyString(); + }); + it("doesn't warn for null alpha with space", () => { + const stdio = captureStdio(() => { + new SassColor({ + hue: 1, + whiteness: 1, + blackness: 1, + alpha: null, + space: 'hwb', + }); + }); + expect(stdio.err).toBeEmptyString(); + }); + }); + }); + }); + + describe('an RGB color', () => { + let color: SassColor; + beforeEach(() => { + color = legacyRGB(18, 52, 86); + }); + + it('has RGB channels', () => { + const stdio = captureStdio(() => { + expect(color.red).toFuzzyEqual(18); + expect(color.green).toFuzzyEqual(52); + expect(color.blue).toFuzzyEqual(86); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has HSL channels', () => { + const stdio = captureStdio(() => { + expect(color.hue).toFuzzyEqual(210); + expect(color.saturation).toFuzzyEqual(65.3846153846154); + expect(color.lightness).toFuzzyEqual(20.392156862745097); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has HWB channels', () => { + const stdio = captureStdio(() => { + expect(color.hue).toFuzzyEqual(210); + expect(color.whiteness).toFuzzyEqual(7.0588235294117645); + expect(color.blackness).toFuzzyEqual(66.27450980392157); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has an alpha channel', () => { + expect(color.alpha).toBe(1); + }); + + it('equals the same color even in a different color space', () => { + expect(color).toEqualWithHash(legacyRGB(18, 52, 86)); + expect(color).toEqualWithHash( + legacyHsl(210, 65.3846153846154, 20.392156862745097) + ); + expect(color).toEqualWithHash( + legacyHwb(210, 7.0588235294117645, 66.27450980392157) + ); + }); + }); + + describe('an HSL color', () => { + let color: SassColor; + beforeEach(() => { + color = legacyHsl(120, 42, 42); + }); + + it('has RGB channels', () => { + const stdio = captureStdio(() => { + expect(color.red).toFuzzyEqual(62); + expect(color.green).toFuzzyEqual(152); + expect(color.blue).toFuzzyEqual(62); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has HSL channels', () => { + const stdio = captureStdio(() => { + expect(color.hue).toFuzzyEqual(120); + expect(color.saturation).toFuzzyEqual(42); + expect(color.lightness).toFuzzyEqual(42); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has HWB channels', () => { + const stdio = captureStdio(() => { + expect(color.hue).toFuzzyEqual(120); + expect(color.whiteness).toFuzzyEqual(24.360000000000003); + expect(color.blackness).toFuzzyEqual(40.36000000000001); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has an alpha channel', () => { + expect(color.alpha).toBe(1); + }); + + // TODO: Failing in dart-sass because legacy colors are equal even if in a + // different (legacy) color space + skipForImpl('dart-sass', () => { + it('equals the same color even in a different color space', () => { + expect(color).toEqualWithHash(legacyRGB(62, 152, 62)); + expect(color).toEqualWithHash(legacyHsl(120, 42, 42)); + expect(color).toEqualWithHash( + legacyHwb(120, 24.313725490196077, 40.3921568627451) + ); + }); + }); + + it('allows negative hue', () => { + expect(legacyHsl(-240, 42, 42).channel('hue')).toBe(120); + expect(legacyHsl(-240, 42, 42)).toEqualWithHash(color); + }); + }); + + describe('an HWB color', () => { + let color: SassColor; + beforeEach(() => { + color = legacyHwb(120, 42, 42); + }); + + it('has RGB channels', () => { + const stdio = captureStdio(() => { + expect(color.red).toFuzzyEqual(107); + expect(color.green).toFuzzyEqual(148); + expect(color.blue).toFuzzyEqual(107); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has HSL channels', () => { + const stdio = captureStdio(() => { + expect(color.hue).toFuzzyEqual(120); + expect(color.saturation).toFuzzyEqual(16.000000000000007); + expect(color.lightness).toFuzzyEqual(50); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has HWB channels', () => { + const stdio = captureStdio(() => { + expect(color.hue).toFuzzyEqual(120); + expect(color.whiteness).toFuzzyEqual(42); + expect(color.blackness).toFuzzyEqual(42); + }); + expect(stdio.err.match(/use `channel`/g)).toBeArrayOfSize(3); + }); + + it('has an alpha channel', () => { + expect(color.alpha).toBe(1); + }); + + // TODO: Failing in dart-sass because legacy colors are equal even if in a + // different (legacy) color space + skipForImpl('dart-sass', () => { + it('equals the same color even in a different color space', () => { + expect(color).toEqualWithHash(legacyRGB(107, 148, 107)); + expect(color).toEqualWithHash(legacyHsl(120, 16.078431372549026, 50)); + expect(color).toEqualWithHash(legacyHwb(120, 42, 42)); + }); + }); + + it('allows negative hue', () => { + expect(legacyHwb(-240, 42, 42).channel('hue')).toBe(120); + expect(legacyHwb(-240, 42, 42)).toEqualWithHash(color); + }); + }); + + describe('changing color values', () => { + describe('change() for RGB', () => { + let color: SassColor; + beforeEach(() => { + color = legacyRGB(18, 52, 86); + }); + it('changes RGB values', () => { + expect(color.change({red: 0})).toEqualWithHash(legacyRGB(0, 52, 86)); + expect(color.change({green: 0})).toEqualWithHash(legacyRGB(18, 0, 86)); + expect(color.change({blue: 0})).toEqualWithHash(legacyRGB(18, 52, 0)); + expect(color.change({alpha: 0.5})).toEqualWithHash( + legacyRGB(18, 52, 86, 0.5) + ); + expect( + color.change({red: 0, green: 0, blue: 0, alpha: 0.5}) + ).toEqualWithHash(legacyRGB(0, 0, 0, 0.5)); + }); + + it('allows valid values', () => { + expect(color.change({red: 0}).channel('red')).toBe(0); + expect(color.change({red: 255}).channel('red')).toBe(255); + expect(color.change({green: 0}).channel('green')).toBe(0); + expect(color.change({green: 255}).channel('green')).toBe(255); + expect(color.change({blue: 0}).channel('blue')).toBe(0); + expect(color.change({blue: 255}).channel('blue')).toBe(255); + expect(color.change({alpha: 0}).alpha).toBe(0); + expect(color.change({alpha: 1}).alpha).toBe(1); + expect(color.change({red: undefined}).channel('red')).toBe(18); + }); + + it('allows out of range values which were invalid before color 4', () => { + expect(() => color.change({red: -1})).not.toThrow(); + expect(() => color.change({red: 256})).not.toThrow(); + expect(() => color.change({green: -1})).not.toThrow(); + expect(() => color.change({green: 256})).not.toThrow(); + expect(() => color.change({blue: -1})).not.toThrow(); + expect(() => color.change({blue: 256})).not.toThrow(); + }); + it('disallows invalid alpha values', () => { + expect(() => color.change({alpha: -0.1})).toThrow(); + expect(() => color.change({alpha: 1.1})).toThrow(); + }); + + it('does not round channels to the nearest integer', () => { + expect( + color.change({red: 0.1, green: 50.4, blue: 90.3}).channels + ).toFuzzyEqualList([0.1, 50.4, 90.3]); + expect( + color.change({red: -0.1, green: 50.5, blue: 90.9}).channels + ).toFuzzyEqualList([-0.1, 50.5, 90.9]); + }); + it('emits deprecation for null values', () => { + const stdio = captureStdio(() => { + color.change({red: null}); + color.change({green: null}); + color.change({blue: null}); + color.change({alpha: null}); + }); + expect(stdio.err.match(/`alpha: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`red: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`green: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`blue: null`/g)).toBeArrayOfSize(1); + }); + it('emits deprecation for channels from unspecified space', () => { + const stdio = captureStdio(() => { + color.change({hue: 1}); + }); + expect(stdio.err).toMatch('color-4-api'); + }); + }); + + describe('change() for HSL', () => { + let color: SassColor; + beforeEach(() => { + color = legacyHsl(210, 65.3846153846154, 20.392156862745097); + }); + it('changes HSL values', () => { + expect(color.change({hue: 120})).toEqualWithHash( + legacyHsl(120, 65.3846153846154, 20.392156862745097) + ); + expect(color.change({hue: -120})).toEqualWithHash( + legacyHsl(240, 65.3846153846154, 20.392156862745097) + ); + expect(color.change({saturation: 42})).toEqualWithHash( + legacyHsl(210, 42, 20.392156862745097) + ); + expect(color.change({lightness: 42})).toEqualWithHash( + legacyHsl(210, 65.3846153846154, 42) + ); + expect(color.change({alpha: 0.5})).toEqualWithHash( + legacyHsl(210, 65.3846153846154, 20.392156862745097, 0.5) + ); + expect( + color.change({ + hue: 120, + saturation: 42, + lightness: 42, + alpha: 0.5, + }) + ).toEqualWithHash(legacyHsl(120, 42, 42, 0.5)); + expect(color.change({hue: undefined})).toEqualWithHash(color); + // Emits deprecation warning which is tested elsewhere + captureStdio(() => { + expect(color.change({hue: null})).toEqualWithHash(color); + }); + }); + + it('allows valid values', () => { + expect(color.change({saturation: 0}).channel('saturation')).toBe(0); + expect(color.change({saturation: 100}).channel('saturation')).toBe(100); + expect(color.change({lightness: 0}).channel('lightness')).toBe(0); + expect(color.change({lightness: 100}).channel('lightness')).toBe(100); + expect(color.change({alpha: 0}).alpha).toBe(0); + expect(color.change({alpha: 1}).alpha).toBe(1); + expect(color.change({hue: undefined}).channel('hue')).toBe(210); + }); + + it('disallows invalid values', () => { + expect(() => color.change({lightness: -0.1})).toThrow(); + expect(() => color.change({lightness: 100.1})).toThrow(); + expect(() => color.change({alpha: -0.1})).toThrow(); + expect(() => color.change({alpha: 1.1})).toThrow(); + }); + + it('emits deprecation for null values', () => { + const stdio = captureStdio(() => { + color.change({hue: null}); + color.change({saturation: null}); + color.change({lightness: null}); + color.change({alpha: null}); + }); + expect(stdio.err.match(/`alpha: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`hue: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`saturation: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`lightness: null`/g)).toBeArrayOfSize(1); + }); + it('emits deprecation for channels from unspecified space', () => { + const stdio = captureStdio(() => { + color.change({red: 1}); + }); + expect(stdio.err).toMatch('color-4-api'); + }); + }); + + describe('change() for HWB', () => { + let color: SassColor; + beforeEach(() => { + color = legacyHwb(210, 7.0588235294117645, 66.27450980392157); + }); + it('changes HWB values', () => { + expect(color.change({hue: 120})).toEqualWithHash( + legacyHwb(120, 7.0588235294117645, 66.27450980392157) + ); + expect(color.change({hue: -120})).toEqualWithHash( + legacyHwb(240, 7.0588235294117645, 66.27450980392157) + ); + expect(color.change({whiteness: 42})).toEqualWithHash( + legacyHwb(210, 42, 66.27450980392157) + ); + expect(color.change({whiteness: 50})).toEqualWithHash( + legacyHwb(210, 50, 66.27450980392157) + ); + expect(color.change({blackness: 42})).toEqualWithHash( + legacyHwb(210, 7.0588235294117645, 42) + ); + expect(color.change({alpha: 0.5})).toEqualWithHash( + legacyHwb(210, 7.0588235294117645, 66.27450980392157, 0.5) + ); + expect( + color.change({ + hue: 120, + whiteness: 42, + blackness: 42, + alpha: 0.5, + }) + ).toEqualWithHash(legacyHwb(120, 42, 42, 0.5)); + }); + + it('allows valid values', () => { + expect(color.change({whiteness: 0}).channel('whiteness')).toBe(0); + expect(color.change({whiteness: 100}).channel('whiteness')).toBe(100); + expect(color.change({blackness: 0}).channel('blackness')).toBe(0); + expect(color.change({blackness: 100}).channel('blackness')).toBe(100); + expect(color.change({alpha: 0}).alpha).toBe(0); + expect(color.change({alpha: 1}).alpha).toBe(1); + expect(color.change({hue: undefined}).channel('hue')).toBe(210); + }); + + it('disallows invalid values', () => { + expect(() => color.change({alpha: -0.1})).toThrow(); + expect(() => color.change({alpha: 1.1})).toThrow(); + }); + + it('emits deprecation for null values', () => { + const stdio = captureStdio(() => { + color.change({hue: null}); + color.change({whiteness: null}); + color.change({blackness: null}); + color.change({alpha: null}); + }); + expect(stdio.err.match(/`alpha: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`hue: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`whiteness: null`/g)).toBeArrayOfSize(1); + expect(stdio.err.match(/`blackness: null`/g)).toBeArrayOfSize(1); + }); + it('emits deprecation for channels from unspecified space', () => { + const stdio = captureStdio(() => { + color.change({red: 1}); + }); + expect(stdio.err).toMatch('color-4-api'); + }); + }); + + describe('changeAlpha()', () => { + let color: SassColor; + beforeEach(() => { + color = legacyRGB(18, 52, 86); + }); + it('changes the alpha value', () => { + expect(color.change({alpha: 0.5})).toEqualWithHash( + legacyRGB(18, 52, 86, 0.5) + ); + }); + + it('allows valid alphas', () => { + expect(color.change({alpha: 0}).alpha).toBe(0); + expect(color.change({alpha: 1}).alpha).toBe(1); + }); + + it('rejects invalid alphas', () => { + expect(() => color.change({alpha: -0.1})).toThrow(); + expect(() => color.change({alpha: 1.1})).toThrow(); + }); + }); + }); +}); diff --git a/js-api-spec/value/color/spaces.ts b/js-api-spec/value/color/spaces.ts new file mode 100644 index 0000000000..33921eb6a1 --- /dev/null +++ b/js-api-spec/value/color/spaces.ts @@ -0,0 +1,377 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +import * as constructors from './constructors'; +import type {Constructor} from './constructors'; +import type { + ChannelName, + ChannelNameHsl, + ChannelNameHwb, + ChannelNameLab, + ChannelNameLch, + ChannelNameRgb, + ChannelNameXyz, + KnownColorSpace, +} from 'sass'; + +export const spaces: { + [key: string]: { + constructor: Constructor; + name: KnownColorSpace; + isLegacy: boolean; + isPolar: boolean; + // `pink` is an arbitrary color, and is a value that can roundtrip between + // all spaces. + pink: [number, number, number]; + // `blue` is an arbitrary color. + blue: [number, number, number]; + channels: ChannelName[]; + ranges: [number, number][]; + hasPowerless?: boolean; + hasOutOfGamut: boolean; + // input, output in own space, output in p3 + gamutExamples: [[number, number, number], [number, number, number]][]; + }; +} = { + lab: { + constructor: constructors.lab, + name: 'lab', + isLegacy: false, + isPolar: false, + pink: [78.27047872644108, 35.20288139978972, 1.0168442562642044], + blue: [38.95792456574883, -15.169549415088856, -17.792484605053115], + channels: ['lightness', 'a', 'b'] as ChannelNameLab[], + ranges: [ + [0, 100], + [-125, 125], + [-125, 125], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [50, 150, 150], + [50, 150, 150], + ], + ], + }, + oklab: { + constructor: constructors.oklab, + name: 'oklab', + isLegacy: false, + isPolar: false, + pink: [0.8241000000000002, 0.10608808442731632, 0.0015900762693974446], + blue: [0.47120000400818335, -0.05111706453373946, -0.048406651029280656], + channels: ['lightness', 'a', 'b'] as ChannelNameLab[], + ranges: [ + [0, 1], + [-0.4, 0.4], + [-0.4, 0.4], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [0.5, 1, 1], + [0.5, 1, 1], + ], + ], + }, + lch: { + constructor: constructors.lch, + name: 'lch', + isLegacy: false, + isPolar: true, + pink: [78.27047872644108, 35.21756424128674, 1.6545432253797676], + blue: [38.957924566, 23.38135449889311, 229.54969234595737], + channels: ['lightness', 'chroma', 'hue'] as ChannelNameLch[], + hasPowerless: true, + ranges: [ + [0, 100], + [0, 150], + [0, 360], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [50, 200, 480], + [50, 200, 480], + ], + ], + }, + oklch: { + constructor: constructors.oklch, + name: 'oklch', + isLegacy: false, + isPolar: true, + pink: [0.8241, 0.1061, 0.8587], + blue: [0.47120000400818335, 0.07039998686375618, 223.44000118475142], + channels: ['lightness', 'chroma', 'hue'] as ChannelNameLch[], + hasPowerless: true, + ranges: [ + [0, 1], + [0, 0.4], + [0, 360], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [0.5, 1, 480], + [0.5, 1, 480], + ], + ], + }, + srgb: { + constructor: constructors.srgb, + name: 'srgb', + isLegacy: false, + isPolar: false, + pink: [0.9999785463111585, 0.6599448662991679, 0.758373017125016], + blue: [0.14900142239759614, 0.39063941586401707, 0.47119722379126755], + channels: ['red', 'green', 'blue'] as ChannelNameRgb[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: true, + gamutExamples: [ + [ + [0.5, 2, 2], + [1, 1, 1], + ], + ], + }, + srgbLinear: { + constructor: constructors.srgbLinear, + name: 'srgb-linear', + isLegacy: false, + isPolar: false, + pink: [0.999951196094508, 0.3930503811476254, 0.5356603778005655], + blue: [0.019378214827482948, 0.12640222770203852, 0.18834349393523495], + channels: ['red', 'green', 'blue'] as ChannelNameRgb[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: true, + gamutExamples: [ + [ + [0.5, 2, 2], + [1, 1, 1], + ], + ], + }, + displayP3: { + constructor: constructors.displayP3, + name: 'display-p3', + isLegacy: false, + isPolar: false, + pink: [0.9510333333617188, 0.6749909745845027, 0.7568568353546363], + blue: [0.21620126176161275, 0.38537730537965537, 0.46251697991685353], + channels: ['red', 'green', 'blue'] as ChannelNameRgb[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: true, + gamutExamples: [ + [ + [0.5, 2, 2], + [1, 1, 1], + ], + ], + }, + a98Rgb: { + constructor: constructors.a98Rgb, + name: 'a98-rgb', + isLegacy: false, + isPolar: false, + pink: [0.9172837001828321, 0.6540226622083835, 0.7491144397116841], + blue: [0.2557909283504703, 0.3904466064332277, 0.4651826475952292], + channels: ['red', 'green', 'blue'] as ChannelNameRgb[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: true, + gamutExamples: [ + [ + [0.5, 2, 2], + [1, 1, 1], + ], + ], + }, + prophotoRgb: { + constructor: constructors.prophotoRgb, + name: 'prophoto-rgb', + isLegacy: false, + isPolar: false, + pink: [0.842345736209146, 0.6470539622987257, 0.7003583323790157], + blue: [0.24317903319635056, 0.3045087255847488, 0.38356879501347535], + channels: ['red', 'green', 'blue'] as ChannelNameRgb[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: true, + gamutExamples: [ + [ + [0.5, 2, 2], + [1, 1, 1], + ], + ], + }, + rec2020: { + constructor: constructors.rec2020, + name: 'rec2020', + isLegacy: false, + isPolar: false, + pink: [0.8837118321235519, 0.6578067923850563, 0.7273197917658354], + blue: [0.2151122740532409, 0.32363973150195124, 0.4090033869684574], + channels: ['red', 'green', 'blue'] as ChannelNameRgb[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: true, + gamutExamples: [ + [ + [0.5, 2, 2], + [1, 1, 1], + ], + ], + }, + xyz: { + constructor: constructors.xyz, + name: 'xyz', + isLegacy: false, + isPolar: false, + pink: [0.6495957411726918, 0.5323965129525022, 0.575341840710865], + blue: [0.08718323686632441, 0.1081164314257634, 0.19446762910683627], + channels: ['x', 'y', 'z'] as ChannelNameXyz[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [0.5, 2, 2], + [0.5, 2, 2], + ], + ], + }, + xyzD50: { + constructor: constructors.xyzD50, + name: 'xyz-d50', + isLegacy: false, + isPolar: false, + pink: [0.6640698533004002, 0.5367266625281085, 0.4345958246720296], + blue: [0.08408207011375313, 0.10634498228480066, 0.1470370877550857], + channels: ['x', 'y', 'z'] as ChannelNameXyz[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [0.5, 2, 2], + [0.5, 2, 2], + ], + ], + }, + xyzD65: { + constructor: constructors.xyzD65, + name: 'xyz', + isLegacy: false, + isPolar: false, + pink: [0.6495957411726918, 0.5323965129525022, 0.575341840710865], + blue: [0.08718323686632441, 0.1081164314257634, 0.19446762910683627], + channels: ['x', 'y', 'z'] as ChannelNameXyz[], + ranges: [ + [0, 1], + [0, 1], + [0, 1], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [0.5, 2, 2], + [0.5, 2, 2], + ], + ], + }, + rgb: { + constructor: constructors.rgb, + name: 'rgb', + isLegacy: true, + isPolar: false, + pink: [254.9945293093454, 168.28594090628783, 193.38511936687908], + blue: [38.144364133784602, 100.003690461188378, 120.626489290564506], + channels: ['red', 'green', 'blue'] as ChannelNameRgb[], + ranges: [ + [0, 255], + [0, 255], + [0, 255], + ], + hasOutOfGamut: true, + gamutExamples: [ + [ + [300, 300, 300], + [255, 255, 255], + ], + ], + }, + hsl: { + constructor: constructors.hsl, + name: 'hsl', + isLegacy: true, + isPolar: true, + pink: [342.63204677447646, 99.98738302509669, 82.99617063051632], + blue: [195.0016494775154, 51.95041997811069, 31.009932309443183], + channels: ['hue', 'saturation', 'lightness'] as ChannelNameHsl[], + hasPowerless: true, + ranges: [ + [0, 360], + [0, 100], + [0, 100], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [0.5, 100, 50], + [0.5, 100, 50], + ], + ], + }, + hwb: { + constructor: constructors.hwb, + name: 'hwb', + isLegacy: true, + isPolar: true, + pink: [342.63204677447646, 65.99448662991679, 0.002145368884157506], + blue: [195.0016494775154, 14.900142239759612, 52.880277620873244], + channels: ['hue', 'whiteness', 'blackness'] as ChannelNameHwb[], + hasPowerless: true, + ranges: [ + [0, 360], + [0, 100], + [0, 100], + ], + hasOutOfGamut: false, + gamutExamples: [ + [ + [0.5, 100, 50], + [0.5, 100, 50], + ], + ], + }, +}; diff --git a/js-api-spec/value/color/utils.ts b/js-api-spec/value/color/utils.ts new file mode 100644 index 0000000000..ab91f8516c --- /dev/null +++ b/js-api-spec/value/color/utils.ts @@ -0,0 +1,44 @@ +// Copyright 2023 Google Inc. Use of this source code is governed by an +// MIT-style license that can be found in the LICENSE file or at +// https://opensource.org/licenses/MIT. + +import type {ChannelName} from 'sass'; +// Given a series of channels, returns an array of channels with a variety of +// nulls and alpha values. +export function channelCases(ch1: number, ch2: number, ch3: number) { + return [ + [ch1, ch2, ch3], + [null, ch2, ch3], + [null, null, ch3], + [ch1, null, ch3], + [ch1, null, null], + [ch1, ch2, null], + [null, ch2, null], + [null, null, null], + ].flatMap(channels => [ + channels, + [...channels, 1], + [...channels, 0], + [...channels, 0.5], + [...channels, null], + ]) as [ + [number | null, number | null, number | null, number | null | undefined] + ]; +} + +export const channelNames: ChannelName[] = [ + 'red', + 'green', + 'blue', + 'hue', + 'saturation', + 'lightness', + 'whiteness', + 'blackness', + 'a', + 'b', + 'x', + 'y', + 'z', + 'chroma', +]; From fac7453d5a6252ecc112eccd5bf37afba4308081 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Tue, 9 Apr 2024 17:15:34 -0700 Subject: [PATCH 23/45] [Color 4] Update existing specs (#1966) This covers changes from sass/sass#3819 and sass/sass#3823. --- .../value/color/color-4-channels.test.ts | 292 ++++++++++-------- .../value/color/color-4-conversions.test.ts | 85 ++--- .../value/color/color-4-spaces.test.ts | 81 +++-- js-api-spec/value/color/legacy.test.ts | 96 +++--- js-api-spec/value/color/spaces.ts | 12 +- spec/core_functions/color/_utils.scss | 71 +++++ .../core_functions/color/adjust_color/hsl.hrx | 8 +- .../core_functions/color/adjust_color/hwb.hrx | 8 +- .../color/change_color/error/type.hrx | 17 +- .../color/color/_rgb-utils.scss | 27 -- .../color/color/_xyz-utils.scss | 27 -- spec/core_functions/color/color/alpha.hrx | 58 ++-- spec/core_functions/color/color/no_alpha.hrx | 29 +- .../color/color/spaces/a98_rgb.hrx | 70 +++-- .../color/color/spaces/display_p3.hrx | 70 +++-- .../color/color/spaces/prophoto_rgb.hrx | 70 +++-- .../color/color/spaces/rec2020.hrx | 70 +++-- .../color/color/spaces/srgb.hrx | 70 +++-- .../color/color/spaces/srgb_linear.hrx | 70 +++-- .../core_functions/color/color/spaces/xyz.hrx | 75 +++-- .../color/color/spaces/xyz_d50.hrx | 70 +++-- .../color/color/special_functions.hrx | 48 +-- spec/core_functions/color/grayscale.hrx | 2 +- .../color/hsl/four_args/clamped.hrx | 2 +- .../color/hsl/one_arg/alpha.hrx | 2 +- .../color/hsl/one_arg/no_alpha.hrx | 10 +- .../color/hsl/three_args/clamped.hrx | 14 +- .../color/hsl/three_args/out_of_gamut.hrx | 12 + spec/core_functions/color/is_in_gamut.hrx | 12 +- spec/core_functions/color/lab/_utils.scss | 27 -- spec/core_functions/color/lab/alpha.hrx | 36 ++- spec/core_functions/color/lab/no_alpha.hrx | 48 ++- .../color/lab/special_functions/alpha.hrx | 72 ++--- .../color/lab/special_functions/no_alpha.hrx | 42 +-- .../lab/special_functions/slash_list.hrx | 6 +- spec/core_functions/color/lch/_utils.scss | 27 -- spec/core_functions/color/lch/alpha.hrx | 30 +- spec/core_functions/color/lch/no_alpha.hrx | 56 ++-- .../color/lch/special_functions.hrx | 24 +- spec/core_functions/color/mix/error.hrx | 4 +- .../color/mix/hue_interpolation.hrx | 2 +- .../core_functions/color/mix/mixed_spaces.hrx | 2 +- spec/core_functions/color/mix/predefined.hrx | 4 +- spec/core_functions/color/oklab/_utils.scss | 27 -- spec/core_functions/color/oklab/alpha.hrx | 34 +- spec/core_functions/color/oklab/no_alpha.hrx | 50 ++- .../color/oklab/special_functions.hrx | 24 +- spec/core_functions/color/oklch/_utils.scss | 27 -- spec/core_functions/color/oklch/alpha.hrx | 30 +- spec/core_functions/color/oklch/no_alpha.hrx | 56 ++-- .../color/oklch/special_functions.hrx | 24 +- spec/libsass/color-functions/rgb/rgb/b.hrx | 8 +- spec/libsass/color-functions/rgb/rgb/g.hrx | 8 +- spec/libsass/color-functions/rgb/rgb/r.hrx | 8 +- spec/libsass/color-functions/rgb/rgba/b.hrx | 8 +- spec/libsass/color-functions/rgb/rgba/g.hrx | 8 +- spec/libsass/color-functions/rgb/rgba/r.hrx | 8 +- spec/non_conformant/colors/basic.hrx | 2 +- 58 files changed, 1190 insertions(+), 990 deletions(-) create mode 100644 spec/core_functions/color/_utils.scss delete mode 100644 spec/core_functions/color/color/_rgb-utils.scss delete mode 100644 spec/core_functions/color/color/_xyz-utils.scss create mode 100644 spec/core_functions/color/hsl/three_args/out_of_gamut.hrx delete mode 100644 spec/core_functions/color/lab/_utils.scss delete mode 100644 spec/core_functions/color/lch/_utils.scss delete mode 100644 spec/core_functions/color/oklab/_utils.scss delete mode 100644 spec/core_functions/color/oklch/_utils.scss diff --git a/js-api-spec/value/color/color-4-channels.test.ts b/js-api-spec/value/color/color-4-channels.test.ts index ac0e3dc854..9bcdee6b9a 100644 --- a/js-api-spec/value/color/color-4-channels.test.ts +++ b/js-api-spec/value/color/color-4-channels.test.ts @@ -10,7 +10,6 @@ import {List} from 'immutable'; import {spaces} from './spaces'; import {channelCases, channelNames} from './utils'; -import {skipForImpl} from '../../utils'; const spaceNames = Object.keys(spaces) as KnownColorSpace[]; @@ -161,148 +160,171 @@ describe('Color 4 SassColor Channels', () => { }); }); - // TODO(sass#3654) Failing in dart-sass pending: - // https://github.com/sass/sass/issues/3654 - skipForImpl('dart-sass', () => { + if (!['hsl', 'hwb', 'lch', 'oklch'].includes(spaceId)) { describe('isChannelPowerless', () => { - function checkPowerless( - _color: SassColor, - powerless = [false, false, false] - ) { - it(`channels ${_color.channels.toArray()} is ${powerless}`, () => { - expect(_color.isChannelPowerless(space.channels[0])).toBe( - powerless[0] - ); - expect(_color.isChannelPowerless(space.channels[1])).toBe( - powerless[1] - ); - expect(_color.isChannelPowerless(space.channels[2])).toBe( - powerless[2] - ); - }); - } - const [ch1, ch2, ch3] = space.ranges; - if (space.hasPowerless) { - // test powerless channels - switch (space.name) { - case 'hwb': - // If the combined `whiteness` and `blackness` values (after - // normalization) are equal to `100%`, then the `hue` channel is - // powerless. - checkPowerless(space.constructor(ch1[0], 0, 100), [ - true, - false, - false, - ]); - checkPowerless(space.constructor(ch1[0], 100, 0), [ - true, - false, - false, - ]); - checkPowerless(space.constructor(ch1[0], 50, 50), [ - true, - false, - false, - ]); - checkPowerless(space.constructor(ch1[1], 0, 100), [ - true, - false, - false, - ]); - checkPowerless(space.constructor(ch1[1], 100, 0), [ - true, - false, - false, - ]); - checkPowerless(space.constructor(ch1[1], 50, 50), [ - true, - false, - false, - ]); + const [range1, range2, range3] = space.ranges; + checkPowerless(space.constructor(range1[0], range2[0], range3[0])); + checkPowerless(space.constructor(range1[1], range2[0], range3[0])); + checkPowerless(space.constructor(range1[1], range2[1], range3[0])); + checkPowerless(space.constructor(range1[1], range2[1], range3[1])); + checkPowerless(space.constructor(range1[0], range2[1], range3[1])); + checkPowerless(space.constructor(range1[0], range2[0], range3[1])); + checkPowerless(space.constructor(range1[1], range2[0], range3[1])); + checkPowerless(space.constructor(range1[0], range2[1], range3[0])); + }); + } + }); + }); - checkPowerless(space.constructor(ch1[0], ch2[1], ch3[1])); - checkPowerless(space.constructor(ch1[0], ch2[0], ch3[0])); - checkPowerless(space.constructor(ch1[1], ch2[1], ch3[1])); - checkPowerless(space.constructor(ch1[1], ch2[0], ch3[0])); + describe('isChannelPowerless', () => { + describe('for HWB', () => { + // If the combined `whiteness + blackness` is great than or equal to + // `100%`, then the `hue` channel is powerless. + checkPowerless( + new SassColor({hue: 0, whiteness: 0, blackness: 100, space: 'hwb'}), + [true, false, false] + ); + checkPowerless( + new SassColor({hue: 0, whiteness: 100, blackness: 0, space: 'hwb'}), + [true, false, false] + ); + checkPowerless( + new SassColor({hue: 0, whiteness: 50, blackness: 50, space: 'hwb'}), + [true, false, false] + ); + checkPowerless( + new SassColor({hue: 0, whiteness: 60, blackness: 60, space: 'hwb'}), + [true, false, false] + ); + checkPowerless( + new SassColor({hue: 0, whiteness: -100, blackness: 200, space: 'hwb'}), + [true, false, false] + ); + checkPowerless( + new SassColor({hue: 0, whiteness: 200, blackness: -100, space: 'hwb'}), + [true, false, false] + ); + checkPowerless( + new SassColor({hue: 100, whiteness: 0, blackness: 100, space: 'hwb'}), + [true, false, false] + ); - break; + checkPowerless( + new SassColor({hue: 0, whiteness: 0, blackness: 0, space: 'hwb'}) + ); + checkPowerless( + new SassColor({hue: 0, whiteness: 49, blackness: 50, space: 'hwb'}) + ); + checkPowerless( + new SassColor({hue: 0, whiteness: -1, blackness: 100, space: 'hwb'}) + ); + checkPowerless( + new SassColor({hue: 100, whiteness: 0, blackness: 0, space: 'hwb'}) + ); + }); - case 'hsl': - // hsl- If the saturation of an HSL color is 0%, then the hue component is powerless. - checkPowerless(space.constructor(ch1[0], 0, ch3[0]), [ - true, - false, - false, - ]); - checkPowerless(space.constructor(ch1[0], 0, ch3[1]), [ - true, - false, - false, - ]); - checkPowerless(space.constructor(ch1[1], 0, ch3[1]), [ - true, - false, - false, - ]); - checkPowerless(space.constructor(ch1[1], 0, ch3[0]), [ - true, - false, - false, - ]); + describe('for HSL', () => { + // If the saturation of an HSL color is 0%, then the hue component is + // powerless. + checkPowerless( + new SassColor({hue: 0, saturation: 0, lightness: 0, space: 'hsl'}), + [true, false, false] + ); + checkPowerless( + new SassColor({hue: 0, saturation: 0, lightness: 100, space: 'hsl'}), + [true, false, false] + ); + checkPowerless( + new SassColor({hue: 100, saturation: 0, lightness: 0, space: 'hsl'}), + [true, false, false] + ); - checkPowerless(space.constructor(ch1[0], ch2[1], ch3[0])); - checkPowerless(space.constructor(ch1[0], ch2[1], ch3[1])); - checkPowerless(space.constructor(ch1[1], ch2[1], ch3[1])); - checkPowerless(space.constructor(ch1[1], ch2[1], ch3[0])); - break; + checkPowerless( + new SassColor({hue: 0, saturation: 100, lightness: 0, space: 'hsl'}) + ); + checkPowerless( + new SassColor({hue: 0, saturation: 100, lightness: 100, space: 'hsl'}) + ); + checkPowerless( + new SassColor({hue: 100, saturation: 100, lightness: 100, space: 'hsl'}) + ); + checkPowerless( + new SassColor({hue: 100, saturation: 100, lightness: 0, space: 'hsl'}) + ); + }); - case 'lch': - case 'oklch': - // (ok)lch- If the `chroma` value is 0%, then the `hue` channel is powerless. - checkPowerless(space.constructor(ch1[0], 0, ch3[0]), [ - false, - false, - true, - ]); - checkPowerless(space.constructor(ch1[0], 0, ch3[1]), [ - false, - false, - true, - ]); - checkPowerless(space.constructor(ch1[1], 0, ch3[1]), [ - false, - false, - true, - ]); - checkPowerless(space.constructor(ch1[1], 0, ch3[0]), [ - false, - false, - true, - ]); + describe('for LCH', () => { + // If the `chroma` value is 0%, then the `hue` channel is powerless. + checkPowerless( + new SassColor({lightness: 0, chroma: 0, hue: 0, space: 'lch'}), + [false, false, true] + ); + checkPowerless( + new SassColor({lightness: 0, chroma: 0, hue: 100, space: 'lch'}), + [false, false, true] + ); + checkPowerless( + new SassColor({lightness: 100, chroma: 0, hue: 0, space: 'lch'}), + [false, false, true] + ); - checkPowerless(space.constructor(ch1[0], ch2[1], ch3[0])); - checkPowerless(space.constructor(ch1[0], ch2[1], ch3[1])); - checkPowerless(space.constructor(ch1[1], ch2[1], ch3[1])); - checkPowerless(space.constructor(ch1[1], ch2[1], ch3[0])); - break; + checkPowerless( + new SassColor({lightness: 0, chroma: 100, hue: 0, space: 'lch'}) + ); + checkPowerless( + new SassColor({lightness: 0, chroma: 100, hue: 100, space: 'lch'}) + ); + checkPowerless( + new SassColor({lightness: 100, chroma: 100, hue: 100, space: 'lch'}) + ); + checkPowerless( + new SassColor({lightness: 100, chroma: 100, hue: 0, space: 'lch'}) + ); + }); - default: - throw new Error( - `Unimplemented isPowerless check for ${space.name}` - ); - } - } else { - checkPowerless(space.constructor(ch1[0], ch2[0], ch3[0])); - checkPowerless(space.constructor(ch1[1], ch2[0], ch3[0])); - checkPowerless(space.constructor(ch1[1], ch2[1], ch3[0])); - checkPowerless(space.constructor(ch1[1], ch2[1], ch3[1])); - checkPowerless(space.constructor(ch1[0], ch2[1], ch3[1])); - checkPowerless(space.constructor(ch1[0], ch2[0], ch3[1])); - checkPowerless(space.constructor(ch1[1], ch2[0], ch3[1])); - checkPowerless(space.constructor(ch1[0], ch2[1], ch3[0])); - } - }); - }); + describe('for OKLCH', () => { + // If the `chroma` value is 0%, then the `hue` channel is powerless. + checkPowerless( + new SassColor({lightness: 0, chroma: 0, hue: 0, space: 'oklch'}), + [false, false, true] + ); + checkPowerless( + new SassColor({lightness: 0, chroma: 0, hue: 100, space: 'oklch'}), + [false, false, true] + ); + checkPowerless( + new SassColor({lightness: 100, chroma: 0, hue: 0, space: 'oklch'}), + [false, false, true] + ); + + checkPowerless( + new SassColor({lightness: 0, chroma: 100, hue: 0, space: 'oklch'}) + ); + checkPowerless( + new SassColor({lightness: 0, chroma: 100, hue: 100, space: 'oklch'}) + ); + checkPowerless( + new SassColor({lightness: 100, chroma: 100, hue: 100, space: 'oklch'}) + ); + checkPowerless( + new SassColor({lightness: 100, chroma: 100, hue: 0, space: 'oklch'}) + ); }); }); }); + +/** + * Creates a test that checks that the powerless channels in `color` match the + * expectation in `powerless`. + */ +function checkPowerless( + color: SassColor, + powerless = [false, false, false] +): void { + it(`${color}: ${powerless}`, () => { + const space = spaces[color.space]!; + expect(color.isChannelPowerless(space.channels[0])).toBe(powerless[0]); + expect(color.isChannelPowerless(space.channels[1])).toBe(powerless[1]); + expect(color.isChannelPowerless(space.channels[2])).toBe(powerless[2]); + }); +} diff --git a/js-api-spec/value/color/color-4-conversions.test.ts b/js-api-spec/value/color/color-4-conversions.test.ts index 2c6ffa6f58..0cbdfa5250 100644 --- a/js-api-spec/value/color/color-4-conversions.test.ts +++ b/js-api-spec/value/color/color-4-conversions.test.ts @@ -11,7 +11,6 @@ import type { KnownColorSpace, } from 'sass'; -import {skipForImpl} from '../../utils'; import {spaces} from './spaces'; import {interpolations} from './interpolation-examples'; @@ -43,24 +42,16 @@ describe('Color 4 SassColors Conversions', () => { }); }); - // TODO: Waiting on new ColorJS release to fix `hue` interpolation: - // https://github.com/LeaVerou/color.js/pull/338 - skipForImpl('sass-embedded', () => { - // TODO: Failing in dart-sass because `hue` should be normalized to the - // [0, 360) range - skipForImpl('dart-sass', () => { - describe('interpolate', () => { - it('interpolates examples', () => { - const examples = interpolations[space.name]; - examples.forEach(([input, output]) => { - const res = color.interpolate(blue, { - weight: input.weight, - method: input.method as HueInterpolationMethod, - }); - const outputColor = space.constructor(...output); - expect(res).toLooselyEqualColor(outputColor); - }); + describe('interpolate', () => { + it('interpolates examples', () => { + const examples = interpolations[space.name]; + examples.forEach(([input, output]) => { + const res = color.interpolate(blue, { + weight: input.weight, + method: input.method as HueInterpolationMethod, }); + const outputColor = space.constructor(...output); + expect(res).toLooselyEqualColor(outputColor); }); }); }); @@ -118,6 +109,47 @@ describe('Color 4 SassColors Conversions', () => { ).toLooselyEqualColor(space.constructor(...space.pink, null)); }); + describe('allows out-of-range channel values', () => { + const baseColor = space.constructor( + (space.ranges[0][0] + space.ranges[0][1]) / 2, + (space.ranges[1][0] + space.ranges[1][1]) / 2, + (space.ranges[2][0] + space.ranges[2][1]) / 2 + ); + for (let i = 0; i < 3; i++) { + const channel = space.channels[i]; + if (channel === 'hue') continue; + + it(`for ${channel}`, () => { + const aboveRange = space.ranges[i][1] + 10; + const belowRange = space.ranges[i][0] - 10; + const above = baseColor.change({[channel]: aboveRange}); + const below = baseColor.change({[channel]: belowRange}); + + expect(above.channels.get(i)).toEqual(aboveRange); + + switch (channel) { + case 'saturation': + expect(below.channels.get(i)).toEqual(Math.abs(belowRange)); + expect(below.channels.get(0)).toEqual( + (baseColor.channels.get(0) + 180) % 360 + ); + break; + + case 'chroma': + expect(below.channels.get(i)).toEqual(Math.abs(belowRange)); + expect(below.channels.get(2)).toEqual( + (baseColor.channels.get(2) + 180) % 360 + ); + break; + + default: + expect(below.channels.get(i)).toEqual(belowRange); + break; + } + }); + } + }); + spaceNames.forEach(destinationSpaceId => { it(`changes all channels with space set to ${destinationSpaceId}`, () => { const destinationSpace = spaces[destinationSpaceId]; @@ -153,23 +185,6 @@ describe('Color 4 SassColors Conversions', () => { expect(() => color.change({alpha: -1})).toThrow(); expect(() => color.change({alpha: 1.1})).toThrow(); }); - if (space.channels.includes('lightness')) { - describe('out of range lightness', () => { - it('throws on negative lightness', () => { - expect(() => color.change({lightness: -1})).toThrow(); - }); - // TODO: Failing for oklab and oklch in dart-sass - skipForImpl('dart-sass', () => { - it('throws on lightness higher than bounds', () => { - const index = space.channels.findIndex( - channel => channel === 'lightness' - ); - const lightness = space.ranges[index][1] + 1; - expect(() => color.change({lightness})).toThrow(); - }); - }); - }); - } }); describe('isInGamut', () => { diff --git a/js-api-spec/value/color/color-4-spaces.test.ts b/js-api-spec/value/color/color-4-spaces.test.ts index b83e9c2f78..5faad02b6c 100644 --- a/js-api-spec/value/color/color-4-spaces.test.ts +++ b/js-api-spec/value/color/color-4-spaces.test.ts @@ -8,7 +8,6 @@ import {Value, SassColor} from 'sass'; import type {KnownColorSpace} from 'sass'; import {spaces} from './spaces'; -import {skipForImpl} from '../../utils'; const spaceNames = Object.keys(spaces) as KnownColorSpace[]; @@ -42,42 +41,58 @@ describe('Color 4 SassColors Spaces', () => { expect(() => color.assertString()).toThrow(); }); - describe('validation on construction', () => { - it('throws on invalid alpha', () => { - expect(() => { - space.constructor(...space.pink, -1); - }).toThrow(); - expect(() => { - space.constructor(...space.pink, 1.1); - }).toThrow(); - }); - - if (space.channels.includes('lightness')) { - describe('out of range lightness', () => { - it('throws on negative lightness', () => { - const index = space.channels.findIndex( - channel => channel === 'lightness' - ); - const channels = [...space.pink] as [number, number, number]; - channels[index] = -1; - expect(() => space.constructor(...channels)).toThrow(); - }); - - // TODO: Failing for oklab and oklch in dart-sass - skipForImpl('dart-sass', () => { - it('throws on lightness higher than bounds', () => { - const index = space.channels.findIndex( - channel => channel === 'lightness' - ); - const channels = [...space.pink] as [number, number, number]; - channels[index] = space.ranges[index][1] + 1; - expect(() => space.constructor(...channels)).toThrow(); - }); - }); + describe('allows out-of-range channel values', () => { + const average1 = (space.ranges[0][0] + space.ranges[0][1]) / 2; + const average2 = (space.ranges[1][0] + space.ranges[1][1]) / 2; + const average3 = (space.ranges[2][0] + space.ranges[2][1]) / 2; + for (let i = 0; i < 3; i++) { + const channel = space.channels[i]; + if (channel === 'hue') continue; + + it(`for ${channel}`, () => { + const aboveRange = space.ranges[i][1] + 10; + const belowRange = space.ranges[i][0] - 10; + const above = space.constructor( + i === 0 ? aboveRange : average1, + i === 1 ? aboveRange : average2, + i === 2 ? aboveRange : average3 + ); + const below = space.constructor( + i === 0 ? belowRange : average1, + i === 1 ? belowRange : average2, + i === 2 ? belowRange : average3 + ); + + expect(above.channels.get(i)).toEqual(aboveRange); + + switch (channel) { + case 'saturation': + expect(below.channels.get(i)).toEqual(Math.abs(belowRange)); + expect(below.channels.get(0)).toEqual((average1 + 180) % 360); + break; + + case 'chroma': + expect(below.channels.get(i)).toEqual(Math.abs(belowRange)); + expect(below.channels.get(2)).toEqual((average3 + 180) % 360); + break; + + default: + expect(below.channels.get(i)).toEqual(belowRange); + break; + } }); } }); + it('throws on invalid alpha', () => { + expect(() => { + space.constructor(...space.pink, -1); + }).toThrow(); + expect(() => { + space.constructor(...space.pink, 1.1); + }).toThrow(); + }); + it(`returns name for ${space.name}`, () => { expect(color.space).toBe(space.name); }); diff --git a/js-api-spec/value/color/legacy.test.ts b/js-api-spec/value/color/legacy.test.ts index b07e420fca..a644849731 100644 --- a/js-api-spec/value/color/legacy.test.ts +++ b/js-api-spec/value/color/legacy.test.ts @@ -3,7 +3,7 @@ // https://opensource.org/licenses/MIT. import {Value, SassColor} from 'sass'; -import {captureStdio, skipForImpl} from '../../utils'; +import {captureStdio} from '../../utils'; import {legacyRGB, legacyHsl, legacyHwb} from './constructors'; describe('Legacy SassColor', () => { @@ -46,7 +46,7 @@ describe('Legacy SassColor', () => { expect(() => legacyRGB(0, 0, 0, 1.1)).toThrow(); }); - it('allows out of range values which were invalid before color 4', () => { + it('allows out-of-gamut values which were invalid before color 4', () => { expect(() => legacyRGB(-1, 0, 0, 0)).not.toThrow(); expect(() => legacyRGB(0, -1, 0, 0)).not.toThrow(); expect(() => legacyRGB(0, 0, -1, 0)).not.toThrow(); @@ -71,18 +71,21 @@ describe('Legacy SassColor', () => { }); expect(stdio.err).toMatch('null-alpha'); }); + it("doesn't warn for undefined alpha and no space", () => { const stdio = captureStdio(() => { new SassColor({red: 1, green: 1, blue: 1, alpha: undefined}); }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for no alpha and no space", () => { const stdio = captureStdio(() => { new SassColor({red: 1, green: 1, blue: 1}); }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for undefined alpha and undefined space", () => { const stdio = captureStdio(() => { new SassColor({ @@ -95,6 +98,7 @@ describe('Legacy SassColor', () => { }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for null alpha with space", () => { const stdio = captureStdio(() => { new SassColor({ @@ -111,20 +115,17 @@ describe('Legacy SassColor', () => { }); describe('hsl()', () => { - // TODO: Failing in dart-sass because saturation should not be clamped - skipForImpl('dart-sass', () => { - it('allows valid values', () => { - expect(() => legacyHsl(0, 0, 0, 0)).not.toThrow(); - expect(() => legacyHsl(4320, 100, 100, 1)).not.toThrow(); - expect(() => legacyHsl(0, -0.1, 0, 0)).not.toThrow(); - expect(() => legacyHsl(0, 100.1, 0, 0)).not.toThrow(); - }); + it('allows valid values', () => { + expect(() => legacyHsl(0, 0, 0, 0)).not.toThrow(); + expect(() => legacyHsl(4320, 100, 100, 1)).not.toThrow(); + expect(() => legacyHsl(0, -0.1, 0, 0)).not.toThrow(); + expect(() => legacyHsl(0, 100.1, 0, 0)).not.toThrow(); + expect(() => legacyHsl(0, 0, -0.1, 0)).not.toThrow(); + expect(() => legacyHsl(0, 0, 100.1, 0)).not.toThrow(); }); - it('disallows invalid values', () => { - expect(() => legacyHsl(0, 0, -0.1, 0)).toThrow(); + it('disallows invalid alpha values', () => { expect(() => legacyHsl(0, 0, 0, -0.1)).toThrow(); - expect(() => legacyHsl(0, 0, 100.1, 0)).toThrow(); expect(() => legacyHsl(0, 0, 0, 1.1)).toThrow(); }); @@ -135,6 +136,7 @@ describe('Legacy SassColor', () => { }); expect(stdio.err).toMatch('null-alpha'); }); + it("doesn't warn for undefined alpha and no space", () => { const stdio = captureStdio(() => { new SassColor({ @@ -146,12 +148,14 @@ describe('Legacy SassColor', () => { }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for no alpha and no space", () => { const stdio = captureStdio(() => { new SassColor({hue: 1, saturation: 1, lightness: 1}); }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for undefined alpha and undefined space", () => { const stdio = captureStdio(() => { new SassColor({ @@ -164,6 +168,7 @@ describe('Legacy SassColor', () => { }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for null alpha with space", () => { const stdio = captureStdio(() => { new SassColor({ @@ -180,20 +185,16 @@ describe('Legacy SassColor', () => { }); describe('hwb()', () => { - // TODO: Failing in dart-sass because whiteness and blackness should not - // be clamped - skipForImpl('dart-sass', () => { - it('allows valid values', () => { - expect(() => legacyHwb(0, 0, 0, 0)).not.toThrow(); - expect(() => legacyHwb(4320, 100, 100, 1)).not.toThrow(); - expect(() => legacyHwb(0, -0.1, 0, 0)).not.toThrow(); - expect(() => legacyHwb(0, 0, -0.1, 0)).not.toThrow(); - expect(() => legacyHwb(0, 100.1, 0, 0)).not.toThrow(); - expect(() => legacyHwb(0, 0, 100.1, 0)).not.toThrow(); - }); + it('allows valid values', () => { + expect(() => legacyHwb(0, 0, 0, 0)).not.toThrow(); + expect(() => legacyHwb(4320, 100, 100, 1)).not.toThrow(); + expect(() => legacyHwb(0, -0.1, 0, 0)).not.toThrow(); + expect(() => legacyHwb(0, 0, -0.1, 0)).not.toThrow(); + expect(() => legacyHwb(0, 100.1, 0, 0)).not.toThrow(); + expect(() => legacyHwb(0, 0, 100.1, 0)).not.toThrow(); }); - it('disallows invalid values', () => { + it('disallows invalid alpha values', () => { expect(() => legacyHwb(0, 0, 0, -0.1)).toThrow(); expect(() => legacyHwb(0, 0, 0, 1.1)).toThrow(); }); @@ -205,6 +206,7 @@ describe('Legacy SassColor', () => { }); expect(stdio.err).toMatch('null-alpha'); }); + it("doesn't warn for undefined alpha and no space", () => { const stdio = captureStdio(() => { new SassColor({ @@ -216,12 +218,14 @@ describe('Legacy SassColor', () => { }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for no alpha and no space", () => { const stdio = captureStdio(() => { new SassColor({hue: 1, whiteness: 1, blackness: 1}); }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for undefined alpha and undefined space", () => { const stdio = captureStdio(() => { new SassColor({ @@ -234,6 +238,7 @@ describe('Legacy SassColor', () => { }); expect(stdio.err).toBeEmptyString(); }); + it("doesn't warn for null alpha with space", () => { const stdio = captureStdio(() => { new SassColor({ @@ -335,16 +340,10 @@ describe('Legacy SassColor', () => { expect(color.alpha).toBe(1); }); - // TODO: Failing in dart-sass because legacy colors are equal even if in a - // different (legacy) color space - skipForImpl('dart-sass', () => { - it('equals the same color even in a different color space', () => { - expect(color).toEqualWithHash(legacyRGB(62, 152, 62)); - expect(color).toEqualWithHash(legacyHsl(120, 42, 42)); - expect(color).toEqualWithHash( - legacyHwb(120, 24.313725490196077, 40.3921568627451) - ); - }); + it('equals the same color even in a different color space', () => { + expect(color).toEqualWithHash(legacyRGB(62.118, 152.082, 62.118)); + expect(color).toEqualWithHash(legacyHsl(120, 42, 42)); + expect(color).toEqualWithHash(legacyHwb(120, 24.36, 40.36)); }); it('allows negative hue', () => { @@ -390,14 +389,10 @@ describe('Legacy SassColor', () => { expect(color.alpha).toBe(1); }); - // TODO: Failing in dart-sass because legacy colors are equal even if in a - // different (legacy) color space - skipForImpl('dart-sass', () => { - it('equals the same color even in a different color space', () => { - expect(color).toEqualWithHash(legacyRGB(107, 148, 107)); - expect(color).toEqualWithHash(legacyHsl(120, 16.078431372549026, 50)); - expect(color).toEqualWithHash(legacyHwb(120, 42, 42)); - }); + it('equals the same color even in a different color space', () => { + expect(color).toEqualWithHash(legacyRGB(107.1, 147.9, 107.1)); + expect(color).toEqualWithHash(legacyHsl(120, 16, 50)); + expect(color).toEqualWithHash(legacyHwb(120, 42, 42)); }); it('allows negative hue', () => { @@ -412,6 +407,7 @@ describe('Legacy SassColor', () => { beforeEach(() => { color = legacyRGB(18, 52, 86); }); + it('changes RGB values', () => { expect(color.change({red: 0})).toEqualWithHash(legacyRGB(0, 52, 86)); expect(color.change({green: 0})).toEqualWithHash(legacyRGB(18, 0, 86)); @@ -444,6 +440,7 @@ describe('Legacy SassColor', () => { expect(() => color.change({blue: -1})).not.toThrow(); expect(() => color.change({blue: 256})).not.toThrow(); }); + it('disallows invalid alpha values', () => { expect(() => color.change({alpha: -0.1})).toThrow(); expect(() => color.change({alpha: 1.1})).toThrow(); @@ -457,6 +454,7 @@ describe('Legacy SassColor', () => { color.change({red: -0.1, green: 50.5, blue: 90.9}).channels ).toFuzzyEqualList([-0.1, 50.5, 90.9]); }); + it('emits deprecation for null values', () => { const stdio = captureStdio(() => { color.change({red: null}); @@ -469,6 +467,7 @@ describe('Legacy SassColor', () => { expect(stdio.err.match(/`green: null`/g)).toBeArrayOfSize(1); expect(stdio.err.match(/`blue: null`/g)).toBeArrayOfSize(1); }); + it('emits deprecation for channels from unspecified space', () => { const stdio = captureStdio(() => { color.change({hue: 1}); @@ -482,6 +481,7 @@ describe('Legacy SassColor', () => { beforeEach(() => { color = legacyHsl(210, 65.3846153846154, 20.392156862745097); }); + it('changes HSL values', () => { expect(color.change({hue: 120})).toEqualWithHash( legacyHsl(120, 65.3846153846154, 20.392156862745097) @@ -520,12 +520,12 @@ describe('Legacy SassColor', () => { expect(color.change({lightness: 100}).channel('lightness')).toBe(100); expect(color.change({alpha: 0}).alpha).toBe(0); expect(color.change({alpha: 1}).alpha).toBe(1); + expect(color.change({lightness: -0.1}).lightness).toBe(-0.1); + expect(color.change({lightness: 100.1}).lightness).toBe(100.1); expect(color.change({hue: undefined}).channel('hue')).toBe(210); }); - it('disallows invalid values', () => { - expect(() => color.change({lightness: -0.1})).toThrow(); - expect(() => color.change({lightness: 100.1})).toThrow(); + it('disallows invalid alpha values', () => { expect(() => color.change({alpha: -0.1})).toThrow(); expect(() => color.change({alpha: 1.1})).toThrow(); }); @@ -542,6 +542,7 @@ describe('Legacy SassColor', () => { expect(stdio.err.match(/`saturation: null`/g)).toBeArrayOfSize(1); expect(stdio.err.match(/`lightness: null`/g)).toBeArrayOfSize(1); }); + it('emits deprecation for channels from unspecified space', () => { const stdio = captureStdio(() => { color.change({red: 1}); @@ -555,6 +556,7 @@ describe('Legacy SassColor', () => { beforeEach(() => { color = legacyHwb(210, 7.0588235294117645, 66.27450980392157); }); + it('changes HWB values', () => { expect(color.change({hue: 120})).toEqualWithHash( legacyHwb(120, 7.0588235294117645, 66.27450980392157) @@ -611,6 +613,7 @@ describe('Legacy SassColor', () => { expect(stdio.err.match(/`whiteness: null`/g)).toBeArrayOfSize(1); expect(stdio.err.match(/`blackness: null`/g)).toBeArrayOfSize(1); }); + it('emits deprecation for channels from unspecified space', () => { const stdio = captureStdio(() => { color.change({red: 1}); @@ -624,6 +627,7 @@ describe('Legacy SassColor', () => { beforeEach(() => { color = legacyRGB(18, 52, 86); }); + it('changes the alpha value', () => { expect(color.change({alpha: 0.5})).toEqualWithHash( legacyRGB(18, 52, 86, 0.5) diff --git a/js-api-spec/value/color/spaces.ts b/js-api-spec/value/color/spaces.ts index 33921eb6a1..93d26ed704 100644 --- a/js-api-spec/value/color/spaces.ts +++ b/js-api-spec/value/color/spaces.ts @@ -141,7 +141,7 @@ export const spaces: { ], ], }, - srgbLinear: { + 'srgb-linear': { constructor: constructors.srgbLinear, name: 'srgb-linear', isLegacy: false, @@ -162,7 +162,7 @@ export const spaces: { ], ], }, - displayP3: { + 'display-p3': { constructor: constructors.displayP3, name: 'display-p3', isLegacy: false, @@ -183,7 +183,7 @@ export const spaces: { ], ], }, - a98Rgb: { + 'a98-rgb': { constructor: constructors.a98Rgb, name: 'a98-rgb', isLegacy: false, @@ -204,7 +204,7 @@ export const spaces: { ], ], }, - prophotoRgb: { + 'prophoto-rgb': { constructor: constructors.prophotoRgb, name: 'prophoto-rgb', isLegacy: false, @@ -267,7 +267,7 @@ export const spaces: { ], ], }, - xyzD50: { + 'xyz-d50': { constructor: constructors.xyzD50, name: 'xyz-d50', isLegacy: false, @@ -288,7 +288,7 @@ export const spaces: { ], ], }, - xyzD65: { + 'xyz-d65': { constructor: constructors.xyzD65, name: 'xyz', isLegacy: false, diff --git a/spec/core_functions/color/_utils.scss b/spec/core_functions/color/_utils.scss new file mode 100644 index 0000000000..375c314cf7 --- /dev/null +++ b/spec/core_functions/color/_utils.scss @@ -0,0 +1,71 @@ +@use 'sass:color'; +@use 'sass:list'; +@use 'sass:meta'; + +@function -real-channel($color, $channel) { + @if color.is-missing($color, $channel) { + @return none; + } @else { + @return color.channel($color, $channel); + } +} + +@mixin inspect($color) { + a { + value: $color; + @if meta.type-of($color) == string { + type: string; + } @else { + $space: color.space($color); + space: $space; + + @if $space == 'rgb' or $space == 'srgb' or $space == 'srgb-linear' or + $space == 'display-p3' or $space == 'a98-rgb' or + $space == 'prophoto-rgb' or $space == 'rec2020' { + channels: list.slash( + -real-channel($color, 'red') + -real-channel($color, 'green') + -real-channel($color, 'blue'), + -real-channel($color, 'alpha') + ); + } @else if $space == 'hwb' { + channels: list.slash( + -real-channel($color, 'hue') + -real-channel($color, 'whiteness') + -real-channel($color, 'blackness'), + -real-channel($color, 'alpha') + ); + } @else if $space == 'hsl' { + channels: list.slash( + -real-channel($color, 'hue') + -real-channel($color, 'saturation') + -real-channel($color, 'lightness'), + -real-channel($color, 'alpha') + ); + } @else if $space == 'xyz' or $space == 'xyz-d50' { + channels: list.slash( + -real-channel($color, 'x') + -real-channel($color, 'y') + -real-channel($color, 'z'), + -real-channel($color, 'alpha') + ); + } @else if $space == 'lab' or $space == 'oklab' { + channels: list.slash( + -real-channel($color, 'lightness') + -real-channel($color, 'a') + -real-channel($color, 'b'), + -real-channel($color, 'alpha') + ); + } @else if $space == 'lch' or $space == 'oklch' { + channels: list.slash( + -real-channel($color, 'lightness') + -real-channel($color, 'chroma') + -real-channel($color, 'hue'), + -real-channel($color, 'alpha') + ); + } @else { + @error "Unknown color space #{$space}"; + } + } + } +} diff --git a/spec/core_functions/color/adjust_color/hsl.hrx b/spec/core_functions/color/adjust_color/hsl.hrx index 4bf9e26b12..d860a08104 100644 --- a/spec/core_functions/color/adjust_color/hsl.hrx +++ b/spec/core_functions/color/adjust_color/hsl.hrx @@ -63,7 +63,7 @@ a {b: adjust-color(plum, $saturation: 100%)} <===> saturation/max/output.css a { - b: #ff7eff; + b: hsl(300, 147.2868217054%, 74.7058823529%); } <===> @@ -73,7 +73,7 @@ a {b: adjust-color(plum, $saturation: 53%)} <===> saturation/max_remaining/output.css a { - b: #ff7eff; + b: hsl(300, 100.2868217054%, 74.7058823529%); } <===> @@ -133,7 +133,7 @@ a {b: adjust-color(red, $lightness: 100%)} <===> lightness/max/output.css a { - b: white; + b: hsl(0, 100%, 150%); } <===> @@ -173,7 +173,7 @@ a {b: adjust-color(red, $lightness: -100%)} <===> lightness/min/output.css a { - b: black; + b: hsl(0, 100%, -50%); } <===> diff --git a/spec/core_functions/color/adjust_color/hwb.hrx b/spec/core_functions/color/adjust_color/hwb.hrx index 625259ca93..4414f67412 100644 --- a/spec/core_functions/color/adjust_color/hwb.hrx +++ b/spec/core_functions/color/adjust_color/hwb.hrx @@ -3,7 +3,7 @@ a {b: adjust-color(#cc6666, $whiteness: 100%)} <===> whiteness/max/output.css a { - b: rgb(212.5, 212.5, 212.5); + b: rgb(223.125, 223.125, 223.125); } <===> @@ -33,7 +33,7 @@ a {b: adjust-color(#cc6666, $whiteness: -100%)} <===> whiteness/min/output.css a { - b: #cc0000; + b: hsl(0, 700%, 10%); } <===> @@ -73,7 +73,7 @@ a {b: adjust-color(#993333, $blackness: 100%)} <===> blackness/max/output.css a { - b: rgb(42.5, 42.5, 42.5); + b: rgb(31.875, 31.875, 31.875); } <===> @@ -103,7 +103,7 @@ a {b: adjust-color(#993333, $blackness: -100%)} <===> blackness/min/output.css a { - b: #ff3333; + b: hsl(0, 700%, 90%); } <===> diff --git a/spec/core_functions/color/change_color/error/type.hrx b/spec/core_functions/color/change_color/error/type.hrx index 96b045e32d..11b12fe7ad 100644 --- a/spec/core_functions/color/change_color/error/type.hrx +++ b/spec/core_functions/color/change_color/error/type.hrx @@ -15,7 +15,7 @@ Error: $color: 1 is not a color. a {b: change-color(red, $red: c)} <===> red/error -Error: $red: c is not a number. +Error: $red: c is not a number or unquoted "none". , 1 | a {b: change-color(red, $red: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -28,7 +28,7 @@ Error: $red: c is not a number. a {b: change-color(red, $green: c)} <===> green/error -Error: $green: c is not a number. +Error: $green: c is not a number or unquoted "none". , 1 | a {b: change-color(red, $green: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -41,7 +41,7 @@ Error: $green: c is not a number. a {b: change-color(red, $blue: c)} <===> blue/error -Error: $blue: c is not a number. +Error: $blue: c is not a number or unquoted "none". , 1 | a {b: change-color(red, $blue: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -54,7 +54,7 @@ Error: $blue: c is not a number. a {b: change-color(red, $hue: c)} <===> hue/error -Error: $hue: c is not a number. +Error: $hue: c is not a number or unquoted "none". , 1 | a {b: change-color(red, $hue: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -67,7 +67,7 @@ Error: $hue: c is not a number. a {b: change-color(red, $saturation: c)} <===> saturation/error -Error: $saturation: c is not a number. +Error: $saturation: c is not a number or unquoted "none". , 1 | a {b: change-color(red, $saturation: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -80,7 +80,7 @@ Error: $saturation: c is not a number. a {b: change-color(red, $lightness: c)} <===> lightness/error -Error: $lightness: c is not a number. +Error: $lightness: c is not a number or unquoted "none". , 1 | a {b: change-color(red, $lightness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -106,7 +106,7 @@ Error: $alpha: c is not a number. a {b: change-color(red, $blackness: c)} <===> blackness/error -Error: $blackness: c is not a number. +Error: $blackness: c is not a number or unquoted "none". , 1 | a {b: change-color(red, $blackness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -119,10 +119,9 @@ Error: $blackness: c is not a number. a {b: change-color(red, $whiteness: c)} <===> whiteness/error -Error: $whiteness: c is not a number. +Error: $whiteness: c is not a number or unquoted "none". , 1 | a {b: change-color(red, $whiteness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet - diff --git a/spec/core_functions/color/color/_rgb-utils.scss b/spec/core_functions/color/color/_rgb-utils.scss deleted file mode 100644 index 266f547729..0000000000 --- a/spec/core_functions/color/color/_rgb-utils.scss +++ /dev/null @@ -1,27 +0,0 @@ -@use 'sass:color'; -@use 'sass:list'; -@use 'sass:meta'; - -@function -real-channel($color, $channel) { - @if color.is-missing($color, $channel) { - @return none; - } @else { - @return color.channel($color, $channel); - } -} - -@mixin inspect($color) { - a { - value: $color; - @if meta.type-of($color) == string { - type: string; - } @else { - channels: list.slash( - -real-channel($color, 'red') - -real-channel($color, 'green') - -real-channel($color, 'blue'), - -real-channel($color, 'alpha') - ); - } - } -} diff --git a/spec/core_functions/color/color/_xyz-utils.scss b/spec/core_functions/color/color/_xyz-utils.scss deleted file mode 100644 index 8290223bd8..0000000000 --- a/spec/core_functions/color/color/_xyz-utils.scss +++ /dev/null @@ -1,27 +0,0 @@ -@use 'sass:color'; -@use 'sass:list'; -@use 'sass:meta'; - -@function -real-channel($color, $channel) { - @if color.is-missing($color, $channel) { - @return none; - } @else { - @return color.channel($color, $channel); - } -} - -@mixin inspect($color) { - a { - value: $color; - @if meta.type-of($color) == string { - type: string; - } @else { - channels: list.slash( - -real-channel($color, 'x') - -real-channel($color, 'y') - -real-channel($color, 'z'), - -real-channel($color, 'alpha') - ); - } - } -} diff --git a/spec/core_functions/color/color/alpha.hrx b/spec/core_functions/color/color/alpha.hrx index 3e672f8257..b662311034 100644 --- a/spec/core_functions/color/color/alpha.hrx +++ b/spec/core_functions/color/color/alpha.hrx @@ -1,58 +1,63 @@ <===> transparent/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / 0)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 0.3 / 0)); <===> transparent/output.css a { value: color(srgb 0.1 0.2 0.3 / 0); + space: srgb; channels: 0.1 0.2 0.3 / 0; } <===> ================================================================================ <===> opaque/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / 1)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 0.3 / 1)); <===> opaque/output.css a { value: color(srgb 0.1 0.2 0.3); + space: srgb; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> partial/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / 0.4)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 0.3 / 0.4)); <===> partial/output.css a { value: color(srgb 0.1 0.2 0.3 / 0.4); + space: srgb; channels: 0.1 0.2 0.3 / 0.4; } <===> ================================================================================ <===> percent/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / 40%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 0.3 / 40%)); <===> percent/output.css a { value: color(srgb 0.1 0.2 0.3 / 0.4); + space: srgb; channels: 0.1 0.2 0.3 / 0.4; } <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color($description: srgb 0.1 0.2 0.3 / 0.4)); +@use 'core_functions/color/utils'; +@include utils.inspect(color($description: srgb 0.1 0.2 0.3 / 0.4)); <===> named/output.css a { value: color(srgb 0.1 0.2 0.3 / 0.4); + space: srgb; channels: 0.1 0.2 0.3 / 0.4; } @@ -60,36 +65,39 @@ a { ================================================================================ <===> slash_list/input.scss @use "sass:list"; -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(list.slash(srgb 0.1 0.2 0.3, 0.4))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(list.slash(srgb 0.1 0.2 0.3, 0.4))); <===> slash_list/output.css a { value: color(srgb 0.1 0.2 0.3 / 0.4); + space: srgb; channels: 0.1 0.2 0.3 / 0.4; } <===> ================================================================================ <===> none/slash/blue/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 none / 0.4)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 none / 0.4)); <===> none/slash/blue/output.css a { value: color(srgb 0.1 0.2 none / 0.4); + space: srgb; channels: 0.1 0.2 none / 0.4; } <===> ================================================================================ <===> none/slash/alpha/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / none)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 0.3 / none)); <===> none/slash/alpha/output.css a { value: color(srgb 0.1 0.2 0.3 / none); + space: srgb; channels: 0.1 0.2 0.3 / none; } @@ -97,12 +105,13 @@ a { ================================================================================ <===> none/slash_list/blue/input.scss @use 'sass:list'; -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(list.slash(srgb 0.1 0.2 none, 0.4))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(list.slash(srgb 0.1 0.2 none, 0.4))); <===> none/slash_list/blue/output.css a { value: color(srgb 0.1 0.2 none / 0.4); + space: srgb; channels: 0.1 0.2 none / 0.4; } @@ -110,20 +119,21 @@ a { ================================================================================ <===> none/slash_list/alpha/input.scss @use 'sass:list'; -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(list.slash(srgb 0.1 0.2 0.3, none))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(list.slash(srgb 0.1 0.2 0.3, none))); <===> none/slash_list/alpha/output.css a { value: color(srgb 0.1 0.2 0.3 / none); + space: srgb; channels: 0.1 0.2 0.3 / none; } <===> ================================================================================ <===> relative_color/slash/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(from #aaa srgb r g b / 25%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(from #aaa srgb r g b / 25%)); <===> relative_color/slash/output.css a { @@ -135,8 +145,8 @@ a { ================================================================================ <===> relative_color/slash_list/input.scss @use 'sass:list'; -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(list.slash(from #aaa srgb r g b, 25%))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(list.slash(from #aaa srgb r g b, 25%))); <===> relative_color/slash_list/output.css a { diff --git a/spec/core_functions/color/color/no_alpha.hrx b/spec/core_functions/color/color/no_alpha.hrx index 2180771263..f5318ef2dd 100644 --- a/spec/core_functions/color/color/no_alpha.hrx +++ b/spec/core_functions/color/color/no_alpha.hrx @@ -1,54 +1,58 @@ <===> none/red/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb none 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb none 0.2 0.3)); <===> none/red/output.css a { value: color(srgb none 0.2 0.3); + space: srgb; channels: none 0.2 0.3 / 1; } <===> ================================================================================ <===> none/green/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 none 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 none 0.3)); <===> none/green/output.css a { value: color(srgb 0.1 none 0.3); + space: srgb; channels: 0.1 none 0.3 / 1; } <===> ================================================================================ <===> none/blue/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 none 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 none 0.3)); <===> none/blue/output.css a { value: color(srgb 0.1 none 0.3); + space: srgb; channels: 0.1 none 0.3 / 1; } <===> ================================================================================ <===> case/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(sRGB 0.1 none 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(sRGB 0.1 none 0.3)); <===> case/output.css a { value: color(srgb 0.1 none 0.3); + space: srgb; channels: 0.1 none 0.3 / 1; } <===> ================================================================================ <===> relative_color/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(from #aaa srgb r g b)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(from #aaa srgb r g b)); <===> relative_color/output.css a { @@ -59,11 +63,12 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color($description: srgb 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color($description: srgb 0.1 0.2 0.3)); <===> named/output.css a { value: color(srgb 0.1 0.2 0.3); + space: srgb; channels: 0.1 0.2 0.3 / 1; } diff --git a/spec/core_functions/color/color/spaces/a98_rgb.hrx b/spec/core_functions/color/color/spaces/a98_rgb.hrx index 2c073216f6..877efcd52f 100644 --- a/spec/core_functions/color/color/spaces/a98_rgb.hrx +++ b/spec/core_functions/color/color/spaces/a98_rgb.hrx @@ -1,165 +1,179 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 0.2 0.3)); <===> unitless/in_range/output.css a { value: color(a98-rgb 0.1 0.2 0.3); + space: a98-rgb; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 1.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 1.1 0.2 0.3)); <===> unitless/red/above_range/output.css a { value: color(a98-rgb 1.1 0.2 0.3); + space: a98-rgb; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb -0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb -0.1 0.2 0.3)); <===> unitless/red/below_range/output.css a { value: color(a98-rgb -0.1 0.2 0.3); + space: a98-rgb; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 1.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 1.2 0.3)); <===> unitless/green/above_range/output.css a { value: color(a98-rgb 0.1 1.2 0.3); + space: a98-rgb; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 -0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 -0.2 0.3)); <===> unitless/green/below_range/output.css a { value: color(a98-rgb 0.1 -0.2 0.3); + space: a98-rgb; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 1.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 0.2 1.3)); <===> unitless/blue/above_range/output.css a { value: color(a98-rgb 0.1 0.2 1.3); + space: a98-rgb; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> unitless/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 -0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 0.2 -0.3)); <===> unitless/blue/below_range/output.css a { value: color(a98-rgb 0.1 0.2 -0.3); + space: a98-rgb; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 10% 20% 30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 10% 20% 30%)); <===> percent/in_range/output.css a { value: color(a98-rgb 0.1 0.2 0.3); + space: a98-rgb; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 110% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 110% 0.2 0.3)); <===> percent/red/above_range/output.css a { value: color(a98-rgb 1.1 0.2 0.3); + space: a98-rgb; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb -10% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb -10% 0.2 0.3)); <===> percent/red/below_range/output.css a { value: color(a98-rgb -0.1 0.2 0.3); + space: a98-rgb; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 120% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 120% 0.3)); <===> percent/green/above_range/output.css a { value: color(a98-rgb 0.1 1.2 0.3); + space: a98-rgb; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 -20% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 -20% 0.3)); <===> percent/green/below_range/output.css a { value: color(a98-rgb 0.1 -0.2 0.3); + space: a98-rgb; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> percent/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 130%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 0.2 130%)); <===> percent/blue/above_range/output.css a { value: color(a98-rgb 0.1 0.2 1.3); + space: a98-rgb; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> percent/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(a98-rgb 0.1 0.2 -30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(a98-rgb 0.1 0.2 -30%)); <===> percent/blue/below_range/output.css a { value: color(a98-rgb 0.1 0.2 -0.3); + space: a98-rgb; channels: 0.1 0.2 -0.3 / 1; } diff --git a/spec/core_functions/color/color/spaces/display_p3.hrx b/spec/core_functions/color/color/spaces/display_p3.hrx index a7ae005057..91c495833b 100644 --- a/spec/core_functions/color/color/spaces/display_p3.hrx +++ b/spec/core_functions/color/color/spaces/display_p3.hrx @@ -1,165 +1,179 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 0.2 0.3)); <===> unitless/in_range/output.css a { value: color(display-p3 0.1 0.2 0.3); + space: display-p3; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 1.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 1.1 0.2 0.3)); <===> unitless/red/above_range/output.css a { value: color(display-p3 1.1 0.2 0.3); + space: display-p3; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 -0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 -0.1 0.2 0.3)); <===> unitless/red/below_range/output.css a { value: color(display-p3 -0.1 0.2 0.3); + space: display-p3; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 1.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 1.2 0.3)); <===> unitless/green/above_range/output.css a { value: color(display-p3 0.1 1.2 0.3); + space: display-p3; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 -0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 -0.2 0.3)); <===> unitless/green/below_range/output.css a { value: color(display-p3 0.1 -0.2 0.3); + space: display-p3; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 0.2 1.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 0.2 1.3)); <===> unitless/blue/above_range/output.css a { value: color(display-p3 0.1 0.2 1.3); + space: display-p3; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> unitless/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 0.2 -0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 0.2 -0.3)); <===> unitless/blue/below_range/output.css a { value: color(display-p3 0.1 0.2 -0.3); + space: display-p3; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 10% 20% 30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 10% 20% 30%)); <===> percent/in_range/output.css a { value: color(display-p3 0.1 0.2 0.3); + space: display-p3; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 110% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 110% 0.2 0.3)); <===> percent/red/above_range/output.css a { value: color(display-p3 1.1 0.2 0.3); + space: display-p3; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 -10% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 -10% 0.2 0.3)); <===> percent/red/below_range/output.css a { value: color(display-p3 -0.1 0.2 0.3); + space: display-p3; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 120% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 120% 0.3)); <===> percent/green/above_range/output.css a { value: color(display-p3 0.1 1.2 0.3); + space: display-p3; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 -20% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 -20% 0.3)); <===> percent/green/below_range/output.css a { value: color(display-p3 0.1 -0.2 0.3); + space: display-p3; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> percent/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 0.2 130%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 0.2 130%)); <===> percent/blue/above_range/output.css a { value: color(display-p3 0.1 0.2 1.3); + space: display-p3; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> percent/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(display-p3 0.1 0.2 -30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(display-p3 0.1 0.2 -30%)); <===> percent/blue/below_range/output.css a { value: color(display-p3 0.1 0.2 -0.3); + space: display-p3; channels: 0.1 0.2 -0.3 / 1; } diff --git a/spec/core_functions/color/color/spaces/prophoto_rgb.hrx b/spec/core_functions/color/color/spaces/prophoto_rgb.hrx index 080f28eb0c..67750f549b 100644 --- a/spec/core_functions/color/color/spaces/prophoto_rgb.hrx +++ b/spec/core_functions/color/color/spaces/prophoto_rgb.hrx @@ -1,165 +1,179 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 0.2 0.3)); <===> unitless/in_range/output.css a { value: color(prophoto-rgb 0.1 0.2 0.3); + space: prophoto-rgb; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 1.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 1.1 0.2 0.3)); <===> unitless/red/above_range/output.css a { value: color(prophoto-rgb 1.1 0.2 0.3); + space: prophoto-rgb; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb -0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb -0.1 0.2 0.3)); <===> unitless/red/below_range/output.css a { value: color(prophoto-rgb -0.1 0.2 0.3); + space: prophoto-rgb; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 1.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 1.2 0.3)); <===> unitless/green/above_range/output.css a { value: color(prophoto-rgb 0.1 1.2 0.3); + space: prophoto-rgb; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 -0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 -0.2 0.3)); <===> unitless/green/below_range/output.css a { value: color(prophoto-rgb 0.1 -0.2 0.3); + space: prophoto-rgb; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 1.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 0.2 1.3)); <===> unitless/blue/above_range/output.css a { value: color(prophoto-rgb 0.1 0.2 1.3); + space: prophoto-rgb; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> unitless/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 -0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 0.2 -0.3)); <===> unitless/blue/below_range/output.css a { value: color(prophoto-rgb 0.1 0.2 -0.3); + space: prophoto-rgb; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 10% 20% 30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 10% 20% 30%)); <===> percent/in_range/output.css a { value: color(prophoto-rgb 0.1 0.2 0.3); + space: prophoto-rgb; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 110% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 110% 0.2 0.3)); <===> percent/red/above_range/output.css a { value: color(prophoto-rgb 1.1 0.2 0.3); + space: prophoto-rgb; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb -10% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb -10% 0.2 0.3)); <===> percent/red/below_range/output.css a { value: color(prophoto-rgb -0.1 0.2 0.3); + space: prophoto-rgb; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 120% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 120% 0.3)); <===> percent/green/above_range/output.css a { value: color(prophoto-rgb 0.1 1.2 0.3); + space: prophoto-rgb; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 -20% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 -20% 0.3)); <===> percent/green/below_range/output.css a { value: color(prophoto-rgb 0.1 -0.2 0.3); + space: prophoto-rgb; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> percent/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 130%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 0.2 130%)); <===> percent/blue/above_range/output.css a { value: color(prophoto-rgb 0.1 0.2 1.3); + space: prophoto-rgb; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> percent/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(prophoto-rgb 0.1 0.2 -30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(prophoto-rgb 0.1 0.2 -30%)); <===> percent/blue/below_range/output.css a { value: color(prophoto-rgb 0.1 0.2 -0.3); + space: prophoto-rgb; channels: 0.1 0.2 -0.3 / 1; } diff --git a/spec/core_functions/color/color/spaces/rec2020.hrx b/spec/core_functions/color/color/spaces/rec2020.hrx index c5df2d5f1f..097ea46652 100644 --- a/spec/core_functions/color/color/spaces/rec2020.hrx +++ b/spec/core_functions/color/color/spaces/rec2020.hrx @@ -1,165 +1,179 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 0.2 0.3)); <===> unitless/in_range/output.css a { value: color(rec2020 0.1 0.2 0.3); + space: rec2020; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 1.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 1.1 0.2 0.3)); <===> unitless/red/above_range/output.css a { value: color(rec2020 1.1 0.2 0.3); + space: rec2020; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 -0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 -0.1 0.2 0.3)); <===> unitless/red/below_range/output.css a { value: color(rec2020 -0.1 0.2 0.3); + space: rec2020; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 1.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 1.2 0.3)); <===> unitless/green/above_range/output.css a { value: color(rec2020 0.1 1.2 0.3); + space: rec2020; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 -0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 -0.2 0.3)); <===> unitless/green/below_range/output.css a { value: color(rec2020 0.1 -0.2 0.3); + space: rec2020; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 0.2 1.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 0.2 1.3)); <===> unitless/blue/above_range/output.css a { value: color(rec2020 0.1 0.2 1.3); + space: rec2020; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> unitless/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 0.2 -0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 0.2 -0.3)); <===> unitless/blue/below_range/output.css a { value: color(rec2020 0.1 0.2 -0.3); + space: rec2020; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 10% 20% 30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 10% 20% 30%)); <===> percent/in_range/output.css a { value: color(rec2020 0.1 0.2 0.3); + space: rec2020; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 110% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 110% 0.2 0.3)); <===> percent/red/above_range/output.css a { value: color(rec2020 1.1 0.2 0.3); + space: rec2020; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 -10% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 -10% 0.2 0.3)); <===> percent/red/below_range/output.css a { value: color(rec2020 -0.1 0.2 0.3); + space: rec2020; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 120% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 120% 0.3)); <===> percent/green/above_range/output.css a { value: color(rec2020 0.1 1.2 0.3); + space: rec2020; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 -20% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 -20% 0.3)); <===> percent/green/below_range/output.css a { value: color(rec2020 0.1 -0.2 0.3); + space: rec2020; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> percent/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 0.2 130%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 0.2 130%)); <===> percent/blue/above_range/output.css a { value: color(rec2020 0.1 0.2 1.3); + space: rec2020; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> percent/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(rec2020 0.1 0.2 -30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(rec2020 0.1 0.2 -30%)); <===> percent/blue/below_range/output.css a { value: color(rec2020 0.1 0.2 -0.3); + space: rec2020; channels: 0.1 0.2 -0.3 / 1; } diff --git a/spec/core_functions/color/color/spaces/srgb.hrx b/spec/core_functions/color/color/spaces/srgb.hrx index 6f3ac5d2ec..05e445a7f2 100644 --- a/spec/core_functions/color/color/spaces/srgb.hrx +++ b/spec/core_functions/color/color/spaces/srgb.hrx @@ -1,165 +1,179 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 0.3)); <===> unitless/in_range/output.css a { value: color(srgb 0.1 0.2 0.3); + space: srgb; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 1.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 1.1 0.2 0.3)); <===> unitless/red/above_range/output.css a { value: color(srgb 1.1 0.2 0.3); + space: srgb; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb -0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb -0.1 0.2 0.3)); <===> unitless/red/below_range/output.css a { value: color(srgb -0.1 0.2 0.3); + space: srgb; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 1.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 1.2 0.3)); <===> unitless/green/above_range/output.css a { value: color(srgb 0.1 1.2 0.3); + space: srgb; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 -0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 -0.2 0.3)); <===> unitless/green/below_range/output.css a { value: color(srgb 0.1 -0.2 0.3); + space: srgb; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 1.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 1.3)); <===> unitless/blue/above_range/output.css a { value: color(srgb 0.1 0.2 1.3); + space: srgb; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> unitless/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 -0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 -0.3)); <===> unitless/blue/below_range/output.css a { value: color(srgb 0.1 0.2 -0.3); + space: srgb; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 10% 20% 30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 10% 20% 30%)); <===> percent/in_range/output.css a { value: color(srgb 0.1 0.2 0.3); + space: srgb; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 110% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 110% 0.2 0.3)); <===> percent/red/above_range/output.css a { value: color(srgb 1.1 0.2 0.3); + space: srgb; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb -10% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb -10% 0.2 0.3)); <===> percent/red/below_range/output.css a { value: color(srgb -0.1 0.2 0.3); + space: srgb; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 120% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 120% 0.3)); <===> percent/green/above_range/output.css a { value: color(srgb 0.1 1.2 0.3); + space: srgb; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 -20% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 -20% 0.3)); <===> percent/green/below_range/output.css a { value: color(srgb 0.1 -0.2 0.3); + space: srgb; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> percent/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 130%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 130%)); <===> percent/blue/above_range/output.css a { value: color(srgb 0.1 0.2 1.3); + space: srgb; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> percent/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 -30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 -30%)); <===> percent/blue/below_range/output.css a { value: color(srgb 0.1 0.2 -0.3); + space: srgb; channels: 0.1 0.2 -0.3 / 1; } diff --git a/spec/core_functions/color/color/spaces/srgb_linear.hrx b/spec/core_functions/color/color/spaces/srgb_linear.hrx index 9bb3cea1ca..395abf17b8 100644 --- a/spec/core_functions/color/color/spaces/srgb_linear.hrx +++ b/spec/core_functions/color/color/spaces/srgb_linear.hrx @@ -1,165 +1,179 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 0.2 0.3)); <===> unitless/in_range/output.css a { value: color(srgb-linear 0.1 0.2 0.3); + space: srgb-linear; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 1.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 1.1 0.2 0.3)); <===> unitless/red/above_range/output.css a { value: color(srgb-linear 1.1 0.2 0.3); + space: srgb-linear; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear -0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear -0.1 0.2 0.3)); <===> unitless/red/below_range/output.css a { value: color(srgb-linear -0.1 0.2 0.3); + space: srgb-linear; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 1.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 1.2 0.3)); <===> unitless/green/above_range/output.css a { value: color(srgb-linear 0.1 1.2 0.3); + space: srgb-linear; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> unitless/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 -0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 -0.2 0.3)); <===> unitless/green/below_range/output.css a { value: color(srgb-linear 0.1 -0.2 0.3); + space: srgb-linear; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 1.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 0.2 1.3)); <===> unitless/blue/above_range/output.css a { value: color(srgb-linear 0.1 0.2 1.3); + space: srgb-linear; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> unitless/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 -0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 0.2 -0.3)); <===> unitless/blue/below_range/output.css a { value: color(srgb-linear 0.1 0.2 -0.3); + space: srgb-linear; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 10% 20% 30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 10% 20% 30%)); <===> percent/in_range/output.css a { value: color(srgb-linear 0.1 0.2 0.3); + space: srgb-linear; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 110% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 110% 0.2 0.3)); <===> percent/red/above_range/output.css a { value: color(srgb-linear 1.1 0.2 0.3); + space: srgb-linear; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/red/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear -10% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear -10% 0.2 0.3)); <===> percent/red/below_range/output.css a { value: color(srgb-linear -0.1 0.2 0.3); + space: srgb-linear; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 120% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 120% 0.3)); <===> percent/green/above_range/output.css a { value: color(srgb-linear 0.1 1.2 0.3); + space: srgb-linear; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> percent/green/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 -20% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 -20% 0.3)); <===> percent/green/below_range/output.css a { value: color(srgb-linear 0.1 -0.2 0.3); + space: srgb-linear; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> percent/blue/above_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 130%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 0.2 130%)); <===> percent/blue/above_range/output.css a { value: color(srgb-linear 0.1 0.2 1.3); + space: srgb-linear; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> percent/blue/below_range/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb-linear 0.1 0.2 -30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb-linear 0.1 0.2 -30%)); <===> percent/blue/below_range/output.css a { value: color(srgb-linear 0.1 0.2 -0.3); + space: srgb-linear; channels: 0.1 0.2 -0.3 / 1; } diff --git a/spec/core_functions/color/color/spaces/xyz.hrx b/spec/core_functions/color/color/spaces/xyz.hrx index 8970c45322..9dfe04af2b 100644 --- a/spec/core_functions/color/color/spaces/xyz.hrx +++ b/spec/core_functions/color/color/spaces/xyz.hrx @@ -1,177 +1,192 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 0.2 0.3)); <===> unitless/in_range/output.css a { value: color(xyz 0.1 0.2 0.3); + space: xyz; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/x/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 1.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 1.1 0.2 0.3)); <===> unitless/x/above_range/output.css a { value: color(xyz 1.1 0.2 0.3); + space: xyz; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/x/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz -0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz -0.1 0.2 0.3)); <===> unitless/x/below_range/output.css a { value: color(xyz -0.1 0.2 0.3); + space: xyz; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/y/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 1.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 1.2 0.3)); <===> unitless/y/above_range/output.css a { value: color(xyz 0.1 1.2 0.3); + space: xyz; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> unitless/y/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 -0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 -0.2 0.3)); <===> unitless/y/below_range/output.css a { value: color(xyz 0.1 -0.2 0.3); + space: xyz; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/z/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 0.2 1.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 0.2 1.3)); <===> unitless/z/above_range/output.css a { value: color(xyz 0.1 0.2 1.3); + space: xyz; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> unitless/z/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 0.2 -0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 0.2 -0.3)); <===> unitless/z/below_range/output.css a { value: color(xyz 0.1 0.2 -0.3); + space: xyz; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 10% 20% 30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 10% 20% 30%)); <===> percent/in_range/output.css a { value: color(xyz 0.1 0.2 0.3); + space: xyz; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/x/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 110% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 110% 0.2 0.3)); <===> percent/x/above_range/output.css a { value: color(xyz 1.1 0.2 0.3); + space: xyz; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/x/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz -10% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz -10% 0.2 0.3)); <===> percent/x/below_range/output.css a { value: color(xyz -0.1 0.2 0.3); + space: xyz; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/y/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 120% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 120% 0.3)); <===> percent/y/above_range/output.css a { value: color(xyz 0.1 1.2 0.3); + space: xyz; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> percent/y/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 -20% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 -20% 0.3)); <===> percent/y/below_range/output.css a { value: color(xyz 0.1 -0.2 0.3); + space: xyz; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> percent/z/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 0.2 130%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 0.2 130%)); <===> percent/z/above_range/output.css a { value: color(xyz 0.1 0.2 1.3); + space: xyz; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> percent/z/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz 0.1 0.2 -30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz 0.1 0.2 -30%)); <===> percent/z/below_range/output.css a { value: color(xyz 0.1 0.2 -0.3); + space: xyz; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> xyz_d65/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d65 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d65 0.1 0.2 0.3)); <===> xyz_d65/output.css a { value: color(xyz 0.1 0.2 0.3); + space: xyz; channels: 0.1 0.2 0.3 / 1; } diff --git a/spec/core_functions/color/color/spaces/xyz_d50.hrx b/spec/core_functions/color/color/spaces/xyz_d50.hrx index f836ab16f1..3357106e0e 100644 --- a/spec/core_functions/color/color/spaces/xyz_d50.hrx +++ b/spec/core_functions/color/color/spaces/xyz_d50.hrx @@ -1,165 +1,179 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 0.2 0.3)); <===> unitless/in_range/output.css a { value: color(xyz-d50 0.1 0.2 0.3); + space: xyz-d50; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/x/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 1.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 1.1 0.2 0.3)); <===> unitless/x/above_range/output.css a { value: color(xyz-d50 1.1 0.2 0.3); + space: xyz-d50; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/x/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 -0.1 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 -0.1 0.2 0.3)); <===> unitless/x/below_range/output.css a { value: color(xyz-d50 -0.1 0.2 0.3); + space: xyz-d50; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/y/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 1.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 1.2 0.3)); <===> unitless/y/above_range/output.css a { value: color(xyz-d50 0.1 1.2 0.3); + space: xyz-d50; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> unitless/y/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 -0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 -0.2 0.3)); <===> unitless/y/below_range/output.css a { value: color(xyz-d50 0.1 -0.2 0.3); + space: xyz-d50; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> unitless/z/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 1.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 0.2 1.3)); <===> unitless/z/above_range/output.css a { value: color(xyz-d50 0.1 0.2 1.3); + space: xyz-d50; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> unitless/z/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 -0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 0.2 -0.3)); <===> unitless/z/below_range/output.css a { value: color(xyz-d50 0.1 0.2 -0.3); + space: xyz-d50; channels: 0.1 0.2 -0.3 / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 10% 20% 30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 10% 20% 30%)); <===> percent/in_range/output.css a { value: color(xyz-d50 0.1 0.2 0.3); + space: xyz-d50; channels: 0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/x/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 110% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 110% 0.2 0.3)); <===> percent/x/above_range/output.css a { value: color(xyz-d50 1.1 0.2 0.3); + space: xyz-d50; channels: 1.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/x/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 -10% 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 -10% 0.2 0.3)); <===> percent/x/below_range/output.css a { value: color(xyz-d50 -0.1 0.2 0.3); + space: xyz-d50; channels: -0.1 0.2 0.3 / 1; } <===> ================================================================================ <===> percent/y/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 120% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 120% 0.3)); <===> percent/y/above_range/output.css a { value: color(xyz-d50 0.1 1.2 0.3); + space: xyz-d50; channels: 0.1 1.2 0.3 / 1; } <===> ================================================================================ <===> percent/y/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 -20% 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 -20% 0.3)); <===> percent/y/below_range/output.css a { value: color(xyz-d50 0.1 -0.2 0.3); + space: xyz-d50; channels: 0.1 -0.2 0.3 / 1; } <===> ================================================================================ <===> percent/z/above_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 130%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 0.2 130%)); <===> percent/z/above_range/output.css a { value: color(xyz-d50 0.1 0.2 1.3); + space: xyz-d50; channels: 0.1 0.2 1.3 / 1; } <===> ================================================================================ <===> percent/z/below_range/input.scss -@use 'core_functions/color/color/xyz-utils'; -@include xyz-utils.inspect(color(xyz-d50 0.1 0.2 -30%)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(xyz-d50 0.1 0.2 -30%)); <===> percent/z/below_range/output.css a { value: color(xyz-d50 0.1 0.2 -0.3); + space: xyz-d50; channels: 0.1 0.2 -0.3 / 1; } diff --git a/spec/core_functions/color/color/special_functions.hrx b/spec/core_functions/color/color/special_functions.hrx index c93bb051e5..064c758ba8 100644 --- a/spec/core_functions/color/color/special_functions.hrx +++ b/spec/core_functions/color/color/special_functions.hrx @@ -1,6 +1,6 @@ <===> calculation/arg_1/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb calc(1px + 1%) 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb calc(1px + 1%) 0.2 0.3)); <===> calculation/arg_1/output.css a { @@ -11,8 +11,8 @@ a { <===> ================================================================================ <===> calculation/arg_2/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 calc(1px + 1%) 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 calc(1px + 1%) 0.3)); <===> calculation/arg_2/output.css a { @@ -23,8 +23,8 @@ a { <===> ================================================================================ <===> calculation/arg_3/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 calc(1px + 1%))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 calc(1px + 1%))); <===> calculation/arg_3/output.css a { @@ -35,8 +35,8 @@ a { <===> ================================================================================ <===> calculation/arg_4/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / calc(1px + 1%))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 0.3 / calc(1px + 1%))); <===> calculation/arg_4/output.css a { @@ -47,8 +47,8 @@ a { <===> ================================================================================ <===> var/arg_1/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb var(--foo) 0.2 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb var(--foo) 0.2 0.3)); <===> var/arg_1/output.css a { @@ -59,8 +59,8 @@ a { <===> ================================================================================ <===> var/arg_2/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 var(--foo) 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 var(--foo) 0.3)); <===> var/arg_2/output.css a { @@ -71,8 +71,8 @@ a { <===> ================================================================================ <===> var/arg_3/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 var(--foo))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 var(--foo))); <===> var/arg_3/output.css a { @@ -83,8 +83,8 @@ a { <===> ================================================================================ <===> var/arg_4/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 0.2 0.3 / var(--foo))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 0.2 0.3 / var(--foo))); <===> var/arg_4/output.css a { @@ -96,8 +96,8 @@ a { ================================================================================ <===> multi_argument_var/1_of_2/input.scss // var() is substituted before parsing, so it may contain multiple arguments. -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb var(--foo) 0.3)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb var(--foo) 0.3)); <===> multi_argument_var/1_of_2/output.css a { @@ -108,8 +108,8 @@ a { <===> ================================================================================ <===> multi_argument_var/2_of_2/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb 0.1 var(--foo))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb 0.1 var(--foo))); <===> multi_argument_var/2_of_2/output.css a { @@ -120,8 +120,8 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/no_alpha/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb var(--foo))); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb var(--foo))); <===> multi_argument_var/1_of_1/no_alpha/output.css a { @@ -132,8 +132,8 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/alpha/input.scss -@use 'core_functions/color/color/rgb-utils'; -@include rgb-utils.inspect(color(srgb var(--foo) / 0.4)); +@use 'core_functions/color/utils'; +@include utils.inspect(color(srgb var(--foo) / 0.4)); <===> multi_argument_var/1_of_1/alpha/output.css a { diff --git a/spec/core_functions/color/grayscale.hrx b/spec/core_functions/color/grayscale.hrx index ac29702aee..604112db90 100644 --- a/spec/core_functions/color/grayscale.hrx +++ b/spec/core_functions/color/grayscale.hrx @@ -94,7 +94,7 @@ a {b: grayscale(lch(54.3 107 40.9))} <===> non_legacy/polar/output.css a { - b: lch(56.854581217% 0.0000089094 270.4698997617deg); + b: lch(56.854581217% 0.0000089094 270.4699001175deg); } <===> diff --git a/spec/core_functions/color/hsl/four_args/clamped.hrx b/spec/core_functions/color/hsl/four_args/clamped.hrx index c4aa155fa9..85a62b65dd 100644 --- a/spec/core_functions/color/hsl/four_args/clamped.hrx +++ b/spec/core_functions/color/hsl/four_args/clamped.hrx @@ -18,7 +18,7 @@ a {b: hsl(0, 100%, 9999%, 0.5)} <===> blue/output.css a { - b: hsla(0, 100%, 100%, 0.5); + b: hsla(0, 100%, 9999%, 0.5); } <===> diff --git a/spec/core_functions/color/hsl/one_arg/alpha.hrx b/spec/core_functions/color/hsl/one_arg/alpha.hrx index 2b23c7d420..ebd8fcc6f3 100644 --- a/spec/core_functions/color/hsl/one_arg/alpha.hrx +++ b/spec/core_functions/color/hsl/one_arg/alpha.hrx @@ -64,7 +64,7 @@ a {b: hsl(0 100% 9999% / 0.5)} <===> clamped/lightness/output.css a { - b: hsla(0, 100%, 100%, 0.5); + b: hsla(0, 100%, 9999%, 0.5); } <===> diff --git a/spec/core_functions/color/hsl/one_arg/no_alpha.hrx b/spec/core_functions/color/hsl/one_arg/no_alpha.hrx index e175a51c15..a7f5257f71 100644 --- a/spec/core_functions/color/hsl/one_arg/no_alpha.hrx +++ b/spec/core_functions/color/hsl/one_arg/no_alpha.hrx @@ -28,12 +28,12 @@ a { <===> ================================================================================ -<===> clamped/saturation/above/input.scss +<===> out_of_gamut/saturation/above/input.scss a {b: hsl(0 500% 50%)} -<===> clamped/saturation/above/output.css +<===> out_of_gamut/saturation/above/output.css a { - b: hsl(0, 100%, 50%); + b: hsl(0, 500%, 50%); } <===> @@ -53,7 +53,7 @@ a {b: hsl(0 100% 500%)} <===> clamped/lightness/above/output.css a { - b: hsl(0, 100%, 100%); + b: hsl(0, 100%, 500%); } <===> @@ -63,7 +63,7 @@ a {b: hsl(0 100% -100%)} <===> clamped/lightness/below/output.css a { - b: hsl(0, 100%, 0%); + b: hsl(0, 100%, -100%); } <===> diff --git a/spec/core_functions/color/hsl/three_args/clamped.hrx b/spec/core_functions/color/hsl/three_args/clamped.hrx index 722b8f6e87..308a32fbb7 100644 --- a/spec/core_functions/color/hsl/three_args/clamped.hrx +++ b/spec/core_functions/color/hsl/three_args/clamped.hrx @@ -1,16 +1,6 @@ <===> README.md The W3C tests cover clamped hue, but not clamped saturation or lightness. -<===> -================================================================================ -<===> saturation/above/input.scss -a {b: hsl(0, 500%, 50%)} - -<===> saturation/above/output.css -a { - b: hsl(0, 100%, 50%); -} - <===> ================================================================================ <===> saturation/below/input.scss @@ -28,7 +18,7 @@ a {b: hsl(0, 100%, 500%)} <===> lightness/above/output.css a { - b: hsl(0, 100%, 100%); + b: hsl(0, 100%, 500%); } <===> @@ -38,5 +28,5 @@ a {b: hsl(0, 100%, -100%)} <===> lightness/below/output.css a { - b: hsl(0, 100%, 0%); + b: hsl(0, 100%, -100%); } diff --git a/spec/core_functions/color/hsl/three_args/out_of_gamut.hrx b/spec/core_functions/color/hsl/three_args/out_of_gamut.hrx new file mode 100644 index 0000000000..bed3d2b753 --- /dev/null +++ b/spec/core_functions/color/hsl/three_args/out_of_gamut.hrx @@ -0,0 +1,12 @@ +<===> saturation/above/input.scss +a {b: hsl(0, 500%, 50%)} + +<===> saturation/above/output.css +a { + b: hsl(0, 500%, 50%); +} + +<===> saturation/above/output-libsass.css +a { + b: red; +} diff --git a/spec/core_functions/color/is_in_gamut.hrx b/spec/core_functions/color/is_in_gamut.hrx index af99008df1..93ff599d73 100644 --- a/spec/core_functions/color/is_in_gamut.hrx +++ b/spec/core_functions/color/is_in_gamut.hrx @@ -1,6 +1,6 @@ <===> rgb/input.scss @use "sass:color"; -a {b: color.is-in-gamut(rgb(0 300 0))} +a {b: color.is-in-gamut(color.change(black, $green: 300))} <===> rgb/output.css a { @@ -11,7 +11,7 @@ a { ================================================================================ <===> rgba/input.scss @use "sass:color"; -a {b: color.is-in-gamut(rgba(-1 122 180 / 0.4))} +a {b: color.is-in-gamut(color.change(rgba(0 122 180 / 0.4), $red: -1))} <===> rgba/output.css a { @@ -22,11 +22,11 @@ a { ================================================================================ <===> hwb/input.scss @use "sass:color"; -a {b: color.is-in-gamut(hwb(0 300% 0%))} +a {b: color.is-in-gamut(hwb(0 300% -1%))} <===> hwb/output.css a { - b: true; + b: false; } <===> @@ -37,7 +37,7 @@ a {b: color.is-in-gamut(hsl(0 0% -1%))} <===> hsl/output.css a { - b: true; + b: false; } <===> @@ -235,7 +235,7 @@ a {b: color.is-in-gamut(color(display-p3 1 1 0), hwb)} <===> wide_narrow/output.css a { - b: true; + b: false; } <===> diff --git a/spec/core_functions/color/lab/_utils.scss b/spec/core_functions/color/lab/_utils.scss deleted file mode 100644 index 106fe41df4..0000000000 --- a/spec/core_functions/color/lab/_utils.scss +++ /dev/null @@ -1,27 +0,0 @@ -@use 'sass:color'; -@use 'sass:list'; -@use 'sass:meta'; - -@function -real-channel($color, $channel) { - @if color.is-missing($color, $channel) { - @return none; - } @else { - @return color.channel($color, $channel); - } -} - -@mixin inspect($color) { - a { - value: $color; - @if meta.type-of($color) == string { - type: string; - } @else { - channels: list.slash( - -real-channel($color, 'lightness') - -real-channel($color, 'a') - -real-channel($color, 'b'), - -real-channel($color, 'alpha') - ); - } - } -} diff --git a/spec/core_functions/color/lab/alpha.hrx b/spec/core_functions/color/lab/alpha.hrx index bdb10dcb9a..cff840012c 100644 --- a/spec/core_functions/color/lab/alpha.hrx +++ b/spec/core_functions/color/lab/alpha.hrx @@ -1,58 +1,63 @@ <===> transparent/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(0 255 127 / 0)); <===> transparent/output.css a { value: lab(0% 255 127 / 0); + space: lab; channels: 0% 255 127 / 0; } <===> ================================================================================ <===> opaque/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / 1)); <===> opaque/output.css a { value: lab(1% 2 3); + space: lab; channels: 1% 2 3 / 1; } <===> ================================================================================ <===> partial/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / 0.4)); <===> partial/output.css a { value: lab(1% 2 3 / 0.4); + space: lab; channels: 1% 2 3 / 0.4; } <===> ================================================================================ <===> percent/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / 40%)); <===> percent/output.css a { value: lab(1% 2 3 / 0.4); + space: lab; channels: 1% 2 3 / 0.4; } <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab($channels: 1% 2 3 / 0.4)); <===> named/output.css a { value: lab(1% 2 3 / 0.4); + space: lab; channels: 1% 2 3 / 0.4; } @@ -60,48 +65,52 @@ a { ================================================================================ <===> slash_list/input.scss @use "sass:list"; -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(list.slash(1% 2 3, 0.4))); <===> slash_list/output.css a { value: lab(1% 2 3 / 0.4); + space: lab; channels: 1% 2 3 / 0.4; } <===> ================================================================================ <===> none/slash/b/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 none / 0.4)); <===> none/slash/b/output.css a { value: lab(1% 2 none / 0.4); + space: lab; channels: 1% 2 none / 0.4; } <===> ================================================================================ <===> none/slash/alpha/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / none)); <===> none/slash/alpha/output.css a { value: lab(1% 2 3 / none); + space: lab; channels: 1% 2 3 / none; } <===> ================================================================================ <===> none/slash/b_and_alpha/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 none / none)); <===> none/slash/b_and_alpha/output.css a { value: lab(1% 2 none / none); + space: lab; channels: 1% 2 none / none; } @@ -109,12 +118,13 @@ a { ================================================================================ <===> none/slash_list/b/input.scss @use 'sass:list'; -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(list.slash(1% 2 none, 0.4))); <===> none/slash_list/b/output.css a { value: lab(1% 2 none / 0.4); + space: lab; channels: 1% 2 none / 0.4; } @@ -122,12 +132,13 @@ a { ================================================================================ <===> none/slash_list/alpha/input.scss @use 'sass:list'; -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(list.slash(1% 2 3, none))); <===> none/slash_list/alpha/output.css a { value: lab(1% 2 3 / none); + space: lab; channels: 1% 2 3 / none; } @@ -135,11 +146,12 @@ a { ================================================================================ <===> none/slash_list/b_and_alpha/input.scss @use 'sass:list'; -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(list.slash(1% 2 none, none))); <===> none/slash_list/b_and_alpha/output.css a { value: lab(1% 2 none / none); + space: lab; channels: 1% 2 none / none; } diff --git a/spec/core_functions/color/lab/no_alpha.hrx b/spec/core_functions/color/lab/no_alpha.hrx index 69e193f4e8..39d71357fe 100644 --- a/spec/core_functions/color/lab/no_alpha.hrx +++ b/spec/core_functions/color/lab/no_alpha.hrx @@ -1,189 +1,205 @@ <===> unitless/ab/in_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 -3)); <===> unitless/ab/in_range/output.css a { value: lab(1% 2 -3); + space: lab; channels: 1% 2 -3 / 1; } <===> ================================================================================ <===> unitless/ab/above_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 126 300)); <===> unitless/ab/above_range/output.css a { value: lab(1% 126 300); + space: lab; channels: 1% 126 300 / 1; } <===> ================================================================================ <===> unitless/ab/below_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% -126 -300)); <===> unitless/ab/below_range/output.css a { value: lab(1% -126 -300); + space: lab; channels: 1% -126 -300 / 1; } <===> ================================================================================ <===> unitless/lightness/in_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(10 2 -3)); <===> unitless/lightness/in_range/output.css a { value: lab(10% 2 -3); + space: lab; channels: 10% 2 -3 / 1; } <===> ================================================================================ <===> unitless/lightness/above_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(101 2 3)); <===> unitless/lightness/above_range/output.css a { value: lab(100% 2 3); + space: lab; channels: 100% 2 3 / 1; } <===> ================================================================================ <===> unitless/lightness/below_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(-1 2 3)); <===> unitless/lightness/below_range/output.css a { value: lab(0% 2 3); + space: lab; channels: 0% 2 3 / 1; } <===> ================================================================================ <===> percent/ab/in_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2% -3%)); <===> percent/ab/in_range/output.css a { value: lab(1% 2.5 -3.75); + space: lab; channels: 1% 2.5 -3.75 / 1; } <===> ================================================================================ <===> percent/ab/above_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 101% 150%)); <===> percent/ab/above_range/output.css a { value: lab(1% 126.25 187.5); + space: lab; channels: 1% 126.25 187.5 / 1; } <===> ================================================================================ <===> percent/ab/below_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% -101% -150%)); <===> percent/ab/below_range/output.css a { value: lab(1% -126.25 -187.5); + space: lab; channels: 1% -126.25 -187.5 / 1; } <===> ================================================================================ <===> percent/lightness/in_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2% -3%)); <===> percent/lightness/in_range/output.css a { value: lab(1% 2.5 -3.75); + space: lab; channels: 1% 2.5 -3.75 / 1; } <===> ================================================================================ <===> percent/lightness/above_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(110% 2 3)); <===> percent/lightness/above_range/output.css a { value: lab(100% 2 3); + space: lab; channels: 100% 2 3 / 1; } <===> ================================================================================ <===> percent/lightness/below_range/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(-1% 2 3)); <===> percent/lightness/below_range/output.css a { value: lab(0% 2 3); + space: lab; channels: 0% 2 3 / 1; } <===> ================================================================================ <===> none/lightness/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(none 2 3)); <===> none/lightness/output.css a { value: lab(none 2 3); + space: lab; channels: none 2 3 / 1; } <===> ================================================================================ <===> none/a/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% none 3)); <===> none/a/output.css a { value: lab(1% none 3); + space: lab; channels: 1% none 3 / 1; } <===> ================================================================================ <===> none/b/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 none)); <===> none/b/output.css a { value: lab(1% 2 none); + space: lab; channels: 1% 2 none / 1; } <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab($channels: 1% 2 3)); <===> named/output.css a { value: lab(1% 2 3); + space: lab; channels: 1% 2 3 / 1; } diff --git a/spec/core_functions/color/lab/special_functions/alpha.hrx b/spec/core_functions/color/lab/special_functions/alpha.hrx index 85837f5972..081d164f88 100644 --- a/spec/core_functions/color/lab/special_functions/alpha.hrx +++ b/spec/core_functions/color/lab/special_functions/alpha.hrx @@ -1,5 +1,5 @@ <===> calc/string/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(unquote("calc(1%)") 2 3 / 0.4)); <===> calc/string/arg_1/output.css @@ -11,7 +11,7 @@ a { <===> ================================================================================ <===> calc/string/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% unquote("calc(2)") 3 / 0.4)); <===> calc/string/arg_2/output.css @@ -23,7 +23,7 @@ a { <===> ================================================================================ <===> calc/string/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 unquote("calc(3)") / 0.4)); <===> calc/string/arg_3/output.css @@ -35,7 +35,7 @@ a { <===> ================================================================================ <===> calc/string/arg_4/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / unquote("calc(0.4)"))); <===> calc/string/arg_4/output.css @@ -47,7 +47,7 @@ a { <===> ================================================================================ <===> calc/calculation/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(calc(1px + 1%) 2 3 / 0.4)); <===> calc/calculation/arg_1/output.css @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> calc/calculation/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% calc(1px + 1%) 3 / 0.4)); <===> calc/calculation/arg_2/output.css @@ -71,7 +71,7 @@ a { <===> ================================================================================ <===> calc/calculation/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 calc(1px + 1%) / 0.4)); <===> calc/calculation/arg_3/output.css @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> calc/calculation/arg_4/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / calc(1px + 1%))); <===> calc/calculation/arg_4/output.css @@ -95,7 +95,7 @@ a { <===> ================================================================================ <===> var/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(var(--foo) 2 3 / 0.4)); <===> var/arg_1/output.css @@ -107,7 +107,7 @@ a { <===> ================================================================================ <===> var/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% var(--foo) 3 / 0.4)); <===> var/arg_2/output.css @@ -119,7 +119,7 @@ a { <===> ================================================================================ <===> var/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 var(--foo) / 0.4)); <===> var/arg_3/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> var/arg_4/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / var(--foo))); <===> var/arg_4/output.css @@ -143,7 +143,7 @@ a { <===> ================================================================================ <===> env/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(env(--foo) 2 3 / 0.4)); <===> env/arg_1/output.css @@ -155,7 +155,7 @@ a { <===> ================================================================================ <===> env/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% env(--foo) 3 / 0.4)); <===> env/arg_2/output.css @@ -167,7 +167,7 @@ a { <===> ================================================================================ <===> env/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 env(--foo) / 0.4)); <===> env/arg_3/output.css @@ -179,7 +179,7 @@ a { <===> ================================================================================ <===> env/arg_4/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / env(--foo))); <===> env/arg_4/output.css @@ -191,7 +191,7 @@ a { <===> ================================================================================ <===> min/string/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(unquote("min(1%)") 2 3 / 0.4)); <===> min/string/arg_1/output.css @@ -203,7 +203,7 @@ a { <===> ================================================================================ <===> min/string/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% unquote("min(2)") 3 / 0.4)); <===> min/string/arg_2/output.css @@ -215,7 +215,7 @@ a { <===> ================================================================================ <===> min/string/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 unquote("min(3)") / 0.4)); <===> min/string/arg_3/output.css @@ -227,7 +227,7 @@ a { <===> ================================================================================ <===> min/string/arg_4/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / unquote("min(0.4)"))); <===> min/string/arg_4/output.css @@ -239,7 +239,7 @@ a { <===> ================================================================================ <===> max/string/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(unquote("max(1%)") 2 3 / 0.4)); <===> max/string/arg_1/output.css @@ -251,7 +251,7 @@ a { <===> ================================================================================ <===> max/string/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% unquote("max(2)") 3 / 0.4)); <===> max/string/arg_2/output.css @@ -263,7 +263,7 @@ a { <===> ================================================================================ <===> max/string/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 unquote("max(3)") / 0.4)); <===> max/string/arg_3/output.css @@ -275,7 +275,7 @@ a { <===> ================================================================================ <===> max/string/arg_4/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / unquote("max(0.4)"))); <===> max/string/arg_4/output.css @@ -287,7 +287,7 @@ a { <===> ================================================================================ <===> clamp/string/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(unquote("clamp(1%, 2, 3)") 2 3 / 0.4)); <===> clamp/string/arg_1/output.css @@ -299,7 +299,7 @@ a { <===> ================================================================================ <===> clamp/string/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% unquote("clamp(2, 3, 4)") 3 / 0.4)); <===> clamp/string/arg_2/output.css @@ -311,7 +311,7 @@ a { <===> ================================================================================ <===> clamp/string/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 unquote("clamp(3, 4, 5)") / 0.4)); <===> clamp/string/arg_3/output.css @@ -323,7 +323,7 @@ a { <===> ================================================================================ <===> clamp/string/arg_4/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / unquote("clamp(0.4, 0.5, 0.6)"))); <===> clamp/string/arg_4/output.css @@ -335,7 +335,7 @@ a { <===> ================================================================================ <===> unknown/arg_3/with_number/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 b / 0.4)); <===> unknown/arg_3/with_number/output.css @@ -347,7 +347,7 @@ a { <===> ================================================================================ <===> unknown/arg_3/with_none/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 b / none)); <===> unknown/arg_3/with_none/output.css @@ -359,7 +359,7 @@ a { <===> ================================================================================ <===> unknown/arg_4/with_number/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 3 / b)); <===> unknown/arg_4/with_number/output.css @@ -371,7 +371,7 @@ a { <===> ================================================================================ <===> unknown/arg_4/with_none/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 none / b)); <===> unknown/arg_4/with_none/output.css @@ -383,7 +383,7 @@ a { <===> ================================================================================ <===> unknown/arg_3_and_4/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 b / c)); <===> unknown/arg_3_and_4/output.css @@ -396,7 +396,7 @@ a { ================================================================================ <===> multi_argument_var/1_of_2/input.scss // var() is substituted before parsing, so it may contain multiple arguments. -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(var(--foo) 2 / 0.4)); <===> multi_argument_var/1_of_2/output.css @@ -408,7 +408,7 @@ a { <===> ================================================================================ <===> multi_argument_var/2_of_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% var(--foo) / 0.4)); <===> multi_argument_var/2_of_2/output.css @@ -420,7 +420,7 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(var(--foo) / 0.4)); <===> multi_argument_var/1_of_1/output.css diff --git a/spec/core_functions/color/lab/special_functions/no_alpha.hrx b/spec/core_functions/color/lab/special_functions/no_alpha.hrx index c20e710403..8f461e6412 100644 --- a/spec/core_functions/color/lab/special_functions/no_alpha.hrx +++ b/spec/core_functions/color/lab/special_functions/no_alpha.hrx @@ -1,5 +1,5 @@ <===> calc/string/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(unquote("calc(1%)") 2 3)); <===> calc/string/arg_1/output.css @@ -11,7 +11,7 @@ a { <===> ================================================================================ <===> calc/string/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% unquote("calc(2)") 3)); <===> calc/string/arg_2/output.css @@ -23,7 +23,7 @@ a { <===> ================================================================================ <===> calc/string/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 unquote("calc(3)"))); <===> calc/string/arg_3/output.css @@ -35,7 +35,7 @@ a { <===> ================================================================================ <===> calc/calculation/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(calc(1px + 1%) 2 3)); <===> calc/calculation/arg_1/output.css @@ -47,7 +47,7 @@ a { <===> ================================================================================ <===> calc/calculation/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% calc(1px + 1%) 3)); <===> calc/calculation/arg_2/output.css @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> calc/calculation/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 calc(1px + 1%))); <===> calc/calculation/arg_3/output.css @@ -71,7 +71,7 @@ a { <===> ================================================================================ <===> var/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(var(--foo) 2 3)); <===> var/arg_1/output.css @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> var/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% var(--foo) 3)); <===> var/arg_2/output.css @@ -95,7 +95,7 @@ a { <===> ================================================================================ <===> var/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 var(--foo))); <===> var/arg_3/output.css @@ -107,7 +107,7 @@ a { <===> ================================================================================ <===> env/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(env(--foo) 2 3)); <===> env/arg_1/output.css @@ -119,7 +119,7 @@ a { <===> ================================================================================ <===> env/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% env(--foo) 3)); <===> env/arg_2/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> env/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 env(--foo))); <===> env/arg_3/output.css @@ -143,7 +143,7 @@ a { <===> ================================================================================ <===> min/string/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(unquote("min(1%)") 2 3)); <===> min/string/arg_1/output.css @@ -155,7 +155,7 @@ a { <===> ================================================================================ <===> min/string/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% unquote("min(2)") 3)); <===> min/string/arg_2/output.css @@ -167,7 +167,7 @@ a { <===> ================================================================================ <===> min/string/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 unquote("min(3)"))); <===> min/string/arg_3/output.css @@ -179,7 +179,7 @@ a { <===> ================================================================================ <===> max/string/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(unquote("max(1%)") 2 3)); <===> max/string/arg_1/output.css @@ -191,7 +191,7 @@ a { <===> ================================================================================ <===> max/string/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% unquote("max(2)") 3)); <===> max/string/arg_2/output.css @@ -203,7 +203,7 @@ a { <===> ================================================================================ <===> max/string/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 unquote("max(3)"))); <===> max/string/arg_3/output.css @@ -215,7 +215,7 @@ a { <===> ================================================================================ <===> clamp/string/arg_1/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(unquote("clamp(1%, 2, 3)") 2 3)); <===> clamp/string/arg_1/output.css @@ -227,7 +227,7 @@ a { <===> ================================================================================ <===> clamp/string/arg_2/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% unquote("clamp(2, 3, 4)") 3)); <===> clamp/string/arg_2/output.css @@ -239,7 +239,7 @@ a { <===> ================================================================================ <===> clamp/string/arg_3/input.scss -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(1% 2 unquote("clamp(3, 4, 5)"))); <===> clamp/string/arg_3/output.css diff --git a/spec/core_functions/color/lab/special_functions/slash_list.hrx b/spec/core_functions/color/lab/special_functions/slash_list.hrx index f99a640c53..b3aace0b9c 100644 --- a/spec/core_functions/color/lab/special_functions/slash_list.hrx +++ b/spec/core_functions/color/lab/special_functions/slash_list.hrx @@ -1,6 +1,6 @@ <===> channels/input.scss @use "sass:list"; -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(list.slash(var(--foo), 0.4))); <===> channels/output.css @@ -13,7 +13,7 @@ a { ================================================================================ <===> some_channels/input.scss @use "sass:list"; -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(list.slash(1% var(--foo), 0.4))); <===> some_channels/output.css @@ -26,7 +26,7 @@ a { ================================================================================ <===> alpha/input.scss @use "sass:list"; -@use 'core_functions/color/lab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lab(list.slash(1% 2 3, var(--c)))); <===> alpha/output.css diff --git a/spec/core_functions/color/lch/_utils.scss b/spec/core_functions/color/lch/_utils.scss deleted file mode 100644 index 508c32e306..0000000000 --- a/spec/core_functions/color/lch/_utils.scss +++ /dev/null @@ -1,27 +0,0 @@ -@use 'sass:color'; -@use 'sass:list'; -@use 'sass:meta'; - -@function -real-channel($color, $channel) { - @if color.is-missing($color, $channel) { - @return none; - } @else { - @return color.channel($color, $channel); - } -} - -@mixin inspect($color) { - a { - value: $color; - @if meta.type-of($color) == string { - type: string; - } @else { - channels: list.slash( - -real-channel($color, 'lightness') - -real-channel($color, 'chroma') - -real-channel($color, 'hue'), - -real-channel($color, 'alpha') - ); - } - } -} diff --git a/spec/core_functions/color/lch/alpha.hrx b/spec/core_functions/color/lch/alpha.hrx index 170b7b0b63..a5957e271f 100644 --- a/spec/core_functions/color/lch/alpha.hrx +++ b/spec/core_functions/color/lch/alpha.hrx @@ -1,58 +1,63 @@ <===> transparent/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 3deg / 0)); <===> transparent/output.css a { value: lch(1% 2 3deg / 0); + space: lch; channels: 1% 2 3deg / 0; } <===> ================================================================================ <===> opaque/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 3deg / 1)); <===> opaque/output.css a { value: lch(1% 2 3deg); + space: lch; channels: 1% 2 3deg / 1; } <===> ================================================================================ <===> partial/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 3deg / 0.4)); <===> partial/output.css a { value: lch(1% 2 3deg / 0.4); + space: lch; channels: 1% 2 3deg / 0.4; } <===> ================================================================================ <===> percent/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 3deg / 40%)); <===> percent/output.css a { value: lch(1% 2 3deg / 0.4); + space: lch; channels: 1% 2 3deg / 0.4; } <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch($channels: 1% 2 3deg / 0.4)); <===> named/output.css a { value: lch(1% 2 3deg / 0.4); + space: lch; channels: 1% 2 3deg / 0.4; } @@ -60,36 +65,39 @@ a { ================================================================================ <===> slash_list/input.scss @use "sass:list"; -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(list.slash(1% 2 3deg, 0.4))); <===> slash_list/output.css a { value: lch(1% 2 3deg / 0.4); + space: lch; channels: 1% 2 3deg / 0.4; } <===> ================================================================================ <===> none/slash/hue/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 none / 0.4)); <===> none/slash/hue/output.css a { value: lch(1% 2 none / 0.4); + space: lch; channels: 1% 2 none / 0.4; } <===> ================================================================================ <===> none/slash/alpha/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 3deg / none)); <===> none/slash/alpha/output.css a { value: lch(1% 2 3deg / none); + space: lch; channels: 1% 2 3deg / none; } @@ -97,12 +105,13 @@ a { ================================================================================ <===> none/slash_list/hue/input.scss @use 'sass:list'; -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(list.slash(1% 2 none, 0.4))); <===> none/slash_list/hue/output.css a { value: lch(1% 2 none / 0.4); + space: lch; channels: 1% 2 none / 0.4; } @@ -110,11 +119,12 @@ a { ================================================================================ <===> none/slash_list/alpha/input.scss @use 'sass:list'; -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(list.slash(1% 2 3deg, none))); <===> none/slash_list/alpha/output.css a { value: lch(1% 2 3deg / none); + space: lch; channels: 1% 2 3deg / none; } diff --git a/spec/core_functions/color/lch/no_alpha.hrx b/spec/core_functions/color/lch/no_alpha.hrx index 65fc7e78b1..8d01279b8a 100644 --- a/spec/core_functions/color/lch/no_alpha.hrx +++ b/spec/core_functions/color/lch/no_alpha.hrx @@ -1,189 +1,205 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1 2 3deg)); <===> unitless/in_range/output.css a { value: lch(1% 2 3deg); + space: lch; channels: 1% 2 3deg / 1; } <===> ================================================================================ <===> unitless/lightness/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(101 2 3deg)); <===> unitless/lightness/above_range/output.css a { value: lch(100% 2 3deg); + space: lch; channels: 100% 2 3deg / 1; } <===> ================================================================================ <===> unitless/lightness/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(-1 2 3deg)); <===> unitless/lightness/below_range/output.css a { value: lch(0% 2 3deg); + space: lch; channels: 0% 2 3deg / 1; } <===> ================================================================================ <===> unitless/chroma/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 0.5 3deg)); <===> unitless/chroma/above_range/output.css a { value: lch(1% 0.5 3deg); + space: lch; channels: 1% 0.5 3deg / 1; } <===> ================================================================================ <===> unitless/chroma/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% -0.1 3deg)); <===> unitless/chroma/below_range/output.css a { - value: lch(1% -0.1 3deg); - channels: 1% -0.1 3deg / 1; + value: lch(1% 0 3deg); + space: lch; + channels: 1% 0 3deg / 1; } <===> ================================================================================ <===> unitless/hue/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 361deg)); <===> unitless/hue/above_range/output.css a { value: lch(1% 2 1deg); + space: lch; channels: 1% 2 1deg / 1; } <===> ================================================================================ <===> unitless/hue/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 -1deg)); <===> unitless/hue/below_range/output.css a { value: lch(1% 2 359deg); + space: lch; channels: 1% 2 359deg / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2% 3deg)); <===> percent/in_range/output.css a { value: lch(1% 3 3deg); + space: lch; channels: 1% 3 3deg / 1; } <===> ================================================================================ <===> percent/lightness/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(110% 2 3deg)); <===> percent/lightness/above_range/output.css a { value: lch(100% 2 3deg); + space: lch; channels: 100% 2 3deg / 1; } <===> ================================================================================ <===> percent/lightness/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(-1% 2 3deg)); <===> percent/lightness/below_range/output.css a { value: lch(0% 2 3deg); + space: lch; channels: 0% 2 3deg / 1; } <===> ================================================================================ <===> percent/chroma/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 101% 3deg)); <===> percent/chroma/above_range/output.css a { value: lch(1% 151.5 3deg); + space: lch; channels: 1% 151.5 3deg / 1; } <===> ================================================================================ <===> percent/chroma/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% -1% 3deg)); <===> percent/chroma/below_range/output.css a { - value: lch(1% -1.5 3deg); - channels: 1% -1.5 3deg / 1; + value: lch(1% 0 3deg); + space: lch; + channels: 1% 0 3deg / 1; } <===> ================================================================================ <===> none/lightness/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(none 2 3deg)); <===> none/lightness/output.css a { value: lch(none 2 3deg); + space: lch; channels: none 2 3deg / 1; } <===> ================================================================================ <===> none/chroma/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% none 3deg)); <===> none/chroma/output.css a { value: lch(1% none 3deg); + space: lch; channels: 1% none 3deg / 1; } <===> ================================================================================ <===> none/hue/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 none)); <===> none/hue/output.css a { value: lch(1% 2 none); + space: lch; channels: 1% 2 none / 1; } <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch($channels: 1% 2 3deg)); <===> named/output.css a { value: lch(1% 2 3deg); + space: lch; channels: 1% 2 3deg / 1; } diff --git a/spec/core_functions/color/lch/special_functions.hrx b/spec/core_functions/color/lch/special_functions.hrx index afcf9f8134..dc2ff487bf 100644 --- a/spec/core_functions/color/lch/special_functions.hrx +++ b/spec/core_functions/color/lch/special_functions.hrx @@ -1,5 +1,5 @@ <===> calculation/arg_1/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(calc(1px + 1%) 2 3deg)); <===> calculation/arg_1/output.css @@ -11,7 +11,7 @@ a { <===> ================================================================================ <===> calculation/arg_2/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% calc(1px + 1%) 3deg)); <===> calculation/arg_2/output.css @@ -23,7 +23,7 @@ a { <===> ================================================================================ <===> calculation/arg_3/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 calc(1px + 1%))); <===> calculation/arg_3/output.css @@ -35,7 +35,7 @@ a { <===> ================================================================================ <===> calculation/arg_4/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 3deg / calc(1px + 1%))); <===> calculation/arg_4/output.css @@ -47,7 +47,7 @@ a { <===> ================================================================================ <===> var/arg_1/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(var(--foo) 2 3deg)); <===> var/arg_1/output.css @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> var/arg_2/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% var(--foo) 3deg)); <===> var/arg_2/output.css @@ -71,7 +71,7 @@ a { <===> ================================================================================ <===> var/arg_3/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 var(--foo))); <===> var/arg_3/output.css @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> var/arg_4/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% 2 3deg / var(--foo))); <===> var/arg_4/output.css @@ -96,7 +96,7 @@ a { ================================================================================ <===> multi_argument_var/1_of_2/input.scss // var() is substituted before parsing, so it may contain multiple arguments. -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(var(--foo) 2deg)); <===> multi_argument_var/1_of_2/output.css @@ -108,7 +108,7 @@ a { <===> ================================================================================ <===> multi_argument_var/2_of_2/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(1% var(--foo))); <===> multi_argument_var/2_of_2/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/no_alpha/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(var(--foo))); <===> multi_argument_var/1_of_1/no_alpha/output.css @@ -132,7 +132,7 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/alpha/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(lch(var(--foo) / 0.4)); <===> multi_argument_var/1_of_1/alpha/output.css diff --git a/spec/core_functions/color/mix/error.hrx b/spec/core_functions/color/mix/error.hrx index 3dc0313d4a..cf5b481d4f 100644 --- a/spec/core_functions/color/mix/error.hrx +++ b/spec/core_functions/color/mix/error.hrx @@ -36,7 +36,7 @@ Error: Missing argument $color2. a {b: mix(lch(20% -20 0), red)} <===> null_method/non_legacy/color1/error -Error: $color1: To use color.mix() with non-legacy color lch(20% -20 0deg), you must provide a $method. +Error: $color1: To use color.mix() with non-legacy color lch(20% 0 0deg), you must provide a $method. , 1 | a {b: mix(lch(20% -20 0), red)} | ^^^^^^^^^^^^^^^^^^^^^^^^ @@ -49,7 +49,7 @@ Error: $color1: To use color.mix() with non-legacy color lch(20% -20 0deg), you a {b: mix(red, lch(20% -20 0))} <===> null_method/non_legacy/color2/error -Error: $color2: To use color.mix() with non-legacy color lch(20% -20 0deg), you must provide a $method. +Error: $color2: To use color.mix() with non-legacy color lch(20% 0 0deg), you must provide a $method. , 1 | a {b: mix(red, lch(20% -20 0))} | ^^^^^^^^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/mix/hue_interpolation.hrx b/spec/core_functions/color/mix/hue_interpolation.hrx index 052c47412e..df1c19a673 100644 --- a/spec/core_functions/color/mix/hue_interpolation.hrx +++ b/spec/core_functions/color/mix/hue_interpolation.hrx @@ -13,5 +13,5 @@ a {b: mix(red, green, 20%, lch increasing hue)} <===> increasing/weighted/output.css a { - b: rgb(75.3627215695, 127.0940173535, -38.3383580918); + b: hsl(78.7622147036, 186.3907911016%, 17.4030704435%); } diff --git a/spec/core_functions/color/mix/mixed_spaces.hrx b/spec/core_functions/color/mix/mixed_spaces.hrx index 9c321d2be5..e26fa61dc1 100644 --- a/spec/core_functions/color/mix/mixed_spaces.hrx +++ b/spec/core_functions/color/mix/mixed_spaces.hrx @@ -3,5 +3,5 @@ a {b: mix(hsl(0 100% 50%), green, $method: lch)} <===> output.css a { - b: hsl(49.4586711601, 100%, 27.8089044382%); + b: hsl(50.9351301875, 199.2813015981%, 19.0269267557%); } diff --git a/spec/core_functions/color/mix/predefined.hrx b/spec/core_functions/color/mix/predefined.hrx index 1f0de2ddad..504ea9ba73 100644 --- a/spec/core_functions/color/mix/predefined.hrx +++ b/spec/core_functions/color/mix/predefined.hrx @@ -13,7 +13,7 @@ a {b: mix(color(display-p3 1 0 0), color(display-p3 0 1 0), 60%, $method: hsl)} <===> rgb_explicit_method/output.css a { - b: color(display-p3 0.9849707148 0.9141322646 0.3079881122); + b: color(display-p3 1.0849635599 0.8595336595 -0.252822726); } <===> @@ -33,5 +33,5 @@ a {b: mix(color(xyz-d50 0.15 0.24 0), color(xyz-d65 1 .2 0), $method: hwb)} <===> xyz_explicit_method/output.css a { - b: color(xyz-d50 0.3464867621 0.2923393699 0.0410088495); + b: color(xyz-d50 0.5250037958 0.2975068714 -0.1396614468); } diff --git a/spec/core_functions/color/oklab/_utils.scss b/spec/core_functions/color/oklab/_utils.scss deleted file mode 100644 index 106fe41df4..0000000000 --- a/spec/core_functions/color/oklab/_utils.scss +++ /dev/null @@ -1,27 +0,0 @@ -@use 'sass:color'; -@use 'sass:list'; -@use 'sass:meta'; - -@function -real-channel($color, $channel) { - @if color.is-missing($color, $channel) { - @return none; - } @else { - @return color.channel($color, $channel); - } -} - -@mixin inspect($color) { - a { - value: $color; - @if meta.type-of($color) == string { - type: string; - } @else { - channels: list.slash( - -real-channel($color, 'lightness') - -real-channel($color, 'a') - -real-channel($color, 'b'), - -real-channel($color, 'alpha') - ); - } - } -} diff --git a/spec/core_functions/color/oklab/alpha.hrx b/spec/core_functions/color/oklab/alpha.hrx index 6ff6a62873..ee7f24dac2 100644 --- a/spec/core_functions/color/oklab/alpha.hrx +++ b/spec/core_functions/color/oklab/alpha.hrx @@ -1,58 +1,63 @@ <===> transparent/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(0 255 127 / 0)); <===> transparent/output.css a { value: oklab(0% 255 127 / 0); + space: oklab; channels: 0% 255 127 / 0; } <===> ================================================================================ <===> opaque/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 3 / 1)); <===> opaque/output.css a { value: oklab(1% 2 3); + space: oklab; channels: 1% 2 3 / 1; } <===> ================================================================================ <===> partial/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 3 / 0.4)); <===> partial/output.css a { value: oklab(1% 2 3 / 0.4); + space: oklab; channels: 1% 2 3 / 0.4; } <===> ================================================================================ <===> percent/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 3 / 40%)); <===> percent/output.css a { value: oklab(1% 2 3 / 0.4); + space: oklab; channels: 1% 2 3 / 0.4; } <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab($channels: 1% 2 3 / 0.4)); <===> named/output.css a { value: oklab(1% 2 3 / 0.4); + space: oklab; channels: 1% 2 3 / 0.4; } @@ -60,36 +65,39 @@ a { ================================================================================ <===> slash_list/input.scss @use "sass:list"; -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(list.slash(1% 2 3, 0.4))); <===> slash_list/output.css a { value: oklab(1% 2 3 / 0.4); + space: oklab; channels: 1% 2 3 / 0.4; } <===> ================================================================================ <===> none/slash/b/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 none / 0.4)); <===> none/slash/b/output.css a { value: oklab(1% 2 none / 0.4); + space: oklab; channels: 1% 2 none / 0.4; } <===> ================================================================================ <===> none/slash/alpha/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 3 / none)); <===> none/slash/alpha/output.css a { value: oklab(1% 2 3 / none); + space: oklab; channels: 1% 2 3 / none; } @@ -97,12 +105,13 @@ a { ================================================================================ <===> none/slash_list/b/input.scss @use 'sass:list'; -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(list.slash(1% 2 none, 0.4))); <===> none/slash_list/b/output.css a { value: oklab(1% 2 none / 0.4); + space: oklab; channels: 1% 2 none / 0.4; } @@ -110,19 +119,20 @@ a { ================================================================================ <===> none/slash_list/alpha/input.scss @use 'sass:list'; -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(list.slash(1% 2 3, none))); <===> none/slash_list/alpha/output.css a { value: oklab(1% 2 3 / none); + space: oklab; channels: 1% 2 3 / none; } <===> ================================================================================ <===> relative_color/slash/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(from #aaa l a b / 25%)); <===> relative_color/slash/output.css @@ -135,7 +145,7 @@ a { ================================================================================ <===> relative_color/slash_list/input.scss @use 'sass:list'; -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(list.slash(from #aaa l a b, 25%))); <===> relative_color/slash_list/output.css diff --git a/spec/core_functions/color/oklab/no_alpha.hrx b/spec/core_functions/color/oklab/no_alpha.hrx index ffd32248db..21698a935a 100644 --- a/spec/core_functions/color/oklab/no_alpha.hrx +++ b/spec/core_functions/color/oklab/no_alpha.hrx @@ -1,185 +1,200 @@ <===> unitless/ab/in_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 -3)); <===> unitless/ab/in_range/output.css a { value: oklab(1% 2 -3); + space: oklab; channels: 1% 2 -3 / 1; } <===> ================================================================================ <===> unitless/ab/above_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 126 300)); <===> unitless/ab/above_range/output.css a { value: oklab(1% 126 300); + space: oklab; channels: 1% 126 300 / 1; } <===> ================================================================================ <===> unitless/ab/below_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% -126 -300)); <===> unitless/ab/below_range/output.css a { value: oklab(1% -126 -300); + space: oklab; channels: 1% -126 -300 / 1; } <===> ================================================================================ <===> unitless/lightness/in_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(0.1 2 -3)); <===> unitless/lightness/in_range/output.css a { value: oklab(10% 2 -3); + space: oklab; channels: 10% 2 -3 / 1; } <===> ================================================================================ <===> unitless/lightness/above_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1.1 2 3)); <===> unitless/lightness/above_range/output.css a { value: oklab(100% 2 3); + space: oklab; channels: 100% 2 3 / 1; } <===> ================================================================================ <===> unitless/lightness/below_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(-0.1 2 3)); <===> unitless/lightness/below_range/output.css a { value: oklab(0% 2 3); + space: oklab; channels: 0% 2 3 / 1; } <===> ================================================================================ <===> percent/ab/in_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2% -3%)); <===> percent/ab/in_range/output.css a { value: oklab(1% 0.008 -0.012); + space: oklab; channels: 1% 0.008 -0.012 / 1; } <===> ================================================================================ <===> percent/ab/above_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 101% 150%)); <===> percent/ab/above_range/output.css a { value: oklab(1% 0.404 0.6); + space: oklab; channels: 1% 0.404 0.6 / 1; } <===> ================================================================================ <===> percent/ab/below_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% -101% -150%)); <===> percent/ab/below_range/output.css a { value: oklab(1% -0.404 -0.6); + space: oklab; channels: 1% -0.404 -0.6 / 1; } <===> ================================================================================ <===> percent/lightness/in_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2% -3%)); <===> percent/lightness/in_range/output.css a { value: oklab(1% 0.008 -0.012); + space: oklab; channels: 1% 0.008 -0.012 / 1; } <===> ================================================================================ <===> percent/lightness/above_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(110% 2 3)); <===> percent/lightness/above_range/output.css a { value: oklab(100% 2 3); + space: oklab; channels: 100% 2 3 / 1; } <===> ================================================================================ <===> percent/lightness/below_range/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(-1% 2 3)); <===> percent/lightness/below_range/output.css a { value: oklab(0% 2 3); + space: oklab; channels: 0% 2 3 / 1; } <===> ================================================================================ <===> none/lightness/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(none 2 3)); <===> none/lightness/output.css a { value: oklab(none 2 3); + space: oklab; channels: none 2 3 / 1; } <===> ================================================================================ <===> none/a/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% none 3)); <===> none/a/output.css a { value: oklab(1% none 3); + space: oklab; channels: 1% none 3 / 1; } <===> ================================================================================ <===> none/b/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 none)); <===> none/b/output.css a { value: oklab(1% 2 none); + space: oklab; channels: 1% 2 none / 1; } <===> ================================================================================ <===> relative_color/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(from #aaa l a b)); <===> relative_color/output.css @@ -191,11 +206,12 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab($channels: 1% 2 3)); <===> named/output.css a { value: oklab(1% 2 3); + space: oklab; channels: 1% 2 3 / 1; } diff --git a/spec/core_functions/color/oklab/special_functions.hrx b/spec/core_functions/color/oklab/special_functions.hrx index 089f5057ff..16f4e4ebe9 100644 --- a/spec/core_functions/color/oklab/special_functions.hrx +++ b/spec/core_functions/color/oklab/special_functions.hrx @@ -1,5 +1,5 @@ <===> calculation/arg_1/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(calc(1px + 1%) 2 3)); <===> calculation/arg_1/output.css @@ -11,7 +11,7 @@ a { <===> ================================================================================ <===> calculation/arg_2/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% calc(1px + 1%) 3)); <===> calculation/arg_2/output.css @@ -23,7 +23,7 @@ a { <===> ================================================================================ <===> calculation/arg_3/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 calc(1px + 1%))); <===> calculation/arg_3/output.css @@ -35,7 +35,7 @@ a { <===> ================================================================================ <===> calculation/arg_4/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 3 / calc(1px + 1%))); <===> calculation/arg_4/output.css @@ -47,7 +47,7 @@ a { <===> ================================================================================ <===> var/arg_1/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(var(--foo) 2 3)); <===> var/arg_1/output.css @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> var/arg_2/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% var(--foo) 3)); <===> var/arg_2/output.css @@ -71,7 +71,7 @@ a { <===> ================================================================================ <===> var/arg_3/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 var(--foo))); <===> var/arg_3/output.css @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> var/arg_4/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% 2 3 / var(--foo))); <===> var/arg_4/output.css @@ -96,7 +96,7 @@ a { ================================================================================ <===> multi_argument_var/1_of_2/input.scss // var() is substituted before parsing, so it may contain multiple arguments. -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(var(--foo) 2)); <===> multi_argument_var/1_of_2/output.css @@ -108,7 +108,7 @@ a { <===> ================================================================================ <===> multi_argument_var/2_of_2/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(1% var(--foo))); <===> multi_argument_var/2_of_2/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/no_alpha/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(var(--foo))); <===> multi_argument_var/1_of_1/no_alpha/output.css @@ -132,7 +132,7 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/alpha/input.scss -@use 'core_functions/color/oklab/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklab(var(--foo) / 0.4)); <===> multi_argument_var/1_of_1/alpha/output.css diff --git a/spec/core_functions/color/oklch/_utils.scss b/spec/core_functions/color/oklch/_utils.scss deleted file mode 100644 index 508c32e306..0000000000 --- a/spec/core_functions/color/oklch/_utils.scss +++ /dev/null @@ -1,27 +0,0 @@ -@use 'sass:color'; -@use 'sass:list'; -@use 'sass:meta'; - -@function -real-channel($color, $channel) { - @if color.is-missing($color, $channel) { - @return none; - } @else { - @return color.channel($color, $channel); - } -} - -@mixin inspect($color) { - a { - value: $color; - @if meta.type-of($color) == string { - type: string; - } @else { - channels: list.slash( - -real-channel($color, 'lightness') - -real-channel($color, 'chroma') - -real-channel($color, 'hue'), - -real-channel($color, 'alpha') - ); - } - } -} diff --git a/spec/core_functions/color/oklch/alpha.hrx b/spec/core_functions/color/oklch/alpha.hrx index acb10b5a46..8ac85be2fa 100644 --- a/spec/core_functions/color/oklch/alpha.hrx +++ b/spec/core_functions/color/oklch/alpha.hrx @@ -1,58 +1,63 @@ <===> transparent/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 3deg / 0)); <===> transparent/output.css a { value: oklch(1% 0.2 3deg / 0); + space: oklch; channels: 1% 0.2 3deg / 0; } <===> ================================================================================ <===> opaque/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 3deg / 1)); <===> opaque/output.css a { value: oklch(1% 0.2 3deg); + space: oklch; channels: 1% 0.2 3deg / 1; } <===> ================================================================================ <===> partial/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 3deg / 0.4)); <===> partial/output.css a { value: oklch(1% 0.2 3deg / 0.4); + space: oklch; channels: 1% 0.2 3deg / 0.4; } <===> ================================================================================ <===> percent/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 3deg / 40%)); <===> percent/output.css a { value: oklch(1% 0.2 3deg / 0.4); + space: oklch; channels: 1% 0.2 3deg / 0.4; } <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch($channels: 1% 0.2 3deg / 0.4)); <===> named/output.css a { value: oklch(1% 0.2 3deg / 0.4); + space: oklch; channels: 1% 0.2 3deg / 0.4; } @@ -60,36 +65,39 @@ a { ================================================================================ <===> slash_list/input.scss @use "sass:list"; -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(list.slash(1% 0.2 3deg, 0.4))); <===> slash_list/output.css a { value: oklch(1% 0.2 3deg / 0.4); + space: oklch; channels: 1% 0.2 3deg / 0.4; } <===> ================================================================================ <===> none/slash/hue/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 none / 0.4)); <===> none/slash/hue/output.css a { value: oklch(1% 0.2 none / 0.4); + space: oklch; channels: 1% 0.2 none / 0.4; } <===> ================================================================================ <===> none/slash/alpha/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 3deg / none)); <===> none/slash/alpha/output.css a { value: oklch(1% 0.2 3deg / none); + space: oklch; channels: 1% 0.2 3deg / none; } @@ -97,12 +105,13 @@ a { ================================================================================ <===> none/slash_list/hue/input.scss @use 'sass:list'; -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(list.slash(1% 0.2 none, 0.4))); <===> none/slash_list/hue/output.css a { value: oklch(1% 0.2 none / 0.4); + space: oklch; channels: 1% 0.2 none / 0.4; } @@ -110,11 +119,12 @@ a { ================================================================================ <===> none/slash_list/alpha/input.scss @use 'sass:list'; -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(list.slash(1% 0.2 3deg, none))); <===> none/slash_list/alpha/output.css a { value: oklch(1% 0.2 3deg / none); + space: oklch; channels: 1% 0.2 3deg / none; } diff --git a/spec/core_functions/color/oklch/no_alpha.hrx b/spec/core_functions/color/oklch/no_alpha.hrx index 9b24e8e781..2c8c27848a 100644 --- a/spec/core_functions/color/oklch/no_alpha.hrx +++ b/spec/core_functions/color/oklch/no_alpha.hrx @@ -1,189 +1,205 @@ <===> unitless/in_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(0.1 0.2 3deg)); <===> unitless/in_range/output.css a { value: oklch(10% 0.2 3deg); + space: oklch; channels: 10% 0.2 3deg / 1; } <===> ================================================================================ <===> unitless/lightness/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1.1 0.2 3deg)); <===> unitless/lightness/above_range/output.css a { value: oklch(100% 0.2 3deg); + space: oklch; channels: 100% 0.2 3deg / 1; } <===> ================================================================================ <===> unitless/lightness/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(-0.1 0.2 3deg)); <===> unitless/lightness/below_range/output.css a { value: oklch(0% 0.2 3deg); + space: oklch; channels: 0% 0.2 3deg / 1; } <===> ================================================================================ <===> unitless/chroma/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.5 3deg)); <===> unitless/chroma/above_range/output.css a { value: oklch(1% 0.5 3deg); + space: oklch; channels: 1% 0.5 3deg / 1; } <===> ================================================================================ <===> unitless/chroma/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% -0.1 3deg)); <===> unitless/chroma/below_range/output.css a { - value: oklch(1% -0.1 3deg); - channels: 1% -0.1 3deg / 1; + value: oklch(1% 0 3deg); + space: oklch; + channels: 1% 0 3deg / 1; } <===> ================================================================================ <===> unitless/hue/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 361deg)); <===> unitless/hue/above_range/output.css a { value: oklch(1% 0.2 1deg); + space: oklch; channels: 1% 0.2 1deg / 1; } <===> ================================================================================ <===> unitless/hue/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 -1deg)); <===> unitless/hue/below_range/output.css a { value: oklch(1% 0.2 359deg); + space: oklch; channels: 1% 0.2 359deg / 1; } <===> ================================================================================ <===> percent/in_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 2% 3deg)); <===> percent/in_range/output.css a { value: oklch(1% 0.008 3deg); + space: oklch; channels: 1% 0.008 3deg / 1; } <===> ================================================================================ <===> percent/lightness/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(110% 0.2 3deg)); <===> percent/lightness/above_range/output.css a { value: oklch(100% 0.2 3deg); + space: oklch; channels: 100% 0.2 3deg / 1; } <===> ================================================================================ <===> percent/lightness/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(-1% 0.2 3deg)); <===> percent/lightness/below_range/output.css a { value: oklch(0% 0.2 3deg); + space: oklch; channels: 0% 0.2 3deg / 1; } <===> ================================================================================ <===> percent/chroma/above_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 101% 3deg)); <===> percent/chroma/above_range/output.css a { value: oklch(1% 0.404 3deg); + space: oklch; channels: 1% 0.404 3deg / 1; } <===> ================================================================================ <===> percent/chroma/below_range/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% -1% 3deg)); <===> percent/chroma/below_range/output.css a { - value: oklch(1% -0.004 3deg); - channels: 1% -0.004 3deg / 1; + value: oklch(1% 0 3deg); + space: oklch; + channels: 1% 0 3deg / 1; } <===> ================================================================================ <===> none/lightness/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(none 0.2 3deg)); <===> none/lightness/output.css a { value: oklch(none 0.2 3deg); + space: oklch; channels: none 0.2 3deg / 1; } <===> ================================================================================ <===> none/chroma/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% none 3deg)); <===> none/chroma/output.css a { value: oklch(1% none 3deg); + space: oklch; channels: 1% none 3deg / 1; } <===> ================================================================================ <===> none/hue/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 none)); <===> none/hue/output.css a { value: oklch(1% 0.2 none); + space: oklch; channels: 1% 0.2 none / 1; } <===> ================================================================================ <===> named/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch($channels: 1% 0.2 3deg)); <===> named/output.css a { value: oklch(1% 0.2 3deg); + space: oklch; channels: 1% 0.2 3deg / 1; } diff --git a/spec/core_functions/color/oklch/special_functions.hrx b/spec/core_functions/color/oklch/special_functions.hrx index 8955526c40..60100e9e30 100644 --- a/spec/core_functions/color/oklch/special_functions.hrx +++ b/spec/core_functions/color/oklch/special_functions.hrx @@ -1,5 +1,5 @@ <===> calculation/arg_1/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(calc(1px + 1%) 0.2 3deg)); <===> calculation/arg_1/output.css @@ -11,7 +11,7 @@ a { <===> ================================================================================ <===> calculation/arg_2/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% calc(1px + 1%) 3deg)); <===> calculation/arg_2/output.css @@ -23,7 +23,7 @@ a { <===> ================================================================================ <===> calculation/arg_3/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 calc(1px + 1%))); <===> calculation/arg_3/output.css @@ -35,7 +35,7 @@ a { <===> ================================================================================ <===> calculation/arg_4/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 3deg / calc(1px + 1%))); <===> calculation/arg_4/output.css @@ -47,7 +47,7 @@ a { <===> ================================================================================ <===> var/arg_1/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(var(--foo) 0.2 3deg)); <===> var/arg_1/output.css @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> var/arg_2/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% var(--foo) 3deg)); <===> var/arg_2/output.css @@ -71,7 +71,7 @@ a { <===> ================================================================================ <===> var/arg_3/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 var(--foo))); <===> var/arg_3/output.css @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> var/arg_4/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% 0.2 3deg / var(--foo))); <===> var/arg_4/output.css @@ -96,7 +96,7 @@ a { ================================================================================ <===> multi_argument_var/1_of_2/input.scss // var() is substituted before parsing, so it may contain multiple arguments. -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(var(--foo) 2deg)); <===> multi_argument_var/1_of_2/output.css @@ -108,7 +108,7 @@ a { <===> ================================================================================ <===> multi_argument_var/2_of_2/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(1% var(--foo))); <===> multi_argument_var/2_of_2/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/no_alpha/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(var(--foo))); <===> multi_argument_var/1_of_1/no_alpha/output.css @@ -132,7 +132,7 @@ a { <===> ================================================================================ <===> multi_argument_var/1_of_1/alpha/input.scss -@use 'core_functions/color/lch/utils'; +@use 'core_functions/color/utils'; @include utils.inspect(oklch(var(--foo) / 0.4)); <===> multi_argument_var/1_of_1/alpha/output.css diff --git a/spec/libsass/color-functions/rgb/rgb/b.hrx b/spec/libsass/color-functions/rgb/rgb/b.hrx index 0195a80e50..04fc42ebea 100644 --- a/spec/libsass/color-functions/rgb/rgb/b.hrx +++ b/spec/libsass/color-functions/rgb/rgb/b.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, 0, -1); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 0, 1); c2: rgb(0, 0, 2); @@ -625,11 +625,11 @@ foo { c253: rgb(0, 0, 253); c254: rgb(0, 0, 254); c255: rgb(0, 0, 255); - c256: rgb(0, 0, 256); + c256: rgb(0, 0, 255); } foo { - c-1: rgb(0, 0, -2.55); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 0, 2.55); c2: rgb(0, 0, 5.1); @@ -731,5 +731,5 @@ foo { c98: rgb(0, 0, 249.9); c99: rgb(0, 0, 252.45); c100: rgb(0, 0, 255); - c101: rgb(0, 0, 257.55); + c101: rgb(0, 0, 255); } diff --git a/spec/libsass/color-functions/rgb/rgb/g.hrx b/spec/libsass/color-functions/rgb/rgb/g.hrx index d8ec64afde..c9326912fd 100644 --- a/spec/libsass/color-functions/rgb/rgb/g.hrx +++ b/spec/libsass/color-functions/rgb/rgb/g.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, -1, 0); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 1, 0); c2: rgb(0, 2, 0); @@ -625,11 +625,11 @@ foo { c253: rgb(0, 253, 0); c254: rgb(0, 254, 0); c255: rgb(0, 255, 0); - c256: rgb(0, 256, 0); + c256: rgb(0, 255, 0); } foo { - c-1: rgb(0, -2.55, 0); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 2.55, 0); c2: rgb(0, 5.1, 0); @@ -731,5 +731,5 @@ foo { c98: rgb(0, 249.9, 0); c99: rgb(0, 252.45, 0); c100: rgb(0, 255, 0); - c101: rgb(0, 257.55, 0); + c101: rgb(0, 255, 0); } diff --git a/spec/libsass/color-functions/rgb/rgb/r.hrx b/spec/libsass/color-functions/rgb/rgb/r.hrx index f01d48830d..2f28b4a412 100644 --- a/spec/libsass/color-functions/rgb/rgb/r.hrx +++ b/spec/libsass/color-functions/rgb/rgb/r.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, -1, 0); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 1, 0); c2: rgb(0, 2, 0); @@ -625,11 +625,11 @@ foo { c253: rgb(0, 253, 0); c254: rgb(0, 254, 0); c255: rgb(0, 255, 0); - c256: rgb(0, 256, 0); + c256: rgb(0, 255, 0); } foo { - c-1: rgb(-2.55, 0, 0); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(2.55, 0, 0); c2: rgb(5.1, 0, 0); @@ -731,5 +731,5 @@ foo { c98: rgb(249.9, 0, 0); c99: rgb(252.45, 0, 0); c100: rgb(255, 0, 0); - c101: rgb(257.55, 0, 0); + c101: rgb(255, 0, 0); } diff --git a/spec/libsass/color-functions/rgb/rgba/b.hrx b/spec/libsass/color-functions/rgb/rgba/b.hrx index 70a2db62f9..2e4508a808 100644 --- a/spec/libsass/color-functions/rgb/rgba/b.hrx +++ b/spec/libsass/color-functions/rgb/rgba/b.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, 0, -1); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 0, 1); c2: rgb(0, 0, 2); @@ -625,11 +625,11 @@ foo { c253: rgb(0, 0, 253); c254: rgb(0, 0, 254); c255: rgb(0, 0, 255); - c256: rgb(0, 0, 256); + c256: rgb(0, 0, 255); } foo { - c-1: rgb(0, 0, -2.55); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 0, 2.55); c2: rgb(0, 0, 5.1); @@ -731,5 +731,5 @@ foo { c98: rgb(0, 0, 249.9); c99: rgb(0, 0, 252.45); c100: rgb(0, 0, 255); - c101: rgb(0, 0, 257.55); + c101: rgb(0, 0, 255); } diff --git a/spec/libsass/color-functions/rgb/rgba/g.hrx b/spec/libsass/color-functions/rgb/rgba/g.hrx index e0273defd4..2036c80914 100644 --- a/spec/libsass/color-functions/rgb/rgba/g.hrx +++ b/spec/libsass/color-functions/rgb/rgba/g.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, -1, 0); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 1, 0); c2: rgb(0, 2, 0); @@ -625,11 +625,11 @@ foo { c253: rgb(0, 253, 0); c254: rgb(0, 254, 0); c255: rgb(0, 255, 0); - c256: rgb(0, 256, 0); + c256: rgb(0, 255, 0); } foo { - c-1: rgb(0, -2.55, 0); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 2.55, 0); c2: rgb(0, 5.1, 0); @@ -731,5 +731,5 @@ foo { c98: rgb(0, 249.9, 0); c99: rgb(0, 252.45, 0); c100: rgb(0, 255, 0); - c101: rgb(0, 257.55, 0); + c101: rgb(0, 255, 0); } diff --git a/spec/libsass/color-functions/rgb/rgba/r.hrx b/spec/libsass/color-functions/rgb/rgba/r.hrx index 1655f8d08d..305608c65d 100644 --- a/spec/libsass/color-functions/rgb/rgba/r.hrx +++ b/spec/libsass/color-functions/rgb/rgba/r.hrx @@ -368,7 +368,7 @@ foo { <===> output.css foo { - c-1: rgb(0, -1, 0); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(0, 1, 0); c2: rgb(0, 2, 0); @@ -625,11 +625,11 @@ foo { c253: rgb(0, 253, 0); c254: rgb(0, 254, 0); c255: rgb(0, 255, 0); - c256: rgb(0, 256, 0); + c256: rgb(0, 255, 0); } foo { - c-1: rgb(-2.55, 0, 0); + c-1: rgb(0, 0, 0); c0: rgb(0, 0, 0); c1: rgb(2.55, 0, 0); c2: rgb(5.1, 0, 0); @@ -731,5 +731,5 @@ foo { c98: rgb(249.9, 0, 0); c99: rgb(252.45, 0, 0); c100: rgb(255, 0, 0); - c101: rgb(257.55, 0, 0); + c101: rgb(255, 0, 0); } diff --git a/spec/non_conformant/colors/basic.hrx b/spec/non_conformant/colors/basic.hrx index 79abb2d833..8d0d96a389 100644 --- a/spec/non_conformant/colors/basic.hrx +++ b/spec/non_conformant/colors/basic.hrx @@ -14,5 +14,5 @@ p { color: red green blue; color: redhux; color: redgreen; - foo: rgb(200, 382.5, 433.5); + foo: rgb(200, 255, 255); } From 088d34c3718b36c5bda42a788540f471a47ddb7a Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Thu, 11 Apr 2024 16:27:25 -0700 Subject: [PATCH 24/45] Add new deprecations --- js-api-spec/deprecations.test.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/js-api-spec/deprecations.test.ts b/js-api-spec/deprecations.test.ts index 0ed89478a4..fd343122a8 100644 --- a/js-api-spec/deprecations.test.ts +++ b/js-api-spec/deprecations.test.ts @@ -38,6 +38,8 @@ const activeDeprecations: {[key in keyof Deprecations]?: string} = { 'null-alpha': '1.62.3', 'abs-percent': '1.65.0', 'fs-importer-cwd': '1.73.0', + 'color-4-api': '1.76.0', + 'color-functions': '1.76.0', }; /** From c895d27b4e9df69832d4f8ede9c14187d48825d1 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 12 Apr 2024 16:17:55 -0700 Subject: [PATCH 25/45] Add better tests for the bounds of legacy color space constructors (#1968) --- .../color/hsl/three_args/bounds.hrx | 54 +++++ .../color/hsl/three_args/clamped.hrx | 32 --- .../color/hwb/three_args/bounds.hrx | 221 ++++++++++++++++++ .../color/rgb/one_arg/alpha.hrx | 123 ++++++---- 4 files changed, 358 insertions(+), 72 deletions(-) create mode 100644 spec/core_functions/color/hsl/three_args/bounds.hrx delete mode 100644 spec/core_functions/color/hsl/three_args/clamped.hrx create mode 100644 spec/core_functions/color/hwb/three_args/bounds.hrx diff --git a/spec/core_functions/color/hsl/three_args/bounds.hrx b/spec/core_functions/color/hsl/three_args/bounds.hrx new file mode 100644 index 0000000000..7ea7a9ba3e --- /dev/null +++ b/spec/core_functions/color/hsl/three_args/bounds.hrx @@ -0,0 +1,54 @@ +<===> README.md +The W3C tests cover out-of-bounds hue, but not saturation or lightness. + +<===> +================================================================================ +<===> saturation/above/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(hsl(0, 200%, 50%)); + +<===> saturation/above/output.css +a { + value: hsl(0, 200%, 50%); + space: hsl; + channels: 0deg 200% 50% / 1; +} + +<===> +================================================================================ +<===> saturation/below/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(hsl(0, -100%, 50%)); + +<===> saturation/below/output.css +a { + value: hsl(0, 0%, 50%); + space: hsl; + channels: 0deg 0% 50% / 1; +} + +<===> +================================================================================ +<===> lightness/above/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(hsl(0, 100%, 500%)); + +<===> lightness/above/output.css +a { + value: hsl(0, 100%, 500%); + space: hsl; + channels: 0deg 100% 500% / 1; +} + +<===> +================================================================================ +<===> lightness/below/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(hsl(0, 100%, -100%)); + +<===> lightness/below/output.css +a { + value: hsl(0, 100%, -100%); + space: hsl; + channels: 0deg 100% -100% / 1; +} diff --git a/spec/core_functions/color/hsl/three_args/clamped.hrx b/spec/core_functions/color/hsl/three_args/clamped.hrx deleted file mode 100644 index 308a32fbb7..0000000000 --- a/spec/core_functions/color/hsl/three_args/clamped.hrx +++ /dev/null @@ -1,32 +0,0 @@ -<===> README.md -The W3C tests cover clamped hue, but not clamped saturation or lightness. - -<===> -================================================================================ -<===> saturation/below/input.scss -a {b: hsl(0, -100%, 50%)} - -<===> saturation/below/output.css -a { - b: hsl(0, 0%, 50%); -} - -<===> -================================================================================ -<===> lightness/above/input.scss -a {b: hsl(0, 100%, 500%)} - -<===> lightness/above/output.css -a { - b: hsl(0, 100%, 500%); -} - -<===> -================================================================================ -<===> lightness/below/input.scss -a {b: hsl(0, 100%, -100%)} - -<===> lightness/below/output.css -a { - b: hsl(0, 100%, -100%); -} diff --git a/spec/core_functions/color/hwb/three_args/bounds.hrx b/spec/core_functions/color/hwb/three_args/bounds.hrx new file mode 100644 index 0000000000..05e6750290 --- /dev/null +++ b/spec/core_functions/color/hwb/three_args/bounds.hrx @@ -0,0 +1,221 @@ +<===> whiteness/above/blackness/zero/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 150%, 0%)); + +<===> whiteness/above/blackness/zero/output.css +a { + value: white; + space: hwb; + channels: 0deg 100% 0% / 1; +} + +<===> +================================================================================ +<===> whiteness/above/blackness/mid/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 150%, 10%)); + +<===> whiteness/above/blackness/mid/output.css +a { + value: hsl(0, 0%, 93.75%); + space: hwb; + channels: 0deg 93.75% 6.25% / 1; +} + +<===> +================================================================================ +<===> whiteness/above/blackness/above/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 150%, 120%)); + +<===> whiteness/above/blackness/above/output.css +a { + value: hsl(0, 0%, 55.5555555556%); + space: hwb; + channels: 0deg 55.5555555556% 44.4444444444% / 1; +} + +<===> +================================================================================ +<===> whiteness/above/blackness/below/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 150%, -20%)); + +<===> whiteness/above/blackness/below/output.css +a { + value: hsl(0, 0%, 115.3846153846%); + space: hwb; + channels: 0deg 115.3846153846% -15.3846153846% / 1; +} + +<===> +================================================================================ +<===> whiteness/below/blackness/zero/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, -50%, 0%)); + +<===> whiteness/below/blackness/zero/output.css +a { + value: hsl(0, 300%, 25%); + space: hwb; + channels: 0deg -50% 0% / 1; +} + +<===> +================================================================================ +<===> whiteness/below/blackness/mid/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, -50%, 10%)); + +<===> whiteness/below/blackness/mid/output.css +a { + value: hsl(0, 350%, 20%); + space: hwb; + channels: 0deg -50% 10% / 1; +} + +<===> +================================================================================ +<===> whiteness/below/blackness/above/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, -50%, 120%)); + +<===> whiteness/below/blackness/above/output.css +a { + value: hsl(180, 42.8571428571%, -35%); + space: hwb; + channels: 0deg -50% 120% / 1; +} + +<===> +================================================================================ +<===> whiteness/below/blackness/below/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, -50%, -20%)); + +<===> whiteness/below/blackness/below/output.css +a { + value: hsl(0, 242.8571428571%, 35%); + space: hwb; + channels: 0deg -50% -20% / 1; +} + +<===> +================================================================================ +<===> blackness/above/whiteness/zero/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 0%, 150%)); + +<===> blackness/above/whiteness/zero/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> blackness/above/whiteness/mid/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 10%, 150%)); + +<===> blackness/above/whiteness/mid/output.css +a { + value: hsl(0, 0%, 6.25%); + space: hwb; + channels: 0deg 6.25% 93.75% / 1; +} + +<===> +================================================================================ +<===> blackness/above/whiteness/above/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 120%, 150%)); + +<===> blackness/above/whiteness/above/output.css +a { + value: hsl(0, 0%, 44.4444444444%); + space: hwb; + channels: 0deg 44.4444444444% 55.5555555556% / 1; +} + +<===> +================================================================================ +<===> blackness/above/whiteness/below/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, -20%, 150%)); + +<===> blackness/above/whiteness/below/output.css +a { + value: hsl(0, 0%, -15.3846153846%); + space: hwb; + channels: 0deg -15.3846153846% 115.3846153846% / 1; +} + +<===> +================================================================================ +<===> blackness/below/whiteness/zero/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 0%, -50%)); + +<===> blackness/below/whiteness/zero/output.css +a { + value: hsl(0, 300%, 75%); + space: hwb; + channels: 0deg 0% -50% / 1; +} + +<===> +================================================================================ +<===> blackness/below/whiteness/mid/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 10%, -50%)); + +<===> blackness/below/whiteness/mid/output.css +a { + value: hsl(0, 350%, 80%); + space: hwb; + channels: 0deg 10% -50% / 1; +} + +<===> +================================================================================ +<===> blackness/below/whiteness/above/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, 120%, -50%)); + +<===> blackness/below/whiteness/above/output.css +a { + value: hsl(180, 42.8571428571%, 135%); + space: hwb; + channels: 0deg 120% -50% / 1; +} + +<===> +================================================================================ +<===> blackness/below/whiteness/below/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.hwb(0, -20%, -50%)); + +<===> blackness/below/whiteness/below/output.css +a { + value: hsl(0, 242.8571428571%, 65%); + space: hwb; + channels: 0deg -20% -50% / 1; +} diff --git a/spec/core_functions/color/rgb/one_arg/alpha.hrx b/spec/core_functions/color/rgb/one_arg/alpha.hrx index 0efd910ad7..77d0e1875d 100644 --- a/spec/core_functions/color/rgb/one_arg/alpha.hrx +++ b/spec/core_functions/color/rgb/one_arg/alpha.hrx @@ -59,89 +59,132 @@ a { <===> ================================================================================ -<===> clamped/README.md -Channels that are out of bounds are clamped within bounds. +<===> bounds/red/above/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(256 0 0)); + +<===> bounds/red/above/output.css +a { + value: rgb(255, 0, 0); + space: rgb; + channels: 255 0 0 / 1; +} <===> ================================================================================ -<===> clamped/red/options.yml -:todo: - - dart-sass - -<===> clamped/red/input.scss -a {b: rgb(256 0 0 / 0.5)} +<===> bounds/red/below/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(-1 0 0)); -<===> clamped/red/output.css +<===> bounds/red/below/output.css a { - b: rgba(255, 0, 0, 0.5); + value: rgb(0, 0, 0); + space: rgb; + channels: 0 0 0 / 1; } <===> ================================================================================ -<===> clamped/green/options.yml -:todo: - - dart-sass +<===> bounds/green/above/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(0 500 0)); + +<===> bounds/green/above/output.css +a { + value: rgb(0, 255, 0); + space: rgb; + channels: 0 255 0 / 1; +} -<===> clamped/green/input.scss -a {b: rgb(0 -1 0 / 0.5)} +<===> +================================================================================ +<===> bounds/green/below/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(0 -100 0)); -<===> clamped/green/output.css +<===> bounds/green/below/output.css a { - b: rgba(0, 0, 0, 0.5); + value: rgb(0, 0, 0); + space: rgb; + channels: 0 0 0 / 1; } <===> ================================================================================ -<===> clamped/blue/options.yml -:todo: - - dart-sass +<===> bounds/blue/above/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(0 0 999)); -<===> clamped/blue/input.scss -a {b: rgb(0 0 9999 / 0.5)} +<===> bounds/blue/above/output.css +a { + value: rgb(0, 0, 255); + space: rgb; + channels: 0 0 255 / 1; +} + +<===> +================================================================================ +<===> bounds/blue/below/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(0 0 -500)); -<===> clamped/blue/output.css +<===> bounds/blue/below/output.css a { - b: rgba(0, 0, 255, 0.5); + value: rgb(0, 0, 0); + space: rgb; + channels: 0 0 0 / 1; } <===> ================================================================================ -<===> clamped/alpha/above/input.scss -a {b: rgb(0 0 0 / 1.1)} +<===> bounds/alpha/unitless/above/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(0 0 0 / 1.1)); -<===> clamped/alpha/above/output.css +<===> bounds/alpha/unitless/above/output.css a { - b: rgb(0, 0, 0); + value: rgb(0, 0, 0); + space: rgb; + channels: 0 0 0 / 1; } <===> ================================================================================ -<===> clamped/alpha/below/input.scss -a {b: rgb(0 0 0 / -0.1)} +<===> bounds/alpha/unitless/below/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(0 0 0 / -0.1)); -<===> clamped/alpha/below/output.css +<===> bounds/alpha/unitless/below/output.css a { - b: rgba(0, 0, 0, 0); + value: rgba(0, 0, 0, 0); + space: rgb; + channels: 0 0 0 / 0; } <===> ================================================================================ -<===> clamped/alpha/percent/above/input.scss -a {b: rgb(0 0 0 / 250%)} +<===> bounds/alpha/percent/above/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(0 0 0 / 250%)); -<===> clamped/alpha/percent/above/output.css +<===> bounds/alpha/percent/above/output.css a { - b: rgb(0, 0, 0); + value: rgb(0, 0, 0); + space: rgb; + channels: 0 0 0 / 1; } <===> ================================================================================ -<===> clamped/alpha/percent/below/input.scss -a {b: rgb(0 0 0 / -10%)} +<===> bounds/alpha/percent/below/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(rgb(0 0 0 / -10%)); -<===> clamped/alpha/percent/below/output.css +<===> bounds/alpha/percent/below/output.css a { - b: rgba(0, 0, 0, 0); + value: rgba(0, 0, 0, 0); + space: rgb; + channels: 0 0 0 / 0; } <===> From 56935264517a7a3c85014a008ffe009e305cf54f Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 12 Apr 2024 16:21:55 -0700 Subject: [PATCH 26/45] [Color 4] Add specs for color.to-space() (#1974) --- .../color/to_space/a98_rgb/a98_rgb.hrx | 52 ++++++ .../color/to_space/a98_rgb/display_p3.hrx | 118 +++++++++++++ .../color/to_space/a98_rgb/hsl.hrx | 118 +++++++++++++ .../color/to_space/a98_rgb/hwb.hrx | 149 ++++++++++++++++ .../color/to_space/a98_rgb/lab.hrx | 117 +++++++++++++ .../color/to_space/a98_rgb/lch.hrx | 117 +++++++++++++ .../color/to_space/a98_rgb/oklab.hrx | 117 +++++++++++++ .../color/to_space/a98_rgb/oklch.hrx | 117 +++++++++++++ .../color/to_space/a98_rgb/prophoto_rgb.hrx | 118 +++++++++++++ .../color/to_space/a98_rgb/rec2020.hrx | 118 +++++++++++++ .../color/to_space/a98_rgb/rgb.hrx | 118 +++++++++++++ .../color/to_space/a98_rgb/srgb.hrx | 118 +++++++++++++ .../color/to_space/a98_rgb/srgb_linear.hrx | 118 +++++++++++++ .../color/to_space/a98_rgb/xyz.hrx | 118 +++++++++++++ .../color/to_space/a98_rgb/xyz_d50.hrx | 118 +++++++++++++ .../color/to_space/display_p3/a98_rgb.hrx | 118 +++++++++++++ .../color/to_space/display_p3/display_p3.hrx | 52 ++++++ .../color/to_space/display_p3/hsl.hrx | 118 +++++++++++++ .../color/to_space/display_p3/hwb.hrx | 149 ++++++++++++++++ .../color/to_space/display_p3/lab.hrx | 117 +++++++++++++ .../color/to_space/display_p3/lch.hrx | 117 +++++++++++++ .../color/to_space/display_p3/oklab.hrx | 117 +++++++++++++ .../color/to_space/display_p3/oklch.hrx | 117 +++++++++++++ .../to_space/display_p3/prophoto_rgb.hrx | 118 +++++++++++++ .../color/to_space/display_p3/rec2020.hrx | 118 +++++++++++++ .../color/to_space/display_p3/rgb.hrx | 118 +++++++++++++ .../color/to_space/display_p3/srgb.hrx | 118 +++++++++++++ .../color/to_space/display_p3/srgb_linear.hrx | 118 +++++++++++++ .../color/to_space/display_p3/xyz.hrx | 118 +++++++++++++ .../color/to_space/display_p3/xyz_d50.hrx | 118 +++++++++++++ spec/core_functions/color/to_space/error.hrx | 89 ++++++++++ .../color/to_space/hsl/a98_rgb.hrx | 129 ++++++++++++++ .../color/to_space/hsl/display_p3.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hsl/hsl.hrx | 52 ++++++ .../core_functions/color/to_space/hsl/hwb.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hsl/lab.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hsl/lch.hrx | 129 ++++++++++++++ .../color/to_space/hsl/oklab.hrx | 129 ++++++++++++++ .../color/to_space/hsl/oklch.hrx | 129 ++++++++++++++ .../color/to_space/hsl/prophoto_rgb.hrx | 129 ++++++++++++++ .../color/to_space/hsl/rec2020.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hsl/rgb.hrx | 129 ++++++++++++++ .../color/to_space/hsl/srgb.hrx | 129 ++++++++++++++ .../color/to_space/hsl/srgb_linear.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hsl/xyz.hrx | 129 ++++++++++++++ .../color/to_space/hsl/xyz_d50.hrx | 129 ++++++++++++++ .../color/to_space/hwb/a98_rgb.hrx | 129 ++++++++++++++ .../color/to_space/hwb/display_p3.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hwb/hsl.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hwb/hwb.hrx | 52 ++++++ .../core_functions/color/to_space/hwb/lab.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hwb/lch.hrx | 129 ++++++++++++++ .../color/to_space/hwb/oklab.hrx | 129 ++++++++++++++ .../color/to_space/hwb/oklch.hrx | 129 ++++++++++++++ .../color/to_space/hwb/prophoto_rgb.hrx | 129 ++++++++++++++ .../color/to_space/hwb/rec2020.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hwb/rgb.hrx | 129 ++++++++++++++ .../color/to_space/hwb/srgb.hrx | 129 ++++++++++++++ .../color/to_space/hwb/srgb_linear.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/hwb/xyz.hrx | 129 ++++++++++++++ .../color/to_space/hwb/xyz_d50.hrx | 129 ++++++++++++++ .../color/to_space/lab/a98_rgb.hrx | 118 +++++++++++++ .../color/to_space/lab/display_p3.hrx | 118 +++++++++++++ .../core_functions/color/to_space/lab/hsl.hrx | 118 +++++++++++++ .../core_functions/color/to_space/lab/hwb.hrx | 118 +++++++++++++ .../core_functions/color/to_space/lab/lab.hrx | 52 ++++++ .../core_functions/color/to_space/lab/lch.hrx | 118 +++++++++++++ .../color/to_space/lab/oklab.hrx | 118 +++++++++++++ .../color/to_space/lab/oklch.hrx | 118 +++++++++++++ .../color/to_space/lab/prophoto_rgb.hrx | 118 +++++++++++++ .../color/to_space/lab/rec2020.hrx | 118 +++++++++++++ .../core_functions/color/to_space/lab/rgb.hrx | 118 +++++++++++++ .../color/to_space/lab/srgb.hrx | 118 +++++++++++++ .../color/to_space/lab/srgb_linear.hrx | 118 +++++++++++++ .../core_functions/color/to_space/lab/xyz.hrx | 118 +++++++++++++ .../color/to_space/lab/xyz_d50.hrx | 118 +++++++++++++ .../color/to_space/lch/a98_rgb.hrx | 129 ++++++++++++++ .../color/to_space/lch/display_p3.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/lch/hsl.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/lch/hwb.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/lch/lab.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/lch/lch.hrx | 52 ++++++ .../color/to_space/lch/oklab.hrx | 129 ++++++++++++++ .../color/to_space/lch/oklch.hrx | 129 ++++++++++++++ .../color/to_space/lch/prophoto_rgb.hrx | 129 ++++++++++++++ .../color/to_space/lch/rec2020.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/lch/rgb.hrx | 129 ++++++++++++++ .../color/to_space/lch/srgb.hrx | 129 ++++++++++++++ .../color/to_space/lch/srgb_linear.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/lch/xyz.hrx | 129 ++++++++++++++ .../color/to_space/lch/xyz_d50.hrx | 129 ++++++++++++++ .../color/to_space/oklab/a98_rgb.hrx | 118 +++++++++++++ .../color/to_space/oklab/display_p3.hrx | 118 +++++++++++++ .../color/to_space/oklab/hsl.hrx | 118 +++++++++++++ .../color/to_space/oklab/hwb.hrx | 118 +++++++++++++ .../color/to_space/oklab/lab.hrx | 122 +++++++++++++ .../color/to_space/oklab/lch.hrx | 122 +++++++++++++ .../color/to_space/oklab/oklab.hrx | 52 ++++++ .../color/to_space/oklab/oklch.hrx | 118 +++++++++++++ .../color/to_space/oklab/prophoto_rgb.hrx | 118 +++++++++++++ .../color/to_space/oklab/rec2020.hrx | 118 +++++++++++++ .../color/to_space/oklab/rgb.hrx | 118 +++++++++++++ .../color/to_space/oklab/srgb.hrx | 118 +++++++++++++ .../color/to_space/oklab/srgb_linear.hrx | 118 +++++++++++++ .../color/to_space/oklab/xyz.hrx | 118 +++++++++++++ .../color/to_space/oklab/xyz_d50.hrx | 118 +++++++++++++ .../color/to_space/oklch/a98_rgb.hrx | 129 ++++++++++++++ .../color/to_space/oklch/display_p3.hrx | 129 ++++++++++++++ .../color/to_space/oklch/hsl.hrx | 129 ++++++++++++++ .../color/to_space/oklch/hwb.hrx | 129 ++++++++++++++ .../color/to_space/oklch/lab.hrx | 129 ++++++++++++++ .../color/to_space/oklch/lch.hrx | 129 ++++++++++++++ .../color/to_space/oklch/oklab.hrx | 129 ++++++++++++++ .../color/to_space/oklch/oklch.hrx | 52 ++++++ .../color/to_space/oklch/prophoto_rgb.hrx | 129 ++++++++++++++ .../color/to_space/oklch/rec2020.hrx | 129 ++++++++++++++ .../color/to_space/oklch/rgb.hrx | 129 ++++++++++++++ .../color/to_space/oklch/srgb.hrx | 129 ++++++++++++++ .../color/to_space/oklch/srgb_linear.hrx | 129 ++++++++++++++ .../color/to_space/oklch/xyz.hrx | 129 ++++++++++++++ .../color/to_space/oklch/xyz_d50.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/options.yml | 3 + .../color/to_space/prophoto_rgb/a98_rgb.hrx | 118 +++++++++++++ .../to_space/prophoto_rgb/display_p3.hrx | 118 +++++++++++++ .../color/to_space/prophoto_rgb/hsl.hrx | 118 +++++++++++++ .../color/to_space/prophoto_rgb/hwb.hrx | 149 ++++++++++++++++ .../color/to_space/prophoto_rgb/lab.hrx | 119 +++++++++++++ .../color/to_space/prophoto_rgb/lch.hrx | 119 +++++++++++++ .../color/to_space/prophoto_rgb/oklab.hrx | 117 +++++++++++++ .../color/to_space/prophoto_rgb/oklch.hrx | 117 +++++++++++++ .../to_space/prophoto_rgb/prophoto_rgb.hrx | 52 ++++++ .../color/to_space/prophoto_rgb/rec2020.hrx | 118 +++++++++++++ .../color/to_space/prophoto_rgb/rgb.hrx | 118 +++++++++++++ .../color/to_space/prophoto_rgb/srgb.hrx | 118 +++++++++++++ .../to_space/prophoto_rgb/srgb_linear.hrx | 118 +++++++++++++ .../color/to_space/prophoto_rgb/xyz.hrx | 118 +++++++++++++ .../color/to_space/prophoto_rgb/xyz_d50.hrx | 118 +++++++++++++ .../color/to_space/rec2020/a98_rgb.hrx | 118 +++++++++++++ .../color/to_space/rec2020/display_p3.hrx | 118 +++++++++++++ .../color/to_space/rec2020/hsl.hrx | 118 +++++++++++++ .../color/to_space/rec2020/hwb.hrx | 149 ++++++++++++++++ .../color/to_space/rec2020/lab.hrx | 117 +++++++++++++ .../color/to_space/rec2020/lch.hrx | 117 +++++++++++++ .../color/to_space/rec2020/oklab.hrx | 117 +++++++++++++ .../color/to_space/rec2020/oklch.hrx | 117 +++++++++++++ .../color/to_space/rec2020/prophoto_rgb.hrx | 118 +++++++++++++ .../color/to_space/rec2020/rec2020.hrx | 52 ++++++ .../color/to_space/rec2020/rgb.hrx | 118 +++++++++++++ .../color/to_space/rec2020/srgb.hrx | 118 +++++++++++++ .../color/to_space/rec2020/srgb_linear.hrx | 118 +++++++++++++ .../color/to_space/rec2020/xyz.hrx | 118 +++++++++++++ .../color/to_space/rec2020/xyz_d50.hrx | 118 +++++++++++++ .../color/to_space/rgb/a98_rgb.hrx | 129 ++++++++++++++ .../color/to_space/rgb/display_p3.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/rgb/hsl.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/rgb/hwb.hrx | 165 ++++++++++++++++++ .../core_functions/color/to_space/rgb/lab.hrx | 128 ++++++++++++++ .../core_functions/color/to_space/rgb/lch.hrx | 128 ++++++++++++++ .../color/to_space/rgb/oklab.hrx | 128 ++++++++++++++ .../color/to_space/rgb/oklch.hrx | 128 ++++++++++++++ .../color/to_space/rgb/prophoto_rgb.hrx | 129 ++++++++++++++ .../color/to_space/rgb/rec2020.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/rgb/rgb.hrx | 52 ++++++ .../color/to_space/rgb/srgb.hrx | 129 ++++++++++++++ .../color/to_space/rgb/srgb_linear.hrx | 129 ++++++++++++++ .../core_functions/color/to_space/rgb/xyz.hrx | 129 ++++++++++++++ .../color/to_space/rgb/xyz_d50.hrx | 129 ++++++++++++++ .../color/to_space/srgb/a98_rgb.hrx | 118 +++++++++++++ .../color/to_space/srgb/display_p3.hrx | 118 +++++++++++++ .../color/to_space/srgb/hsl.hrx | 118 +++++++++++++ .../color/to_space/srgb/hwb.hrx | 149 ++++++++++++++++ .../color/to_space/srgb/lab.hrx | 117 +++++++++++++ .../color/to_space/srgb/lch.hrx | 117 +++++++++++++ .../color/to_space/srgb/oklab.hrx | 117 +++++++++++++ .../color/to_space/srgb/oklch.hrx | 117 +++++++++++++ .../color/to_space/srgb/prophoto_rgb.hrx | 118 +++++++++++++ .../color/to_space/srgb/rec2020.hrx | 118 +++++++++++++ .../color/to_space/srgb/rgb.hrx | 118 +++++++++++++ .../color/to_space/srgb/srgb.hrx | 52 ++++++ .../color/to_space/srgb/srgb_linear.hrx | 118 +++++++++++++ .../color/to_space/srgb/xyz.hrx | 118 +++++++++++++ .../color/to_space/srgb/xyz_d50.hrx | 118 +++++++++++++ .../color/to_space/srgb_linear/a98_rgb.hrx | 118 +++++++++++++ .../color/to_space/srgb_linear/display_p3.hrx | 118 +++++++++++++ .../color/to_space/srgb_linear/hsl.hrx | 118 +++++++++++++ .../color/to_space/srgb_linear/hwb.hrx | 149 ++++++++++++++++ .../color/to_space/srgb_linear/lab.hrx | 117 +++++++++++++ .../color/to_space/srgb_linear/lch.hrx | 117 +++++++++++++ .../color/to_space/srgb_linear/oklab.hrx | 117 +++++++++++++ .../color/to_space/srgb_linear/oklch.hrx | 117 +++++++++++++ .../to_space/srgb_linear/prophoto_rgb.hrx | 118 +++++++++++++ .../color/to_space/srgb_linear/rec2020.hrx | 118 +++++++++++++ .../color/to_space/srgb_linear/rgb.hrx | 118 +++++++++++++ .../color/to_space/srgb_linear/srgb.hrx | 118 +++++++++++++ .../to_space/srgb_linear/srgb_linear.hrx | 52 ++++++ .../color/to_space/srgb_linear/xyz.hrx | 118 +++++++++++++ .../color/to_space/srgb_linear/xyz_d50.hrx | 118 +++++++++++++ .../color/to_space/xyz/a98_rgb.hrx | 118 +++++++++++++ .../color/to_space/xyz/display_p3.hrx | 118 +++++++++++++ .../core_functions/color/to_space/xyz/hsl.hrx | 118 +++++++++++++ .../core_functions/color/to_space/xyz/hwb.hrx | 149 ++++++++++++++++ .../core_functions/color/to_space/xyz/lab.hrx | 125 +++++++++++++ .../core_functions/color/to_space/xyz/lch.hrx | 125 +++++++++++++ .../color/to_space/xyz/oklab.hrx | 117 +++++++++++++ .../color/to_space/xyz/oklch.hrx | 117 +++++++++++++ .../color/to_space/xyz/prophoto_rgb.hrx | 118 +++++++++++++ .../color/to_space/xyz/rec2020.hrx | 118 +++++++++++++ .../core_functions/color/to_space/xyz/rgb.hrx | 118 +++++++++++++ .../color/to_space/xyz/srgb.hrx | 118 +++++++++++++ .../color/to_space/xyz/srgb_linear.hrx | 118 +++++++++++++ .../core_functions/color/to_space/xyz/xyz.hrx | 52 ++++++ .../color/to_space/xyz/xyz_d50.hrx | 118 +++++++++++++ .../to_space/xyz_d50/xyz-d50/a98_rgb.hrx | 52 ++++++ .../to_space/xyz_d50/xyz-d50/display_p3.hrx | 118 +++++++++++++ .../color/to_space/xyz_d50/xyz-d50/hsl.hrx | 118 +++++++++++++ .../color/to_space/xyz_d50/xyz-d50/hwb.hrx | 149 ++++++++++++++++ .../color/to_space/xyz_d50/xyz-d50/lab.hrx | 117 +++++++++++++ .../color/to_space/xyz_d50/xyz-d50/lch.hrx | 117 +++++++++++++ .../color/to_space/xyz_d50/xyz-d50/oklab.hrx | 117 +++++++++++++ .../color/to_space/xyz_d50/xyz-d50/oklch.hrx | 117 +++++++++++++ .../to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx | 118 +++++++++++++ .../to_space/xyz_d50/xyz-d50/rec2020.hrx | 118 +++++++++++++ .../color/to_space/xyz_d50/xyz-d50/rgb.hrx | 118 +++++++++++++ .../color/to_space/xyz_d50/xyz-d50/srgb.hrx | 118 +++++++++++++ .../to_space/xyz_d50/xyz-d50/srgb_linear.hrx | 118 +++++++++++++ .../color/to_space/xyz_d50/xyz-d50/xyz.hrx | 118 +++++++++++++ .../to_space/xyz_d50/xyz-d50/xyz_d50.hrx | 118 +++++++++++++ 227 files changed, 26698 insertions(+) create mode 100644 spec/core_functions/color/to_space/a98_rgb/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/hsl.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/hwb.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/lab.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/lch.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/oklab.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/oklch.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/rgb.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/srgb.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/xyz.hrx create mode 100644 spec/core_functions/color/to_space/a98_rgb/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/hsl.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/hwb.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/lab.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/lch.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/oklab.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/oklch.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/rgb.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/srgb.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/xyz.hrx create mode 100644 spec/core_functions/color/to_space/display_p3/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/error.hrx create mode 100644 spec/core_functions/color/to_space/hsl/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/hsl/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/hsl/hsl.hrx create mode 100644 spec/core_functions/color/to_space/hsl/hwb.hrx create mode 100644 spec/core_functions/color/to_space/hsl/lab.hrx create mode 100644 spec/core_functions/color/to_space/hsl/lch.hrx create mode 100644 spec/core_functions/color/to_space/hsl/oklab.hrx create mode 100644 spec/core_functions/color/to_space/hsl/oklch.hrx create mode 100644 spec/core_functions/color/to_space/hsl/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/hsl/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/hsl/rgb.hrx create mode 100644 spec/core_functions/color/to_space/hsl/srgb.hrx create mode 100644 spec/core_functions/color/to_space/hsl/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/hsl/xyz.hrx create mode 100644 spec/core_functions/color/to_space/hsl/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/hwb/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/hwb/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/hwb/hsl.hrx create mode 100644 spec/core_functions/color/to_space/hwb/hwb.hrx create mode 100644 spec/core_functions/color/to_space/hwb/lab.hrx create mode 100644 spec/core_functions/color/to_space/hwb/lch.hrx create mode 100644 spec/core_functions/color/to_space/hwb/oklab.hrx create mode 100644 spec/core_functions/color/to_space/hwb/oklch.hrx create mode 100644 spec/core_functions/color/to_space/hwb/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/hwb/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/hwb/rgb.hrx create mode 100644 spec/core_functions/color/to_space/hwb/srgb.hrx create mode 100644 spec/core_functions/color/to_space/hwb/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/hwb/xyz.hrx create mode 100644 spec/core_functions/color/to_space/hwb/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/lab/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/lab/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/lab/hsl.hrx create mode 100644 spec/core_functions/color/to_space/lab/hwb.hrx create mode 100644 spec/core_functions/color/to_space/lab/lab.hrx create mode 100644 spec/core_functions/color/to_space/lab/lch.hrx create mode 100644 spec/core_functions/color/to_space/lab/oklab.hrx create mode 100644 spec/core_functions/color/to_space/lab/oklch.hrx create mode 100644 spec/core_functions/color/to_space/lab/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/lab/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/lab/rgb.hrx create mode 100644 spec/core_functions/color/to_space/lab/srgb.hrx create mode 100644 spec/core_functions/color/to_space/lab/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/lab/xyz.hrx create mode 100644 spec/core_functions/color/to_space/lab/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/lch/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/lch/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/lch/hsl.hrx create mode 100644 spec/core_functions/color/to_space/lch/hwb.hrx create mode 100644 spec/core_functions/color/to_space/lch/lab.hrx create mode 100644 spec/core_functions/color/to_space/lch/lch.hrx create mode 100644 spec/core_functions/color/to_space/lch/oklab.hrx create mode 100644 spec/core_functions/color/to_space/lch/oklch.hrx create mode 100644 spec/core_functions/color/to_space/lch/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/lch/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/lch/rgb.hrx create mode 100644 spec/core_functions/color/to_space/lch/srgb.hrx create mode 100644 spec/core_functions/color/to_space/lch/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/lch/xyz.hrx create mode 100644 spec/core_functions/color/to_space/lch/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/oklab/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/oklab/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/oklab/hsl.hrx create mode 100644 spec/core_functions/color/to_space/oklab/hwb.hrx create mode 100644 spec/core_functions/color/to_space/oklab/lab.hrx create mode 100644 spec/core_functions/color/to_space/oklab/lch.hrx create mode 100644 spec/core_functions/color/to_space/oklab/oklab.hrx create mode 100644 spec/core_functions/color/to_space/oklab/oklch.hrx create mode 100644 spec/core_functions/color/to_space/oklab/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/oklab/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/oklab/rgb.hrx create mode 100644 spec/core_functions/color/to_space/oklab/srgb.hrx create mode 100644 spec/core_functions/color/to_space/oklab/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/oklab/xyz.hrx create mode 100644 spec/core_functions/color/to_space/oklab/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/oklch/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/oklch/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/oklch/hsl.hrx create mode 100644 spec/core_functions/color/to_space/oklch/hwb.hrx create mode 100644 spec/core_functions/color/to_space/oklch/lab.hrx create mode 100644 spec/core_functions/color/to_space/oklch/lch.hrx create mode 100644 spec/core_functions/color/to_space/oklch/oklab.hrx create mode 100644 spec/core_functions/color/to_space/oklch/oklch.hrx create mode 100644 spec/core_functions/color/to_space/oklch/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/oklch/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/oklch/rgb.hrx create mode 100644 spec/core_functions/color/to_space/oklch/srgb.hrx create mode 100644 spec/core_functions/color/to_space/oklch/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/oklch/xyz.hrx create mode 100644 spec/core_functions/color/to_space/oklch/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/options.yml create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/hsl.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/hwb.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/lab.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/lch.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/rgb.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/srgb.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/xyz.hrx create mode 100644 spec/core_functions/color/to_space/prophoto_rgb/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/hsl.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/hwb.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/lab.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/lch.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/oklab.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/oklch.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/rgb.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/srgb.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/xyz.hrx create mode 100644 spec/core_functions/color/to_space/rec2020/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/rgb/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/rgb/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/rgb/hsl.hrx create mode 100644 spec/core_functions/color/to_space/rgb/hwb.hrx create mode 100644 spec/core_functions/color/to_space/rgb/lab.hrx create mode 100644 spec/core_functions/color/to_space/rgb/lch.hrx create mode 100644 spec/core_functions/color/to_space/rgb/oklab.hrx create mode 100644 spec/core_functions/color/to_space/rgb/oklch.hrx create mode 100644 spec/core_functions/color/to_space/rgb/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/rgb/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/rgb/rgb.hrx create mode 100644 spec/core_functions/color/to_space/rgb/srgb.hrx create mode 100644 spec/core_functions/color/to_space/rgb/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/rgb/xyz.hrx create mode 100644 spec/core_functions/color/to_space/rgb/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/srgb/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/srgb/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/srgb/hsl.hrx create mode 100644 spec/core_functions/color/to_space/srgb/hwb.hrx create mode 100644 spec/core_functions/color/to_space/srgb/lab.hrx create mode 100644 spec/core_functions/color/to_space/srgb/lch.hrx create mode 100644 spec/core_functions/color/to_space/srgb/oklab.hrx create mode 100644 spec/core_functions/color/to_space/srgb/oklch.hrx create mode 100644 spec/core_functions/color/to_space/srgb/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/srgb/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/srgb/rgb.hrx create mode 100644 spec/core_functions/color/to_space/srgb/srgb.hrx create mode 100644 spec/core_functions/color/to_space/srgb/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/srgb/xyz.hrx create mode 100644 spec/core_functions/color/to_space/srgb/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/hsl.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/hwb.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/lab.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/lch.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/oklab.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/oklch.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/rgb.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/srgb.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/xyz.hrx create mode 100644 spec/core_functions/color/to_space/srgb_linear/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/xyz/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/xyz/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/xyz/hsl.hrx create mode 100644 spec/core_functions/color/to_space/xyz/hwb.hrx create mode 100644 spec/core_functions/color/to_space/xyz/lab.hrx create mode 100644 spec/core_functions/color/to_space/xyz/lch.hrx create mode 100644 spec/core_functions/color/to_space/xyz/oklab.hrx create mode 100644 spec/core_functions/color/to_space/xyz/oklch.hrx create mode 100644 spec/core_functions/color/to_space/xyz/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/xyz/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/xyz/rgb.hrx create mode 100644 spec/core_functions/color/to_space/xyz/srgb.hrx create mode 100644 spec/core_functions/color/to_space/xyz/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/xyz/xyz.hrx create mode 100644 spec/core_functions/color/to_space/xyz/xyz_d50.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/display_p3.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/hsl.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/hwb.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/rec2020.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/rgb.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz.hrx create mode 100644 spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz_d50.hrx diff --git a/spec/core_functions/color/to_space/a98_rgb/a98_rgb.hrx b/spec/core_functions/color/to_space/a98_rgb/a98_rgb.hrx new file mode 100644 index 0000000000..4bc1c0f90f --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/a98_rgb.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), a98-rgb)} + +<===> in_range/output.css +a { + b: color(a98-rgb 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), a98-rgb)} + +<===> out_of_range/output.css +a { + b: color(a98-rgb -1 0.4 2); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), a98-rgb)} + +<===> missing/red/output.css +a { + b: color(a98-rgb none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), a98-rgb)} + +<===> missing/green/output.css +a { + b: color(a98-rgb 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), a98-rgb)} + +<===> missing/blue/output.css +a { + b: color(a98-rgb 0.1 0.2 none); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/display_p3.hrx b/spec/core_functions/color/to_space/a98_rgb/display_p3.hrx new file mode 100644 index 0000000000..f9b4cced51 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.5039928958 0.5039928958 0.5039928958); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.1198075605 0.3936533835 0.7891199167); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -1.0713648823 0.3146416114 1.8898918553); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -352050.1162090242 -92416.3092975226 -70070.8047882944); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.0376331272 0.1827194825 0.2895249614 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.0376331272 0.1827194825 0.2895249614 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.1816774074 0.2892067467); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 0.080586652 none 0.2878991958); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.0376331272 0.1827194825 none); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/hsl.hrx b/spec/core_functions/color/to_space/a98_rgb/hsl.hrx new file mode 100644 index 0000000000..7cd8479c26 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 50.3992895764%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), hsl)} + +<===> middle/output.css +a { + b: hsl(206.798941326, 132.7737671841%, 35.0907131834%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(209.922630637, 396.8439205726%, 39.6562294521%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(0, 100%, -19096022.06943802%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(200.1785406812, 126.7161502744%, 13.1753745837%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(200.1785406812, 126.7161502744%, 13.1753745837%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), hsl)} + +<===> missing/red/output.css +a { + b: hsl(196.5051304863, 215.7701724503%, 9.4596338244%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), hsl)} + +<===> missing/green/output.css +a { + b: hsl(258.3433021907, 100%, 15.0612047755%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(125.1711076789, 146.5566174361%, 7.5605855126%); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/hwb.hrx b/spec/core_functions/color/to_space/a98_rgb/hwb.hrx new file mode 100644 index 0000000000..3bb49a02da --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/hwb.hrx @@ -0,0 +1,149 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb 0 0 0), hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb 1 1 1), hwb)); + +<===> white/output.css +a { + value: white; + space: hwb; + channels: 0deg 100% 0% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb 0.5 0.5 0.5), hwb)); + +<===> gray/output.css +a { + value: hsl(0, 0%, 50.3992895764%); + space: hwb; + channels: 0deg 50.3992895764% 49.6007104236% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb 0.2 0.4 0.8), hwb)); + +<===> middle/output.css +a { + value: hsl(206.798941326, 132.7737671841%, 35.0907131834%); + space: hwb; + channels: 206.798941326deg -11.500548642% 18.3180249912% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb -1 0.4 2), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(209.922630637, 396.8439205726%, 39.6562294521%); + space: hwb; + channels: 209.922630637deg -117.7171062569% -97.0295651612% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb -999999 0 0), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(0, 100%, -19096022.06943802%); + space: hwb; + channels: 180deg -38192044.13887604% 100% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(200.1785406812, 126.7161502744%, 13.1753745837%, 0.4); + space: hwb; + channels: 200.1785406812deg -3.519952873% 70.1292979595% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(200.1785406812, 126.7161502744%, 13.1753745837%, 0); + space: hwb; + channels: 200.1785406812deg -3.519952873% 70.1292979595% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb none 0.2 0.3), hwb)); + +<===> missing/red/output.css +a { + value: hsl(196.5051304863, 215.7701724503%, 9.4596338244%); + space: hwb; + channels: 196.5051304863deg -10.9514343917% 70.1292979595% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(a98-rgb 0.1 none 0.3), hwb)); + +<===> missing/green/output.css +a { + value: hsl(258.3433021907, 100%, 15.0612047755%); + space: hwb; + channels: 258.3433021907deg 0% 69.8775904491% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), hwb)} + +<===> missing/blue/output.css +a { + b: hsl(125.1711076789, 146.5566174361%, 7.5605855126%); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/lab.hrx b/spec/core_functions/color/to_space/a98_rgb/lab.hrx new file mode 100644 index 0000000000..8127f5522e --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/lab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), lab)} + +<===> gray/output.css +a { + b: lab(53.7880481926% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), lab)} + +<===> middle/output.css +a { + b: lab(42.9339299516% 6.5030561424 -63.5427502212); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(30.0623308533% 38.5823326773 -241.4998540297); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(17.7387491045% -7.186319424 -22.7371258976 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(17.7387491045% -7.186319424 -22.7371258976 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), lab)} + +<===> missing/red/output.css +a { + b: lab(16.8147782656% -12.534270074 -24.2693697193); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), lab)} + +<===> missing/green/output.css +a { + b: lab(5.8200823344% 29.1326658037 -42.4044732971); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(15.5541953165% -27.655552781 23.2496799552); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/lch.hrx b/spec/core_functions/color/to_space/a98_rgb/lch.hrx new file mode 100644 index 0000000000..0a1827957c --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/lch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), lch)} + +<===> gray/output.css +a { + b: lch(53.7880481926% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), lch)} + +<===> middle/output.css +a { + b: lch(42.9339299516% 63.8746494696 275.8433881087deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(30.0623308533% 244.5624171683 279.0769417748deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(17.7387491045% 23.8457560364 252.4602846081deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(17.7387491045% 23.8457560364 252.4602846081deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), lch)} + +<===> missing/red/output.css +a { + b: lch(16.8147782656% 27.3150184488 242.6852480988deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), lch)} + +<===> missing/green/output.css +a { + b: lch(5.8200823344% 51.4475613847 304.4897928318deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(15.5541953165% 36.1300043959 139.9466505913deg); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/oklab.hrx b/spec/core_functions/color/to_space/a98_rgb/oklab.hrx new file mode 100644 index 0000000000..4298fd6b50 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/oklab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), oklab)} + +<===> gray/output.css +a { + b: oklab(60.1621101182% 0 0.0000000224); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), oklab)} + +<===> middle/output.css +a { + b: oklab(52.1495256905% -0.0513578757 -0.1793591779); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(38.583187128% -2.2710957934 -0.6509941262); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(29.182543438% -0.0383089973 -0.0634618836 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(29.182543438% -0.0383089973 -0.0634618836 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), oklab)} + +<===> missing/red/output.css +a { + b: oklab(28.2216457589% -0.0592406629 -0.068029159); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), oklab)} + +<===> missing/green/output.css +a { + b: oklab(20.9471844335% 0.0293694057 -0.1198702832); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(26.2341469735% -0.0807607241 0.059543982); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/oklch.hrx b/spec/core_functions/color/to_space/a98_rgb/oklch.hrx new file mode 100644 index 0000000000..82b9cd759a --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/oklch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), oklch)} + +<===> gray/output.css +a { + b: oklch(60.1621101182% 0.0000000224 89.8755628523deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), oklch)} + +<===> middle/output.css +a { + b: oklch(52.1495256905% 0.1865672696 254.0214147055deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(38.583187128% 2.3625557042 195.9945889447deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(29.182543438% 0.0741281994 238.8825662829deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(29.182543438% 0.0741281994 238.8825662829deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), oklch)} + +<===> missing/red/output.css +a { + b: oklch(28.2216457589% 0.0902076638 228.9502345148deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), oklch)} + +<===> missing/green/output.css +a { + b: oklch(20.9471844335% 0.1234157477 283.7668356322deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(26.2341469735% 0.1003383295 143.5990619106deg); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/a98_rgb/prophoto_rgb.hrx new file mode 100644 index 0000000000..6a88485ab3 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.4287509597 0.4287509597 0.4287509597); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.3168388393 0.3260606848 0.726820787); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb -0.1930208925 0.2909921381 2.199240452); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -18118318.905084856 -7113714.776888951 -2671576.7208059593); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.1084709661 0.1348055136 0.2212739372 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.1084709661 0.1348055136 0.2212739372 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.1323881901 0.2209968271); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.0971986374 none 0.2172679015); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.0682396395 0.1289630742 none); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/rec2020.hrx b/spec/core_functions/color/to_space/a98_rgb/rec2020.hrx new file mode 100644 index 0000000000..6d7c159b65 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.4543095825 0.4543095825 0.4543095825); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.2185447527 0.3379568627 0.7598138887); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -0.8122496028 0.2467395561 2.013750701); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -898316.3792876494 -332882.1030921165 -174225.0344960701); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.0494709718 0.1182706557 0.2275848731 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.0494709718 0.1182706557 0.2275848731 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.116069056 0.2272691007); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.0393483967 none 0.2248497454); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.0350776367 0.1152389042 none); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/rgb.hrx b/spec/core_functions/color/to_space/a98_rgb/rgb.hrx new file mode 100644 index 0000000000..bd182a171f --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), rgb)} + +<===> gray/output.css +a { + b: rgb(128.5181884199, 128.5181884199, 128.5181884199); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), rgb)} + +<===> middle/output.css +a { + b: hsl(206.798941326, 132.7737671841%, 35.0907131834%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(209.922630637, 396.8439205726%, 39.6562294521%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(0, 100%, -19096022.06943802%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: hsla(200.1785406812, 126.7161502744%, 13.1753745837%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: hsla(200.1785406812, 126.7161502744%, 13.1753745837%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), rgb)} + +<===> missing/red/output.css +a { + b: rgb(0, 47.5348659402, 76.1702902033); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), rgb)} + +<===> missing/green/output.css +a { + b: rgb(23.4831395969, 0, 76.8121443549); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), rgb)} + +<===> missing/blue/output.css +a { + b: hsl(129.5300952459, 146.5566174361%, 7.5605855126%); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/srgb.hrx b/spec/core_functions/color/to_space/a98_rgb/srgb.hrx new file mode 100644 index 0000000000..055a335bb1 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.5039928958 0.5039928958 0.5039928958); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), srgb)} + +<===> middle/output.css +a { + b: color(srgb -0.1150054864 0.4006209194 0.8168197501); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -1.1771710626 0.4006209194 1.9702956516); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -381920.4413887605 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb -0.0351995287 0.186411239 0.2987070204 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb -0.0351995287 0.186411239 0.2987070204 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.186411239 0.2987070204); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb 0.0920907435 none 0.3012240955); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb -0.0351995287 0.186411239 none); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/srgb_linear.hrx b/spec/core_functions/color/to_space/a98_rgb/srgb_linear.hrx new file mode 100644 index 0000000000..5331e68fd9 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.2177555281 0.2177555281 0.2177555281); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear -0.012511378 0.1333039049 0.6327296478); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -1.4514581202 0.1333039049 4.7837263649); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -21924475654205.21 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear -0.0027244217 0.0290276622 0.0726003858 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear -0.0027244217 0.0290276622 0.0726003858 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.0290276622 0.0726003858); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear 0.0088389143 none 0.073846514); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear -0.0027244217 0.0290276622 none); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/xyz.hrx b/spec/core_functions/color/to_space/a98_rgb/xyz.hrx new file mode 100644 index 0000000000..f28f378cf4 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.2069670324 0.2177555281 0.2371483457); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.1567033573 0.1383525888 0.6170771483); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 0.3124701203 0.1320464482 4.5349169732); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -9041452038524.758 -4661998707364.328 -423818064305.84784); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0223592858 0.0254215465 0.0724162815 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0223592858 0.0254215465 0.0724162815 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.0235420485 0.072245418); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.016972964 none 0.0703643493); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.0090314088 0.0200903956 none); +} diff --git a/spec/core_functions/color/to_space/a98_rgb/xyz_d50.hrx b/spec/core_functions/color/to_space/a98_rgb/xyz_d50.hrx new file mode 100644 index 0000000000..eea89911d6 --- /dev/null +++ b/spec/core_functions/color/to_space/a98_rgb/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 1 1 1), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.2099807143 0.2177555281 0.1796710885); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.1364163751 0.1311360929 0.4645989467); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -1 0.4 2), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 0.1028590408 0.062612892 3.4087872511); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb -999999 0 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -9560512850977.73 -4878046244787.3545 -305274677130.3227); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0203795694 0.0246044104 0.054623998 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0203795694 0.0246044104 0.054623998 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.0226378123 0.0545009257); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.0144201903 none 0.0528568205); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(a98-rgb 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.0098137269 0.0201278488 none); +} diff --git a/spec/core_functions/color/to_space/display_p3/a98_rgb.hrx b/spec/core_functions/color/to_space/display_p3/a98_rgb.hrx new file mode 100644 index 0000000000..e955516f64 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/a98_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.4961036984 0.4961036984 0.4961036984); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.2482053529 0.4050915621 0.8110198535); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -0.9267440317 0.459123582 2.1223637667); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -3115569.9464425035 788230.9760095418 569282.1313176785); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.1395855294 0.2151252811 0.3095213638 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.1395855294 0.2151252811 0.3095213638 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), a98-rgb)} + +<===> missing/red/output.css +a { + b: color(a98-rgb none 0.2163312901 0.3099034883); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), a98-rgb)} + +<===> missing/green/output.css +a { + b: color(a98-rgb 0.1153904633 none 0.3115106155); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), a98-rgb)} + +<===> missing/blue/output.css +a { + b: color(a98-rgb 0.1395855294 0.2151252811 none); +} diff --git a/spec/core_functions/color/to_space/display_p3/display_p3.hrx b/spec/core_functions/color/to_space/display_p3/display_p3.hrx new file mode 100644 index 0000000000..add7546595 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/display_p3.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), display-p3)} + +<===> in_range/output.css +a { + b: color(display-p3 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), display-p3)} + +<===> out_of_range/output.css +a { + b: color(display-p3 -1 0.4 2); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.1 0.2 none); +} diff --git a/spec/core_functions/color/to_space/display_p3/hsl.hrx b/spec/core_functions/color/to_space/display_p3/hsl.hrx new file mode 100644 index 0000000000..d7a6690c16 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), hsl)} + +<===> middle/output.css +a { + b: hsl(214.974668252, 77.667451385%, 46.5940983001%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(210.5153182162, 325.7395089334%, 48.9349840904%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(356.7852726724, 165.043052964%, -41057989.10847678%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(205.417452683, 67.7488400949%, 18.4043245596%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(205.417452683, 67.7488400949%, 18.4043245596%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), hsl)} + +<===> missing/red/output.css +a { + b: hsl(196.0636856013, 172.1527011916%, 11.3581215767%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), hsl)} + +<===> missing/green/output.css +a { + b: hsl(262.3902012265, 103.5328302701%, 15.4158592357%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(96.0435532608, 143.3480015017%, 8.3456369204%); +} diff --git a/spec/core_functions/color/to_space/display_p3/hwb.hrx b/spec/core_functions/color/to_space/display_p3/hwb.hrx new file mode 100644 index 0000000000..5177aca637 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/hwb.hrx @@ -0,0 +1,149 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 0 0 0), hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 1 1 1), hwb)); + +<===> white/output.css +a { + value: white; + space: hwb; + channels: 0deg 100% 0% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 0.5 0.5 0.5), hwb)); + +<===> gray/output.css +a { + value: hsl(0, 0%, 50%); + space: hwb; + channels: 0deg 50% 50% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 0.2 0.4 0.8), hwb)); + +<===> middle/output.css +a { + value: hsl(214.974668252, 77.667451385%, 46.5940983001%); + space: hwb; + channels: 214.974668252deg 10.4056496546% 17.2174530544% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 -1 0.4 2), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(210.5153182162, 325.7395089334%, 48.9349840904%); + space: hwb; + channels: 210.5153182162deg -110.4655927824% -108.3355609633% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 -999999 0 0), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(356.7852726724, 165.043052964%, -41057989.10847679%); + space: hwb; + channels: 176.7852726724deg -108821347.81871557% -26705269.601762004% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(205.417452683, 67.7488400949%, 18.4043245596%, 0.4); + space: hwb; + channels: 205.417452683deg 5.9356081432% 69.1269590239% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(205.417452683, 67.7488400949%, 18.4043245596%, 0); + space: hwb; + channels: 205.417452683deg 5.9356081432% 69.1269590239% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 none 0.2 0.3), hwb)); + +<===> missing/red/output.css +a { + value: hsl(196.0636856013, 172.1527011916%, 11.3581215767%); + space: hwb; + channels: 196.0636856013deg -8.1951915222% 69.0885653244% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(display-p3 0.1 none 0.3), hwb)); + +<===> missing/green/output.css +a { + value: hsl(262.3902012265, 103.5328302701%, 15.4158592357%); + space: hwb; + channels: 262.3902012265deg -0.5446161415% 68.6236653872% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), hwb)} + +<===> missing/blue/output.css +a { + b: hsl(96.0435532608, 143.3480015017%, 8.3456369204%); +} diff --git a/spec/core_functions/color/to_space/display_p3/lab.hrx b/spec/core_functions/color/to_space/display_p3/lab.hrx new file mode 100644 index 0000000000..971c6c5c74 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/lab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), lab)} + +<===> gray/output.css +a { + b: lab(53.3889647411% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), lab)} + +<===> middle/output.css +a { + b: lab(44.25592932% 9.6200905548 -62.9637824368); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(49.5672259701% 56.9674744357 -222.3639264513); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(20.127570568% -5.1428777609 -20.6370940019 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(20.127570568% -5.1428777609 -20.6370940019 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), lab)} + +<===> missing/red/output.css +a { + b: lab(19.1369530209% -11.4360315052 -22.3500016909); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), lab)} + +<===> missing/green/output.css +a { + b: lab(6.5882355616% 31.9260289697 -43.3240229048); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(18.0687084518% -22.5066779572 28.5560007052); +} diff --git a/spec/core_functions/color/to_space/display_p3/lch.hrx b/spec/core_functions/color/to_space/display_p3/lch.hrx new file mode 100644 index 0000000000..546280126e --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/lch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), lch)} + +<===> gray/output.css +a { + b: lch(53.3889647411% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), lch)} + +<===> middle/output.css +a { + b: lch(44.25592932% 63.6944584797 278.686909273deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(49.5672259701% 229.5452219725 284.3695672545deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(20.127570568% 21.268258991 256.0066071682deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(20.127570568% 21.268258991 256.0066071682deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), lch)} + +<===> missing/red/output.css +a { + b: lch(19.1369530209% 25.1058836166 242.9021173179deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), lch)} + +<===> missing/green/output.css +a { + b: lch(6.5882355616% 53.8167472672 306.386978589deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(18.0687084518% 36.3592591914 128.2437408357deg); +} diff --git a/spec/core_functions/color/to_space/display_p3/oklab.hrx b/spec/core_functions/color/to_space/display_p3/oklab.hrx new file mode 100644 index 0000000000..50b1643e8e --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/oklab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), oklab)} + +<===> gray/output.css +a { + b: oklab(59.8180726623% 0 0.0000000223); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), oklab)} + +<===> middle/output.css +a { + b: oklab(53.396034367% -0.0363375257 -0.1775421972); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(48.9249793468% -2.2018228016 -0.629877265); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(31.275110206% -0.0275076842 -0.0572559178 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(31.275110206% -0.0275076842 -0.0572559178 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), oklab)} + +<===> missing/red/output.css +a { + b: oklab(30.2321904625% -0.0504866606 -0.0622983016); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), oklab)} + +<===> missing/green/output.css +a { + b: oklab(21.8336364075% 0.0395324831 -0.121787855); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(28.5078223716% -0.0706258662 0.0690953652); +} diff --git a/spec/core_functions/color/to_space/display_p3/oklch.hrx b/spec/core_functions/color/to_space/display_p3/oklch.hrx new file mode 100644 index 0000000000..2f068545af --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/oklch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), oklch)} + +<===> gray/output.css +a { + b: oklch(59.8180726623% 0.0000000223 89.8755628286deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), oklch)} + +<===> middle/output.css +a { + b: oklch(53.396034367% 0.1812226464 258.4330310876deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(48.9249793468% 2.2901460693 195.9642805578deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(31.275110206% 0.0635209636 244.3387920511deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(31.275110206% 0.0635209636 244.3387920511deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), oklch)} + +<===> missing/red/output.css +a { + b: oklch(30.2321904625% 0.0801871641 230.9786265053deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), oklch)} + +<===> missing/green/output.css +a { + b: oklch(21.8336364075% 0.1280433475 287.9834922303deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(28.5078223716% 0.0988037573 135.6275906956deg); +} diff --git a/spec/core_functions/color/to_space/display_p3/prophoto_rgb.hrx b/spec/core_functions/color/to_space/display_p3/prophoto_rgb.hrx new file mode 100644 index 0000000000..54cffa4144 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.4246723949 0.4246723949 0.4246723949); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.3388390747 0.3342960169 0.7393352444); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb 0.363190311 0.3948251642 2.3672559908); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -72137964.95638128 -23392436.47544621 2293597.437985952); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.1280122112 0.1488387497 0.2305514968 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.1280122112 0.1488387497 0.2305514968 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.1466998342 0.2305744173); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.1061223268 none 0.2275163591); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.0911473149 0.1429690366 none); +} diff --git a/spec/core_functions/color/to_space/display_p3/rec2020.hrx b/spec/core_functions/color/to_space/display_p3/rec2020.hrx new file mode 100644 index 0000000000..66bbb591ba --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.4500400319 0.4500400319 0.4500400319); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.2536165098 0.3459256961 0.7717684009); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -0.699464711 0.3562683997 2.1433011781); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -2759152.3635634547 -781900.5819995644 152514.0918455245); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.0792630187 0.1360787348 0.2384262851 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.0792630187 0.1360787348 0.2384262851 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.1345809807 0.2384516749); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.0496776807 none 0.237203952); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.0635852545 0.1330813978 none); +} diff --git a/spec/core_functions/color/to_space/display_p3/rgb.hrx b/spec/core_functions/color/to_space/display_p3/rgb.hrx new file mode 100644 index 0000000000..f447f77038 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), rgb)} + +<===> gray/output.css +a { + b: rgb(127.5, 127.5, 127.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), rgb)} + +<===> middle/output.css +a { + b: rgb(26.5344066192, 103.5127809071, 211.0954947112); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(210.5153182162, 325.7395089334%, 48.9349840904%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(356.7852726724, 165.043052964%, -41057989.10847678%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: rgba(15.1358007651, 51.7877986787, 78.726254489, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: rgba(15.1358007651, 51.7877986787, 78.726254489, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), rgb)} + +<===> missing/red/output.css +a { + b: rgb(0, 52.1258051255, 78.8241584227); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), rgb)} + +<===> missing/green/output.css +a { + b: rgb(28.9866805453, 0, 80.0096532626); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), rgb)} + +<===> missing/blue/output.css +a { + b: rgb(15.1358007651, 51.7877986787, 0); +} diff --git a/spec/core_functions/color/to_space/display_p3/srgb.hrx b/spec/core_functions/color/to_space/display_p3/srgb.hrx new file mode 100644 index 0000000000..0ba1c089a0 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.5 0.5 0.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.1040564965 0.4059324741 0.8278254695); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -1.1046559278 0.4619691673 2.0833556096); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -1088213.4781871557 267053.69601762 194440.1223316972); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.0593560814 0.2030894066 0.3087304098 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.0593560814 0.2030894066 0.3087304098 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.2044149221 0.3091143468); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb 0.113673257 none 0.3137633461); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb 0.0593560814 0.2030894066 none); +} diff --git a/spec/core_functions/color/to_space/display_p3/srgb_linear.hrx b/spec/core_functions/color/to_space/display_p3/srgb_linear.hrx new file mode 100644 index 0000000000..3d54ca5325 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.2140411405 0.2140411405 0.2140411405); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.0106639349 0.1370640729 0.6520692893); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -1.2548276 0.1805133132 5.4498673233); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -270587662527413.8 9290325591630.637 4337909799389.2847); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.0048307697 0.0340755227 0.07763636 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.0048307697 0.0340755227 0.07763636 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.0344970522 0.0778331838); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear 0.0122773617 none 0.080239588); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear 0.0048307697 0.0340755227 none); +} diff --git a/spec/core_functions/color/to_space/display_p3/xyz.hrx b/spec/core_functions/color/to_space/display_p3/xyz.hrx new file mode 100644 index 0000000000..43ecb686cc --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.2034366706 0.2140411405 0.233103163); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.171095654 0.1473658922 0.6363562895); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 0.5306657282 0.2557107148 5.1775335161); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -107482878101233.7 -50580177929992.33 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0281889097 0.0310017052 0.0779508635 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0281889097 0.0310017052 0.0779508635 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.0287067331 0.0779508635); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.0193940428 none 0.0764573956); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.0136716827 0.0251948144 none); +} diff --git a/spec/core_functions/color/to_space/display_p3/xyz_d50.hrx b/spec/core_functions/color/to_space/display_p3/xyz_d50.hrx new file mode 100644 index 0000000000..5bd4149c20 --- /dev/null +++ b/spec/core_functions/color/to_space/display_p3/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 1 1 1), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.5 0.5 0.5), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.2063989463 0.2140411405 0.1766063301); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.2 0.4 0.8), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.1507376549 0.1401604229 0.4790971056); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -1 0.4 2), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 0.3020960462 0.1805869911 3.8917991009); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 -999999 0 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -113795166948730.92 -53280831691639.766 231974346711.36108); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0263388599 0.0302094144 0.0588154349 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0263388599 0.0302094144 0.0588154349 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.0277919056 0.0588259602); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.0166719376 none 0.0574290645); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(display-p3 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.0148301452 0.0253333744 none); +} diff --git a/spec/core_functions/color/to_space/error.hrx b/spec/core_functions/color/to_space/error.hrx new file mode 100644 index 0000000000..1d0122ad3b --- /dev/null +++ b/spec/core_functions/color/to_space/error.hrx @@ -0,0 +1,89 @@ +<===> undefined_space/input.scss +@use 'sass:color'; +a {b: color.to-space(#abc, c)} + +<===> undefined_space/error +Error: $space: Unknown color space "c". + , +2 | a {b: color.to-space(#abc, c)} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> quoted_space/input.scss +@use 'sass:color'; +a {b: color.to-space(#abc, "hsl")} + +<===> quoted_space/error +Error: $space: Expected "hsl" to be an unquoted string. + , +2 | a {b: color.to-space(#abc, "hsl")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/input.scss +@use 'sass:color'; +a {b: color.to-space(#abc)} + +<===> too_few_args/error +Error: Missing argument $space. + ,--> input.scss +2 | a {b: color.to-space(#abc)} + | ^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function to-space($color, $space) { + | ======================== declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +@use 'sass:color'; +a {b: color.to-space(#abc, rgb, hsl)} + +<===> too_many_args/error +Error: Only 2 arguments allowed, but 3 were passed. + ,--> input.scss +2 | a {b: color.to-space(#abc, rgb, hsl)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function to-space($color, $space) { + | ======================== declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/color/input.scss +@use 'sass:color'; +a {b: color.to-space(1, rgb)} + +<===> type/color/error +Error: $color: 1 is not a color. + , +2 | a {b: color.to-space(1, rgb)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/space/input.scss +@use 'sass:color'; +a {b: color.to-space(#abc, #def)} + +<===> type/space/error +Error: $space: #def is not a string. + , +2 | a {b: color.to-space(#abc, #def)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/to_space/hsl/a98_rgb.hrx b/spec/core_functions/color/to_space/hsl/a98_rgb.hrx new file mode 100644 index 0000000000..3a29b9188d --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/a98_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.4961036984 0.4961036984 0.4961036984); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.6581397554 0.7142002384 0.4892168037); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), a98-rgb)} + +<===> float/output.css +a { + b: color(a98-rgb 0.6777775446 0.5562111042 0.4789015947); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -1.3133426101 -0.1822173447 0.4856606142); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb 8698.1693722094 -3093.7862337018 -10082.3258830858); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.3376779392 0.2673823092 0.2497033225 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.3376779392 0.2673823092 0.2497033225 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), a98-rgb)} + +<===> missing/hue/output.css +a { + b: color(a98-rgb 0.333838384 0.2489105042 0.2489105042); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), a98-rgb)} + +<===> missing/saturation/output.css +a { + b: color(a98-rgb 0.3046424286 0.3046424286 0.3046424286); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), a98-rgb)} + +<===> missing/lightness/output.css +a { + b: color(a98-rgb 0 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/display_p3.hrx b/spec/core_functions/color/to_space/hsl/display_p3.hrx new file mode 100644 index 0000000000..0a7daa3769 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/display_p3.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.5 0.5 0.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.655133397 0.7175281483 0.505602812); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), display-p3)} + +<===> float/output.css +a { + b: color(display-p3 0.6997472063 0.5677618984 0.490693255); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -1.3795832908 -0.3608862783 0.4233635373); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 4579.6059857545 -1251.0810767168 -4781.6821693604); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.3447505085 0.2640504184 0.244140094 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.3447505085 0.2640504184 0.244140094 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), display-p3)} + +<===> missing/hue/output.css +a { + b: color(display-p3 0.3423085422 0.2451135243 0.2426469173); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), display-p3)} + +<===> missing/saturation/output.css +a { + b: color(display-p3 0.3 0.3 0.3); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), display-p3)} + +<===> missing/lightness/output.css +a { + b: color(display-p3 0 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/hsl.hrx b/spec/core_functions/color/to_space/hsl/hsl.hrx new file mode 100644 index 0000000000..2739692dad --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/hsl.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 20% 40%), hsl)} + +<===> in_range/output.css +a { + b: hsl(0, 20%, 40%); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), hsl)} + +<===> out_of_range/output.css +a { + b: hsl(20, 200%, -50%); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), hsl)} + +<===> missing/hue/output.css +a { + b: hsl(none 20% 30%); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), hsl)} + +<===> missing/saturation/output.css +a { + b: hsl(10deg none 30%); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), hsl)} + +<===> missing/lightness/output.css +a { + b: hsl(10deg 20% none); +} diff --git a/spec/core_functions/color/to_space/hsl/hwb.hrx b/spec/core_functions/color/to_space/hsl/hwb.hrx new file mode 100644 index 0000000000..0e2cfb1a18 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/hwb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), hwb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), hwb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), hwb)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), hwb)} + +<===> middle/output.css +a { + b: hsl(80, 30%, 60%); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), hwb)} + +<===> float/output.css +a { + b: hsl(20.123456789, 30.987654321%, 60.192837465%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), hwb)} + +<===> out_of_range/near/output.css +a { + b: hsl(20, 200%, -50%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), hwb)} + +<===> out_of_range/far/output.css +a { + b: hsl(20, 999999%, 50%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), hwb)} + +<===> alpha/partial/output.css +a { + b: hsla(10, 20%, 30%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), hwb)} + +<===> alpha/transparent/output.css +a { + b: hsla(10, 20%, 30%, 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), hwb)} + +<===> missing/hue/output.css +a { + b: hsl(0, 20%, 30%); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), hwb)} + +<===> missing/saturation/output.css +a { + b: hsl(0, 0%, 30%); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), hwb)} + +<===> missing/lightness/output.css +a { + b: black; +} diff --git a/spec/core_functions/color/to_space/hsl/lab.hrx b/spec/core_functions/color/to_space/hsl/lab.hrx new file mode 100644 index 0000000000..bf3a6b1b90 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/lab.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), lab)} + +<===> gray/output.css +a { + b: lab(53.3889647411% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), lab)} + +<===> middle/output.css +a { + b: lab(71.9297767616% -15.056348508 28.7197360328); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), lab)} + +<===> float/output.css +a { + b: lab(63.0942649983% 14.1332827511 17.6588648805); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), lab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lab, color(xyz -1.0161268876 -0.540961491 0.1515884565) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), lab)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz 136956388.39988723 59264689.52803929 -623200798.6169883) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(30.8688486066% 10.7899742234 7.6662278505 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(30.8688486066% 10.7899742234 7.6662278505 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), lab)} + +<===> missing/hue/output.css +a { + b: lab(29.467709003% 13.8451863493 5.7231513228); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), lab)} + +<===> missing/saturation/output.css +a { + b: lab(32.5331750598% 0 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), lab)} + +<===> missing/lightness/output.css +a { + b: lab(none 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/lch.hrx b/spec/core_functions/color/to_space/hsl/lch.hrx new file mode 100644 index 0000000000..4414beb84d --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/lch.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), lch)} + +<===> gray/output.css +a { + b: lch(53.3889647411% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), lch)} + +<===> middle/output.css +a { + b: lch(71.9297767616% 32.4271008292 117.6658176085deg); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), lch)} + +<===> float/output.css +a { + b: lch(63.0942649983% 22.6182490522 51.3279458157deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), lch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lch, color(xyz -1.0161268876 -0.540961491 0.1515884565) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), lch)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz 136956388.67576775 59264689.51984791 -623200798.6134329) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(30.8688486066% 13.2361094434 35.393621554deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(30.8688486066% 13.2361094434 35.393621554deg / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), lch)} + +<===> missing/hue/output.css +a { + b: lch(29.467709003% 14.981443392 none); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), lch)} + +<===> missing/saturation/output.css +a { + b: lch(32.5331750598% none none); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), lch)} + +<===> missing/lightness/output.css +a { + b: lch(none 0 none); +} diff --git a/spec/core_functions/color/to_space/hsl/oklab.hrx b/spec/core_functions/color/to_space/hsl/oklab.hrx new file mode 100644 index 0000000000..b2b6515301 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/oklab.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), oklab)} + +<===> gray/output.css +a { + b: oklab(59.8180726623% 0 0.0000000223); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), oklab)} + +<===> middle/output.css +a { + b: oklab(75.0578295808% -0.0474046375 0.0717748467); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), oklab)} + +<===> float/output.css +a { + b: oklab(68.4523446414% 0.0396042277 0.0440734803); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), oklab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in oklab, color(xyz -1.0161268876 -0.540961491 0.1515884565) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), oklab)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz 136956388.3998871 59264689.52803931 -623200798.6169885) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(40.6685296273% 0.0313239047 0.0191932237 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(40.6685296273% 0.0313239047 0.0191932237 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), oklab)} + +<===> missing/hue/output.css +a { + b: oklab(39.5815064245% 0.0409008812 0.014221487); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), oklab)} + +<===> missing/saturation/output.css +a { + b: oklab(41.838943744% 0 0.0000000156); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), oklab)} + +<===> missing/lightness/output.css +a { + b: oklab(none 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/oklch.hrx b/spec/core_functions/color/to_space/hsl/oklch.hrx new file mode 100644 index 0000000000..f9fda4187d --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/oklch.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), oklch)} + +<===> gray/output.css +a { + b: oklch(59.8180726623% 0.0000000223 89.8755628286deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), oklch)} + +<===> middle/output.css +a { + b: oklch(75.0578295808% 0.0860164419 123.4432897448deg); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), oklch)} + +<===> float/output.css +a { + b: oklch(68.4523446414% 0.0592534093 48.0572806164deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), oklch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in oklch, color(xyz -1.0161268876 -0.540961491 0.1515884565) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), oklch)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz 136956388.39988703 59264689.52803931 -623200798.6169883) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(40.6685296273% 0.0367364512 31.4972209471deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(40.6685296273% 0.0367364512 31.4972209471deg / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), oklch)} + +<===> missing/hue/output.css +a { + b: oklch(39.5815064245% 0.0433028033 none); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), oklch)} + +<===> missing/saturation/output.css +a { + b: oklch(41.838943744% none 89.8755626743deg); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), oklch)} + +<===> missing/lightness/output.css +a { + b: oklch(none 0 none); +} diff --git a/spec/core_functions/color/to_space/hsl/prophoto_rgb.hrx b/spec/core_functions/color/to_space/hsl/prophoto_rgb.hrx new file mode 100644 index 0000000000..c06257a9b2 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/prophoto_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.4246723949 0.4246723949 0.4246723949); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.583675038 0.6482529636 0.4440565473); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), prophoto-rgb)} + +<===> float/output.css +a { + b: color(prophoto-rgb 0.5797795588 0.5061830996 0.4192105931); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb -1.16705518 -0.4773670849 0.334978827); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb 45494.0440115899 5344.0720850434 -73058.7852099565); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.2477526404 0.2091534142 0.1870234357 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.2477526404 0.2091534142 0.1870234357 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), prophoto-rgb)} + +<===> missing/hue/output.css +a { + b: color(prophoto-rgb 0.2432349971 0.1951926314 0.1850133783); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), prophoto-rgb)} + +<===> missing/saturation/output.css +a { + b: color(prophoto-rgb 0.2340459828 0.2340459828 0.2340459828); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), prophoto-rgb)} + +<===> missing/lightness/output.css +a { + b: color(prophoto-rgb 0 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/rec2020.hrx b/spec/core_functions/color/to_space/hsl/rec2020.hrx new file mode 100644 index 0000000000..6c3b33cc50 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/rec2020.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.4500400319 0.4500400319 0.4500400319); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.6252433371 0.6805013998 0.4608722597); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), rec2020)} + +<===> float/output.css +a { + b: color(rec2020 0.6312163333 0.5293329902 0.4413441586); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -1.2552227887 -0.4270321041 0.3660380417); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 7903.4152677186 -1170.118178736 -9706.8206181475); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.2670145784 0.2070036582 0.18272592 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.2670145784 0.2070036582 0.18272592 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), rec2020)} + +<===> missing/hue/output.css +a { + b: color(rec2020 0.2619751449 0.1889937521 0.1808798805); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), rec2020)} + +<===> missing/saturation/output.css +a { + b: color(rec2020 0.2397416118 0.2397416118 0.2397416118); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), rec2020)} + +<===> missing/lightness/output.css +a { + b: color(rec2020 0 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/rgb.hrx b/spec/core_functions/color/to_space/hsl/rgb.hrx new file mode 100644 index 0000000000..08fc696e43 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), rgb)} + +<===> gray/output.css +a { + b: rgb(127.5, 127.5, 127.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), rgb)} + +<===> middle/output.css +a { + b: rgb(163.2, 183.6, 122.4); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), rgb)} + +<===> float/output.css +a { + b: rgb(184.9467656352, 143.1361700697, 122.0367054363); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(20, 200%, -50%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(20, 999999%, 50%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: rgba(91.8, 66.3, 61.2, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: rgba(91.8, 66.3, 61.2, 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), rgb)} + +<===> missing/hue/output.css +a { + b: rgb(91.8, 61.2, 61.2); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), rgb)} + +<===> missing/saturation/output.css +a { + b: rgb(76.5, 76.5, 76.5); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), rgb)} + +<===> missing/lightness/output.css +a { + b: black; +} diff --git a/spec/core_functions/color/to_space/hsl/srgb.hrx b/spec/core_functions/color/to_space/hsl/srgb.hrx new file mode 100644 index 0000000000..c8fdd63fd2 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/srgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.5 0.5 0.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.64 0.72 0.48); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), srgb)} + +<===> float/output.css +a { + b: color(srgb 0.7252814339 0.561318314 0.4785753154); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -1.5 -0.1666666667 0.5); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb 5000.495 -1666.165 -4999.495); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.36 0.26 0.24 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.36 0.26 0.24 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), srgb)} + +<===> missing/hue/output.css +a { + b: color(srgb 0.36 0.24 0.24); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), srgb)} + +<===> missing/saturation/output.css +a { + b: color(srgb 0.3 0.3 0.3); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), srgb)} + +<===> missing/lightness/output.css +a { + b: color(srgb 0 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/srgb_linear.hrx b/spec/core_functions/color/to_space/hsl/srgb_linear.hrx new file mode 100644 index 0000000000..eba0eeac34 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/srgb_linear.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.2140411405 0.2140411405 0.2140411405); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.3672464682 0.4769997846 0.1959941793); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), srgb-linear)} + +<===> float/output.css +a { + b: color(srgb-linear 0.4848385603 0.2752493311 0.1947438934); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -2.5371552394 -0.0236523902 0.2140411405); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear 663493625.4651376 -47462621.32578329 -663175228.1293004); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.106539224 0.0549717327 0.0469642007 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.106539224 0.0549717327 0.0469642007 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), srgb-linear)} + +<===> missing/hue/output.css +a { + b: color(srgb-linear 0.106539224 0.0469642007 0.0469642007); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), srgb-linear)} + +<===> missing/saturation/output.css +a { + b: color(srgb-linear 0.0732389559 0.0732389559 0.0732389559); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), srgb-linear)} + +<===> missing/lightness/output.css +a { + b: color(srgb-linear 0 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/xyz.hrx b/spec/core_functions/color/to_space/hsl/xyz.hrx new file mode 100644 index 0000000000..a745994d19 --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/xyz.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.2034366706 0.2140411405 0.233103163); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.3573899014 0.4333755032 0.2502538283); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), xyz)} + +<===> float/output.css +a { + b: color(xyz 0.333515343 0.3140043025 0.2272909419); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz -1.0161268876 -0.540961491 0.1515884565); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz 136956388.39988744 59264689.52803937 -623200798.6169885); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0720689624 0.0653589105 0.0532528168 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0720689624 0.0653589105 0.0532528168 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), xyz)} + +<===> missing/hue/output.css +a { + b: color(xyz 0.0692055944 0.0596321744 0.0522983607); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), xyz)} + +<===> missing/saturation/output.css +a { + b: color(xyz 0.0696103997 0.0732389559 0.0797614526); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), xyz)} + +<===> missing/lightness/output.css +a { + b: color(xyz 0 0 0); +} diff --git a/spec/core_functions/color/to_space/hsl/xyz_d50.hrx b/spec/core_functions/color/to_space/hsl/xyz_d50.hrx new file mode 100644 index 0000000000..43a75aaf5a --- /dev/null +++ b/spec/core_functions/color/to_space/hsl/xyz_d50.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 0%), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 100%), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(0deg 0% 50%), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.2063989463 0.2140411405 0.1766063301); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(80deg 30% 60%), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.37190333 0.4355459142 0.1913805991); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), xyz-d50)} + +<===> float/output.css +a { + b: color(xyz-d50 0.3452978329 0.3170012803 0.1725389126); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 200% -50%), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 -1.08485158 -0.5684806881 0.1152232851); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(20deg 999999% 50%), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 176160479.28127974 73395911.69654827 -468942304.8608692); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0743501157 0.0659597326 0.0403572779 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% 30% / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0743501157 0.0659597326 0.0403572779 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(none 20% 30%), xyz-d50)} + +<===> missing/hue/output.css +a { + b: color(xyz-d50 0.0712660027 0.0602192369 0.0395798961); +} + +<===> +================================================================================ +<===> missing/saturation/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg none 30%), xyz-d50)} + +<===> missing/saturation/output.css +a { + b: color(xyz-d50 0.0706240085 0.0732389559 0.0604297996); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(hsl(10deg 20% none), xyz-d50)} + +<===> missing/lightness/output.css +a { + b: color(xyz-d50 0 0 0); +} diff --git a/spec/core_functions/color/to_space/hwb/a98_rgb.hrx b/spec/core_functions/color/to_space/hwb/a98_rgb.hrx new file mode 100644 index 0000000000..92c8a3f06c --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/a98_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.4961036984 0.4961036984 0.4961036984); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.505098443 0.5944145344 0.24376153); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), a98-rgb)} + +<===> float/output.css +a { + b: color(a98-rgb 0.5470366266 0.4056690546 0.3183176738); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb 2.295663911 2.1618962385 2.073992407); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb 21869.1993352833 21868.6190794601 21868.2300804636); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.6114401635 0.2890681375 0.2161347988 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.6114401635 0.2890681375 0.2161347988 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), a98-rgb)} + +<===> missing/hue/output.css +a { + b: color(a98-rgb 0.6038713799 0.2123166098 0.2123166098); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), a98-rgb)} + +<===> missing/whiteness/output.css +a { + b: color(a98-rgb 0.5990338556 0.1378605656 0.0323177975); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), a98-rgb)} + +<===> missing/blackness/output.css +a { + b: color(a98-rgb 0.8725825543 0.3359890414 0.2191164159); +} diff --git a/spec/core_functions/color/to_space/hwb/display_p3.hrx b/spec/core_functions/color/to_space/hwb/display_p3.hrx new file mode 100644 index 0000000000..00f265a145 --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/display_p3.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.5 0.5 0.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.4937237179 0.5961714385 0.263280729); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), display-p3)} + +<===> float/output.css +a { + b: color(display-p3 0.5699167279 0.4147338146 0.3256408713); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 2.221649714 2.0891595287 2.0108056307); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 10000.4396382509 10000.1712862873 10000.0110201331); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.6499865104 0.3093627099 0.2280296402 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.6499865104 0.3093627099 0.2280296402 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), display-p3)} + +<===> missing/hue/output.css +a { + b: color(display-p3 0.6455550546 0.2397703326 0.2214676273); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), display-p3)} + +<===> missing/whiteness/output.css +a { + b: color(display-p3 0.6427370384 0.1801457354 0.0902798862); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), display-p3)} + +<===> missing/blackness/output.css +a { + b: color(display-p3 0.9253883052 0.3826332802 0.2571893552); +} diff --git a/spec/core_functions/color/to_space/hwb/hsl.hrx b/spec/core_functions/color/to_space/hwb/hsl.hrx new file mode 100644 index 0000000000..7b449c7cac --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/hsl.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), hsl)} + +<===> middle/output.css +a { + b: hsl(80, 50%, 40%); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), hsl)} + +<===> float/output.css +a { + b: hsl(20.123456789, 31.7413583858%, 45.397408428%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(200, 11.1111111111%, 212.5%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(200, 0.0025501925%, 1000024.4999999999%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(10, 55.5555555556%, 45%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(10, 55.5555555556%, 45%, 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), hsl)} + +<===> missing/hue/output.css +a { + b: hsl(0, 55.5555555556%, 45%); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), hsl)} + +<===> missing/whiteness/output.css +a { + b: hsl(10, 100%, 35%); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), hsl)} + +<===> missing/blackness/output.css +a { + b: hsl(10, 100%, 60%); +} diff --git a/spec/core_functions/color/to_space/hwb/hwb.hrx b/spec/core_functions/color/to_space/hwb/hwb.hrx new file mode 100644 index 0000000000..85748076dc --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/hwb.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 20% 30%), hwb)} + +<===> in_range/output.css +a { + b: hsl(0, 55.5555555556%, 45%); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), hwb)} + +<===> out_of_range/output.css +a { + b: hsl(200, 11.1111111111%, 212.5%); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), hsl)} + +<===> missing/hue/output.css +a { + b: hsl(0, 55.5555555556%, 45%); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), hsl)} + +<===> missing/whiteness/output.css +a { + b: hsl(10, 100%, 35%); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), hsl)} + +<===> missing/blackness/output.css +a { + b: hsl(10, 100%, 60%); +} diff --git a/spec/core_functions/color/to_space/hwb/lab.hrx b/spec/core_functions/color/to_space/hwb/lab.hrx new file mode 100644 index 0000000000..32f1bf6a5e --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/lab.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), lab)} + +<===> gray/output.css +a { + b: lab(53.3889647411% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), lab)} + +<===> middle/output.css +a { + b: lab(59.1049141497% -23.929516442 47.3632808755); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), lab)} + +<===> float/output.css +a { + b: lab(48.7209664558% 18.0179342003 22.2207931535); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), lab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lab, color(xyz 5.5338099778 5.6426521513 5.4845096668) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), lab)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz 3327825161.664072 3501247104.3035965 3812875110.896886) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(45.4228859316% 43.1656753022 35.3539928676 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(45.4228859316% 43.1656753022 35.3539928676 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), lab)} + +<===> missing/hue/output.css +a { + b: lab(42.0638915398% 51.8940588399 31.6507145358); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), lab)} + +<===> missing/whiteness/output.css +a { + b: lab(39.3870160342% 57.3703400949 53.7905111747); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), lab)} + +<===> missing/blackness/output.css +a { + b: lab(60.7483623827% 64.2863186591 55.7098309346); +} diff --git a/spec/core_functions/color/to_space/hwb/lch.hrx b/spec/core_functions/color/to_space/hwb/lch.hrx new file mode 100644 index 0000000000..1739ce2ab6 --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/lch.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), lch)} + +<===> gray/output.css +a { + b: lch(53.3889647411% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), lch)} + +<===> middle/output.css +a { + b: lch(59.1049141497% 53.0650745071 116.8044348895deg); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), lch)} + +<===> float/output.css +a { + b: lch(48.7209664558% 28.6078590813 50.9628149158deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), lch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lch, color(xyz 5.5338099778 5.6426521513 5.4845096668) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), lch)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz 3327825161.664072 3501247104.3035965 3812875110.896886) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(45.4228859316% 55.7958809947 39.3185127962deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(45.4228859316% 55.7958809947 39.3185127962deg / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), lch)} + +<===> missing/hue/output.css +a { + b: lch(42.0638915398% 60.7845463379 none); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), lch)} + +<===> missing/whiteness/output.css +a { + b: lch(39.3870160342% 78.6433405639 43.1554816825deg); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), lch)} + +<===> missing/blackness/output.css +a { + b: lch(60.7483623827% 85.0665388358 40.9118491907deg); +} diff --git a/spec/core_functions/color/to_space/hwb/oklab.hrx b/spec/core_functions/color/to_space/hwb/oklab.hrx new file mode 100644 index 0000000000..8fd0ad2801 --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/oklab.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), oklab)} + +<===> gray/output.css +a { + b: oklab(59.8180726623% 0 0.0000000223); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), oklab)} + +<===> middle/output.css +a { + b: oklab(63.6472338735% -0.0788719974 0.109198804); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), oklab)} + +<===> float/output.css +a { + b: oklab(56.1528329965% 0.0492061827 0.0538160955); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(178.3874934308% 0.030918886 0.0348813541); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), oklab)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz 3327825161.6640716 3501247104.3035994 3812875110.896889) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(54.0481985043% 0.1200265651 0.0782231914 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(54.0481985043% 0.1200265651 0.0782231914 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), oklab)} + +<===> missing/hue/output.css +a { + b: oklab(51.4791394597% 0.1488491412 0.0695742279); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), oklab)} + +<===> missing/whiteness/output.css +a { + b: oklab(49.2675905721% 0.1574612806 0.0989515664); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), oklab)} + +<===> missing/blackness/output.css +a { + b: oklab(67.8199997859% 0.1771510758 0.1158916741); +} diff --git a/spec/core_functions/color/to_space/hwb/oklch.hrx b/spec/core_functions/color/to_space/hwb/oklch.hrx new file mode 100644 index 0000000000..9604330b0f --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/oklch.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), oklch)} + +<===> gray/output.css +a { + b: oklch(59.8180726623% 0.0000000223 89.8755628286deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), oklch)} + +<===> middle/output.css +a { + b: oklch(63.6472338735% 0.1347040117 125.8397889312deg); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), oklch)} + +<===> float/output.css +a { + b: oklch(56.1528329965% 0.0729206456 47.5620912167deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(178.3874934308% 0.0466120839 48.4461706648deg); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), oklch)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz 3327825161.6640716 3501247104.3035994 3812875110.896889) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(54.0481985043% 0.1432663394 33.0929168902deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(54.0481985043% 0.1432663394 33.0929168902deg / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), oklch)} + +<===> missing/hue/output.css +a { + b: oklch(51.4791394597% 0.1643065429 none); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), oklch)} + +<===> missing/whiteness/output.css +a { + b: oklch(49.2675905721% 0.1859716843 32.1460100423deg); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), oklch)} + +<===> missing/blackness/output.css +a { + b: oklch(67.8199997859% 0.2116917187 33.1925848215deg); +} diff --git a/spec/core_functions/color/to_space/hwb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/hwb/prophoto_rgb.hrx new file mode 100644 index 0000000000..b7a59a9136 --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/prophoto_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.4246723949 0.4246723949 0.4246723949); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.4173696362 0.5097373596 0.226865426); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), prophoto-rgb)} + +<===> float/output.css +a { + b: color(prophoto-rgb 0.4353235123 0.3529407495 0.2611635846); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb 2.6931467502 2.5889839276 2.4557122588); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb 200609.520572436 200606.1129393156 200601.5646967502); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.4764700867 0.2813317076 0.1760974536 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.4764700867 0.2813317076 0.1760974536 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), prophoto-rgb)} + +<===> missing/hue/output.css +a { + b: color(prophoto-rgb 0.4657013132 0.2352440242 0.1674964522); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), prophoto-rgb)} + +<===> missing/whiteness/output.css +a { + b: color(prophoto-rgb 0.4539567276 0.2001286929 0.0733250158); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), prophoto-rgb)} + +<===> missing/blackness/output.css +a { + b: color(prophoto-rgb 0.7274254108 0.3840965619 0.2020562891); +} diff --git a/spec/core_functions/color/to_space/hwb/rec2020.hrx b/spec/core_functions/color/to_space/hwb/rec2020.hrx new file mode 100644 index 0000000000..e1843dc52d --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/rec2020.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.4500400319 0.4500400319 0.4500400319); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.459214681 0.5459336036 0.2122890002); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), rec2020)} + +<===> float/output.css +a { + b: color(rec2020 0.4867284206 0.3676626536 0.2677057789); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 2.3816237298 2.2717034049 2.1734869236); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 21678.0429642711 21677.6112716515 21677.2173996703); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.5439867892 0.2751629629 0.1667560186 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.5439867892 0.2751629629 0.1667560186 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), rec2020)} + +<===> missing/hue/output.css +a { + b: color(rec2020 0.5338070059 0.2147334666 0.158678854); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), rec2020)} + +<===> missing/whiteness/output.css +a { + b: color(rec2020 0.5258638966 0.1667450692 0.0381165436); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), rec2020)} + +<===> missing/blackness/output.css +a { + b: color(rec2020 0.8117472221 0.3730204781 0.1963814934); +} diff --git a/spec/core_functions/color/to_space/hwb/rgb.hrx b/spec/core_functions/color/to_space/hwb/rgb.hrx new file mode 100644 index 0000000000..b5faeef92a --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), rgb)} + +<===> gray/output.css +a { + b: rgb(127.5, 127.5, 127.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), rgb)} + +<===> middle/output.css +a { + b: #779933; +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), rgb)} + +<===> float/output.css +a { + b: rgb(152.5082644643, 103.6663139681, 79.0185185186); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(200, 11.1111111111%, 212.5%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(200, 0.0025501925%, 1000024.4999999999%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: rgba(178.5, 72.25, 51, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: rgba(178.5, 72.25, 51, 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), rgb)} + +<===> missing/hue/output.css +a { + b: rgb(178.5, 51, 51); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), rgb)} + +<===> missing/whiteness/output.css +a { + b: rgb(178.5, 29.75, 0); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), rgb)} + +<===> missing/blackness/output.css +a { + b: #ff5533; +} diff --git a/spec/core_functions/color/to_space/hwb/srgb.hrx b/spec/core_functions/color/to_space/hwb/srgb.hrx new file mode 100644 index 0000000000..bb90b12a95 --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/srgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.5 0.5 0.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.4666666667 0.6 0.2); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), srgb)} + +<===> float/output.css +a { + b: color(srgb 0.5980716254 0.4065345646 0.3098765432); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb 2.25 2.0833333333 2); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb 10000.5 10000.16 9999.99); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.7 0.2833333333 0.2 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.7 0.2833333333 0.2 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), srgb)} + +<===> missing/hue/output.css +a { + b: color(srgb 0.7 0.2 0.2); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), srgb)} + +<===> missing/whiteness/output.css +a { + b: color(srgb 0.7 0.1166666667 0); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), srgb)} + +<===> missing/blackness/output.css +a { + b: color(srgb 1 0.3333333333 0.2); +} diff --git a/spec/core_functions/color/to_space/hwb/srgb_linear.hrx b/spec/core_functions/color/to_space/hwb/srgb_linear.hrx new file mode 100644 index 0000000000..7e4b5a0c85 --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/srgb_linear.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.2140411405 0.2140411405 0.2140411405); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.1844749945 0.3185467781 0.0331047666); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), srgb-linear)} + +<===> float/output.css +a { + b: color(srgb-linear 0.316300627 0.1374941598 0.0782247825); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear 6.5253577732 5.4497310669 4.9538457516); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear 3501482364.2479005 3501196665.942984 3501053821.890021); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.4479884124 0.0652561709 0.0331047666 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.4479884124 0.0652561709 0.0331047666 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), srgb-linear)} + +<===> missing/hue/output.css +a { + b: color(srgb-linear 0.4479884124 0.0331047666 0.0331047666); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), srgb-linear)} + +<===> missing/whiteness/output.css +a { + b: color(srgb-linear 0.4479884124 0.0128067943 0); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), srgb-linear)} + +<===> missing/blackness/output.css +a { + b: color(srgb-linear 1 0.0908417112 0.0331047666); +} diff --git a/spec/core_functions/color/to_space/hwb/xyz.hrx b/spec/core_functions/color/to_space/hwb/xyz.hrx new file mode 100644 index 0000000000..7938a22570 --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/xyz.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.2034366706 0.2140411405 0.233103163); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.195957904 0.2694311676 0.0730023108); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), xyz)} + +<===> float/output.css +a { + b: color(xyz 0.1937232971 0.1712365957 0.0968581071); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 5.5338099778 5.6426521513 5.4845096668); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz 3327825161.6640773 3501247104.3036017 3812875110.896892); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.2140556586 0.14431889 0.0479053227 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.2140556586 0.14431889 0.0479053227 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), xyz)} + +<===> missing/hue/output.css +a { + b: color(xyz 0.2025588199 0.1213252126 0.0440730432); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), xyz)} + +<===> missing/whiteness/output.css +a { + b: color(xyz 0.1893258086 0.1044188288 0.0101864858); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), xyz)} + +<===> missing/blackness/output.css +a { + b: color(xyz 0.4508491469 0.2799960622 0.0616258215); +} diff --git a/spec/core_functions/color/to_space/hwb/xyz_d50.hrx b/spec/core_functions/color/to_space/hwb/xyz_d50.hrx new file mode 100644 index 0000000000..c1da6bfc0b --- /dev/null +++ b/spec/core_functions/color/to_space/hwb/xyz_d50.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 0% 100%), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 100% 0%), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(0deg 50% 50%), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.2063989463 0.2140411405 0.1766063301); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(80deg 20% 40%), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.2078685764 0.2714132806 0.0571336509); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), xyz-d50)} + +<===> float/output.css +a { + b: color(xyz-d50 0.2020762306 0.1736844804 0.0736125271); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 200% -125%), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 5.6532455812 5.6589901967 4.1574637428); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(20deg 999999% -999950%), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 3376292952.6417513 3501251572.6872187 2888755456.5582485); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.2252224921 0.1484624713 0.0362130035 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% 30% / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.2252224921 0.1484624713 0.0362130035 / 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(none 20% 30%), xyz-d50)} + +<===> missing/hue/output.css +a { + b: color(xyz-d50 0.2128393302 0.1254135471 0.0330917026); +} + +<===> +================================================================================ +<===> missing/whiteness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg none 30%), xyz-d50)} + +<===> missing/whiteness/output.css +a { + b: color(xyz-d50 0.2002849578 0.1088553897 0.007481056); +} + +<===> +================================================================================ +<===> missing/blackness/input.scss +@use 'sass:color'; +a {b: color.to-space(hwb(10deg 20% none), xyz-d50)} + +<===> missing/blackness/output.css +a { + b: color(xyz-d50 0.4757901468 0.2896232248 0.0463830476); +} diff --git a/spec/core_functions/color/to_space/lab/a98_rgb.hrx b/spec/core_functions/color/to_space/lab/a98_rgb.hrx new file mode 100644 index 0000000000..76ea6d2bf8 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/a98_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.4633483808 0.4633483808 0.4633483808); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.4993446464 0.3405847685 0.9621105751); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -0.3527883779 -0.1750269182 -0.4390573819); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -16.6598712578 12.1485560974 -2.4112643287); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.2039535001 0.0808226659 -0.1242620432 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.2039535001 0.0808226659 -0.1242620432 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), a98-rgb)} + +<===> missing/lightness/output.css +a { + b: color(a98-rgb 0.1487894196 -0.0929319593 -0.1737307511); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), a98-rgb)} + +<===> missing/a/output.css +a { + b: color(a98-rgb 0.1557107469 0.1271683781 -0.125356279); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), a98-rgb)} + +<===> missing/b/output.css +a { + b: color(a98-rgb 0.1862731835 0.0856347366 0.1310611506); +} diff --git a/spec/core_functions/color/to_space/lab/display_p3.hrx b/spec/core_functions/color/to_space/lab/display_p3.hrx new file mode 100644 index 0000000000..455c576c92 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.4663266093 0.4663266093 0.4663266093); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.5227133162 0.348060966 0.9452485417); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -0.3704020725 -0.1731154433 -0.4345219765); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -15.0614491889 9.7148006078 -2.8909250239); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.2036678394 0.0627355423 -0.092163728 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.2036678394 0.0627355423 -0.092163728 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), display-p3)} + +<===> missing/lightness/output.css +a { + b: color(display-p3 0.1438618115 -0.0552726461 -0.1517242634); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), display-p3)} + +<===> missing/a/output.css +a { + b: color(display-p3 0.1411767229 0.1061424169 -0.0944472015); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), display-p3)} + +<===> missing/b/output.css +a { + b: color(display-p3 0.1823778479 0.0651398083 0.1096920557); +} diff --git a/spec/core_functions/color/to_space/lab/hsl.hrx b/spec/core_functions/color/to_space/lab/hsl.hrx new file mode 100644 index 0000000000..bb7b47371f --- /dev/null +++ b/spec/core_functions/color/to_space/lab/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 46.6326609284%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), hsl)} + +<===> middle/output.css +a { + b: hsl(260.0900301863, 93.9881625698%, 65.88440774%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(289.8791142497, 47.7721599837%, -30.374201454%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(329.5753543003, 419.147137703%, -324.1554346051%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(28.3698264077, 277.3239474447%, 5.9154081349%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(28.3698264077, 277.3239474447%, 5.9154081349%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), hsl)} + +<===> missing/lightness/output.css +a { + b: hsl(17.5913578322, 6051.6428880588%, 0%); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), hsl)} + +<===> missing/a/output.css +a { + b: hsl(49.7972674498, 639.4765067331%, 2.0005058387%); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), hsl)} + +<===> missing/b/output.css +a { + b: hsl(337.1245847104, 56.1707811732%, 12.7694440441%); +} diff --git a/spec/core_functions/color/to_space/lab/hwb.hrx b/spec/core_functions/color/to_space/lab/hwb.hrx new file mode 100644 index 0000000000..7ca3d0c5d6 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/hwb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), hwb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), hwb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), hwb)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 46.6326609284%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), hwb)} + +<===> middle/output.css +a { + b: hsl(260.0900301863, 93.9881625698%, 65.88440774%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), hwb)} + +<===> out_of_range/near/output.css +a { + b: hsl(289.8791142497, 47.7721599837%, -30.374201454%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), hwb)} + +<===> out_of_range/far/output.css +a { + b: hsl(329.5753543003, 419.147137703%, -324.1554346051%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), hwb)} + +<===> alpha/partial/output.css +a { + b: hsla(28.3698264077, 277.3239474447%, 5.9154081349%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), hwb)} + +<===> alpha/transparent/output.css +a { + b: hsla(28.3698264077, 277.3239474447%, 5.9154081349%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), hwb)} + +<===> missing/lightness/output.css +a { + b: hsl(17.5913578322, 6051.6428880587%, 0.2688304082%); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), hwb)} + +<===> missing/a/output.css +a { + b: hsl(49.7972674498, 639.4765067331%, 2.0005058387%); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), hwb)} + +<===> missing/b/output.css +a { + b: hsl(337.1245847104, 56.1707811732%, 12.7694440441%); +} diff --git a/spec/core_functions/color/to_space/lab/lab.hrx b/spec/core_functions/color/to_space/lab/lab.hrx new file mode 100644 index 0000000000..8adb6ffcf9 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/lab.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), lab)} + +<===> in_range/output.css +a { + b: lab(50% 50 -75); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -150 150), lab)} + +<===> out_of_range/output.css +a { + b: lab(50% -150 150); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), lab)} + +<===> missing/lightness/output.css +a { + b: lab(none 20 30); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), lab)} + +<===> missing/a/output.css +a { + b: lab(10% none 30); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), lab)} + +<===> missing/b/output.css +a { + b: lab(10% 20 none); +} diff --git a/spec/core_functions/color/to_space/lab/lch.hrx b/spec/core_functions/color/to_space/lab/lch.hrx new file mode 100644 index 0000000000..dc10290577 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/lch.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), lch)} + +<===> gray/output.css +a { + b: lch(50% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), lch)} + +<===> middle/output.css +a { + b: lch(50% 90.1387818866 303.690067526deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), lch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lch, color(xyz -0.0931334424 -0.0559710307 -0.1664628061) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), lch)} + +<===> out_of_range/far/output.css +a { + b: lch(50% 999999 180deg); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(10% 36.0555127546 56.309932474deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(10% 36.0555127546 56.309932474deg / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), lch)} + +<===> missing/lightness/output.css +a { + b: lch(none 36.0555127546 56.309932474deg); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), lch)} + +<===> missing/a/output.css +a { + b: lch(10% 30 90deg); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), lch)} + +<===> missing/b/output.css +a { + b: lch(10% 20 0deg); +} diff --git a/spec/core_functions/color/to_space/lab/oklab.hrx b/spec/core_functions/color/to_space/lab/oklab.hrx new file mode 100644 index 0000000000..bc5714f240 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/oklab.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), oklab)} + +<===> gray/output.css +a { + b: oklab(56.8965513528% 0 0.0000000212); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), oklab)} + +<===> middle/output.css +a { + b: oklab(60.2352362176% 0.0926046157 -0.2110438209); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), oklab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in oklab, color(xyz -0.0931334424 -0.0559710307 -0.1664628061) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), oklab)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -236.5825482412 7.2139420412 -2.8507109462) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(22.8064235198% -0.061853134 0.2798052355 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(22.8064235198% -0.061853134 0.2798052355 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), oklab)} + +<===> missing/lightness/output.css +a { + b: oklab(none 0.4936529727 0.1158908016); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), oklab)} + +<===> missing/a/output.css +a { + b: oklab(22.1884319419% none 0.2838925277); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), oklab)} + +<===> missing/b/output.css +a { + b: oklab(23.0834632697% 0.0614345595 none); +} diff --git a/spec/core_functions/color/to_space/lab/oklch.hrx b/spec/core_functions/color/to_space/lab/oklch.hrx new file mode 100644 index 0000000000..3b514f14f9 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/oklch.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), oklch)} + +<===> gray/output.css +a { + b: oklch(56.8965513528% 0.0000000212 89.8755629589deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), oklch)} + +<===> middle/output.css +a { + b: oklch(60.2352362176% 0.2304671542 293.6915443769deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), oklch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in oklch, color(xyz -0.0931334424 -0.0559710307 -0.1664628061) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), oklch)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -236.5825482412 7.2139420412 -2.8507109462) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(22.8064235198% 0.2865602554 102.4652159995deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(22.8064235198% 0.2865602554 102.4652159995deg / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), oklch)} + +<===> missing/lightness/output.css +a { + b: oklch(none 0.5070738953 13.2116104316deg); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), oklch)} + +<===> missing/a/output.css +a { + b: oklch(22.1884319419% 0.3083157518 112.9588813999deg); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), oklch)} + +<===> missing/b/output.css +a { + b: oklch(23.0834632697% 0.0614385657 359.3456866656deg); +} diff --git a/spec/core_functions/color/to_space/lab/prophoto_rgb.hrx b/spec/core_functions/color/to_space/lab/prophoto_rgb.hrx new file mode 100644 index 0000000000..a749af49c7 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.3906698633 0.3906698633 0.3906698633); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.5179210602 0.3284958504 0.9083646327); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb -0.2802411013 -0.1595613747 -0.3507026734); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -25.2096957329 15.2674513494 0.3906698633); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.1181031255 0.0643408567 -0.0693072402 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.1181031255 0.0643408567 -0.0693072402 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), prophoto-rgb)} + +<===> missing/lightness/output.css +a { + b: color(prophoto-rgb 0.0658841117 -0.0398403518 -0.1114464198); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), prophoto-rgb)} + +<===> missing/a/output.css +a { + b: color(prophoto-rgb 0.085998245 0.0813505708 -0.0693072402); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), prophoto-rgb)} + +<===> missing/b/output.css +a { + b: color(prophoto-rgb 0.1155645311 0.0659678734 0.0827038254); +} diff --git a/spec/core_functions/color/to_space/lab/rec2020.hrx b/spec/core_functions/color/to_space/lab/rec2020.hrx new file mode 100644 index 0000000000..46bdeca5a6 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.4141328903 0.4141328903 0.4141328903); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.4782548936 0.3165685667 0.9316090731); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -0.2868532205 -0.1310027915 -0.3772590396); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -16.3406051212 10.9684505106 -2.5677472313); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.115034011 0.0285101795 -0.0389460082 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.115034011 0.0285101795 -0.0389460082 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), rec2020)} + +<===> missing/lightness/output.css +a { + b: color(rec2020 0.0535921266 -0.0161333028 -0.0888018246); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), rec2020)} + +<===> missing/a/output.css +a { + b: color(rec2020 0.0677133777 0.0497451668 -0.0398688899); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), rec2020)} + +<===> missing/b/output.css +a { + b: color(rec2020 0.1006265985 0.0294359094 0.0515937784); +} diff --git a/spec/core_functions/color/to_space/lab/rgb.hrx b/spec/core_functions/color/to_space/lab/rgb.hrx new file mode 100644 index 0000000000..7a0d2828f8 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), rgb)} + +<===> gray/output.css +a { + b: rgb(118.9132853673, 118.9132853673, 118.9132853673); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), rgb)} + +<===> middle/output.css +a { + b: rgb(140.9956907717, 86.2404630336, 249.7700164402); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(289.8791142497, 47.7721599837%, -30.374201454%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(329.5753543003, 419.147137703%, -324.1554346051%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: hsla(28.3698264077, 277.3239474447%, 5.9154081349%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: hsla(28.3698264077, 277.3239474447%, 5.9154081349%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), rgb)} + +<===> missing/lightness/output.css +a { + b: hsl(17.5913578322, 6051.6428880588%, 0.2688304082%); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), rgb)} + +<===> missing/a/output.css +a { + b: hsl(49.7972674498, 639.4765067331%, 2.0005058387%); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), rgb)} + +<===> missing/b/output.css +a { + b: rgb(50.8524583137, 14.2717063113, 28.2183712056); +} diff --git a/spec/core_functions/color/to_space/lab/srgb.hrx b/spec/core_functions/color/to_space/lab/srgb.hrx new file mode 100644 index 0000000000..051129a683 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.4663266093 0.4663266093 0.4663266093); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.5529242775 0.3381978942 0.9794902605); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -0.3998933946 -0.1586378934 -0.4488461357); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -16.8284366046 10.3453279125 -3.4338747169); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.2232025148 0.0502398339 -0.1048943521 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.2232025148 0.0502398339 -0.1048943521 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), srgb)} + +<===> missing/lightness/output.css +a { + b: color(srgb 0.1653748669 -0.0646023407 -0.1599982587); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), srgb)} + +<===> missing/a/output.css +a { + b: color(srgb 0.1479327069 0.1044256541 -0.1079225902); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), srgb)} + +<===> missing/b/output.css +a { + b: color(srgb 0.1994214052 0.0559674757 0.1106602792); +} diff --git a/spec/core_functions/color/to_space/lab/srgb_linear.hrx b/spec/core_functions/color/to_space/lab/srgb_linear.hrx new file mode 100644 index 0000000000..b1571e3e32 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.1841865185 0.1841865185 0.1841865185); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.2663378358 0.0935967862 0.9539760505); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -0.1327936201 -0.0216482097 -0.1697106644); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -776.4261256147 242.720788708 -17.6457042383); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.040800043 0.0039575505 -0.01079925 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.040800043 0.0039575505 -0.01079925 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), srgb-linear)} + +<===> missing/lightness/output.css +a { + b: color(srgb-linear 0.0233229267 -0.0053798396 -0.0219805198); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), srgb-linear)} + +<===> missing/a/output.css +a { + b: color(srgb-linear 0.0191354647 0.0107234318 -0.0112966385); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), srgb-linear)} + +<===> missing/b/output.css +a { + b: color(srgb-linear 0.0329247775 0.004494318 0.0117575878); +} diff --git a/spec/core_functions/color/to_space/lab/xyz.hrx b/spec/core_functions/color/to_space/lab/xyz.hrx new file mode 100644 index 0000000000..f7a95e1c2d --- /dev/null +++ b/spec/core_functions/color/to_space/lab/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.1750611682 0.1841865185 0.2005897556); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.3154783677 0.1924410425 0.9230896852); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz -0.0931334424 -0.0559710307 -0.1664628061); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -236.5825482412 7.2139420412 -2.8507109462); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0162916633 0.0107263739 -0.0090046167 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0162916633 0.0107263739 -0.0090046167 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), xyz)} + +<===> missing/lightness/output.css +a { + b: color(xyz 0.0037273525 -0.0004749534 -0.0210835883); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), xyz)} + +<===> missing/a/output.css +a { + b: color(xyz 0.0096869946 0.0109224783 -0.0090897368); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), xyz)} + +<===> missing/b/output.css +a { + b: color(xyz 0.0173069918 0.0110640949 0.0123481274); +} diff --git a/spec/core_functions/color/to_space/lab/xyz_d50.hrx b/spec/core_functions/color/to_space/lab/xyz_d50.hrx new file mode 100644 index 0000000000..5a8efed971 --- /dev/null +++ b/spec/core_functions/color/to_space/lab/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(0% 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(100% 0 0), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 0 0), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.1776102635 0.1841865185 0.1519731441); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% 50 -75), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.2886831368 0.1841865185 0.6940286511); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 -0.0905265235 -0.055352823 -0.1251409211); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(50% -999999 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -247.6132796606 0.1841865185 0.1519731441); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0177706181 0.0112601993 -0.0067594366 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 30 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0177706181 0.0112601993 -0.0067594366 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(none 20 30), xyz-d50)} + +<===> missing/lightness/output.css +a { + b: color(xyz-d50 0.0049533381 0 -0.0158938104); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% none 30), xyz-d50)} + +<===> missing/a/output.css +a { + b: color(xyz-d50 0.0108581615 0.0112601993 -0.0067594366); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(lab(10% 20 none), xyz-d50)} + +<===> missing/b/output.css +a { + b: color(xyz-d50 0.0177706181 0.0112601993 0.0092908422); +} diff --git a/spec/core_functions/color/to_space/lch/a98_rgb.hrx b/spec/core_functions/color/to_space/lch/a98_rgb.hrx new file mode 100644 index 0000000000..039ab24446 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/a98_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.4633483808 0.4633483808 0.4633483808); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.1855277377 0.0926913904 0.0818650595); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), a98-rgb)} + +<===> float/output.css +a { + b: color(a98-rgb 0.1889263665 0.0909755641 0.0795209428); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb 0.4634940567 -0.3642836921 -0.1126427123); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb 42562.6792376747 -31021.1046455384 6233.1625417899); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.1855277377 0.0926913904 0.0818650595 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.1855277377 0.0926913904 0.0818650595 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), a98-rgb)} + +<===> missing/lightness/output.css +a { + b: color(a98-rgb 0.1244563961 -0.084601587 -0.1049078937); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), a98-rgb)} + +<===> missing/chroma/output.css +a { + b: color(a98-rgb 0.1300242938 0.1300242938 0.1300242938); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), a98-rgb)} + +<===> missing/hue/output.css +a { + b: color(a98-rgb 0.1862731835 0.0856347366 0.1310611506); +} diff --git a/spec/core_functions/color/to_space/lch/display_p3.hrx b/spec/core_functions/color/to_space/lch/display_p3.hrx new file mode 100644 index 0000000000..feb57ac168 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/display_p3.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.4663266093 0.4663266093 0.4663266093); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.1810277824 0.0722540734 0.0569980019); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), display-p3)} + +<===> float/output.css +a { + b: color(display-p3 0.1852138261 0.0708949536 0.054721162); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 0.5150813189 -0.3405175977 -0.0725015019); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 20032.6181692902 -12940.6885284751 3928.8140693077); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.1810277824 0.0722540734 0.0569980019 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.1810277824 0.0722540734 0.0569980019 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), display-p3)} + +<===> missing/lightness/output.css +a { + b: color(display-p3 0.1144797929 -0.0473082464 -0.0747498159); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), display-p3)} + +<===> missing/chroma/output.css +a { + b: color(display-p3 0.1077034111 0.1077034111 0.1077034111); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), display-p3)} + +<===> missing/hue/output.css +a { + b: color(display-p3 0.1823778479 0.0651398083 0.1096920557); +} diff --git a/spec/core_functions/color/to_space/lch/hsl.hrx b/spec/core_functions/color/to_space/lch/hsl.hrx new file mode 100644 index 0000000000..9ae96d8746 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/hsl.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 46.6326609284%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), hsl)} + +<===> middle/output.css +a { + b: hsl(5.5048306165, 59.0012292082%, 12.4106897496%); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), hsl)} + +<===> float/output.css +a { + b: hsl(5.5490985392, 61.5887632777%, 12.5078193109%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(340.1543058221, 427.9584468502%, 11.074503568%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(149.4283545837, 420.5938588221%, 429851.5077692641%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(5.5048306165, 59.0012292082%, 12.4106897496%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(5.5048306165, 59.0012292082%, 12.4106897496%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), hsl)} + +<===> missing/lightness/output.css +a { + b: hsl(6.9848409854, 394.5339053958%, 0%); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), hsl)} + +<===> missing/chroma/output.css +a { + b: hsl(0, 0%, 10.7703411095%); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), hsl)} + +<===> missing/hue/output.css +a { + b: hsl(0, 56.1707811732%, 12.7694440441%); +} diff --git a/spec/core_functions/color/to_space/lch/hwb.hrx b/spec/core_functions/color/to_space/lch/hwb.hrx new file mode 100644 index 0000000000..55e24ac9d7 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/hwb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), hwb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), hwb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), hwb)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 46.6326609284%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), hwb)} + +<===> middle/output.css +a { + b: hsl(5.5048306165, 59.0012292082%, 12.4106897496%); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), hwb)} + +<===> float/output.css +a { + b: hsl(5.5490985392, 61.5887632777%, 12.5078193109%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), hwb)} + +<===> out_of_range/near/output.css +a { + b: hsl(340.1543058221, 427.9584468502%, 11.074503568%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), hwb)} + +<===> out_of_range/far/output.css +a { + b: hsl(149.4283545837, 420.5938588221%, 429851.5077692638%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), hwb)} + +<===> alpha/partial/output.css +a { + b: hsla(5.5048306165, 59.0012292082%, 12.4106897496%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), hwb)} + +<===> alpha/transparent/output.css +a { + b: hsla(5.5048306165, 59.0012292082%, 12.4106897496%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), hwb)} + +<===> missing/lightness/output.css +a { + b: hsl(6.9848409854, 394.5339053958%, 2.7008748146%); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), hwb)} + +<===> missing/chroma/output.css +a { + b: hsl(0, 0%, 10.7703411095%); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), hwb)} + +<===> missing/hue/output.css +a { + b: hsl(0, 56.1707811732%, 12.7694440441%); +} diff --git a/spec/core_functions/color/to_space/lch/lab.hrx b/spec/core_functions/color/to_space/lch/lab.hrx new file mode 100644 index 0000000000..2fe08c506e --- /dev/null +++ b/spec/core_functions/color/to_space/lch/lab.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), lab)} + +<===> black/output.css +a { + b: lab(0% none none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), lab)} + +<===> gray/output.css +a { + b: lab(50% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), lab)} + +<===> middle/output.css +a { + b: lab(10% 17.3205080757 10); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), lab)} + +<===> float/output.css +a { + b: lab(10.123456789% 18.1404203948 10.5549411083); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), lab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lab, color(xyz 0.0846054544 -0.0138950708 -0.0108304931) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), lab)} + +<===> out_of_range/far/output.css +a { + b: lab(10% 999999 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(10% 17.3205080757 10 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(10% 17.3205080757 10 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), lab)} + +<===> missing/lightness/output.css +a { + b: lab(none none none); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), lab)} + +<===> missing/chroma/output.css +a { + b: lab(10% 0 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), lab)} + +<===> missing/hue/output.css +a { + b: lab(10% 20 0); +} diff --git a/spec/core_functions/color/to_space/lch/lch.hrx b/spec/core_functions/color/to_space/lch/lch.hrx new file mode 100644 index 0000000000..ba45e1f7bd --- /dev/null +++ b/spec/core_functions/color/to_space/lch/lch.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), lch)} + +<===> in_range/output.css +a { + b: lch(10% 20 30deg); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), lch)} + +<===> out_of_range/output.css +a { + b: color-mix(in lch, color(xyz 0.0846054544 -0.0138950708 -0.0108304931) 100%, black); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), lch)} + +<===> missing/lightness/output.css +a { + b: lch(none 20 30deg); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), lch)} + +<===> missing/chroma/output.css +a { + b: lch(10% none 30deg); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), lch)} + +<===> missing/hue/output.css +a { + b: lch(10% 20 none); +} diff --git a/spec/core_functions/color/to_space/lch/oklab.hrx b/spec/core_functions/color/to_space/lch/oklab.hrx new file mode 100644 index 0000000000..45cc15adfe --- /dev/null +++ b/spec/core_functions/color/to_space/lch/oklab.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), oklab)} + +<===> gray/output.css +a { + b: oklab(56.8965513528% 0 0.0000000212); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), oklab)} + +<===> middle/output.css +a { + b: oklab(22.8705495852% 0.0494077592 0.0263450873); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), oklab)} + +<===> float/output.css +a { + b: oklab(22.9987502615% 0.0516259003 0.0278217212); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), oklab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in oklab, color(xyz 0.0846054544 -0.0138950708 -0.0108304931) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), oklab)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz 7373327412.161988 -218927236.26953584 95026466.80033648) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(22.8705495852% 0.0494077592 0.0263450873 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(22.8705495852% 0.0494077592 0.0263450873 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), oklab)} + +<===> missing/lightness/output.css +a { + b: oklab(none 0.4083922235 0.0807817391); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), oklab)} + +<===> missing/chroma/output.css +a { + b: oklab(22.4137929572% 0 0.0000000084); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), oklab)} + +<===> missing/hue/output.css +a { + b: oklab(23.0834632697% 0.0614345595 -0.0007016084); +} diff --git a/spec/core_functions/color/to_space/lch/oklch.hrx b/spec/core_functions/color/to_space/lch/oklch.hrx new file mode 100644 index 0000000000..6f3c432983 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/oklch.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), oklch)} + +<===> gray/output.css +a { + b: oklch(56.8965513528% 0.0000000212 89.8755629589deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), oklch)} + +<===> middle/output.css +a { + b: oklch(22.8705495852% 0.05599277 28.0673245733deg); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), oklch)} + +<===> float/output.css +a { + b: oklch(22.9987502615% 0.0586453899 28.320677744deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), oklch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in oklch, color(xyz 0.0846054544 -0.0138950708 -0.0108304931) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), oklch)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz 7373327412.161987 -218927236.2695358 95026466.80033481) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(22.8705495852% 0.05599277 28.0673245733deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(22.8705495852% 0.05599277 28.0673245733deg / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), oklch)} + +<===> missing/lightness/output.css +a { + b: oklch(none 0.4163050536 11.1889160032deg); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), oklch)} + +<===> missing/chroma/output.css +a { + b: oklch(22.4137929572% none 89.8755627743deg); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), oklch)} + +<===> missing/hue/output.css +a { + b: oklch(23.0834632697% 0.0614385657 none); +} diff --git a/spec/core_functions/color/to_space/lch/prophoto_rgb.hrx b/spec/core_functions/color/to_space/lch/prophoto_rgb.hrx new file mode 100644 index 0000000000..0d6d455791 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/prophoto_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.3906698633 0.3906698633 0.3906698633); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.1119358598 0.0682122171 0.0505966427); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), prophoto-rgb)} + +<===> float/output.css +a { + b: color(prophoto-rgb 0.1140986722 0.0679789036 0.0492544884); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb 0.3120531174 -0.2195824001 -0.0819271128); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb 367010.4615537181 -222031.7168269293 0.0827038254); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.1119358598 0.0682122171 0.0505966427 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.1119358598 0.0682122171 0.0505966427 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), prophoto-rgb)} + +<===> missing/lightness/output.css +a { + b: color(prophoto-rgb 0.0585320378 -0.0354038244 -0.0605339143); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), prophoto-rgb)} + +<===> missing/chroma/output.css +a { + b: color(prophoto-rgb 0.0827038254 0.0827038254 0.0827038254); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), prophoto-rgb)} + +<===> missing/hue/output.css +a { + b: color(prophoto-rgb 0.1155645311 0.0659678734 0.0827038254); +} diff --git a/spec/core_functions/color/to_space/lch/rec2020.hrx b/spec/core_functions/color/to_space/lch/rec2020.hrx new file mode 100644 index 0000000000..e729eaf983 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/rec2020.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.4141328903 0.4141328903 0.4141328903); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.0987940535 0.0323770888 0.0206839256); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), rec2020)} + +<===> float/output.css +a { + b: color(rec2020 0.1021786723 0.0319354657 0.0196866185); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 0.3729067583 -0.2515671342 -0.0365252061); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 38725.5976285713 -26052.9381914356 6353.219962186); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.0987940535 0.0323770888 0.0206839256 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.0987940535 0.0323770888 0.0206839256 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), rec2020)} + +<===> missing/lightness/output.css +a { + b: color(rec2020 0.0374222506 -0.0134835285 -0.0293129957); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), rec2020)} + +<===> missing/chroma/output.css +a { + b: color(rec2020 0.0506708967 0.0506708967 0.0506708967); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), rec2020)} + +<===> missing/hue/output.css +a { + b: color(rec2020 0.1006265985 0.0294359094 0.0515937784); +} diff --git a/spec/core_functions/color/to_space/lch/rgb.hrx b/spec/core_functions/color/to_space/lch/rgb.hrx new file mode 100644 index 0000000000..0ee32433e8 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), rgb)} + +<===> gray/output.css +a { + b: rgb(118.9132853673, 118.9132853673, 118.9132853673); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), rgb)} + +<===> middle/output.css +a { + b: rgb(50.3195306005, 16.4012435608, 12.9749871225); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), rgb)} + +<===> float/output.css +a { + b: rgb(51.5386378704, 15.8847345936, 12.2512406149); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(340.1543058221, 427.9584468502%, 11.074503568%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(149.4283545837, 420.5938588221%, 429851.5077692641%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: rgba(50.3195306005, 16.4012435608, 12.9749871225, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: rgba(50.3195306005, 16.4012435608, 12.9749871225, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), rgb)} + +<===> missing/lightness/output.css +a { + b: hsl(6.9848409854, 394.5339053958%, 2.7008748146%); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), rgb)} + +<===> missing/chroma/output.css +a { + b: rgb(27.4643698292, 27.4643698292, 27.4643698292); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), rgb)} + +<===> missing/hue/output.css +a { + b: rgb(50.8524583137, 14.2717063113, 28.2183712056); +} diff --git a/spec/core_functions/color/to_space/lch/srgb.hrx b/spec/core_functions/color/to_space/lch/srgb.hrx new file mode 100644 index 0000000000..383d80e364 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/srgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.4663266093 0.4663266093 0.4663266093); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.1973314926 0.0643186022 0.0508823024); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), srgb)} + +<===> float/output.css +a { + b: color(srgb 0.2021123054 0.0622930768 0.0480440808); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb 0.5846877703 -0.363197699 -0.0496736133); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb 22373.5995764218 -13776.5694210365 4642.9330511282); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.1973314926 0.0643186022 0.0508823024 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.1973314926 0.0643186022 0.0508823024 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), srgb)} + +<===> missing/lightness/output.css +a { + b: color(srgb 0.133567417 -0.0547400755 -0.0795499207); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), srgb)} + +<===> missing/chroma/output.css +a { + b: color(srgb 0.1077034111 0.1077034111 0.1077034111); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), srgb)} + +<===> missing/hue/output.css +a { + b: color(srgb 0.1994214052 0.0559674757 0.1106602792); +} diff --git a/spec/core_functions/color/to_space/lch/srgb_linear.hrx b/spec/core_functions/color/to_space/lch/srgb_linear.hrx new file mode 100644 index 0000000000..85d3385cbf --- /dev/null +++ b/spec/core_functions/color/to_space/lch/srgb_linear.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.1841865185 0.1841865185 0.1841865185); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.0322794103 0.0053492596 0.0040157827); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), srgb-linear)} + +<===> float/output.css +a { + b: color(srgb-linear 0.033766727 0.0051339047 0.0037622653); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear 0.300965983 -0.1085200613 -0.0039066402); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear 24185926345.93111 -7553302222.606848 555275171.9499303); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.0322794103 0.0053492596 0.0040157827 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.0322794103 0.0053492596 0.0040157827 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), srgb-linear)} + +<===> missing/lightness/output.css +a { + b: color(srgb-linear 0.016044052 -0.0043759334 -0.0071369782); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), srgb-linear)} + +<===> missing/chroma/output.css +a { + b: color(srgb-linear 0.0112601993 0.0112601993 0.0112601993); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), srgb-linear)} + +<===> missing/hue/output.css +a { + b: color(srgb-linear 0.0329247775 0.004494318 0.0117575878); +} diff --git a/spec/core_functions/color/to_space/lch/xyz.hrx b/spec/core_functions/color/to_space/lch/xyz.hrx new file mode 100644 index 0000000000..7bcb934888 --- /dev/null +++ b/spec/core_functions/color/to_space/lch/xyz.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.1750611682 0.1841865185 0.2005897556); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.0159493149 0.0109793933 0.0050787218); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), xyz)} + +<===> float/output.css +a { + b: color(xyz 0.0164399081 0.0111233378 0.0048408272); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 0.0846054544 -0.0138950708 -0.0108304931); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz 7373327412.161998 -218927236.2695362 95026466.80033655); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0159493149 0.0109793933 0.0050787218 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0159493149 0.0109793933 0.0050787218 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), xyz)} + +<===> missing/lightness/output.css +a { + b: color(xyz 0.0037635667 -0.0002331742 -0.006995371); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), xyz)} + +<===> missing/chroma/output.css +a { + b: color(xyz 0.0107023231 0.0112601993 0.0122630073); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), xyz)} + +<===> missing/hue/output.css +a { + b: color(xyz 0.0173069918 0.0110640949 0.0123481274); +} diff --git a/spec/core_functions/color/to_space/lch/xyz_d50.hrx b/spec/core_functions/color/to_space/lch/xyz_d50.hrx new file mode 100644 index 0000000000..0aa02fbb4e --- /dev/null +++ b/spec/core_functions/color/to_space/lch/xyz_d50.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(0% 0 0deg), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(100% 0 0deg), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(50% 0 0deg), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.1776102635 0.1841865185 0.1519731441); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.0167107924 0.0112601993 0.003836437); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), xyz-d50)} + +<===> float/output.css +a { + b: color(xyz-d50 0.0172401432 0.0114213638 0.0036552028); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 0.0888853348 -0.0110705646 -0.0091343738); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 999999 0deg), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 7716936176.70525 0.0112601993 0.0092908422); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0167107924 0.0112601993 0.003836437 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 30deg / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0167107924 0.0112601993 0.003836437 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(none 20 30deg), xyz-d50)} + +<===> missing/lightness/output.css +a { + b: color(xyz-d50 0.0042897166 0 -0.0052979368); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% none 30deg), xyz-d50)} + +<===> missing/chroma/output.css +a { + b: color(xyz-d50 0.0108581615 0.0112601993 0.0092908422); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(lch(10% 20 none), xyz-d50)} + +<===> missing/hue/output.css +a { + b: color(xyz-d50 0.0177706181 0.0112601993 0.0092908422); +} diff --git a/spec/core_functions/color/to_space/oklab/a98_rgb.hrx b/spec/core_functions/color/to_space/oklab/a98_rgb.hrx new file mode 100644 index 0000000000..b9912f977e --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/a98_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 0.9999999799 1.000000009 1.0000001143); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.3884711027 0.388471114 0.3884711549); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.4723956119 -0.3075477289 0.9952387413); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -1.6915317691 2.7130844081 -5.3317336738); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -66665446.96678426 49015676.54589439 12422985.883539313); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.2172671914 -0.1122840454 -0.2493572785 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.2172671914 -0.1122840454 -0.2493572785 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), a98-rgb)} + +<===> missing/lightness/output.css +a { + b: color(a98-rgb 0.0734724303 0.1640446338 -0.3638546832); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), a98-rgb)} + +<===> missing/a/output.css +a { + b: color(a98-rgb 0.1171245434 0.0794773258 -0.2290203701); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), a98-rgb)} + +<===> missing/b/output.css +a { + b: color(a98-rgb 0.1433510554 -0.0992363406 0.0248601585); +} diff --git a/spec/core_functions/color/to_space/oklab/display_p3.hrx b/spec/core_functions/color/to_space/oklab/display_p3.hrx new file mode 100644 index 0000000000..1ed003395e --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 0.9999999764 1.0000000074 1.0000001047); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.3885728491 0.3885728621 0.3885729031); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.5192153014 -0.2770640957 0.9741963252); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -2.0082801891 2.5077633347 -4.7222178033); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -16964712.17081906 11051276.299069608 2566313.802188239); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.2245541345 -0.0715469676 -0.2325234092 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.2245541345 -0.0715469676 -0.2325234092 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), display-p3)} + +<===> missing/lightness/output.css +a { + b: color(display-p3 0.011277471 0.1430562743 -0.3528893187); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), display-p3)} + +<===> missing/a/output.css +a { + b: color(display-p3 0.0980260328 0.0512840259 -0.2115516265); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), display-p3)} + +<===> missing/b/output.css +a { + b: color(display-p3 0.1380887377 -0.0636630597 0.0058108376); +} diff --git a/spec/core_functions/color/to_space/oklab/hsl.hrx b/spec/core_functions/color/to_space/oklab/hsl.hrx new file mode 100644 index 0000000000..4c79f22e5c --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), hsl)} + +<===> white/output.css +a { + b: hsl(43.8135971986, 172.5242105081%, 100.0000042145%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), hsl)} + +<===> gray/output.css +a { + b: hsl(223.8135972091, 0.0000078676%, 38.8572876766%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), hsl)} + +<===> middle/output.css +a { + b: hsl(280.3037191595, 185.1123260276%, 35.6118905417%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(280.1786410944, 318.2272126608%, -118.134272113%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(340.1123890362, 426.4426890198%, -360094010.73043364%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(19.0047457513, 6337.7067481883%, 0.3924710109%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(19.0047457513, 6337.7067481883%, 0.3924710109%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), hsl)} + +<===> missing/lightness/output.css +a { + b: hsl(261.4365788529, 230.0242883505%, 0%); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), hsl)} + +<===> missing/a/output.css +a { + b: hsl(229.5442945473, 280.5312633728%, -5.8764819359%); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), hsl)} + +<===> missing/b/output.css +a { + b: hsl(339.4567046558, 263.6331199652%, 4.40110336%); +} diff --git a/spec/core_functions/color/to_space/oklab/hwb.hrx b/spec/core_functions/color/to_space/oklab/hwb.hrx new file mode 100644 index 0000000000..7ece44fb56 --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/hwb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), hwb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), hwb)} + +<===> white/output.css +a { + b: hsl(43.8135971652, 172.5242119439%, 100.0000042145%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), hwb)} + +<===> gray/output.css +a { + b: hsl(223.8135972091, 0.0000078676%, 38.8572876766%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), hwb)} + +<===> middle/output.css +a { + b: hsl(280.3037191595, 185.1123260276%, 35.6118905417%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), hwb)} + +<===> out_of_range/near/output.css +a { + b: hsl(280.1786410944, 318.2272126608%, -118.134272113%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), hwb)} + +<===> out_of_range/far/output.css +a { + b: hsl(340.1123890362, 426.4426890198%, -360094010.73043364%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), hwb)} + +<===> alpha/partial/output.css +a { + b: hsla(19.0047457513, 6337.7067481883%, 0.3924710109%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), hwb)} + +<===> alpha/transparent/output.css +a { + b: hsla(19.0047457513, 6337.7067481883%, 0.3924710109%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), hwb)} + +<===> missing/lightness/output.css +a { + b: hsl(261.4365788529, 230.0242883505%, -11.2533870657%); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), hwb)} + +<===> missing/a/output.css +a { + b: hsl(229.5442945473, 280.5312633728%, -5.8764819359%); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), hwb)} + +<===> missing/b/output.css +a { + b: hsl(339.4567046558, 263.6331199652%, 4.40110336%); +} diff --git a/spec/core_functions/color/to_space/oklab/lab.hrx b/spec/core_functions/color/to_space/oklab/lab.hrx new file mode 100644 index 0000000000..c024bf381b --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/lab.hrx @@ -0,0 +1,122 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/options.yml +:todo: + - dart-sass + +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), lab)} + +<===> white/output.css +a { + b: okoklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), lab)} + +<===> gray/output.css +a { + b: lab(42.0000002803% 0.0000000582 -0.0000070926); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), lab)} + +<===> middle/output.css +a { + b: lab(33.0422497851% 107.2195839075 -107.9836652126); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), lab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lab, color(xyz -7.6342507319 1.7017043263 -38.7847424885) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), lab)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -76837326254677664 3783159310641774 5396110649242741) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(2.4858192097% 37.8559749186 70.2237149791 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(2.4858192097% 37.8559749186 70.2237149791 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), lab)} + +<===> missing/lightness/output.css +a { + b: lab(none -64.726469561 159.0711423642); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), lab)} + +<===> missing/a/output.css +a { + b: lab(2.4372581534% none 58.4055225293); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), lab)} + +<===> missing/b/output.css +a { + b: lab(0.4263319128% 27.5478510774 none); +} diff --git a/spec/core_functions/color/to_space/oklab/lch.hrx b/spec/core_functions/color/to_space/oklab/lch.hrx new file mode 100644 index 0000000000..f55bfef8c9 --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/lch.hrx @@ -0,0 +1,122 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/options.yml +:todo: + - dart-sass + +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), lch)} + +<===> gray/output.css +a { + b: lch(42.0000002803% 0.0000070929 270.4699000403deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), lch)} + +<===> middle/output.css +a { + b: lch(33.0422497851% 152.1726359305 314.7965716122deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), lch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lch, color(xyz -7.6342507319 1.7017043263 -38.7847424885) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), lch)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -76842638588973744 3781392309267311 5284390240038480) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(2.4858192097% 79.7774716477 61.6719233557deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(2.4858192097% 79.7774716477 61.6719233557deg / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), lch)} + +<===> missing/lightness/output.css +a { + b: lch(none 171.7356811932 112.1415379531deg); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), lch)} + +<===> missing/a/output.css +a { + b: lch(2.4372581534% 59.0755529992 98.6375851746deg); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), lch)} + +<===> missing/b/output.css +a { + b: lch(0.4263319128% 27.5527624534 1.0818401525deg); +} diff --git a/spec/core_functions/color/to_space/oklab/oklab.hrx b/spec/core_functions/color/to_space/oklab/oklab.hrx new file mode 100644 index 0000000000..f569c6330e --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/oklab.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), oklab)} + +<===> in_range/output.css +a { + b: oklab(50% 0.2 -0.3); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), oklab)} + +<===> out_of_range/output.css +a { + b: color-mix(in oklab, color(xyz -7.6342507319 1.7017043263 -38.7847424885) 100%, black); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), oklab)} + +<===> missing/lightness/output.css +a { + b: oklab(none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), oklab)} + +<===> missing/a/output.css +a { + b: oklab(10% none 0.3); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), oklab)} + +<===> missing/b/output.css +a { + b: oklab(10% 0.2 none); +} diff --git a/spec/core_functions/color/to_space/oklab/oklch.hrx b/spec/core_functions/color/to_space/oklab/oklch.hrx new file mode 100644 index 0000000000..668db0577b --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/oklch.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), oklch)} + +<===> white/output.css +a { + b: oklch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), oklch)} + +<===> gray/output.css +a { + b: oklch(50% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), oklch)} + +<===> middle/output.css +a { + b: oklch(50% 0.3605551275 303.690067526deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), oklch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in oklch, color(xyz -7.6342507319 1.7017043263 -38.7847424885) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), oklch)} + +<===> out_of_range/far/output.css +a { + b: oklch(50% 999999 180deg); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(10% 0.3605551275 56.309932474deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(10% 0.3605551275 56.309932474deg / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), oklch)} + +<===> missing/lightness/output.css +a { + b: oklch(none 0.3605551275 56.309932474deg); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), oklch)} + +<===> missing/a/output.css +a { + b: oklch(10% 0.3 90deg); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), oklch)} + +<===> missing/b/output.css +a { + b: oklch(10% 0.2 0deg); +} diff --git a/spec/core_functions/color/to_space/oklab/prophoto_rgb.hrx b/spec/core_functions/color/to_space/oklab/prophoto_rgb.hrx new file mode 100644 index 0000000000..bcbbeb6d8c --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1.0000000036 1.0000000099 1.0000001263); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.3149802636 0.3149802656 0.3149803022); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.4918881954 -0.0624904068 0.9386035712); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb -2.9829710472 2.6753284297 -7.2338243089); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -2922133015.648196 1810415223.5562131 574653584.8087448); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.1071252394 -0.0424411714 -0.1726130102 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.1071252394 -0.0424411714 -0.1726130102 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), prophoto-rgb)} + +<===> missing/lightness/output.css +a { + b: color(prophoto-rgb -0.0831372042 0.0891975511 -0.2723906896); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), prophoto-rgb)} + +<===> missing/a/output.css +a { + b: color(prophoto-rgb 0.0211561039 0.0415370447 -0.1548071681); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), prophoto-rgb)} + +<===> missing/b/output.css +a { + b: color(prophoto-rgb 0.0759873356 -0.0414646645 0.0022071932); +} diff --git a/spec/core_functions/color/to_space/oklab/rec2020.hrx b/spec/core_functions/color/to_space/oklab/rec2020.hrx new file mode 100644 index 0000000000..48593816b4 --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 0.9999999872 1.0000000081 1.0000001161); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.3319485728 0.3319485809 0.3319486233); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.4424432787 -0.1481489957 0.9623483669); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -1.92504049 2.5779941201 -5.465676751); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -56131669.11203061 38257478.199239716 10955271.878602052); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.1199235027 -0.0200899821 -0.1691453887 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.1199235027 -0.0200899821 -0.1691453887 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), rec2020)} + +<===> missing/lightness/output.css +a { + b: color(rec2020 -0.002787099 0.0709375609 -0.2911317053); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), rec2020)} + +<===> missing/a/output.css +a { + b: color(rec2020 0.028710049 0.0171073657 -0.1474743881); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), rec2020)} + +<===> missing/b/output.css +a { + b: color(rec2020 0.052988574 -0.0188512434 0.0014800891); +} diff --git a/spec/core_functions/color/to_space/oklab/rgb.hrx b/spec/core_functions/color/to_space/oklab/rgb.hrx new file mode 100644 index 0000000000..7776479d26 --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), rgb)} + +<===> white/output.css +a { + b: hsl(43.8135971986, 172.5242105081%, 100.0000042145%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), rgb)} + +<===> gray/output.css +a { + b: rgb(99.0860757797, 99.0860799859, 99.0860913711); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), rgb)} + +<===> middle/output.css +a { + b: hsl(280.3037191595, 185.1123260276%, 35.6118905417%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(280.1786410944, 318.2272126608%, -118.134272113%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(340.1123890362, 426.4426890198%, -360094010.73043364%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: hsla(19.0047457513, 6337.7067481883%, 0.3924710109%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: hsla(19.0047457513, 6337.7067481883%, 0.3924710109%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), rgb)} + +<===> missing/lightness/output.css +a { + b: hsl(261.4365788529, 230.0242883505%, -11.2533870657%); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), rgb)} + +<===> missing/a/output.css +a { + b: hsl(229.5442945473, 280.5312633728%, -5.8764819359%); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), rgb)} + +<===> missing/b/output.css +a { + b: hsl(339.4567046558, 263.6331199652%, 4.40110336%); +} diff --git a/spec/core_functions/color/to_space/oklab/srgb.hrx b/spec/core_functions/color/to_space/oklab/srgb.hrx new file mode 100644 index 0000000000..4dca47bf10 --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), srgb)} + +<===> white/output.css +a { + b: color(srgb 0.9999999694 1.0000000087 1.0000001149); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.3885728462 0.3885728627 0.3885729073); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.5825328265 -0.3031010838 1.0153388947); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -2.4568465628 2.5780112923 -4.9406967346); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -18956885.930884026 11755005.716275353 1575236.4989373833); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.2526613275 -0.0872393682 -0.2448119073 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.2526613275 -0.0872393682 -0.2448119073 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), srgb)} + +<===> missing/lightness/output.css +a { + b: color(srgb -0.0386443242 0.1463213645 -0.3713891058); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), srgb)} + +<===> missing/a/output.css +a { + b: color(srgb 0.1060888708 0.0486334832 -0.2236185095); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), srgb)} + +<===> missing/b/output.css +a { + b: color(srgb 0.1600386946 -0.0720166274 0.0074363895); +} diff --git a/spec/core_functions/color/to_space/oklab/srgb_linear.hrx b/spec/core_functions/color/to_space/oklab/srgb_linear.hrx new file mode 100644 index 0000000000..907d122d58 --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 0.9999999305 1.0000000197 1.0000002613); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.1249999913 0.1250000025 0.1250000327); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.2985384134 -0.074783816 1.0352499891); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -8.0200588156 8.9800887523 -41.7661704476); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -257534189123413888 81795409108779168 657391329523393.8); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.0519480297 -0.0081553321 -0.0488237803 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.0519480297 -0.0081553321 -0.0488237803 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), srgb-linear)} + +<===> missing/lightness/output.css +a { + b: color(srgb-linear -0.0029910468 0.0187728311 -0.1136916938); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), srgb-linear)} + +<===> missing/a/output.css +a { + b: color(srgb-linear 0.01099389 0.0038141198 -0.0409466157); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), srgb-linear)} + +<===> missing/b/output.css +a { + b: color(srgb-linear 0.0219904427 -0.0062152626 0.0005755719); +} diff --git a/spec/core_functions/color/to_space/oklab/xyz.hrx b/spec/core_functions/color/to_space/oklab/xyz.hrx new file mode 100644 index 0000000000..6599ab53c2 --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559526 1.0000000182 1.0890580001); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.1188069941 0.1250000023 0.13613225); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.2832157077 0.0847349623 0.9808955517); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz -7.6342507319 1.7017043263 -38.7847424885); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -76837326254677680 3783159310641777.5 5396110649242756); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0096949161 0.0016890376 -0.046376448 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0096949161 0.0016890376 -0.046376448 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), xyz)} + +<===> missing/lightness/output.css +a { + b: color(xyz -0.0150397763 0.004582061 -0.1058878063); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), xyz)} + +<===> missing/a/output.css +a { + b: color(xyz -0.0014924289 0.0021094378 -0.0382539306); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), xyz)} + +<===> missing/b/output.css +a { + b: color(xyz 0.0069500554 0.0002726166 0.000231366); +} diff --git a/spec/core_functions/color/to_space/oklab/xyz_d50.hrx b/spec/core_functions/color/to_space/oklab/xyz_d50.hrx new file mode 100644 index 0000000000..378dec988a --- /dev/null +++ b/spec/core_functions/color/to_space/oklab/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(0% 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(100% 0 0), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956911 1.0000000145 0.82510479); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0 0), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.1205369614 0.1250000018 0.1031380988); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% 0.2 -0.3), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.2495012093 0.0755678711 0.7361680649); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 -6.0144158738 2.1214433281 -29.0650672146); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(50% -999999 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -80704154717242816 1378317505528979.2 4824363534483794); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0125260886 0.0027519422 -0.0349334402 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0125260886 0.0027519422 -0.0349334402 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(none 0.2 0.3), xyz-d50)} + +<===> missing/lightness/output.css +a { + b: color(xyz-d50 -0.0103407367 0.0059005425 -0.0794063212); +} + +<===> +================================================================================ +<===> missing/a/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% none 0.3), xyz-d50)} + +<===> missing/a/output.css +a { + b: color(xyz-d50 0.0004044958 0.0026981824 -0.028716594); +} + +<===> +================================================================================ +<===> missing/b/input.scss +@use 'sass:color'; +a {b: color.to-space(oklab(10% 0.2 none), xyz-d50)} + +<===> missing/b/output.css +a { + b: color(xyz-d50 0.007277813 0.0004719735 0.0001138228); +} diff --git a/spec/core_functions/color/to_space/oklch/a98_rgb.hrx b/spec/core_functions/color/to_space/oklch/a98_rgb.hrx new file mode 100644 index 0000000000..6f3b6445fa --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/a98_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 0.9999999799 1.000000009 1.0000001143); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.3884711027 0.388471114 0.3884711549); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.1027766441 -0.0609172248 -0.0321025971); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), a98-rgb)} + +<===> float/output.css +a { + b: color(a98-rgb 0.1569345546 -0.1088588794 -0.038585035); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb 0.3172861934 -0.2637782471 -0.1086210387); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb 66665577.100123584 -49015761.348732136 -12422991.362568038); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.1027766441 -0.0609172248 -0.0321025971 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.1027766441 -0.0609172248 -0.0321025971 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), a98-rgb)} + +<===> missing/lightness/output.css +a { + b: color(a98-rgb 0.0213511879 0.0047462167 -0.0347458469); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), a98-rgb)} + +<===> missing/chroma/output.css +a { + b: color(a98-rgb 0.0432393553 0.0432393565 0.0432393611); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), a98-rgb)} + +<===> missing/hue/output.css +a { + b: color(a98-rgb 0.0964961637 -0.0571048143 0.0359545033); +} diff --git a/spec/core_functions/color/to_space/oklch/display_p3.hrx b/spec/core_functions/color/to_space/oklch/display_p3.hrx new file mode 100644 index 0000000000..0d9d28afbd --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/display_p3.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 0.9999999764 1.0000000074 1.0000001047); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.3885728491 0.3885728621 0.3885729031); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.0863974377 -0.022155665 -0.0050290551); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), display-p3)} + +<===> float/output.css +a { + b: color(display-p3 0.1548116084 -0.0741945938 -0.0069035722); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 0.3493925785 -0.240514802 -0.0760588329); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 16964742.301441267 -11051293.581589133 -2566311.5001529297); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.0863974377 -0.022155665 -0.0050290551 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.0863974377 -0.022155665 -0.0050290551 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), display-p3)} + +<===> missing/lightness/output.css +a { + b: color(display-p3 0.0031329176 0.0002226378 -0.0075165654); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), display-p3)} + +<===> missing/chroma/output.css +a { + b: color(display-p3 0.0129199993 0.0129200002 0.0129200031); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), display-p3)} + +<===> missing/hue/output.css +a { + b: color(display-p3 0.0784514548 -0.0192081243 0.0093493065); +} diff --git a/spec/core_functions/color/to_space/oklch/hsl.hrx b/spec/core_functions/color/to_space/oklch/hsl.hrx new file mode 100644 index 0000000000..ecbef660a2 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/hsl.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), hsl)} + +<===> white/output.css +a { + b: hsl(43.8135971986, 172.5242105081%, 100.0000042145%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), hsl)} + +<===> gray/output.css +a { + b: hsl(223.8135972091, 0.0000078676%, 38.8572876766%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), hsl)} + +<===> middle/output.css +a { + b: hsl(349.9222383971, 174.3087628098%, 3.6948783654%); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), hsl)} + +<===> float/output.css +a { + b: hsl(342.3640346721, 274.4922188663%, 4.7714615434%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(342.6995890373, 454.6290714992%, 7.2218303523%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(160.1123681644, 426.4426548179%, 360094749.97600085%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(349.9222383971, 174.3087628098%, 3.6948783654%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(349.9222383971, 174.3087628098%, 3.6948783654%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), hsl)} + +<===> missing/lightness/output.css +a { + b: hsl(221.7487183642, 266.6061391496%, 0%); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), hsl)} + +<===> missing/chroma/output.css +a { + b: hsl(223.8135982915, 0%, 1.2920001239%); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), hsl)} + +<===> missing/hue/output.css +a { + b: hsl(0, 169.3005035983%, 3.4369836375%); +} diff --git a/spec/core_functions/color/to_space/oklch/hwb.hrx b/spec/core_functions/color/to_space/oklch/hwb.hrx new file mode 100644 index 0000000000..4800a17404 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/hwb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), hwb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), hwb)} + +<===> white/output.css +a { + b: hsl(43.8135971652, 172.5242119439%, 100.0000042145%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), hwb)} + +<===> gray/output.css +a { + b: hsl(223.8135972091, 0.0000078676%, 38.8572876766%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), hwb)} + +<===> middle/output.css +a { + b: hsl(349.9222383971, 174.3087628098%, 3.6948783654%); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), hwb)} + +<===> float/output.css +a { + b: hsl(342.3640346721, 274.4922188663%, 4.7714615434%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), hwb)} + +<===> out_of_range/near/output.css +a { + b: hsl(342.6995890373, 454.6290714992%, 7.2218303523%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), hwb)} + +<===> out_of_range/far/output.css +a { + b: hsl(160.1123681644, 426.4426548179%, 360094749.9760007%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), hwb)} + +<===> alpha/partial/output.css +a { + b: hsla(349.9222383971, 174.3087628098%, 3.6948783654%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), hwb)} + +<===> alpha/transparent/output.css +a { + b: hsla(349.9222383971, 174.3087628098%, 3.6948783654%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), hwb)} + +<===> missing/lightness/output.css +a { + b: hsl(221.7487183642, 266.6061391496%, -0.2273359503%); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), hwb)} + +<===> missing/chroma/output.css +a { + b: hsl(223.813598298, 0.0000165409%, 1.2920001239%); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), hwb)} + +<===> missing/hue/output.css +a { + b: hsl(0, 169.3005035983%, 3.4369836375%); +} diff --git a/spec/core_functions/color/to_space/oklch/lab.hrx b/spec/core_functions/color/to_space/oklch/lab.hrx new file mode 100644 index 0000000000..8dec6f6f88 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/lab.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), lab)} + +<===> white/output.css +a { + b: color-mix(in lab, color(xyz 0.9504559526 1.0000000182 1.0890580001) 100%, black); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), lab)} + +<===> gray/output.css +a { + b: lab(42.0000002803% 0.0000000582 -0.0000070926); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), lab)} + +<===> middle/output.css +a { + b: lab(0.6560445641% 11.6264793014 1.8588166268); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), lab)} + +<===> float/output.css +a { + b: lab(0.4361236096% 33.2605943231 2.095776706); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), lab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lab, color(xyz 0.0348582183 -0.010229465 -0.0091226442) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), lab)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz 76838084844227696 -3783161942592645 -5396112427214629) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(0.6560445641% 11.6264793014 1.8588166268 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(0.6560445641% 11.6264793014 1.8588166268 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), lab)} + +<===> missing/lightness/output.css +a { + b: lab(none 0.0322037834 0.9096922188); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), lab)} + +<===> missing/chroma/output.css +a { + b: lab(0.9032963094% 0.0000000027 -0.0000003314); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), lab)} + +<===> missing/hue/output.css +a { + b: lab(0.6385915087% 10.5093876004 0.1611873791); +} diff --git a/spec/core_functions/color/to_space/oklch/lch.hrx b/spec/core_functions/color/to_space/oklch/lch.hrx new file mode 100644 index 0000000000..36d448d474 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/lch.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), lch)} + +<===> white/output.css +a { + b: color-mix(in lch, color(xyz 0.9504559526 1.0000000182 1.0890580001) 100%, black); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), lch)} + +<===> gray/output.css +a { + b: lch(42.0000002803% 0.0000070929 270.4699000403deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), lch)} + +<===> middle/output.css +a { + b: lch(0.6560445641% 11.7741335222 9.0834533485deg); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), lch)} + +<===> float/output.css +a { + b: lch(0.4361236096% 33.3265571988 3.6054863359deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), lch)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in lch, color(xyz 0.0348582183 -0.010229465 -0.0091226442) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), lch)} + +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz 76837027122572336 -3783130536950956 -5396126058991186) 100%, black); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(0.6560445641% 11.7741335222 9.0834533485deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(0.6560445641% 11.7741335222 9.0834533485deg / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), lch)} + +<===> missing/lightness/output.css +a { + b: lch(none 0.9102620593 87.9725333167deg); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), lch)} + +<===> missing/chroma/output.css +a { + b: lch(0.9032963094% none 270.4698988243deg); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), lch)} + +<===> missing/hue/output.css +a { + b: lch(0.6385915087% 10.5106236307 none); +} diff --git a/spec/core_functions/color/to_space/oklch/oklab.hrx b/spec/core_functions/color/to_space/oklch/oklab.hrx new file mode 100644 index 0000000000..c1d401254b --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/oklab.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), oklab)} + +<===> white/output.css +a { + b: oklab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), oklab)} + +<===> gray/output.css +a { + b: oklab(50% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), oklab)} + +<===> middle/output.css +a { + b: oklab(10% 0.0866025404 0.05); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), oklab)} + +<===> float/output.css +a { + b: oklab(10.123456789% 0.1718004519 0.099961501); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), oklab)} + +<===> out_of_range/near/output.css +a { + b: color-mix(in oklab, color(xyz 0.0348582183 -0.010229465 -0.0091226442) 100%, black); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), oklab)} + +<===> out_of_range/far/output.css +a { + b: oklab(10% 999998.9999999994 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(10% 0.0866025404 0.05 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(10% 0.0866025404 0.05 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), oklab)} + +<===> missing/lightness/output.css +a { + b: oklab(none 0.0866025404 0.05); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), oklab)} + +<===> missing/chroma/output.css +a { + b: oklab(10% 0 0); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), oklab)} + +<===> missing/hue/output.css +a { + b: oklab(10% 0.1 0); +} diff --git a/spec/core_functions/color/to_space/oklch/oklch.hrx b/spec/core_functions/color/to_space/oklch/oklch.hrx new file mode 100644 index 0000000000..fb94e309d9 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/oklch.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), oklch)} + +<===> in_range/output.css +a { + b: oklch(10% 0.1 30deg); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), oklch)} + +<===> out_of_range/output.css +a { + b: color-mix(in oklch, color(xyz 0.0348582183 -0.010229465 -0.0091226442) 100%, black); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), oklch)} + +<===> missing/lightness/output.css +a { + b: oklch(none 0.1 30deg); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), oklch)} + +<===> missing/chroma/output.css +a { + b: oklch(10% none 30deg); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), oklch)} + +<===> missing/hue/output.css +a { + b: oklch(10% 0.1 none); +} diff --git a/spec/core_functions/color/to_space/oklch/prophoto_rgb.hrx b/spec/core_functions/color/to_space/oklch/prophoto_rgb.hrx new file mode 100644 index 0000000000..b95ded68d8 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/prophoto_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1.0000000036 1.0000000099 1.0000001263); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.3149802636 0.3149802656 0.3149803022); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.0506096466 -0.0137951641 -0.0074760688); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), prophoto-rgb)} + +<===> float/output.css +a { + b: color(prophoto-rgb 0.0841896026 -0.0467124006 -0.013805913); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb 0.1937443943 -0.1519484627 -0.0725277832); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb 2922140081.0303516 -1810418807.7705455 -574654139.8912412); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.0506096466 -0.0137951641 -0.0074760688 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.0506096466 -0.0137951641 -0.0074760688 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), prophoto-rgb)} + +<===> missing/lightness/output.css +a { + b: color(prophoto-rgb 0.0010727238 0.000279135 -0.0088387805); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), prophoto-rgb)} + +<===> missing/chroma/output.css +a { + b: color(prophoto-rgb 0.0160000001 0.0160000003 0.0160000036); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), prophoto-rgb)} + +<===> missing/hue/output.css +a { + b: color(prophoto-rgb 0.0479066375 -0.0113980141 0.0096553537); +} diff --git a/spec/core_functions/color/to_space/oklch/rec2020.hrx b/spec/core_functions/color/to_space/oklch/rec2020.hrx new file mode 100644 index 0000000000..65d2714c48 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/rec2020.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 0.9999999872 1.0000000081 1.0000001161); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.3319485728 0.3319485809 0.3319486233); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.0256576867 -0.0056343197 -0.0019025127); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), rec2020)} + +<===> float/output.css +a { + b: color(rec2020 0.064418765 -0.0232002216 -0.0029907849); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 0.2237639493 -0.1587187375 -0.0339392569); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 56131778.24188723 -38257541.3895273 -10955273.518136343); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.0256576867 -0.0056343197 -0.0019025127 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.0256576867 -0.0056343197 -0.0019025127 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), rec2020)} + +<===> missing/lightness/output.css +a { + b: color(rec2020 0.0007134353 0.0000902745 -0.002575042); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), rec2020)} + +<===> missing/chroma/output.css +a { + b: color(rec2020 0.0044999999 0.0045000001 0.0045000011); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), rec2020)} + +<===> missing/hue/output.css +a { + b: color(rec2020 0.0225650026 -0.0048194756 0.0030470892); +} diff --git a/spec/core_functions/color/to_space/oklch/rgb.hrx b/spec/core_functions/color/to_space/oklch/rgb.hrx new file mode 100644 index 0000000000..98ec3a4d61 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), rgb)} + +<===> white/output.css +a { + b: hsl(43.8135971986, 172.5242105081%, 100.0000042145%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), rgb)} + +<===> gray/output.css +a { + b: rgb(99.0860757797, 99.0860799859, 99.0860913711); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), rgb)} + +<===> middle/output.css +a { + b: hsl(349.9222383971, 174.3087628098%, 3.6948783654%); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), rgb)} + +<===> float/output.css +a { + b: hsl(342.3640346721, 274.4922188663%, 4.7714615434%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(342.6995890373, 454.6290714992%, 7.2218303523%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(160.1123681644, 426.4426548179%, 360094749.97600085%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: hsla(349.9222383971, 174.3087628098%, 3.6948783654%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: hsla(349.9222383971, 174.3087628098%, 3.6948783654%, 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), rgb)} + +<===> missing/lightness/output.css +a { + b: hsl(221.7487183642, 266.6061391496%, -0.2273359503%); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), rgb)} + +<===> missing/chroma/output.css +a { + b: rgb(3.2945997709, 3.2946000649, 3.2946008608); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), rgb)} + +<===> missing/hue/output.css +a { + b: hsl(342.5627231518, 169.3005035983%, 3.4369836375%); +} diff --git a/spec/core_functions/color/to_space/oklch/srgb.hrx b/spec/core_functions/color/to_space/oklch/srgb.hrx new file mode 100644 index 0000000000..c19e28b857 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/srgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), srgb)} + +<===> white/output.css +a { + b: color(srgb 0.9999999694 1.0000000087 1.0000001149); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.3885728462 0.3885728627 0.3885729073); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.1013537513 -0.027456184 -0.0058209203); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), srgb)} + +<===> float/output.css +a { + b: color(srgb 0.1786875221 -0.0832582912 -0.0062638365); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb 0.4005437063 -0.2561070992 -0.066768286); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb 18956919.35191059 -11755024.352390574 -1575227.1966261775); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.1013537513 -0.027456184 -0.0058209203 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.1013537513 -0.027456184 -0.0058209203 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), srgb)} + +<===> missing/lightness/output.css +a { + b: color(srgb 0.0037875565 0.0001002403 -0.0083342755); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), srgb)} + +<===> missing/chroma/output.css +a { + b: color(srgb 0.0129199991 0.0129200003 0.0129200034); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), srgb)} + +<===> missing/hue/output.css +a { + b: color(srgb 0.0925581424 -0.0238184697 0.0100030504); +} diff --git a/spec/core_functions/color/to_space/oklch/srgb_linear.hrx b/spec/core_functions/color/to_space/oklch/srgb_linear.hrx new file mode 100644 index 0000000000..cd128bb27d --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/srgb_linear.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 0.9999999305 1.0000000197 1.0000002613); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.1249999913 0.1250000025 0.1250000327); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.0102342031 -0.0021250916 -0.0004505356); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), srgb-linear)} + +<===> float/output.css +a { + b: color(srgb-linear 0.0268484583 -0.00761821 -0.0004848171); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear 0.1332496936 -0.0533553421 -0.0056166345); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear 257535278804612064 -81795720332859872 -657382012471774.5); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.0102342031 -0.0021250916 -0.0004505356 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.0102342031 -0.0021250916 -0.0004505356 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), srgb-linear)} + +<===> missing/lightness/output.css +a { + b: color(srgb-linear 0.0002931545 0.0000077585 -0.0006450678); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), srgb-linear)} + +<===> missing/chroma/output.css +a { + b: color(srgb-linear 0.0009999999 0.001 0.0010000003); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), srgb-linear)} + +<===> missing/hue/output.css +a { + b: color(srgb-linear 0.0089064724 -0.0018435348 0.0007742299); +} diff --git a/spec/core_functions/color/to_space/oklch/xyz.hrx b/spec/core_functions/color/to_space/oklch/xyz.hrx new file mode 100644 index 0000000000..c1be0a4b2b --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/xyz.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559526 1.0000000182 1.0890580001); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.1188069941 0.1250000023 0.13613225); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.0033792787 0.0006238666 -0.0004837129); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), xyz)} + +<===> float/output.css +a { + b: color(xyz 0.0082604044 0.0002257242 -0.0008498824); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 0.0348582183 -0.010229465 -0.0091226442); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz 76837666021869456 -3783149507010139 -5396117824941693); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0033792787 0.0006238666 -0.0004837129 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0033792787 0.0006238666 -0.0004837129 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), xyz)} + +<===> missing/lightness/output.css +a { + b: color(xyz 0.0000072462 0.0000213158 -0.000606566); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), xyz)} + +<===> missing/chroma/output.css +a { + b: color(xyz 0.000950456 0.001 0.001089058); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), xyz)} + +<===> missing/hue/output.css +a { + b: color(xyz 0.0031534617 0.0006313185 0.0006883601); +} diff --git a/spec/core_functions/color/to_space/oklch/xyz_d50.hrx b/spec/core_functions/color/to_space/oklch/xyz_d50.hrx new file mode 100644 index 0000000000..b5d2861076 --- /dev/null +++ b/spec/core_functions/color/to_space/oklch/xyz_d50.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(0% 0 0deg), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(100% 0 0deg), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956911 1.0000000145 0.82510479); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(50% 0 0deg), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.1205369614 0.1250000018 0.1031380988); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.0035798412 0.0007262784 -0.0003855337); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), xyz-d50)} + +<===> float/output.css +a { + b: color(xyz-d50 0.0087041611 0.0004828135 -0.0007119576); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 0.0367521174 -0.0089430834 -0.007335284); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 999999 0deg), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 80704511354532880 -1378297606600871.2 -4824371922593688); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0035798412 0.0007262784 -0.0003855337 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0035798412 0.0007262784 -0.0003855337 / 0); +} + +<===> +================================================================================ +<===> missing/lightness/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(none 0.1 30deg), xyz-d50)} + +<===> missing/lightness/output.css +a { + b: color(xyz-d50 0.0000385276 0.000031683 -0.0004558074); +} + +<===> +================================================================================ +<===> missing/chroma/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% none 30deg), xyz-d50)} + +<===> missing/chroma/output.css +a { + b: color(xyz-d50 0.0009642957 0.001 0.0008251048); +} + +<===> +================================================================================ +<===> missing/hue/input.scss +@use 'sass:color'; +a {b: color.to-space(oklch(10% 0.1 none), xyz-d50)} + +<===> missing/hue/output.css +a { + b: color(xyz-d50 0.0032845429 0.0007069569 0.0004979173); +} diff --git a/spec/core_functions/color/to_space/options.yml b/spec/core_functions/color/to_space/options.yml new file mode 100644 index 0000000000..99ecec7ed1 --- /dev/null +++ b/spec/core_functions/color/to_space/options.yml @@ -0,0 +1,3 @@ +--- +:ignore_for: +- libsass diff --git a/spec/core_functions/color/to_space/prophoto_rgb/a98_rgb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/a98_rgb.hrx new file mode 100644 index 0000000000..83119c13f3 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/a98_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.5670420112 0.5670420112 0.5670420112); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb -0.3560951477 0.5045482124 0.8644762739); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -1.4279386159 0.6992982312 1.851989355); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -94583.3572201015 41648.2618143793 12982.0175899086); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb -0.1365499745 0.2865616306 0.3841343378 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb -0.1365499745 0.2865616306 0.3841343378 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), a98-rgb)} + +<===> missing/red/output.css +a { + b: color(a98-rgb none 0.2938324337 0.384534187); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), a98-rgb)} + +<===> missing/green/output.css +a { + b: color(a98-rgb -0.0732568776 none 0.3916546985); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), a98-rgb)} + +<===> missing/blue/output.css +a { + b: color(a98-rgb 0.1371997596 0.2872404522 none); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/display_p3.hrx b/spec/core_functions/color/to_space/prophoto_rgb/display_p3.hrx new file mode 100644 index 0000000000..963621c62c --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.5723067532 0.5723067532 0.5723067532); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 -0.4263141523 0.4923548598 0.8503908535); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -1.5123725709 0.6119230865 1.7528266609); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -40921.237624831 15288.5098255533 -4976.1422545962); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 -0.1681406496 0.272751421 0.3768280764 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 -0.1681406496 0.272751421 0.3768280764 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.278189942 0.3765750961); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 -0.0396944837 none 0.3821042494); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.0601855627 0.2760901066 none); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/hsl.hrx b/spec/core_functions/color/to_space/prophoto_rgb/hsl.hrx new file mode 100644 index 0000000000..f01e523eec --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), hsl)} + +<===> white/output.css +a { + b: hsl(180, 50%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 57.2306753164%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), hsl)} + +<===> middle/output.css +a { + b: hsl(195.9034030348, 388.9813639336%, 17.9876851056%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(199.2935266227, 2154.1559841675%, 8.1167706475%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(347.1631207662, 234.6485806965%, -1340219.8783108443%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(190.4112342736, 389.9464516401%, 7.9139613859%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(190.4112342736, 389.9464516401%, 7.9139613859%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), hsl)} + +<===> missing/red/output.css +a { + b: hsl(188.6270203536, 825.3071653223%, 4.1925835467%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), hsl)} + +<===> missing/green/output.css +a { + b: hsl(241.7396943935, 128.7470611392%, 17.4883701258%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(119.2084673976, 194.643672602%, 9.5495891256%); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/hwb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/hwb.hrx new file mode 100644 index 0000000000..1192159ecc --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/hwb.hrx @@ -0,0 +1,149 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb 0 0 0), hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb 1 1 1), hwb)); + +<===> white/output.css +a { + value: white; + space: hwb; + channels: 0deg 100% 0% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb 0.5 0.5 0.5), hwb)); + +<===> gray/output.css +a { + value: hsl(0, 0%, 57.2306753164%); + space: hwb; + channels: 0deg 57.2306753164% 42.7693246836% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb 0.2 0.4 0.8), hwb)); + +<===> middle/output.css +a { + value: hsl(195.9034030348, 388.9813639336%, 17.9876851056%); + space: hwb; + channels: 195.9034030348deg -51.9810577583% 12.0435720304% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb -1 0.4 2), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(199.2935266227, 2154.1559841675%, 8.1167706475%); + space: hwb; + channels: 199.2935266227deg -166.731129976% -82.9646712709% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb -999999 0 0), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(347.1631207662, 234.6485806965%, -1340219.878310844%); + space: hwb; + channels: 167.1631207662deg -4485026.800979206% -1804487.0443575173% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(190.4112342736, 389.9464516401%, 7.9139613859%, 0.4); + space: hwb; + channels: 190.4112342736deg -22.9462502225% 61.2258270058% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(190.4112342736, 389.9464516401%, 7.9139613859%, 0); + space: hwb; + channels: 190.4112342736deg -22.9462502225% 61.2258270058% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb none 0.2 0.3), hwb)); + +<===> missing/red/output.css +a { + value: hsl(188.6270203536, 825.3071653223%, 4.1925835467%); + space: hwb; + channels: 188.6270203536deg -30.409108876% 61.2057240306% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(prophoto-rgb 0.1 none 0.3), hwb)); + +<===> missing/green/output.css +a { + value: hsl(241.7396943935, 128.7470611392%, 17.4883701258%); + space: hwb; + channels: 241.7396943935deg -5.0273924523% 59.9958672962% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), hwb)} + +<===> missing/blue/output.css +a { + b: hsl(119.2084673976, 194.643672602%, 9.5495891256%); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx b/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx new file mode 100644 index 0000000000..d78de9c6dc --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx @@ -0,0 +1,119 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), lab)} + +<===> gray/output.css +a { + b: lab(60.5314588248% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), lab)} + +<===> middle/output.css +a { + b: lab(46.0098211673% -39.6566664112 -68.0244470598); +} + +<===> +================================================================================ +<===> out_of_range/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(30.0623308533% 38.5823326773 -241.4998540297); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(24.9090529931% -30.9723221547 -26.5858249779 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(24.9090529931% -30.9723221547 -26.5858249779 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), lab)} + +<===> missing/red/output.css +a { + b: lab(23.4372923288% -57.2633255164 -29.1233433646); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), lab)} + +<===> missing/green/output.css +a { + b: lab(4.1334625643% 41.362651194 -62.4058084759); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(24.9058511193% -38.7042406064 42.9411226195); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx b/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx new file mode 100644 index 0000000000..481afd35d4 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx @@ -0,0 +1,119 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), lch)} + +<===> gray/output.css +a { + b: lch(60.5314588248% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), lch)} + +<===> middle/output.css +a { + b: lch(46.0098211673% 78.7399300777 239.7588117754deg); +} + +<===> +================================================================================ +<===> out_of_range/options.yml +:todo: + - dart-sass # # w3c/csswg-drafts#9484 + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(30.0623308533% 244.5624171683 279.0769417748deg); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(24.9090529931% 40.8177758998 220.6419219413deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(24.9090529931% 40.8177758998 220.6419219413deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), lch)} + +<===> missing/red/output.css +a { + b: lch(23.4372923288% 64.2437357096 206.9572653738deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), lch)} + +<===> missing/green/output.css +a { + b: lch(4.1334625643% 74.8689110735 303.5364691761deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(24.9058511193% 57.8096726572 132.0293732633deg); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx b/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx new file mode 100644 index 0000000000..d9fabded28 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), oklab)} + +<===> gray/output.css +a { + b: oklab(65.9753951081% 0.0000000001 0.0000000246); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), oklab)} + +<===> middle/output.css +a { + b: oklab(52.9739863521% -0.23472674 -0.1933931965); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(9.4597839538% -2.2223701334 -0.8062107579); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(34.6066204299% -0.1151566731 -0.0744029999 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(34.6066204299% -0.1151566731 -0.0744029999 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), oklab)} + +<===> missing/red/output.css +a { + b: oklab(32.493750959% -0.2028589632 -0.0824787667); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), oklab)} + +<===> missing/green/output.css +a { + b: oklab(20.6577507967% -0.042480718 -0.1739784043); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(33.9153744238% -0.1155256021 0.0932618247); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx b/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx new file mode 100644 index 0000000000..da780f59d8 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), oklch)} + +<===> gray/output.css +a { + b: oklch(65.9753951081% 0.0000000246 89.875562502deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), oklch)} + +<===> middle/output.css +a { + b: oklch(52.9739863521% 0.3041341331 219.4853767353deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(9.4597839538% 2.3640864612 199.9392877927deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(34.6066204299% 0.1371016621 212.8665983723deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(34.6066204299% 0.1371016621 212.8665983723deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), oklch)} + +<===> missing/red/output.css +a { + b: oklch(32.493750959% 0.2189851728 202.1257651897deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), oklch)} + +<===> missing/green/output.css +a { + b: oklch(20.6577507967% 0.1790896327 256.2784427934deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(33.9153744238% 0.1484719929 141.0866609821deg); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/prophoto_rgb.hrx new file mode 100644 index 0000000000..c4c9c1e346 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/prophoto_rgb.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), prophoto-rgb)} + +<===> in_range/output.css +a { + b: color(prophoto-rgb 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), prophoto-rgb)} + +<===> out_of_range/output.css +a { + b: color(prophoto-rgb -1 0.4 2); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.1 0.2 none); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/rec2020.hrx b/spec/core_functions/color/to_space/prophoto_rgb/rec2020.hrx new file mode 100644 index 0000000000..3a172f985b --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.5277221397 0.5277221397 0.5277221397); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 -0.1605692199 0.4295080587 0.8280670897); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -1.3001703326 0.4795529651 1.8550030977); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -86467.5261196395 24057.1232097426 -7686.7078341848); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 -0.0023957954 0.2043088925 0.318295884 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 -0.0023957954 0.2043088925 0.318295884 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.2069376666 0.3181540374); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.0119013078 none 0.3219111049); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.0713341527 0.2072064033 none); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/rgb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/rgb.hrx new file mode 100644 index 0000000000..b6788c7173 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), rgb)} + +<===> gray/output.css +a { + b: rgb(145.9382220568, 145.9382220568, 145.9382220568); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), rgb)} + +<===> middle/output.css +a { + b: hsl(195.9034030348, 388.9813639336%, 17.9876851056%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(199.2935266227, 2154.1559841675%, 8.1167706475%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(347.1631207662, 234.6485806965%, -1340219.8783108443%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: hsla(190.4112342736, 389.9464516401%, 7.9139613859%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: hsla(190.4112342736, 389.9464516401%, 7.9139613859%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), rgb)} + +<===> missing/red/output.css +a { + b: rgb(0, 73.552095814, 98.9254037219); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), rgb)} + +<===> missing/green/output.css +a { + b: hsl(234.8931237502, 120.5152085415%, 18.1412125578%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), rgb)} + +<===> missing/blue/output.css +a { + b: hsl(133.9801165671, 187.2672802248%, 9.7948015855%); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/srgb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/srgb.hrx new file mode 100644 index 0000000000..c2f0ea5fb7 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.5723067532 0.5723067532 0.5723067532); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), srgb)} + +<===> middle/output.css +a { + b: color(srgb -0.5198105776 0.5086505738 0.8795642797); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -1.6673112998 0.7051691708 1.8296467127); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -44850.2680097921 18045.8704435752 4589.3682169335); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb -0.2294625022 0.280644099 0.3877417299 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb -0.2294625022 0.280644099 0.3877417299 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.2884395914 0.3879427597); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb -0.0372170759 none 0.400041327); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb -0.0854765695 0.2813726012 none); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/srgb_linear.hrx b/spec/core_functions/color/to_space/prophoto_rgb/srgb_linear.hrx new file mode 100644 index 0000000000..887db0215b --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.2871745887 0.2871745887 0.2871745887); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear -0.232837807 0.2221355079 0.7475773304); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -3.2423661674 0.4553849808 4.0248155294); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -128360522797.99591 14437901609.733408 540024616.0904481); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear -0.0430382059 0.0640182408 0.1244386226 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear -0.0430382059 0.0640182408 0.1244386226 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.0676448843 0.1245742709); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear -0.0028805786 none 0.1328972872); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear -0.0079148637 0.0643522253 none); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/xyz.hrx b/spec/core_functions/color/to_space/prophoto_rgb/xyz.hrx new file mode 100644 index 0000000000..fb6e0d9664 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.27294679 0.2871745887 0.3127497117); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.1183353555 0.1633232963 0.7325727364); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz -0.4478815578 -0.0732156915 3.8173184875); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -47674467013.18759 -16929933315.113932 -247080732.7777534); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0276021409 0.0456157517 0.1250815881 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0276021409 0.0456157517 0.1250815881 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.041363137 0.1250195241); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.0213812245 none 0.1257953743); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.0181962227 0.0437192439 none); +} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/xyz_d50.hrx b/spec/core_functions/color/to_space/prophoto_rgb/xyz_d50.hrx new file mode 100644 index 0000000000..f8ce37c843 --- /dev/null +++ b/spec/core_functions/color/to_space/prophoto_rgb/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 1 1 1), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.2769212143 0.2871745887 0.2369490749); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.0909854172 0.1527592329 0.5521676847); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -1 0.4 2), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 -0.662628365 -0.1509612194 2.873181106); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb -999999 0 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -50335581773.96425 -18176260183.033443 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0236937162 0.0438615839 0.0944772554 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0236937162 0.0438615839 0.0944772554 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.0392959056 0.0944772554); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.0162331704 none 0.0944772554); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.0201042951 0.0438512858 none); +} diff --git a/spec/core_functions/color/to_space/rec2020/a98_rgb.hrx b/spec/core_functions/color/to_space/rec2020/a98_rgb.hrx new file mode 100644 index 0000000000..d7743ad10b --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/a98_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.5417153213 0.5417153213 0.5417153213); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.13489511 0.4629710676 0.8371559205); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -1.1646526275 0.5655440386 1.9874528803); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -1119831.7269648165 407249.8039869511 187156.9941916847); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.1470288666 0.2765731567 0.3660737554 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.1470288666 0.2765731567 0.3660737554 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), a98-rgb)} + +<===> missing/red/output.css +a { + b: color(a98-rgb none 0.2824471442 0.3668416445); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), a98-rgb)} + +<===> missing/green/output.css +a { + b: color(a98-rgb 0.1694794184 none 0.3702410451); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), a98-rgb)} + +<===> missing/blue/output.css +a { + b: color(a98-rgb 0.1707192347 0.278433765 none); +} diff --git a/spec/core_functions/color/to_space/rec2020/display_p3.hrx b/spec/core_functions/color/to_space/rec2020/display_p3.hrx new file mode 100644 index 0000000000..3321e3fec4 --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.5465835909 0.5465835909 0.5465835909); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 -0.1207745932 0.4564097151 0.8252565585); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -1.2450966031 0.4927082146 1.877624028); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -392808.6781006625 111415.2873247036 -30092.3347141782); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.0867047731 0.2651407977 0.3592704962 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.0867047731 0.2651407977 0.3592704962 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.2685429813 0.3591672285); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 0.1670371089 none 0.3610354836); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.1260425103 0.2677058987 none); +} diff --git a/spec/core_functions/color/to_space/rec2020/hsl.hrx b/spec/core_functions/color/to_space/rec2020/hsl.hrx new file mode 100644 index 0000000000..b8b59b7e1b --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 54.6583590878%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), hsl)} + +<===> middle/output.css +a { + b: hsl(200.8128966593, 189.0732219315%, 29.5081773497%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(204.9795970204, 570.1567645938%, 29.20918492%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(351.6022221471, 202.9643125658%, -14161586.907056699%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(194.5479244469, 123.11735267%, 16.5168092719%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(194.5479244469, 123.11735267%, 16.5168092719%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), hsl)} + +<===> missing/red/output.css +a { + b: hsl(189.4362583411, 400.9276505087%, 7.3695655834%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), hsl)} + +<===> missing/green/output.css +a { + b: hsl(273.3326815842, 128.5408000864%, 16.5048029077%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(97.48398538, 169.4637013095%, 10.0907863158%); +} diff --git a/spec/core_functions/color/to_space/rec2020/hwb.hrx b/spec/core_functions/color/to_space/rec2020/hwb.hrx new file mode 100644 index 0000000000..54449401d4 --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/hwb.hrx @@ -0,0 +1,149 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 0 0 0), hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 1 1 1), hwb)); + +<===> white/output.css +a { + value: white; + space: hwb; + channels: 0deg 100% 0% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 0.5 0.5 0.5), hwb)); + +<===> gray/output.css +a { + value: hsl(0, 0%, 54.6583590878%); + space: hwb; + channels: 0deg 54.6583590878% 45.3416409122% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 0.2 0.4 0.8), hwb)); + +<===> middle/output.css +a { + value: hsl(200.8128966593, 189.0732219315%, 29.5081773497%); + space: hwb; + channels: 200.8128966593deg -26.2838842987% 14.6997610019% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 -1 0.4 2), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(204.9795970204, 570.1567645938%, 29.20918492%); + space: hwb; + channels: 204.9795970204deg -137.3289587842% -95.7473286243% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 -999999 0 0), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(351.6022221471, 202.9643125658%, -14161586.907056702%); + space: hwb; + channels: 171.6022221471deg -42904554.421379425% -14581280.607266026% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(194.5479244469, 123.11735267%, 16.5168092719%, 0.4); + space: hwb; + channels: 194.5479244469deg -3.8182490492% 63.148132407% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(194.5479244469, 123.11735267%, 16.5168092719%, 0); + space: hwb; + channels: 194.5479244469deg -3.8182490492% 63.148132407% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 none 0.2 0.3), hwb)); + +<===> missing/red/output.css +a { + value: hsl(189.4362583411, 400.9276505087%, 7.3695655834%); + space: hwb; + channels: 189.4362583411deg -22.1770605629% 63.0838082703% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(rec2020 0.1 none 0.3), hwb)); + +<===> missing/green/output.css +a { + value: hsl(273.3326815842, 128.5408000864%, 16.5048029077%); + space: hwb; + channels: 273.3326815842deg -4.7106028025% 62.2797913821% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), hwb)} + +<===> missing/blue/output.css +a { + b: hsl(97.48398538, 169.4637013095%, 10.0907863158%); +} diff --git a/spec/core_functions/color/to_space/rec2020/lab.hrx b/spec/core_functions/color/to_space/rec2020/lab.hrx new file mode 100644 index 0000000000..a0deb83d90 --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/lab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), lab)} + +<===> gray/output.css +a { + b: lab(58.0104094495% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), lab)} + +<===> middle/output.css +a { + b: lab(47.1831278283% -5.7697476711 -62.0090026934); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(20.0233737121% -563.3455911654 -257.3742149404); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(26.3242106967% -12.9991476228 -20.999464924 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(26.3242106967% -12.9991476228 -20.999464924 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), lab)} + +<===> missing/red/output.css +a { + b: lab(24.4167376804% -31.5965927959 -24.304113724); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), lab)} + +<===> missing/green/output.css +a { + b: lab(9.8621057796% 42.7961734552 -48.7693303375); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(24.8794631126% -29.5241312368 39.836355697); +} diff --git a/spec/core_functions/color/to_space/rec2020/lch.hrx b/spec/core_functions/color/to_space/rec2020/lch.hrx new file mode 100644 index 0000000000..a7a357040e --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/lch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), lch)} + +<===> gray/output.css +a { + b: lch(58.0104094495% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), lch)} + +<===> middle/output.css +a { + b: lch(47.1831278283% 62.2768528686 264.6841092292deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(20.0233737121% 619.3542940851 204.5541138043deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(26.3242106967% 24.6972744653 238.2415478893deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(26.3242106967% 24.6972744653 238.2415478893deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), lch)} + +<===> missing/red/output.css +a { + b: lch(24.4167376804% 39.8626971017 217.5675010071deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), lch)} + +<===> missing/green/output.css +a { + b: lch(9.8621057796% 64.8842048882 311.267672367deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(24.8794631126% 49.5843681064 126.5434514525deg); +} diff --git a/spec/core_functions/color/to_space/rec2020/oklab.hrx b/spec/core_functions/color/to_space/rec2020/oklab.hrx new file mode 100644 index 0000000000..583e646b89 --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/oklab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), oklab)} + +<===> gray/output.css +a { + b: oklab(63.8020766953% 0.0000000001 0.0000000238); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), oklab)} + +<===> middle/output.css +a { + b: oklab(55.2815992148% -0.0857471824 -0.1749134266); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(33.9832655696% -2.4377896861 -0.667787683); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(36.3512304678% -0.050217455 -0.0580072349 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(36.3512304678% -0.050217455 -0.0580072349 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), oklab)} + +<===> missing/red/output.css +a { + b: oklab(34.1361541836% -0.1128551253 -0.067830888); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), oklab)} + +<===> missing/green/output.css +a { + b: oklab(25.3247541535% 0.0750438961 -0.1364735034); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(34.13560351% -0.0917726115 0.0859786399); +} diff --git a/spec/core_functions/color/to_space/rec2020/oklch.hrx b/spec/core_functions/color/to_space/rec2020/oklch.hrx new file mode 100644 index 0000000000..6e58a0250c --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/oklch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755622419deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), oklch)} + +<===> gray/output.css +a { + b: oklch(63.8020766953% 0.0000000238 89.8755631672deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), oklch)} + +<===> middle/output.css +a { + b: oklch(55.2815992148% 0.1948006317 243.8846858979deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(33.9832655696% 2.5275994429 195.319325973deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(36.3512304678% 0.0767243904 229.1169268509deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(36.3512304678% 0.0767243904 229.1169268509deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), oklch)} + +<===> missing/red/output.css +a { + b: oklch(34.1361541836% 0.1316712143 211.0077162465deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), oklch)} + +<===> missing/green/output.css +a { + b: oklch(25.3247541535% 0.155745316 298.8054651649deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(34.13560351% 0.1257558697 136.866949571deg); +} diff --git a/spec/core_functions/color/to_space/rec2020/prophoto_rgb.hrx b/spec/core_functions/color/to_space/rec2020/prophoto_rgb.hrx new file mode 100644 index 0000000000..67c4fe9069 --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.4728514184 0.4728514184 0.4728514184); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.3205854039 0.3793783564 0.7698022311); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb -0.5478493377 0.3839894918 2.1828841348); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -20568106.26542821 -4493352.638848251 785798.3189394); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.1520851228 0.1987719462 0.283976665 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.1520851228 0.1987719462 0.283976665 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.1963011404 0.2840567616); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.1451585947 none 0.2808956158); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.1184473522 0.1951112391 none); +} diff --git a/spec/core_functions/color/to_space/rec2020/rec2020.hrx b/spec/core_functions/color/to_space/rec2020/rec2020.hrx new file mode 100644 index 0000000000..bf9ceadd1b --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/rec2020.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), rec2020)} + +<===> in_range/output.css +a { + b: color(rec2020 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), rec2020)} + +<===> out_of_range/output.css +a { + b: color(rec2020 -1 0.4 2); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.1 0.2 none); +} diff --git a/spec/core_functions/color/to_space/rec2020/rgb.hrx b/spec/core_functions/color/to_space/rec2020/rgb.hrx new file mode 100644 index 0000000000..cd87c3b27a --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), rgb)} + +<===> gray/output.css +a { + b: rgb(139.3788156739, 139.3788156739, 139.3788156739); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), rgb)} + +<===> middle/output.css +a { + b: hsl(200.8128966593, 189.0732219315%, 29.5081773497%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(204.9795970204, 570.1567645938%, 29.20918492%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(351.6022221471, 202.9643125658%, -14161586.907056699%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: hsla(194.5479244469, 123.11735267%, 16.5168092719%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: hsla(194.5479244469, 123.11735267%, 16.5168092719%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), rgb)} + +<===> missing/red/output.css +a { + b: rgb(0, 70.4374731297, 94.1362889109); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), rgb)} + +<===> missing/green/output.css +a { + b: rgb(48.0971037271, 0, 96.1865319755); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), rgb)} + +<===> missing/blue/output.css +a { + b: rgb(14.8533924164, 69.337066059, 0); +} diff --git a/spec/core_functions/color/to_space/rec2020/srgb.hrx b/spec/core_functions/color/to_space/rec2020/srgb.hrx new file mode 100644 index 0000000000..467aa2fc91 --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.5465835909 0.5465835909 0.5465835909); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), srgb)} + +<===> middle/output.css +a { + b: color(srgb -0.262838843 0.4659375855 0.85300239); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -1.3732895878 0.5707880468 1.9574732862); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -429045.5442137942 145813.8060726603 65354.787400083); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb -0.0381824905 0.2699077119 0.3685186759 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb -0.0381824905 0.2699077119 0.3685186759 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.2762253848 0.3691619173); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb 0.188616093 none 0.3772020862); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb 0.0582485977 0.271910063 none); +} diff --git a/spec/core_functions/color/to_space/rec2020/srgb_linear.hrx b/spec/core_functions/color/to_space/rec2020/srgb_linear.hrx new file mode 100644 index 0000000000..5b8ede6c36 --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.2597194371 0.2597194371 0.2597194371); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear -0.0561682415 0.1838568265 0.6975942253); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -2.0689650071 0.28550882 4.7113611346); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -28986940627436.953 2174258821934.0952 316855134441.09607); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear -0.0029553011 0.0592131472 0.111863462 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear -0.0029553011 0.0592131472 0.111863462 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.0620141462 0.1122716521); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear 0.0296680112 none 0.1174471704); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear 0.004719249 0.0600927379 none); +} diff --git a/spec/core_functions/color/to_space/rec2020/xyz.hrx b/spec/core_functions/color/to_space/rec2020/xyz.hrx new file mode 100644 index 0000000000..e563e7e8e3 --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.2468518784 0.2597194371 0.282849466); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.1684834116 0.1699060269 0.6839147362); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 0.0991815219 0.1043683721 4.4723366127); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -11119280444659.668 -4585917923503.705 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0401441609 0.0497946582 0.1133305869 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0401441609 0.0497946582 0.1133305869 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.0438868281 0.1133305869); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.0321156515 none 0.1117721115); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.0223529743 0.0435473713 none); +} diff --git a/spec/core_functions/color/to_space/rec2020/xyz_d50.hrx b/spec/core_functions/color/to_space/rec2020/xyz_d50.hrx new file mode 100644 index 0000000000..170adbf50c --- /dev/null +++ b/spec/core_functions/color/to_space/rec2020/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 1 1 1), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.5 0.5 0.5), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.2504463303 0.2597194371 0.2142957029); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.2 0.4 0.8), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.1461303676 0.1615955499 0.5152185696); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -1 0.4 2), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 -0.1181465111 0.0299487833 3.363289424); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 -999999 0 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -11757457714802.084 -4871490904380.732 33734088609.397465); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0375225748 0.0485727436 0.0855889676 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0375225748 0.0485727436 0.0855889676 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.0422970228 0.0856324257); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.0283237743 none 0.0839247274); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(rec2020 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.0243454002 0.0437664763 none); +} diff --git a/spec/core_functions/color/to_space/rgb/a98_rgb.hrx b/spec/core_functions/color/to_space/rgb/a98_rgb.hrx new file mode 100644 index 0000000000..feed645db7 --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/a98_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.660735938 0.660735938 0.660735938); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.3199480242 0.5287075634 0.8521762133); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), a98-rgb)} + +<===> float/output.css +a { + b: color(a98-rgb 0.2781926905 0.395603604 0.7684686532); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb 0.1411766693 0.3918977213 1.5718485866); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -6760.0211192379 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.0827079329 0.1047180692 0.1375163198 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.0827079329 0.1047180692 0.1375163198 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), a98-rgb)} + +<===> missing/red/output.css +a { + b: color(a98-rgb none 0.1047180692 0.1375163198); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), a98-rgb)} + +<===> missing/green/output.css +a { + b: color(a98-rgb 0.0615069668 none 0.1360938515); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), a98-rgb)} + +<===> missing/blue/output.css +a { + b: color(a98-rgb 0.0827079329 0.1047180692 none); +} diff --git a/spec/core_functions/color/to_space/rgb/display_p3.hrx b/spec/core_functions/color/to_space/rgb/display_p3.hrx new file mode 100644 index 0000000000..3e40aa8dd2 --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/display_p3.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.6666666667 0.6666666667 0.6666666667); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.2644791221 0.525654809 0.8414340148); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), display-p3)} + +<===> float/output.css +a { + b: color(display-p3 0.2464159945 0.3912935228 0.7592218197); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -0.0462648785 0.3843286419 1.5086360967); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -3614.8515104566 -948.8907591358 -719.4436054746); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.0477705982 0.0773808537 0.1142571507 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.0477705982 0.0773808537 0.1142571507 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.0765677073 0.1139614092); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 0.0322534105 none 0.1113368327); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.0477705982 0.0773808537 none); +} diff --git a/spec/core_functions/color/to_space/rgb/hsl.hrx b/spec/core_functions/color/to_space/rgb/hsl.hrx new file mode 100644 index 0000000000..041c0d0010 --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/hsl.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 66.6666666667%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, hsl)} + +<===> middle/output.css +a { + b: hsl(207.2727272727, 73.3333333333%, 50%); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), hsl)} + +<===> float/output.css +a { + b: hsl(219.6637272829, 59.9519025013%, 49.0816263243%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(220, 281.25%, 68.6274509804%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(0, 100%, -196078.2352941177%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(210, 50%, 7.8431372549%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(210, 50%, 7.8431372549%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), hsl)} + +<===> missing/red/output.css +a { + b: hsl(200, 100%, 5.8823529412%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), hsl)} + +<===> missing/green/output.css +a { + b: hsl(260, 100%, 5.8823529412%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(90, 100%, 3.9215686275%); +} diff --git a/spec/core_functions/color/to_space/rgb/hwb.hrx b/spec/core_functions/color/to_space/rgb/hwb.hrx new file mode 100644 index 0000000000..4de4725d36 --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/hwb.hrx @@ -0,0 +1,165 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(#000, hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(#fff, hwb)); + +<===> white/output.css +a { + value: white; + space: hwb; + channels: 0deg 100% 0% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(#aaa, hwb)); + +<===> gray/output.css +a { + value: #aaaaaa; + space: hwb; + channels: 0deg 66.6666666667% 33.3333333333% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(#28d, hwb)); + +<===> middle/output.css +a { + value: #2288dd; + space: hwb; + channels: 207.2727272727deg 13.3333333333% 13.3333333333% / 1; +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect( + color.to-space(rgb(50.123456789 100.987654321 200.192837465), hwb) +); + +<===> float/output.css +a { + value: hsl(219.6637272829, 59.9519025013%, 49.0816263243%); + space: hwb; + channels: 219.6637272829deg 19.6562575643% 21.4930049157% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(220, 281.25%, 68.6274509804%); + space: hwb; + channels: 220deg -19.6078431373% -56.862745098% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color.change(black, $red: -999999), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(0, 100%, -196078.2352941177%); + space: hwb; + channels: 180deg -392156.4705882354% 100% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(rgb(10 20 30 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(210, 50%, 7.8431372549%, 0.4); + space: hwb; + channels: 210deg 3.9215686275% 88.2352941176% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(rgb(10 20 30 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(210, 50%, 7.8431372549%, 0); + space: hwb; + channels: 210deg 3.9215686275% 88.2352941176% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(rgb(none 20 30), hwb)); + +<===> missing/red/output.css +a { + value: #00141e; + space: hwb; + channels: 200deg 0% 88.2352941176% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(rgb(10 none 30), hwb)); + +<===> missing/green/output.css +a { + value: #0a001e; + space: hwb; + channels: 260deg 0% 88.2352941176% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(rgb(10 20 none), hwb)} + +<===> missing/blue/output.css +a { + b: #0a1400; +} diff --git a/spec/core_functions/color/to_space/rgb/lab.hrx b/spec/core_functions/color/to_space/rgb/lab.hrx new file mode 100644 index 0000000000..5aed29df8b --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/lab.hrx @@ -0,0 +1,128 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, lab)} + +<===> gray/output.css +a { + b: lab(69.61016583% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, lab)} + +<===> middle/output.css +a { + b: lab(54.4372323192% -5.0725440763 -52.2489046102); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), lab)} + +<===> float/output.css +a { + b: lab(43.5786666948% 10.234304882 -57.7772280218); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(57.5459692675% 67.2901769646 -142.8196552841); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(5.8508980612% -1.4961467566 -8.2549264931 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(5.8508980612% -1.4961467566 -8.2549264931 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), lab)} + +<===> missing/red/output.css +a { + b: lab(5.2408778377% -4.2109320426 -9.2418429616); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), lab)} + +<===> missing/green/output.css +a { + b: lab(1.3209405601% 7.1508367815 -15.0002069297); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(5.1399777246% -5.9321982521 7.5003938134); +} diff --git a/spec/core_functions/color/to_space/rgb/lch.hrx b/spec/core_functions/color/to_space/rgb/lch.hrx new file mode 100644 index 0000000000..c5d5765c6e --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/lch.hrx @@ -0,0 +1,128 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, lch)} + +<===> gray/output.css +a { + b: lch(69.61016583% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, lch)} + +<===> middle/output.css +a { + b: lch(54.4372323192% 52.4945591121 264.454862058deg); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), lch)} + +<===> float/output.css +a { + b: lch(43.5786666948% 58.6766484583 280.0448319605deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(57.5459692675% 157.8778700497 295.2276977506deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(5.8508980612% 8.3894139559 259.7270636253deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(5.8508980612% 8.3894139559 259.7270636253deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), lch)} + +<===> missing/red/output.css +a { + b: lch(5.2408778377% 10.1559642572 245.5042015895deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), lch)} + +<===> missing/green/output.css +a { + b: lch(1.3209405601% 16.6174809948 295.4878788717deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(5.1399777246% 9.5627863857 128.3411151091deg); +} diff --git a/spec/core_functions/color/to_space/rgb/oklab.hrx b/spec/core_functions/color/to_space/rgb/oklab.hrx new file mode 100644 index 0000000000..d3fefb026a --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/oklab.hrx @@ -0,0 +1,128 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, oklab)} + +<===> gray/output.css +a { + b: oklab(73.8018666132% 0.0000000001 0.0000000275); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, oklab)} + +<===> middle/output.css +a { + b: oklab(61.3651179384% -0.0551812368 -0.1461735753); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), oklab)} + +<===> float/output.css +a { + b: oklab(52.7265723906% -0.0228233564 -0.1626243735); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(69.4063330454% -0.0570651814 -0.4015686842); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(18.6989144442% -0.0089460528 -0.0237039533 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(18.6989144442% -0.0089460528 -0.0237039533 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), oklab)} + +<===> missing/red/output.css +a { + b: oklab(17.9105838927% -0.0229309101 -0.0273761686); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), oklab)} + +<===> missing/green/output.css +a { + b: oklab(12.5934961979% 0.0296887787 -0.0622382911); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(17.4737572915% -0.0289569456 0.036012989); +} diff --git a/spec/core_functions/color/to_space/rgb/oklch.hrx b/spec/core_functions/color/to_space/rgb/oklch.hrx new file mode 100644 index 0000000000..d1268f085f --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/oklch.hrx @@ -0,0 +1,128 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, oklch)} + +<===> gray/output.css +a { + b: oklch(73.8018666132% 0.0000000275 89.8755625379deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, oklch)} + +<===> middle/output.css +a { + b: oklch(61.3651179384% 0.1562423854 249.3182340149deg); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), oklch)} + +<===> float/output.css +a { + b: oklch(52.7265723906% 0.1642181246 262.0110592016deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(69.4063330454% 0.405603061 261.9120979439deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(18.6989144442% 0.0253359283 249.3231108283deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(18.6989144442% 0.0253359283 249.3231108283deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), oklch)} + +<===> missing/red/output.css +a { + b: oklch(17.9105838927% 0.0357110801 230.049682151deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), oklch)} + +<===> missing/green/output.css +a { + b: oklch(12.5934961979% 0.0689567144 295.5019774012deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(17.4737572915% 0.0462108221 128.8016996944deg); +} diff --git a/spec/core_functions/color/to_space/rgb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/rgb/prophoto_rgb.hrx new file mode 100644 index 0000000000..6196932c4f --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/prophoto_rgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.6027153447 0.6027153447 0.6027153447); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.3990854669 0.4493912175 0.7905294798); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), prophoto-rgb)} + +<===> float/output.css +a { + b: color(prophoto-rgb 0.3371488337 0.3261543399 0.6930068512); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb 0.6182230836 0.3944820605 1.6451734949); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -40436.5951245925 -15876.4400699537 -5962.4442405194); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.0568847736 0.0623636876 0.0861178613 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.0568847736 0.0623636876 0.0861178613 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.0608214606 0.0859153209); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.0427390372 none 0.0828155088); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.0459932777 0.0604706464 none); +} diff --git a/spec/core_functions/color/to_space/rgb/rec2020.hrx b/spec/core_functions/color/to_space/rgb/rec2020.hrx new file mode 100644 index 0000000000..0728381f7f --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/rec2020.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.630170586 0.630170586 0.630170586); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.327926145 0.4744067013 0.818404902); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), rec2020)} + +<===> float/output.css +a { + b: color(rec2020 0.2689744026 0.3372277303 0.7270775308); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 0.3600781868 0.3645236247 1.5702758315); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -6394.9114299566 -2369.6504581671 -1240.1892051013); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.0214656524 0.0305541381 0.055318427 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.0214656524 0.0305541381 0.055318427 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.029610358 0.055094541); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.0111000377 none 0.0525478256); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.0189351452 0.0298903102 none); +} diff --git a/spec/core_functions/color/to_space/rgb/rgb.hrx b/spec/core_functions/color/to_space/rgb/rgb.hrx new file mode 100644 index 0000000000..1974692a39 --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/rgb.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, rgb)} + +<===> in_range/output.css +a { + b: #28d; +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), rgb)} + +<===> out_of_range/output.css +a { + b: hsl(220, 281.25%, 68.6274509804%); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), rgb)} + +<===> missing/red/output.css +a { + b: rgb(none 20 30); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), rgb)} + +<===> missing/green/output.css +a { + b: rgb(10 none 30); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), rgb)} + +<===> missing/blue/output.css +a { + b: rgb(10 20 none); +} diff --git a/spec/core_functions/color/to_space/rgb/srgb.hrx b/spec/core_functions/color/to_space/rgb/srgb.hrx new file mode 100644 index 0000000000..06dec2742e --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/srgb.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.6666666667 0.6666666667 0.6666666667); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.1333333333 0.5333333333 0.8666666667); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), srgb)} + +<===> float/output.css +a { + b: color(srgb 0.1965625756 0.3960300169 0.7850699508); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -0.1960784314 0.3921568627 1.568627451); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -3921.5647058824 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.0392156863 0.0784313725 0.1176470588 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.0392156863 0.0784313725 0.1176470588 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.0784313725 0.1176470588); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb 0.0392156863 none 0.1176470588); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb 0.0392156863 0.0784313725 none); +} diff --git a/spec/core_functions/color/to_space/rgb/srgb_linear.hrx b/spec/core_functions/color/to_space/rgb/srgb_linear.hrx new file mode 100644 index 0000000000..d3864f33a2 --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/srgb_linear.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.4019777798 0.4019777798 0.4019777798); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.0159962934 0.2462013267 0.7230551289); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), srgb-linear)} + +<===> float/output.css +a { + b: color(srgb-linear 0.0320438415 0.130102957 0.5788301943); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -0.0318960331 0.1274376804 2.8142418811); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -370263787.91908944 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.0030352698 0.0069954102 0.0129830323 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.0030352698 0.0069954102 0.0129830323 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.0069954102 0.0129830323); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear 0.0030352698 none 0.0129830323); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear 0.0030352698 0.0069954102 none); +} diff --git a/spec/core_functions/color/to_space/rgb/xyz.hrx b/spec/core_functions/color/to_space/rgb/xyz.hrx new file mode 100644 index 0000000000..f40a1dc000 --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/xyz.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.3820621634 0.4019777798 0.4377770168); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.2251320227 0.2316759373 0.7169422823); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), xyz)} + +<===> float/output.css +a { + b: color(xyz 0.1642050952 0.1416464224 0.5663237374); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 0.5403326817 0.2875237342 2.689600722); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -152693379.439195 -78732523.77333492 -7157502.1612122655); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0060963544 0.0065855902 0.0132332803 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0060963544 0.0065855902 0.0132332803 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.0059401734 0.0131746061); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.0035949053 none 0.0123994639); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.0037531665 0.005648315 none); +} diff --git a/spec/core_functions/color/to_space/rgb/xyz_d50.hrx b/spec/core_functions/color/to_space/rgb/xyz_d50.hrx new file mode 100644 index 0000000000..65b7028aab --- /dev/null +++ b/spec/core_functions/color/to_space/rgb/xyz_d50.hrx @@ -0,0 +1,129 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(#000, xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(#fff, xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(#aaa, xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.3876254351 0.4019777798 0.3316737162); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(#28d, xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.2052538337 0.2238890642 0.5404574845); +} + +<===> +================================================================================ +<===> float/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), xyz-d50)} + +<===> float/output.css +a { + b: color(xyz-d50 0.1469006816 0.1354872326 0.4264190127); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 0.4378313293 0.2548605759 2.0215760182); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color.change(black, $red: -999999), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -161459355.2194338 -82381166.54311071 -5155523.903641009); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0058754618 0.0064772745 0.0099925616 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 30 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0058754618 0.0064772745 0.0099925616 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(none 20 30), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.0058019477 0.0099502987); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 none 30), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.003181169 none 0.0093134379); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(rgb(10 20 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.00401787 0.0056902455 none); +} diff --git a/spec/core_functions/color/to_space/srgb/a98_rgb.hrx b/spec/core_functions/color/to_space/srgb/a98_rgb.hrx new file mode 100644 index 0000000000..4958138a09 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/a98_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.4961036984 0.4961036984 0.4961036984); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.2814316253 0.3994051501 0.7833135189); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -0.8376211647 0.3994051501 2.0319913216); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -2858844.9973722333 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.1551137687 0.2123166098 0.3014984164 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.1551137687 0.2123166098 0.3014984164 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), a98-rgb)} + +<===> missing/red/output.css +a { + b: color(a98-rgb none 0.2123166098 0.3014984164); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), a98-rgb)} + +<===> missing/green/output.css +a { + b: color(a98-rgb 0.1058822156 none 0.2988751674); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), a98-rgb)} + +<===> missing/blue/output.css +a { + b: color(a98-rgb 0.1551137687 0.2123166098 none); +} diff --git a/spec/core_functions/color/to_space/srgb/display_p3.hrx b/spec/core_functions/color/to_space/srgb/display_p3.hrx new file mode 100644 index 0000000000..ce8e45e67c --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.5 0.5 0.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.2498513331 0.3952400722 0.77356175); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -0.9057671336 0.3411005959 1.9199196788); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -921788.227771966 -241977.733146743 -183469.5263235596); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.1237968384 0.1975241128 0.2918191239 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.1237968384 0.1975241128 0.2918191239 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.196438359 0.2914615969); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 0.0878773188 none 0.2867666162); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.1237968384 0.1975241128 none); +} diff --git a/spec/core_functions/color/to_space/srgb/hsl.hrx b/spec/core_functions/color/to_space/srgb/hsl.hrx new file mode 100644 index 0000000000..f9aef4686d --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), hsl)} + +<===> middle/output.css +a { + b: hsl(220, 60%, 50%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(212, 300%, 50%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(0, 100%, -49999950%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(210, 50%, 20%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(210, 50%, 20%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), hsl)} + +<===> missing/red/output.css +a { + b: hsl(200, 100%, 15%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), hsl)} + +<===> missing/green/output.css +a { + b: hsl(260, 100%, 15%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(90, 100%, 10%); +} diff --git a/spec/core_functions/color/to_space/srgb/hwb.hrx b/spec/core_functions/color/to_space/srgb/hwb.hrx new file mode 100644 index 0000000000..4d9059a291 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/hwb.hrx @@ -0,0 +1,149 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb 0 0 0), hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb 1 1 1), hwb)); + +<===> white/output.css +a { + value: white; + space: hwb; + channels: 0deg 100% 0% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb 0.5 0.5 0.5), hwb)); + +<===> gray/output.css +a { + value: hsl(0, 0%, 50%); + space: hwb; + channels: 0deg 50% 50% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb 0.2 0.4 0.8), hwb)); + +<===> middle/output.css +a { + value: #3366cc; + space: hwb; + channels: 220deg 20% 20% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb -1 0.4 2), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(212, 300%, 50%); + space: hwb; + channels: 212deg -100% -100% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb -999999 0 0), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(0, 100%, -49999950%); + space: hwb; + channels: 180deg -99999900% 100% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(210, 50%, 20%, 0.4); + space: hwb; + channels: 210deg 10% 70% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(210, 50%, 20%, 0); + space: hwb; + channels: 210deg 10% 70% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb none 0.2 0.3), hwb)); + +<===> missing/red/output.css +a { + value: hsl(200, 100%, 15%); + space: hwb; + channels: 200deg 0% 70% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb 0.1 none 0.3), hwb)); + +<===> missing/green/output.css +a { + value: hsl(260, 100%, 15%); + space: hwb; + channels: 260deg 0% 70% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(color(srgb 0.1 0.2 none), hwb)} + +<===> missing/blue/output.css +a { + b: hsl(90, 100%, 10%); +} diff --git a/spec/core_functions/color/to_space/srgb/lab.hrx b/spec/core_functions/color/to_space/srgb/lab.hrx new file mode 100644 index 0000000000..1de6dc21d9 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/lab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), lab)} + +<===> gray/output.css +a { + b: lab(53.3889647411% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), lab)} + +<===> middle/output.css +a { + b: lab(44.1210142293% 10.9543336098 -59.0857381981); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(48.6432537296% 68.9299544627 -213.4229545471); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(20.2042266123% -3.1075752886 -18.9913351297 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(20.2042266123% -3.1075752886 -18.9913351297 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), lab)} + +<===> missing/red/output.css +a { + b: lab(19.2964565453% -7.7361660103 -20.488348653); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), lab)} + +<===> missing/green/output.css +a { + b: lab(6.0247531381% 29.4610612512 -41.8404017236); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(18.3483752329% -17.6137840535 25.305473968); +} diff --git a/spec/core_functions/color/to_space/srgb/lch.hrx b/spec/core_functions/color/to_space/srgb/lch.hrx new file mode 100644 index 0000000000..a1456aeb40 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/lch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), lch)} + +<===> gray/output.css +a { + b: lch(53.3889647411% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), lch)} + +<===> middle/output.css +a { + b: lch(44.1210142293% 60.0926108873 280.5032243387deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(48.6432537296% 224.278166904 287.899080689deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(20.2042266123% 19.2439038187 260.7069785652deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(20.2042266123% 19.2439038187 260.7069785652deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), lch)} + +<===> missing/red/output.css +a { + b: lch(19.2964565453% 21.9002441782 249.3140373711deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), lch)} + +<===> missing/green/output.css +a { + b: lch(6.0247531381% 51.1719976788 305.1505063293deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(18.3483752329% 30.8320028773 124.8397077198deg); +} diff --git a/spec/core_functions/color/to_space/srgb/oklab.hrx b/spec/core_functions/color/to_space/srgb/oklab.hrx new file mode 100644 index 0000000000..8662d047c8 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/oklab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), oklab)} + +<===> gray/output.css +a { + b: oklab(59.8180726623% 0 0.0000000223); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), oklab)} + +<===> middle/output.css +a { + b: oklab(53.248255955% -0.0225118457 -0.1663491641); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(49.0997083563% -2.0235857478 -0.6049594977); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(31.3834098842% -0.0190902788 -0.0525285242 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(31.3834098842% -0.0190902788 -0.0525285242 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), oklab)} + +<===> missing/red/output.css +a { + b: oklab(30.4674630654% -0.0359109243 -0.0568929135); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), oklab)} + +<===> missing/green/output.css +a { + b: oklab(21.1364004026% 0.0335334923 -0.1181436252); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(28.8978411941% -0.0558272225 0.0596397714); +} diff --git a/spec/core_functions/color/to_space/srgb/oklch.hrx b/spec/core_functions/color/to_space/srgb/oklch.hrx new file mode 100644 index 0000000000..0804b9dbd2 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/oklch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), oklch)} + +<===> gray/output.css +a { + b: oklch(59.8180726623% 0.0000000223 89.8755628286deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), oklch)} + +<===> middle/output.css +a { + b: oklch(53.248255955% 0.1678655044 262.2930469968deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(49.0997083563% 2.1120784248 196.6442570354deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(31.3834098842% 0.0558899329 250.0274938863deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(31.3834098842% 0.0558899329 250.0274938863deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), oklch)} + +<===> missing/red/output.css +a { + b: oklch(30.4674630654% 0.0672785114 237.7397947754deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), oklch)} + +<===> missing/green/output.css +a { + b: oklch(21.1364004026% 0.1228104689 285.8458860201deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(28.8978411941% 0.0816919892 133.1088653771deg); +} diff --git a/spec/core_functions/color/to_space/srgb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/srgb/prophoto_rgb.hrx new file mode 100644 index 0000000000..c639affac1 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.4246723949 0.4246723949 0.4246723949); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.3437112182 0.3305199405 0.7092276973); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb 0.4212484437 0.3577643231 2.2446463591); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -65386295.193253286 -25672329.57753762 -9641319.650744053); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.1331358788 0.1476592872 0.2235807496 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.1331358788 0.1476592872 0.2235807496 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.1451114907 0.2232691012); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.0991241424 none 0.2163131073); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.1013444503 0.1422873785 none); +} diff --git a/spec/core_functions/color/to_space/srgb/rec2020.hrx b/spec/core_functions/color/to_space/srgb/rec2020.hrx new file mode 100644 index 0000000000..b0c43d329a --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.4500400319 0.4500400319 0.4500400319); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.2739398263 0.3416365439 0.7427746502); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -0.6026796755 0.3067863382 2.048941054); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -2540376.5945026004 -941367.6801989076 -492696.4947353633); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.0912836575 0.1341693654 0.2300559367 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.0912836575 0.1341693654 0.2300559367 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.1318794997 0.2297011255); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.0425725358 none 0.2236924669); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.0773513907 0.1314145084 none); +} diff --git a/spec/core_functions/color/to_space/srgb/rgb.hrx b/spec/core_functions/color/to_space/srgb/rgb.hrx new file mode 100644 index 0000000000..959896e9eb --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), rgb)} + +<===> gray/output.css +a { + b: rgb(127.5, 127.5, 127.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), rgb)} + +<===> middle/output.css +a { + b: #3366cc; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(212, 300%, 50%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(0, 100%, -49999950%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: rgba(25.5, 51, 76.5, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: rgba(25.5, 51, 76.5, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), rgb)} + +<===> missing/red/output.css +a { + b: rgb(0, 51, 76.5); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), rgb)} + +<===> missing/green/output.css +a { + b: rgb(25.5, 0, 76.5); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), rgb)} + +<===> missing/blue/output.css +a { + b: rgb(25.5, 51, 0); +} diff --git a/spec/core_functions/color/to_space/srgb/srgb.hrx b/spec/core_functions/color/to_space/srgb/srgb.hrx new file mode 100644 index 0000000000..ef52d15fc6 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/srgb.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), srgb)} + +<===> in_range/output.css +a { + b: color(srgb 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), srgb)} + +<===> out_of_range/output.css +a { + b: color(srgb -1 0.4 2); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb 0.1 0.2 none); +} diff --git a/spec/core_functions/color/to_space/srgb/srgb_linear.hrx b/spec/core_functions/color/to_space/srgb/srgb_linear.hrx new file mode 100644 index 0000000000..f61fc54e43 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.2140411405 0.2140411405 0.2140411405); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear 0.0331047666 0.1328683216 0.6038273389); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -1 0.1328683216 4.9538457516); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -220898675516573.56 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear 0.0100228256 0.0331047666 0.0732389559 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear 0.0100228256 0.0331047666 0.0732389559 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.0331047666 0.0732389559); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear 0.0100228256 none 0.0732389559); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear 0.0100228256 0.0331047666 none); +} diff --git a/spec/core_functions/color/to_space/srgb/xyz.hrx b/spec/core_functions/color/to_space/srgb/xyz.hrx new file mode 100644 index 0000000000..334491ba30 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.2034366706 0.2140411405 0.233103163); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.1701429663 0.1456543203 0.5904344526); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 0.5291948186 0.2400138509 4.7052960558); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -91096581353071.61 -46971674760177.55 -4270152250925.2314); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.0291892916 0.0310940256 0.0737556471 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.0291892916 0.0310940256 0.0737556471 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.028962782 0.0735618977); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.0173515455 none 0.0698097318); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.0159710671 0.0258067358 none); +} diff --git a/spec/core_functions/color/to_space/srgb/xyz_d50.hrx b/spec/core_functions/color/to_space/srgb/xyz_d50.hrx new file mode 100644 index 0000000000..f4e73ba99d --- /dev/null +++ b/spec/core_functions/color/to_space/srgb/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 1 1 1), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.5 0.5 0.5), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.2063989463 0.2140411405 0.1766063301); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.2 0.4 0.8), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.152004951 0.1392210573 0.4445526951); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -1 0.4 2), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 0.3238971106 0.1730595843 3.5365131761); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb -999999 0 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -96326345922671.53 -49148448135198.27 -3075775809210.909); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0275998758 0.0304021191 0.0556533029 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0275998758 0.0304021191 0.0556533029 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.0281721088 0.0555137459); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.014849525 none 0.0524394483); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.0171209617 0.0259623875 none); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/a98_rgb.hrx b/spec/core_functions/color/to_space/srgb_linear/a98_rgb.hrx new file mode 100644 index 0000000000..5ed2f6ac63 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/a98_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.7296583818 0.7296583818 0.7296583818); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb 0.5391048013 0.6592557425 0.8950095649); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -0.7934333717 0.6592557425 1.3497959658); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -459.2276214951 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb 0.3933623369 0.4810314783 0.5747978617 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb 0.3933623369 0.4810314783 0.5747978617 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), a98-rgb)} + +<===> missing/red/output.css +a { + b: color(a98-rgb none 0.4810314783 0.5747978617); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), a98-rgb)} + +<===> missing/green/output.css +a { + b: color(a98-rgb 0.3013559074 none 0.5674699335); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), a98-rgb)} + +<===> missing/blue/output.css +a { + b: color(a98-rgb 0.3933623369 0.4810314783 none); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/display_p3.hrx b/spec/core_functions/color/to_space/srgb_linear/display_p3.hrx new file mode 100644 index 0000000000..215a92268a --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.7353569831 0.7353569831 0.7353569831); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 0.5225476892 0.6601803521 0.8864121553); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -0.8815767709 0.6290624928 1.3029857539); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -307.4724395956 -80.6737432685 -61.1542078437); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 0.377671895 0.4807798914 0.5742767089 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 0.377671895 0.4807798914 0.5742767089 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.4769934816 0.5727260345); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 0.3175781541 none 0.5609588905); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.377671895 0.4807798914 none); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/hsl.hrx b/spec/core_functions/color/to_space/srgb_linear/hsl.hrx new file mode 100644 index 0000000000..8efecba612 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), hsl)} + +<===> white/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), hsl)} + +<===> gray/output.css +a { + b: hsl(0, 0%, 73.5356983052%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), hsl)} + +<===> middle/output.css +a { + b: hsl(214.3023060477, 69.2456926348%, 69.5430478913%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(197.5434618594, 666.1615765111%, 17.6628023075%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(0, 100%, -16678.2577069634%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(205.3925362149, 25.148533711%, 46.6510851344%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(205.3925362149, 25.148533711%, 46.6510851344%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), hsl)} + +<===> missing/red/output.css +a { + b: hsl(190.2052342776, 100%, 29.191574503%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), hsl)} + +<===> missing/green/output.css +a { + b: hsl(275.8860614996, 100%, 29.191574503%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(76.7592364631, 100%, 24.2264602241%); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/hwb.hrx b/spec/core_functions/color/to_space/srgb_linear/hwb.hrx new file mode 100644 index 0000000000..47d57d4a7b --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/hwb.hrx @@ -0,0 +1,149 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear 0 0 0), hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear 1 1 1), hwb)); + +<===> white/output.css +a { + value: white; + space: hwb; + channels: 0deg 100% 0% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear 0.5 0.5 0.5), hwb)); + +<===> gray/output.css +a { + value: hsl(0, 0%, 73.5356983052%); + space: hwb; + channels: 0deg 73.5356983052% 26.4643016948% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear 0.2 0.4 0.8), hwb)); + +<===> middle/output.css +a { + value: hsl(214.3023060477, 69.2456926348%, 69.5430478913%); + space: hwb; + channels: 214.3023060477deg 48.4529204482% 9.3668246656% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear -1 0.4 2), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(197.5434618594, 666.1615765111%, 17.6628023075%); + space: hwb; + channels: 197.5434618594deg -100% -35.3256046149% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear -999999 0 0), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(0, 100%, -16678.2577069634%); + space: hwb; + channels: 180deg -33356.5154139268% 100% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(205.3925362149, 25.148533711%, 46.6510851344%, 0.4); + space: hwb; + channels: 205.3925362149deg 34.9190212628% 41.616850994% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(205.3925362149, 25.148533711%, 46.6510851344%, 0); + space: hwb; + channels: 205.3925362149deg 34.9190212628% 41.616850994% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear none 0.2 0.3), hwb)); + +<===> missing/red/output.css +a { + value: hsl(190.2052342776, 100%, 29.191574503%); + space: hwb; + channels: 190.2052342776deg 0% 41.616850994% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(srgb-linear 0.1 none 0.3), hwb)); + +<===> missing/green/output.css +a { + value: hsl(275.8860614996, 100%, 29.191574503%); + space: hwb; + channels: 275.8860614996deg 0% 41.616850994% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), hwb)} + +<===> missing/blue/output.css +a { + b: hsl(76.7592364631, 100%, 24.2264602241%); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/lab.hrx b/spec/core_functions/color/to_space/srgb_linear/lab.hrx new file mode 100644 index 0000000000..b9348c4bf6 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/lab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), lab)} + +<===> gray/output.css +a { + b: lab(76.0692610142% 0 0); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), lab)} + +<===> middle/output.css +a { + b: lab(68.0021326658% -3.4788867492 -36.298343272); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(50.1566645274% -199.4292910489 -127.4603757066); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(49.9553149355% -7.5157058766 -17.8791167699 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(49.9553149355% -7.5157058766 -17.8791167699 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), lab)} + +<===> missing/red/output.css +a { + b: lab(47.1789302985% -22.7267758708 -22.4056108481); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), lab)} + +<===> missing/green/output.css +a { + b: lab(23.8148183096% 52.2336661374 -59.2206654307); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(47.7042083773% -24.5180464109 51.183897624); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/lch.hrx b/spec/core_functions/color/to_space/srgb_linear/lch.hrx new file mode 100644 index 0000000000..3aa0bd1638 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/lch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), lch)} + +<===> gray/output.css +a { + b: lch(76.0692610142% 0 none); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), lch)} + +<===> middle/output.css +a { + b: lch(68.0021326658% 36.4646730043 264.5254095776deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(50.1566645274% 236.6816205445 212.5836894898deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(49.9553149355% 19.3945521035 247.1999530707deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(49.9553149355% 19.3945521035 247.1999530707deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), lch)} + +<===> missing/red/output.css +a { + b: lch(47.1789302985% 31.9142247118 224.5922863586deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), lch)} + +<===> missing/green/output.css +a { + b: lch(23.8148183096% 78.9648218652 311.4128591679deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(47.7042083773% 56.7532023396 115.5952944453deg); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/oklab.hrx b/spec/core_functions/color/to_space/srgb_linear/oklab.hrx new file mode 100644 index 0000000000..d1952fbb57 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/oklab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), oklab)} + +<===> white/output.css +a { + b: oklab(99.9999993474% 0.0000000001 0.0000000373); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), oklab)} + +<===> gray/output.css +a { + b: oklab(79.3700520804% 0.0000000001 0.0000000296); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), oklab)} + +<===> middle/output.css +a { + b: oklab(72.8143374355% -0.0250833833 -0.0997563344); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(41.5806830952% -1.9917329546 -0.3816984711); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(56.8480554239% -0.0271159546 -0.0484208297 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(56.8480554239% -0.0271159546 -0.0484208297 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), oklab)} + +<===> missing/red/output.css +a { + b: oklab(54.0246595647% -0.0760370977 -0.061145727); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), oklab)} + +<===> missing/green/output.css +a { + b: oklab(37.7328569492% 0.1076561145 -0.1664592467); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(53.8237207745% -0.0823086169 0.1108579968); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/oklch.hrx b/spec/core_functions/color/to_space/srgb_linear/oklch.hrx new file mode 100644 index 0000000000..09b691ad6c --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/oklch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), oklch)} + +<===> white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), oklch)} + +<===> gray/output.css +a { + b: oklch(79.3700520804% 0.0000000296 89.8755628773deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), oklch)} + +<===> middle/output.css +a { + b: oklch(72.8143374355% 0.1028615689 255.885778774deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(41.5806830952% 2.0279777823 190.8487076701deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(56.8480554239% 0.055496412 240.7509124531deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(56.8480554239% 0.055496412 240.7509124531deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), oklch)} + +<===> missing/red/output.css +a { + b: oklch(54.0246595647% 0.0975727429 218.8047277574deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), oklch)} + +<===> missing/green/output.css +a { + b: oklch(37.7328569492% 0.1982385426 302.8924282818deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(53.8237207745% 0.138073183 126.5927383995deg); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/prophoto_rgb.hrx b/spec/core_functions/color/to_space/srgb_linear/prophoto_rgb.hrx new file mode 100644 index 0000000000..083b98d99e --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.6803950001 0.6803950001 0.6803950001); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.5584197658 0.5940140048 0.8477459947); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb -0.302285213 0.5192197728 1.3694597345); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -1512.946773752 -594.0215467819 -223.0865568571); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.3626946772 0.4009240289 0.4977561426 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.3626946772 0.4009240289 0.4977561426 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.3894388678 0.4961157804); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.2705939482 none 0.4744752789); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.3064298164 0.3910752998 none); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/rec2020.hrx b/spec/core_functions/color/to_space/srgb_linear/rec2020.hrx new file mode 100644 index 0000000000..a17ad780d6 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.7054355531 0.7054355531 0.7054355531); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 0.5322900823 0.6209100246 0.8693839915); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -0.6359299305 0.5603508935 1.336426667); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -446.5956338945 -165.4289951275 -86.5355205509); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.3568250491 0.4265433858 0.5284543831 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.3568250491 0.4265433858 0.5284543831 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.4180412871 0.5268436405); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.2448919266 none 0.5108839287); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.3374893111 0.4223703123 none); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/rgb.hrx b/spec/core_functions/color/to_space/srgb_linear/rgb.hrx new file mode 100644 index 0000000000..29747cbfe4 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), rgb)} + +<===> white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), rgb)} + +<===> gray/output.css +a { + b: rgb(187.5160306784, 187.5160306784, 187.5160306784); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), rgb)} + +<===> middle/output.css +a { + b: rgb(123.5549471428, 169.6221965809, 231.1145971027); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(197.5434618594, 666.1615765111%, 17.6628023075%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(0, 100%, -16678.2577069634%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: rgba(89.0435042202, 123.5549471428, 148.8770299654, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: rgba(89.0435042202, 123.5549471428, 148.8770299654, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), rgb)} + +<===> missing/red/output.css +a { + b: rgb(0, 123.5549471428, 148.8770299654); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), rgb)} + +<===> missing/green/output.css +a { + b: rgb(89.0435042202, 0, 148.8770299654); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), rgb)} + +<===> missing/blue/output.css +a { + b: rgb(89.0435042202, 123.5549471428, 0); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/srgb.hrx b/spec/core_functions/color/to_space/srgb_linear/srgb.hrx new file mode 100644 index 0000000000..ea2c6f611f --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), srgb)} + +<===> white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.7353569831 0.7353569831 0.7353569831); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), srgb)} + +<===> middle/output.css +a { + b: color(srgb 0.4845292045 0.6651850846 0.9063317533); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -1 0.6651850846 1.3532560461); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -333.5651541393 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb 0.3491902126 0.4845292045 0.5838314901 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb 0.3491902126 0.4845292045 0.5838314901 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.4845292045 0.5838314901); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb 0.3491902126 none 0.5838314901); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb 0.3491902126 0.4845292045 none); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/srgb_linear.hrx b/spec/core_functions/color/to_space/srgb_linear/srgb_linear.hrx new file mode 100644 index 0000000000..8a6fb2193a --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/srgb_linear.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), srgb-linear)} + +<===> in_range/output.css +a { + b: color(srgb-linear 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), srgb-linear)} + +<===> out_of_range/output.css +a { + b: color(srgb-linear -1 0.4 2); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear 0.1 0.2 none); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/xyz.hrx b/spec/core_functions/color/to_space/srgb_linear/xyz.hrx new file mode 100644 index 0000000000..8cd03cec0a --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9504559271 1 1.0890577508); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.4752279635 0.5 0.5445288754); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.3698965263 0.386349125 0.8119697975); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz 0.0916045133 0.2178130964 1.9294113977); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -412390.3868751602 -212638.7932325045 -19330.7993847731); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.1669001843 0.1859553309 0.3109316835 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.1669001843 0.1859553309 0.3109316835 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.1646914304 0.3089986016); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.0953833164 none 0.2870927275); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.1127559478 0.1642976363 none); +} diff --git a/spec/core_functions/color/to_space/srgb_linear/xyz_d50.hrx b/spec/core_functions/color/to_space/srgb_linear/xyz_d50.hrx new file mode 100644 index 0000000000..eb983fe952 --- /dev/null +++ b/spec/core_functions/color/to_space/srgb_linear/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 1 1 1), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 0.9642956764 1 0.8251046025); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.4821478382 0.5 0.4125523013); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.3557364892 0.3797492885 0.6128967994); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -1 0.4 2), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 0.0041516969 0.1855012477 1.4531073219); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear -999999 0 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -436065.3108085225 -222492.9546173881 -13923.9075392479); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.1635604026 0.1838126633 0.235038464 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.1635604026 0.1838126633 0.235038464 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.1615633456 0.2336460719); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.0865301007 none 0.2156221992); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(srgb-linear 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.1206368766 0.1656267203 none); +} diff --git a/spec/core_functions/color/to_space/xyz/a98_rgb.hrx b/spec/core_functions/color/to_space/xyz/a98_rgb.hrx new file mode 100644 index 0000000000..48b5351e35 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/a98_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), a98-rgb)} + +<===> black/output.css +a { + b: color(a98-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), a98-rgb)} + +<===> white/output.css +a { + b: color(a98-rgb 1.0579328451 0.9761412908 0.9581457442); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), a98-rgb)} + +<===> gray/output.css +a { + b: color(a98-rgb 0.7719295678 0.7122496746 0.6991190732); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), a98-rgb)} + +<===> middle/output.css +a { + b: color(a98-rgb -0.3403753886 0.7865601683 0.8866254663); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), a98-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(a98-rgb -1.6372044815 1.3072981109 1.360980168); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), a98-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(a98-rgb -739.9221025629 527.3176861205 -75.3831765931); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), a98-rgb)} + +<===> alpha/partial/output.css +a { + b: color(a98-rgb -0.1351623531 0.5702285503 0.5625764827 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), a98-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(a98-rgb -0.1351623531 0.5702285503 0.5625764827 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), a98-rgb)} + +<===> missing/red/output.css +a { + b: color(a98-rgb none 0.6499288625 0.5613563103); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), a98-rgb)} + +<===> missing/green/output.css +a { + b: color(a98-rgb 0.3521663165 none 0.5835625865); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), a98-rgb)} + +<===> missing/blue/output.css +a { + b: color(a98-rgb 0.3365194536 0.5589776013 none); +} diff --git a/spec/core_functions/color/to_space/xyz/display_p3.hrx b/spec/core_functions/color/to_space/xyz/display_p3.hrx new file mode 100644 index 0000000000..a3a28e22df --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1.067061664 0.9807650127 0.9623860213); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.785596466 0.7209470243 0.7071783379); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 -0.4800324283 0.7723805169 0.8767615059); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -1.7588549225 1.2221230245 1.3074633625); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -488.1354653538 308.5645035738 -83.3006508571); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 -0.2665155311 0.5626429938 0.5614732822 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 -0.2665155311 0.5626429938 0.5614732822 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.6339496775 0.5581173728); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 0.3937592636 none 0.575458821); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.2785701294 0.5560005714 none); +} diff --git a/spec/core_functions/color/to_space/xyz/hsl.hrx b/spec/core_functions/color/to_space/xyz/hsl.hrx new file mode 100644 index 0000000000..6e157ce424 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), hsl)} + +<===> white/output.css +a { + b: hsl(188.6326376323, 287.948753728%, 102.1970070346%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), hsl)} + +<===> gray/output.css +a { + b: hsl(8.6326376323, 19.0960524665%, 75.1815938992%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), hsl)} + +<===> middle/output.css +a { + b: hsl(183.9973689591, 600.9357681928%, 12.7508937669%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(0.951270101, 523.3395920082%, -31.8043324514%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(330.5196564153, 405.9398117154%, -10761.9459979264%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(179.5022543706, 556.250481638%, 8.7700702541%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(179.5022543706, 556.250481638%, 8.7700702541%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), hsl)} + +<===> missing/red/output.css +a { + b: hsl(355.8794204538, 2697.9214173204%, -2.5244914397%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), hsl)} + +<===> missing/green/output.css +a { + b: hsl(290.3526254976, 328.3439800543%, 14.0892871543%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(93.2964667331, 215.664278299%, 17.8710983929%); +} diff --git a/spec/core_functions/color/to_space/xyz/hwb.hrx b/spec/core_functions/color/to_space/xyz/hwb.hrx new file mode 100644 index 0000000000..cafb0e07e9 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/hwb.hrx @@ -0,0 +1,149 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz 0 0 0), hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz 1 1 1), hwb)); + +<===> white/output.css +a { + value: hsl(188.6326376323, 287.948753728%, 102.1970070346%); + space: hwb; + channels: 8.6326376323deg 95.8707526592% -8.5232614099% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz 0.5 0.5 0.5), hwb)); + +<===> gray/output.css +a { + value: hsl(8.6326376323, 19.0960524665%, 75.1815938992%); + space: hwb; + channels: 8.6326376323deg 70.4422580488% 20.0790702505% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz 0.2 0.4 0.8), hwb)); + +<===> middle/output.css +a { + value: hsl(183.9973689591, 600.9357681928%, 12.7508937669%); + space: hwb; + channels: 183.9973689591deg -63.8737876426% 10.6244248236% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz -1 0.4 2), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(0.951270101, 523.3395920082%, -31.8043324514%); + space: hwb; + channels: 180.951270101deg -198.2489961434% -34.6403312406% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz -999999 0 0), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(330.5196564153, 405.9398117154%, -10761.9459979264%); + space: hwb; + channels: 150.5196564153deg -54448.9693188225% -32825.0773229696% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(179.5022543706, 556.250481638%, 8.7700702541%, 0.4); + space: hwb; + channels: 179.5022543706deg -40.0134877742% 42.4463717177% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(179.5022543706, 556.250481638%, 8.7700702541%, 0); + space: hwb; + channels: 179.5022543706deg -40.0134877742% 42.4463717177% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz none 0.2 0.3), hwb)); + +<===> missing/red/output.css +a { + value: hsl(355.8794204538, 2697.9214173204%, -2.5244914397%); + space: hwb; + channels: 175.8794204538deg -70.6332866707% 34.4156962088% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz 0.1 none 0.3), hwb)); + +<===> missing/green/output.css +a { + value: hsl(290.3526254976, 328.3439800543%, 14.0892871543%); + space: hwb; + channels: 290.3526254976deg -32.1720390494% 39.6493866421% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(color(xyz 0.1 0.2 none), hwb)} + +<===> missing/blue/output.css +a { + b: hsl(93.2964667331, 215.664278299%, 17.8710983929%); +} diff --git a/spec/core_functions/color/to_space/xyz/lab.hrx b/spec/core_functions/color/to_space/xyz/lab.hrx new file mode 100644 index 0000000000..15b88a9927 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/lab.hrx @@ -0,0 +1,125 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), lab)} + +<===> white/output.css +a { + b: lab(100% 0 0); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), lab)} + +<===> gray/output.css +a { + b: lab(76.1608841835% 7.1944893389 4.6048603909); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), lab)} + +<===> middle/output.css +a { + b: lab(68.6381340629% -79.8035401529 -34.4873470111); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(64.3546378926% -4876.8569771732 -106.5787284462); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(51.373608379% -60.0251143111 -14.0399860293 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(51.373608379% -60.0251143111 -14.0399860293 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), lab)} + +<===> missing/red/output.css +a { + b: lab(51.0322781723% -262.2343975897 -14.80446365); +} + +<===> +================================================================================ +<===> missing/green/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), lab)} + +<===> missing/green/output.css +a { + b: lab(5.8200823344% 29.1326658037 -42.4044732971); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(51.9556818936% -50.8750926576 85.6399941916); +} diff --git a/spec/core_functions/color/to_space/xyz/lch.hrx b/spec/core_functions/color/to_space/xyz/lch.hrx new file mode 100644 index 0000000000..68db6cf2ee --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/lch.hrx @@ -0,0 +1,125 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), lch)} + +<===> white/output.css +a { + b: lch(100% 0 none); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), lch)} + +<===> gray/output.css +a { + b: lch(76.1608841835% 8.541979634 32.621430668deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), lch)} + +<===> middle/output.css +a { + b: lch(68.6381340629% 86.9366558179 203.3717362956deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(64.3546378926% 4878.0214227861 181.2519414622deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(51.373608379% 61.6452395223 193.1649108151deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(51.373608379% 61.6452395223 193.1649108151deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), lch)} + +<===> missing/red/output.css +a { + b: lch(51.0322781723% 262.6519587272 183.231207866deg); +} + +<===> +================================================================================ +<===> missing/green/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), lch)} + +<===> missing/green/output.css +a { + b: lch(5.8200823344% 51.4475613847 304.4897928318deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(51.9556818936% 99.6116642671 120.7127528375deg); +} diff --git a/spec/core_functions/color/to_space/xyz/oklab.hrx b/spec/core_functions/color/to_space/xyz/oklab.hrx new file mode 100644 index 0000000000..9fd03afa74 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/oklab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), oklab)} + +<===> white/output.css +a { + b: oklab(100.3245366491% 0.0267595166 0.014864444); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), oklab)} + +<===> gray/output.css +a { + b: oklab(79.6276375075% 0.0212390424 0.011797917); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), oklab)} + +<===> middle/output.css +a { + b: oklab(70.8952946273% -0.2482574119 -0.0948731015); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(38.0019911648% -3.242940099 -0.3314216345); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(56.4079108835% -0.1736338918 -0.037500532 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(56.4079108835% -0.1736338918 -0.037500532 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), oklab)} + +<===> missing/red/output.css +a { + b: oklab(52.699430823% -0.4922232406 -0.0409679345); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), oklab)} + +<===> missing/green/output.css +a { + b: oklab(26.3423259569% 0.3682063514 -0.2704617545); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(56.6867659008% -0.1591393684 0.1508075586); +} diff --git a/spec/core_functions/color/to_space/xyz/oklch.hrx b/spec/core_functions/color/to_space/xyz/oklch.hrx new file mode 100644 index 0000000000..561b582e6e --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/oklch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), oklch)} + +<===> white/output.css +a { + b: oklch(100.3245366491% 0.0306108383 29.0514068282deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), oklch)} + +<===> gray/output.css +a { + b: oklch(79.6276375075% 0.0242958385 29.0514068282deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), oklch)} + +<===> middle/output.css +a { + b: oklch(70.8952946273% 0.2657680341 200.9146648791deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(38.0019911648% 3.2598314045 185.8352487879deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(56.4079108835% 0.1776373223 192.1872495768deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(56.4079108835% 0.1776373223 192.1872495768deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), oklch)} + +<===> missing/red/output.css +a { + b: oklch(52.699430823% 0.4939251868 184.7577843583deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), oklch)} + +<===> missing/green/output.css +a { + b: oklch(26.3423259569% 0.4568648354 323.7012836228deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(56.6867659008% 0.2192447453 136.539820405deg); +} diff --git a/spec/core_functions/color/to_space/xyz/prophoto_rgb.hrx b/spec/core_functions/color/to_space/xyz/prophoto_rgb.hrx new file mode 100644 index 0000000000..38e01822aa --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1.0429146548 0.9845782985 0.953747937); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.7095939166 0.6699021515 0.6489253277); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.2936039607 0.6811658686 0.8421802859); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb -1.340921335 1.0822677288 1.4036262654); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -2600.5460588084 1508.1151466205 177.670007881); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.2194696613 0.4617099795 0.489000517 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.2194696613 0.4617099795 0.489000517 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.5136422936 0.49010255); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.2931451274 none 0.4853966387); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.2715690946 0.4564221473 none); +} diff --git a/spec/core_functions/color/to_space/xyz/rec2020.hrx b/spec/core_functions/color/to_space/xyz/rec2020.hrx new file mode 100644 index 0000000000..107b49888c --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1.0517415202 0.9828015442 0.9579473111); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.7433125628 0.6928455465 0.6746511829); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 -0.0073399546 0.7239127682 0.8607584595); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -1.5202475993 1.156770634 1.350426083); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -702.5226404146 458.9706861542 -89.4449238228); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.1079117715 0.501698873 0.516462928 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.1079117715 0.501698873 0.516462928 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.5663964614 0.5146878151); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.2830292386 none 0.5249837189); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.2916789955 0.496779191 none); +} diff --git a/spec/core_functions/color/to_space/xyz/rgb.hrx b/spec/core_functions/color/to_space/xyz/rgb.hrx new file mode 100644 index 0000000000..988e65f5df --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), rgb)} + +<===> white/output.css +a { + b: hsl(188.6326376323, 287.948753728%, 102.1970070346%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), rgb)} + +<===> gray/output.css +a { + b: rgb(203.7983708613, 183.1053603906, 179.6277580244); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), rgb)} + +<===> middle/output.css +a { + b: hsl(183.9973689591, 600.9357681928%, 12.7508937669%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(0.951270101, 523.3395920082%, -31.8043324514%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(330.5196564153, 405.9398117154%, -10761.9459979264%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: hsla(179.5022543706, 556.250481638%, 8.7700702541%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: hsla(179.5022543706, 556.250481638%, 8.7700702541%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), rgb)} + +<===> missing/red/output.css +a { + b: rgb(0, 167.2399746676, 143.3849194416); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), rgb)} + +<===> missing/green/output.css +a { + b: rgb(115.9585352591, 0, 153.8940640627); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), rgb)} + +<===> missing/blue/output.css +a { + b: rgb(34.7719641116, 143.8523181031, 0); +} diff --git a/spec/core_functions/color/to_space/xyz/srgb.hrx b/spec/core_functions/color/to_space/xyz/srgb.hrx new file mode 100644 index 0000000000..1e4417ffcd --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), srgb)} + +<===> white/output.css +a { + b: color(srgb 1.0852326141 0.9769116138 0.9587075266); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.7992092975 0.7180602368 0.7044225805); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), srgb)} + +<===> middle/output.css +a { + b: color(srgb -0.6387378764 0.7916567108 0.8937557518); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -1.9824899614 1.2936253684 1.3464033124); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -544.4896931882 329.2507732297 -100.0520460013); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb -0.4001348777 0.5755362828 0.5674423486 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb -0.4001348777 0.5755362828 0.5674423486 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.6558430379 0.5622938017); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb 0.454739354 none 0.6035061336); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb 0.1363606436 0.5641267377 none); +} diff --git a/spec/core_functions/color/to_space/xyz/srgb_linear.hrx b/spec/core_functions/color/to_space/xyz/srgb_linear.hrx new file mode 100644 index 0000000000..aaf930abbb --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1.204976004 0.9482789226 0.9086246351); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.602488002 0.4741394613 0.4543123175); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear -0.3656478909 0.5897823193 0.7751124438); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -4.8531447335 1.8027407517 1.9767221652); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -3240966.700934579 969242.6670372436 -55630.0240669139); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear -0.1329628694 0.2907356539 0.2818590705 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear -0.1329628694 0.2907356539 0.2818590705 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.3876600175 0.2762960625); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear 0.1745137661 none 0.3226544622); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear 0.0166203587 0.2782691367 none); +} diff --git a/spec/core_functions/color/to_space/xyz/xyz.hrx b/spec/core_functions/color/to_space/xyz/xyz.hrx new file mode 100644 index 0000000000..1d30db6fc8 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/xyz.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), xyz)} + +<===> in_range/output.css +a { + b: color(xyz 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), xyz)} + +<===> out_of_range/output.css +a { + b: color(xyz -1 0.4 2); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.1 0.2 none); +} diff --git a/spec/core_functions/color/to_space/xyz/xyz_d50.hrx b/spec/core_functions/color/to_space/xyz/xyz_d50.hrx new file mode 100644 index 0000000000..98296f8c74 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 1 1 1), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 1.0206843969 1.0029884365 0.7576864323); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.5 0.5 0.5), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.5103421984 0.5014942182 0.3788432161); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.2 0.4 0.8), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.1786108937 0.3884402932 0.6056728936); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -1 0.4 2), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 -1.1391355769 0.3323983638 1.5190136801); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz -999999 0 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -1047928.744615204 -29627.7791422469 9243.0314031639); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.0943246735 0.1959275265 0.2276490187 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.0943246735 0.1959275265 0.2276490187 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.1929647456 0.2285733227); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.0897352994 none 0.2246379804); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.1093823534 0.2010496662 none); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/a98_rgb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/a98_rgb.hrx new file mode 100644 index 0000000000..1c954710a9 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/a98_rgb.hrx @@ -0,0 +1,52 @@ +<===> in_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), xyz-d50)} + +<===> in_range/output.css +a { + b: color(xyz-d50 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), xyz-d50)} + +<===> out_of_range/output.css +a { + b: color(xyz-d50 -1 0.4 2); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.1 0.2 none); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/display_p3.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/display_p3.hrx new file mode 100644 index 0000000000..85e1130a04 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/display_p3.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), display-p3)} + +<===> black/output.css +a { + b: color(display-p3 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), display-p3)} + +<===> white/output.css +a { + b: color(display-p3 1.0071270999 0.9879174398 1.092886631); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), display-p3)} + +<===> gray/output.css +a { + b: color(display-p3 0.7406962751 0.7263052903 0.8049433314); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), display-p3)} + +<===> middle/output.css +a { + b: color(display-p3 -0.520302433 0.7760128678 0.9954240218); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), display-p3)} + +<===> out_of_range/near/output.css +a { + b: color(display-p3 -1.7430526394 1.2261981059 1.4801698042); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), display-p3)} + +<===> out_of_range/far/output.css +a { + b: color(display-p3 -480.7511485906 310.5370514577 -94.2421709039); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), display-p3)} + +<===> alpha/partial/output.css +a { + b: color(display-p3 -0.3072826123 0.5660777225 0.6401555397 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), display-p3)} + +<===> alpha/transparent/output.css +a { + b: color(display-p3 -0.3072826123 0.5660777225 0.6401555397 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), display-p3)} + +<===> missing/red/output.css +a { + b: color(display-p3 none 0.637912978 0.6363418884); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), display-p3)} + +<===> missing/green/output.css +a { + b: color(display-p3 0.3827670965 none 0.655277932); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), display-p3)} + +<===> missing/blue/output.css +a { + b: color(display-p3 0.2276620199 0.5616123537 none); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hsl.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hsl.hrx new file mode 100644 index 0000000000..2d8aa960e2 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hsl.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), hsl)} + +<===> black/output.css +a { + b: hsl(0, 0%, 0%); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), hsl)} + +<===> white/output.css +a { + b: hsl(72.6622302958, 128.9066481357%, 104.4631089642%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), hsl)} + +<===> gray/output.css +a { + b: hsl(252.6622302958, 18.6415390171%, 76.8792521782%); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), hsl)} + +<===> middle/output.css +a { + b: hsl(187.9353554297, 490.1229331153%, 17.2918334784%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), hsl)} + +<===> out_of_range/near/output.css +a { + b: hsl(3.9698519642, 796.3834139233%, -21.9385057601%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), hsl)} + +<===> out_of_range/far/output.css +a { + b: hsl(329.431996419, 420.4439814741%, -10316.9080915762%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), hsl)} + +<===> alpha/partial/output.css +a { + b: hsla(184.0103843189, 495.2078632431%, 10.9589006248%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), hsl)} + +<===> alpha/transparent/output.css +a { + b: hsla(184.0103843189, 495.2078632431%, 10.9589006248%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), hsl)} + +<===> missing/red/output.css +a { + b: hsl(359.4153454139, 2475.3715741602%, -2.7790249918%); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), hsl)} + +<===> missing/green/output.css +a { + b: hsl(285.6927471827, 282.9980963007%, 17.9207568387%); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), hsl)} + +<===> missing/blue/output.css +a { + b: hsl(111.1172729557, 222.5792269318%, 17.6906141138%); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hwb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hwb.hrx new file mode 100644 index 0000000000..cb868440a7 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hwb.hrx @@ -0,0 +1,149 @@ +<===> black/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 0 0 0), hwb)); + +<===> black/output.css +a { + value: black; + space: hwb; + channels: 0deg 0% 100% / 1; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 1 1 1), hwb)); + +<===> white/output.css +a { + value: hsl(72.6622302958, 128.9066481357%, 104.4631089642%); + space: hwb; + channels: 252.6622302958deg 98.7098647958% -10.2163531326% / 1; +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 0.5 0.5 0.5), hwb)); + +<===> gray/output.css +a { + value: hsl(252.6622302958, 18.6415390171%, 76.8792521782%); + space: hwb; + channels: 252.6622302958deg 72.569188952% 18.8106845955% / 1; +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 0.2 0.4 0.8), hwb)); + +<===> middle/output.css +a { + value: hsl(187.9353554297, 490.1229331153%, 17.2918334784%); + space: hwb; + channels: 187.9353554297deg -67.4594079552% -2.043074912% / 1; +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 -1 0.4 2), hwb)); + +<===> out_of_range/near/output.css +a { + value: hsl(3.9698519642, 796.3834139233%, -21.9385057601%); + space: hwb; + channels: 183.9698519642deg -196.6531268961% -52.7761153759% / 1; +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 -999999 0 0), hwb)); + +<===> out_of_range/far/output.css +a { + value: hsl(329.431996419, 420.4439814741%, -10316.9080915763%); + space: hwb; + channels: 149.431996419deg -53693.7272368212% -32959.9110536687% / 1; +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), hwb)); + +<===> alpha/partial/output.css +a { + value: hsla(184.0103843189, 495.2078632431%, 10.9589006248%, 0.4); + space: hwb; + channels: 184.0103843189deg -43.310436994% 34.7717617565% / 0.4; +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), hwb)); + +<===> alpha/transparent/output.css +a { + value: hsla(184.0103843189, 495.2078632431%, 10.9589006248%, 0); + space: hwb; + channels: 184.0103843189deg -43.310436994% 34.7717617565% / 0; +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 none 0.2 0.3), hwb)); + +<===> missing/red/output.css +a { + value: hsl(359.4153454139, 2475.3715741602%, -2.7790249918%); + space: hwb; + channels: 179.4153454139deg -71.5702196777% 33.9878303059% / 1; +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect(color.to-space(color(xyz-d50 0.1 none 0.3), hwb)); + +<===> missing/green/output.css +a { + value: hsl(285.6927471827, 282.9980963007%, 17.9207568387%); + space: hwb; + channels: 285.6927471827deg -32.7946438576% 31.363842465% / 1; +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), hwb)} + +<===> missing/blue/output.css +a { + b: hsl(111.1172729557, 222.5792269318%, 17.6906141138%); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx new file mode 100644 index 0000000000..b92ecb7958 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), lab)} + +<===> black/output.css +a { + b: lab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), lab)} + +<===> white/output.css +a { + b: lab(100% 6.096419139 -13.2359011077); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), lab)} + +<===> gray/output.css +a { + b: lab(76.0692610142% 4.8387310772 -10.505341671); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), lab)} + +<===> middle/output.css +a { + b: lab(69.4695307685% -72.4361685024 -50.5894155557); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), lab)} + +<===> out_of_range/near/output.css +a { + b: lab(69.4695307685% -4337.1188269787 -121.2991404532); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), lab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), lab)} + +<===> alpha/partial/output.css +a { + b: lab(51.8372115265% -57.4926250406 -25.7864288134 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), lab)} + +<===> alpha/transparent/output.css +a { + b: lab(51.8372115265% -57.4926250406 -25.7864288134 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), lab)} + +<===> missing/red/output.css +a { + b: lab(51.8372115265% -223.4362565799 -25.7864288134); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), lab)} + +<===> missing/green/output.css +a { + b: lab(0% 165.9436315393 -115.1609314454); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), lab)} + +<===> missing/blue/output.css +a { + b: lab(51.8372115265% -57.4926250406 89.374502632); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx new file mode 100644 index 0000000000..4e429c840b --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), lch)} + +<===> black/output.css +a { + b: lch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), lch)} + +<===> white/output.css +a { + b: lch(100% 14.5724193067 294.7306655583deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), lch)} + +<===> gray/output.css +a { + b: lch(76.0692610142% 11.5661368686 294.7306655583deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), lch)} + +<===> middle/output.css +a { + b: lch(69.4695307685% 88.3531973025 214.9304458642deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), lch)} + +<===> out_of_range/near/output.css +a { + b: lch(69.4695307685% 4338.814723033 181.6020122751deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), lch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), lch)} + +<===> alpha/partial/output.css +a { + b: lch(51.8372115265% 63.0106486636 204.1570528501deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), lch)} + +<===> alpha/transparent/output.css +a { + b: lch(51.8372115265% 63.0106486636 204.1570528501deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), lch)} + +<===> missing/red/output.css +a { + b: lch(51.8372115265% 224.9193203471 186.5832915139deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), lch)} + +<===> missing/green/output.css +a { + b: lch(0% 201.988437738 325.2402722247deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), lch)} + +<===> missing/blue/output.css +a { + b: lch(51.8372115265% 106.2694860003 122.7522732424deg); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx new file mode 100644 index 0000000000..4ff8ac8329 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), oklab)} + +<===> black/output.css +a { + b: oklab(0% 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), oklab)} + +<===> white/output.css +a { + b: oklab(100.3624960247% 0.0167855154 -0.0354164295); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), oklab)} + +<===> gray/output.css +a { + b: oklab(79.6577658839% 0.0133226724 -0.0281100387); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), oklab)} + +<===> middle/output.css +a { + b: oklab(71.9979200541% -0.2538804764 -0.1411846084); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), oklab)} + +<===> out_of_range/near/output.css +a { + b: oklab(42.8855772157% -3.2722752803 -0.3756610558); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), oklab)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), oklab)} + +<===> alpha/partial/output.css +a { + b: oklab(56.9970926622% -0.1786682028 -0.0706832596 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), oklab)} + +<===> alpha/transparent/output.css +a { + b: oklab(56.9970926622% -0.1786682028 -0.0706832596 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), oklab)} + +<===> missing/red/output.css +a { + b: oklab(53.737032336% -0.4814823965 -0.0723240631); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), oklab)} + +<===> missing/green/output.css +a { + b: oklab(29.1994683846% 0.3079984165 -0.2894921466); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), oklab)} + +<===> missing/blue/output.css +a { + b: oklab(56.4114760121% -0.1759135151 0.1541840121); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx new file mode 100644 index 0000000000..183c19eec1 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx @@ -0,0 +1,117 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), oklch)} + +<===> black/output.css +a { + b: oklch(0% 0 none); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), oklch)} + +<===> white/output.css +a { + b: oklch(100.3624960247% 0.0391928183 295.3584786053deg); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), oklch)} + +<===> gray/output.css +a { + b: oklch(79.6577658839% 0.0311073605 295.3584786053deg); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), oklch)} + +<===> middle/output.css +a { + b: oklch(71.9979200541% 0.2904967986 209.0787246058deg); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), oklch)} + +<===> out_of_range/near/output.css +a { + b: oklch(42.8855772157% 3.2937678635 186.548953155deg); +} + +<===> +================================================================================ +<===> out_of_range/far/options.yml +:todo: + - dart-sass # w3c/csswg-drafts#9484 + +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), oklch)} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), oklch)} + +<===> alpha/partial/output.css +a { + b: oklch(56.9970926622% 0.1921417442 201.5843389185deg / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), oklch)} + +<===> alpha/transparent/output.css +a { + b: oklch(56.9970926622% 0.1921417442 201.5843389185deg / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), oklch)} + +<===> missing/red/output.css +a { + b: oklch(53.737032336% 0.4868840398 188.5426015282deg); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), oklch)} + +<===> missing/green/output.css +a { + b: oklch(29.1994683846% 0.4226922374 316.7740736717deg); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), oklch)} + +<===> missing/blue/output.css +a { + b: oklch(56.4114760121% 0.2339193759 138.7662056048deg); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx new file mode 100644 index 0000000000..203310878d --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), prophoto-rgb)} + +<===> black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), prophoto-rgb)} + +<===> white/output.css +a { + b: color(prophoto-rgb 1.0215440123 0.9911601047 1.1127148486); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), prophoto-rgb)} + +<===> gray/output.css +a { + b: color(prophoto-rgb 0.6950534384 0.6743803795 0.7570856195); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), prophoto-rgb)} + +<===> middle/output.css +a { + b: color(prophoto-rgb 0.3164433223 0.688517143 0.9829806921); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), prophoto-rgb)} + +<===> out_of_range/near/output.css +a { + b: color(prophoto-rgb -1.2757747112 1.1009423845 1.6353953931); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), prophoto-rgb)} + +<===> out_of_range/far/output.css +a { + b: color(prophoto-rgb -2540.8942289653 1537.1744596752 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), prophoto-rgb)} + +<===> alpha/partial/output.css +a { + b: color(prophoto-rgb 0.2248370109 0.4663680632 0.5700273474 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), prophoto-rgb)} + +<===> alpha/transparent/output.css +a { + b: color(prophoto-rgb 0.2248370109 0.4663680632 0.5700273474 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), prophoto-rgb)} + +<===> missing/red/output.css +a { + b: color(prophoto-rgb none 0.5196499466 0.5700273474); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), prophoto-rgb)} + +<===> missing/green/output.css +a { + b: color(prophoto-rgb 0.3068439327 none 0.5700273474); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), prophoto-rgb)} + +<===> missing/blue/output.css +a { + b: color(prophoto-rgb 0.251671286 0.4600356682 none); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rec2020.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rec2020.hrx new file mode 100644 index 0000000000..7e157d8144 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rec2020.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), rec2020)} + +<===> black/output.css +a { + b: color(rec2020 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), rec2020)} + +<===> white/output.css +a { + b: color(rec2020 1.0086369229 0.9889840495 1.1030370326); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), rec2020)} + +<===> gray/output.css +a { + b: color(rec2020 0.7117581507 0.6973714052 0.7808630758); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), rec2020)} + +<===> middle/output.css +a { + b: color(rec2020 -0.075615701 0.7287813238 0.9918551161); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), rec2020)} + +<===> out_of_range/near/output.css +a { + b: color(rec2020 -1.4925160884 1.1662135588 1.5466705118); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), rec2020)} + +<===> out_of_range/far/output.css +a { + b: color(rec2020 -689.5826182995 463.8899975273 -113.049587293); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), rec2020)} + +<===> alpha/partial/output.css +a { + b: color(rec2020 0.0683739868 0.5055777091 0.6004180325 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), rec2020)} + +<===> alpha/transparent/output.css +a { + b: color(rec2020 0.0683739868 0.5055777091 0.6004180325 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), rec2020)} + +<===> missing/red/output.css +a { + b: color(rec2020 none 0.57127065 0.5978630317); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), rec2020)} + +<===> missing/green/output.css +a { + b: color(rec2020 0.2799117622 none 0.6111315018); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), rec2020)} + +<===> missing/blue/output.css +a { + b: color(rec2020 0.2651201665 0.5016141545 none); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rgb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rgb.hrx new file mode 100644 index 0000000000..8055dff9d4 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), rgb)} + +<===> black/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), rgb)} + +<===> white/output.css +a { + b: hsl(72.6622302958, 128.9066481357%, 104.4631089642%); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), rgb)} + +<===> gray/output.css +a { + b: rgb(189.6903079461, 185.0514318275, 207.0327542814); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), rgb)} + +<===> middle/output.css +a { + b: hsl(187.9353554297, 490.1229331153%, 17.2918334784%); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), rgb)} + +<===> out_of_range/near/output.css +a { + b: hsl(3.9698519642, 796.3834139233%, -21.9385057601%); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), rgb)} + +<===> out_of_range/far/output.css +a { + b: hsl(329.431996419, 420.4439814741%, -10316.9080915762%); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), rgb)} + +<===> alpha/partial/output.css +a { + b: hsla(184.0103843189, 495.2078632431%, 10.9589006248%, 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), rgb)} + +<===> alpha/transparent/output.css +a { + b: hsla(184.0103843189, 495.2078632431%, 10.9589006248%, 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), rgb)} + +<===> missing/red/output.css +a { + b: rgb(0, 168.3310327198, 164.9124102862); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), rgb)} + +<===> missing/green/output.css +a { + b: rgb(113.3463666573, 0, 175.0222017144); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), rgb)} + +<===> missing/blue/output.css +a { + b: hsl(128.9663541465, 142.6286256266%, 23.5199973212%); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb.hrx new file mode 100644 index 0000000000..26daa49590 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), srgb)} + +<===> black/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), srgb)} + +<===> white/output.css +a { + b: color(srgb 1.0113816155 0.987098648 1.1021635313); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), srgb)} + +<===> gray/output.css +a { + b: color(srgb 0.7438835606 0.7256918895 0.811893154); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), srgb)} + +<===> middle/output.css +a { + b: color(srgb -0.6745940796 0.7962536745 1.0204307491); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), srgb)} + +<===> out_of_range/near/output.css +a { + b: color(srgb -1.966531269 1.2965640931 1.5277611538); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), srgb)} + +<===> out_of_range/far/output.css +a { + b: color(srgb -536.9372723682 330.5991105367 -111.3818104512); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), srgb)} + +<===> alpha/partial/output.css +a { + b: color(srgb -0.4331043699 0.5797354156 0.6522823824 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), srgb)} + +<===> alpha/transparent/output.css +a { + b: color(srgb -0.4331043699 0.5797354156 0.6522823824 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), srgb)} + +<===> missing/red/output.css +a { + b: color(srgb none 0.6601216969 0.6467153345); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), srgb)} + +<===> missing/green/output.css +a { + b: color(srgb 0.4444955555 none 0.6863615754); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), srgb)} + +<===> missing/blue/output.css +a { + b: color(srgb -0.1002625161 0.5706624625 none); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb_linear.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb_linear.hrx new file mode 100644 index 0000000000..5531c32e23 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb_linear.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), srgb-linear)} + +<===> black/output.css +a { + b: color(srgb-linear 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), srgb-linear)} + +<===> white/output.css +a { + b: color(srgb-linear 1.026087637 0.9709017742 1.2483646679); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), srgb-linear)} + +<===> gray/output.css +a { + b: color(srgb-linear 0.5130438185 0.4854508871 0.6241823339); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), srgb-linear)} + +<===> middle/output.css +a { + b: color(srgb-linear -0.412657003 0.5974969544 1.0471092027); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), srgb-linear)} + +<===> out_of_range/near/output.css +a { + b: color(srgb-linear -4.7624146879 1.8121829743 2.6472259737); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), srgb-linear)} + +<===> out_of_range/far/output.css +a { + b: color(srgb-linear -3134132.718764265 978794.4977603011 -71955.3206025548); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), srgb-linear)} + +<===> alpha/partial/output.css +a { + b: color(srgb-linear -0.1572622797 0.2954041898 0.3830159978 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), srgb-linear)} + +<===> alpha/transparent/output.css +a { + b: color(srgb-linear -0.1572622797 0.2954041898 0.3830159978 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), srgb-linear)} + +<===> missing/red/output.css +a { + b: color(srgb-linear none 0.3932837375 0.3758204586); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), srgb-linear)} + +<===> missing/green/output.css +a { + b: color(srgb-linear 0.1662149199 none 0.4288113498); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), srgb-linear)} + +<===> missing/blue/output.css +a { + b: color(srgb-linear -0.0100636143 0.2853713278 none); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz.hrx new file mode 100644 index 0000000000..25d2d2b887 --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), xyz)} + +<===> black/output.css +a { + b: color(xyz 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), xyz)} + +<===> white/output.css +a { + b: color(xyz 0.9956342097 1.0026671299 1.3221722918); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), xyz)} + +<===> gray/output.css +a { + b: color(xyz 0.4978171049 0.501333565 0.6610861459); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), xyz)} + +<===> middle/output.css +a { + b: color(xyz 0.2324626969 0.4151573703 1.0585524842); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), xyz)} + +<===> out_of_range/near/output.css +a { + b: color(xyz -0.8381943171 0.474450751 2.6402147779); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), xyz)} + +<===> out_of_range/far/output.css +a { + b: color(xyz -955472.4660146538 28369.6809641542 -12314.0025504671); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), xyz)} + +<===> alpha/partial/output.css +a { + b: color(xyz 0.1099054241 0.205474541 0.3962396495 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), xyz)} + +<===> alpha/transparent/output.css +a { + b: color(xyz 0.1099054241 0.205474541 0.3962396495 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), xyz)} + +<===> missing/red/output.css +a { + b: color(xyz none 0.208311512 0.395008248); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), xyz)} + +<===> missing/green/output.css +a { + b: color(xyz 0.1145251151 none 0.4003411794); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), xyz)} + +<===> missing/blue/output.css +a { + b: color(xyz 0.0909276512 0.1991621087 none); +} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz_d50.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz_d50.hrx new file mode 100644 index 0000000000..e6e632b18d --- /dev/null +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz_d50.hrx @@ -0,0 +1,118 @@ +<===> black/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0 0 0), xyz-d50)} + +<===> black/output.css +a { + b: color(xyz-d50 0 0 0); +} + +<===> +================================================================================ +<===> white/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 1 1 1), xyz-d50)} + +<===> white/output.css +a { + b: color(xyz-d50 1 1 1); +} + +<===> +================================================================================ +<===> gray/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), xyz-d50)} + +<===> gray/output.css +a { + b: color(xyz-d50 0.5 0.5 0.5); +} + +<===> +================================================================================ +<===> middle/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), xyz-d50)} + +<===> middle/output.css +a { + b: color(xyz-d50 0.2 0.4 0.8); +} + +<===> +================================================================================ +<===> out_of_range/near/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -1 0.4 2), xyz-d50)} + +<===> out_of_range/near/output.css +a { + b: color(xyz-d50 -1 0.4 2); +} + +<===> +================================================================================ +<===> out_of_range/far/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 -999999 0 0), xyz-d50)} + +<===> out_of_range/far/output.css +a { + b: color(xyz-d50 -999999 0 0); +} + +<===> +================================================================================ +<===> alpha/partial/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), xyz-d50)} + +<===> alpha/partial/output.css +a { + b: color(xyz-d50 0.1 0.2 0.3 / 0.4); +} + +<===> +================================================================================ +<===> alpha/transparent/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), xyz-d50)} + +<===> alpha/transparent/output.css +a { + b: color(xyz-d50 0.1 0.2 0.3 / 0); +} + +<===> +================================================================================ +<===> missing/red/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 none 0.2 0.3), xyz-d50)} + +<===> missing/red/output.css +a { + b: color(xyz-d50 none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/green/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 none 0.3), xyz-d50)} + +<===> missing/green/output.css +a { + b: color(xyz-d50 0.1 none 0.3); +} + +<===> +================================================================================ +<===> missing/blue/input.scss +@use 'sass:color'; +a {b: color.to-space(color(xyz-d50 0.1 0.2 none), xyz-d50)} + +<===> missing/blue/output.css +a { + b: color(xyz-d50 0.1 0.2 none); +} From 5cc66201f4ad0d6be0cd6a39087b0fef7f17174b Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 12 Apr 2024 17:40:49 -0700 Subject: [PATCH 27/45] [Color 4] Add specs for `color.is-powerless()` (#1975) --- .../color/is_powerless/error.hrx | 145 ++++++++++++++++++ .../core_functions/color/is_powerless/hsl.hrx | 84 ++++++++++ .../core_functions/color/is_powerless/hwb.hrx | 74 +++++++++ .../core_functions/color/is_powerless/lab.hrx | 47 ++++++ .../core_functions/color/is_powerless/lch.hrx | 84 ++++++++++ .../color/is_powerless/named.hrx | 8 + .../color/is_powerless/oklab.hrx | 47 ++++++ .../color/is_powerless/oklch.hrx | 84 ++++++++++ .../color/is_powerless/space.hrx | 19 +++ 9 files changed, 592 insertions(+) create mode 100644 spec/core_functions/color/is_powerless/error.hrx create mode 100644 spec/core_functions/color/is_powerless/hsl.hrx create mode 100644 spec/core_functions/color/is_powerless/hwb.hrx create mode 100644 spec/core_functions/color/is_powerless/lab.hrx create mode 100644 spec/core_functions/color/is_powerless/lch.hrx create mode 100644 spec/core_functions/color/is_powerless/named.hrx create mode 100644 spec/core_functions/color/is_powerless/oklab.hrx create mode 100644 spec/core_functions/color/is_powerless/oklch.hrx create mode 100644 spec/core_functions/color/is_powerless/space.hrx diff --git a/spec/core_functions/color/is_powerless/error.hrx b/spec/core_functions/color/is_powerless/error.hrx new file mode 100644 index 0000000000..106522cad9 --- /dev/null +++ b/spec/core_functions/color/is_powerless/error.hrx @@ -0,0 +1,145 @@ +<===> too_few_args/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black)} + +<===> too_few_args/error +Error: Missing argument $channel. + ,--> input.scss +2 | a {b: color.is-powerless(black)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function is-powerless($color, $channel, $space: null) { + | ============================================ declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black, "red", rgb, c)} + +<===> too_many_args/error +Error: Only 3 arguments allowed, but 4 were passed. + ,--> input.scss +2 | a {b: color.is-powerless(black, "red", rgb, c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function is-powerless($color, $channel, $space: null) { + | ============================================ declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/color/input.scss +@use 'sass:color'; +a {b: color.is-powerless(c, "red")} + +<===> type/color/error +Error: $color: c is not a color. + , +2 | a {b: color.is-powerless(c, "red")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/channel/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black, 1)} + +<===> type/channel/error +Error: $channel: 1 is not a string. + , +2 | a {b: color.is-powerless(black, 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/space/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black, "red", $space: 1)} + +<===> type/space/error +Error: $space: 1 is not a string. + , +2 | a {b: color.is-powerless(black, "red", $space: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> channel/unquoted/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hsl(0deg 0% 0%), hue)} + +<===> channel/unquoted/error +Error: $channel: Expected hue to be a quoted string. + , +2 | a {b: color.is-powerless(hsl(0deg 0% 0%), hue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> channel/unknown/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black, "c")} + +<===> channel/unknown/error +Error: $channel: Color black doesn't have a channel named "c". + , +2 | a {b: color.is-powerless(black, "c")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> channel/wrong_space/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black, "hue")} + +<===> channel/wrong_space/error +Error: $channel: Color black doesn't have a channel named "hue". + , +2 | a {b: color.is-powerless(black, "hue")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/quoted/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black, "red", $space: "rgb")} + +<===> space/quoted/error +Error: $space: Expected "rgb" to be an unquoted string. + , +2 | a {b: color.is-powerless(black, "red", $space: "rgb")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/unknown/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black, "red", $space: c)} + +<===> space/unknown/error +Error: $space: Unknown color space "c". + , +2 | a {b: color.is-powerless(black, "red", $space: c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/is_powerless/hsl.hrx b/spec/core_functions/color/is_powerless/hsl.hrx new file mode 100644 index 0000000000..5a7b5d1f1a --- /dev/null +++ b/spec/core_functions/color/is_powerless/hsl.hrx @@ -0,0 +1,84 @@ +<===> hue/positive_saturation/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hsl(0deg 50% 50%), "hue")} + +<===> hue/positive_saturation/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hue/zero_saturation/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hsl(0deg 0% 50%), "hue")} + +<===> hue/zero_saturation/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/near_zero_saturation/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hsl(0deg 0.000000000001% 50%), "hue")} + +<===> hue/near_zero_saturation/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/full_lightness/input.scss +// These used to be considered powerless by the CSS spec, but are no longer, so +// Sass shouldn't consdier it powerless either. +@use 'sass:color'; +a {b: color.is-powerless(hsl(0deg 50% 100%), "hue")} + +<===> hue/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hue/zero_lightness/input.scss +// These used to be considered powerless by the CSS spec, but are no longer, so +// Sass shouldn't consdier it powerless either. +@use 'sass:color'; +a {b: color.is-powerless(hsl(0deg 50% 0%), "hue")} + +<===> hue/zero_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> saturation/README.md +These used to be considered powerless by the CSS spec, but are no longer, so +Sass shouldn't consdier them powerless either. + +<===> +================================================================================ +<===> saturation/full_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hsl(0deg 0% 100%), "saturation")} + +<===> saturation/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> saturation/zero_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hsl(0deg 0% 0%), "saturation")} + +<===> saturation/zero_lightness/output.css +a { + b: false; +} diff --git a/spec/core_functions/color/is_powerless/hwb.hrx b/spec/core_functions/color/is_powerless/hwb.hrx new file mode 100644 index 0000000000..25781e3c70 --- /dev/null +++ b/spec/core_functions/color/is_powerless/hwb.hrx @@ -0,0 +1,74 @@ +<===> hue/not_greyscale/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hwb(0deg 30% 40%), "hue")} + +<===> hue/not_greyscale/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hue/full_whiteness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hwb(0deg 100% 0%), "hue")} + +<===> hue/full_whiteness/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/full_blackness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hwb(0deg 0% 100%), "hue")} + +<===> hue/full_blackness/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/grey/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hwb(0deg 40% 60%), "hue")} + +<===> hue/grey/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/normalized_grey/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hwb(0deg 60% 80%), "hue")} + +<===> hue/normalized_grey/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/out_of_gamut/colorful/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hwb(0deg -30% 50%), "hue")} + +<===> hue/out_of_gamut/colorful/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hue/out_of_gamut/grey/input.scss +@use 'sass:color'; +a {b: color.is-powerless(hwb(0deg -30% 130%), "hue")} + +<===> hue/out_of_gamut/grey/output.css +a { + b: true; +} diff --git a/spec/core_functions/color/is_powerless/lab.hrx b/spec/core_functions/color/is_powerless/lab.hrx new file mode 100644 index 0000000000..5827957f15 --- /dev/null +++ b/spec/core_functions/color/is_powerless/lab.hrx @@ -0,0 +1,47 @@ +<===> README.md +These used to be considered powerless by the CSS spec, but are no longer, so +Sass shouldn't consdier them powerless either. + +<===> +================================================================================ +<===> a/full_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lab(100% 0 0), "a")} + +<===> a/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> a/zero_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lab(0% 0 0), "a")} + +<===> a/zero_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> b/full_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lab(100% 0 0), "b")} + +<===> b/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> b/zero_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lab(0% 0 0), "b")} + +<===> b/zero_lightness/output.css +a { + b: false; +} diff --git a/spec/core_functions/color/is_powerless/lch.hrx b/spec/core_functions/color/is_powerless/lch.hrx new file mode 100644 index 0000000000..af1e50e7ad --- /dev/null +++ b/spec/core_functions/color/is_powerless/lch.hrx @@ -0,0 +1,84 @@ +<===> hue/positive_chroma/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lch(50% 50% 0deg), "hue")} + +<===> hue/positive_chroma/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hue/zero_chroma/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lch(50% 0% 0deg), "hue")} + +<===> hue/zero_chroma/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/near_zero_chroma/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lch(50% 0.000000000001% 0deg), "hue")} + +<===> hue/near_zero_chroma/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/full_lightness/input.scss +// These used to be considered powerless by the CSS spec, but are no longer, so +// Sass shouldn't consdier it powerless either. +@use 'sass:color'; +a {b: color.is-powerless(lch(100% 50% 0deg), "hue")} + +<===> hue/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hue/zero_lightness/input.scss +// These used to be considered powerless by the CSS spec, but are no longer, so +// Sass shouldn't consdier it powerless either. +@use 'sass:color'; +a {b: color.is-powerless(lch(0% 50% 0deg), "hue")} + +<===> hue/zero_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> chroma/README.md +These used to be considered powerless by the CSS spec, but are no longer, so +Sass shouldn't consdier them powerless either. + +<===> +================================================================================ +<===> chroma/full_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lch(100% 0% 0deg), "chroma")} + +<===> chroma/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> chroma/zero_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(lch(0% 0% 0deg), "chroma")} + +<===> chroma/zero_lightness/output.css +a { + b: false; +} diff --git a/spec/core_functions/color/is_powerless/named.hrx b/spec/core_functions/color/is_powerless/named.hrx new file mode 100644 index 0000000000..3cd4a4c71e --- /dev/null +++ b/spec/core_functions/color/is_powerless/named.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.is-powerless($color: red, $channel: "a", $space: lab)} + +<===> output.css +a { + b: false; +} diff --git a/spec/core_functions/color/is_powerless/oklab.hrx b/spec/core_functions/color/is_powerless/oklab.hrx new file mode 100644 index 0000000000..b289ab0d3d --- /dev/null +++ b/spec/core_functions/color/is_powerless/oklab.hrx @@ -0,0 +1,47 @@ +<===> README.md +These used to be considered powerless by the CSS spec, but are no longer, so +Sass shouldn't consdier them powerless either. + +<===> +================================================================================ +<===> a/full_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklab(100% 0 0), "a")} + +<===> a/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> a/zero_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklab(0% 0 0), "a")} + +<===> a/zero_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> b/full_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklab(100% 0 0), "b")} + +<===> b/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> b/zero_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklab(0% 0 0), "b")} + +<===> b/zero_lightness/output.css +a { + b: false; +} diff --git a/spec/core_functions/color/is_powerless/oklch.hrx b/spec/core_functions/color/is_powerless/oklch.hrx new file mode 100644 index 0000000000..a9b0bc7fb9 --- /dev/null +++ b/spec/core_functions/color/is_powerless/oklch.hrx @@ -0,0 +1,84 @@ +<===> hue/positive_chroma/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklch(50% 50% 0deg), "hue")} + +<===> hue/positive_chroma/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hue/zero_chroma/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklch(50% 0% 0deg), "hue")} + +<===> hue/zero_chroma/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/near_zero_chroma/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklch(50% 0.000000000001% 0deg), "hue")} + +<===> hue/near_zero_chroma/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> hue/full_lightness/input.scss +// These used to be considered powerless by the CSS spec, but are no longer, so +// Sass shouldn't consdier it powerless either. +@use 'sass:color'; +a {b: color.is-powerless(oklch(100% 50% 0deg), "hue")} + +<===> hue/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> hue/zero_lightness/input.scss +// These used to be considered powerless by the CSS spec, but are no longer, so +// Sass shouldn't consdier it powerless either. +@use 'sass:color'; +a {b: color.is-powerless(oklch(0% 50% 0deg), "hue")} + +<===> hue/zero_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> chroma/README.md +These used to be considered powerless by the CSS spec, but are no longer, so +Sass shouldn't consdier them powerless either. + +<===> +================================================================================ +<===> chroma/full_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklch(100% 0% 0deg), "chroma")} + +<===> chroma/full_lightness/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> chroma/zero_lightness/input.scss +@use 'sass:color'; +a {b: color.is-powerless(oklch(0% 0% 0deg), "chroma")} + +<===> chroma/zero_lightness/output.css +a { + b: false; +} diff --git a/spec/core_functions/color/is_powerless/space.hrx b/spec/core_functions/color/is_powerless/space.hrx new file mode 100644 index 0000000000..1809e78af5 --- /dev/null +++ b/spec/core_functions/color/is_powerless/space.hrx @@ -0,0 +1,19 @@ +<===> powerless/input.scss +@use 'sass:color'; +a {b: color.is-powerless(grey, "hue", $space: hsl)} + +<===> powerless/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> not_powerless/input.scss +@use 'sass:color'; +a {b: color.is-powerless(grey, "a", $space: lab)} + +<===> not_powerless/output.css +a { + b: false; +} From 176040443d9d0c3986c8291bb1d0a9f06abeb0d5 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 19 Apr 2024 16:18:26 -0700 Subject: [PATCH 28/45] Update gamut-mapping specs to use the new method parameter (#1977) --- .../value/color/color-4-conversions.test.ts | 24 ++++-- .../color/color-4-nonparametizable.test.ts | 75 ++++++++++++------- js-api-spec/value/color/spaces.ts | 56 +++++++------- 3 files changed, 92 insertions(+), 63 deletions(-) diff --git a/js-api-spec/value/color/color-4-conversions.test.ts b/js-api-spec/value/color/color-4-conversions.test.ts index 0cbdfa5250..4df2de3fee 100644 --- a/js-api-spec/value/color/color-4-conversions.test.ts +++ b/js-api-spec/value/color/color-4-conversions.test.ts @@ -7,6 +7,7 @@ import {SassColor} from 'sass'; import type { ColorSpaceXyz, + GamutMapMethod, HueInterpolationMethod, KnownColorSpace, } from 'sass'; @@ -207,12 +208,23 @@ describe('Color 4 SassColors Conversions', () => { }); describe('toGamut', () => { - space.gamutExamples.forEach(([input, output]) => { - it(`in own space, ${input} -> ${output}`, () => { - const res = space.constructor(...input).toGamut(); - expect(res).toLooselyEqualColor(space.constructor(...output)); - }); - }); + for (const [input, outputs] of space.gamutExamples) { + const outputsObj = + outputs instanceof Array + ? {clip: outputs, 'local-minde': outputs} + : outputs; + + for (const [method, output] of Object.entries(outputsObj)) { + describe(method, () => { + it(`in own space, ${input} -> ${output}`, () => { + const res = space + .constructor(...input) + .toGamut({method: method as GamutMapMethod}); + expect(res).toLooselyEqualColor(space.constructor(...output)); + }); + }); + } + } }); }); }); diff --git a/js-api-spec/value/color/color-4-nonparametizable.test.ts b/js-api-spec/value/color/color-4-nonparametizable.test.ts index 2609093359..e69d64019c 100644 --- a/js-api-spec/value/color/color-4-nonparametizable.test.ts +++ b/js-api-spec/value/color/color-4-nonparametizable.test.ts @@ -9,41 +9,64 @@ import type { ChannelName, ChannelNameXyz, ColorSpaceXyz, + GamutMapMethod, KnownColorSpace, } from 'sass'; -import {skipForImpl} from '../../utils'; import * as constructors from './constructors'; describe('Color 4 SassColors Non-parametizable', () => { - // TODO: Waiting on new ColorJS release to fix `toGamut` mapping: - // https://github.com/LeaVerou/color.js/pull/344 - skipForImpl('sass-embedded', () => { - it('toGamut with space', () => { - const cases: [SassColor, KnownColorSpace, SassColor][] = [ - [ - constructors.oklch(0.8, 2, 150), - 'display-p3', - constructors.oklch( - 0.8011972524233195, - 0.31025433677129627, - 149.69615588210382 + describe('toGamut', () => { + const cases: [ + SassColor, + KnownColorSpace, + Record + ][] = [ + [ + constructors.oklch(0.8, 2, 150), + 'display-p3', + { + 'local-minde': constructors.oklch( + 0.80777568417, + 0.3262439045, + 148.1202740275 ), - ], - [ - constructors.oklch(0.8, 2, 150), - 'srgb', - constructors.oklch( - 0.8086628549532134, - 0.23694508940439973, - 147.5313920153958 + clip: constructors.oklch( + 0.848829286984, + 0.3685278106, + 145.6449503702 ), - ], - ]; - cases.forEach(([input, space, output]) => { - expect(input.toGamut(space)).toLooselyEqualColor(output); + }, + ], + [ + constructors.oklch(0.8, 2, 150), + 'srgb', + { + 'local-minde': constructors.oklch( + 0.809152570179, + 0.2379027576, + 147.4021477687 + ), + clip: constructors.oklch( + 0.866439611536, + 0.2948272403, + 142.4953388878 + ), + }, + ], + ]; + + for (const [input, space, outputs] of cases) { + describe(`with space ${space}`, () => { + for (const [method, output] of Object.entries(outputs)) { + it(`with method ${method}`, () => { + expect( + input.toGamut({space, method: method as GamutMapMethod}) + ).toLooselyEqualColor(output); + }); + } }); - }); + } }); it('channel with space specified, missing returns 0', () => { diff --git a/js-api-spec/value/color/spaces.ts b/js-api-spec/value/color/spaces.ts index 93d26ed704..806fc0c17c 100644 --- a/js-api-spec/value/color/spaces.ts +++ b/js-api-spec/value/color/spaces.ts @@ -12,6 +12,7 @@ import type { ChannelNameLch, ChannelNameRgb, ChannelNameXyz, + GamutMapMethod, KnownColorSpace, } from 'sass'; @@ -31,7 +32,15 @@ export const spaces: { hasPowerless?: boolean; hasOutOfGamut: boolean; // input, output in own space, output in p3 - gamutExamples: [[number, number, number], [number, number, number]][]; + gamutExamples: Array< + [ + [number, number, number], + ( + | [number, number, number] + | Record + ) + ] + >; }; } = { lab: { @@ -135,10 +144,7 @@ export const spaces: { ], hasOutOfGamut: true, gamutExamples: [ - [ - [0.5, 2, 2], - [1, 1, 1], - ], + [[0.5, 2, 2], {clip: [0.5, 1, 1], 'local-minde': [1, 1, 1]}], ], }, 'srgb-linear': { @@ -156,10 +162,7 @@ export const spaces: { ], hasOutOfGamut: true, gamutExamples: [ - [ - [0.5, 2, 2], - [1, 1, 1], - ], + [[0.5, 2, 2], {clip: [0.5, 1, 1], 'local-minde': [1, 1, 1]}], ], }, 'display-p3': { @@ -177,10 +180,7 @@ export const spaces: { ], hasOutOfGamut: true, gamutExamples: [ - [ - [0.5, 2, 2], - [1, 1, 1], - ], + [[0.5, 2, 2], {clip: [0.5, 1, 1], 'local-minde': [1, 1, 1]}], ], }, 'a98-rgb': { @@ -198,10 +198,7 @@ export const spaces: { ], hasOutOfGamut: true, gamutExamples: [ - [ - [0.5, 2, 2], - [1, 1, 1], - ], + [[0.5, 2, 2], {clip: [0.5, 1, 1], 'local-minde': [1, 1, 1]}], ], }, 'prophoto-rgb': { @@ -219,10 +216,7 @@ export const spaces: { ], hasOutOfGamut: true, gamutExamples: [ - [ - [0.5, 2, 2], - [1, 1, 1], - ], + [[0.5, 2, 2], {clip: [0.5, 1, 1], 'local-minde': [1, 1, 1]}], ], }, rec2020: { @@ -240,10 +234,7 @@ export const spaces: { ], hasOutOfGamut: true, gamutExamples: [ - [ - [0.5, 2, 2], - [1, 1, 1], - ], + [[0.5, 2, 2], {clip: [0.5, 1, 1], 'local-minde': [1, 1, 1]}], ], }, xyz: { @@ -344,11 +335,14 @@ export const spaces: { [0, 100], [0, 100], ], - hasOutOfGamut: false, + hasOutOfGamut: true, gamutExamples: [ [ - [0.5, 100, 50], - [0.5, 100, 50], + [0.5, 110, 50], + { + clip: [0.5, 100, 50], + 'local-minde': [2.9140262667, 100, 52.0514687465], + }, ], ], }, @@ -366,11 +360,11 @@ export const spaces: { [0, 100], [0, 100], ], - hasOutOfGamut: false, + hasOutOfGamut: true, gamutExamples: [ [ - [0.5, 100, 50], - [0.5, 100, 50], + [0.5, -3, -7], + {clip: [0.5, 0, 0], 'local-minde': [3.4921217446, 11.2665189221, 0]}, ], ], }, From 71c13cf03b0f498faeb61f795afb5f3891b86ef2 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Wed, 24 Apr 2024 15:25:13 -0700 Subject: [PATCH 29/45] Add tests for color.to-gamut() (#1980) --- .../core_functions/color/to_gamut/a98_rgb.hrx | 63 +++++++ .../color/to_gamut/display_p3.hrx | 63 +++++++ spec/core_functions/color/to_gamut/error.hrx | 163 ++++++++++++++++++ spec/core_functions/color/to_gamut/hsl.hrx | 83 +++++++++ spec/core_functions/color/to_gamut/hwb.hrx | 63 +++++++ spec/core_functions/color/to_gamut/lab.hrx | 29 ++++ spec/core_functions/color/to_gamut/lch.hrx | 29 ++++ spec/core_functions/color/to_gamut/named.hrx | 8 + spec/core_functions/color/to_gamut/oklab.hrx | 29 ++++ spec/core_functions/color/to_gamut/oklch.hrx | 29 ++++ .../color/to_gamut/positional.hrx | 8 + .../color/to_gamut/prophoto_rgb.hrx | 63 +++++++ .../core_functions/color/to_gamut/rec2020.hrx | 63 +++++++ spec/core_functions/color/to_gamut/rgb.hrx | 73 ++++++++ spec/core_functions/color/to_gamut/space.hrx | 63 +++++++ spec/core_functions/color/to_gamut/srgb.hrx | 63 +++++++ .../color/to_gamut/srgb_linear.hrx | 63 +++++++ spec/core_functions/color/to_gamut/xyz.hrx | 19 ++ .../core_functions/color/to_gamut/xyz_d50.hrx | 19 ++ .../color/to_space/hwb/oklab.hrx | 2 +- .../color/to_space/hwb/oklch.hrx | 2 +- .../color/to_space/xyz/oklab.hrx | 2 +- .../color/to_space/xyz/oklch.hrx | 2 +- .../color/to_space/xyz_d50/xyz-d50/oklab.hrx | 2 +- .../color/to_space/xyz_d50/xyz-d50/oklch.hrx | 2 +- 25 files changed, 999 insertions(+), 6 deletions(-) create mode 100644 spec/core_functions/color/to_gamut/a98_rgb.hrx create mode 100644 spec/core_functions/color/to_gamut/display_p3.hrx create mode 100644 spec/core_functions/color/to_gamut/error.hrx create mode 100644 spec/core_functions/color/to_gamut/hsl.hrx create mode 100644 spec/core_functions/color/to_gamut/hwb.hrx create mode 100644 spec/core_functions/color/to_gamut/lab.hrx create mode 100644 spec/core_functions/color/to_gamut/lch.hrx create mode 100644 spec/core_functions/color/to_gamut/named.hrx create mode 100644 spec/core_functions/color/to_gamut/oklab.hrx create mode 100644 spec/core_functions/color/to_gamut/oklch.hrx create mode 100644 spec/core_functions/color/to_gamut/positional.hrx create mode 100644 spec/core_functions/color/to_gamut/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/to_gamut/rec2020.hrx create mode 100644 spec/core_functions/color/to_gamut/rgb.hrx create mode 100644 spec/core_functions/color/to_gamut/space.hrx create mode 100644 spec/core_functions/color/to_gamut/srgb.hrx create mode 100644 spec/core_functions/color/to_gamut/srgb_linear.hrx create mode 100644 spec/core_functions/color/to_gamut/xyz.hrx create mode 100644 spec/core_functions/color/to_gamut/xyz_d50.hrx diff --git a/spec/core_functions/color/to_gamut/a98_rgb.hrx b/spec/core_functions/color/to_gamut/a98_rgb.hrx new file mode 100644 index 0000000000..9f9536a350 --- /dev/null +++ b/spec/core_functions/color/to_gamut/a98_rgb.hrx @@ -0,0 +1,63 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(a98-rgb 0.2 0.5 0.8), $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: color(a98-rgb 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(a98-rgb 1.5 0.5 0.8), $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: color(a98-rgb 1 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(a98-rgb 0.2 0.5 0.8), $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: color(a98-rgb 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(a98-rgb 1.1 0.5 0.8), $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: color(a98-rgb 1 0.5850609654 0.8001989835); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(a98-rgb 0.8 1.1 1.4), $method: local-minde)} + +<===> local_minde/to_white/output.css +a { + b: color(a98-rgb 1 1 1); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(a98-rgb 0 -0.05 -0.05), $method: local-minde)} + +<===> local_minde/to_black/output.css +a { + b: color(a98-rgb 0 0 0); +} diff --git a/spec/core_functions/color/to_gamut/display_p3.hrx b/spec/core_functions/color/to_gamut/display_p3.hrx new file mode 100644 index 0000000000..f66eb6148d --- /dev/null +++ b/spec/core_functions/color/to_gamut/display_p3.hrx @@ -0,0 +1,63 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(display-p3 0.2 0.5 0.8), $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: color(display-p3 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(display-p3 1.5 0.5 0.8), $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: color(display-p3 1 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(display-p3 0.2 0.5 0.8), $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: color(display-p3 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(display-p3 1.5 0.5 0.8), $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: color(display-p3 1 0.9080382844 0.9302909848); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(display-p3 0.8 1.1 1.4), $method: local-minde)} + +<===> local_minde/to_white/output.css +a { + b: color(display-p3 1 1 1); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(display-p3 0 -0.05 -0.05), $method: local-minde)} + +<===> local_minde/to_black/output.css +a { + b: color(display-p3 0 0 0); +} diff --git a/spec/core_functions/color/to_gamut/error.hrx b/spec/core_functions/color/to_gamut/error.hrx new file mode 100644 index 0000000000..810f466bab --- /dev/null +++ b/spec/core_functions/color/to_gamut/error.hrx @@ -0,0 +1,163 @@ +<===> color/type/input.scss +@use 'sass:color'; +a {b: color.to-gamut(c, $method: local-minde)} + +<===> color/type/error +Error: $color: c is not a color. + , +2 | a {b: color.to-gamut(c, $method: local-minde)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/type/input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink, $space: red, $method: local-minde)} + +<===> space/type/error +Error: $space: red is not a string. + , +2 | a {b: color.to-gamut(pink, $space: red, $method: local-minde)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/unknown/input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink, $space: c, $method: local-minde)} + +<===> space/unknown/error +Error: $space: Unknown color space "c". + , +2 | a {b: color.to-gamut(pink, $space: c, $method: local-minde)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/quoted/input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink, $space: "rgb", $method: local-minde)} + +<===> space/quoted/error +Error: $space: Expected "rgb" to be an unquoted string. + , +2 | a {b: color.to-gamut(pink, $space: "rgb", $method: local-minde)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> method/type/input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink, $method: 1)} + +<===> method/type/error +Error: $method: 1 is not a string. + , +2 | a {b: color.to-gamut(pink, $method: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> method/unknown/input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink, $method: c)} + +<===> method/unknown/error +Error: Unknown gamut map method "c". + , +2 | a {b: color.to-gamut(pink, $method: c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> method/quoted/input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink, $method: "clip")} + +<===> method/quoted/error +Error: $method: Expected "clip" to be an unquoted string. + , +2 | a {b: color.to-gamut(pink, $method: "clip")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> method/absent/input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink)} + +<===> method/absent/error +Error: $method: color.to-gamut() requires a $method argument for forwards-compatibility with changes in the CSS spec. Suggestion: + +$method: local-minde + , +2 | a {b: color.to-gamut(pink)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> method/null/input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink, $method: null)} + +<===> method/null/error +Error: $method: color.to-gamut() requires a $method argument for forwards-compatibility with changes in the CSS spec. Suggestion: + +$method: local-minde + , +2 | a {b: color.to-gamut(pink, $method: null)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> too_few_args/input.scss +@use 'sass:color'; +a {b: color.to-gamut()} + +<===> too_few_args/error +Error: Missing argument $color. + ,--> input.scss +2 | a {b: color.to-gamut()} + | ^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function to-gamut($color, $space: null, $method: null) { + | ============================================= declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +@use 'sass:color'; +a {b: color.to-gamut(red, rgb, clip, c)} + +<===> too_many_args/error +Error: Only 3 arguments allowed, but 4 were passed. + ,--> input.scss +2 | a {b: color.to-gamut(red, rgb, clip, c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function to-gamut($color, $space: null, $method: null) { + | ============================================= declaration + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/to_gamut/hsl.hrx b/spec/core_functions/color/to_gamut/hsl.hrx new file mode 100644 index 0000000000..8acaf5982b --- /dev/null +++ b/spec/core_functions/color/to_gamut/hsl.hrx @@ -0,0 +1,83 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hsl(70deg 50% 50%), $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: hsl(70, 50%, 50%); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(hsl(70deg 50% 50%), $saturation: 200%), + $method: clip + ); +} + +<===> clip/out_of_gamut/output.css +a { + b: hsl(70, 100%, 50%); +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hsl(70deg 50% 50%), $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: hsl(70, 50%, 50%); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(hsl(70deg 50% 50%), $saturation: 107%), + $method: local-minde + ); +} + +<===> local_minde/out_of_gamut/output.css +a { + b: hsl(73.5850781672, 100%, 67.4750294398%); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(hsl(70deg 50% 50%), $saturation: 120%), + $method: local-minde + ); +} + +<===> local_minde/to_white/output.css +a { + b: hsl(none 0% 100%); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(hsl(70deg 100% 50%), $lightness: -1%), + $method: local-minde + ); +} + +<===> local_minde/to_black/output.css +a { + b: hsl(none 0% 0%); +} diff --git a/spec/core_functions/color/to_gamut/hwb.hrx b/spec/core_functions/color/to_gamut/hwb.hrx new file mode 100644 index 0000000000..37c7578659 --- /dev/null +++ b/spec/core_functions/color/to_gamut/hwb.hrx @@ -0,0 +1,63 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hwb(70deg 30% 30%), $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: hsl(70, 40%, 50%); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hwb(70deg 200% -50%), $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hwb(70deg 30% 30%), $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: hsl(70, 40%, 50%); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hwb(70deg -5% -5%), $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: hsl(75.7157487534, 100%, 75.8982992248%); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hwb(70deg -10% -10%), $method: local-minde)} + +<===> local_minde/to_white/output.css +a { + b: hwb(none 100% 0%); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hwb(70deg -2% 100%), $method: local-minde)} + +<===> local_minde/to_black/output.css +a { + b: hwb(none 0% 100%); +} diff --git a/spec/core_functions/color/to_gamut/lab.hrx b/spec/core_functions/color/to_gamut/lab.hrx new file mode 100644 index 0000000000..7ef179777e --- /dev/null +++ b/spec/core_functions/color/to_gamut/lab.hrx @@ -0,0 +1,29 @@ +<===> clip/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(lab(50% 500 -999999), $lightness: 150%), + $method: clip + ); +} + +<===> clip/output.css +a { + b: color-mix(in lab, color(xyz 6530020637.921538 2172031124.122868 137328815479.04425) 100%, black); +} + +<===> +================================================================================ +<===> local_minde/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(lab(50% 500 -999999), $lightness: 150%), + $method: local-minde + ); +} + +<===> local_minde/output.css +a { + b: color-mix(in lab, color(xyz 6530020637.921538 2172031124.122868 137328815479.04425) 100%, black); +} diff --git a/spec/core_functions/color/to_gamut/lch.hrx b/spec/core_functions/color/to_gamut/lch.hrx new file mode 100644 index 0000000000..bc58238646 --- /dev/null +++ b/spec/core_functions/color/to_gamut/lch.hrx @@ -0,0 +1,29 @@ +<===> clip/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(lch(50% 200% 70deg), $lightness: 150%), + $method: clip + ); +} + +<===> clip/output.css +a { + b: color-mix(in lch, color(xyz 3.9677504831 2.839747694 -0.024493753) 100%, black); +} + +<===> +================================================================================ +<===> local_minde/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(lch(50% 200% 70deg), $lightness: 150%), + $method: local-minde + ); +} + +<===> local_minde/output.css +a { + b: color-mix(in lch, color(xyz 3.9677504831 2.839747694 -0.024493753) 100%, black); +} diff --git a/spec/core_functions/color/to_gamut/named.hrx b/spec/core_functions/color/to_gamut/named.hrx new file mode 100644 index 0000000000..8e8f5de8c6 --- /dev/null +++ b/spec/core_functions/color/to_gamut/named.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.to-gamut($color: pink, $space: rgb, $method: local-minde)} + +<===> output.css +a { + b: pink; +} diff --git a/spec/core_functions/color/to_gamut/oklab.hrx b/spec/core_functions/color/to_gamut/oklab.hrx new file mode 100644 index 0000000000..5ed7412f29 --- /dev/null +++ b/spec/core_functions/color/to_gamut/oklab.hrx @@ -0,0 +1,29 @@ +<===> clip/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(oklab(50% 500 -999999), $lightness: 150%), + $method: clip + ); +} + +<===> clip/output.css +a { + b: color-mix(in oklab, color(xyz 593644537356868864 -153762261215017152 3418717280664545280) 100%, black); +} + +<===> +================================================================================ +<===> local_minde/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(oklab(50% 500 -999999), $lightness: 150%), + $method: local-minde + ); +} + +<===> local_minde/output.css +a { + b: color-mix(in oklab, color(xyz 593644537356868864 -153762261215017152 3418717280664545280) 100%, black); +} diff --git a/spec/core_functions/color/to_gamut/oklch.hrx b/spec/core_functions/color/to_gamut/oklch.hrx new file mode 100644 index 0000000000..41cf10892e --- /dev/null +++ b/spec/core_functions/color/to_gamut/oklch.hrx @@ -0,0 +1,29 @@ +<===> clip/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(oklch(50% 200% 70deg), $lightness: 150%), + $method: clip + ); +} + +<===> clip/output.css +a { + b: color-mix(in oklch, color(xyz 5.2395754107 2.9713210909 -1.434870419) 100%, black); +} + +<===> +================================================================================ +<===> local_minde/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(oklch(50% 200% 70deg), $lightness: 150%), + $method: local-minde + ); +} + +<===> local_minde/output.css +a { + b: color-mix(in oklch, color(xyz 5.2395754107 2.9713210909 -1.434870419) 100%, black); +} diff --git a/spec/core_functions/color/to_gamut/positional.hrx b/spec/core_functions/color/to_gamut/positional.hrx new file mode 100644 index 0000000000..6852cedaeb --- /dev/null +++ b/spec/core_functions/color/to_gamut/positional.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.to-gamut(pink, rgb, local-minde)} + +<===> output.css +a { + b: pink; +} diff --git a/spec/core_functions/color/to_gamut/prophoto_rgb.hrx b/spec/core_functions/color/to_gamut/prophoto_rgb.hrx new file mode 100644 index 0000000000..656bb175bb --- /dev/null +++ b/spec/core_functions/color/to_gamut/prophoto_rgb.hrx @@ -0,0 +1,63 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(prophoto-rgb 0.2 0.5 0.8), $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(prophoto-rgb 1.5 0.5 0.8), $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: color(prophoto-rgb 1 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(prophoto-rgb 0.2 0.5 0.8), $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(prophoto-rgb 1.1 0.5 0.8), $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: color(prophoto-rgb 1 0.5625312196 0.7939519528); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(prophoto-rgb 0.8 1.1 1.4), $method: local-minde)} + +<===> local_minde/to_white/output.css +a { + b: color(prophoto-rgb 1 1 1); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(prophoto-rgb 0 -0.05 -0.05), $method: local-minde)} + +<===> local_minde/to_black/output.css +a { + b: color(prophoto-rgb 0 0 0); +} diff --git a/spec/core_functions/color/to_gamut/rec2020.hrx b/spec/core_functions/color/to_gamut/rec2020.hrx new file mode 100644 index 0000000000..927de88e9f --- /dev/null +++ b/spec/core_functions/color/to_gamut/rec2020.hrx @@ -0,0 +1,63 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(rec2020 0.2 0.5 0.8), $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: color(rec2020 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(rec2020 1.5 0.5 0.8), $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: color(rec2020 1 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(rec2020 0.2 0.5 0.8), $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: color(rec2020 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(rec2020 1.1 0.5 0.8), $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: color(rec2020 1 0.5720949845 0.7959438083); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(rec2020 0.8 1.1 1.4), $method: local-minde)} + +<===> local_minde/to_white/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(rec2020 0 -0.05 -0.05), $method: local-minde)} + +<===> local_minde/to_black/output.css +a { + b: color(rec2020 0 0 0); +} diff --git a/spec/core_functions/color/to_gamut/rgb.hrx b/spec/core_functions/color/to_gamut/rgb.hrx new file mode 100644 index 0000000000..06c6708308 --- /dev/null +++ b/spec/core_functions/color/to_gamut/rgb.hrx @@ -0,0 +1,73 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(#abcdef, $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: #abcdef; +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color.change(#abcdef, $red: 300), $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: #ffcdef; +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(#abcdef, $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: #abcdef; +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color.change(#abcdef, $red: 300), $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: rgb(255, 222.6637652053, 237.9231180222); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(#e6ff00, $green: 280, $blue: -25), + $method: local-minde + ); +} + +<===> local_minde/to_white/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(black, $red: -5, $green: -5), + $method: local-minde + ); +} + +<===> local_minde/to_black/output.css +a { + b: black; +} diff --git a/spec/core_functions/color/to_gamut/space.hrx b/spec/core_functions/color/to_gamut/space.hrx new file mode 100644 index 0000000000..c10a8170dc --- /dev/null +++ b/spec/core_functions/color/to_gamut/space.hrx @@ -0,0 +1,63 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(oklch(60% 0.13 240deg), $space: rgb, $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: oklch(60% 0.13 240deg); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(oklch(60% 0.15 240deg), $space: rgb, $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: oklch(60.4068473688% 0.1443906201 242.3895382399deg); +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(oklch(60% 0.13 240deg), $space: rgb, $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: oklch(60% 0.13 240deg); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(oklch(60% 0.15 240deg), $space: rgb, $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: oklch(60.4068473688% 0.1443906201 242.3895382399deg); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a {b: color.to-gamut(oklch(100% 0.13 240deg), $space: rgb, $method: local-minde)} + +<===> local_minde/to_white/output.css +a { + b: oklch(99.9999993474% 0.0000000373 89.8755630959deg); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a {b: color.to-gamut(oklch(0% 0.13 240deg), $space: rgb, $method: local-minde)} + +<===> local_minde/to_black/output.css +a { + b: oklch(0% 0 none); +} diff --git a/spec/core_functions/color/to_gamut/srgb.hrx b/spec/core_functions/color/to_gamut/srgb.hrx new file mode 100644 index 0000000000..0ebdad5865 --- /dev/null +++ b/spec/core_functions/color/to_gamut/srgb.hrx @@ -0,0 +1,63 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb 0.2 0.5 0.8), $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: color(srgb 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb 1.5 0.5 0.8), $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: color(srgb 1 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb 0.2 0.5 0.8), $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: color(srgb 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb 1.5 0.5 0.8), $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: color(srgb 1 0.8660162103 0.8987034234); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb 0.9 1.1 -0.1), $method: local-minde)} + +<===> local_minde/to_white/output.css +a { + b: color(srgb 1 1 1); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb 0 -0.05 -0.05), $method: local-minde)} + +<===> local_minde/to_black/output.css +a { + b: color(srgb 0 0 0); +} diff --git a/spec/core_functions/color/to_gamut/srgb_linear.hrx b/spec/core_functions/color/to_gamut/srgb_linear.hrx new file mode 100644 index 0000000000..12c0aad915 --- /dev/null +++ b/spec/core_functions/color/to_gamut/srgb_linear.hrx @@ -0,0 +1,63 @@ +<===> clip/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb-linear 0.2 0.5 0.8), $method: clip)} + +<===> clip/in_gamut/output.css +a { + b: color(srgb-linear 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> clip/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb-linear 1.5 0.5 0.8), $method: clip)} + +<===> clip/out_of_gamut/output.css +a { + b: color(srgb-linear 1 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/in_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb-linear 0.2 0.5 0.8), $method: local-minde)} + +<===> local_minde/in_gamut/output.css +a { + b: color(srgb-linear 0.2 0.5 0.8); +} + +<===> +================================================================================ +<===> local_minde/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb-linear 1.5 0.5 0.8), $method: local-minde)} + +<===> local_minde/out_of_gamut/output.css +a { + b: color(srgb-linear 1 0.6455185586 0.7900912983); +} + +<===> +================================================================================ +<===> local_minde/to_white/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb-linear 0.9 1.2 1.6), $method: local-minde)} + +<===> local_minde/to_white/output.css +a { + b: color(srgb-linear 1 1 1); +} + +<===> +================================================================================ +<===> local_minde/to_black/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb-linear 0 -0.05 -0.05), $method: local-minde)} + +<===> local_minde/to_black/output.css +a { + b: color(srgb-linear 0 0 0); +} diff --git a/spec/core_functions/color/to_gamut/xyz.hrx b/spec/core_functions/color/to_gamut/xyz.hrx new file mode 100644 index 0000000000..4a1a112aba --- /dev/null +++ b/spec/core_functions/color/to_gamut/xyz.hrx @@ -0,0 +1,19 @@ +<===> clip/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(xyz 123 -456 999999), $method: clip)} + +<===> clip/output.css +a { + b: color(xyz 123 -456 999999); +} + +<===> +================================================================================ +<===> local_minde/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(xyz 123 -456 999999), $method: local-minde)} + +<===> local_minde/output.css +a { + b: color(xyz 123 -456 999999); +} diff --git a/spec/core_functions/color/to_gamut/xyz_d50.hrx b/spec/core_functions/color/to_gamut/xyz_d50.hrx new file mode 100644 index 0000000000..29e382f14b --- /dev/null +++ b/spec/core_functions/color/to_gamut/xyz_d50.hrx @@ -0,0 +1,19 @@ +<===> clip/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(xyz-d50 123 -456 999999), $method: clip)} + +<===> clip/output.css +a { + b: color(xyz-d50 123 -456 999999); +} + +<===> +================================================================================ +<===> local_minde/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(xyz-d50 123 -456 999999), $method: local-minde)} + +<===> local_minde/output.css +a { + b: color(xyz-d50 123 -456 999999); +} diff --git a/spec/core_functions/color/to_space/hwb/oklab.hrx b/spec/core_functions/color/to_space/hwb/oklab.hrx index 8fd0ad2801..2b2d1c099b 100644 --- a/spec/core_functions/color/to_space/hwb/oklab.hrx +++ b/spec/core_functions/color/to_space/hwb/oklab.hrx @@ -59,7 +59,7 @@ a {b: color.to-space(hwb(20deg 200% -125%), oklab)} <===> out_of_range/near/output.css a { - b: oklab(178.3874934308% 0.030918886 0.0348813541); + b: color-mix(in oklab, color(xyz 5.5338099778 5.6426521513 5.4845096668) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/hwb/oklch.hrx b/spec/core_functions/color/to_space/hwb/oklch.hrx index 9604330b0f..1708da5d79 100644 --- a/spec/core_functions/color/to_space/hwb/oklch.hrx +++ b/spec/core_functions/color/to_space/hwb/oklch.hrx @@ -59,7 +59,7 @@ a {b: color.to-space(hwb(20deg 200% -125%), oklch)} <===> out_of_range/near/output.css a { - b: oklch(178.3874934308% 0.0466120839 48.4461706648deg); + b: color-mix(in oklch, color(xyz 5.5338099778 5.6426521513 5.4845096668) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/xyz/oklab.hrx b/spec/core_functions/color/to_space/xyz/oklab.hrx index 9fd03afa74..a69a68934c 100644 --- a/spec/core_functions/color/to_space/xyz/oklab.hrx +++ b/spec/core_functions/color/to_space/xyz/oklab.hrx @@ -15,7 +15,7 @@ a {b: color.to-space(color(xyz 1 1 1), oklab)} <===> white/output.css a { - b: oklab(100.3245366491% 0.0267595166 0.014864444); + b: color-mix(in oklab, color(xyz 1 1 1) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/xyz/oklch.hrx b/spec/core_functions/color/to_space/xyz/oklch.hrx index 561b582e6e..8c82b703f3 100644 --- a/spec/core_functions/color/to_space/xyz/oklch.hrx +++ b/spec/core_functions/color/to_space/xyz/oklch.hrx @@ -15,7 +15,7 @@ a {b: color.to-space(color(xyz 1 1 1), oklch)} <===> white/output.css a { - b: oklch(100.3245366491% 0.0306108383 29.0514068282deg); + b: color-mix(in oklch, color(xyz 1 1 1) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx index 4ff8ac8329..0e68a97eea 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx @@ -15,7 +15,7 @@ a {b: color.to-space(color(xyz-d50 1 1 1), oklab)} <===> white/output.css a { - b: oklab(100.3624960247% 0.0167855154 -0.0354164295); + b: color-mix(in oklab, color(xyz 0.9956342097 1.0026671299 1.3221722918) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx index 183c19eec1..98ebfe65df 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx @@ -15,7 +15,7 @@ a {b: color.to-space(color(xyz-d50 1 1 1), oklch)} <===> white/output.css a { - b: oklch(100.3624960247% 0.0391928183 295.3584786053deg); + b: color-mix(in oklch, color(xyz 0.9956342097 1.0026671299 1.3221722918) 100%, black); } <===> From 5769c7458b6f181b576481f09f8be29b88cdd9ca Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Wed, 24 Apr 2024 16:47:20 -0700 Subject: [PATCH 30/45] [Color 4] Add tests for color.channel() (#1978) --- spec/core_functions/color/channel/a98-rgb.hrx | 63 +++++++ .../color/channel/display-p3.hrx | 63 +++++++ spec/core_functions/color/channel/error.hrx | 159 ++++++++++++++++++ spec/core_functions/color/channel/hsl.hrx | 74 ++++++++ spec/core_functions/color/channel/hwb.hrx | 85 ++++++++++ spec/core_functions/color/channel/lab.hrx | 63 +++++++ spec/core_functions/color/channel/lch.hrx | 63 +++++++ spec/core_functions/color/channel/missing.hrx | 9 + spec/core_functions/color/channel/named.hrx | 8 + spec/core_functions/color/channel/oklab.hrx | 63 +++++++ spec/core_functions/color/channel/oklch.hrx | 63 +++++++ .../color/channel/positional.hrx | 8 + .../color/channel/prophoto-rgb.hrx | 63 +++++++ spec/core_functions/color/channel/rec2020.hrx | 63 +++++++ spec/core_functions/color/channel/rgb.hrx | 63 +++++++ .../color/channel/srgb-linear.hrx | 63 +++++++ spec/core_functions/color/channel/srgb.hrx | 63 +++++++ spec/core_functions/color/channel/xyz-d50.hrx | 63 +++++++ spec/core_functions/color/channel/xyz.hrx | 63 +++++++ 19 files changed, 1162 insertions(+) create mode 100644 spec/core_functions/color/channel/a98-rgb.hrx create mode 100644 spec/core_functions/color/channel/display-p3.hrx create mode 100644 spec/core_functions/color/channel/error.hrx create mode 100644 spec/core_functions/color/channel/hsl.hrx create mode 100644 spec/core_functions/color/channel/hwb.hrx create mode 100644 spec/core_functions/color/channel/lab.hrx create mode 100644 spec/core_functions/color/channel/lch.hrx create mode 100644 spec/core_functions/color/channel/missing.hrx create mode 100644 spec/core_functions/color/channel/named.hrx create mode 100644 spec/core_functions/color/channel/oklab.hrx create mode 100644 spec/core_functions/color/channel/oklch.hrx create mode 100644 spec/core_functions/color/channel/positional.hrx create mode 100644 spec/core_functions/color/channel/prophoto-rgb.hrx create mode 100644 spec/core_functions/color/channel/rec2020.hrx create mode 100644 spec/core_functions/color/channel/rgb.hrx create mode 100644 spec/core_functions/color/channel/srgb-linear.hrx create mode 100644 spec/core_functions/color/channel/srgb.hrx create mode 100644 spec/core_functions/color/channel/xyz-d50.hrx create mode 100644 spec/core_functions/color/channel/xyz.hrx diff --git a/spec/core_functions/color/channel/a98-rgb.hrx b/spec/core_functions/color/channel/a98-rgb.hrx new file mode 100644 index 0000000000..0af8bc0856 --- /dev/null +++ b/spec/core_functions/color/channel/a98-rgb.hrx @@ -0,0 +1,63 @@ +<===> local/red/input.scss +@use 'sass:color'; +a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "red")} + +<===> local/red/output.css +a { + b: 0.2; +} + +<===> +================================================================================ +<===> local/green/input.scss +@use 'sass:color'; +a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "green")} + +<===> local/green/output.css +a { + b: 0.5; +} + +<===> +================================================================================ +<===> local/blue/input.scss +@use 'sass:color'; +a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "blue")} + +<===> local/blue/output.css +a { + b: 0.8; +} + +<===> +================================================================================ +<===> foreign/red/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red", $space: a98-rgb)} + +<===> foreign/red/output.css +a { + b: 0.9363244101; +} + +<===> +================================================================================ +<===> foreign/green/input.scss +@use "sass:color"; +a {b: color.channel(pink, "green", $space: a98-rgb)} + +<===> foreign/green/output.css +a { + b: 0.7473920857; +} + +<===> +================================================================================ +<===> foreign/blue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "blue", $space: a98-rgb)} + +<===> foreign/blue/output.css +a { + b: 0.7893042668; +} diff --git a/spec/core_functions/color/channel/display-p3.hrx b/spec/core_functions/color/channel/display-p3.hrx new file mode 100644 index 0000000000..4d9af63766 --- /dev/null +++ b/spec/core_functions/color/channel/display-p3.hrx @@ -0,0 +1,63 @@ +<===> local/red/input.scss +@use 'sass:color'; +a {b: color.channel(color(display-p3 0.2 0.5 0.8), "red")} + +<===> local/red/output.css +a { + b: 0.2; +} + +<===> +================================================================================ +<===> local/green/input.scss +@use 'sass:color'; +a {b: color.channel(color(display-p3 0.2 0.5 0.8), "green")} + +<===> local/green/output.css +a { + b: 0.5; +} + +<===> +================================================================================ +<===> local/blue/input.scss +@use 'sass:color'; +a {b: color.channel(color(display-p3 0.2 0.5 0.8), "blue")} + +<===> local/blue/output.css +a { + b: 0.8; +} + +<===> +================================================================================ +<===> foreign/red/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red", $space: display-p3)} + +<===> foreign/red/output.css +a { + b: 0.9621487118; +} + +<===> +================================================================================ +<===> foreign/green/input.scss +@use "sass:color"; +a {b: color.channel(pink, "green", $space: display-p3)} + +<===> foreign/green/output.css +a { + b: 0.7628803605; +} + +<===> +================================================================================ +<===> foreign/blue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "blue", $space: display-p3)} + +<===> foreign/blue/output.css +a { + b: 0.7971503319; +} diff --git a/spec/core_functions/color/channel/error.hrx b/spec/core_functions/color/channel/error.hrx new file mode 100644 index 0000000000..081e614000 --- /dev/null +++ b/spec/core_functions/color/channel/error.hrx @@ -0,0 +1,159 @@ +<===> too_few_args/input.scss +@use "sass:color"; +a {b: color.channel(pink)} + +<===> too_few_args/error +Error: Missing argument $channel. + ,--> input.scss +2 | a {b: color.channel(pink)} + | ^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function channel($color, $channel, $space: null) { + | ======================================= declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red", rgb, "red")} + +<===> too_many_args/error +Error: Only 3 arguments allowed, but 4 were passed. + ,--> input.scss +2 | a {b: color.channel(pink, "red", rgb, "red")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function channel($color, $channel, $space: null) { + | ======================================= declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/color/input.scss +@use "sass:color"; +a {b: color.channel("pink", "red")} + +<===> type/color/error +Error: $color: "pink" is not a color. + , +2 | a {b: color.channel("pink", "red")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/channel/input.scss +@use "sass:color"; +a {b: color.channel(pink, red)} + +<===> type/channel/error +Error: $channel: red is not a string. + , +2 | a {b: color.channel(pink, red)} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/space/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red", red)} + +<===> type/space/error +Error: $space: red is not a string. + , +2 | a {b: color.channel(pink, "red", red)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> channel/unquoted/input.scss +@use "sass:color"; +a {b: color.channel(hsl(50deg 50% 50%), hue)} + +<===> channel/unquoted/error +Error: $channel: Expected hue to be a quoted string. + , +2 | a {b: color.channel(hsl(50deg 50% 50%), hue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> channel/wrong_space/input.scss +@use "sass:color"; +a {b: color.channel(red, "hue")} + +<===> channel/wrong_space/error +Error: $channel: Color red has no channel named hue. + , +2 | a {b: color.channel(red, "hue")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> channel/wrong_case/input.scss +@use "sass:color"; +a {b: color.channel(red, "RED")} + +<===> channel/wrong_case/error +Error: $channel: Color red has no channel named RED. + , +2 | a {b: color.channel(red, "RED")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> channel/unknown/input.scss +@use "sass:color"; +a {b: color.channel(red, "foo")} + +<===> channel/unknown/error +Error: $channel: Color red has no channel named foo. + , +2 | a {b: color.channel(red, "foo")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/quoted/input.scss +@use "sass:color"; +a {b: color.channel(red, "hue", $space: "hsl")} + +<===> space/quoted/error +Error: $space: Expected "hsl" to be an unquoted string. + , +2 | a {b: color.channel(red, "hue", $space: "hsl")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/unknown/input.scss +@use "sass:color"; +a {b: color.channel(red, "hue", $space: "foo")} + +<===> space/unknown/error +Error: $space: Expected "foo" to be an unquoted string. + , +2 | a {b: color.channel(red, "hue", $space: "foo")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/channel/hsl.hrx b/spec/core_functions/color/channel/hsl.hrx new file mode 100644 index 0000000000..fd85220df1 --- /dev/null +++ b/spec/core_functions/color/channel/hsl.hrx @@ -0,0 +1,74 @@ +<===> local/hue/input.scss +@use 'sass:color'; +a {b: color.channel(hsl(10 40% 60%), "hue")} + +<===> local/hue/output.css +a { + b: 10deg; +} + +<===> +================================================================================ +<===> local/saturation/input.scss +@use 'sass:color'; +a {b: color.channel(hsl(10deg 40% 60%), "saturation")} + +<===> local/saturation/output.css +a { + b: 40%; +} + +<===> +================================================================================ +<===> local/lightness/input.scss +@use 'sass:color'; +a {b: color.channel(hsl(10deg 40% 60%), "lightness")} + +<===> local/lightness/output.css +a { + b: 60%; +} + +<===> +================================================================================ +<===> local/normalized/hue/input.scss +@use 'sass:color'; +a {b: color.channel(hsl(540 40% 60%), "hue")} + +<===> local/normalized/hue/output.css +a { + b: 180deg; +} + +<===> +================================================================================ +<===> foreign/hue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "hue", $space: hsl)} + +<===> foreign/hue/output.css +a { + b: 349.5238095238deg; +} + +<===> +================================================================================ +<===> foreign/saturation/input.scss +@use "sass:color"; +a {b: color.channel(pink, "saturation", $space: hsl)} + +<===> foreign/saturation/output.css +a { + b: 100%; +} + +<===> +================================================================================ +<===> foreign/lightness/input.scss +@use "sass:color"; +a {b: color.channel(pink, "lightness", $space: hsl)} + +<===> foreign/lightness/output.css +a { + b: 87.6470588235%; +} diff --git a/spec/core_functions/color/channel/hwb.hrx b/spec/core_functions/color/channel/hwb.hrx new file mode 100644 index 0000000000..a88c874a32 --- /dev/null +++ b/spec/core_functions/color/channel/hwb.hrx @@ -0,0 +1,85 @@ +<===> local/hue/input.scss +@use 'sass:color'; +a {b: color.channel(hwb(10 30% 40%), "hue")} + +<===> local/hue/output.css +a { + b: 10deg; +} + +<===> +================================================================================ +<===> local/whiteness/input.scss +@use 'sass:color'; +a {b: color.channel(hwb(10deg 30% 40%), "whiteness")} + +<===> local/whiteness/output.css +a { + b: 30%; +} + +<===> +================================================================================ +<===> local/blackness/input.scss +@use 'sass:color'; +a {b: color.channel(hwb(10deg 30% 40%), "blackness")} + +<===> local/blackness/output.css +a { + b: 40%; +} + +<===> +================================================================================ +<===> local/normalized/whiteness/input.scss +@use 'sass:color'; +a {b: color.channel(hwb(10deg 70% 50%), "whiteness")} + +<===> local/normalized/whiteness/output.css +a { + b: 58.3333333333%; +} + +<===> +================================================================================ +<===> local/normalized/blackness/input.scss +@use 'sass:color'; +a {b: color.channel(hwb(10deg 70% 50%), "blackness")} + +<===> local/normalized/blackness/output.css +a { + b: 41.6666666667%; +} + +<===> +================================================================================ +<===> foreign/hue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "hue", $space: hwb)} + +<===> foreign/hue/output.css +a { + b: 349.5238095238deg; +} + +<===> +================================================================================ +<===> foreign/whiteness/input.scss +@use "sass:color"; +a {b: color.channel(pink, "whiteness", $space: hwb)} + +<===> foreign/whiteness/output.css +a { + b: 75.2941176471%; +} + +<===> +================================================================================ +<===> foreign/blackness/input.scss +@use "sass:color"; +a {b: color.channel(pink, "blackness", $space: hwb)} + +<===> foreign/blackness/output.css +a { + b: 0%; +} diff --git a/spec/core_functions/color/channel/lab.hrx b/spec/core_functions/color/channel/lab.hrx new file mode 100644 index 0000000000..aca18b5ae0 --- /dev/null +++ b/spec/core_functions/color/channel/lab.hrx @@ -0,0 +1,63 @@ +<===> local/lightness/input.scss +@use 'sass:color'; +a {b: color.channel(lab(50 -150 30), "lightness")} + +<===> local/lightness/output.css +a { + b: 50%; +} + +<===> +================================================================================ +<===> local/a/input.scss +@use 'sass:color'; +a {b: color.channel(lab(50% -150 30), "a")} + +<===> local/a/output.css +a { + b: -150; +} + +<===> +================================================================================ +<===> local/b/input.scss +@use 'sass:color'; +a {b: color.channel(lab(50% -150 30), "b")} + +<===> local/b/output.css +a { + b: 30; +} + +<===> +================================================================================ +<===> foreign/lightness/input.scss +@use "sass:color"; +a {b: color.channel(pink, "lightness", $space: lab)} + +<===> foreign/lightness/output.css +a { + b: 83.7872528656%; +} + +<===> +================================================================================ +<===> foreign/a/input.scss +@use "sass:color"; +a {b: color.channel(pink, "a", $space: lab)} + +<===> foreign/a/output.css +a { + b: 24.4367702881; +} + +<===> +================================================================================ +<===> foreign/b/input.scss +@use "sass:color"; +a {b: color.channel(pink, "b", $space: lab)} + +<===> foreign/b/output.css +a { + b: 3.7594237161; +} diff --git a/spec/core_functions/color/channel/lch.hrx b/spec/core_functions/color/channel/lch.hrx new file mode 100644 index 0000000000..1df44f8161 --- /dev/null +++ b/spec/core_functions/color/channel/lch.hrx @@ -0,0 +1,63 @@ +<===> local/lightness/input.scss +@use 'sass:color'; +a {b: color.channel(lch(50 80% 0.5turn), "lightness")} + +<===> local/lightness/output.css +a { + b: 50%; +} + +<===> +================================================================================ +<===> local/a/input.scss +@use 'sass:color'; +a {b: color.channel(lch(50 80% 0.5turn), "chroma")} + +<===> local/a/output.css +a { + b: 120; +} + +<===> +================================================================================ +<===> local/b/input.scss +@use 'sass:color'; +a {b: color.channel(lch(50 80% 0.5turn), "hue")} + +<===> local/b/output.css +a { + b: 180deg; +} + +<===> +================================================================================ +<===> foreign/lightness/input.scss +@use "sass:color"; +a {b: color.channel(pink, "lightness", $space: lch)} + +<===> foreign/lightness/output.css +a { + b: 83.7872528656%; +} + +<===> +================================================================================ +<===> foreign/chroma/input.scss +@use "sass:color"; +a {b: color.channel(pink, "chroma", $space: lch)} + +<===> foreign/chroma/output.css +a { + b: 24.7242595195; +} + +<===> +================================================================================ +<===> foreign/hue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "hue", $space: lch)} + +<===> foreign/hue/output.css +a { + b: 8.7459803895deg; +} diff --git a/spec/core_functions/color/channel/missing.hrx b/spec/core_functions/color/channel/missing.hrx new file mode 100644 index 0000000000..cfe9a30966 --- /dev/null +++ b/spec/core_functions/color/channel/missing.hrx @@ -0,0 +1,9 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.channel(rgb(255 none 255), "green")} + +<===> output.css +a { + b: 0; +} + diff --git a/spec/core_functions/color/channel/named.hrx b/spec/core_functions/color/channel/named.hrx new file mode 100644 index 0000000000..a2e28b8972 --- /dev/null +++ b/spec/core_functions/color/channel/named.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use "sass:color"; +a {b: color.channel($color: pink, $channel: "hue", $space: hsl)} + +<===> output.css +a { + b: 349.5238095238deg; +} diff --git a/spec/core_functions/color/channel/oklab.hrx b/spec/core_functions/color/channel/oklab.hrx new file mode 100644 index 0000000000..5ce02231a6 --- /dev/null +++ b/spec/core_functions/color/channel/oklab.hrx @@ -0,0 +1,63 @@ +<===> local/lightness/input.scss +@use 'sass:color'; +a {b: color.channel(oklab(0.5 -1 50%), "lightness")} + +<===> local/lightness/output.css +a { + b: 50%; +} + +<===> +================================================================================ +<===> local/a/input.scss +@use 'sass:color'; +a {b: color.channel(oklab(0.5 -1 50%), "a")} + +<===> local/a/output.css +a { + b: -1; +} + +<===> +================================================================================ +<===> local/b/input.scss +@use 'sass:color'; +a {b: color.channel(oklab(0.5 -1 50%), "b")} + +<===> local/b/output.css +a { + b: 0.2; +} + +<===> +================================================================================ +<===> foreign/lightness/input.scss +@use "sass:color"; +a {b: color.channel(pink, "lightness", $space: oklab)} + +<===> foreign/lightness/output.css +a { + b: 86.7738445294%; +} + +<===> +================================================================================ +<===> foreign/a/input.scss +@use "sass:color"; +a {b: color.channel(pink, "a", $space: oklab)} + +<===> foreign/a/output.css +a { + b: 0.0729803698; +} + +<===> +================================================================================ +<===> foreign/b/input.scss +@use "sass:color"; +a {b: color.channel(pink, "b", $space: oklab)} + +<===> foreign/b/output.css +a { + b: 0.0090714488; +} diff --git a/spec/core_functions/color/channel/oklch.hrx b/spec/core_functions/color/channel/oklch.hrx new file mode 100644 index 0000000000..2620a130a5 --- /dev/null +++ b/spec/core_functions/color/channel/oklch.hrx @@ -0,0 +1,63 @@ +<===> local/lightness/input.scss +@use 'sass:color'; +a {b: color.channel(oklch(0.3 80% 30), "lightness")} + +<===> local/lightness/output.css +a { + b: 30%; +} + +<===> +================================================================================ +<===> local/a/input.scss +@use 'sass:color'; +a {b: color.channel(oklch(0.3 80% 30), "chroma")} + +<===> local/a/output.css +a { + b: 0.32; +} + +<===> +================================================================================ +<===> local/b/input.scss +@use 'sass:color'; +a {b: color.channel(oklch(0.3 80% 30), "hue")} + +<===> local/b/output.css +a { + b: 30deg; +} + +<===> +================================================================================ +<===> foreign/lightness/input.scss +@use "sass:color"; +a {b: color.channel(pink, "lightness", $space: oklch)} + +<===> foreign/lightness/output.css +a { + b: 86.7738445294%; +} + +<===> +================================================================================ +<===> foreign/chroma/input.scss +@use "sass:color"; +a {b: color.channel(pink, "chroma", $space: oklch)} + +<===> foreign/chroma/output.css +a { + b: 0.0735419986; +} + +<===> +================================================================================ +<===> foreign/hue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "hue", $space: oklch)} + +<===> foreign/hue/output.css +a { + b: 7.0855142734deg; +} diff --git a/spec/core_functions/color/channel/positional.hrx b/spec/core_functions/color/channel/positional.hrx new file mode 100644 index 0000000000..212bad64af --- /dev/null +++ b/spec/core_functions/color/channel/positional.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.channel(oklch(60% 70% 0.6turn), "red", rgb)} + +<===> output.css +a { + b: -143.1028884453; +} diff --git a/spec/core_functions/color/channel/prophoto-rgb.hrx b/spec/core_functions/color/channel/prophoto-rgb.hrx new file mode 100644 index 0000000000..32e7116738 --- /dev/null +++ b/spec/core_functions/color/channel/prophoto-rgb.hrx @@ -0,0 +1,63 @@ +<===> local/red/input.scss +@use 'sass:color'; +a {b: color.channel(color(prophoto-rgb 0.2 0.5 0.8), "red")} + +<===> local/red/output.css +a { + b: 0.2; +} + +<===> +================================================================================ +<===> local/green/input.scss +@use 'sass:color'; +a {b: color.channel(color(prophoto-rgb 0.2 0.5 0.8), "green")} + +<===> local/green/output.css +a { + b: 0.5; +} + +<===> +================================================================================ +<===> local/blue/input.scss +@use 'sass:color'; +a {b: color.channel(color(prophoto-rgb 0.2 0.5 0.8), "blue")} + +<===> local/blue/output.css +a { + b: 0.8; +} + +<===> +================================================================================ +<===> foreign/red/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red", $space: prophoto-rgb)} + +<===> foreign/red/output.css +a { + b: 0.8755603733; +} + +<===> +================================================================================ +<===> foreign/green/input.scss +@use "sass:color"; +a {b: color.channel(pink, "green", $space: prophoto-rgb)} + +<===> foreign/green/output.css +a { + b: 0.7357592889; +} + +<===> +================================================================================ +<===> foreign/blue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "blue", $space: prophoto-rgb)} + +<===> foreign/blue/output.css +a { + b: 0.7499576055; +} diff --git a/spec/core_functions/color/channel/rec2020.hrx b/spec/core_functions/color/channel/rec2020.hrx new file mode 100644 index 0000000000..1daa6eecc7 --- /dev/null +++ b/spec/core_functions/color/channel/rec2020.hrx @@ -0,0 +1,63 @@ +<===> local/red/input.scss +@use 'sass:color'; +a {b: color.channel(color(rec2020 0.2 0.5 0.8), "red")} + +<===> local/red/output.css +a { + b: 0.2; +} + +<===> +================================================================================ +<===> local/green/input.scss +@use 'sass:color'; +a {b: color.channel(color(rec2020 0.2 0.5 0.8), "green")} + +<===> local/green/output.css +a { + b: 0.5; +} + +<===> +================================================================================ +<===> local/blue/input.scss +@use 'sass:color'; +a {b: color.channel(color(rec2020 0.2 0.5 0.8), "blue")} + +<===> local/blue/output.css +a { + b: 0.8; +} + +<===> +================================================================================ +<===> foreign/red/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red", $space: rec2020)} + +<===> foreign/red/output.css +a { + b: 0.9098509852; +} + +<===> +================================================================================ +<===> foreign/green/input.scss +@use "sass:color"; +a {b: color.channel(pink, "green", $space: rec2020)} + +<===> foreign/green/output.css +a { + b: 0.747938727; +} + +<===> +================================================================================ +<===> foreign/blue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "blue", $space: rec2020)} + +<===> foreign/blue/output.css +a { + b: 0.7726929727; +} diff --git a/spec/core_functions/color/channel/rgb.hrx b/spec/core_functions/color/channel/rgb.hrx new file mode 100644 index 0000000000..dfc8674ff4 --- /dev/null +++ b/spec/core_functions/color/channel/rgb.hrx @@ -0,0 +1,63 @@ +<===> local/red/input.scss +@use 'sass:color'; +a {b: color.channel(#abcdef, "red")} + +<===> local/red/output.css +a { + b: 171; +} + +<===> +================================================================================ +<===> local/green/input.scss +@use 'sass:color'; +a {b: color.channel(#abcdef, "green")} + +<===> local/green/output.css +a { + b: 205; +} + +<===> +================================================================================ +<===> local/blue/input.scss +@use 'sass:color'; +a {b: color.channel(#abcdef, "blue")} + +<===> local/blue/output.css +a { + b: 239; +} + +<===> +================================================================================ +<===> foreign/red/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red")} + +<===> foreign/red/output.css +a { + b: 255; +} + +<===> +================================================================================ +<===> foreign/green/input.scss +@use "sass:color"; +a {b: color.channel(pink, "green")} + +<===> foreign/green/output.css +a { + b: 192; +} + +<===> +================================================================================ +<===> foreign/blue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "blue")} + +<===> foreign/blue/output.css +a { + b: 203; +} diff --git a/spec/core_functions/color/channel/srgb-linear.hrx b/spec/core_functions/color/channel/srgb-linear.hrx new file mode 100644 index 0000000000..ab8863b11d --- /dev/null +++ b/spec/core_functions/color/channel/srgb-linear.hrx @@ -0,0 +1,63 @@ +<===> local/red/input.scss +@use 'sass:color'; +a {b: color.channel(color(srgb-linear 0.2 0.5 0.8), "red")} + +<===> local/red/output.css +a { + b: 0.2; +} + +<===> +================================================================================ +<===> local/green/input.scss +@use 'sass:color'; +a {b: color.channel(color(srgb-linear 0.2 0.5 0.8), "green")} + +<===> local/green/output.css +a { + b: 0.5; +} + +<===> +================================================================================ +<===> local/blue/input.scss +@use 'sass:color'; +a {b: color.channel(color(srgb-linear 0.2 0.5 0.8), "blue")} + +<===> local/blue/output.css +a { + b: 0.8; +} + +<===> +================================================================================ +<===> foreign/red/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red", $space: srgb-linear)} + +<===> foreign/red/output.css +a { + b: 1; +} + +<===> +================================================================================ +<===> foreign/green/input.scss +@use "sass:color"; +a {b: color.channel(pink, "green", $space: srgb-linear)} + +<===> foreign/green/output.css +a { + b: 0.5271151257; +} + +<===> +================================================================================ +<===> foreign/blue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "blue", $space: srgb-linear)} + +<===> foreign/blue/output.css +a { + b: 0.5972017884; +} diff --git a/spec/core_functions/color/channel/srgb.hrx b/spec/core_functions/color/channel/srgb.hrx new file mode 100644 index 0000000000..867c9791b1 --- /dev/null +++ b/spec/core_functions/color/channel/srgb.hrx @@ -0,0 +1,63 @@ +<===> local/red/input.scss +@use 'sass:color'; +a {b: color.channel(color(srgb 0.2 0.5 0.8), "red")} + +<===> local/red/output.css +a { + b: 0.2; +} + +<===> +================================================================================ +<===> local/green/input.scss +@use 'sass:color'; +a {b: color.channel(color(srgb 0.2 0.5 0.8), "green")} + +<===> local/green/output.css +a { + b: 0.5; +} + +<===> +================================================================================ +<===> local/blue/input.scss +@use 'sass:color'; +a {b: color.channel(color(srgb 0.2 0.5 0.8), "blue")} + +<===> local/blue/output.css +a { + b: 0.8; +} + +<===> +================================================================================ +<===> foreign/red/input.scss +@use "sass:color"; +a {b: color.channel(pink, "red", $space: srgb)} + +<===> foreign/red/output.css +a { + b: 1; +} + +<===> +================================================================================ +<===> foreign/green/input.scss +@use "sass:color"; +a {b: color.channel(pink, "green", $space: srgb)} + +<===> foreign/green/output.css +a { + b: 0.7529411765; +} + +<===> +================================================================================ +<===> foreign/blue/input.scss +@use "sass:color"; +a {b: color.channel(pink, "blue", $space: srgb)} + +<===> foreign/blue/output.css +a { + b: 0.7960784314; +} diff --git a/spec/core_functions/color/channel/xyz-d50.hrx b/spec/core_functions/color/channel/xyz-d50.hrx new file mode 100644 index 0000000000..940553329c --- /dev/null +++ b/spec/core_functions/color/channel/xyz-d50.hrx @@ -0,0 +1,63 @@ +<===> local/x/input.scss +@use 'sass:color'; +a {b: color.channel(color(xyz-d50 -0.2 0.5 1.8), "x")} + +<===> local/x/output.css +a { + b: -0.2; +} + +<===> +================================================================================ +<===> local/y/input.scss +@use 'sass:color'; +a {b: color.channel(color(xyz-d50 -0.2 0.5 1.8), "y")} + +<===> local/y/output.css +a { + b: 0.5; +} + +<===> +================================================================================ +<===> local/z/input.scss +@use 'sass:color'; +a {b: color.channel(color(xyz-d50 -0.2 0.5 1.8), "z")} + +<===> local/z/output.css +a { + b: 1.8; +} + +<===> +================================================================================ +<===> foreign/x/input.scss +@use "sass:color"; +a {b: color.channel(pink, "x", $space: xyz-d50)} + +<===> foreign/x/output.css +a { + b: 0.7245316215; +} + +<===> +================================================================================ +<===> foreign/y/input.scss +@use "sass:color"; +a {b: color.channel(pink, "y", $space: xyz-d50)} + +<===> foreign/y/output.css +a { + b: 0.636577424; +} + +<===> +================================================================================ +<===> foreign/z/input.scss +@use "sass:color"; +a {b: color.channel(pink, "z", $space: xyz-d50)} + +<===> foreign/z/output.css +a { + b: 0.4915583688; +} diff --git a/spec/core_functions/color/channel/xyz.hrx b/spec/core_functions/color/channel/xyz.hrx new file mode 100644 index 0000000000..b00abf32da --- /dev/null +++ b/spec/core_functions/color/channel/xyz.hrx @@ -0,0 +1,63 @@ +<===> local/x/input.scss +@use 'sass:color'; +a {b: color.channel(color(xyz-d65 -0.2 0.5 1.8), "x")} + +<===> local/x/output.css +a { + b: -0.2; +} + +<===> +================================================================================ +<===> local/y/input.scss +@use 'sass:color'; +a {b: color.channel(color(xyz-d65 -0.2 0.5 1.8), "y")} + +<===> local/y/output.css +a { + b: 0.5; +} + +<===> +================================================================================ +<===> local/z/input.scss +@use 'sass:color'; +a {b: color.channel(color(xyz-d65 -0.2 0.5 1.8), "z")} + +<===> local/z/output.css +a { + b: 1.8; +} + +<===> +================================================================================ +<===> foreign/x/input.scss +@use "sass:color"; +a {b: color.channel(pink, "x", $space: xyz)} + +<===> foreign/x/output.css +a { + b: 0.7086623629; +} + +<===> +================================================================================ +<===> foreign/y/input.scss +@use "sass:color"; +a {b: color.channel(pink, "y", $space: xyz)} + +<===> foreign/y/output.css +a { + b: 0.6327286137; +} + +<===> +================================================================================ +<===> foreign/z/input.scss +@use "sass:color"; +a {b: color.channel(pink, "z", $space: xyz)} + +<===> foreign/z/output.css +a { + b: 0.6498196913; +} From 741f09d4851984a2bdd7e11589ab4fefb7b0590e Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 26 Apr 2024 14:25:47 -0700 Subject: [PATCH 31/45] [Color 4] Add tests for `is-missing()` (#1981) This also adds a missing case-sensitivity test for `is-powerless()`. See sass/sass#3851 --- spec/core_functions/color/is_missing.hrx | 235 ++++++++++++++++++ .../color/is_powerless/error.hrx | 14 ++ 2 files changed, 249 insertions(+) create mode 100644 spec/core_functions/color/is_missing.hrx diff --git a/spec/core_functions/color/is_missing.hrx b/spec/core_functions/color/is_missing.hrx new file mode 100644 index 0000000000..44b5335759 --- /dev/null +++ b/spec/core_functions/color/is_missing.hrx @@ -0,0 +1,235 @@ +<===> false/explicit/input.scss +@use 'sass:color'; +a {b: color.is-missing(#abcdef, "red")} + +<===> false/explicit/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/not_powerless/converted/non_legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(color.to-space(#aaaaab, lch), "hue")} + +<===> false/not_powerless/converted/non_legacy/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/not_powerless/converted/legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(color.to-space(#aaaaab, hsl), "hue")} + +<===> false/not_powerless/converted/legacy/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/not_powerless/direct/non_legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(lch(50% 1% 0deg), "hue")} + +<===> false/not_powerless/direct/non_legacy/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/not_powerless/direct/legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(hsl(0deg 50% 1%), "hue")} + +<===> false/not_powerless/direct/legacy/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/powerless/direct/non_legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(lch(50% 0% 0deg), "hue")} + +<===> false/powerless/direct/non_legacy/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/powerless/direct/legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(hsl(0deg 50% 0%), "hue")} + +<===> false/powerless/direct/legacy/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/powerless/converted/legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(color.to-space(#aaaaaa, hsl), "hue")} + +<===> false/powerless/converted/legacy/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> true/explicit/non_legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(lab(50% 30 none), "b")} + +<===> true/explicit/non_legacy/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/explicit/legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(rgb(none 30 100), "red")} + +<===> true/explicit/legacy/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/powerless/converted/non_legacy/input.scss +@use 'sass:color'; +a {b: color.is-missing(color.to-space(#aaaaaa, lch), "hue")} + +<===> true/powerless/converted/non_legacy/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a {b: color.is-missing($color: black, $channel: "red")} + +<===> named/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> error/too_few_args/input.scss +@use 'sass:color'; +a {b: color.is-missing(black)} + +<===> error/too_few_args/error +Error: Missing argument $channel. + ,--> input.scss +2 | a {b: color.is-missing(black)} + | ^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function is-missing($color, $channel) { + | ============================ declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/too_many_args/input.scss +@use 'sass:color'; +a {b: color.is-missing(black, "red", rgb)} + +<===> error/too_many_args/error +Error: Only 2 arguments allowed, but 3 were passed. + ,--> input.scss +2 | a {b: color.is-missing(black, "red", rgb)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function is-missing($color, $channel) { + | ============================ declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/type/color/input.scss +@use 'sass:color'; +a {b: color.is-missing("black", "red")} + +<===> error/type/color/error +Error: $color: "black" is not a color. + , +2 | a {b: color.is-missing("black", "red")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/type/channel/input.scss +@use 'sass:color'; +a {b: color.is-missing(black, red)} + +<===> error/type/channel/error +Error: $channel: red is not a string. + , +2 | a {b: color.is-missing(black, red)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/channel/wrong_space/input.scss +@use 'sass:color'; +a {b: color.is-missing(black, "hue")} + +<===> error/channel/wrong_space/error +Error: $channel: Color black doesn't have a channel named "hue". + , +2 | a {b: color.is-missing(black, "hue")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/channel/unquoted/input.scss +@use 'sass:color'; +a {b: color.is-missing(hsl(0deg 50% 50%), hue)} + +<===> error/channel/unquoted/error +Error: $channel: Expected hue to be a quoted string. + , +2 | a {b: color.is-missing(hsl(0deg 50% 50%), hue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/channel/wrong_case/input.scss +@use 'sass:color'; +a {b: color.is-missing(black, "RED")} + +<===> error/channel/wrong_case/error +Error: $channel: Color black doesn't have a channel named "RED". + , +2 | a {b: color.is-missing(black, "RED")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/is_powerless/error.hrx b/spec/core_functions/color/is_powerless/error.hrx index 106522cad9..be2c06c401 100644 --- a/spec/core_functions/color/is_powerless/error.hrx +++ b/spec/core_functions/color/is_powerless/error.hrx @@ -116,6 +116,20 @@ Error: $channel: Color black doesn't have a channel named "hue". ' input.scss 2:7 root stylesheet +<===> +================================================================================ +<===> channel/wrong_case/input.scss +@use 'sass:color'; +a {b: color.is-powerless(black, "RED")} + +<===> channel/wrong_case/error +Error: $channel: Color black doesn't have a channel named "RED". + , +2 | a {b: color.is-powerless(black, "RED")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> space/quoted/input.scss From 28760266ac3c94b91f365b621972e80358282daf Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Thu, 2 May 2024 16:53:21 -0700 Subject: [PATCH 32/45] [Color 4] Update specs for `color.change()` (#1983) --- spec/core_functions/color/change/a98_rgb.hrx | 129 ++++++ .../color/change/display_p3.hrx | 129 ++++++ .../{change_color => change}/error/args.hrx | 21 +- .../color/change/error/bounds.hrx | 39 ++ .../change/error/incompatible_channel.hrx | 39 ++ .../error/mixed_formats.hrx | 42 +- .../color/change/error/space.hrx | 25 ++ .../{change_color => change}/error/type.hrx | 84 ++-- .../color/change/error/units/a98_rgb.hrx | 39 ++ .../color/change/error/units/display_p3.hrx | 39 ++ .../units.hrx => change/error/units/hwb.hrx} | 29 +- .../color/change/error/units/lab.hrx | 39 ++ .../color/change/error/units/lch.hrx | 39 ++ .../color/change/error/units/oklab.hrx | 39 ++ .../color/change/error/units/oklch.hrx | 39 ++ .../color/change/error/units/prophoto_rgb.hrx | 39 ++ .../color/change/error/units/rec2020.hrx | 39 ++ .../color/change/error/units/srgb.hrx | 39 ++ .../color/change/error/units/srgb_linear.hrx | 39 ++ .../color/change/error/units/xyz.hrx | 39 ++ .../color/change/error/units/xyz_d50.hrx | 39 ++ spec/core_functions/color/change/global.hrx | 17 + spec/core_functions/color/change/hsl.hrx | 425 ++++++++++++++++++ .../color/{change_color => change}/hwb.hrx | 47 +- spec/core_functions/color/change/lab.hrx | 129 ++++++ spec/core_functions/color/change/lch.hrx | 140 ++++++ .../color/change/no_channels.hrx | 19 + spec/core_functions/color/change/no_space.hrx | 131 ++++++ spec/core_functions/color/change/oklab.hrx | 129 ++++++ spec/core_functions/color/change/oklch.hrx | 140 ++++++ .../color/change/prophoto_rgb.hrx | 129 ++++++ spec/core_functions/color/change/rec2020.hrx | 129 ++++++ .../color/{change_color => change}/rgb.hrx | 81 +++- spec/core_functions/color/change/srgb.hrx | 129 ++++++ .../color/change/srgb_linear.hrx | 129 ++++++ spec/core_functions/color/change/xyz.hrx | 129 ++++++ spec/core_functions/color/change/xyz_d50.hrx | 129 ++++++ .../color/change_color/error/bounds.hrx | 342 -------------- .../core_functions/color/change_color/hsl.hrx | 187 -------- .../color/change_color/no_rgb_hsl.hrx | 57 --- .../color/change_color/units.hrx | 218 --------- 41 files changed, 2939 insertions(+), 902 deletions(-) create mode 100644 spec/core_functions/color/change/a98_rgb.hrx create mode 100644 spec/core_functions/color/change/display_p3.hrx rename spec/core_functions/color/{change_color => change}/error/args.hrx (68%) create mode 100644 spec/core_functions/color/change/error/bounds.hrx create mode 100644 spec/core_functions/color/change/error/incompatible_channel.hrx rename spec/core_functions/color/{change_color => change}/error/mixed_formats.hrx (68%) create mode 100644 spec/core_functions/color/change/error/space.hrx rename spec/core_functions/color/{change_color => change}/error/type.hrx (57%) create mode 100644 spec/core_functions/color/change/error/units/a98_rgb.hrx create mode 100644 spec/core_functions/color/change/error/units/display_p3.hrx rename spec/core_functions/color/{change_color/error/units.hrx => change/error/units/hwb.hrx} (61%) create mode 100644 spec/core_functions/color/change/error/units/lab.hrx create mode 100644 spec/core_functions/color/change/error/units/lch.hrx create mode 100644 spec/core_functions/color/change/error/units/oklab.hrx create mode 100644 spec/core_functions/color/change/error/units/oklch.hrx create mode 100644 spec/core_functions/color/change/error/units/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/change/error/units/rec2020.hrx create mode 100644 spec/core_functions/color/change/error/units/srgb.hrx create mode 100644 spec/core_functions/color/change/error/units/srgb_linear.hrx create mode 100644 spec/core_functions/color/change/error/units/xyz.hrx create mode 100644 spec/core_functions/color/change/error/units/xyz_d50.hrx create mode 100644 spec/core_functions/color/change/global.hrx create mode 100644 spec/core_functions/color/change/hsl.hrx rename spec/core_functions/color/{change_color => change}/hwb.hrx (64%) create mode 100644 spec/core_functions/color/change/lab.hrx create mode 100644 spec/core_functions/color/change/lch.hrx create mode 100644 spec/core_functions/color/change/no_channels.hrx create mode 100644 spec/core_functions/color/change/no_space.hrx create mode 100644 spec/core_functions/color/change/oklab.hrx create mode 100644 spec/core_functions/color/change/oklch.hrx create mode 100644 spec/core_functions/color/change/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/change/rec2020.hrx rename spec/core_functions/color/{change_color => change}/rgb.hrx (58%) create mode 100644 spec/core_functions/color/change/srgb.hrx create mode 100644 spec/core_functions/color/change/srgb_linear.hrx create mode 100644 spec/core_functions/color/change/xyz.hrx create mode 100644 spec/core_functions/color/change/xyz_d50.hrx delete mode 100644 spec/core_functions/color/change_color/error/bounds.hrx delete mode 100644 spec/core_functions/color/change_color/hsl.hrx delete mode 100644 spec/core_functions/color/change_color/no_rgb_hsl.hrx delete mode 100644 spec/core_functions/color/change_color/units.hrx diff --git a/spec/core_functions/color/change/a98_rgb.hrx b/spec/core_functions/color/change/a98_rgb.hrx new file mode 100644 index 0000000000..df07bd4b50 --- /dev/null +++ b/spec/core_functions/color/change/a98_rgb.hrx @@ -0,0 +1,129 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(a98-rgb 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 50%)} + +<===> red/percent/output.css +a { + b: color(a98-rgb 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 1.2)} + +<===> red/out_of_range/output.css +a { + b: color(a98-rgb 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: 0.4)} + +<===> green/unitless/output.css +a { + b: color(a98-rgb 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(a98-rgb 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: -0.2)} + +<===> green/out_of_range/output.css +a { + b: color(a98-rgb 0.2 -0.2 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 0.5)} + +<===> blue/unitless/output.css +a { + b: color(a98-rgb 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 50%)} + +<===> blue/percent/output.css +a { + b: color(a98-rgb 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 100)} + +<===> blue/out_of_range/output.css +a { + b: color(a98-rgb 0.2 0.5 100); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} + +<===> all/output.css +a { + b: color(a98-rgb 0.7 0.4 0.2); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(a98-rgb 0.5 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: color(a98-rgb 0.5 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/change/display_p3.hrx b/spec/core_functions/color/change/display_p3.hrx new file mode 100644 index 0000000000..a3129b4ceb --- /dev/null +++ b/spec/core_functions/color/change/display_p3.hrx @@ -0,0 +1,129 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(display-p3 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 50%)} + +<===> red/percent/output.css +a { + b: color(display-p3 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 1.2)} + +<===> red/out_of_range/output.css +a { + b: color(display-p3 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: 0.4)} + +<===> green/unitless/output.css +a { + b: color(display-p3 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(display-p3 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: -0.2)} + +<===> green/out_of_range/output.css +a { + b: color(display-p3 0.2 -0.2 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 0.5)} + +<===> blue/unitless/output.css +a { + b: color(display-p3 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 50%)} + +<===> blue/percent/output.css +a { + b: color(display-p3 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 100)} + +<===> blue/out_of_range/output.css +a { + b: color(display-p3 0.2 0.5 100); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} + +<===> all/output.css +a { + b: color(display-p3 0.7 0.4 0.2); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(display-p3 0.5 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: color(display-p3 0.5 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/change_color/error/args.hrx b/spec/core_functions/color/change/error/args.hrx similarity index 68% rename from spec/core_functions/color/change_color/error/args.hrx rename to spec/core_functions/color/change/error/args.hrx index f5772aea44..c78b5593bb 100644 --- a/spec/core_functions/color/change_color/error/args.hrx +++ b/spec/core_functions/color/change/error/args.hrx @@ -1,40 +1,43 @@ <===> too_few/input.scss -a {b: change-color()} +@use 'sass:color'; +a {b: color.change()} <===> too_few/error Error: Missing argument $color. ,--> input.scss -1 | a {b: change-color()} +2 | a {b: color.change()} | ^^^^^^^^^^^^^^ invocation ' ,--> sass:color 1 | @function change($color, $kwargs...) { | ========================== declaration ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> too_many/input.scss -a {b: change-color(red, 1)} +@use 'sass:color'; +a {b: color.change(red, 1)} <===> too_many/error Error: Only one positional argument is allowed. All other arguments must be passed by name. , -1 | a {b: change-color(red, 1)} +2 | a {b: color.change(red, 1)} | ^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> unknown/input.scss -a {b: change-color(red, $ambience: 10%)} +@use 'sass:color'; +a {b: color.change(red, $ambience: 10%)} <===> unknown/error Error: $ambience: Color space rgb doesn't have a channel with this name. , -1 | a {b: change-color(red, $ambience: 10%)} +2 | a {b: color.change(red, $ambience: 10%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/bounds.hrx b/spec/core_functions/color/change/error/bounds.hrx new file mode 100644 index 0000000000..855de13fd8 --- /dev/null +++ b/spec/core_functions/color/change/error/bounds.hrx @@ -0,0 +1,39 @@ +<===> alpha/too_low/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: -0.001)} + +<===> alpha/too_low/error +Error: $alpha: Expected -0.001 to be within 0 and 1. + , +2 | a {b: color.change(red, $alpha: -0.001)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> alpha/too_high/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: 1.001)} + +<===> alpha/too_high/error +Error: $alpha: Expected 1.001 to be within 0 and 1. + , +2 | a {b: color.change(red, $alpha: 1.001)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> alpha/unit/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: 150%)} + +<===> alpha/unit/error +Error: $alpha: Expected 150% to be within 0% and 100%. + , +2 | a {b: color.change(red, $alpha: 150%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/incompatible_channel.hrx b/spec/core_functions/color/change/error/incompatible_channel.hrx new file mode 100644 index 0000000000..e31e48ce1f --- /dev/null +++ b/spec/core_functions/color/change/error/incompatible_channel.hrx @@ -0,0 +1,39 @@ +<===> legacy_space/input.scss +@use 'sass:color'; +a {b: color.change(red, $chroma: 50%)} + +<===> legacy_space/error +Error: $chroma: Color space rgb doesn't have a channel with this name. + , +2 | a {b: color.change(red, $chroma: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> legacy_channel/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} + +<===> legacy_channel/error +Error: $whiteness: Color space srgb doesn't have a channel with this name. + , +2 | a {b: color.change(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> modern_both/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $chroma: 50%)} + +<===> modern_both/error +Error: $chroma: Color space srgb doesn't have a channel with this name. + , +2 | a {b: color.change(color(srgb 0.2 0.5 0.7), $chroma: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change_color/error/mixed_formats.hrx b/spec/core_functions/color/change/error/mixed_formats.hrx similarity index 68% rename from spec/core_functions/color/change_color/error/mixed_formats.hrx rename to spec/core_functions/color/change/error/mixed_formats.hrx index 6184c89c8a..b02876f20f 100644 --- a/spec/core_functions/color/change_color/error/mixed_formats.hrx +++ b/spec/core_functions/color/change/error/mixed_formats.hrx @@ -1,39 +1,42 @@ <===> red_and_hue/input.scss -a {b: change-color(red, $red: 1, $hue: 1)} +@use 'sass:color'; +a {b: color.change(red, $red: 1, $hue: 1)} <===> red_and_hue/error Error: $hue: Color space rgb doesn't have a channel with this name. , -1 | a {b: change-color(red, $red: 1, $hue: 1)} +2 | a {b: color.change(red, $red: 1, $hue: 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> green_and_saturation/input.scss -a {b: change-color(red, $green: 1, $saturation: 1%)} +@use 'sass:color'; +a {b: color.change(red, $green: 1, $saturation: 1%)} <===> green_and_saturation/error Error: $saturation: Color space rgb doesn't have a channel with this name. , -1 | a {b: change-color(red, $green: 1, $saturation: 1%)} +2 | a {b: color.change(red, $green: 1, $saturation: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blue_and_lightness/input.scss -a {b: change-color(red, $blue: 1, $lightness: 1%)} +@use 'sass:color'; +a {b: color.change(red, $blue: 1, $lightness: 1%)} <===> blue_and_lightness/error Error: $lightness: Color space rgb doesn't have a channel with this name. , -1 | a {b: change-color(red, $blue: 1, $lightness: 1%)} +2 | a {b: color.change(red, $blue: 1, $lightness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ @@ -51,38 +54,41 @@ Error: $blackness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> green_and_whiteness/input.scss -a {b: change-color(red, $green: 1, $whiteness: 1%)} +@use 'sass:color'; +a {b: color.change(red, $green: 1, $whiteness: 1%)} <===> green_and_whiteness/error Error: $whiteness: Color space rgb doesn't have a channel with this name. , -1 | a {b: change-color(red, $green: 1, $whiteness: 1%)} +2 | a {b: color.change(red, $green: 1, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> saturation_and_blackness/input.scss -a {b: change-color(red, $saturation: 1%, $blackness: 1%)} +@use 'sass:color'; +a {b: color.change(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error Error: $blackness: Color space hsl doesn't have a channel with this name. , -1 | a {b: change-color(red, $saturation: 1%, $blackness: 1%)} +2 | a {b: color.change(red, $saturation: 1%, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> lightness_and_whiteness/input.scss -a {b: change-color(red, $lightness: 1%, $whiteness: 1%)} +@use 'sass:color'; +a {b: color.change(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error Error: $whiteness: Color space hsl doesn't have a channel with this name. , -1 | a {b: change-color(red, $lightness: 1%, $whiteness: 1%)} +2 | a {b: color.change(red, $lightness: 1%, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/space.hrx b/spec/core_functions/color/change/error/space.hrx new file mode 100644 index 0000000000..01f2e35374 --- /dev/null +++ b/spec/core_functions/color/change/error/space.hrx @@ -0,0 +1,25 @@ +<===> unknown/input.scss +@use 'sass:color'; +a {b: color.change(red, $space: c)} + +<===> unknown/error +Error: $space: Unknown color space "c". + , +2 | a {b: color.change(red, $space: c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> quoted/input.scss +@use 'sass:color'; +a {b: color.change(red, $space: "lab")} + +<===> quoted/error +Error: $space: Expected "lab" to be an unquoted string. + , +2 | a {b: color.change(red, $space: "lab")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change_color/error/type.hrx b/spec/core_functions/color/change/error/type.hrx similarity index 57% rename from spec/core_functions/color/change_color/error/type.hrx rename to spec/core_functions/color/change/error/type.hrx index 11b12fe7ad..63b1f9728b 100644 --- a/spec/core_functions/color/change_color/error/type.hrx +++ b/spec/core_functions/color/change/error/type.hrx @@ -1,127 +1,151 @@ <===> color/input.scss -a {b: change-color(1)} +@use 'sass:color'; +a {b: color.change(1)} <===> color/error Error: $color: 1 is not a color. , -1 | a {b: change-color(1)} +2 | a {b: color.change(1)} | ^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> red/input.scss -a {b: change-color(red, $red: c)} +@use 'sass:color'; +a {b: color.change(red, $red: c)} <===> red/error Error: $red: c is not a number or unquoted "none". , -1 | a {b: change-color(red, $red: c)} +2 | a {b: color.change(red, $red: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> green/input.scss -a {b: change-color(red, $green: c)} +@use 'sass:color'; +a {b: color.change(red, $green: c)} <===> green/error Error: $green: c is not a number or unquoted "none". , -1 | a {b: change-color(red, $green: c)} +2 | a {b: color.change(red, $green: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blue/input.scss -a {b: change-color(red, $blue: c)} +@use 'sass:color'; +a {b: color.change(red, $blue: c)} <===> blue/error Error: $blue: c is not a number or unquoted "none". , -1 | a {b: change-color(red, $blue: c)} +2 | a {b: color.change(red, $blue: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> hue/input.scss -a {b: change-color(red, $hue: c)} +@use 'sass:color'; +a {b: color.change(red, $hue: c)} <===> hue/error Error: $hue: c is not a number or unquoted "none". , -1 | a {b: change-color(red, $hue: c)} +2 | a {b: color.change(red, $hue: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> saturation/input.scss -a {b: change-color(red, $saturation: c)} +@use 'sass:color'; +a {b: color.change(red, $saturation: c)} <===> saturation/error Error: $saturation: c is not a number or unquoted "none". , -1 | a {b: change-color(red, $saturation: c)} +2 | a {b: color.change(red, $saturation: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> lightness/input.scss -a {b: change-color(red, $lightness: c)} +@use 'sass:color'; +a {b: color.change(red, $lightness: c)} <===> lightness/error Error: $lightness: c is not a number or unquoted "none". , -1 | a {b: change-color(red, $lightness: c)} +2 | a {b: color.change(red, $lightness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> alpha/input.scss -a {b: change-color(red, $alpha: c)} +@use 'sass:color'; +a {b: color.change(red, $alpha: c)} <===> alpha/error Error: $alpha: c is not a number. , -1 | a {b: change-color(red, $alpha: c)} +2 | a {b: color.change(red, $alpha: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blackness/input.scss -a {b: change-color(red, $blackness: c)} +@use 'sass:color'; +a {b: color.change(red, $blackness: c)} <===> blackness/error Error: $blackness: c is not a number or unquoted "none". , -1 | a {b: change-color(red, $blackness: c)} +2 | a {b: color.change(red, $blackness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> whiteness/input.scss -a {b: change-color(red, $whiteness: c)} +@use 'sass:color'; +a {b: color.change(red, $whiteness: c)} <===> whiteness/error Error: $whiteness: c is not a number or unquoted "none". , -1 | a {b: change-color(red, $whiteness: c)} +2 | a {b: color.change(red, $whiteness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/input.scss +@use 'sass:color'; +a {b: color.change(red, $space: 1)} + +<===> space/error +Error: $space: 1 is not a string. + , +2 | a {b: color.change(red, $space: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/a98_rgb.hrx b/spec/core_functions/color/change/error/units/a98_rgb.hrx new file mode 100644 index 0000000000..a5f63c8794 --- /dev/null +++ b/spec/core_functions/color/change/error/units/a98_rgb.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/display_p3.hrx b/spec/core_functions/color/change/error/units/display_p3.hrx new file mode 100644 index 0000000000..97d91bc967 --- /dev/null +++ b/spec/core_functions/color/change/error/units/display_p3.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change_color/error/units.hrx b/spec/core_functions/color/change/error/units/hwb.hrx similarity index 61% rename from spec/core_functions/color/change_color/error/units.hrx rename to spec/core_functions/color/change/error/units/hwb.hrx index ba99c38183..115e87e0dd 100644 --- a/spec/core_functions/color/change_color/error/units.hrx +++ b/spec/core_functions/color/change/error/units/hwb.hrx @@ -1,50 +1,53 @@ <===> none/whiteness/input.scss -a {b: change-color(white, $whiteness: 1)} +@use 'sass:color'; +a {b: color.change(white, $whiteness: 1)} <===> none/whiteness/error Error: $whiteness: Expected 1 to have unit "%". , -1 | a {b: change-color(white, $whiteness: 1)} +2 | a {b: color.change(white, $whiteness: 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet - + input.scss 2:7 root stylesheet <===> ================================================================================ <===> none/blackness/input.scss -a {b: change-color(black, $blackness: 1)} +@use 'sass:color'; +a {b: color.change(black, $blackness: 1)} <===> none/blackness/error Error: $blackness: Expected 1 to have unit "%". , -1 | a {b: change-color(black, $blackness: 1)} +2 | a {b: color.change(black, $blackness: 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> wrong/whiteness/input.scss -a {b: change-color(white, $whiteness: 1px)} +@use 'sass:color'; +a {b: color.change(white, $whiteness: 1px)} <===> wrong/whiteness/error Error: $whiteness: Expected 1px to have unit "%". , -1 | a {b: change-color(white, $whiteness: 1px)} +2 | a {b: color.change(white, $whiteness: 1px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> wrong/blackness/input.scss -a {b: change-color(black, $blackness: 1px)} +@use 'sass:color'; +a {b: color.change(black, $blackness: 1px)} <===> wrong/blackness/error Error: $blackness: Expected 1px to have unit "%". , -1 | a {b: change-color(black, $blackness: 1px)} +2 | a {b: color.change(black, $blackness: 1px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/lab.hrx b/spec/core_functions/color/change/error/units/lab.hrx new file mode 100644 index 0000000000..6fa7249055 --- /dev/null +++ b/spec/core_functions/color/change/error/units/lab.hrx @@ -0,0 +1,39 @@ +<===> lightness/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 30 -50), $lightness: 30px)} + +<===> lightness/error +Error: $lightness: Expected 30px to have unit "%" or no units. + , +2 | a {b: color.change(lab(50% 30 -50), $lightness: 30px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> a/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 30 -50), $a: 20px)} + +<===> a/error +Error: $a: Expected 20px to have unit "%" or no units. + , +2 | a {b: color.change(lab(50% 30 -50), $a: 20px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> b/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 30 -50), $b: 20px)} + +<===> b/error +Error: $b: Expected 20px to have unit "%" or no units. + , +2 | a {b: color.change(lab(50% 30 -50), $b: 20px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/lch.hrx b/spec/core_functions/color/change/error/units/lch.hrx new file mode 100644 index 0000000000..0c08c79dd8 --- /dev/null +++ b/spec/core_functions/color/change/error/units/lch.hrx @@ -0,0 +1,39 @@ +<===> lightness/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 30 50deg), $lightness: 30px)} + +<===> lightness/error +Error: $lightness: Expected 30px to have unit "%" or no units. + , +2 | a {b: color.change(lch(50% 30 50deg), $lightness: 30px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> chroma/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 30 50deg), $chroma: 20px)} + +<===> chroma/error +Error: $chroma: Expected 20px to have unit "%" or no units. + , +2 | a {b: color.change(lch(50% 30 50deg), $chroma: 20px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> hue/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 30 50deg), $hue: 20%)} + +<===> hue/error +Error: $hue: Expected 20% to have an angle unit (deg, grad, rad, turn). + , +2 | a {b: color.change(lch(50% 30 50deg), $hue: 20%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/oklab.hrx b/spec/core_functions/color/change/error/units/oklab.hrx new file mode 100644 index 0000000000..c2210ee2ee --- /dev/null +++ b/spec/core_functions/color/change/error/units/oklab.hrx @@ -0,0 +1,39 @@ +<===> lightness/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 0.3px)} + +<===> lightness/error +Error: $lightness: Expected 0.3px to have unit "%" or no units. + , +2 | a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 0.3px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> a/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $a: 0.2px)} + +<===> a/error +Error: $a: Expected 0.2px to have unit "%" or no units. + , +2 | a {b: color.change(oklab(50% 0.2 -0.3), $a: 0.2px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> b/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $b: 0.2px)} + +<===> b/error +Error: $b: Expected 0.2px to have unit "%" or no units. + , +2 | a {b: color.change(oklab(50% 0.2 -0.3), $b: 0.2px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/oklch.hrx b/spec/core_functions/color/change/error/units/oklch.hrx new file mode 100644 index 0000000000..f89fc46da4 --- /dev/null +++ b/spec/core_functions/color/change/error/units/oklch.hrx @@ -0,0 +1,39 @@ +<===> lightness/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.3 50deg), $lightness: 30px)} + +<===> lightness/error +Error: $lightness: Expected 30px to have unit "%" or no units. + , +2 | a {b: color.change(oklch(50% 0.3 50deg), $lightness: 30px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> chroma/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.3 50deg), $chroma: 0.2px)} + +<===> chroma/error +Error: $chroma: Expected 0.2px to have unit "%" or no units. + , +2 | a {b: color.change(oklch(50% 0.3 50deg), $chroma: 0.2px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> hue/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.3 50deg), $hue: 20%)} + +<===> hue/error +Error: $hue: Expected 20% to have an angle unit (deg, grad, rad, turn). + , +2 | a {b: color.change(oklch(50% 0.3 50deg), $hue: 20%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/prophoto_rgb.hrx b/spec/core_functions/color/change/error/units/prophoto_rgb.hrx new file mode 100644 index 0000000000..eb44f0ec4e --- /dev/null +++ b/spec/core_functions/color/change/error/units/prophoto_rgb.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/rec2020.hrx b/spec/core_functions/color/change/error/units/rec2020.hrx new file mode 100644 index 0000000000..4193d05aef --- /dev/null +++ b/spec/core_functions/color/change/error/units/rec2020.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/srgb.hrx b/spec/core_functions/color/change/error/units/srgb.hrx new file mode 100644 index 0000000000..9d583bf7fd --- /dev/null +++ b/spec/core_functions/color/change/error/units/srgb.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(srgb 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/srgb_linear.hrx b/spec/core_functions/color/change/error/units/srgb_linear.hrx new file mode 100644 index 0000000000..6f6df601d3 --- /dev/null +++ b/spec/core_functions/color/change/error/units/srgb_linear.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/xyz.hrx b/spec/core_functions/color/change/error/units/xyz.hrx new file mode 100644 index 0000000000..0e4f0c15d4 --- /dev/null +++ b/spec/core_functions/color/change/error/units/xyz.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.5px)} + +<===> red/error +Error: $x: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $y: 0.5px)} + +<===> green/error +Error: $y: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(xyz 0.2 0.5 0.7), $y: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 0.5px)} + +<===> blue/error +Error: $z: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/error/units/xyz_d50.hrx b/spec/core_functions/color/change/error/units/xyz_d50.hrx new file mode 100644 index 0000000000..9a46b0ba59 --- /dev/null +++ b/spec/core_functions/color/change/error/units/xyz_d50.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.5px)} + +<===> red/error +Error: $x: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: 0.5px)} + +<===> green/error +Error: $y: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 0.5px)} + +<===> blue/error +Error: $z: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/global.hrx b/spec/core_functions/color/change/global.hrx new file mode 100644 index 0000000000..cf9f014dde --- /dev/null +++ b/spec/core_functions/color/change/global.hrx @@ -0,0 +1,17 @@ +<===> legacy/input.scss +a {b: change-color(red, $blue: 50)} + +<===> legacy/output.css +a { + b: #ff0032; +} + +<===> +================================================================================ +<===> non_legacy/input.scss +a {b: change-color(pink, $chroma: 0.06, $space: oklch)} + +<===> non_legacy/output.css +a { + b: rgb(247.5333900768, 195.811523731, 204.5286989775); +} diff --git a/spec/core_functions/color/change/hsl.hrx b/spec/core_functions/color/change/hsl.hrx new file mode 100644 index 0000000000..92e7ee0d26 --- /dev/null +++ b/spec/core_functions/color/change/hsl.hrx @@ -0,0 +1,425 @@ +<===> hue/max/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: 359)} + +<===> hue/max/output.css +a { + b: rgb(255, 0, 4.25); +} + +<===> +================================================================================ +<===> hue/above_max/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: 540)} + +<===> hue/above_max/output.css +a { + b: aqua; +} + +<===> +================================================================================ +<===> hue/min/input.scss +@use 'sass:color'; +a {b: color.change(blue, $hue: 0)} + +<===> hue/min/output.css +a { + b: red; +} + +<===> +================================================================================ +<===> hue/negative/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: -60)} + +<===> hue/negative/output.css +a { + b: fuchsia; +} + +<===> +================================================================================ +<===> hue/middle/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: 123)} + +<===> hue/middle/output.css +a { + b: rgb(0, 255, 12.75); +} + +<===> +================================================================================ +<===> hue/fraction/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: 0.5)} + +<===> hue/fraction/output.css +a { + b: rgb(255, 2.125, 0); +} + +<===> +================================================================================ +<===> saturation/max/input.scss +@use 'sass:color'; +a {b: color.change(plum, $saturation: 100%)} + +<===> saturation/max/output.css +a { + b: #ff7eff; +} + +<===> +================================================================================ +<===> saturation/min/input.scss +@use 'sass:color'; +a {b: color.change(plum, $saturation: 0%)} + +<===> saturation/min/output.css +a { + b: rgb(190.5, 190.5, 190.5); +} + +<===> +================================================================================ +<===> saturation/high/input.scss +@use 'sass:color'; +a {b: color.change(plum, $saturation: 76%)} + +<===> saturation/high/output.css +a { + b: rgb(239.52, 141.48, 239.52); +} + +<===> +================================================================================ +<===> saturation/low/input.scss +@use 'sass:color'; +a {b: color.change(plum, $saturation: 14%)} + +<===> saturation/low/output.css +a { + b: rgb(199.53, 181.47, 199.53); +} + +<===> +================================================================================ +<===> saturation/above_range/input.scss +@use 'sass:color'; +a {b: color.change(plum, $saturation: 120%)} + +<===> saturation/above_range/output.css +a { + b: hsl(300, 120%, 74.7058823529%); +} + +<===> +================================================================================ +<===> saturation/below_range/input.scss +@use 'sass:color'; +a {b: color.change(plum, $saturation: -20%)} + +<===> saturation/below_range/output.css +a { + b: rgb(177.6, 203.4, 177.6); +} + +<===> +================================================================================ +<===> lightness/max/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 100%)} + +<===> lightness/max/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> lightness/fraction/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 0.5%)} + +<===> lightness/fraction/output.css +a { + b: rgb(2.55, 0, 0); +} + +<===> +================================================================================ +<===> lightness/min/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 0%)} + +<===> lightness/min/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> lightness/high/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 63%)} + +<===> lightness/high/output.css +a { + b: rgb(255, 66.3, 66.3); +} + +<===> +================================================================================ +<===> lightness/low/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 27%)} + +<===> lightness/low/output.css +a { + b: rgb(137.7, 0, 0); +} + +<===> +================================================================================ +<===> lightness/above_range/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 120%)} + +<===> lightness/above_range/output.css +a { + b: hsl(0, 100%, 120%); +} + +<===> +================================================================================ +<===> lightness/below_range/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: -20%)} + +<===> lightness/below_range/output.css +a { + b: hsl(0, 100%, -20%); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(black, $hue: 12, $saturation: 24%, $lightness: 48%)} + +<===> all/output.css +a { + b: rgb(151.776, 104.7744, 93.024); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(rgba(black, 0.7), $hue: 12, $saturation: 24%, $lightness: 48%)} + +<===> alpha_input/output.css +a { + b: rgba(151.776, 104.7744, 93.024, 0.7); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(black, $hue: 12, $saturation: 24%, $lightness: 48%, $alpha: 0.7)} + +<===> alpha_arg/output.css +a { + b: rgba(151.776, 104.7744, 93.024, 0.7); +} + +<===> +================================================================================ +<===> units/hue/deg/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: 60deg)} + +<===> units/hue/deg/output.css +a { + b: yellow; +} + +<===> +================================================================================ +<===> units/hue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: 60)} + +<===> units/hue/unitless/output.css +a { + b: yellow; +} + +<===> +================================================================================ +<===> units/hue/unknown/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: 60in)} + +<===> units/hue/unknown/output.css +a { + b: yellow; +} + +<===> units/hue/unknown/warning +DEPRECATION WARNING: $hue: Passing a unit other than deg (60in) is deprecated. + +To preserve current behavior: calc($hue / 1in) + +See https://sass-lang.com/d/function-units + + , +2 | a {b: color.change(red, $hue: 60in)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> units/hue/angle/input.scss +@use 'sass:color'; +a {b: color.change(red, $hue: 60rad)} + +<===> units/hue/angle/output.css +a { + b: rgb(0, 179.576224164, 255); +} + +<===> +================================================================================ +<===> units/saturation/percent/input.scss +@use 'sass:color'; +a {b: color.change(red, $saturation: 50%)} + +<===> units/saturation/percent/output.css +a { + b: rgb(191.25, 63.75, 63.75); +} + +<===> +================================================================================ +<===> units/saturation/unitless/input.scss +@use 'sass:color'; +a {b: color.change(red, $saturation: 50)} + +<===> units/saturation/unitless/output.css +a { + b: rgb(191.25, 63.75, 63.75); +} + +<===> units/saturation/unitless/warning +DEPRECATION WARNING: $saturation: Passing a number without unit % (50) is deprecated. + +To preserve current behavior: $saturation * 1% + +More info: https://sass-lang.com/d/function-units + + , +2 | a {b: color.change(red, $saturation: 50)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> units/saturation/unknown/input.scss +@use 'sass:color'; +a {b: color.change(red, $saturation: 50in)} + +<===> units/saturation/unknown/output.css +a { + b: rgb(191.25, 63.75, 63.75); +} + +<===> units/saturation/unknown/warning +DEPRECATION WARNING: $saturation: Passing a number without unit % (50in) is deprecated. + +To preserve current behavior: calc($saturation / 1in * 1%) + +More info: https://sass-lang.com/d/function-units + + , +2 | a {b: color.change(red, $saturation: 50in)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> units/lightness/percent/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 30%)} + +<===> units/lightness/percent/output.css +a { + b: #990000; +} + +<===> +================================================================================ +<===> units/lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 30)} + +<===> units/lightness/unitless/output.css +a { + b: #990000; +} + +<===> units/lightness/unitless/warning +DEPRECATION WARNING: $lightness: Passing a number without unit % (30) is deprecated. + +To preserve current behavior: $lightness * 1% + +More info: https://sass-lang.com/d/function-units + + , +2 | a {b: color.change(red, $lightness: 30)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> units/lightness/unknown/input.scss +@use 'sass:color'; +a {b: color.change(red, $lightness: 30in)} + +<===> units/lightness/unknown/output.css +a { + b: #990000; +} + +<===> units/lightness/unknown/warning +DEPRECATION WARNING: $lightness: Passing a number without unit % (30in) is deprecated. + +To preserve current behavior: calc($lightness / 1in * 1%) + +More info: https://sass-lang.com/d/function-units + + , +2 | a {b: color.change(red, $lightness: 30in)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a {b: color.change($color: black, $hue: 12, $saturation: 24%, $lightness: 48%)} + +<===> named/output.css +a { + b: rgb(151.776, 104.7744, 93.024); +} diff --git a/spec/core_functions/color/change_color/hwb.hrx b/spec/core_functions/color/change/hwb.hrx similarity index 64% rename from spec/core_functions/color/change_color/hwb.hrx rename to spec/core_functions/color/change/hwb.hrx index 27acafc430..10afd24010 100644 --- a/spec/core_functions/color/change_color/hwb.hrx +++ b/spec/core_functions/color/change/hwb.hrx @@ -1,5 +1,6 @@ <===> whiteness/max/input.scss -a {b: change-color(#cc6666, $whiteness: 100%)} +@use 'sass:color'; +a {b: color.change(#cc6666, $whiteness: 100%)} <===> whiteness/max/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> whiteness/min/input.scss -a {b: change-color(#cc6666, $whiteness: 0%)} +@use 'sass:color'; +a {b: color.change(#cc6666, $whiteness: 0%)} <===> whiteness/min/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> whiteness/high/input.scss -a {b: change-color(#cc6666, $whiteness: 80%)} +@use 'sass:color'; +a {b: color.change(#cc6666, $whiteness: 80%)} <===> whiteness/high/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> whiteness/low/input.scss -a {b: change-color(#cc6666, $whiteness: 20%)} +@use 'sass:color'; +a {b: color.change(#cc6666, $whiteness: 20%)} <===> whiteness/low/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> blackness/max/input.scss -a {b: change-color(#993333, $blackness: 100%)} +@use 'sass:color'; +a {b: color.change(#993333, $blackness: 100%)} <===> blackness/max/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> blackness/min/input.scss -a {b: change-color(#993333, $blackness: 0%)} +@use 'sass:color'; +a {b: color.change(#993333, $blackness: 0%)} <===> blackness/min/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> blackness/high/input.scss -a {b: change-color(#993333, $blackness: 80%)} +@use 'sass:color'; +a {b: color.change(#993333, $blackness: 80%)} <===> blackness/high/output.css a { @@ -69,17 +76,30 @@ a { <===> ================================================================================ <===> blackness/low/input.scss -a {b: change-color(#993333, $blackness: 20%)} +@use 'sass:color'; +a {b: color.change(#993333, $blackness: 20%)} <===> blackness/low/output.css a { b: #cc3333; } +<===> +================================================================================ +<===> out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(#993333, $whiteness: 50%, $blackness: -20%)} + +<===> out_of_range/output.css +a { + b: hsl(0, 233.3333333333%, 85%); +} + <===> ================================================================================ <===> all/input.scss -a {b: change-color(blue, $hue: 150, $whiteness: 20%, $blackness: 40%)} +@use 'sass:color'; +a {b: color.change(blue, $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> all/output.css a { @@ -89,7 +109,8 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -a {b: change-color(rgba(blue, 0.7), $hue: 150, $whiteness: 20%, $blackness: 40%)} +@use 'sass:color'; +a {b: color.change(rgba(blue, 0.7), $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> alpha_input/output.css a { @@ -99,7 +120,8 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -a {b: change-color(blue, $hue: 150, $whiteness: 20%, $blackness: 40%, $alpha: 0.3)} +@use 'sass:color'; +a {b: color.change(blue, $hue: 150, $whiteness: 20%, $blackness: 40%, $alpha: 0.3)} <===> alpha_arg/output.css a { @@ -109,7 +131,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: change-color($color: blue, $hue: 150, $whiteness: 20%, $blackness: 40%)} +@use 'sass:color'; +a {b: color.change($color: blue, $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> named/output.css a { diff --git a/spec/core_functions/color/change/lab.hrx b/spec/core_functions/color/change/lab.hrx new file mode 100644 index 0000000000..84d7bc0cd1 --- /dev/null +++ b/spec/core_functions/color/change/lab.hrx @@ -0,0 +1,129 @@ +<===> lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $lightness: 30)} + +<===> lightness/unitless/output.css +a { + b: lab(30% 20 -30); +} + +<===> +================================================================================ +<===> lightness/percent/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $lightness: 30%)} + +<===> lightness/percent/output.css +a { + b: lab(30% 20 -30); +} + +<===> +================================================================================ +<===> lightness/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $lightness: 120%)} + +<===> lightness/out_of_range/output.css +a { + b: color-mix(in lab, color(xyz 1.7255148283 1.6190494947 2.5266428703) 100%, black); +} + +<===> +================================================================================ +<===> a/unitless/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $a: 50)} + +<===> a/unitless/output.css +a { + b: lab(50% 50 -30); +} + +<===> +================================================================================ +<===> a/percent/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $a: -40%)} + +<===> a/percent/output.css +a { + b: lab(50% -50 -30); +} + +<===> +================================================================================ +<===> a/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $a: 200)} + +<===> a/out_of_range/output.css +a { + b: lab(50% 200 -30); +} + +<===> +================================================================================ +<===> b/unitless/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $b: 50)} + +<===> b/unitless/output.css +a { + b: lab(50% 20 50); +} + +<===> +================================================================================ +<===> b/percent/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $b: -40%)} + +<===> b/percent/output.css +a { + b: lab(50% 20 -50); +} + +<===> +================================================================================ +<===> b/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $b: -200)} + +<===> b/out_of_range/output.css +a { + b: lab(50% 20 -200); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $lightness: 20%, $a: -30, $b: 40)} + +<===> all/output.css +a { + b: lab(20% -30 40); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30 / 0.9), $lightness: 30%)} + +<===> alpha_input/output.css +a { + b: lab(30% 20 -30 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $lightness: 30%, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: lab(30% 20 -30 / 0.9); +} diff --git a/spec/core_functions/color/change/lch.hrx b/spec/core_functions/color/change/lch.hrx new file mode 100644 index 0000000000..fdb73abc42 --- /dev/null +++ b/spec/core_functions/color/change/lch.hrx @@ -0,0 +1,140 @@ +<===> lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $lightness: 30)} + +<===> lightness/unitless/output.css +a { + b: lch(30% 20 30deg); +} + +<===> +================================================================================ +<===> lightness/percent/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $lightness: 30%)} + +<===> lightness/percent/output.css +a { + b: lch(30% 20 30deg); +} + +<===> +================================================================================ +<===> lightness/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $lightness: 120%)} + +<===> lightness/out_of_range/output.css +a { + b: color-mix(in lch, color(xyz 1.6569354424 1.6040925936 1.5400032443) 100%, black); +} + +<===> +================================================================================ +<===> chroma/unitless/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $chroma: 50)} + +<===> chroma/unitless/output.css +a { + b: lch(50% 50 30deg); +} + +<===> +================================================================================ +<===> chroma/percent/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $chroma: 40%)} + +<===> chroma/percent/output.css +a { + b: lch(50% 60 30deg); +} + +<===> +================================================================================ +<===> chroma/negative/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $chroma: -10)} + +<===> chroma/negative/output.css +a { + b: lch(50% 10 210deg); +} + +<===> +================================================================================ +<===> chroma/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $chroma: 200)} + +<===> chroma/out_of_range/output.css +a { + b: lch(50% 200 30deg); +} + +<===> +================================================================================ +<===> hue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $hue: 50deg)} + +<===> hue/unitless/output.css +a { + b: lch(50% 20 50deg); +} + +<===> +================================================================================ +<===> hue/negative/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $hue: -20deg)} + +<===> hue/negative/output.css +a { + b: lch(50% 20 340deg); +} + +<===> +================================================================================ +<===> hue/above_max/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $hue: 400deg)} + +<===> hue/above_max/output.css +a { + b: lch(50% 20 40deg); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $lightness: 20%, $chroma: 30, $hue: 40deg)} + +<===> all/output.css +a { + b: lch(20% 30 40deg); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg / 0.9), $lightness: 30%)} + +<===> alpha_input/output.css +a { + b: lch(30% 20 30deg / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $lightness: 30%, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: lch(30% 20 30deg / 0.9); +} diff --git a/spec/core_functions/color/change/no_channels.hrx b/spec/core_functions/color/change/no_channels.hrx new file mode 100644 index 0000000000..f59b2e6437 --- /dev/null +++ b/spec/core_functions/color/change/no_channels.hrx @@ -0,0 +1,19 @@ +<===> identical/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 0deg), $space: lab)} + +<===> identical/output.css +a { + b: oklch(50% 0.2 0deg); +} + +<===> +================================================================================ +<===> powerless/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0 0deg), $space: lab)} + +<===> powerless/output.css +a { + b: oklch(50% 0 none); +} diff --git a/spec/core_functions/color/change/no_space.hrx b/spec/core_functions/color/change/no_space.hrx new file mode 100644 index 0000000000..3cf8d754d7 --- /dev/null +++ b/spec/core_functions/color/change/no_space.hrx @@ -0,0 +1,131 @@ +<===> positional/input.scss +@use 'sass:color'; +a {b: color.change(red)} + +<===> positional/output.css +a { + b: red; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a {b: color.change($color: red)} + +<===> named/output.css +a { + b: red; +} + +<===> +================================================================================ +<===> non_legacy/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 50 50))} + +<===> non_legacy/output.css +a { + b: lab(50% 50 50); +} + +<===> +================================================================================ +<===> alpha/max/input.scss +@use 'sass:color'; +a {b: color.change(rgba(red, 0.5), $alpha: 1)} + +<===> alpha/max/output.css +a { + b: red; +} + +<===> +================================================================================ +<===> alpha/min/input.scss +@use 'sass:color'; +a {b: color.change(rgba(red, 0.5), $alpha: 0)} + +<===> alpha/min/output.css +a { + b: rgba(255, 0, 0, 0); +} + +<===> +================================================================================ +<===> alpha/high/input.scss +@use 'sass:color'; +a {b: color.change(rgba(red, 0.5), $alpha: 0.72)} + +<===> alpha/high/output.css +a { + b: rgba(255, 0, 0, 0.72); +} + +<===> +================================================================================ +<===> alpha/low/input.scss +@use 'sass:color'; +a {b: color.change(rgba(red, 0.5), $alpha: 0.36)} + +<===> alpha/low/output.css +a { + b: rgba(255, 0, 0, 0.36); +} + +<===> +================================================================================ +<===> alpha/non_legacy/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 50 50), $alpha: 0.36)} + +<===> alpha/non_legacy/output.css +a { + b: lab(50% 50 50 / 0.36); +} + +<===> +================================================================================ +<===> alpha/units/unitless/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: 0.5)} + +<===> alpha/units/unitless/output.css +a { + b: rgba(255, 0, 0, 0.5); +} + +<===> +================================================================================ +<===> alpha/units/percent/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: 50%)} + +<===> alpha/units/percent/output.css +a { + b: rgba(255, 0, 0, 0.5); +} + +<===> +================================================================================ +<===> alpha/units/unknown/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: 0.5px)} + +<===> alpha/units/unknown/output.css +a { + b: rgba(255, 0, 0, 0.5); +} + +<===> alpha/units/unknown/warning +DEPRECATION WARNING: $alpha: Passing a unit other than % (0.5px) is deprecated. + +To preserve current behavior: calc($alpha / 1px) + +See https://sass-lang.com/d/function-units + + , +2 | a {b: color.change(red, $alpha: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/oklab.hrx b/spec/core_functions/color/change/oklab.hrx new file mode 100644 index 0000000000..dc3efa1d4f --- /dev/null +++ b/spec/core_functions/color/change/oklab.hrx @@ -0,0 +1,129 @@ +<===> lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 0.3)} + +<===> lightness/unitless/output.css +a { + b: oklab(30% 0.2 -0.3); +} + +<===> +================================================================================ +<===> lightness/percent/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 30%)} + +<===> lightness/percent/output.css +a { + b: oklab(30% 0.2 -0.3); +} + +<===> +================================================================================ +<===> lightness/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 1.2)} + +<===> lightness/out_of_range/output.css +a { + b: color-mix(in oklab, color(xyz 2.3267923962 1.5626810194 5.2743259015) 100%, black); +} + +<===> +================================================================================ +<===> a/unitless/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $a: 0.1)} + +<===> a/unitless/output.css +a { + b: oklab(50% 0.1 -0.3); +} + +<===> +================================================================================ +<===> a/percent/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $a: -40%)} + +<===> a/percent/output.css +a { + b: oklab(50% -0.16 -0.3); +} + +<===> +================================================================================ +<===> a/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $a: 1)} + +<===> a/out_of_range/output.css +a { + b: oklab(50% 1 -0.3); +} + +<===> +================================================================================ +<===> b/unitless/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $b: 0.4)} + +<===> b/unitless/output.css +a { + b: oklab(50% 0.2 0.4); +} + +<===> +================================================================================ +<===> b/percent/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $b: -40%)} + +<===> b/percent/output.css +a { + b: oklab(50% 0.2 -0.16); +} + +<===> +================================================================================ +<===> b/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $b: -1)} + +<===> b/out_of_range/output.css +a { + b: oklab(50% 0.2 -1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 20%, $a: -0.3, $b: 0.4)} + +<===> all/output.css +a { + b: oklab(20% -0.3 0.4); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3 / 0.9), $lightness: 30%)} + +<===> alpha_input/output.css +a { + b: oklab(30% 0.2 -0.3 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 30%, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: oklab(30% 0.2 -0.3 / 0.9); +} diff --git a/spec/core_functions/color/change/oklch.hrx b/spec/core_functions/color/change/oklch.hrx new file mode 100644 index 0000000000..2eecf61da8 --- /dev/null +++ b/spec/core_functions/color/change/oklch.hrx @@ -0,0 +1,140 @@ +<===> lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $lightness: 0.3)} + +<===> lightness/unitless/output.css +a { + b: oklch(30% 0.2 30deg); +} + +<===> +================================================================================ +<===> lightness/percent/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $lightness: 30%)} + +<===> lightness/percent/output.css +a { + b: oklch(30% 0.2 30deg); +} + +<===> +================================================================================ +<===> lightness/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $lightness: 120%)} + +<===> lightness/out_of_range/output.css +a { + b: color-mix(in oklch, color(xyz 2.0602078346 1.6344742217 1.0169251403) 100%, black); +} + +<===> +================================================================================ +<===> chroma/unitless/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $chroma: 0.1)} + +<===> chroma/unitless/output.css +a { + b: oklch(50% 0.1 30deg); +} + +<===> +================================================================================ +<===> chroma/percent/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $chroma: 40%)} + +<===> chroma/percent/output.css +a { + b: oklch(50% 0.16 30deg); +} + +<===> +================================================================================ +<===> chroma/negative/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $chroma: -0.1)} + +<===> chroma/negative/output.css +a { + b: oklch(50% 0.1 210deg); +} + +<===> +================================================================================ +<===> chroma/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $chroma: 1)} + +<===> chroma/out_of_range/output.css +a { + b: oklch(50% 1 30deg); +} + +<===> +================================================================================ +<===> hue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $hue: 50deg)} + +<===> hue/unitless/output.css +a { + b: oklch(50% 0.2 50deg); +} + +<===> +================================================================================ +<===> hue/negative/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $hue: -20deg)} + +<===> hue/negative/output.css +a { + b: oklch(50% 0.2 340deg); +} + +<===> +================================================================================ +<===> hue/above_max/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $hue: 400deg)} + +<===> hue/above_max/output.css +a { + b: oklch(50% 0.2 40deg); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $lightness: 20%, $chroma: 0.1, $hue: 40deg)} + +<===> all/output.css +a { + b: oklch(20% 0.1 40deg); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg / 0.9), $lightness: 30%)} + +<===> alpha_input/output.css +a { + b: oklch(30% 0.2 30deg / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $lightness: 30%, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: oklch(30% 0.2 30deg / 0.9); +} diff --git a/spec/core_functions/color/change/prophoto_rgb.hrx b/spec/core_functions/color/change/prophoto_rgb.hrx new file mode 100644 index 0000000000..1d5238beff --- /dev/null +++ b/spec/core_functions/color/change/prophoto_rgb.hrx @@ -0,0 +1,129 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(prophoto-rgb 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 50%)} + +<===> red/percent/output.css +a { + b: color(prophoto-rgb 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 1.2)} + +<===> red/out_of_range/output.css +a { + b: color(prophoto-rgb 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.4)} + +<===> green/unitless/output.css +a { + b: color(prophoto-rgb 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(prophoto-rgb 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: -0.2)} + +<===> green/out_of_range/output.css +a { + b: color(prophoto-rgb 0.2 -0.2 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.5)} + +<===> blue/unitless/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 50%)} + +<===> blue/percent/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 100)} + +<===> blue/out_of_range/output.css +a { + b: color(prophoto-rgb 0.2 0.5 100); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} + +<===> all/output.css +a { + b: color(prophoto-rgb 0.7 0.4 0.2); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(prophoto-rgb 0.5 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: color(prophoto-rgb 0.5 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/change/rec2020.hrx b/spec/core_functions/color/change/rec2020.hrx new file mode 100644 index 0000000000..da2c37c239 --- /dev/null +++ b/spec/core_functions/color/change/rec2020.hrx @@ -0,0 +1,129 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(rec2020 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 50%)} + +<===> red/percent/output.css +a { + b: color(rec2020 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 1.2)} + +<===> red/out_of_range/output.css +a { + b: color(rec2020 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: 0.4)} + +<===> green/unitless/output.css +a { + b: color(rec2020 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(rec2020 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: -0.2)} + +<===> green/out_of_range/output.css +a { + b: color(rec2020 0.2 -0.2 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 0.5)} + +<===> blue/unitless/output.css +a { + b: color(rec2020 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 50%)} + +<===> blue/percent/output.css +a { + b: color(rec2020 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 100)} + +<===> blue/out_of_range/output.css +a { + b: color(rec2020 0.2 0.5 100); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} + +<===> all/output.css +a { + b: color(rec2020 0.7 0.4 0.2); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(rec2020 0.5 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: color(rec2020 0.5 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/change_color/rgb.hrx b/spec/core_functions/color/change/rgb.hrx similarity index 58% rename from spec/core_functions/color/change_color/rgb.hrx rename to spec/core_functions/color/change/rgb.hrx index b418953047..f63eb720a6 100644 --- a/spec/core_functions/color/change_color/rgb.hrx +++ b/spec/core_functions/color/change/rgb.hrx @@ -1,5 +1,6 @@ <===> red/max/input.scss -a {b: change-color(black, $red: 255)} +@use 'sass:color'; +a {b: color.change(black, $red: 255)} <===> red/max/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> red/min/input.scss -a {b: change-color(red, $red: 0)} +@use 'sass:color'; +a {b: color.change(red, $red: 0)} <===> red/min/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> red/low/input.scss -a {b: change-color(red, $red: 100)} +@use 'sass:color'; +a {b: color.change(red, $red: 100)} <===> red/low/output.css a { @@ -29,17 +32,30 @@ a { <===> ================================================================================ <===> red/high/input.scss -a {b: change-color(black, $red: 200)} +@use 'sass:color'; +a {b: color.change(black, $red: 200)} <===> red/high/output.css a { b: #c80000; } +<===> +================================================================================ +<===> red/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(black, $red: 500)} + +<===> red/out_of_range/output.css +a { + b: hsl(0, 5000%, 98.0392156863%); +} + <===> ================================================================================ <===> green/max/input.scss -a {b: change-color(black, $green: 255)} +@use 'sass:color'; +a {b: color.change(black, $green: 255)} <===> green/max/output.css a { @@ -49,7 +65,8 @@ a { <===> ================================================================================ <===> green/min/input.scss -a {b: change-color(lime, $green: 0)} +@use 'sass:color'; +a {b: color.change(lime, $green: 0)} <===> green/min/output.css a { @@ -59,7 +76,8 @@ a { <===> ================================================================================ <===> green/low/input.scss -a {b: change-color(lime, $green: 100)} +@use 'sass:color'; +a {b: color.change(lime, $green: 100)} <===> green/low/output.css a { @@ -69,17 +87,30 @@ a { <===> ================================================================================ <===> green/high/input.scss -a {b: change-color(black, $green: 200)} +@use 'sass:color'; +a {b: color.change(black, $green: 200)} <===> green/high/output.css a { b: #00c800; } +<===> +================================================================================ +<===> green/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(black, $green: -50)} + +<===> green/out_of_range/output.css +a { + b: hsl(120, 100%, -9.8039215686%); +} + <===> ================================================================================ <===> blue/max/input.scss -a {b: change-color(black, $blue: 255)} +@use 'sass:color'; +a {b: color.change(black, $blue: 255)} <===> blue/max/output.css a { @@ -89,7 +120,8 @@ a { <===> ================================================================================ <===> blue/min/input.scss -a {b: change-color(blue, $blue: 0)} +@use 'sass:color'; +a {b: color.change(blue, $blue: 0)} <===> blue/min/output.css a { @@ -99,7 +131,8 @@ a { <===> ================================================================================ <===> blue/low/input.scss -a {b: change-color(blue, $blue: 100)} +@use 'sass:color'; +a {b: color.change(blue, $blue: 100)} <===> blue/low/output.css a { @@ -109,17 +142,30 @@ a { <===> ================================================================================ <===> blue/high/input.scss -a {b: change-color(black, $blue: 200)} +@use 'sass:color'; +a {b: color.change(black, $blue: 200)} <===> blue/high/output.css a { b: #0000c8; } +<===> +================================================================================ +<===> blue/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(black, $blue: 256)} + +<===> blue/out_of_range/output.css +a { + b: hsl(240, 100.7874015748%, 50.1960784314%); +} + <===> ================================================================================ <===> all/input.scss -a {b: change-color(black, $red: 12, $green: 24, $blue: 48)} +@use 'sass:color'; +a {b: color.change(black, $red: 12, $green: 24, $blue: 48)} <===> all/output.css a { @@ -129,7 +175,8 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -a {b: change-color(rgba(black, 0.3), $red: 12, $green: 24, $blue: 48)} +@use 'sass:color'; +a {b: color.change(rgba(black, 0.3), $red: 12, $green: 24, $blue: 48)} <===> alpha_input/output.css a { @@ -139,7 +186,8 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -a {b: change-color(black, $red: 12, $green: 24, $blue: 48, $alpha: 0.3)} +@use 'sass:color'; +a {b: color.change(black, $red: 12, $green: 24, $blue: 48, $alpha: 0.3)} <===> alpha_arg/output.css a { @@ -149,7 +197,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: change-color($color: black, $red: 12, $green: 24, $blue: 48)} +@use 'sass:color'; +a {b: color.change($color: black, $red: 12, $green: 24, $blue: 48)} <===> named/output.css a { diff --git a/spec/core_functions/color/change/srgb.hrx b/spec/core_functions/color/change/srgb.hrx new file mode 100644 index 0000000000..e7f123f344 --- /dev/null +++ b/spec/core_functions/color/change/srgb.hrx @@ -0,0 +1,129 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(srgb 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 50%)} + +<===> red/percent/output.css +a { + b: color(srgb 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 1.2)} + +<===> red/out_of_range/output.css +a { + b: color(srgb 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $green: 0.4)} + +<===> green/unitless/output.css +a { + b: color(srgb 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(srgb 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $green: -0.2)} + +<===> green/out_of_range/output.css +a { + b: color(srgb 0.2 -0.2 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 0.5)} + +<===> blue/unitless/output.css +a { + b: color(srgb 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 50%)} + +<===> blue/percent/output.css +a { + b: color(srgb 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 100)} + +<===> blue/out_of_range/output.css +a { + b: color(srgb 0.2 0.5 100); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} + +<===> all/output.css +a { + b: color(srgb 0.7 0.4 0.2); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(srgb 0.5 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: color(srgb 0.5 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/change/srgb_linear.hrx b/spec/core_functions/color/change/srgb_linear.hrx new file mode 100644 index 0000000000..2be5195196 --- /dev/null +++ b/spec/core_functions/color/change/srgb_linear.hrx @@ -0,0 +1,129 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(srgb-linear 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 50%)} + +<===> red/percent/output.css +a { + b: color(srgb-linear 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> red/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 1.2)} + +<===> red/out_of_range/output.css +a { + b: color(srgb-linear 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: 0.4)} + +<===> green/unitless/output.css +a { + b: color(srgb-linear 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(srgb-linear 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> green/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: -0.2)} + +<===> green/out_of_range/output.css +a { + b: color(srgb-linear 0.2 -0.2 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 0.5)} + +<===> blue/unitless/output.css +a { + b: color(srgb-linear 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 50%)} + +<===> blue/percent/output.css +a { + b: color(srgb-linear 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> blue/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 100)} + +<===> blue/out_of_range/output.css +a { + b: color(srgb-linear 0.2 0.5 100); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} + +<===> all/output.css +a { + b: color(srgb-linear 0.7 0.4 0.2); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(srgb-linear 0.5 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: color(srgb-linear 0.5 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/change/xyz.hrx b/spec/core_functions/color/change/xyz.hrx new file mode 100644 index 0000000000..1cd1f05d76 --- /dev/null +++ b/spec/core_functions/color/change/xyz.hrx @@ -0,0 +1,129 @@ +<===> x/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.5)} + +<===> x/unitless/output.css +a { + b: color(xyz 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> x/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 50%)} + +<===> x/percent/output.css +a { + b: color(xyz 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> x/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 1.2)} + +<===> x/out_of_range/output.css +a { + b: color(xyz 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> y/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $y: 0.4)} + +<===> y/unitless/output.css +a { + b: color(xyz 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> y/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $y: 40%)} + +<===> y/percent/output.css +a { + b: color(xyz 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> y/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $y: -0.2)} + +<===> y/out_of_range/output.css +a { + b: color(xyz 0.2 -0.2 0.7); +} + +<===> +================================================================================ +<===> z/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 0.5)} + +<===> z/unitless/output.css +a { + b: color(xyz 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> z/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 50%)} + +<===> z/percent/output.css +a { + b: color(xyz 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> z/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 100)} + +<===> z/out_of_range/output.css +a { + b: color(xyz 0.2 0.5 100); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.7, $y: 0.4, $z: 0.2)} + +<===> all/output.css +a { + b: color(xyz 0.7 0.4 0.2); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7 / 0.9), $x: 0.5)} + +<===> alpha_input/output.css +a { + b: color(xyz 0.5 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.5, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: color(xyz 0.5 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/change/xyz_d50.hrx b/spec/core_functions/color/change/xyz_d50.hrx new file mode 100644 index 0000000000..6ef7951da4 --- /dev/null +++ b/spec/core_functions/color/change/xyz_d50.hrx @@ -0,0 +1,129 @@ +<===> x/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.5)} + +<===> x/unitless/output.css +a { + b: color(xyz-d50 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> x/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 50%)} + +<===> x/percent/output.css +a { + b: color(xyz-d50 0.5 0.5 0.7); +} + +<===> +================================================================================ +<===> x/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 1.2)} + +<===> x/out_of_range/output.css +a { + b: color(xyz-d50 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> y/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: 0.4)} + +<===> y/unitless/output.css +a { + b: color(xyz-d50 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> y/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: 40%)} + +<===> y/percent/output.css +a { + b: color(xyz-d50 0.2 0.4 0.7); +} + +<===> +================================================================================ +<===> y/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: -0.2)} + +<===> y/out_of_range/output.css +a { + b: color(xyz-d50 0.2 -0.2 0.7); +} + +<===> +================================================================================ +<===> z/unitless/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 0.5)} + +<===> z/unitless/output.css +a { + b: color(xyz-d50 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> z/percent/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 50%)} + +<===> z/percent/output.css +a { + b: color(xyz-d50 0.2 0.5 0.5); +} + +<===> +================================================================================ +<===> z/out_of_range/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 100)} + +<===> z/out_of_range/output.css +a { + b: color(xyz-d50 0.2 0.5 100); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.7, $y: 0.4, $z: 0.2)} + +<===> all/output.css +a { + b: color(xyz-d50 0.7 0.4 0.2); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7 / 0.9), $x: 0.5)} + +<===> alpha_input/output.css +a { + b: color(xyz-d50 0.5 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.5, $alpha: 0.9)} + +<===> alpha_arg/output.css +a { + b: color(xyz-d50 0.5 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/change_color/error/bounds.hrx b/spec/core_functions/color/change_color/error/bounds.hrx deleted file mode 100644 index 6f5a2055c2..0000000000 --- a/spec/core_functions/color/change_color/error/bounds.hrx +++ /dev/null @@ -1,342 +0,0 @@ -<===> README.md -According to the new color space spec, out-of-bounds values should be allowed -(and clamped for strictly bounded spaces). See sass/sass-spec#1828. - -<===> options.yml ---- -:todo: -- dart-sass - -<===> -================================================================================ -<===> red/too_low/input.scss -a {b: change-color(red, $red: -1)} - -<===> red/too_low/error -Error: $red: Expected -1 to be within 0 and 255. - , -1 | a {b: change-color(red, $red: -1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> red/too_high/input.scss -a {b: change-color(red, $red: 256)} - -<===> red/too_high/error -Error: $red: Expected 256 to be within 0 and 255. - , -1 | a {b: change-color(red, $red: 256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> red/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -a {b: change-color(red, $red: 300px)} - -<===> red/unit/error -Error: $red: Expected 300px to be within 0 and 255. - , -3 | a {b: change-color(red, $red: 300px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> green/too_low/input.scss -a {b: change-color(green, $green: -1)} - -<===> green/too_low/error -Error: $green: Expected -1 to be within 0 and 255. - , -1 | a {b: change-color(green, $green: -1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> green/too_high/input.scss -a {b: change-color(green, $green: 256)} - -<===> green/too_high/error -Error: $green: Expected 256 to be within 0 and 255. - , -1 | a {b: change-color(green, $green: 256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> green/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -a {b: change-color(green, $green: 300px)} - -<===> green/unit/error -Error: $green: Expected 300px to be within 0 and 255. - , -3 | a {b: change-color(green, $green: 300px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> blue/too_low/input.scss -a {b: change-color(blue, $blue: -1)} - -<===> blue/too_low/error -Error: $blue: Expected -1 to be within 0 and 255. - , -1 | a {b: change-color(blue, $blue: -1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blue/too_high/input.scss -a {b: change-color(blue, $blue: 256)} - -<===> blue/too_high/error -Error: $blue: Expected 256 to be within 0 and 255. - , -1 | a {b: change-color(blue, $blue: 256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blue/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -a {b: change-color(blue, $blue: 300px)} - -<===> blue/unit/error -Error: $blue: Expected 300px to be within 0 and 255. - , -3 | a {b: change-color(blue, $blue: 300px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> saturation/too_low/input.scss -a {b: change-color(red, $saturation: -0.001%)} - -<===> saturation/too_low/error -Error: $saturation: Expected -0.001% to be within 0% and 100%. - , -1 | a {b: change-color(red, $saturation: -0.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturation/too_high/input.scss -a {b: change-color(red, $saturation: 100.001%)} - -<===> saturation/too_high/error -Error: $saturation: Expected 100.001% to be within 0% and 100%. - , -1 | a {b: change-color(red, $saturation: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturation/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -a {b: change-color(red, $saturation: 200px)} - -<===> saturation/unit/error -DEPRECATION WARNING: $saturation: Passing a number without unit % (200px) is deprecated. - -To preserve current behavior: calc($saturation / 1px * 1%) - -More info: https://sass-lang.com/d/function-units - - , -3 | a {b: change-color(red, $saturation: 200px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -Error: $saturation: Expected 200px to be within 0% and 100%. - , -3 | a {b: change-color(red, $saturation: 200px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> lightness/too_low/input.scss -a {b: change-color(red, $lightness: -0.001%)} - -<===> lightness/too_low/error -Error: $lightness: Expected -0.001% to be within 0% and 100%. - , -1 | a {b: change-color(red, $lightness: -0.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/too_high/input.scss -a {b: change-color(red, $lightness: 100.001%)} - -<===> lightness/too_high/error -Error: $lightness: Expected 100.001% to be within 0% and 100%. - , -1 | a {b: change-color(red, $lightness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -a {b: change-color(red, $lightness: 200px)} - -<===> lightness/unit/error -DEPRECATION WARNING: $lightness: Passing a number without unit % (200px) is deprecated. - -To preserve current behavior: calc($lightness / 1px * 1%) - -More info: https://sass-lang.com/d/function-units - - , -3 | a {b: change-color(red, $lightness: 200px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -Error: $lightness: Expected 200px to be within 0% and 100%. - , -3 | a {b: change-color(red, $lightness: 200px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> alpha/too_low/input.scss -a {b: change-color(red, $alpha: -0.001)} - -<===> alpha/too_low/error -Error: $alpha: Expected -0.001 to be within 0 and 1. - , -1 | a {b: change-color(red, $alpha: -0.001)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/too_high/input.scss -a {b: change-color(red, $alpha: 1.001)} - -<===> alpha/too_high/error -Error: $alpha: Expected 1.001 to be within 0 and 1. - , -1 | a {b: change-color(red, $alpha: 1.001)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -a {b: change-color(red, $alpha: 50%)} - -<===> alpha/unit/error -DEPRECATION WARNING: $alpha: Passing a number with unit % is deprecated. - -To preserve current behavior: calc($alpha / 1%) - -More info: https://sass-lang.com/d/function-units - - , -3 | a {b: change-color(red, $alpha: 50%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -Error: $alpha: Expected 50% to be within 0 and 1. - , -3 | a {b: change-color(red, $alpha: 50%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> blackness/too_low/input.scss -a {b: change-color(red, $blackness: -0.001%)} - -<===> blackness/too_low/error -Error: $blackness: Expected -0.001% to be within 0% and 100%. - , -1 | a {b: change-color(red, $blackness: -0.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blackness/too_high/input.scss -a {b: change-color(red, $blackness: 100.001%)} - -<===> blackness/too_high/error -Error: $blackness: Expected 100.001% to be within 0% and 100%. - , -1 | a {b: change-color(red, $blackness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/too_low/input.scss -a {b: change-color(red, $whiteness: -0.001%)} - -<===> whiteness/too_low/error -Error: $whiteness: Expected -0.001% to be within 0% and 100%. - , -1 | a {b: change-color(red, $whiteness: -0.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/too_high/input.scss -a {b: change-color(red, $whiteness: 100.001%)} - -<===> whiteness/too_high/error -Error: $whiteness: Expected 100.001% to be within 0% and 100%. - , -1 | a {b: change-color(red, $whiteness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/change_color/hsl.hrx b/spec/core_functions/color/change_color/hsl.hrx deleted file mode 100644 index b5c796e25c..0000000000 --- a/spec/core_functions/color/change_color/hsl.hrx +++ /dev/null @@ -1,187 +0,0 @@ -<===> hue/max/input.scss -a {b: change-color(red, $hue: 359)} - -<===> hue/max/output.css -a { - b: rgb(255, 0, 4.25); -} - -<===> -================================================================================ -<===> hue/above_max/input.scss -a {b: change-color(red, $hue: 540)} - -<===> hue/above_max/output.css -a { - b: aqua; -} - -<===> -================================================================================ -<===> hue/min/input.scss -a {b: change-color(blue, $hue: 0)} - -<===> hue/min/output.css -a { - b: red; -} - -<===> -================================================================================ -<===> hue/negative/input.scss -a {b: change-color(red, $hue: -60)} - -<===> hue/negative/output.css -a { - b: fuchsia; -} - -<===> -================================================================================ -<===> hue/middle/input.scss -a {b: change-color(red, $hue: 123)} - -<===> hue/middle/output.css -a { - b: rgb(0, 255, 12.75); -} - -<===> -================================================================================ -<===> hue/fraction/input.scss -a {b: change-color(red, $hue: 0.5)} - -<===> hue/fraction/output.css -a { - b: rgb(255, 2.125, 0); -} - -<===> -================================================================================ -<===> saturation/max/input.scss -a {b: change-color(plum, $saturation: 100%)} - -<===> saturation/max/output.css -a { - b: #ff7eff; -} - -<===> -================================================================================ -<===> saturation/min/input.scss -a {b: change-color(plum, $saturation: 0%)} - -<===> saturation/min/output.css -a { - b: rgb(190.5, 190.5, 190.5); -} - -<===> -================================================================================ -<===> saturation/high/input.scss -a {b: change-color(plum, $saturation: 76%)} - -<===> saturation/high/output.css -a { - b: rgb(239.52, 141.48, 239.52); -} - -<===> -================================================================================ -<===> saturation/low/input.scss -a {b: change-color(plum, $saturation: 14%)} - -<===> saturation/low/output.css -a { - b: rgb(199.53, 181.47, 199.53); -} - -<===> -================================================================================ -<===> lightness/max/input.scss -a {b: change-color(red, $lightness: 100%)} - -<===> lightness/max/output.css -a { - b: white; -} - -<===> -================================================================================ -<===> lightness/fraction/input.scss -a {b: change-color(red, $lightness: 0.5%)} - -<===> lightness/fraction/output.css -a { - b: rgb(2.55, 0, 0); -} - -<===> -================================================================================ -<===> lightness/min/input.scss -a {b: change-color(red, $lightness: 0%)} - -<===> lightness/min/output.css -a { - b: black; -} - -<===> -================================================================================ -<===> lightness/high/input.scss -a {b: change-color(red, $lightness: 63%)} - -<===> lightness/high/output.css -a { - b: rgb(255, 66.3, 66.3); -} - -<===> -================================================================================ -<===> lightness/low/input.scss -a {b: change-color(red, $lightness: 27%)} - -<===> lightness/low/output.css -a { - b: rgb(137.7, 0, 0); -} - -<===> -================================================================================ -<===> all/input.scss -a {b: change-color(black, $hue: 12, $saturation: 24%, $lightness: 48%)} - -<===> all/output.css -a { - b: rgb(151.776, 104.7744, 93.024); -} - -<===> -================================================================================ -<===> alpha_input/input.scss -a {b: change-color(rgba(black, 0.7), $hue: 12, $saturation: 24%, $lightness: 48%)} - -<===> alpha_input/output.css -a { - b: rgba(151.776, 104.7744, 93.024, 0.7); -} - -<===> -================================================================================ -<===> alpha_arg/input.scss -a {b: change-color(black, $hue: 12, $saturation: 24%, $lightness: 48%, $alpha: 0.7)} - -<===> alpha_arg/output.css -a { - b: rgba(151.776, 104.7744, 93.024, 0.7); -} - -<===> -================================================================================ -<===> named/input.scss -a {b: change-color($color: black, $hue: 12, $saturation: 24%, $lightness: 48%)} - -<===> named/output.css -a { - b: rgb(151.776, 104.7744, 93.024); -} diff --git a/spec/core_functions/color/change_color/no_rgb_hsl.hrx b/spec/core_functions/color/change_color/no_rgb_hsl.hrx deleted file mode 100644 index 257b3c6d52..0000000000 --- a/spec/core_functions/color/change_color/no_rgb_hsl.hrx +++ /dev/null @@ -1,57 +0,0 @@ -<===> positional/input.scss -a {b: change-color(red)} - -<===> positional/output.css -a { - b: red; -} - -<===> -================================================================================ -<===> named/input.scss -a {b: change-color($color: red)} - -<===> named/output.css -a { - b: red; -} - -<===> -================================================================================ -<===> alpha/max/input.scss -a {b: change-color(rgba(red, 0.5), $alpha: 1)} - -<===> alpha/max/output.css -a { - b: red; -} - -<===> -================================================================================ -<===> alpha/min/input.scss -a {b: change-color(rgba(red, 0.5), $alpha: 0)} - -<===> alpha/min/output.css -a { - b: rgba(255, 0, 0, 0); -} - -<===> -================================================================================ -<===> alpha/high/input.scss -a {b: change-color(rgba(red, 0.5), $alpha: 0.72)} - -<===> alpha/high/output.css -a { - b: rgba(255, 0, 0, 0.72); -} - -<===> -================================================================================ -<===> alpha/low/input.scss -a {b: change-color(rgba(red, 0.5), $alpha: 0.36)} - -<===> alpha/low/output.css -a { - b: rgba(255, 0, 0, 0.36); -} diff --git a/spec/core_functions/color/change_color/units.hrx b/spec/core_functions/color/change_color/units.hrx deleted file mode 100644 index a4d23a1a96..0000000000 --- a/spec/core_functions/color/change_color/units.hrx +++ /dev/null @@ -1,218 +0,0 @@ -<===> hue/deg/input.scss -a {b: change-color(red, $hue: 60deg)} - -<===> hue/deg/output.css -a { - b: yellow; -} - -<===> -================================================================================ -<===> hue/unitless/input.scss -a {b: change-color(red, $hue: 60)} - -<===> hue/unitless/output.css -a { - b: yellow; -} - -<===> -================================================================================ -<===> hue/unknown/input.scss -a {b: change-color(red, $hue: 60in)} - -<===> hue/unknown/output.css -a { - b: yellow; -} - -<===> hue/unknown/warning -DEPRECATION WARNING: $hue: Passing a unit other than deg (60in) is deprecated. - -To preserve current behavior: calc($hue / 1in) - -See https://sass-lang.com/d/function-units - - , -1 | a {b: change-color(red, $hue: 60in)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> hue/angle/input.scss -a {b: change-color(red, $hue: 60rad)} - -<===> hue/angle/output.css -a { - b: rgb(0, 179.576224164, 255); -} - -<===> -================================================================================ -<===> saturation/percent/input.scss -a {b: change-color(red, $saturation: 50%)} - -<===> saturation/percent/output.css -a { - b: rgb(191.25, 63.75, 63.75); -} - -<===> -================================================================================ -<===> saturation/unitless/input.scss -a {b: change-color(red, $saturation: 50)} - -<===> saturation/unitless/output.css -a { - b: rgb(191.25, 63.75, 63.75); -} - -<===> saturation/unitless/warning -DEPRECATION WARNING: $saturation: Passing a number without unit % (50) is deprecated. - -To preserve current behavior: $saturation * 1% - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: change-color(red, $saturation: 50)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturation/unknown/input.scss -a {b: change-color(red, $saturation: 50in)} - -<===> saturation/unknown/output.css -a { - b: rgb(191.25, 63.75, 63.75); -} - -<===> saturation/unknown/warning -DEPRECATION WARNING: $saturation: Passing a number without unit % (50in) is deprecated. - -To preserve current behavior: calc($saturation / 1in * 1%) - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: change-color(red, $saturation: 50in)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/percent/input.scss -a {b: change-color(red, $lightness: 30%)} - -<===> lightness/percent/output.css -a { - b: #990000; -} - -<===> -================================================================================ -<===> lightness/unitless/input.scss -a {b: change-color(red, $lightness: 30)} - -<===> lightness/unitless/output.css -a { - b: #990000; -} - -<===> lightness/unitless/warning -DEPRECATION WARNING: $lightness: Passing a number without unit % (30) is deprecated. - -To preserve current behavior: $lightness * 1% - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: change-color(red, $lightness: 30)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/unknown/input.scss -a {b: change-color(red, $lightness: 30in)} - -<===> lightness/unknown/output.css -a { - b: #990000; -} - -<===> lightness/unknown/warning -DEPRECATION WARNING: $lightness: Passing a number without unit % (30in) is deprecated. - -To preserve current behavior: calc($lightness / 1in * 1%) - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: change-color(red, $lightness: 30in)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/unitless/input.scss -a {b: change-color(red, $alpha: 0.5)} - -<===> alpha/unitless/output.css -a { - b: rgba(255, 0, 0, 0.5); -} - -<===> -================================================================================ -<===> alpha/percent/input.scss -a {b: adjust-color(red, $alpha: 0.5%)} - -<===> alpha/percent/output.css -a { - b: red; -} - -<===> alpha/percent/warning -DEPRECATION WARNING: $alpha: Passing a number with unit % is deprecated. - -To preserve current behavior: calc($alpha / 1%) - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: adjust-color(red, $alpha: 0.5%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/unknown/input.scss -a {b: adjust-color(red, $alpha: 0.5px)} - -<===> alpha/unknown/output.css -a { - b: red; -} - -<===> alpha/unknown/warning -DEPRECATION WARNING: $alpha: Passing a number with unit px is deprecated. - -To preserve current behavior: calc($alpha / 1px) - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: adjust-color(red, $alpha: 0.5px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet From 231b7ef028e71cd64932e20e4b99d589bb092f53 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Mon, 6 May 2024 13:54:37 -0700 Subject: [PATCH 33/45] [Color 4] Add tests for none in `color.change()` (#1985) --- spec/core_functions/color/change/a98_rgb.hrx | 33 +++++++++++++++++++ .../color/change/display_p3.hrx | 33 +++++++++++++++++++ .../color/change/error/type.hrx | 16 ++++++++- spec/core_functions/color/change/hsl.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/hwb.hrx | 22 +++++++++++++ spec/core_functions/color/change/lab.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/lch.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/no_space.hrx | 11 +++++++ .../core_functions/color/change/none_case.hrx | 30 +++++++++++++++++ spec/core_functions/color/change/oklab.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/oklch.hrx | 33 +++++++++++++++++++ .../color/change/prophoto_rgb.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/rec2020.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/rgb.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/srgb.hrx | 33 +++++++++++++++++++ .../color/change/srgb_linear.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/xyz.hrx | 33 +++++++++++++++++++ spec/core_functions/color/change/xyz_d50.hrx | 33 +++++++++++++++++++ 18 files changed, 540 insertions(+), 1 deletion(-) create mode 100644 spec/core_functions/color/change/none_case.hrx diff --git a/spec/core_functions/color/change/a98_rgb.hrx b/spec/core_functions/color/change/a98_rgb.hrx index df07bd4b50..138f135d3a 100644 --- a/spec/core_functions/color/change/a98_rgb.hrx +++ b/spec/core_functions/color/change/a98_rgb.hrx @@ -29,6 +29,17 @@ a { b: color(a98-rgb 1.2 0.5 0.7); } +<===> +================================================================================ +<===> red/none/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: none)} + +<===> red/none/output.css +a { + b: color(a98-rgb none 0.5 0.7); +} + <===> ================================================================================ <===> green/unitless/input.scss @@ -62,6 +73,17 @@ a { b: color(a98-rgb 0.2 -0.2 0.7); } +<===> +================================================================================ +<===> green/none/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: none)} + +<===> green/none/output.css +a { + b: color(a98-rgb 0.2 none 0.7); +} + <===> ================================================================================ <===> blue/unitless/input.scss @@ -95,6 +117,17 @@ a { b: color(a98-rgb 0.2 0.5 100); } +<===> +================================================================================ +<===> blue/none/input.scss +@use 'sass:color'; +a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: none)} + +<===> blue/none/output.css +a { + b: color(a98-rgb 0.2 0.5 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/display_p3.hrx b/spec/core_functions/color/change/display_p3.hrx index a3129b4ceb..f251299f93 100644 --- a/spec/core_functions/color/change/display_p3.hrx +++ b/spec/core_functions/color/change/display_p3.hrx @@ -29,6 +29,17 @@ a { b: color(display-p3 1.2 0.5 0.7); } +<===> +================================================================================ +<===> red/none/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: none)} + +<===> red/none/output.css +a { + b: color(display-p3 none 0.5 0.7); +} + <===> ================================================================================ <===> green/unitless/input.scss @@ -62,6 +73,17 @@ a { b: color(display-p3 0.2 -0.2 0.7); } +<===> +================================================================================ +<===> green/none/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: none)} + +<===> green/none/output.css +a { + b: color(display-p3 0.2 none 0.7); +} + <===> ================================================================================ <===> blue/unitless/input.scss @@ -95,6 +117,17 @@ a { b: color(display-p3 0.2 0.5 100); } +<===> +================================================================================ +<===> blue/none/input.scss +@use 'sass:color'; +a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: none)} + +<===> blue/none/output.css +a { + b: color(display-p3 0.2 0.5 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/error/type.hrx b/spec/core_functions/color/change/error/type.hrx index 63b1f9728b..510f66e00f 100644 --- a/spec/core_functions/color/change/error/type.hrx +++ b/spec/core_functions/color/change/error/type.hrx @@ -101,13 +101,27 @@ Error: $lightness: c is not a number or unquoted "none". a {b: color.change(red, $alpha: c)} <===> alpha/error -Error: $alpha: c is not a number. +Error: $alpha: c is not a number or unquoted "none". , 2 | a {b: color.change(red, $alpha: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 2:7 root stylesheet +<===> +================================================================================ +<===> quoted_none/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: "none")} + +<===> quoted_none/error +Error: $alpha: "none" is not a number or unquoted "none". + , +2 | a {b: color.change(red, $alpha: "none")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> blackness/input.scss diff --git a/spec/core_functions/color/change/hsl.hrx b/spec/core_functions/color/change/hsl.hrx index 92e7ee0d26..83e9eb45b5 100644 --- a/spec/core_functions/color/change/hsl.hrx +++ b/spec/core_functions/color/change/hsl.hrx @@ -62,6 +62,17 @@ a { b: rgb(255, 2.125, 0); } +<===> +================================================================================ +<===> hue/none/input.scss +@use 'sass:color'; +a {b: color.change(hsl(0deg 100% 50%), $hue: none)} + +<===> hue/none/output.css +a { + b: hsl(none 100% 50%); +} + <===> ================================================================================ <===> saturation/max/input.scss @@ -128,6 +139,17 @@ a { b: rgb(177.6, 203.4, 177.6); } +<===> +================================================================================ +<===> saturation/none/input.scss +@use 'sass:color'; +a {b: color.change(hsl(0deg 100% 50%), $saturation: none)} + +<===> saturation/none/output.css +a { + b: hsl(0deg none 50%); +} + <===> ================================================================================ <===> lightness/max/input.scss @@ -205,6 +227,17 @@ a { b: hsl(0, 100%, -20%); } +<===> +================================================================================ +<===> lightness/none/input.scss +@use 'sass:color'; +a {b: color.change(hsl(0deg 100% 50%), $lightness: none)} + +<===> lightness/none/output.css +a { + b: hsl(0deg 100% none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/hwb.hrx b/spec/core_functions/color/change/hwb.hrx index 10afd24010..16aa70406b 100644 --- a/spec/core_functions/color/change/hwb.hrx +++ b/spec/core_functions/color/change/hwb.hrx @@ -40,6 +40,17 @@ a { b: #cc3333; } +<===> +================================================================================ +<===> whiteness/none/input.scss +@use 'sass:color'; +a {b: color.change(hwb(180deg 30% 50%), $whiteness: none)} + +<===> whiteness/none/output.css +a { + b: hwb(180deg none 50%); +} + <===> ================================================================================ <===> blackness/max/input.scss @@ -84,6 +95,17 @@ a { b: #cc3333; } +<===> +================================================================================ +<===> blackness/none/input.scss +@use 'sass:color'; +a {b: color.change(hwb(180deg 30% 50%), $blackness: none)} + +<===> blackness/none/output.css +a { + b: hwb(180deg 30% none); +} + <===> ================================================================================ <===> out_of_range/input.scss diff --git a/spec/core_functions/color/change/lab.hrx b/spec/core_functions/color/change/lab.hrx index 84d7bc0cd1..154ed30363 100644 --- a/spec/core_functions/color/change/lab.hrx +++ b/spec/core_functions/color/change/lab.hrx @@ -29,6 +29,17 @@ a { b: color-mix(in lab, color(xyz 1.7255148283 1.6190494947 2.5266428703) 100%, black); } +<===> +================================================================================ +<===> lightness/none/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $lightness: none)} + +<===> lightness/none/output.css +a { + b: lab(none 20 -30); +} + <===> ================================================================================ <===> a/unitless/input.scss @@ -62,6 +73,17 @@ a { b: lab(50% 200 -30); } +<===> +================================================================================ +<===> a/none/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $a: none)} + +<===> a/none/output.css +a { + b: lab(50% none -30); +} + <===> ================================================================================ <===> b/unitless/input.scss @@ -95,6 +117,17 @@ a { b: lab(50% 20 -200); } +<===> +================================================================================ +<===> b/none/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 20 -30), $b: none)} + +<===> b/none/output.css +a { + b: lab(50% 20 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/lch.hrx b/spec/core_functions/color/change/lch.hrx index fdb73abc42..37b42a0bb8 100644 --- a/spec/core_functions/color/change/lch.hrx +++ b/spec/core_functions/color/change/lch.hrx @@ -29,6 +29,17 @@ a { b: color-mix(in lch, color(xyz 1.6569354424 1.6040925936 1.5400032443) 100%, black); } +<===> +================================================================================ +<===> lightness/none/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $lightness: none)} + +<===> lightness/none/output.css +a { + b: lch(none 20 30deg); +} + <===> ================================================================================ <===> chroma/unitless/input.scss @@ -73,6 +84,17 @@ a { b: lch(50% 200 30deg); } +<===> +================================================================================ +<===> chroma/none/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $chroma: none)} + +<===> chroma/none/output.css +a { + b: lch(50% none 30deg); +} + <===> ================================================================================ <===> hue/unitless/input.scss @@ -106,6 +128,17 @@ a { b: lch(50% 20 40deg); } +<===> +================================================================================ +<===> hue/none/input.scss +@use 'sass:color'; +a {b: color.change(lch(50% 20 30deg), $hue: none)} + +<===> hue/none/output.css +a { + b: lch(50% 20 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/no_space.hrx b/spec/core_functions/color/change/no_space.hrx index 3cf8d754d7..8f7198feb9 100644 --- a/spec/core_functions/color/change/no_space.hrx +++ b/spec/core_functions/color/change/no_space.hrx @@ -129,3 +129,14 @@ See https://sass-lang.com/d/function-units | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> alpha/none/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: none)} + +<===> alpha/none/output.css +a { + b: rgb(255 0 0 / none); +} diff --git a/spec/core_functions/color/change/none_case.hrx b/spec/core_functions/color/change/none_case.hrx new file mode 100644 index 0000000000..2f5d1bbf43 --- /dev/null +++ b/spec/core_functions/color/change/none_case.hrx @@ -0,0 +1,30 @@ +<===> legacy/input.scss +@use 'sass:color'; +a {b: color.change(red, $blue: NoNe)} + +<===> legacy/output.css +a { + b: rgb(255 0 none); +} + +<===> +================================================================================ +<===> non_legacy/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 10 20), $a: nOnE)} + +<===> non_legacy/output.css +a { + b: lab(50% none 20); +} + +<===> +================================================================================ +<===> alpha/input.scss +@use 'sass:color'; +a {b: color.change(red, $alpha: NONE)} + +<===> alpha/output.css +a { + b: rgb(255 0 0 / none); +} diff --git a/spec/core_functions/color/change/oklab.hrx b/spec/core_functions/color/change/oklab.hrx index dc3efa1d4f..dd04b70b75 100644 --- a/spec/core_functions/color/change/oklab.hrx +++ b/spec/core_functions/color/change/oklab.hrx @@ -29,6 +29,17 @@ a { b: color-mix(in oklab, color(xyz 2.3267923962 1.5626810194 5.2743259015) 100%, black); } +<===> +================================================================================ +<===> lightness/none/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $lightness: none)} + +<===> lightness/none/output.css +a { + b: oklab(none 0.2 -0.3); +} + <===> ================================================================================ <===> a/unitless/input.scss @@ -62,6 +73,17 @@ a { b: oklab(50% 1 -0.3); } +<===> +================================================================================ +<===> a/none/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $a: none)} + +<===> a/none/output.css +a { + b: oklab(50% none -0.3); +} + <===> ================================================================================ <===> b/unitless/input.scss @@ -95,6 +117,17 @@ a { b: oklab(50% 0.2 -1); } +<===> +================================================================================ +<===> b/none/input.scss +@use 'sass:color'; +a {b: color.change(oklab(50% 0.2 -0.3), $b: none)} + +<===> b/none/output.css +a { + b: oklab(50% 0.2 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/oklch.hrx b/spec/core_functions/color/change/oklch.hrx index 2eecf61da8..b74bf3b4f2 100644 --- a/spec/core_functions/color/change/oklch.hrx +++ b/spec/core_functions/color/change/oklch.hrx @@ -29,6 +29,17 @@ a { b: color-mix(in oklch, color(xyz 2.0602078346 1.6344742217 1.0169251403) 100%, black); } +<===> +================================================================================ +<===> lightness/none/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $lightness: none)} + +<===> lightness/none/output.css +a { + b: oklch(none 0.2 30deg); +} + <===> ================================================================================ <===> chroma/unitless/input.scss @@ -73,6 +84,17 @@ a { b: oklch(50% 1 30deg); } +<===> +================================================================================ +<===> chroma/none/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $chroma: none)} + +<===> chroma/none/output.css +a { + b: oklch(50% none 30deg); +} + <===> ================================================================================ <===> hue/unitless/input.scss @@ -106,6 +128,17 @@ a { b: oklch(50% 0.2 40deg); } +<===> +================================================================================ +<===> hue/none/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 30deg), $hue: none)} + +<===> hue/none/output.css +a { + b: oklch(50% 0.2 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/prophoto_rgb.hrx b/spec/core_functions/color/change/prophoto_rgb.hrx index 1d5238beff..a6213fecae 100644 --- a/spec/core_functions/color/change/prophoto_rgb.hrx +++ b/spec/core_functions/color/change/prophoto_rgb.hrx @@ -29,6 +29,17 @@ a { b: color(prophoto-rgb 1.2 0.5 0.7); } +<===> +================================================================================ +<===> red/none/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: none)} + +<===> red/none/output.css +a { + b: color(prophoto-rgb none 0.5 0.7); +} + <===> ================================================================================ <===> green/unitless/input.scss @@ -62,6 +73,17 @@ a { b: color(prophoto-rgb 0.2 -0.2 0.7); } +<===> +================================================================================ +<===> green/none/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: none)} + +<===> green/none/output.css +a { + b: color(prophoto-rgb 0.2 none 0.7); +} + <===> ================================================================================ <===> blue/unitless/input.scss @@ -95,6 +117,17 @@ a { b: color(prophoto-rgb 0.2 0.5 100); } +<===> +================================================================================ +<===> blue/none/input.scss +@use 'sass:color'; +a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: none)} + +<===> blue/none/output.css +a { + b: color(prophoto-rgb 0.2 0.5 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/rec2020.hrx b/spec/core_functions/color/change/rec2020.hrx index da2c37c239..a68578c85e 100644 --- a/spec/core_functions/color/change/rec2020.hrx +++ b/spec/core_functions/color/change/rec2020.hrx @@ -29,6 +29,17 @@ a { b: color(rec2020 1.2 0.5 0.7); } +<===> +================================================================================ +<===> red/none/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: none)} + +<===> red/none/output.css +a { + b: color(rec2020 none 0.5 0.7); +} + <===> ================================================================================ <===> green/unitless/input.scss @@ -62,6 +73,17 @@ a { b: color(rec2020 0.2 -0.2 0.7); } +<===> +================================================================================ +<===> green/none/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: none)} + +<===> green/none/output.css +a { + b: color(rec2020 0.2 none 0.7); +} + <===> ================================================================================ <===> blue/unitless/input.scss @@ -95,6 +117,17 @@ a { b: color(rec2020 0.2 0.5 100); } +<===> +================================================================================ +<===> blue/none/input.scss +@use 'sass:color'; +a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: none)} + +<===> blue/none/output.css +a { + b: color(rec2020 0.2 0.5 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/rgb.hrx b/spec/core_functions/color/change/rgb.hrx index f63eb720a6..dec11b5425 100644 --- a/spec/core_functions/color/change/rgb.hrx +++ b/spec/core_functions/color/change/rgb.hrx @@ -51,6 +51,17 @@ a { b: hsl(0, 5000%, 98.0392156863%); } +<===> +================================================================================ +<===> red/none/input.scss +@use 'sass:color'; +a {b: color.change(black, $red: none)} + +<===> red/none/output.css +a { + b: rgb(none 0 0); +} + <===> ================================================================================ <===> green/max/input.scss @@ -106,6 +117,17 @@ a { b: hsl(120, 100%, -9.8039215686%); } +<===> +================================================================================ +<===> green/none/input.scss +@use 'sass:color'; +a {b: color.change(black, $green: none)} + +<===> green/none/output.css +a { + b: rgb(0 none 0); +} + <===> ================================================================================ <===> blue/max/input.scss @@ -161,6 +183,17 @@ a { b: hsl(240, 100.7874015748%, 50.1960784314%); } +<===> +================================================================================ +<===> blue/none/input.scss +@use 'sass:color'; +a {b: color.change(black, $blue: none)} + +<===> blue/none/output.css +a { + b: rgb(0 0 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/srgb.hrx b/spec/core_functions/color/change/srgb.hrx index e7f123f344..c65e09d295 100644 --- a/spec/core_functions/color/change/srgb.hrx +++ b/spec/core_functions/color/change/srgb.hrx @@ -29,6 +29,17 @@ a { b: color(srgb 1.2 0.5 0.7); } +<===> +================================================================================ +<===> red/none/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $red: none)} + +<===> red/none/output.css +a { + b: color(srgb none 0.5 0.7); +} + <===> ================================================================================ <===> green/unitless/input.scss @@ -62,6 +73,17 @@ a { b: color(srgb 0.2 -0.2 0.7); } +<===> +================================================================================ +<===> green/none/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $green: none)} + +<===> green/none/output.css +a { + b: color(srgb 0.2 none 0.7); +} + <===> ================================================================================ <===> blue/unitless/input.scss @@ -95,6 +117,17 @@ a { b: color(srgb 0.2 0.5 100); } +<===> +================================================================================ +<===> blue/none/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: none)} + +<===> blue/none/output.css +a { + b: color(srgb 0.2 0.5 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/srgb_linear.hrx b/spec/core_functions/color/change/srgb_linear.hrx index 2be5195196..1a77e1ffad 100644 --- a/spec/core_functions/color/change/srgb_linear.hrx +++ b/spec/core_functions/color/change/srgb_linear.hrx @@ -29,6 +29,17 @@ a { b: color(srgb-linear 1.2 0.5 0.7); } +<===> +================================================================================ +<===> red/none/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: none)} + +<===> red/none/output.css +a { + b: color(srgb-linear none 0.5 0.7); +} + <===> ================================================================================ <===> green/unitless/input.scss @@ -62,6 +73,17 @@ a { b: color(srgb-linear 0.2 -0.2 0.7); } +<===> +================================================================================ +<===> green/none/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: none)} + +<===> green/none/output.css +a { + b: color(srgb-linear 0.2 none 0.7); +} + <===> ================================================================================ <===> blue/unitless/input.scss @@ -95,6 +117,17 @@ a { b: color(srgb-linear 0.2 0.5 100); } +<===> +================================================================================ +<===> blue/none/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: none)} + +<===> blue/none/output.css +a { + b: color(srgb-linear 0.2 0.5 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/xyz.hrx b/spec/core_functions/color/change/xyz.hrx index 1cd1f05d76..de856f1c12 100644 --- a/spec/core_functions/color/change/xyz.hrx +++ b/spec/core_functions/color/change/xyz.hrx @@ -29,6 +29,17 @@ a { b: color(xyz 1.2 0.5 0.7); } +<===> +================================================================================ +<===> x/none/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $x: none)} + +<===> x/none/output.css +a { + b: color(xyz none 0.5 0.7); +} + <===> ================================================================================ <===> y/unitless/input.scss @@ -62,6 +73,17 @@ a { b: color(xyz 0.2 -0.2 0.7); } +<===> +================================================================================ +<===> y/none/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $y: none)} + +<===> y/none/output.css +a { + b: color(xyz 0.2 none 0.7); +} + <===> ================================================================================ <===> z/unitless/input.scss @@ -95,6 +117,17 @@ a { b: color(xyz 0.2 0.5 100); } +<===> +================================================================================ +<===> z/none/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz 0.2 0.5 0.7), $z: none)} + +<===> z/none/output.css +a { + b: color(xyz 0.2 0.5 none); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/change/xyz_d50.hrx b/spec/core_functions/color/change/xyz_d50.hrx index 6ef7951da4..b7c1803b12 100644 --- a/spec/core_functions/color/change/xyz_d50.hrx +++ b/spec/core_functions/color/change/xyz_d50.hrx @@ -29,6 +29,17 @@ a { b: color(xyz-d50 1.2 0.5 0.7); } +<===> +================================================================================ +<===> x/none/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: none)} + +<===> x/none/output.css +a { + b: color(xyz-d50 none 0.5 0.7); +} + <===> ================================================================================ <===> y/unitless/input.scss @@ -62,6 +73,17 @@ a { b: color(xyz-d50 0.2 -0.2 0.7); } +<===> +================================================================================ +<===> y/none/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: none)} + +<===> y/none/output.css +a { + b: color(xyz-d50 0.2 none 0.7); +} + <===> ================================================================================ <===> z/unitless/input.scss @@ -95,6 +117,17 @@ a { b: color(xyz-d50 0.2 0.5 100); } +<===> +================================================================================ +<===> z/none/input.scss +@use 'sass:color'; +a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: none)} + +<===> z/none/output.css +a { + b: color(xyz-d50 0.2 0.5 none); +} + <===> ================================================================================ <===> all/input.scss From ae633dc70de700116241e929462737ba60712113 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 3 May 2024 14:23:56 -0700 Subject: [PATCH 34/45] Make color.adjust() tests run against the namespaced function --- .../{adjust_color => adjust}/error/args.hrx | 21 +-- .../{adjust_color => adjust}/error/bounds.hrx | 141 ++++++++++++------ .../error/mixed_formats.hrx | 49 +++--- .../{adjust_color => adjust}/error/type.hrx | 70 +++++---- .../{adjust_color => adjust}/error/units.hrx | 29 ++-- spec/core_functions/color/adjust/global.hrx | 17 +++ .../color/{adjust_color => adjust}/hsl.hrx | 101 +++++++++---- .../color/{adjust_color => adjust}/hwb.hrx | 73 ++++++--- .../{adjust_color => adjust}/no_rgb_hsl.hrx | 27 ++-- .../color/{adjust_color => adjust}/rgb.hrx | 57 ++++--- .../color/{adjust_color => adjust}/units.hrx | 67 +++++---- 11 files changed, 432 insertions(+), 220 deletions(-) rename spec/core_functions/color/{adjust_color => adjust}/error/args.hrx (68%) rename spec/core_functions/color/{adjust_color => adjust}/error/bounds.hrx (73%) rename spec/core_functions/color/{adjust_color => adjust}/error/mixed_formats.hrx (63%) rename spec/core_functions/color/{adjust_color => adjust}/error/type.hrx (61%) rename spec/core_functions/color/{adjust_color => adjust}/error/units.hrx (61%) create mode 100644 spec/core_functions/color/adjust/global.hrx rename spec/core_functions/color/{adjust_color => adjust}/hsl.hrx (72%) rename spec/core_functions/color/{adjust_color => adjust}/hwb.hrx (70%) rename spec/core_functions/color/{adjust_color => adjust}/no_rgb_hsl.hrx (71%) rename spec/core_functions/color/{adjust_color => adjust}/rgb.hrx (71%) rename spec/core_functions/color/{adjust_color => adjust}/units.hrx (75%) diff --git a/spec/core_functions/color/adjust_color/error/args.hrx b/spec/core_functions/color/adjust/error/args.hrx similarity index 68% rename from spec/core_functions/color/adjust_color/error/args.hrx rename to spec/core_functions/color/adjust/error/args.hrx index 1601d0b644..58b6aee6f6 100644 --- a/spec/core_functions/color/adjust_color/error/args.hrx +++ b/spec/core_functions/color/adjust/error/args.hrx @@ -1,40 +1,43 @@ <===> too_few/input.scss -a {b: adjust-color()} +@use 'sass:color'; +a {b: color.adjust()} <===> too_few/error Error: Missing argument $color. ,--> input.scss -1 | a {b: adjust-color()} +2 | a {b: color.adjust()} | ^^^^^^^^^^^^^^ invocation ' ,--> sass:color 1 | @function adjust($color, $kwargs...) { | ========================== declaration ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> too_many/input.scss -a {b: adjust-color(red, 1)} +@use 'sass:color'; +a {b: color.adjust(red, 1)} <===> too_many/error Error: Only one positional argument is allowed. All other arguments must be passed by name. , -1 | a {b: adjust-color(red, 1)} +2 | a {b: color.adjust(red, 1)} | ^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> unknown/input.scss -a {b: adjust-color(red, $ambience: 10%)} +@use 'sass:color'; +a {b: color.adjust(red, $ambience: 10%)} <===> unknown/error Error: $ambience: Color space rgb doesn't have a channel with this name. , -1 | a {b: adjust-color(red, $ambience: 10%)} +2 | a {b: color.adjust(red, $ambience: 10%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust_color/error/bounds.hrx b/spec/core_functions/color/adjust/error/bounds.hrx similarity index 73% rename from spec/core_functions/color/adjust_color/error/bounds.hrx rename to spec/core_functions/color/adjust/error/bounds.hrx index bdd52a68ce..0455b24dcd 100644 --- a/spec/core_functions/color/adjust_color/error/bounds.hrx +++ b/spec/core_functions/color/adjust/error/bounds.hrx @@ -10,12 +10,14 @@ According to the new color space spec, out-of-bounds values should be allowed <===> ================================================================================ <===> red/too_low/input.scss -a {b: adjust-color(red, $red: -256)} +@use 'sass:color'; +a {b: color.adjust(red, $red: -256)} <===> red/too_low/error Error: $red: Expected -256 to be within -255 and 255. , -1 | a {b: adjust-color(red, $red: -256)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $red: -256)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -23,12 +25,14 @@ Error: $red: Expected -256 to be within -255 and 255. <===> ================================================================================ <===> red/too_high/input.scss -a {b: adjust-color(red, $red: 256)} +@use 'sass:color'; +a {b: color.adjust(red, $red: 256)} <===> red/too_high/error Error: $red: Expected 256 to be within -255 and 255. , -1 | a {b: adjust-color(red, $red: 256)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $red: 256)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -38,12 +42,14 @@ Error: $red: Expected 256 to be within -255 and 255. <===> red/unit/input.scss // This test covers sass/dart-sass#1745, but should be removed once units are // fully forbidden (sass/sass#3374). -a {b: adjust-color(red, $red: 300px)} +@use 'sass:color'; +a {b: color.adjust(red, $red: 300px)} <===> red/unit/error Error: $red: Expected 300px to be within -255 and 255. , -3 | a {b: adjust-color(red, $red: 300px)} +3 | @use 'sass:color'; +a {b: color.adjust(red, $red: 300px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet @@ -51,12 +57,14 @@ Error: $red: Expected 300px to be within -255 and 255. <===> ================================================================================ <===> green/too_low/input.scss -a {b: adjust-color(green, $green: -256)} +@use 'sass:color'; +a {b: color.adjust(green, $green: -256)} <===> green/too_low/error Error: $green: Expected -256 to be within -255 and 255. , -1 | a {b: adjust-color(green, $green: -256)} +1 | @use 'sass:color'; +a {b: color.adjust(green, $green: -256)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -64,12 +72,14 @@ Error: $green: Expected -256 to be within -255 and 255. <===> ================================================================================ <===> green/too_high/input.scss -a {b: adjust-color(green, $green: 256)} +@use 'sass:color'; +a {b: color.adjust(green, $green: 256)} <===> green/too_high/error Error: $green: Expected 256 to be within -255 and 255. , -1 | a {b: adjust-color(green, $green: 256)} +1 | @use 'sass:color'; +a {b: color.adjust(green, $green: 256)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -79,12 +89,14 @@ Error: $green: Expected 256 to be within -255 and 255. <===> green/unit/input.scss // This test covers sass/dart-sass#1745, but should be removed once units are // fully forbidden (sass/sass#3374). -a {b: adjust-color(green, $green: 300px)} +@use 'sass:color'; +a {b: color.adjust(green, $green: 300px)} <===> green/unit/error Error: $green: Expected 300px to be within -255 and 255. , -3 | a {b: adjust-color(green, $green: 300px)} +3 | @use 'sass:color'; +a {b: color.adjust(green, $green: 300px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet @@ -92,12 +104,14 @@ Error: $green: Expected 300px to be within -255 and 255. <===> ================================================================================ <===> blue/too_low/input.scss -a {b: adjust-color(blue, $blue: -256)} +@use 'sass:color'; +a {b: color.adjust(blue, $blue: -256)} <===> blue/too_low/error Error: $blue: Expected -256 to be within -255 and 255. , -1 | a {b: adjust-color(blue, $blue: -256)} +1 | @use 'sass:color'; +a {b: color.adjust(blue, $blue: -256)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -105,12 +119,14 @@ Error: $blue: Expected -256 to be within -255 and 255. <===> ================================================================================ <===> blue/too_high/input.scss -a {b: adjust-color(blue, $blue: 256)} +@use 'sass:color'; +a {b: color.adjust(blue, $blue: 256)} <===> blue/too_high/error Error: $blue: Expected 256 to be within -255 and 255. , -1 | a {b: adjust-color(blue, $blue: 256)} +1 | @use 'sass:color'; +a {b: color.adjust(blue, $blue: 256)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -120,12 +136,14 @@ Error: $blue: Expected 256 to be within -255 and 255. <===> blue/unit/input.scss // This test covers sass/dart-sass#1745, but should be removed once units are // fully forbidden (sass/sass#3374). -a {b: adjust-color(blue, $blue: 300px)} +@use 'sass:color'; +a {b: color.adjust(blue, $blue: 300px)} <===> blue/unit/error Error: $blue: Expected 300px to be within -255 and 255. , -3 | a {b: adjust-color(blue, $blue: 300px)} +3 | @use 'sass:color'; +a {b: color.adjust(blue, $blue: 300px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet @@ -133,12 +151,14 @@ Error: $blue: Expected 300px to be within -255 and 255. <===> ================================================================================ <===> saturation/too_low/input.scss -a {b: adjust-color(red, $saturation: -100.001%)} +@use 'sass:color'; +a {b: color.adjust(red, $saturation: -100.001%)} <===> saturation/too_low/error Error: $saturation: Expected -100.001% to be within -100% and 100%. , -1 | a {b: adjust-color(red, $saturation: -100.001%)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $saturation: -100.001%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -146,12 +166,14 @@ Error: $saturation: Expected -100.001% to be within -100% and 100%. <===> ================================================================================ <===> saturation/too_high/input.scss -a {b: adjust-color(red, $saturation: 100.001%)} +@use 'sass:color'; +a {b: color.adjust(red, $saturation: 100.001%)} <===> saturation/too_high/error Error: $saturation: Expected 100.001% to be within -100% and 100%. , -1 | a {b: adjust-color(red, $saturation: 100.001%)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $saturation: 100.001%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -161,7 +183,8 @@ Error: $saturation: Expected 100.001% to be within -100% and 100%. <===> saturation/unit/input.scss // This test covers sass/dart-sass#1745, but should be removed once units are // fully forbidden (sass/sass#3374). -a {b: adjust-color(red, $saturation: 200px)} +@use 'sass:color'; +a {b: color.adjust(red, $saturation: 200px)} <===> saturation/unit/error DEPRECATION WARNING: $saturation: Passing a number without unit % (200px) is deprecated. @@ -171,14 +194,16 @@ To preserve current behavior: calc($saturation / 1px * 1%) More info: https://sass-lang.com/d/function-units , -3 | a {b: adjust-color(red, $saturation: 200px)} +3 | @use 'sass:color'; +a {b: color.adjust(red, $saturation: 200px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet Error: $saturation: Expected 200px to be within -100% and 100%. , -3 | a {b: adjust-color(red, $saturation: 200px)} +3 | @use 'sass:color'; +a {b: color.adjust(red, $saturation: 200px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet @@ -186,12 +211,14 @@ Error: $saturation: Expected 200px to be within -100% and 100%. <===> ================================================================================ <===> lightness/too_low/input.scss -a {b: adjust-color(red, $lightness: -100.001%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: -100.001%)} <===> lightness/too_low/error Error: $lightness: Expected -100.001% to be within -100% and 100%. , -1 | a {b: adjust-color(red, $lightness: -100.001%)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $lightness: -100.001%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -199,12 +226,14 @@ Error: $lightness: Expected -100.001% to be within -100% and 100%. <===> ================================================================================ <===> lightness/too_high/input.scss -a {b: adjust-color(red, $lightness: 100.001%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 100.001%)} <===> lightness/too_high/error Error: $lightness: Expected 100.001% to be within -100% and 100%. , -1 | a {b: adjust-color(red, $lightness: 100.001%)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $lightness: 100.001%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -214,7 +243,8 @@ Error: $lightness: Expected 100.001% to be within -100% and 100%. <===> lightness/unit/input.scss // This test covers sass/dart-sass#1745, but should be removed once units are // fully forbidden (sass/sass#3374). -a {b: adjust-color(red, $lightness: 200px)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 200px)} <===> lightness/unit/error DEPRECATION WARNING: $lightness: Passing a number without unit % (200px) is deprecated. @@ -224,14 +254,16 @@ To preserve current behavior: calc($lightness / 1px * 1%) More info: https://sass-lang.com/d/function-units , -3 | a {b: adjust-color(red, $lightness: 200px)} +3 | @use 'sass:color'; +a {b: color.adjust(red, $lightness: 200px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet Error: $lightness: Expected 200px to be within -100% and 100%. , -3 | a {b: adjust-color(red, $lightness: 200px)} +3 | @use 'sass:color'; +a {b: color.adjust(red, $lightness: 200px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet @@ -239,12 +271,14 @@ Error: $lightness: Expected 200px to be within -100% and 100%. <===> ================================================================================ <===> alpha/too_low/input.scss -a {b: adjust-color(red, $alpha: -1.001)} +@use 'sass:color'; +a {b: color.adjust(red, $alpha: -1.001)} <===> alpha/too_low/error Error: $alpha: Expected -1.001 to be within -1 and 1. , -1 | a {b: adjust-color(red, $alpha: -1.001)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $alpha: -1.001)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -252,12 +286,14 @@ Error: $alpha: Expected -1.001 to be within -1 and 1. <===> ================================================================================ <===> alpha/too_high/input.scss -a {b: adjust-color(red, $alpha: 1.001)} +@use 'sass:color'; +a {b: color.adjust(red, $alpha: 1.001)} <===> alpha/too_high/error Error: $alpha: Expected 1.001 to be within -1 and 1. , -1 | a {b: adjust-color(red, $alpha: 1.001)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $alpha: 1.001)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -267,7 +303,8 @@ Error: $alpha: Expected 1.001 to be within -1 and 1. <===> alpha/unit/input.scss // This test covers sass/dart-sass#1745, but should be removed once units are // fully forbidden (sass/sass#3374). -a {b: adjust-color(red, $alpha: 50%)} +@use 'sass:color'; +a {b: color.adjust(red, $alpha: 50%)} <===> alpha/unit/error DEPRECATION WARNING: $alpha: Passing a number with unit % is deprecated. @@ -277,14 +314,16 @@ To preserve current behavior: calc($alpha / 1%) More info: https://sass-lang.com/d/function-units , -3 | a {b: adjust-color(red, $alpha: 50%)} +3 | @use 'sass:color'; +a {b: color.adjust(red, $alpha: 50%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet Error: $alpha: Expected 50% to be within -1 and 1. , -3 | a {b: adjust-color(red, $alpha: 50%)} +3 | @use 'sass:color'; +a {b: color.adjust(red, $alpha: 50%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet @@ -292,12 +331,14 @@ Error: $alpha: Expected 50% to be within -1 and 1. <===> ================================================================================ <===> blackness/too_low/input.scss -a {b: adjust-color(red, $blackness: -100.001%)} +@use 'sass:color'; +a {b: color.adjust(red, $blackness: -100.001%)} <===> blackness/too_low/error Error: $blackness: Expected -100.001% to be within -100% and 100%. , -1 | a {b: adjust-color(red, $blackness: -100.001%)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $blackness: -100.001%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -305,12 +346,14 @@ Error: $blackness: Expected -100.001% to be within -100% and 100%. <===> ================================================================================ <===> blackness/too_high/input.scss -a {b: adjust-color(red, $blackness: 100.001%)} +@use 'sass:color'; +a {b: color.adjust(red, $blackness: 100.001%)} <===> blackness/too_high/error Error: $blackness: Expected 100.001% to be within -100% and 100%. , -1 | a {b: adjust-color(red, $blackness: 100.001%)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $blackness: 100.001%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -318,12 +361,14 @@ Error: $blackness: Expected 100.001% to be within -100% and 100%. <===> ================================================================================ <===> whiteness/too_low/input.scss -a {b: adjust-color(red, $whiteness: -100.001%)} +@use 'sass:color'; +a {b: color.adjust(red, $whiteness: -100.001%)} <===> whiteness/too_low/error Error: $whiteness: Expected -100.001% to be within -100% and 100%. , -1 | a {b: adjust-color(red, $whiteness: -100.001%)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $whiteness: -100.001%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet @@ -331,12 +376,14 @@ Error: $whiteness: Expected -100.001% to be within -100% and 100%. <===> ================================================================================ <===> whiteness/too_high/input.scss -a {b: adjust-color(red, $whiteness: 100.001%)} +@use 'sass:color'; +a {b: color.adjust(red, $whiteness: 100.001%)} <===> whiteness/too_high/error Error: $whiteness: Expected 100.001% to be within -100% and 100%. , -1 | a {b: adjust-color(red, $whiteness: 100.001%)} +1 | @use 'sass:color'; +a {b: color.adjust(red, $whiteness: 100.001%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/adjust_color/error/mixed_formats.hrx b/spec/core_functions/color/adjust/error/mixed_formats.hrx similarity index 63% rename from spec/core_functions/color/adjust_color/error/mixed_formats.hrx rename to spec/core_functions/color/adjust/error/mixed_formats.hrx index 62970f6c91..9860d05cf1 100644 --- a/spec/core_functions/color/adjust_color/error/mixed_formats.hrx +++ b/spec/core_functions/color/adjust/error/mixed_formats.hrx @@ -1,88 +1,95 @@ <===> red_and_hue/input.scss -a {b: adjust-color(red, $red: 1, $hue: 1)} +@use 'sass:color'; +a {b: color.adjust(red, $red: 1, $hue: 1)} <===> red_and_hue/error Error: $hue: Color space rgb doesn't have a channel with this name. , -1 | a {b: adjust-color(red, $red: 1, $hue: 1)} +2 | a {b: color.adjust(red, $red: 1, $hue: 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> green_and_saturation/input.scss -a {b: adjust-color(red, $green: 1, $saturation: 1%)} +@use 'sass:color'; +a {b: color.adjust(red, $green: 1, $saturation: 1%)} <===> green_and_saturation/error Error: $saturation: Color space rgb doesn't have a channel with this name. , -1 | a {b: adjust-color(red, $green: 1, $saturation: 1%)} +2 | a {b: color.adjust(red, $green: 1, $saturation: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blue_and_lightness/input.scss -a {b: adjust-color(red, $blue: 1, $lightness: 1%)} +@use 'sass:color'; +a {b: color.adjust(red, $blue: 1, $lightness: 1%)} <===> blue_and_lightness/error Error: $lightness: Color space rgb doesn't have a channel with this name. , -1 | a {b: adjust-color(red, $blue: 1, $lightness: 1%)} +2 | a {b: color.adjust(red, $blue: 1, $lightness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> red_and_blackness/input.scss -a {b: adjust-color(red, $red: 1, $blackness: 1%)} +@use 'sass:color'; +a {b: color.adjust(red, $red: 1, $blackness: 1%)} <===> red_and_blackness/error Error: $blackness: Color space rgb doesn't have a channel with this name. , -1 | a {b: adjust-color(red, $red: 1, $blackness: 1%)} +2 | a {b: color.adjust(red, $red: 1, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> green_and_whiteness/input.scss -a {b: adjust-color(red, $green: 1, $whiteness: 1%)} +@use 'sass:color'; +a {b: color.adjust(red, $green: 1, $whiteness: 1%)} <===> green_and_whiteness/error Error: $whiteness: Color space rgb doesn't have a channel with this name. , -1 | a {b: adjust-color(red, $green: 1, $whiteness: 1%)} +2 | a {b: color.adjust(red, $green: 1, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> saturation_and_blackness/input.scss -a {b: adjust-color(red, $saturation: 1%, $blackness: 1%)} +@use 'sass:color'; +a {b: color.adjust(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error Error: $blackness: Color space hsl doesn't have a channel with this name. , -1 | a {b: adjust-color(red, $saturation: 1%, $blackness: 1%)} +2 | a {b: color.adjust(red, $saturation: 1%, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> lightness_and_whiteness/input.scss -a {b: adjust-color(red, $lightness: 1%, $whiteness: 1%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error Error: $whiteness: Color space hsl doesn't have a channel with this name. , -1 | a {b: adjust-color(red, $lightness: 1%, $whiteness: 1%)} +2 | a {b: color.adjust(red, $lightness: 1%, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust_color/error/type.hrx b/spec/core_functions/color/adjust/error/type.hrx similarity index 61% rename from spec/core_functions/color/adjust_color/error/type.hrx rename to spec/core_functions/color/adjust/error/type.hrx index bc9ed25415..c3339e881b 100644 --- a/spec/core_functions/color/adjust_color/error/type.hrx +++ b/spec/core_functions/color/adjust/error/type.hrx @@ -1,127 +1,137 @@ <===> color/input.scss -a {b: adjust-color(1)} +@use 'sass:color'; +a {b: color.adjust(1)} <===> color/error Error: $color: 1 is not a color. , -1 | a {b: adjust-color(1)} +2 | a {b: color.adjust(1)} | ^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> red/input.scss -a {b: adjust-color(red, $red: c)} +@use 'sass:color'; +a {b: color.adjust(red, $red: c)} <===> red/error Error: $red: c is not a number. , -1 | a {b: adjust-color(red, $red: c)} +2 | a {b: color.adjust(red, $red: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> green/input.scss -a {b: adjust-color(red, $green: c)} +@use 'sass:color'; +a {b: color.adjust(red, $green: c)} <===> green/error Error: $green: c is not a number. , -1 | a {b: adjust-color(red, $green: c)} +2 | a {b: color.adjust(red, $green: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blue/input.scss -a {b: adjust-color(red, $blue: c)} +@use 'sass:color'; +a {b: color.adjust(red, $blue: c)} <===> blue/error Error: $blue: c is not a number. , -1 | a {b: adjust-color(red, $blue: c)} +2 | a {b: color.adjust(red, $blue: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> hue/input.scss -a {b: adjust-color(red, $hue: c)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: c)} <===> hue/error Error: $hue: c is not a number. , -1 | a {b: adjust-color(red, $hue: c)} +2 | a {b: color.adjust(red, $hue: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> saturation/input.scss -a {b: adjust-color(red, $saturation: c)} +@use 'sass:color'; +a {b: color.adjust(red, $saturation: c)} <===> saturation/error Error: $saturation: c is not a number. , -1 | a {b: adjust-color(red, $saturation: c)} +2 | a {b: color.adjust(red, $saturation: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> lightness/input.scss -a {b: adjust-color(red, $lightness: c)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: c)} <===> lightness/error Error: $lightness: c is not a number. , -1 | a {b: adjust-color(red, $lightness: c)} +2 | a {b: color.adjust(red, $lightness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> alpha/input.scss -a {b: adjust-color(red, $alpha: c)} +@use 'sass:color'; +a {b: color.adjust(red, $alpha: c)} <===> alpha/error Error: $alpha: c is not a number. , -1 | a {b: adjust-color(red, $alpha: c)} +2 | a {b: color.adjust(red, $alpha: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blackness/input.scss -a {b: adjust-color(red, $blackness: c)} +@use 'sass:color'; +a {b: color.adjust(red, $blackness: c)} <===> blackness/error Error: $blackness: c is not a number. , -1 | a {b: adjust-color(red, $blackness: c)} +2 | a {b: color.adjust(red, $blackness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> whiteness/input.scss -a {b: adjust-color(red, $whiteness: c)} +@use 'sass:color'; +a {b: color.adjust(red, $whiteness: c)} <===> whiteness/error Error: $whiteness: c is not a number. , -1 | a {b: adjust-color(red, $whiteness: c)} +2 | a {b: color.adjust(red, $whiteness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust_color/error/units.hrx b/spec/core_functions/color/adjust/error/units.hrx similarity index 61% rename from spec/core_functions/color/adjust_color/error/units.hrx rename to spec/core_functions/color/adjust/error/units.hrx index 36be8eaced..13a4f62f08 100644 --- a/spec/core_functions/color/adjust_color/error/units.hrx +++ b/spec/core_functions/color/adjust/error/units.hrx @@ -1,50 +1,53 @@ <===> none/whiteness/input.scss -a {b: adjust-color(white, $whiteness: 1)} +@use 'sass:color'; +a {b: color.adjust(white, $whiteness: 1)} <===> none/whiteness/error Error: $whiteness: Expected 1 to have unit "%". , -1 | a {b: adjust-color(white, $whiteness: 1)} +2 | a {b: color.adjust(white, $whiteness: 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet - + input.scss 2:7 root stylesheet <===> ================================================================================ <===> none/blackness/input.scss -a {b: adjust-color(black, $blackness: 1)} +@use 'sass:color'; +a {b: color.adjust(black, $blackness: 1)} <===> none/blackness/error Error: $blackness: Expected 1 to have unit "%". , -1 | a {b: adjust-color(black, $blackness: 1)} +2 | a {b: color.adjust(black, $blackness: 1)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> wrong/whiteness/input.scss -a {b: adjust-color(white, $whiteness: 1px)} +@use 'sass:color'; +a {b: color.adjust(white, $whiteness: 1px)} <===> wrong/whiteness/error Error: $whiteness: Expected 1px to have unit "%". , -1 | a {b: adjust-color(white, $whiteness: 1px)} +2 | a {b: color.adjust(white, $whiteness: 1px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> wrong/blackness/input.scss -a {b: adjust-color(black, $blackness: 1px)} +@use 'sass:color'; +a {b: color.adjust(black, $blackness: 1px)} <===> wrong/blackness/error Error: $blackness: Expected 1px to have unit "%". , -1 | a {b: adjust-color(black, $blackness: 1px)} +2 | a {b: color.adjust(black, $blackness: 1px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/global.hrx b/spec/core_functions/color/adjust/global.hrx new file mode 100644 index 0000000000..d3e9f60e2b --- /dev/null +++ b/spec/core_functions/color/adjust/global.hrx @@ -0,0 +1,17 @@ +<===> legacy/input.scss +a {b: adjust-color(red, $red: -50)} + +<===> legacy/output.css +a { + b: #cd0000; +} + +<===> +================================================================================ +<===> non_legacy/input.scss +a {b: change-color(pink, $chroma: 0.01, $space: oklch)} + +<===> non_legacy/output.css +a { + b: rgb(217.7587670223, 208.8497864408, 210.1600909257); +} diff --git a/spec/core_functions/color/adjust_color/hsl.hrx b/spec/core_functions/color/adjust/hsl.hrx similarity index 72% rename from spec/core_functions/color/adjust_color/hsl.hrx rename to spec/core_functions/color/adjust/hsl.hrx index d860a08104..4b8509032f 100644 --- a/spec/core_functions/color/adjust_color/hsl.hrx +++ b/spec/core_functions/color/adjust/hsl.hrx @@ -1,5 +1,6 @@ <===> hue/max/input.scss -a {b: adjust-color(red, $hue: 359)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 359)} <===> hue/max/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> hue/above_max/input.scss -a {b: adjust-color(red, $hue: 540)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 540)} <===> hue/above_max/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> hue/min/input.scss -a {b: adjust-color(blue, $hue: 0)} +@use 'sass:color'; +a {b: color.adjust(blue, $hue: 0)} <===> hue/min/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> hue/negative/input.scss -a {b: adjust-color(red, $hue: -180)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: -180)} <===> hue/negative/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> hue/middle/input.scss -a {b: adjust-color(red, $hue: 123)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 123)} <===> hue/middle/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> hue/fraction/input.scss -a {b: adjust-color(red, $hue: 0.5)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 0.5)} <===> hue/fraction/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> saturation/max/input.scss -a {b: adjust-color(plum, $saturation: 100%)} +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: 100%)} <===> saturation/max/output.css a { @@ -69,7 +76,8 @@ a { <===> ================================================================================ <===> saturation/max_remaining/input.scss -a {b: adjust-color(plum, $saturation: 53%)} +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: 53%)} <===> saturation/max_remaining/output.css a { @@ -79,7 +87,8 @@ a { <===> ================================================================================ <===> saturation/zero/input.scss -a {b: adjust-color(plum, $saturation: 0%)} +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: 0%)} <===> saturation/zero/output.css a { @@ -89,7 +98,8 @@ a { <===> ================================================================================ <===> saturation/min/input.scss -a {b: adjust-color(plum, $saturation: -100%)} +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: -100%)} <===> saturation/min/output.css a { @@ -99,7 +109,8 @@ a { <===> ================================================================================ <===> saturation/min_remaining/input.scss -a {b: adjust-color(plum, $saturation: -48%)} +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: -48%)} <===> saturation/min_remaining/output.css a { @@ -109,7 +120,8 @@ a { <===> ================================================================================ <===> saturation/high/input.scss -a {b: adjust-color(plum, $saturation: 14%)} +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: 14%)} <===> saturation/high/output.css a { @@ -119,7 +131,8 @@ a { <===> ================================================================================ <===> saturation/low/input.scss -a {b: adjust-color(plum, $saturation: -14%)} +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: -14%)} <===> saturation/low/output.css a { @@ -129,7 +142,8 @@ a { <===> ================================================================================ <===> lightness/max/input.scss -a {b: adjust-color(red, $lightness: 100%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 100%)} <===> lightness/max/output.css a { @@ -139,7 +153,8 @@ a { <===> ================================================================================ <===> lightness/max_remaining/input.scss -a {b: adjust-color(red, $lightness: 50%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 50%)} <===> lightness/max_remaining/output.css a { @@ -149,7 +164,8 @@ a { <===> ================================================================================ <===> lightness/zero/input.scss -a {b: adjust-color(red, $lightness: 0%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 0%)} <===> lightness/zero/output.css a { @@ -159,7 +175,8 @@ a { <===> ================================================================================ <===> lightness/fraction/input.scss -a {b: adjust-color(red, $lightness: 0.5%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 0.5%)} <===> lightness/fraction/output.css a { @@ -169,7 +186,8 @@ a { <===> ================================================================================ <===> lightness/min/input.scss -a {b: adjust-color(red, $lightness: -100%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: -100%)} <===> lightness/min/output.css a { @@ -179,7 +197,8 @@ a { <===> ================================================================================ <===> lightness/min_remaining/input.scss -a {b: adjust-color(red, $lightness: -50%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: -50%)} <===> lightness/min_remaining/output.css a { @@ -189,7 +208,8 @@ a { <===> ================================================================================ <===> lightness/high/input.scss -a {b: adjust-color(red, $lightness: 14%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 14%)} <===> lightness/high/output.css a { @@ -199,7 +219,8 @@ a { <===> ================================================================================ <===> lightness/low/input.scss -a {b: adjust-color(red, $lightness: -14%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: -14%)} <===> lightness/low/output.css a { @@ -209,7 +230,8 @@ a { <===> ================================================================================ <===> all/input.scss -a {b: adjust-color(black, $hue: 12, $saturation: 24%, $lightness: 48%)} +@use 'sass:color'; +a {b: color.adjust(black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> all/output.css a { @@ -219,7 +241,15 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -a {b: adjust-color(rgba(black, 0.7), $hue: 12, $saturation: 24%, $lightness: 48%)} +@use 'sass:color'; +a { + b: color.adjust( + rgba(black, 0.7), + $hue: 12, + $saturation: 24%, + $lightness: 48% + ); +} <===> alpha_input/output.css a { @@ -229,7 +259,16 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -a {b: adjust-color(black, $hue: 12, $saturation: 24%, $lightness: 48%, $alpha: -0.7)} +@use 'sass:color'; +a { + b: color.adjust( + black, + $hue: 12, + $saturation: 24%, + $lightness: 48%, + $alpha: -0.7 + ); +} <===> alpha_arg/output.css a { @@ -240,7 +279,16 @@ a { ================================================================================ <===> alpha_arg_above_max/input.scss // Regression test for sass/dart-sass#708. -a {b: adjust-color(black, $hue: 12, $saturation: 24%, $lightness: 48%, $alpha: 0.7)} +@use 'sass:color'; +a { + b: color.adjust( + black, + $hue: 12, + $saturation: 24%, + $lightness: 48%, + $alpha: 0.7 + ); +} <===> alpha_arg_above_max/output.css a { @@ -250,7 +298,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: adjust-color($color: black, $hue: 12, $saturation: 24%, $lightness: 48%)} +@use 'sass:color'; +a {b: color.adjust($color: black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> named/output.css a { diff --git a/spec/core_functions/color/adjust_color/hwb.hrx b/spec/core_functions/color/adjust/hwb.hrx similarity index 70% rename from spec/core_functions/color/adjust_color/hwb.hrx rename to spec/core_functions/color/adjust/hwb.hrx index 4414f67412..1d0dcea541 100644 --- a/spec/core_functions/color/adjust_color/hwb.hrx +++ b/spec/core_functions/color/adjust/hwb.hrx @@ -1,5 +1,6 @@ <===> whiteness/max/input.scss -a {b: adjust-color(#cc6666, $whiteness: 100%)} +@use 'sass:color'; +a {b: color.adjust(#cc6666, $whiteness: 100%)} <===> whiteness/max/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> whiteness/max_remaining/input.scss -a {b: adjust-color(#cc6666, $whiteness: 60%)} +@use 'sass:color'; +a {b: color.adjust(#cc6666, $whiteness: 60%)} <===> whiteness/max_remaining/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> whiteness/zero/input.scss -a {b: adjust-color(#cc6666, $whiteness: 0%)} +@use 'sass:color'; +a {b: color.adjust(#cc6666, $whiteness: 0%)} <===> whiteness/zero/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> whiteness/min/input.scss -a {b: adjust-color(#cc6666, $whiteness: -100%)} +@use 'sass:color'; +a {b: color.adjust(#cc6666, $whiteness: -100%)} <===> whiteness/min/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> whiteness/min_remaining/input.scss -a {b: adjust-color(#cc6666, $whiteness: -40%)} +@use 'sass:color'; +a {b: color.adjust(#cc6666, $whiteness: -40%)} <===> whiteness/min_remaining/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> whiteness/high/input.scss -a {b: adjust-color(#cc6666, $whiteness: 40%)} +@use 'sass:color'; +a {b: color.adjust(#cc6666, $whiteness: 40%)} <===> whiteness/high/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> whiteness/low/input.scss -a {b: adjust-color(#cc6666, $whiteness: -20%)} +@use 'sass:color'; +a {b: color.adjust(#cc6666, $whiteness: -20%)} <===> whiteness/low/output.css a { @@ -69,7 +76,8 @@ a { <===> ================================================================================ <===> blackness/max/input.scss -a {b: adjust-color(#993333, $blackness: 100%)} +@use 'sass:color'; +a {b: color.adjust(#993333, $blackness: 100%)} <===> blackness/max/output.css a { @@ -79,7 +87,8 @@ a { <===> ================================================================================ <===> blackness/max_remaining/input.scss -a {b: adjust-color(#993333, $blackness: 60%)} +@use 'sass:color'; +a {b: color.adjust(#993333, $blackness: 60%)} <===> blackness/max_remaining/output.css a { @@ -89,7 +98,8 @@ a { <===> ================================================================================ <===> blackness/zero/input.scss -a {b: adjust-color(#993333, $blackness: 0%)} +@use 'sass:color'; +a {b: color.adjust(#993333, $blackness: 0%)} <===> blackness/zero/output.css a { @@ -99,7 +109,8 @@ a { <===> ================================================================================ <===> blackness/min/input.scss -a {b: adjust-color(#993333, $blackness: -100%)} +@use 'sass:color'; +a {b: color.adjust(#993333, $blackness: -100%)} <===> blackness/min/output.css a { @@ -109,7 +120,8 @@ a { <===> ================================================================================ <===> blackness/min_remaining/input.scss -a {b: adjust-color(#993333, $blackness: -40%)} +@use 'sass:color'; +a {b: color.adjust(#993333, $blackness: -40%)} <===> blackness/min_remaining/output.css a { @@ -119,7 +131,8 @@ a { <===> ================================================================================ <===> blackness/high/input.scss -a {b: adjust-color(#993333, $blackness: 40%)} +@use 'sass:color'; +a {b: color.adjust(#993333, $blackness: 40%)} <===> blackness/high/output.css a { @@ -129,7 +142,8 @@ a { <===> ================================================================================ <===> blackness/low/input.scss -a {b: adjust-color(#993333, $blackness: -20%)} +@use 'sass:color'; +a {b: color.adjust(#993333, $blackness: -20%)} <===> blackness/low/output.css a { @@ -139,7 +153,8 @@ a { <===> ================================================================================ <===> all/input.scss -a {b: adjust-color(red, $hue: 150, $whiteness: 20%, $blackness: 40%)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> all/output.css a { @@ -149,7 +164,8 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -a {b: adjust-color(rgba(red, 0.7), $hue: 150, $whiteness: 20%, $blackness: 40%)} +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.7), $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> alpha_input/output.css a { @@ -159,7 +175,16 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -a {b: adjust-color(red, $hue: 150, $whiteness: 20%, $blackness: 40%, $alpha: -0.7)} +@use 'sass:color'; +a { + b: color.adjust( + red, + $hue: 150, + $whiteness: 20%, + $blackness: 40%, + $alpha: -0.7 + ); +} <===> alpha_arg/output.css a { @@ -169,7 +194,16 @@ a { <===> ================================================================================ <===> alpha_arg_above_max/input.scss -a {b: adjust-color(red, $hue: 150, $whiteness: 20%, $blackness: 40%, $alpha: 0.7)} +@use 'sass:color'; +a { + b: color.adjust( + red, + $hue: 150, + $whiteness: 20%, + $blackness: 40%, + $alpha: 0.7 + ); +} <===> alpha_arg_above_max/output.css a { @@ -179,7 +213,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: adjust-color($color: red, $hue: 150, $whiteness: 20%, $blackness: 40%)} +@use 'sass:color'; +a {b: color.adjust($color: red, $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> named/output.css a { diff --git a/spec/core_functions/color/adjust_color/no_rgb_hsl.hrx b/spec/core_functions/color/adjust/no_rgb_hsl.hrx similarity index 71% rename from spec/core_functions/color/adjust_color/no_rgb_hsl.hrx rename to spec/core_functions/color/adjust/no_rgb_hsl.hrx index 8d26cb5315..7e891722ba 100644 --- a/spec/core_functions/color/adjust_color/no_rgb_hsl.hrx +++ b/spec/core_functions/color/adjust/no_rgb_hsl.hrx @@ -1,5 +1,6 @@ <===> positional/input.scss -a {b: adjust-color(red)} +@use 'sass:color'; +a {b: color.adjust(red)} <===> positional/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: adjust-color($color: red)} +@use 'sass:color'; +a {b: color.adjust($color: red)} <===> named/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> alpha/max/input.scss -a {b: adjust-color(rgba(red, 0.5), $alpha: 1)} +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: 1)} <===> alpha/max/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> alpha/max_remaining/input.scss -a {b: adjust-color(rgba(red, 0.5), $alpha: 0.5)} +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: 0.5)} <===> alpha/max_remaining/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> alpha/zero/input.scss -a {b: adjust-color(rgba(red, 0.5), $alpha: 0)} +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: 0)} <===> alpha/zero/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> alpha/min/input.scss -a {b: adjust-color(rgba(red, 0.5), $alpha: -1)} +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: -1)} <===> alpha/min/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> alpha/min_remaining/input.scss -a {b: adjust-color(rgba(red, 0.5), $alpha: -0.5)} +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: -0.5)} <===> alpha/min_remaining/output.css a { @@ -69,7 +76,8 @@ a { <===> ================================================================================ <===> alpha/high/input.scss -a {b: adjust-color(rgba(red, 0.5), $alpha: 0.14)} +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: 0.14)} <===> alpha/high/output.css a { @@ -79,7 +87,8 @@ a { <===> ================================================================================ <===> alpha/low/input.scss -a {b: adjust-color(rgba(red, 0.5), $alpha: -0.14)} +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: -0.14)} <===> alpha/low/output.css a { diff --git a/spec/core_functions/color/adjust_color/rgb.hrx b/spec/core_functions/color/adjust/rgb.hrx similarity index 71% rename from spec/core_functions/color/adjust_color/rgb.hrx rename to spec/core_functions/color/adjust/rgb.hrx index cba36d0536..4ef36cff9d 100644 --- a/spec/core_functions/color/adjust_color/rgb.hrx +++ b/spec/core_functions/color/adjust/rgb.hrx @@ -1,5 +1,6 @@ <===> red/max/input.scss -a {b: adjust-color(black, $red: 255)} +@use 'sass:color'; +a {b: color.adjust(black, $red: 255)} <===> red/max/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> red/min/input.scss -a {b: adjust-color(red, $red: -255)} +@use 'sass:color'; +a {b: color.adjust(red, $red: -255)} <===> red/min/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> red/zero/input.scss -a {b: adjust-color(black, $red: 0)} +@use 'sass:color'; +a {b: color.adjust(black, $red: 0)} <===> red/zero/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> red/low/input.scss -a {b: adjust-color(red, $red: -100)} +@use 'sass:color'; +a {b: color.adjust(red, $red: -100)} <===> red/low/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> red/high/input.scss -a {b: adjust-color(black, $red: 200)} +@use 'sass:color'; +a {b: color.adjust(black, $red: 200)} <===> red/high/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> green/max/input.scss -a {b: adjust-color(black, $green: 255)} +@use 'sass:color'; +a {b: color.adjust(black, $green: 255)} <===> green/max/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> green/min/input.scss -a {b: adjust-color(lime, $green: -255)} +@use 'sass:color'; +a {b: color.adjust(lime, $green: -255)} <===> green/min/output.css a { @@ -69,7 +76,8 @@ a { <===> ================================================================================ <===> green/zero/input.scss -a {b: adjust-color(black, $green: 0)} +@use 'sass:color'; +a {b: color.adjust(black, $green: 0)} <===> green/zero/output.css a { @@ -79,7 +87,8 @@ a { <===> ================================================================================ <===> green/low/input.scss -a {b: adjust-color(lime, $green: -100)} +@use 'sass:color'; +a {b: color.adjust(lime, $green: -100)} <===> green/low/output.css a { @@ -89,7 +98,8 @@ a { <===> ================================================================================ <===> green/high/input.scss -a {b: adjust-color(black, $green: 200)} +@use 'sass:color'; +a {b: color.adjust(black, $green: 200)} <===> green/high/output.css a { @@ -99,7 +109,8 @@ a { <===> ================================================================================ <===> blue/max/input.scss -a {b: adjust-color(black, $blue: 255)} +@use 'sass:color'; +a {b: color.adjust(black, $blue: 255)} <===> blue/max/output.css a { @@ -109,7 +120,8 @@ a { <===> ================================================================================ <===> blue/min/input.scss -a {b: adjust-color(blue, $blue: -255)} +@use 'sass:color'; +a {b: color.adjust(blue, $blue: -255)} <===> blue/min/output.css a { @@ -119,7 +131,8 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -a {b: adjust-color(black, $blue: 0)} +@use 'sass:color'; +a {b: color.adjust(black, $blue: 0)} <===> blue/zero/output.css a { @@ -129,7 +142,8 @@ a { <===> ================================================================================ <===> blue/low/input.scss -a {b: adjust-color(blue, $blue: -100)} +@use 'sass:color'; +a {b: color.adjust(blue, $blue: -100)} <===> blue/low/output.css a { @@ -139,7 +153,8 @@ a { <===> ================================================================================ <===> blue/high/input.scss -a {b: adjust-color(black, $blue: 200)} +@use 'sass:color'; +a {b: color.adjust(black, $blue: 200)} <===> blue/high/output.css a { @@ -149,7 +164,8 @@ a { <===> ================================================================================ <===> all/input.scss -a {b: adjust-color(black, $red: 12, $green: 24, $blue: 48)} +@use 'sass:color'; +a {b: color.adjust(black, $red: 12, $green: 24, $blue: 48)} <===> all/output.css a { @@ -159,7 +175,8 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -a {b: adjust-color(rgba(black, 0.3), $red: 12, $green: 24, $blue: 48)} +@use 'sass:color'; +a {b: color.adjust(rgba(black, 0.3), $red: 12, $green: 24, $blue: 48)} <===> alpha_input/output.css a { @@ -169,7 +186,8 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -a {b: adjust-color(black, $red: 12, $green: 24, $blue: 48, $alpha: -0.3)} +@use 'sass:color'; +a {b: color.adjust(black, $red: 12, $green: 24, $blue: 48, $alpha: -0.3)} <===> alpha_arg/output.css a { @@ -179,7 +197,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: adjust-color($color: black, $red: 12, $green: 24, $blue: 48)} +@use 'sass:color'; +a {b: color.adjust($color: black, $red: 12, $green: 24, $blue: 48)} <===> named/output.css a { diff --git a/spec/core_functions/color/adjust_color/units.hrx b/spec/core_functions/color/adjust/units.hrx similarity index 75% rename from spec/core_functions/color/adjust_color/units.hrx rename to spec/core_functions/color/adjust/units.hrx index c89d16b45d..c10683b97d 100644 --- a/spec/core_functions/color/adjust_color/units.hrx +++ b/spec/core_functions/color/adjust/units.hrx @@ -1,5 +1,6 @@ <===> hue/deg/input.scss -a {b: adjust-color(red, $hue: 60deg)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 60deg)} <===> hue/deg/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> hue/unitless/input.scss -a {b: adjust-color(red, $hue: 60)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 60)} <===> hue/unitless/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> hue/unknown/input.scss -a {b: adjust-color(red, $hue: 60in)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 60in)} <===> hue/unknown/output.css a { @@ -34,15 +37,16 @@ To preserve current behavior: calc($hue / 1in) See https://sass-lang.com/d/function-units , -1 | a {b: adjust-color(red, $hue: 60in)} +2 | a {b: color.adjust(red, $hue: 60in)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> hue/angle/input.scss -a {b: adjust-color(red, $hue: 60rad)} +@use 'sass:color'; +a {b: color.adjust(red, $hue: 60rad)} <===> hue/angle/output.css a { @@ -52,7 +56,8 @@ a { <===> ================================================================================ <===> saturation/percent/input.scss -a {b: adjust-color(red, $saturation: -10%)} +@use 'sass:color'; +a {b: color.adjust(red, $saturation: -10%)} <===> saturation/percent/output.css a { @@ -62,7 +67,8 @@ a { <===> ================================================================================ <===> saturation/unitless/input.scss -a {b: adjust-color(red, $saturation: -10)} +@use 'sass:color'; +a {b: color.adjust(red, $saturation: -10)} <===> saturation/unitless/output.css a { @@ -77,15 +83,16 @@ To preserve current behavior: $saturation * 1% More info: https://sass-lang.com/d/function-units , -1 | a {b: adjust-color(red, $saturation: -10)} +2 | a {b: color.adjust(red, $saturation: -10)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> saturation/unknown/input.scss -a {b: adjust-color(red, $saturation: -10in)} +@use 'sass:color'; +a {b: color.adjust(red, $saturation: -10in)} <===> saturation/unknown/output.css a { @@ -100,15 +107,16 @@ To preserve current behavior: calc($saturation / 1in * 1%) More info: https://sass-lang.com/d/function-units , -1 | a {b: adjust-color(red, $saturation: -10in)} +2 | a {b: color.adjust(red, $saturation: -10in)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> lightness/percent/input.scss -a {b: adjust-color(red, $lightness: 10%)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 10%)} <===> lightness/percent/output.css a { @@ -118,7 +126,8 @@ a { <===> ================================================================================ <===> lightness/unitless/input.scss -a {b: adjust-color(red, $lightness: 10)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 10)} <===> lightness/unitless/output.css a { @@ -133,15 +142,16 @@ To preserve current behavior: $lightness * 1% More info: https://sass-lang.com/d/function-units , -1 | a {b: adjust-color(red, $lightness: 10)} +2 | a {b: color.adjust(red, $lightness: 10)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> lightness/unknown/input.scss -a {b: adjust-color(red, $lightness: 10in)} +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 10in)} <===> lightness/unknown/output.css a { @@ -156,15 +166,16 @@ To preserve current behavior: calc($lightness / 1in * 1%) More info: https://sass-lang.com/d/function-units , -1 | a {b: adjust-color(red, $lightness: 10in)} +2 | a {b: color.adjust(red, $lightness: 10in)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> alpha/unitless/input.scss -a {b: adjust-color(red, $alpha: -0.3)} +@use 'sass:color'; +a {b: color.adjust(red, $alpha: -0.3)} <===> alpha/unitless/output.css a { @@ -174,7 +185,8 @@ a { <===> ================================================================================ <===> alpha/percent/input.scss -a {b: adjust-color(red, $alpha: -0.3%)} +@use 'sass:color'; +a {b: color.adjust(red, $alpha: -0.3%)} <===> alpha/percent/output.css a { @@ -189,15 +201,16 @@ To preserve current behavior: calc($alpha / 1%) More info: https://sass-lang.com/d/function-units , -1 | a {b: adjust-color(red, $alpha: -0.3%)} +2 | a {b: color.adjust(red, $alpha: -0.3%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> alpha/unknown/input.scss -a {b: adjust-color(red, $alpha: -0.3px)} +@use 'sass:color'; +a {b: color.adjust(red, $alpha: -0.3px)} <===> alpha/unknown/output.css a { @@ -212,7 +225,7 @@ To preserve current behavior: calc($alpha / 1px) More info: https://sass-lang.com/d/function-units , -1 | a {b: adjust-color(red, $alpha: -0.3px)} +2 | a {b: color.adjust(red, $alpha: -0.3px)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet From b693504157bb200553492d2fa10fba51d28c28a6 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Mon, 6 May 2024 14:04:30 -0700 Subject: [PATCH 35/45] Add tests for new color spaces --- spec/core_functions/color/adjust/a98_rgb.hrx | 228 ++++++++++++++++++ .../color/adjust/display_p3.hrx | 228 ++++++++++++++++++ spec/core_functions/color/adjust/hsl.hrx | 100 ++++++-- spec/core_functions/color/adjust/lab.hrx | 228 ++++++++++++++++++ spec/core_functions/color/adjust/lch.hrx | 184 ++++++++++++++ .../{no_rgb_hsl.hrx => no_channels.hrx} | 0 spec/core_functions/color/adjust/oklab.hrx | 228 ++++++++++++++++++ spec/core_functions/color/adjust/oklch.hrx | 184 ++++++++++++++ .../color/adjust/prophoto_rgb.hrx | 228 ++++++++++++++++++ spec/core_functions/color/adjust/rec2020.hrx | 228 ++++++++++++++++++ spec/core_functions/color/adjust/rgb.hrx | 132 ++++++++++ spec/core_functions/color/adjust/space.hrx | 8 + spec/core_functions/color/adjust/srgb.hrx | 228 ++++++++++++++++++ .../color/adjust/srgb_linear.hrx | 228 ++++++++++++++++++ spec/core_functions/color/adjust/xyz_d50.hrx | 228 ++++++++++++++++++ spec/core_functions/color/adjust/xyz_d65.hrx | 228 ++++++++++++++++++ 16 files changed, 2871 insertions(+), 17 deletions(-) create mode 100644 spec/core_functions/color/adjust/a98_rgb.hrx create mode 100644 spec/core_functions/color/adjust/display_p3.hrx create mode 100644 spec/core_functions/color/adjust/lab.hrx create mode 100644 spec/core_functions/color/adjust/lch.hrx rename spec/core_functions/color/adjust/{no_rgb_hsl.hrx => no_channels.hrx} (100%) create mode 100644 spec/core_functions/color/adjust/oklab.hrx create mode 100644 spec/core_functions/color/adjust/oklch.hrx create mode 100644 spec/core_functions/color/adjust/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/adjust/rec2020.hrx create mode 100644 spec/core_functions/color/adjust/space.hrx create mode 100644 spec/core_functions/color/adjust/srgb.hrx create mode 100644 spec/core_functions/color/adjust/srgb_linear.hrx create mode 100644 spec/core_functions/color/adjust/xyz_d50.hrx create mode 100644 spec/core_functions/color/adjust/xyz_d65.hrx diff --git a/spec/core_functions/color/adjust/a98_rgb.hrx b/spec/core_functions/color/adjust/a98_rgb.hrx new file mode 100644 index 0000000000..a1579e1742 --- /dev/null +++ b/spec/core_functions/color/adjust/a98_rgb.hrx @@ -0,0 +1,228 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(a98-rgb 0.7 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: -10%)} + +<===> red/percent/output.css +a { + b: color(a98-rgb 0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.9)} + +<===> red/above_max/output.css +a { + b: color(a98-rgb 1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: -0.3)} + +<===> red/below_min/output.css +a { + b: color(a98-rgb -0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 1.9)} + +<===> red/arg_above_max/output.css +a { + b: color(a98-rgb 2.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: -1.3)} + +<===> red/arg_below_min/output.css +a { + b: color(a98-rgb -1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: -0.3)} + +<===> green/unitless/output.css +a { + b: color(a98-rgb 0.2 0.2 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(a98-rgb 0.2 0.9 0.7); +} + +<===> +================================================================================ +<===> green/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 0.7)} + +<===> green/above_max/output.css +a { + b: color(a98-rgb 0.2 1.2 0.7); +} + +<===> +================================================================================ +<===> green/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: -0.8)} + +<===> green/below_min/output.css +a { + b: color(a98-rgb 0.2 -0.3 0.7); +} + +<===> +================================================================================ +<===> green/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 1.7)} + +<===> green/arg_above_max/output.css +a { + b: color(a98-rgb 0.2 2.2 0.7); +} + +<===> +================================================================================ +<===> green/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: -1.8)} + +<===> green/arg_below_min/output.css +a { + b: color(a98-rgb 0.2 -1.3 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: -0.3)} + +<===> blue/unitless/output.css +a { + b: color(a98-rgb 0.2 0.5 0.4); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 20%)} + +<===> blue/percent/output.css +a { + b: color(a98-rgb 0.2 0.5 0.9); +} + +<===> +================================================================================ +<===> blue/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 0.7)} + +<===> blue/above_max/output.css +a { + b: color(a98-rgb 0.2 0.5 1.4); +} + +<===> +================================================================================ +<===> blue/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: -0.8)} + +<===> blue/below_min/output.css +a { + b: color(a98-rgb 0.2 0.5 -0.1); +} + +<===> +================================================================================ +<===> blue/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 1.7)} + +<===> blue/arg_above_max/output.css +a { + b: color(a98-rgb 0.2 0.5 2.4); +} + +<===> +================================================================================ +<===> blue/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: -1.8)} + +<===> blue/arg_below_min/output.css +a { + b: color(a98-rgb 0.2 0.5 -1.1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} + +<===> all/output.css +a { + b: color(a98-rgb 0.5 0.7 0.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(a98-rgb 0.7 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: color(a98-rgb 0.7 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/adjust/display_p3.hrx b/spec/core_functions/color/adjust/display_p3.hrx new file mode 100644 index 0000000000..417f5707ec --- /dev/null +++ b/spec/core_functions/color/adjust/display_p3.hrx @@ -0,0 +1,228 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(display-p3 0.7 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: -10%)} + +<===> red/percent/output.css +a { + b: color(display-p3 0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.9)} + +<===> red/above_max/output.css +a { + b: color(display-p3 1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: -0.3)} + +<===> red/below_min/output.css +a { + b: color(display-p3 -0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 1.9)} + +<===> red/arg_above_max/output.css +a { + b: color(display-p3 2.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: -1.3)} + +<===> red/arg_below_min/output.css +a { + b: color(display-p3 -1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: -0.3)} + +<===> green/unitless/output.css +a { + b: color(display-p3 0.2 0.2 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(display-p3 0.2 0.9 0.7); +} + +<===> +================================================================================ +<===> green/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 0.7)} + +<===> green/above_max/output.css +a { + b: color(display-p3 0.2 1.2 0.7); +} + +<===> +================================================================================ +<===> green/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: -0.8)} + +<===> green/below_min/output.css +a { + b: color(display-p3 0.2 -0.3 0.7); +} + +<===> +================================================================================ +<===> green/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 1.7)} + +<===> green/arg_above_max/output.css +a { + b: color(display-p3 0.2 2.2 0.7); +} + +<===> +================================================================================ +<===> green/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: -1.8)} + +<===> green/arg_below_min/output.css +a { + b: color(display-p3 0.2 -1.3 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: -0.3)} + +<===> blue/unitless/output.css +a { + b: color(display-p3 0.2 0.5 0.4); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 20%)} + +<===> blue/percent/output.css +a { + b: color(display-p3 0.2 0.5 0.9); +} + +<===> +================================================================================ +<===> blue/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 0.7)} + +<===> blue/above_max/output.css +a { + b: color(display-p3 0.2 0.5 1.4); +} + +<===> +================================================================================ +<===> blue/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: -0.8)} + +<===> blue/below_min/output.css +a { + b: color(display-p3 0.2 0.5 -0.1); +} + +<===> +================================================================================ +<===> blue/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 1.7)} + +<===> blue/arg_above_max/output.css +a { + b: color(display-p3 0.2 0.5 2.4); +} + +<===> +================================================================================ +<===> blue/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: -1.8)} + +<===> blue/arg_below_min/output.css +a { + b: color(display-p3 0.2 0.5 -1.1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} + +<===> all/output.css +a { + b: color(display-p3 0.5 0.7 0.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(display-p3 0.7 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: color(display-p3 0.7 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/adjust/hsl.hrx b/spec/core_functions/color/adjust/hsl.hrx index 4b8509032f..06763c4ef0 100644 --- a/spec/core_functions/color/adjust/hsl.hrx +++ b/spec/core_functions/color/adjust/hsl.hrx @@ -9,11 +9,11 @@ a { <===> ================================================================================ -<===> hue/above_max/input.scss +<===> hue/arg_above_max/input.scss @use 'sass:color'; a {b: color.adjust(red, $hue: 540)} -<===> hue/above_max/output.css +<===> hue/arg_above_max/output.css a { b: aqua; } @@ -62,17 +62,6 @@ a { b: rgb(255, 2.125, 0); } -<===> -================================================================================ -<===> saturation/max/input.scss -@use 'sass:color'; -a {b: color.adjust(plum, $saturation: 100%)} - -<===> saturation/max/output.css -a { - b: hsl(300, 147.2868217054%, 74.7058823529%); -} - <===> ================================================================================ <===> saturation/max_remaining/input.scss @@ -141,13 +130,46 @@ a { <===> ================================================================================ -<===> lightness/max/input.scss +<===> saturation/above_max/input.scss @use 'sass:color'; -a {b: color.adjust(red, $lightness: 100%)} +a {b: color.adjust(plum, $saturation: 100%)} -<===> lightness/max/output.css +<===> saturation/above_max/output.css a { - b: hsl(0, 100%, 150%); + b: hsl(300, 147.2868217054%, 74.7058823529%); +} + +<===> +================================================================================ +<===> saturation/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: -100%)} + +<===> saturation/below_min/output.css +a { + b: rgb(190.5, 190.5, 190.5); +} + +<===> +================================================================================ +<===> saturation/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: 200%)} + +<===> saturation/arg_above_max/output.css +a { + b: hsl(300, 247.2868217054%, 74.7058823529%); +} + +<===> +================================================================================ +<===> saturation/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(plum, $saturation: -200%)} + +<===> saturation/arg_below_min/output.css +a { + b: rgb(190.5, 190.5, 190.5); } <===> @@ -227,6 +249,50 @@ a { b: rgb(183.6, 0, 0); } +<===> +================================================================================ +<===> lightness/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 100%)} + +<===> lightness/above_max/output.css +a { + b: hsl(0, 100%, 150%); +} + +<===> +================================================================================ +<===> lightness/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(plum, $lightness: -100%)} + +<===> lightness/below_min/output.css +a { + b: hsl(300, 47.2868217054%, -25.2941176471%); +} + +<===> +================================================================================ +<===> lightness/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(red, $lightness: 200%)} + +<===> lightness/arg_above_max/output.css +a { + b: hsl(0, 100%, 250%); +} + +<===> +================================================================================ +<===> lightness/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(plum, $lightness: -200%)} + +<===> lightness/arg_below_min/output.css +a { + b: hsl(300, 47.2868217054%, -125.2941176471%); +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/adjust/lab.hrx b/spec/core_functions/color/adjust/lab.hrx new file mode 100644 index 0000000000..f6386fbd98 --- /dev/null +++ b/spec/core_functions/color/adjust/lab.hrx @@ -0,0 +1,228 @@ +<===> lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $lightness: 50)} + +<===> lightness/unitless/output.css +a { + b: lab(80% 60 -100); +} + +<===> +================================================================================ +<===> lightness/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $lightness: -10%)} + +<===> lightness/percent/output.css +a { + b: lab(20% 60 -100); +} + +<===> +================================================================================ +<===> lightness/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $lightness: 90)} + +<===> lightness/above_max/output.css +a { + b: lab(100% 60 -100); +} + +<===> +================================================================================ +<===> lightness/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $lightness: -40%)} + +<===> lightness/below_min/output.css +a { + b: lab(0% 60 -100); +} + +<===> +================================================================================ +<===> lightness/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $lightness: 120%)} + +<===> lightness/arg_above_max/output.css +a { + b: lab(100% 60 -100); +} + +<===> +================================================================================ +<===> lightness/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $lightness: -130%)} + +<===> lightness/arg_below_min/output.css +a { + b: lab(0% 60 -100); +} + +<===> +================================================================================ +<===> a/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $a: -30)} + +<===> a/unitless/output.css +a { + b: lab(30% 30 -100); +} + +<===> +================================================================================ +<===> a/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $a: 40%)} + +<===> a/percent/output.css +a { + b: lab(30% 110 -100); +} + +<===> +================================================================================ +<===> a/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $a: 70)} + +<===> a/above_max/output.css +a { + b: lab(30% 130 -100); +} + +<===> +================================================================================ +<===> a/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $a: -200)} + +<===> a/below_min/output.css +a { + b: lab(30% -140 -100); +} + +<===> +================================================================================ +<===> a/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $a: 130)} + +<===> a/arg_above_max/output.css +a { + b: lab(30% 190 -100); +} + +<===> +================================================================================ +<===> a/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $a: -500)} + +<===> a/arg_below_min/output.css +a { + b: lab(30% -440 -100); +} + +<===> +================================================================================ +<===> b/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $b: -30)} + +<===> b/unitless/output.css +a { + b: lab(30% 60 -130); +} + +<===> +================================================================================ +<===> b/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $b: 20%)} + +<===> b/percent/output.css +a { + b: lab(30% 60 -75); +} + +<===> +================================================================================ +<===> b/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $b: 70)} + +<===> b/above_max/output.css +a { + b: lab(30% 60 -30); +} + +<===> +================================================================================ +<===> b/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $b: -80)} + +<===> b/below_min/output.css +a { + b: lab(30% 60 -180); +} + +<===> +================================================================================ +<===> b/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $b: 500)} + +<===> b/arg_above_max/output.css +a { + b: lab(30% 60 400); +} + +<===> +================================================================================ +<===> b/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $b: -500)} + +<===> b/arg_below_min/output.css +a { + b: lab(30% 60 -600); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $lightness: 40%, $a: 50, $b: 60)} + +<===> all/output.css +a { + b: lab(70% 110 -40); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100 / 0.9), $lightness: 50%)} + +<===> alpha_input/output.css +a { + b: lab(80% 60 -100 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(30% 60 -100), $lightness: 50%, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: lab(80% 60 -100 / 0.9); +} diff --git a/spec/core_functions/color/adjust/lch.hrx b/spec/core_functions/color/adjust/lch.hrx new file mode 100644 index 0000000000..ae05ef0a33 --- /dev/null +++ b/spec/core_functions/color/adjust/lch.hrx @@ -0,0 +1,184 @@ +<===> lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $lightness: 50)} + +<===> lightness/unitless/output.css +a { + b: lch(80% 60 180deg); +} + +<===> +================================================================================ +<===> lightness/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $lightness: -10%)} + +<===> lightness/percent/output.css +a { + b: lch(20% 60 180deg); +} + +<===> +================================================================================ +<===> lightness/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $lightness: 90)} + +<===> lightness/above_max/output.css +a { + b: lch(100% 60 180deg); +} + +<===> +================================================================================ +<===> lightness/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $lightness: -40%)} + +<===> lightness/below_min/output.css +a { + b: lch(0% 60 180deg); +} + +<===> +================================================================================ +<===> lightness/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $lightness: 120%)} + +<===> lightness/arg_above_max/output.css +a { + b: lch(100% 60 180deg); +} + +<===> +================================================================================ +<===> lightness/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $lightness: -130%)} + +<===> lightness/arg_below_min/output.css +a { + b: lch(0% 60 180deg); +} + +<===> +================================================================================ +<===> chroma/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $chroma: -30)} + +<===> chroma/unitless/output.css +a { + b: lch(30% 30 180deg); +} + +<===> +================================================================================ +<===> chroma/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $chroma: 40%)} + +<===> chroma/percent/output.css +a { + b: lch(30% 120 180deg); +} + +<===> +================================================================================ +<===> chroma/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $chroma: 100)} + +<===> chroma/above_max/output.css +a { + b: lch(30% 160 180deg); +} + +<===> +================================================================================ +<===> chroma/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $chroma: -100)} + +<===> chroma/below_min/output.css +a { + b: lch(30% 0 180deg); +} + +<===> +================================================================================ +<===> chroma/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $chroma: 200)} + +<===> chroma/arg_above_max/output.css +a { + b: lch(30% 260 180deg); +} + +<===> +================================================================================ +<===> chroma/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $chroma: -200)} + +<===> chroma/arg_below_min/output.css +a { + b: lch(30% 0 180deg); +} + +<===> +================================================================================ +<===> hue/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $hue: -30)} + +<===> hue/unitless/output.css +a { + b: lch(30% 60 150deg); +} + +<===> +================================================================================ +<===> hue/turn/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $hue: 0.5turn)} + +<===> hue/turn/output.css +a { + b: lch(30% 60 0deg); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $lightness: 40%, $chroma: 50, $hue: 60)} + +<===> all/output.css +a { + b: lch(70% 110 240deg); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg / 0.9), $lightness: 50%)} + +<===> alpha_input/output.css +a { + b: lch(80% 60 180deg / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(30% 60 180deg), $lightness: 50%, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: lch(80% 60 180deg / 0.9); +} diff --git a/spec/core_functions/color/adjust/no_rgb_hsl.hrx b/spec/core_functions/color/adjust/no_channels.hrx similarity index 100% rename from spec/core_functions/color/adjust/no_rgb_hsl.hrx rename to spec/core_functions/color/adjust/no_channels.hrx diff --git a/spec/core_functions/color/adjust/oklab.hrx b/spec/core_functions/color/adjust/oklab.hrx new file mode 100644 index 0000000000..ad67317ffa --- /dev/null +++ b/spec/core_functions/color/adjust/oklab.hrx @@ -0,0 +1,228 @@ +<===> lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 0.5)} + +<===> lightness/unitless/output.css +a { + b: oklab(80% 0.1 -0.3); +} + +<===> +================================================================================ +<===> lightness/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: -10%)} + +<===> lightness/percent/output.css +a { + b: oklab(20% 0.1 -0.3); +} + +<===> +================================================================================ +<===> lightness/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 0.9)} + +<===> lightness/above_max/output.css +a { + b: oklab(100% 0.1 -0.3); +} + +<===> +================================================================================ +<===> lightness/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: -40%)} + +<===> lightness/below_min/output.css +a { + b: oklab(0% 0.1 -0.3); +} + +<===> +================================================================================ +<===> lightness/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 120%)} + +<===> lightness/arg_above_max/output.css +a { + b: oklab(100% 0.1 -0.3); +} + +<===> +================================================================================ +<===> lightness/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: -130%)} + +<===> lightness/arg_below_min/output.css +a { + b: oklab(0% 0.1 -0.3); +} + +<===> +================================================================================ +<===> a/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $a: -0.2)} + +<===> a/unitless/output.css +a { + b: oklab(30% -0.1 -0.3); +} + +<===> +================================================================================ +<===> a/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $a: 40%)} + +<===> a/percent/output.css +a { + b: oklab(30% 0.26 -0.3); +} + +<===> +================================================================================ +<===> a/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $a: 0.7)} + +<===> a/above_max/output.css +a { + b: oklab(30% 0.8 -0.3); +} + +<===> +================================================================================ +<===> a/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $a: -0.6)} + +<===> a/below_min/output.css +a { + b: oklab(30% -0.5 -0.3); +} + +<===> +================================================================================ +<===> a/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $a: 1)} + +<===> a/arg_above_max/output.css +a { + b: oklab(30% 1.1 -0.3); +} + +<===> +================================================================================ +<===> a/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $a: -1)} + +<===> a/arg_below_min/output.css +a { + b: oklab(30% -0.9 -0.3); +} + +<===> +================================================================================ +<===> b/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $b: -0.05)} + +<===> b/unitless/output.css +a { + b: oklab(30% 0.1 -0.35); +} + +<===> +================================================================================ +<===> b/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $b: 20%)} + +<===> b/percent/output.css +a { + b: oklab(30% 0.1 -0.22); +} + +<===> +================================================================================ +<===> b/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $b: 0.8)} + +<===> b/above_max/output.css +a { + b: oklab(30% 0.1 0.5); +} + +<===> +================================================================================ +<===> b/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $b: -0.2)} + +<===> b/below_min/output.css +a { + b: oklab(30% 0.1 -0.5); +} + +<===> +================================================================================ +<===> b/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $b: 1)} + +<===> b/arg_above_max/output.css +a { + b: oklab(30% 0.1 0.7); +} + +<===> +================================================================================ +<===> b/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $b: -1)} + +<===> b/arg_below_min/output.css +a { + b: oklab(30% 0.1 -1.3); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 40%, $a: 0.2, $b: 0.3)} + +<===> all/output.css +a { + b: oklab(70% 0.3 0); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3 / 0.9), $lightness: 50%)} + +<===> alpha_input/output.css +a { + b: oklab(80% 0.1 -0.3 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 50%, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: oklab(80% 0.1 -0.3 / 0.9); +} diff --git a/spec/core_functions/color/adjust/oklch.hrx b/spec/core_functions/color/adjust/oklch.hrx new file mode 100644 index 0000000000..d264b84158 --- /dev/null +++ b/spec/core_functions/color/adjust/oklch.hrx @@ -0,0 +1,184 @@ +<===> lightness/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 0.5)} + +<===> lightness/unitless/output.css +a { + b: oklch(80% 0.15 180deg); +} + +<===> +================================================================================ +<===> lightness/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: -10%)} + +<===> lightness/percent/output.css +a { + b: oklch(20% 0.15 180deg); +} + +<===> +================================================================================ +<===> lightness/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 0.9)} + +<===> lightness/above_max/output.css +a { + b: oklch(100% 0.15 180deg); +} + +<===> +================================================================================ +<===> lightness/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: -40%)} + +<===> lightness/below_min/output.css +a { + b: oklch(0% 0.15 180deg); +} + +<===> +================================================================================ +<===> lightness/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 120%)} + +<===> lightness/arg_above_max/output.css +a { + b: oklch(100% 0.15 180deg); +} + +<===> +================================================================================ +<===> lightness/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: -130%)} + +<===> lightness/arg_below_min/output.css +a { + b: oklch(0% 0.15 180deg); +} + +<===> +================================================================================ +<===> chroma/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: -0.1)} + +<===> chroma/unitless/output.css +a { + b: oklch(30% 0.05 180deg); +} + +<===> +================================================================================ +<===> chroma/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: 40%)} + +<===> chroma/percent/output.css +a { + b: oklch(30% 0.31 180deg); +} + +<===> +================================================================================ +<===> chroma/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: 0.3)} + +<===> chroma/above_max/output.css +a { + b: oklch(30% 0.45 180deg); +} + +<===> +================================================================================ +<===> chroma/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: -0.2)} + +<===> chroma/below_min/output.css +a { + b: oklch(30% 0 180deg); +} + +<===> +================================================================================ +<===> chroma/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: 1)} + +<===> chroma/arg_above_max/output.css +a { + b: oklch(30% 1.15 180deg); +} + +<===> +================================================================================ +<===> chroma/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: -1)} + +<===> chroma/arg_below_min/output.css +a { + b: oklch(30% 0 180deg); +} + +<===> +================================================================================ +<===> hue/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $hue: -30)} + +<===> hue/unitless/output.css +a { + b: oklch(30% 0.15 150deg); +} + +<===> +================================================================================ +<===> hue/turn/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $hue: 0.5turn)} + +<===> hue/turn/output.css +a { + b: oklch(30% 0.15 0deg); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 40%, $chroma: 0.2, $hue: 60)} + +<===> all/output.css +a { + b: oklch(70% 0.35 240deg); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg / 0.9), $lightness: 50%)} + +<===> alpha_input/output.css +a { + b: oklch(80% 0.15 180deg / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 50%, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: oklch(80% 0.15 180deg / 0.9); +} diff --git a/spec/core_functions/color/adjust/prophoto_rgb.hrx b/spec/core_functions/color/adjust/prophoto_rgb.hrx new file mode 100644 index 0000000000..ad17a1163c --- /dev/null +++ b/spec/core_functions/color/adjust/prophoto_rgb.hrx @@ -0,0 +1,228 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(prophoto-rgb 0.7 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: -10%)} + +<===> red/percent/output.css +a { + b: color(prophoto-rgb 0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.9)} + +<===> red/above_max/output.css +a { + b: color(prophoto-rgb 1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: -0.3)} + +<===> red/below_min/output.css +a { + b: color(prophoto-rgb -0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 1.9)} + +<===> red/arg_above_max/output.css +a { + b: color(prophoto-rgb 2.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: -1.3)} + +<===> red/arg_below_min/output.css +a { + b: color(prophoto-rgb -1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: -0.3)} + +<===> green/unitless/output.css +a { + b: color(prophoto-rgb 0.2 0.2 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(prophoto-rgb 0.2 0.9 0.7); +} + +<===> +================================================================================ +<===> green/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.7)} + +<===> green/above_max/output.css +a { + b: color(prophoto-rgb 0.2 1.2 0.7); +} + +<===> +================================================================================ +<===> green/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: -0.8)} + +<===> green/below_min/output.css +a { + b: color(prophoto-rgb 0.2 -0.3 0.7); +} + +<===> +================================================================================ +<===> green/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 1.7)} + +<===> green/arg_above_max/output.css +a { + b: color(prophoto-rgb 0.2 2.2 0.7); +} + +<===> +================================================================================ +<===> green/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: -1.8)} + +<===> green/arg_below_min/output.css +a { + b: color(prophoto-rgb 0.2 -1.3 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: -0.3)} + +<===> blue/unitless/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.4); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 20%)} + +<===> blue/percent/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.9); +} + +<===> +================================================================================ +<===> blue/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.7)} + +<===> blue/above_max/output.css +a { + b: color(prophoto-rgb 0.2 0.5 1.4); +} + +<===> +================================================================================ +<===> blue/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: -0.8)} + +<===> blue/below_min/output.css +a { + b: color(prophoto-rgb 0.2 0.5 -0.1); +} + +<===> +================================================================================ +<===> blue/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 1.7)} + +<===> blue/arg_above_max/output.css +a { + b: color(prophoto-rgb 0.2 0.5 2.4); +} + +<===> +================================================================================ +<===> blue/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: -1.8)} + +<===> blue/arg_below_min/output.css +a { + b: color(prophoto-rgb 0.2 0.5 -1.1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} + +<===> all/output.css +a { + b: color(prophoto-rgb 0.5 0.7 0.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(prophoto-rgb 0.7 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: color(prophoto-rgb 0.7 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/adjust/rec2020.hrx b/spec/core_functions/color/adjust/rec2020.hrx new file mode 100644 index 0000000000..bc20b2a780 --- /dev/null +++ b/spec/core_functions/color/adjust/rec2020.hrx @@ -0,0 +1,228 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(rec2020 0.7 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: -10%)} + +<===> red/percent/output.css +a { + b: color(rec2020 0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.9)} + +<===> red/above_max/output.css +a { + b: color(rec2020 1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: -0.3)} + +<===> red/below_min/output.css +a { + b: color(rec2020 -0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 1.9)} + +<===> red/arg_above_max/output.css +a { + b: color(rec2020 2.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: -1.3)} + +<===> red/arg_below_min/output.css +a { + b: color(rec2020 -1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: -0.3)} + +<===> green/unitless/output.css +a { + b: color(rec2020 0.2 0.2 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(rec2020 0.2 0.9 0.7); +} + +<===> +================================================================================ +<===> green/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 0.7)} + +<===> green/above_max/output.css +a { + b: color(rec2020 0.2 1.2 0.7); +} + +<===> +================================================================================ +<===> green/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: -0.8)} + +<===> green/below_min/output.css +a { + b: color(rec2020 0.2 -0.3 0.7); +} + +<===> +================================================================================ +<===> green/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 1.7)} + +<===> green/arg_above_max/output.css +a { + b: color(rec2020 0.2 2.2 0.7); +} + +<===> +================================================================================ +<===> green/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: -1.8)} + +<===> green/arg_below_min/output.css +a { + b: color(rec2020 0.2 -1.3 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: -0.3)} + +<===> blue/unitless/output.css +a { + b: color(rec2020 0.2 0.5 0.4); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 20%)} + +<===> blue/percent/output.css +a { + b: color(rec2020 0.2 0.5 0.9); +} + +<===> +================================================================================ +<===> blue/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 0.7)} + +<===> blue/above_max/output.css +a { + b: color(rec2020 0.2 0.5 1.4); +} + +<===> +================================================================================ +<===> blue/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: -0.8)} + +<===> blue/below_min/output.css +a { + b: color(rec2020 0.2 0.5 -0.1); +} + +<===> +================================================================================ +<===> blue/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 1.7)} + +<===> blue/arg_above_max/output.css +a { + b: color(rec2020 0.2 0.5 2.4); +} + +<===> +================================================================================ +<===> blue/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: -1.8)} + +<===> blue/arg_below_min/output.css +a { + b: color(rec2020 0.2 0.5 -1.1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} + +<===> all/output.css +a { + b: color(rec2020 0.5 0.7 0.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(rec2020 0.7 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: color(rec2020 0.7 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/adjust/rgb.hrx b/spec/core_functions/color/adjust/rgb.hrx index 4ef36cff9d..e3b4c9a08a 100644 --- a/spec/core_functions/color/adjust/rgb.hrx +++ b/spec/core_functions/color/adjust/rgb.hrx @@ -51,6 +51,50 @@ a { b: #c80000; } +<===> +================================================================================ +<===> red/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(#abcdef, $red: 200)} + +<===> red/above_max/output.css +a { + b: #ffcdef; +} + +<===> +================================================================================ +<===> red/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(#abcdef, $red: -200)} + +<===> red/below_min/output.css +a { + b: #00cdef; +} + +<===> +================================================================================ +<===> red/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(#abcdef, $red: 500)} + +<===> red/arg_above_max/output.css +a { + b: #ffcdef; +} + +<===> +================================================================================ +<===> red/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(#abcdef, $red: -500)} + +<===> red/arg_below_min/output.css +a { + b: #00cdef; +} + <===> ================================================================================ <===> green/max/input.scss @@ -106,6 +150,50 @@ a { b: #00c800; } +<===> +================================================================================ +<===> green/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(#abcdef, $green: 200)} + +<===> green/above_max/output.css +a { + b: #abffef; +} + +<===> +================================================================================ +<===> green/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(#abcdef, $green: -210)} + +<===> green/below_min/output.css +a { + b: #ab00ef; +} + +<===> +================================================================================ +<===> green/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(#abcdef, $green: 500)} + +<===> green/arg_above_max/output.css +a { + b: #abffef; +} + +<===> +================================================================================ +<===> green/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(#abcdef, $green: -500)} + +<===> green/arg_below_min/output.css +a { + b: #ab00ef; +} + <===> ================================================================================ <===> blue/max/input.scss @@ -161,6 +249,50 @@ a { b: #0000c8; } +<===> +================================================================================ +<===> blue/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(#fedcba, $blue: 200)} + +<===> blue/above_max/output.css +a { + b: #fedcff; +} + +<===> +================================================================================ +<===> blue/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(#fedcba, $blue: -200)} + +<===> blue/below_min/output.css +a { + b: #fedc00; +} + +<===> +================================================================================ +<===> blue/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(#fedcba, $blue: 500)} + +<===> blue/arg_above_max/output.css +a { + b: #fedcff; +} + +<===> +================================================================================ +<===> blue/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(#fedcba, $blue: -500)} + +<===> blue/arg_below_min/output.css +a { + b: #fedc00; +} + <===> ================================================================================ <===> all/input.scss diff --git a/spec/core_functions/color/adjust/space.hrx b/spec/core_functions/color/adjust/space.hrx new file mode 100644 index 0000000000..e94266928d --- /dev/null +++ b/spec/core_functions/color/adjust/space.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.adjust(pink, $chroma: -0.01, $space: oklch)} + +<===> output.css +a { + b: rgb(249.5073873455, 194.8272088475, 204.1290090118); +} diff --git a/spec/core_functions/color/adjust/srgb.hrx b/spec/core_functions/color/adjust/srgb.hrx new file mode 100644 index 0000000000..4520d0956e --- /dev/null +++ b/spec/core_functions/color/adjust/srgb.hrx @@ -0,0 +1,228 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(srgb 0.7 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: -10%)} + +<===> red/percent/output.css +a { + b: color(srgb 0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.9)} + +<===> red/above_max/output.css +a { + b: color(srgb 1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: -0.3)} + +<===> red/below_min/output.css +a { + b: color(srgb -0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 1.9)} + +<===> red/arg_above_max/output.css +a { + b: color(srgb 2.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: -1.3)} + +<===> red/arg_below_min/output.css +a { + b: color(srgb -1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: -0.3)} + +<===> green/unitless/output.css +a { + b: color(srgb 0.2 0.2 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(srgb 0.2 0.9 0.7); +} + +<===> +================================================================================ +<===> green/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 0.7)} + +<===> green/above_max/output.css +a { + b: color(srgb 0.2 1.2 0.7); +} + +<===> +================================================================================ +<===> green/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: -0.8)} + +<===> green/below_min/output.css +a { + b: color(srgb 0.2 -0.3 0.7); +} + +<===> +================================================================================ +<===> green/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 1.7)} + +<===> green/arg_above_max/output.css +a { + b: color(srgb 0.2 2.2 0.7); +} + +<===> +================================================================================ +<===> green/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: -1.8)} + +<===> green/arg_below_min/output.css +a { + b: color(srgb 0.2 -1.3 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: -0.3)} + +<===> blue/unitless/output.css +a { + b: color(srgb 0.2 0.5 0.4); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 20%)} + +<===> blue/percent/output.css +a { + b: color(srgb 0.2 0.5 0.9); +} + +<===> +================================================================================ +<===> blue/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 0.7)} + +<===> blue/above_max/output.css +a { + b: color(srgb 0.2 0.5 1.4); +} + +<===> +================================================================================ +<===> blue/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: -0.8)} + +<===> blue/below_min/output.css +a { + b: color(srgb 0.2 0.5 -0.1); +} + +<===> +================================================================================ +<===> blue/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 1.7)} + +<===> blue/arg_above_max/output.css +a { + b: color(srgb 0.2 0.5 2.4); +} + +<===> +================================================================================ +<===> blue/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: -1.8)} + +<===> blue/arg_below_min/output.css +a { + b: color(srgb 0.2 0.5 -1.1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} + +<===> all/output.css +a { + b: color(srgb 0.5 0.7 0.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(srgb 0.7 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: color(srgb 0.7 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/adjust/srgb_linear.hrx b/spec/core_functions/color/adjust/srgb_linear.hrx new file mode 100644 index 0000000000..7caf5ebc5c --- /dev/null +++ b/spec/core_functions/color/adjust/srgb_linear.hrx @@ -0,0 +1,228 @@ +<===> red/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.5)} + +<===> red/unitless/output.css +a { + b: color(srgb-linear 0.7 0.5 0.7); +} + +<===> +================================================================================ +<===> red/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: -10%)} + +<===> red/percent/output.css +a { + b: color(srgb-linear 0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.9)} + +<===> red/above_max/output.css +a { + b: color(srgb-linear 1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: -0.3)} + +<===> red/below_min/output.css +a { + b: color(srgb-linear -0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 1.9)} + +<===> red/arg_above_max/output.css +a { + b: color(srgb-linear 2.1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: -1.3)} + +<===> red/arg_below_min/output.css +a { + b: color(srgb-linear -1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> green/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: -0.3)} + +<===> green/unitless/output.css +a { + b: color(srgb-linear 0.2 0.2 0.7); +} + +<===> +================================================================================ +<===> green/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 40%)} + +<===> green/percent/output.css +a { + b: color(srgb-linear 0.2 0.9 0.7); +} + +<===> +================================================================================ +<===> green/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 0.7)} + +<===> green/above_max/output.css +a { + b: color(srgb-linear 0.2 1.2 0.7); +} + +<===> +================================================================================ +<===> green/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: -0.8)} + +<===> green/below_min/output.css +a { + b: color(srgb-linear 0.2 -0.3 0.7); +} + +<===> +================================================================================ +<===> green/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 1.7)} + +<===> green/arg_above_max/output.css +a { + b: color(srgb-linear 0.2 2.2 0.7); +} + +<===> +================================================================================ +<===> green/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: -1.8)} + +<===> green/arg_below_min/output.css +a { + b: color(srgb-linear 0.2 -1.3 0.7); +} + +<===> +================================================================================ +<===> blue/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: -0.3)} + +<===> blue/unitless/output.css +a { + b: color(srgb-linear 0.2 0.5 0.4); +} + +<===> +================================================================================ +<===> blue/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 20%)} + +<===> blue/percent/output.css +a { + b: color(srgb-linear 0.2 0.5 0.9); +} + +<===> +================================================================================ +<===> blue/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 0.7)} + +<===> blue/above_max/output.css +a { + b: color(srgb-linear 0.2 0.5 1.4); +} + +<===> +================================================================================ +<===> blue/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: -0.8)} + +<===> blue/below_min/output.css +a { + b: color(srgb-linear 0.2 0.5 -0.1); +} + +<===> +================================================================================ +<===> blue/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 1.7)} + +<===> blue/arg_above_max/output.css +a { + b: color(srgb-linear 0.2 0.5 2.4); +} + +<===> +================================================================================ +<===> blue/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: -1.8)} + +<===> blue/arg_below_min/output.css +a { + b: color(srgb-linear 0.2 0.5 -1.1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} + +<===> all/output.css +a { + b: color(srgb-linear 0.5 0.7 0.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7 / 0.9), $red: 0.5)} + +<===> alpha_input/output.css +a { + b: color(srgb-linear 0.7 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: color(srgb-linear 0.7 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/adjust/xyz_d50.hrx b/spec/core_functions/color/adjust/xyz_d50.hrx new file mode 100644 index 0000000000..c9f49a55cf --- /dev/null +++ b/spec/core_functions/color/adjust/xyz_d50.hrx @@ -0,0 +1,228 @@ +<===> x/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.5)} + +<===> x/unitless/output.css +a { + b: color(xyz-d50 0.7 0.5 0.7); +} + +<===> +================================================================================ +<===> x/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: -10%)} + +<===> x/percent/output.css +a { + b: color(xyz-d50 0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.9)} + +<===> x/above_max/output.css +a { + b: color(xyz-d50 1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: -0.3)} + +<===> x/below_min/output.css +a { + b: color(xyz-d50 -0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 1.9)} + +<===> x/arg_above_max/output.css +a { + b: color(xyz-d50 2.1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: -1.3)} + +<===> x/arg_below_min/output.css +a { + b: color(xyz-d50 -1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> y/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: -0.3)} + +<===> y/unitless/output.css +a { + b: color(xyz-d50 0.2 0.2 0.7); +} + +<===> +================================================================================ +<===> y/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 40%)} + +<===> y/percent/output.css +a { + b: color(xyz-d50 0.2 0.9 0.7); +} + +<===> +================================================================================ +<===> y/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 0.7)} + +<===> y/above_max/output.css +a { + b: color(xyz-d50 0.2 1.2 0.7); +} + +<===> +================================================================================ +<===> y/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: -0.8)} + +<===> y/below_min/output.css +a { + b: color(xyz-d50 0.2 -0.3 0.7); +} + +<===> +================================================================================ +<===> y/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 1.7)} + +<===> y/arg_above_max/output.css +a { + b: color(xyz-d50 0.2 2.2 0.7); +} + +<===> +================================================================================ +<===> y/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: -1.8)} + +<===> y/arg_below_min/output.css +a { + b: color(xyz-d50 0.2 -1.3 0.7); +} + +<===> +================================================================================ +<===> z/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: -0.3)} + +<===> z/unitless/output.css +a { + b: color(xyz-d50 0.2 0.5 0.4); +} + +<===> +================================================================================ +<===> z/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 20%)} + +<===> z/percent/output.css +a { + b: color(xyz-d50 0.2 0.5 0.9); +} + +<===> +================================================================================ +<===> z/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 0.7)} + +<===> z/above_max/output.css +a { + b: color(xyz-d50 0.2 0.5 1.4); +} + +<===> +================================================================================ +<===> z/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: -0.8)} + +<===> z/below_min/output.css +a { + b: color(xyz-d50 0.2 0.5 -0.1); +} + +<===> +================================================================================ +<===> z/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 1.7)} + +<===> z/arg_above_max/output.css +a { + b: color(xyz-d50 0.2 0.5 2.4); +} + +<===> +================================================================================ +<===> z/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: -1.8)} + +<===> z/arg_below_min/output.css +a { + b: color(xyz-d50 0.2 0.5 -1.1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.3, $y: 0.2, $z: 0.1)} + +<===> all/output.css +a { + b: color(xyz-d50 0.5 0.7 0.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7 / 0.9), $x: 0.5)} + +<===> alpha_input/output.css +a { + b: color(xyz-d50 0.7 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.5, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: color(xyz-d50 0.7 0.5 0.7 / 0.9); +} diff --git a/spec/core_functions/color/adjust/xyz_d65.hrx b/spec/core_functions/color/adjust/xyz_d65.hrx new file mode 100644 index 0000000000..30abb1432d --- /dev/null +++ b/spec/core_functions/color/adjust/xyz_d65.hrx @@ -0,0 +1,228 @@ +<===> x/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 0.5)} + +<===> x/unitless/output.css +a { + b: color(xyz 0.7 0.5 0.7); +} + +<===> +================================================================================ +<===> x/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: -10%)} + +<===> x/percent/output.css +a { + b: color(xyz 0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 0.9)} + +<===> x/above_max/output.css +a { + b: color(xyz 1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: -0.3)} + +<===> x/below_min/output.css +a { + b: color(xyz -0.1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 1.9)} + +<===> x/arg_above_max/output.css +a { + b: color(xyz 2.1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: -1.3)} + +<===> x/arg_below_min/output.css +a { + b: color(xyz -1.1 0.5 0.7); +} + +<===> +================================================================================ +<===> y/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: -0.3)} + +<===> y/unitless/output.css +a { + b: color(xyz 0.2 0.2 0.7); +} + +<===> +================================================================================ +<===> y/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: 40%)} + +<===> y/percent/output.css +a { + b: color(xyz 0.2 0.9 0.7); +} + +<===> +================================================================================ +<===> y/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: 0.7)} + +<===> y/above_max/output.css +a { + b: color(xyz 0.2 1.2 0.7); +} + +<===> +================================================================================ +<===> y/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: -0.8)} + +<===> y/below_min/output.css +a { + b: color(xyz 0.2 -0.3 0.7); +} + +<===> +================================================================================ +<===> y/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: 1.7)} + +<===> y/arg_above_max/output.css +a { + b: color(xyz 0.2 2.2 0.7); +} + +<===> +================================================================================ +<===> y/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: -1.8)} + +<===> y/arg_below_min/output.css +a { + b: color(xyz 0.2 -1.3 0.7); +} + +<===> +================================================================================ +<===> z/unitless/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: -0.3)} + +<===> z/unitless/output.css +a { + b: color(xyz 0.2 0.5 0.4); +} + +<===> +================================================================================ +<===> z/percent/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: 20%)} + +<===> z/percent/output.css +a { + b: color(xyz 0.2 0.5 0.9); +} + +<===> +================================================================================ +<===> z/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: 0.7)} + +<===> z/above_max/output.css +a { + b: color(xyz 0.2 0.5 1.4); +} + +<===> +================================================================================ +<===> z/below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: -0.8)} + +<===> z/below_min/output.css +a { + b: color(xyz 0.2 0.5 -0.1); +} + +<===> +================================================================================ +<===> z/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: 1.7)} + +<===> z/arg_above_max/output.css +a { + b: color(xyz 0.2 0.5 2.4); +} + +<===> +================================================================================ +<===> z/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: -1.8)} + +<===> z/arg_below_min/output.css +a { + b: color(xyz 0.2 0.5 -1.1); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 0.3, $y: 0.2, $z: 0.1)} + +<===> all/output.css +a { + b: color(xyz 0.5 0.7 0.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7 / 0.9), $x: 0.5)} + +<===> alpha_input/output.css +a { + b: color(xyz 0.7 0.5 0.7 / 0.9); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 0.5, $alpha: -0.1)} + +<===> alpha_arg/output.css +a { + b: color(xyz 0.7 0.5 0.7 / 0.9); +} From 6c9b90bdd36926511181d462ed9c73e607860dda Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Mon, 6 May 2024 17:11:43 -0700 Subject: [PATCH 36/45] Update error tests for `color.adjust()` --- .../color/adjust/error/bounds.hrx | 389 ------------------ .../adjust/error/incompatible_channel.hrx | 39 ++ .../color/adjust/error/space.hrx | 25 ++ .../color/adjust/error/type.hrx | 28 ++ .../color/adjust/error/units/a98_rgb.hrx | 39 ++ .../color/adjust/error/units/display_p3.hrx | 39 ++ .../adjust/error/{units.hrx => units/hwb.hrx} | 0 .../color/adjust/error/units/lab.hrx | 39 ++ .../color/adjust/error/units/lch.hrx | 39 ++ .../color/adjust/error/units/oklab.hrx | 39 ++ .../color/adjust/error/units/oklch.hrx | 39 ++ .../color/adjust/error/units/prophoto_rgb.hrx | 39 ++ .../color/adjust/error/units/rec2020.hrx | 39 ++ .../color/adjust/error/units/srgb.hrx | 39 ++ .../color/adjust/error/units/srgb_linear.hrx | 39 ++ .../color/adjust/error/units/xyz.hrx | 39 ++ .../color/adjust/error/units/xyz_d50.hrx | 39 ++ .../color/adjust/no_channels.hrx | 48 ++- 18 files changed, 595 insertions(+), 402 deletions(-) delete mode 100644 spec/core_functions/color/adjust/error/bounds.hrx create mode 100644 spec/core_functions/color/adjust/error/incompatible_channel.hrx create mode 100644 spec/core_functions/color/adjust/error/space.hrx create mode 100644 spec/core_functions/color/adjust/error/units/a98_rgb.hrx create mode 100644 spec/core_functions/color/adjust/error/units/display_p3.hrx rename spec/core_functions/color/adjust/error/{units.hrx => units/hwb.hrx} (100%) create mode 100644 spec/core_functions/color/adjust/error/units/lab.hrx create mode 100644 spec/core_functions/color/adjust/error/units/lch.hrx create mode 100644 spec/core_functions/color/adjust/error/units/oklab.hrx create mode 100644 spec/core_functions/color/adjust/error/units/oklch.hrx create mode 100644 spec/core_functions/color/adjust/error/units/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/adjust/error/units/rec2020.hrx create mode 100644 spec/core_functions/color/adjust/error/units/srgb.hrx create mode 100644 spec/core_functions/color/adjust/error/units/srgb_linear.hrx create mode 100644 spec/core_functions/color/adjust/error/units/xyz.hrx create mode 100644 spec/core_functions/color/adjust/error/units/xyz_d50.hrx diff --git a/spec/core_functions/color/adjust/error/bounds.hrx b/spec/core_functions/color/adjust/error/bounds.hrx deleted file mode 100644 index 0455b24dcd..0000000000 --- a/spec/core_functions/color/adjust/error/bounds.hrx +++ /dev/null @@ -1,389 +0,0 @@ -<===> README.md -According to the new color space spec, out-of-bounds values should be allowed -(and clamped for strictly bounded spaces). See sass/sass-spec#1828. - -<===> options.yml ---- -:todo: -- dart-sass - -<===> -================================================================================ -<===> red/too_low/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $red: -256)} - -<===> red/too_low/error -Error: $red: Expected -256 to be within -255 and 255. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $red: -256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> red/too_high/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $red: 256)} - -<===> red/too_high/error -Error: $red: Expected 256 to be within -255 and 255. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $red: 256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> red/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -@use 'sass:color'; -a {b: color.adjust(red, $red: 300px)} - -<===> red/unit/error -Error: $red: Expected 300px to be within -255 and 255. - , -3 | @use 'sass:color'; -a {b: color.adjust(red, $red: 300px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> green/too_low/input.scss -@use 'sass:color'; -a {b: color.adjust(green, $green: -256)} - -<===> green/too_low/error -Error: $green: Expected -256 to be within -255 and 255. - , -1 | @use 'sass:color'; -a {b: color.adjust(green, $green: -256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> green/too_high/input.scss -@use 'sass:color'; -a {b: color.adjust(green, $green: 256)} - -<===> green/too_high/error -Error: $green: Expected 256 to be within -255 and 255. - , -1 | @use 'sass:color'; -a {b: color.adjust(green, $green: 256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> green/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -@use 'sass:color'; -a {b: color.adjust(green, $green: 300px)} - -<===> green/unit/error -Error: $green: Expected 300px to be within -255 and 255. - , -3 | @use 'sass:color'; -a {b: color.adjust(green, $green: 300px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> blue/too_low/input.scss -@use 'sass:color'; -a {b: color.adjust(blue, $blue: -256)} - -<===> blue/too_low/error -Error: $blue: Expected -256 to be within -255 and 255. - , -1 | @use 'sass:color'; -a {b: color.adjust(blue, $blue: -256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blue/too_high/input.scss -@use 'sass:color'; -a {b: color.adjust(blue, $blue: 256)} - -<===> blue/too_high/error -Error: $blue: Expected 256 to be within -255 and 255. - , -1 | @use 'sass:color'; -a {b: color.adjust(blue, $blue: 256)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blue/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -@use 'sass:color'; -a {b: color.adjust(blue, $blue: 300px)} - -<===> blue/unit/error -Error: $blue: Expected 300px to be within -255 and 255. - , -3 | @use 'sass:color'; -a {b: color.adjust(blue, $blue: 300px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> saturation/too_low/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $saturation: -100.001%)} - -<===> saturation/too_low/error -Error: $saturation: Expected -100.001% to be within -100% and 100%. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $saturation: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturation/too_high/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $saturation: 100.001%)} - -<===> saturation/too_high/error -Error: $saturation: Expected 100.001% to be within -100% and 100%. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $saturation: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturation/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -@use 'sass:color'; -a {b: color.adjust(red, $saturation: 200px)} - -<===> saturation/unit/error -DEPRECATION WARNING: $saturation: Passing a number without unit % (200px) is deprecated. - -To preserve current behavior: calc($saturation / 1px * 1%) - -More info: https://sass-lang.com/d/function-units - - , -3 | @use 'sass:color'; -a {b: color.adjust(red, $saturation: 200px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -Error: $saturation: Expected 200px to be within -100% and 100%. - , -3 | @use 'sass:color'; -a {b: color.adjust(red, $saturation: 200px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> lightness/too_low/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $lightness: -100.001%)} - -<===> lightness/too_low/error -Error: $lightness: Expected -100.001% to be within -100% and 100%. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $lightness: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/too_high/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $lightness: 100.001%)} - -<===> lightness/too_high/error -Error: $lightness: Expected 100.001% to be within -100% and 100%. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $lightness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -@use 'sass:color'; -a {b: color.adjust(red, $lightness: 200px)} - -<===> lightness/unit/error -DEPRECATION WARNING: $lightness: Passing a number without unit % (200px) is deprecated. - -To preserve current behavior: calc($lightness / 1px * 1%) - -More info: https://sass-lang.com/d/function-units - - , -3 | @use 'sass:color'; -a {b: color.adjust(red, $lightness: 200px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -Error: $lightness: Expected 200px to be within -100% and 100%. - , -3 | @use 'sass:color'; -a {b: color.adjust(red, $lightness: 200px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> alpha/too_low/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $alpha: -1.001)} - -<===> alpha/too_low/error -Error: $alpha: Expected -1.001 to be within -1 and 1. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $alpha: -1.001)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/too_high/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $alpha: 1.001)} - -<===> alpha/too_high/error -Error: $alpha: Expected 1.001 to be within -1 and 1. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $alpha: 1.001)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/unit/input.scss -// This test covers sass/dart-sass#1745, but should be removed once units are -// fully forbidden (sass/sass#3374). -@use 'sass:color'; -a {b: color.adjust(red, $alpha: 50%)} - -<===> alpha/unit/error -DEPRECATION WARNING: $alpha: Passing a number with unit % is deprecated. - -To preserve current behavior: calc($alpha / 1%) - -More info: https://sass-lang.com/d/function-units - - , -3 | @use 'sass:color'; -a {b: color.adjust(red, $alpha: 50%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -Error: $alpha: Expected 50% to be within -1 and 1. - , -3 | @use 'sass:color'; -a {b: color.adjust(red, $alpha: 50%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 3:7 root stylesheet - -<===> -================================================================================ -<===> blackness/too_low/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $blackness: -100.001%)} - -<===> blackness/too_low/error -Error: $blackness: Expected -100.001% to be within -100% and 100%. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $blackness: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blackness/too_high/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $blackness: 100.001%)} - -<===> blackness/too_high/error -Error: $blackness: Expected 100.001% to be within -100% and 100%. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $blackness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/too_low/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $whiteness: -100.001%)} - -<===> whiteness/too_low/error -Error: $whiteness: Expected -100.001% to be within -100% and 100%. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $whiteness: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/too_high/input.scss -@use 'sass:color'; -a {b: color.adjust(red, $whiteness: 100.001%)} - -<===> whiteness/too_high/error -Error: $whiteness: Expected 100.001% to be within -100% and 100%. - , -1 | @use 'sass:color'; -a {b: color.adjust(red, $whiteness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/incompatible_channel.hrx b/spec/core_functions/color/adjust/error/incompatible_channel.hrx new file mode 100644 index 0000000000..e066559495 --- /dev/null +++ b/spec/core_functions/color/adjust/error/incompatible_channel.hrx @@ -0,0 +1,39 @@ +<===> legacy_space/input.scss +@use 'sass:color'; +a {b: color.adjust(red, $chroma: 50%)} + +<===> legacy_space/error +Error: $chroma: Color space rgb doesn't have a channel with this name. + , +2 | a {b: color.adjust(red, $chroma: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> legacy_channel/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} + +<===> legacy_channel/error +Error: $whiteness: Color space srgb doesn't have a channel with this name. + , +2 | a {b: color.adjust(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> modern_both/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $chroma: 50%)} + +<===> modern_both/error +Error: $chroma: Color space srgb doesn't have a channel with this name. + , +2 | a {b: color.adjust(color(srgb 0.2 0.5 0.7), $chroma: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/space.hrx b/spec/core_functions/color/adjust/error/space.hrx new file mode 100644 index 0000000000..b8bb10afd0 --- /dev/null +++ b/spec/core_functions/color/adjust/error/space.hrx @@ -0,0 +1,25 @@ +<===> unknown/input.scss +@use 'sass:color'; +a {b: color.adjust(red, $space: c)} + +<===> unknown/error +Error: $space: Unknown color space "c". + , +2 | a {b: color.adjust(red, $space: c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> quoted/input.scss +@use 'sass:color'; +a {b: color.adjust(red, $space: "lab")} + +<===> quoted/error +Error: $space: Expected "lab" to be an unquoted string. + , +2 | a {b: color.adjust(red, $space: "lab")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/type.hrx b/spec/core_functions/color/adjust/error/type.hrx index c3339e881b..045e6a451c 100644 --- a/spec/core_functions/color/adjust/error/type.hrx +++ b/spec/core_functions/color/adjust/error/type.hrx @@ -108,6 +108,20 @@ Error: $alpha: c is not a number. ' input.scss 2:7 root stylesheet +<===> +================================================================================ +<===> none/input.scss +@use 'sass:color'; +a {b: color.adjust(red, $alpha: none)} + +<===> none/error +Error: $alpha: none is not a number. + , +2 | a {b: color.adjust(red, $alpha: none)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> blackness/input.scss @@ -135,3 +149,17 @@ Error: $whiteness: c is not a number. | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/input.scss +@use 'sass:color'; +a {b: color.adjust(red, $space: 1)} + +<===> space/error +Error: $space: 1 is not a string. + , +2 | a {b: color.adjust(red, $space: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/a98_rgb.hrx b/spec/core_functions/color/adjust/error/units/a98_rgb.hrx new file mode 100644 index 0000000000..5dc0e9927a --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/a98_rgb.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/display_p3.hrx b/spec/core_functions/color/adjust/error/units/display_p3.hrx new file mode 100644 index 0000000000..5233b1950c --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/display_p3.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units.hrx b/spec/core_functions/color/adjust/error/units/hwb.hrx similarity index 100% rename from spec/core_functions/color/adjust/error/units.hrx rename to spec/core_functions/color/adjust/error/units/hwb.hrx diff --git a/spec/core_functions/color/adjust/error/units/lab.hrx b/spec/core_functions/color/adjust/error/units/lab.hrx new file mode 100644 index 0000000000..b178fd4315 --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/lab.hrx @@ -0,0 +1,39 @@ +<===> lightness/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(50% 30 -50), $lightness: 30px)} + +<===> lightness/error +Error: $lightness: Expected 30px to have unit "%" or no units. + , +2 | a {b: color.adjust(lab(50% 30 -50), $lightness: 30px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> a/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(50% 30 -50), $a: 20px)} + +<===> a/error +Error: $a: Expected 20px to have unit "%" or no units. + , +2 | a {b: color.adjust(lab(50% 30 -50), $a: 20px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> b/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(50% 30 -50), $b: 20px)} + +<===> b/error +Error: $b: Expected 20px to have unit "%" or no units. + , +2 | a {b: color.adjust(lab(50% 30 -50), $b: 20px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/lch.hrx b/spec/core_functions/color/adjust/error/units/lch.hrx new file mode 100644 index 0000000000..1bfbd106ec --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/lch.hrx @@ -0,0 +1,39 @@ +<===> lightness/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(50% 30 50deg), $lightness: 30px)} + +<===> lightness/error +Error: $lightness: Expected 30px to have unit "%" or no units. + , +2 | a {b: color.adjust(lch(50% 30 50deg), $lightness: 30px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> chroma/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(50% 30 50deg), $chroma: 20px)} + +<===> chroma/error +Error: $chroma: Expected 20px to have unit "%" or no units. + , +2 | a {b: color.adjust(lch(50% 30 50deg), $chroma: 20px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> hue/input.scss +@use 'sass:color'; +a {b: color.adjust(lch(50% 30 50deg), $hue: 20%)} + +<===> hue/error +Error: $hue: Expected 20% to have an angle unit (deg, grad, rad, turn). + , +2 | a {b: color.adjust(lch(50% 30 50deg), $hue: 20%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/oklab.hrx b/spec/core_functions/color/adjust/error/units/oklab.hrx new file mode 100644 index 0000000000..01f20c5a4e --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/oklab.hrx @@ -0,0 +1,39 @@ +<===> lightness/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(50% 0.2 -0.3), $lightness: 0.3px)} + +<===> lightness/error +Error: $lightness: Expected 0.3px to have unit "%" or no units. + , +2 | a {b: color.adjust(oklab(50% 0.2 -0.3), $lightness: 0.3px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> a/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(50% 0.2 -0.3), $a: 0.2px)} + +<===> a/error +Error: $a: Expected 0.2px to have unit "%" or no units. + , +2 | a {b: color.adjust(oklab(50% 0.2 -0.3), $a: 0.2px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> b/input.scss +@use 'sass:color'; +a {b: color.adjust(oklab(50% 0.2 -0.3), $b: 0.2px)} + +<===> b/error +Error: $b: Expected 0.2px to have unit "%" or no units. + , +2 | a {b: color.adjust(oklab(50% 0.2 -0.3), $b: 0.2px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/oklch.hrx b/spec/core_functions/color/adjust/error/units/oklch.hrx new file mode 100644 index 0000000000..49aa5e6dda --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/oklch.hrx @@ -0,0 +1,39 @@ +<===> lightness/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(50% 0.3 50deg), $lightness: 30px)} + +<===> lightness/error +Error: $lightness: Expected 30px to have unit "%" or no units. + , +2 | a {b: color.adjust(oklch(50% 0.3 50deg), $lightness: 30px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> chroma/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(50% 0.3 50deg), $chroma: 0.2px)} + +<===> chroma/error +Error: $chroma: Expected 0.2px to have unit "%" or no units. + , +2 | a {b: color.adjust(oklch(50% 0.3 50deg), $chroma: 0.2px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> hue/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(50% 0.3 50deg), $hue: 20%)} + +<===> hue/error +Error: $hue: Expected 20% to have an angle unit (deg, grad, rad, turn). + , +2 | a {b: color.adjust(oklch(50% 0.3 50deg), $hue: 20%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/prophoto_rgb.hrx b/spec/core_functions/color/adjust/error/units/prophoto_rgb.hrx new file mode 100644 index 0000000000..5d0fdff11b --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/prophoto_rgb.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/rec2020.hrx b/spec/core_functions/color/adjust/error/units/rec2020.hrx new file mode 100644 index 0000000000..54f219416d --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/rec2020.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/srgb.hrx b/spec/core_functions/color/adjust/error/units/srgb.hrx new file mode 100644 index 0000000000..733226d1a8 --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/srgb.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/srgb_linear.hrx b/spec/core_functions/color/adjust/error/units/srgb_linear.hrx new file mode 100644 index 0000000000..2cd639e34c --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/srgb_linear.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.5px)} + +<===> red/error +Error: $red: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 0.5px)} + +<===> green/error +Error: $green: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 0.5px)} + +<===> blue/error +Error: $blue: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/xyz.hrx b/spec/core_functions/color/adjust/error/units/xyz.hrx new file mode 100644 index 0000000000..c75280ea3b --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/xyz.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz 0.2 0.5 0.7), $x: 0.5px)} + +<===> red/error +Error: $x: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(xyz 0.2 0.5 0.7), $x: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz 0.2 0.5 0.7), $y: 0.5px)} + +<===> green/error +Error: $y: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(xyz 0.2 0.5 0.7), $y: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz 0.2 0.5 0.7), $z: 0.5px)} + +<===> blue/error +Error: $z: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(xyz 0.2 0.5 0.7), $z: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/error/units/xyz_d50.hrx b/spec/core_functions/color/adjust/error/units/xyz_d50.hrx new file mode 100644 index 0000000000..462eb76398 --- /dev/null +++ b/spec/core_functions/color/adjust/error/units/xyz_d50.hrx @@ -0,0 +1,39 @@ +<===> red/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.5px)} + +<===> red/error +Error: $x: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> green/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 0.5px)} + +<===> green/error +Error: $y: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> blue/input.scss +@use 'sass:color'; +a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 0.5px)} + +<===> blue/error +Error: $z: Expected 0.5px to have unit "%" or no units. + , +2 | a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 0.5px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/no_channels.hrx b/spec/core_functions/color/adjust/no_channels.hrx index 7e891722ba..a2ed7bd9be 100644 --- a/spec/core_functions/color/adjust/no_channels.hrx +++ b/spec/core_functions/color/adjust/no_channels.hrx @@ -18,17 +18,6 @@ a { b: red; } -<===> -================================================================================ -<===> alpha/max/input.scss -@use 'sass:color'; -a {b: color.adjust(rgba(red, 0.5), $alpha: 1)} - -<===> alpha/max/output.css -a { - b: red; -} - <===> ================================================================================ <===> alpha/max_remaining/input.scss @@ -53,11 +42,44 @@ a { <===> ================================================================================ -<===> alpha/min/input.scss +<===> alpha/above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: 1)} + +<===> alpha/above_max/output.css +a { + b: red; +} + +<===> +================================================================================ +<===> alpha/below_min/input.scss @use 'sass:color'; a {b: color.adjust(rgba(red, 0.5), $alpha: -1)} -<===> alpha/min/output.css +<===> alpha/below_min/output.css +a { + b: rgba(255, 0, 0, 0); +} + +<===> +================================================================================ +<===> alpha/arg_above_max/input.scss +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: 2)} + +<===> alpha/arg_above_max/output.css +a { + b: red; +} + +<===> +================================================================================ +<===> alpha/arg_below_min/input.scss +@use 'sass:color'; +a {b: color.adjust(rgba(red, 0.5), $alpha: -2)} + +<===> alpha/arg_below_min/output.css a { b: rgba(255, 0, 0, 0); } From d6c9affd3b2fa4a9e127d1b9303f1881420d0200 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Wed, 8 May 2024 17:22:50 -0700 Subject: [PATCH 37/45] [Color 4] Update tests for `color.scale()` (#1989) --- spec/core_functions/color/scale/a98_rgb.hrx | 225 ++++++++++++++++++ .../core_functions/color/scale/display_p3.hrx | 225 ++++++++++++++++++ .../{scale_color => scale}/error/args.hrx | 21 +- .../color/scale/error/bounds.hrx | 53 +++++ .../scale/error/incompatible_channel.hrx | 39 +++ .../error/mixed_formats.hrx | 49 ++-- .../color/scale/error/polar.hrx | 39 +++ .../color/scale/error/space.hrx | 25 ++ .../{scale_color => scale}/error/type.hrx | 90 ++++--- .../color/scale/error/units/a98_rgb.hrx | 81 +++++++ .../color/scale/error/units/display_p3.hrx | 81 +++++++ .../color/scale/error/units/hsl.hrx | 53 +++++ .../color/scale/error/units/hwb.hrx | 53 +++++ .../color/scale/error/units/lab.hrx | 81 +++++++ .../color/scale/error/units/lch.hrx | 53 +++++ .../color/scale/error/units/oklab.hrx | 81 +++++++ .../color/scale/error/units/oklch.hrx | 53 +++++ .../color/scale/error/units/prophoto_rgb.hrx | 81 +++++++ .../color/scale/error/units/rec2020.hrx | 81 +++++++ .../color/scale/error/units/rgb.hrx | 81 +++++++ .../color/scale/error/units/srgb.hrx | 81 +++++++ .../color/scale/error/units/srgb_linear.hrx | 81 +++++++ .../color/scale/error/units/xyz_d50.hrx | 81 +++++++ .../color/scale/error/units/xyz_d65.hrx | 81 +++++++ spec/core_functions/color/scale/global.hrx | 17 ++ .../color/{scale_color => scale}/hsl.hrx | 42 ++-- .../color/{scale_color => scale}/hwb.hrx | 42 ++-- spec/core_functions/color/scale/lab.hrx | 217 +++++++++++++++++ spec/core_functions/color/scale/lch.hrx | 158 ++++++++++++ .../color/scale/no_channels.hrx | 19 ++ .../no_rgb_hsl.hrx => scale/no_space.hrx} | 21 +- spec/core_functions/color/scale/oklab.hrx | 217 +++++++++++++++++ .../color/scale/out_of_gamut.hrx | 41 ++++ .../color/scale/prophoto_rgb.hrx | 225 ++++++++++++++++++ spec/core_functions/color/scale/rec2020.hrx | 225 ++++++++++++++++++ .../color/{scale_color => scale}/rgb.hrx | 57 +++-- spec/core_functions/color/scale/space.hrx | 41 ++++ spec/core_functions/color/scale/srgb.hrx | 223 +++++++++++++++++ .../color/scale/srgb_linear.hrx | 225 ++++++++++++++++++ spec/core_functions/color/scale/xyz_d50.hrx | 217 +++++++++++++++++ spec/core_functions/color/scale/xyz_d65.hrx | 217 +++++++++++++++++ .../color/scale_color/error/bounds.hrx | 206 ---------------- .../color/scale_color/error/units.hrx | 206 ---------------- 43 files changed, 3962 insertions(+), 523 deletions(-) create mode 100644 spec/core_functions/color/scale/a98_rgb.hrx create mode 100644 spec/core_functions/color/scale/display_p3.hrx rename spec/core_functions/color/{scale_color => scale}/error/args.hrx (68%) create mode 100644 spec/core_functions/color/scale/error/bounds.hrx create mode 100644 spec/core_functions/color/scale/error/incompatible_channel.hrx rename spec/core_functions/color/{scale_color => scale}/error/mixed_formats.hrx (63%) create mode 100644 spec/core_functions/color/scale/error/polar.hrx create mode 100644 spec/core_functions/color/scale/error/space.hrx rename spec/core_functions/color/{scale_color => scale}/error/type.hrx (50%) create mode 100644 spec/core_functions/color/scale/error/units/a98_rgb.hrx create mode 100644 spec/core_functions/color/scale/error/units/display_p3.hrx create mode 100644 spec/core_functions/color/scale/error/units/hsl.hrx create mode 100644 spec/core_functions/color/scale/error/units/hwb.hrx create mode 100644 spec/core_functions/color/scale/error/units/lab.hrx create mode 100644 spec/core_functions/color/scale/error/units/lch.hrx create mode 100644 spec/core_functions/color/scale/error/units/oklab.hrx create mode 100644 spec/core_functions/color/scale/error/units/oklch.hrx create mode 100644 spec/core_functions/color/scale/error/units/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/scale/error/units/rec2020.hrx create mode 100644 spec/core_functions/color/scale/error/units/rgb.hrx create mode 100644 spec/core_functions/color/scale/error/units/srgb.hrx create mode 100644 spec/core_functions/color/scale/error/units/srgb_linear.hrx create mode 100644 spec/core_functions/color/scale/error/units/xyz_d50.hrx create mode 100644 spec/core_functions/color/scale/error/units/xyz_d65.hrx create mode 100644 spec/core_functions/color/scale/global.hrx rename spec/core_functions/color/{scale_color => scale}/hsl.hrx (73%) rename spec/core_functions/color/{scale_color => scale}/hwb.hrx (71%) create mode 100644 spec/core_functions/color/scale/lab.hrx create mode 100644 spec/core_functions/color/scale/lch.hrx create mode 100644 spec/core_functions/color/scale/no_channels.hrx rename spec/core_functions/color/{scale_color/no_rgb_hsl.hrx => scale/no_space.hrx} (71%) create mode 100644 spec/core_functions/color/scale/oklab.hrx create mode 100644 spec/core_functions/color/scale/out_of_gamut.hrx create mode 100644 spec/core_functions/color/scale/prophoto_rgb.hrx create mode 100644 spec/core_functions/color/scale/rec2020.hrx rename spec/core_functions/color/{scale_color => scale}/rgb.hrx (72%) create mode 100644 spec/core_functions/color/scale/space.hrx create mode 100644 spec/core_functions/color/scale/srgb.hrx create mode 100644 spec/core_functions/color/scale/srgb_linear.hrx create mode 100644 spec/core_functions/color/scale/xyz_d50.hrx create mode 100644 spec/core_functions/color/scale/xyz_d65.hrx delete mode 100644 spec/core_functions/color/scale_color/error/bounds.hrx delete mode 100644 spec/core_functions/color/scale_color/error/units.hrx diff --git a/spec/core_functions/color/scale/a98_rgb.hrx b/spec/core_functions/color/scale/a98_rgb.hrx new file mode 100644 index 0000000000..16e70f0258 --- /dev/null +++ b/spec/core_functions/color/scale/a98_rgb.hrx @@ -0,0 +1,225 @@ +<===> red/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 100%)} + +<===> red/max/output.css +a { + b: color(a98-rgb 1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: -100%)} + +<===> red/min/output.css +a { + b: color(a98-rgb 0 0.5 0.7); +} + +<===> +================================================================================ +<===> red/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 0%)} + +<===> red/zero/output.css +a { + b: color(a98-rgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> red/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: -33%)} + +<===> red/low/output.css +a { + b: color(a98-rgb 0.134 0.5 0.7); +} + +<===> +================================================================================ +<===> red/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 86%)} + +<===> red/high/output.css +a { + b: color(a98-rgb 0.888 0.5 0.7); +} + +<===> +================================================================================ +<===> green/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 100%)} + +<===> green/max/output.css +a { + b: color(a98-rgb 0.2 1 0.7); +} + +<===> +================================================================================ +<===> green/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: -100%)} + +<===> green/min/output.css +a { + b: color(a98-rgb 0.2 0 0.7); +} + +<===> +================================================================================ +<===> green/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 0%)} + +<===> green/zero/output.css +a { + b: color(a98-rgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: -86%)} + +<===> green/low/output.css +a { + b: color(a98-rgb 0.2 0.07 0.7); +} + +<===> +================================================================================ +<===> green/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 12%)} + +<===> green/high/output.css +a { + b: color(a98-rgb 0.2 0.56 0.7); +} + +<===> +================================================================================ +<===> blue/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 100%)} + +<===> blue/max/output.css +a { + b: color(a98-rgb 0.2 0.5 1); +} + +<===> +================================================================================ +<===> blue/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: -100%)} + +<===> blue/min/output.css +a { + b: color(a98-rgb 0.2 0.5 0); +} + +<===> +================================================================================ +<===> blue/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 0%)} + +<===> blue/zero/output.css +a { + b: color(a98-rgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> blue/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: -16%)} + +<===> blue/low/output.css +a { + b: color(a98-rgb 0.2 0.5 0.588); +} + +<===> +================================================================================ +<===> blue/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 42%)} + +<===> blue/high/output.css +a { + b: color(a98-rgb 0.2 0.5 0.826); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(a98-rgb 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> all/output.css +a { + b: color(a98-rgb 0.296 0.62 0.844); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(a98-rgb 0.2 0.5 0.7 / 0.3), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> alpha_input/output.css +a { + b: color(a98-rgb 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(a98-rgb 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: color(a98-rgb 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale( + $color: color(a98-rgb 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> named/output.css +a { + b: color(a98-rgb 0.296 0.62 0.844); +} diff --git a/spec/core_functions/color/scale/display_p3.hrx b/spec/core_functions/color/scale/display_p3.hrx new file mode 100644 index 0000000000..3f962c3983 --- /dev/null +++ b/spec/core_functions/color/scale/display_p3.hrx @@ -0,0 +1,225 @@ +<===> red/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 100%)} + +<===> red/max/output.css +a { + b: color(display-p3 1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: -100%)} + +<===> red/min/output.css +a { + b: color(display-p3 0 0.5 0.7); +} + +<===> +================================================================================ +<===> red/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 0%)} + +<===> red/zero/output.css +a { + b: color(display-p3 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> red/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: -33%)} + +<===> red/low/output.css +a { + b: color(display-p3 0.134 0.5 0.7); +} + +<===> +================================================================================ +<===> red/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 86%)} + +<===> red/high/output.css +a { + b: color(display-p3 0.888 0.5 0.7); +} + +<===> +================================================================================ +<===> green/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 100%)} + +<===> green/max/output.css +a { + b: color(display-p3 0.2 1 0.7); +} + +<===> +================================================================================ +<===> green/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: -100%)} + +<===> green/min/output.css +a { + b: color(display-p3 0.2 0 0.7); +} + +<===> +================================================================================ +<===> green/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 0%)} + +<===> green/zero/output.css +a { + b: color(display-p3 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: -86%)} + +<===> green/low/output.css +a { + b: color(display-p3 0.2 0.07 0.7); +} + +<===> +================================================================================ +<===> green/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 12%)} + +<===> green/high/output.css +a { + b: color(display-p3 0.2 0.56 0.7); +} + +<===> +================================================================================ +<===> blue/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 100%)} + +<===> blue/max/output.css +a { + b: color(display-p3 0.2 0.5 1); +} + +<===> +================================================================================ +<===> blue/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: -100%)} + +<===> blue/min/output.css +a { + b: color(display-p3 0.2 0.5 0); +} + +<===> +================================================================================ +<===> blue/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 0%)} + +<===> blue/zero/output.css +a { + b: color(display-p3 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> blue/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: -16%)} + +<===> blue/low/output.css +a { + b: color(display-p3 0.2 0.5 0.588); +} + +<===> +================================================================================ +<===> blue/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 42%)} + +<===> blue/high/output.css +a { + b: color(display-p3 0.2 0.5 0.826); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(display-p3 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> all/output.css +a { + b: color(display-p3 0.296 0.62 0.844); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(display-p3 0.2 0.5 0.7 / 0.3), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> alpha_input/output.css +a { + b: color(display-p3 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(display-p3 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: color(display-p3 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale( + $color: color(display-p3 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> named/output.css +a { + b: color(display-p3 0.296 0.62 0.844); +} diff --git a/spec/core_functions/color/scale_color/error/args.hrx b/spec/core_functions/color/scale/error/args.hrx similarity index 68% rename from spec/core_functions/color/scale_color/error/args.hrx rename to spec/core_functions/color/scale/error/args.hrx index 80a237ee02..394dd6805c 100644 --- a/spec/core_functions/color/scale_color/error/args.hrx +++ b/spec/core_functions/color/scale/error/args.hrx @@ -1,40 +1,43 @@ <===> too_few/input.scss -a {b: scale-color()} +@use 'sass:color'; +a {b: color.scale()} <===> too_few/error Error: Missing argument $color. ,--> input.scss -1 | a {b: scale-color()} +2 | a {b: color.scale()} | ^^^^^^^^^^^^^ invocation ' ,--> sass:color 1 | @function scale($color, $kwargs...) { | ========================= declaration ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> too_many/input.scss -a {b: scale-color(red, 1)} +@use 'sass:color'; +a {b: color.scale(red, 1)} <===> too_many/error Error: Only one positional argument is allowed. All other arguments must be passed by name. , -1 | a {b: scale-color(red, 1)} +2 | a {b: color.scale(red, 1)} | ^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> unknown/input.scss -a {b: scale-color(red, $hue: 10%)} +@use 'sass:color'; +a {b: color.scale(red, $hue: 10%)} <===> unknown/error Error: $hue: Channel isn't scalable. , -1 | a {b: scale-color(red, $hue: 10%)} +2 | a {b: color.scale(red, $hue: 10%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/bounds.hrx b/spec/core_functions/color/scale/error/bounds.hrx new file mode 100644 index 0000000000..1ef57005a1 --- /dev/null +++ b/spec/core_functions/color/scale/error/bounds.hrx @@ -0,0 +1,53 @@ +<===> legacy/too_low/input.scss +@use 'sass:color'; +a {b: color.scale(red, $saturation: -100.001%)} + +<===> legacy/too_low/error +Error: $saturation: Expected -100.001% to be within -100% and 100%. + , +2 | a {b: color.scale(red, $saturation: -100.001%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> legacy/too_high/input.scss +@use 'sass:color'; +a {b: color.scale(red, $whiteness: 100.001%)} + +<===> legacy/too_high/error +Error: $whiteness: Expected 100.001% to be within -100% and 100%. + , +2 | a {b: color.scale(red, $whiteness: 100.001%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> modern/too_low/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% -70 60), $a: -100.001%)} + +<===> modern/too_low/error +Error: $a: Expected -100.001% to be within -100% and 100%. + , +2 | a {b: color.scale(lab(50% -70 60), $a: -100.001%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> modern/too_high/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% -70 60), $b: 100.001%)} + +<===> modern/too_high/error +Error: $b: Expected 100.001% to be within -100% and 100%. + , +2 | a {b: color.scale(lab(50% -70 60), $b: 100.001%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/incompatible_channel.hrx b/spec/core_functions/color/scale/error/incompatible_channel.hrx new file mode 100644 index 0000000000..d855830f1d --- /dev/null +++ b/spec/core_functions/color/scale/error/incompatible_channel.hrx @@ -0,0 +1,39 @@ +<===> legacy_space/input.scss +@use 'sass:color'; +a {b: color.scale(red, $chroma: 50%)} + +<===> legacy_space/error +Error: $chroma: Color space rgb doesn't have a channel with this name. + , +2 | a {b: color.scale(red, $chroma: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> legacy_channel/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} + +<===> legacy_channel/error +Error: $whiteness: Color space srgb doesn't have a channel with this name. + , +2 | a {b: color.scale(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> modern_both/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $chroma: 50%)} + +<===> modern_both/error +Error: $chroma: Color space srgb doesn't have a channel with this name. + , +2 | a {b: color.scale(color(srgb 0.2 0.5 0.7), $chroma: 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale_color/error/mixed_formats.hrx b/spec/core_functions/color/scale/error/mixed_formats.hrx similarity index 63% rename from spec/core_functions/color/scale_color/error/mixed_formats.hrx rename to spec/core_functions/color/scale/error/mixed_formats.hrx index c269a37d3e..c5dbc0ab3a 100644 --- a/spec/core_functions/color/scale_color/error/mixed_formats.hrx +++ b/spec/core_functions/color/scale/error/mixed_formats.hrx @@ -1,88 +1,95 @@ <===> red_and_saturation/input.scss -a {b: scale-color(red, $red: 1%, $saturation: 1%)} +@use 'sass:color'; +a {b: color.scale(red, $red: 1%, $saturation: 1%)} <===> red_and_saturation/error Error: $saturation: Color space rgb doesn't have a channel with this name. , -1 | a {b: scale-color(red, $red: 1%, $saturation: 1%)} +2 | a {b: color.scale(red, $red: 1%, $saturation: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> green_and_saturation/input.scss -a {b: scale-color(red, $green: 1%, $saturation: 1%)} +@use 'sass:color'; +a {b: color.scale(red, $green: 1%, $saturation: 1%)} <===> green_and_saturation/error Error: $saturation: Color space rgb doesn't have a channel with this name. , -1 | a {b: scale-color(red, $green: 1%, $saturation: 1%)} +2 | a {b: color.scale(red, $green: 1%, $saturation: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blue_and_lightness/input.scss -a {b: scale-color(red, $blue: 1%, $lightness: 1%)} +@use 'sass:color'; +a {b: color.scale(red, $blue: 1%, $lightness: 1%)} <===> blue_and_lightness/error Error: $lightness: Color space rgb doesn't have a channel with this name. , -1 | a {b: scale-color(red, $blue: 1%, $lightness: 1%)} +2 | a {b: color.scale(red, $blue: 1%, $lightness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> red_and_blackness/input.scss -a {b: scale-color(red, $red: 1%, $blackness: 1%)} +@use 'sass:color'; +a {b: color.scale(red, $red: 1%, $blackness: 1%)} <===> red_and_blackness/error Error: $blackness: Color space rgb doesn't have a channel with this name. , -1 | a {b: scale-color(red, $red: 1%, $blackness: 1%)} +2 | a {b: color.scale(red, $red: 1%, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> green_and_whiteness/input.scss -a {b: scale-color(red, $green: 1%, $whiteness: 1%)} +@use 'sass:color'; +a {b: color.scale(red, $green: 1%, $whiteness: 1%)} <===> green_and_whiteness/error Error: $whiteness: Color space rgb doesn't have a channel with this name. , -1 | a {b: scale-color(red, $green: 1%, $whiteness: 1%)} +2 | a {b: color.scale(red, $green: 1%, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> saturation_and_blackness/input.scss -a {b: scale-color(red, $saturation: 1%, $blackness: 1%)} +@use 'sass:color'; +a {b: color.scale(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error Error: $blackness: Color space hsl doesn't have a channel with this name. , -1 | a {b: scale-color(red, $saturation: 1%, $blackness: 1%)} +2 | a {b: color.scale(red, $saturation: 1%, $blackness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> lightness_and_whiteness/input.scss -a {b: scale-color(red, $lightness: 1%, $whiteness: 1%)} +@use 'sass:color'; +a {b: color.scale(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error Error: $whiteness: Color space hsl doesn't have a channel with this name. , -1 | a {b: scale-color(red, $lightness: 1%, $whiteness: 1%)} +2 | a {b: color.scale(red, $lightness: 1%, $whiteness: 1%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/polar.hrx b/spec/core_functions/color/scale/error/polar.hrx new file mode 100644 index 0000000000..54ff18b398 --- /dev/null +++ b/spec/core_functions/color/scale/error/polar.hrx @@ -0,0 +1,39 @@ +<===> legacy/input.scss +@use 'sass:color'; +a {b: color.scale(white, $hue: 10%)} + +<===> legacy/error +Error: $hue: Channel isn't scalable. + , +2 | a {b: color.scale(white, $hue: 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> lch/input.scss +@use 'sass:color'; +a {b: color.scale(lch(50% 30% 180deg), $hue: 10%)} + +<===> lch/error +Error: $hue: Channel isn't scalable. + , +2 | a {b: color.scale(lch(50% 30% 180deg), $hue: 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> oklch/input.scss +@use 'sass:color'; +a {b: color.scale(lch(50% 30% 180deg), $hue: 10%)} + +<===> oklch/error +Error: $hue: Channel isn't scalable. + , +2 | a {b: color.scale(lch(50% 30% 180deg), $hue: 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/space.hrx b/spec/core_functions/color/scale/error/space.hrx new file mode 100644 index 0000000000..5214992c0b --- /dev/null +++ b/spec/core_functions/color/scale/error/space.hrx @@ -0,0 +1,25 @@ +<===> unknown/input.scss +@use 'sass:color'; +a {b: color.scale(red, $space: c)} + +<===> unknown/error +Error: $space: Unknown color space "c". + , +2 | a {b: color.scale(red, $space: c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> quoted/input.scss +@use 'sass:color'; +a {b: color.scale(red, $space: "lab")} + +<===> quoted/error +Error: $space: Expected "lab" to be an unquoted string. + , +2 | a {b: color.scale(red, $space: "lab")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale_color/error/type.hrx b/spec/core_functions/color/scale/error/type.hrx similarity index 50% rename from spec/core_functions/color/scale_color/error/type.hrx rename to spec/core_functions/color/scale/error/type.hrx index aa01247e85..a45a9ec641 100644 --- a/spec/core_functions/color/scale_color/error/type.hrx +++ b/spec/core_functions/color/scale/error/type.hrx @@ -1,115 +1,151 @@ <===> color/input.scss -a {b: scale-color(1)} +@use 'sass:color'; +a {b: color.scale(1)} <===> color/error Error: $color: 1 is not a color. , -1 | a {b: scale-color(1)} +2 | a {b: color.scale(1)} | ^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> red/input.scss -a {b: scale-color(red, $red: c)} +@use 'sass:color'; +a {b: color.scale(red, $red: c)} <===> red/error Error: $red: c is not a number. , -1 | a {b: scale-color(red, $red: c)} +2 | a {b: color.scale(red, $red: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> green/input.scss -a {b: scale-color(red, $green: c)} +@use 'sass:color'; +a {b: color.scale(red, $green: c)} <===> green/error Error: $green: c is not a number. , -1 | a {b: scale-color(red, $green: c)} +2 | a {b: color.scale(red, $green: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blue/input.scss -a {b: scale-color(red, $blue: c)} +@use 'sass:color'; +a {b: color.scale(red, $blue: c)} <===> blue/error Error: $blue: c is not a number. , -1 | a {b: scale-color(red, $blue: c)} +2 | a {b: color.scale(red, $blue: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> saturation/input.scss -a {b: scale-color(red, $saturation: c)} +@use 'sass:color'; +a {b: color.scale(red, $saturation: c)} <===> saturation/error Error: $saturation: c is not a number. , -1 | a {b: scale-color(red, $saturation: c)} +2 | a {b: color.scale(red, $saturation: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> lightness/input.scss -a {b: scale-color(red, $lightness: c)} +@use 'sass:color'; +a {b: color.scale(red, $lightness: c)} <===> lightness/error Error: $lightness: c is not a number. , -1 | a {b: scale-color(red, $lightness: c)} +2 | a {b: color.scale(red, $lightness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> alpha/input.scss -a {b: scale-color(red, $alpha: c)} +@use 'sass:color'; +a {b: color.scale(red, $alpha: c)} <===> alpha/error Error: $alpha: c is not a number. , -1 | a {b: scale-color(red, $alpha: c)} +2 | a {b: color.scale(red, $alpha: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/input.scss +@use 'sass:color'; +a {b: color.scale(red, $alpha: none)} + +<===> none/error +Error: $alpha: none is not a number. + , +2 | a {b: color.scale(red, $alpha: none)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet <===> ================================================================================ <===> blackness/input.scss -a {b: scale-color(red, $blackness: c)} +@use 'sass:color'; +a {b: color.scale(red, $blackness: c)} <===> blackness/error Error: $blackness: c is not a number. , -1 | a {b: scale-color(red, $blackness: c)} +2 | a {b: color.scale(red, $blackness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> whiteness/input.scss -a {b: scale-color(red, $whiteness: c)} +@use 'sass:color'; +a {b: color.scale(red, $whiteness: c)} <===> whiteness/error Error: $whiteness: c is not a number. , -1 | a {b: scale-color(red, $whiteness: c)} +2 | a {b: color.scale(red, $whiteness: c)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet +<===> +================================================================================ +<===> space/input.scss +@use 'sass:color'; +a {b: color.scale(red, $space: 1)} + +<===> space/error +Error: $space: 1 is not a string. + , +2 | a {b: color.scale(red, $space: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/a98_rgb.hrx b/spec/core_functions/color/scale/error/units/a98_rgb.hrx new file mode 100644 index 0000000000..5fa1f11a7f --- /dev/null +++ b/spec/core_functions/color/scale/error/units/a98_rgb.hrx @@ -0,0 +1,81 @@ +<===> none/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 1)} + +<===> none/red/error +Error: $red: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 1)} + +<===> none/green/error +Error: $green: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 1)} + +<===> none/blue/error +Error: $blue: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 1px)} + +<===> wrong/red/error +Error: $red: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 1px)} + +<===> wrong/green/error +Error: $green: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 1px)} + +<===> wrong/blue/error +Error: $blue: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/display_p3.hrx b/spec/core_functions/color/scale/error/units/display_p3.hrx new file mode 100644 index 0000000000..fb43ae196a --- /dev/null +++ b/spec/core_functions/color/scale/error/units/display_p3.hrx @@ -0,0 +1,81 @@ +<===> none/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 1)} + +<===> none/red/error +Error: $red: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 1)} + +<===> none/green/error +Error: $green: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 1)} + +<===> none/blue/error +Error: $blue: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 1px)} + +<===> wrong/red/error +Error: $red: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 1px)} + +<===> wrong/green/error +Error: $green: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 1px)} + +<===> wrong/blue/error +Error: $blue: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/hsl.hrx b/spec/core_functions/color/scale/error/units/hsl.hrx new file mode 100644 index 0000000000..c08824457c --- /dev/null +++ b/spec/core_functions/color/scale/error/units/hsl.hrx @@ -0,0 +1,53 @@ +<===> none/saturation/input.scss +@use 'sass:color'; +a {b: color.scale(white, $saturation: 1)} + +<===> none/saturation/error +Error: $saturation: Expected 1 to have unit "%". + , +2 | a {b: color.scale(white, $saturation: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(white, $lightness: 1)} + +<===> none/lightness/error +Error: $lightness: Expected 1 to have unit "%". + , +2 | a {b: color.scale(white, $lightness: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/saturation/input.scss +@use 'sass:color'; +a {b: color.scale(white, $saturation: 1px)} + +<===> wrong/saturation/error +Error: $saturation: Expected 1px to have unit "%". + , +2 | a {b: color.scale(white, $saturation: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(white, $lightness: 1px)} + +<===> wrong/lightness/error +Error: $lightness: Expected 1px to have unit "%". + , +2 | a {b: color.scale(white, $lightness: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/hwb.hrx b/spec/core_functions/color/scale/error/units/hwb.hrx new file mode 100644 index 0000000000..7883c9e210 --- /dev/null +++ b/spec/core_functions/color/scale/error/units/hwb.hrx @@ -0,0 +1,53 @@ +<===> none/whiteness/input.scss +@use 'sass:color'; +a {b: color.scale(white, $whiteness: 1)} + +<===> none/whiteness/error +Error: $whiteness: Expected 1 to have unit "%". + , +2 | a {b: color.scale(white, $whiteness: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/blackness/input.scss +@use 'sass:color'; +a {b: color.scale(white, $blackness: 1)} + +<===> none/blackness/error +Error: $blackness: Expected 1 to have unit "%". + , +2 | a {b: color.scale(white, $blackness: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/whiteness/input.scss +@use 'sass:color'; +a {b: color.scale(white, $whiteness: 1px)} + +<===> wrong/whiteness/error +Error: $whiteness: Expected 1px to have unit "%". + , +2 | a {b: color.scale(white, $whiteness: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/blackness/input.scss +@use 'sass:color'; +a {b: color.scale(white, $blackness: 1px)} + +<===> wrong/blackness/error +Error: $blackness: Expected 1px to have unit "%". + , +2 | a {b: color.scale(white, $blackness: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/lab.hrx b/spec/core_functions/color/scale/error/units/lab.hrx new file mode 100644 index 0000000000..2d626e78c3 --- /dev/null +++ b/spec/core_functions/color/scale/error/units/lab.hrx @@ -0,0 +1,81 @@ +<===> none/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% 40% -20%), $lightness: 1)} + +<===> none/lightness/error +Error: $lightness: Expected 1 to have unit "%". + , +2 | a {b: color.scale(lab(50% 40% -20%), $lightness: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/a/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% 40% -20%), $a: 1)} + +<===> none/a/error +Error: $a: Expected 1 to have unit "%". + , +2 | a {b: color.scale(lab(50% 40% -20%), $a: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/b/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% 40% -20%), $b: 1)} + +<===> none/b/error +Error: $b: Expected 1 to have unit "%". + , +2 | a {b: color.scale(lab(50% 40% -20%), $b: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% 40% -20%), $lightness: 1px)} + +<===> wrong/lightness/error +Error: $lightness: Expected 1px to have unit "%". + , +2 | a {b: color.scale(lab(50% 40% -20%), $lightness: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/a/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% 40% -20%), $a: 1px)} + +<===> wrong/a/error +Error: $a: Expected 1px to have unit "%". + , +2 | a {b: color.scale(lab(50% 40% -20%), $a: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/b/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% 40% -20%), $b: 1px)} + +<===> wrong/b/error +Error: $b: Expected 1px to have unit "%". + , +2 | a {b: color.scale(lab(50% 40% -20%), $b: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/lch.hrx b/spec/core_functions/color/scale/error/units/lch.hrx new file mode 100644 index 0000000000..14cd387d23 --- /dev/null +++ b/spec/core_functions/color/scale/error/units/lch.hrx @@ -0,0 +1,53 @@ +<===> none/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(lch(30% 70% 200deg), $lightness: 1)} + +<===> none/lightness/error +Error: $lightness: Expected 1 to have unit "%". + , +2 | a {b: color.scale(lch(30% 70% 200deg), $lightness: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/chroma/input.scss +@use 'sass:color'; +a {b: color.scale(lch(30% 70% 200deg), $chroma: 1)} + +<===> none/chroma/error +Error: $chroma: Expected 1 to have unit "%". + , +2 | a {b: color.scale(lch(30% 70% 200deg), $chroma: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(lch(30% 70% 200deg), $lightness: 1px)} + +<===> wrong/lightness/error +Error: $lightness: Expected 1px to have unit "%". + , +2 | a {b: color.scale(lch(30% 70% 200deg), $lightness: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/chroma/input.scss +@use 'sass:color'; +a {b: color.scale(lch(30% 70% 200deg), $chroma: 1px)} + +<===> wrong/chroma/error +Error: $chroma: Expected 1px to have unit "%". + , +2 | a {b: color.scale(lch(30% 70% 200deg), $chroma: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/oklab.hrx b/spec/core_functions/color/scale/error/units/oklab.hrx new file mode 100644 index 0000000000..298bf58df1 --- /dev/null +++ b/spec/core_functions/color/scale/error/units/oklab.hrx @@ -0,0 +1,81 @@ +<===> none/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(50% 40% -20%), $lightness: 1)} + +<===> none/lightness/error +Error: $lightness: Expected 1 to have unit "%". + , +2 | a {b: color.scale(oklab(50% 40% -20%), $lightness: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/a/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(50% 40% -20%), $a: 1)} + +<===> none/a/error +Error: $a: Expected 1 to have unit "%". + , +2 | a {b: color.scale(oklab(50% 40% -20%), $a: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/b/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(50% 40% -20%), $b: 1)} + +<===> none/b/error +Error: $b: Expected 1 to have unit "%". + , +2 | a {b: color.scale(oklab(50% 40% -20%), $b: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(50% 40% -20%), $lightness: 1px)} + +<===> wrong/lightness/error +Error: $lightness: Expected 1px to have unit "%". + , +2 | a {b: color.scale(oklab(50% 40% -20%), $lightness: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/a/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(50% 40% -20%), $a: 1px)} + +<===> wrong/a/error +Error: $a: Expected 1px to have unit "%". + , +2 | a {b: color.scale(oklab(50% 40% -20%), $a: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/b/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(50% 40% -20%), $b: 1px)} + +<===> wrong/b/error +Error: $b: Expected 1px to have unit "%". + , +2 | a {b: color.scale(oklab(50% 40% -20%), $b: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/oklch.hrx b/spec/core_functions/color/scale/error/units/oklch.hrx new file mode 100644 index 0000000000..14cd387d23 --- /dev/null +++ b/spec/core_functions/color/scale/error/units/oklch.hrx @@ -0,0 +1,53 @@ +<===> none/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(lch(30% 70% 200deg), $lightness: 1)} + +<===> none/lightness/error +Error: $lightness: Expected 1 to have unit "%". + , +2 | a {b: color.scale(lch(30% 70% 200deg), $lightness: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/chroma/input.scss +@use 'sass:color'; +a {b: color.scale(lch(30% 70% 200deg), $chroma: 1)} + +<===> none/chroma/error +Error: $chroma: Expected 1 to have unit "%". + , +2 | a {b: color.scale(lch(30% 70% 200deg), $chroma: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/lightness/input.scss +@use 'sass:color'; +a {b: color.scale(lch(30% 70% 200deg), $lightness: 1px)} + +<===> wrong/lightness/error +Error: $lightness: Expected 1px to have unit "%". + , +2 | a {b: color.scale(lch(30% 70% 200deg), $lightness: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/chroma/input.scss +@use 'sass:color'; +a {b: color.scale(lch(30% 70% 200deg), $chroma: 1px)} + +<===> wrong/chroma/error +Error: $chroma: Expected 1px to have unit "%". + , +2 | a {b: color.scale(lch(30% 70% 200deg), $chroma: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/prophoto_rgb.hrx b/spec/core_functions/color/scale/error/units/prophoto_rgb.hrx new file mode 100644 index 0000000000..0cabe6f1d5 --- /dev/null +++ b/spec/core_functions/color/scale/error/units/prophoto_rgb.hrx @@ -0,0 +1,81 @@ +<===> none/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 1)} + +<===> none/red/error +Error: $red: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 1)} + +<===> none/green/error +Error: $green: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 1)} + +<===> none/blue/error +Error: $blue: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 1px)} + +<===> wrong/red/error +Error: $red: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 1px)} + +<===> wrong/green/error +Error: $green: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 1px)} + +<===> wrong/blue/error +Error: $blue: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/rec2020.hrx b/spec/core_functions/color/scale/error/units/rec2020.hrx new file mode 100644 index 0000000000..ff2a9c135f --- /dev/null +++ b/spec/core_functions/color/scale/error/units/rec2020.hrx @@ -0,0 +1,81 @@ +<===> none/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 1)} + +<===> none/red/error +Error: $red: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 1)} + +<===> none/green/error +Error: $green: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 1)} + +<===> none/blue/error +Error: $blue: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 1px)} + +<===> wrong/red/error +Error: $red: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 1px)} + +<===> wrong/green/error +Error: $green: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 1px)} + +<===> wrong/blue/error +Error: $blue: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/rgb.hrx b/spec/core_functions/color/scale/error/units/rgb.hrx new file mode 100644 index 0000000000..713f594fe4 --- /dev/null +++ b/spec/core_functions/color/scale/error/units/rgb.hrx @@ -0,0 +1,81 @@ +<===> none/red/input.scss +@use 'sass:color'; +a {b: color.scale(white, $red: 1)} + +<===> none/red/error +Error: $red: Expected 1 to have unit "%". + , +2 | a {b: color.scale(white, $red: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/green/input.scss +@use 'sass:color'; +a {b: color.scale(white, $green: 1)} + +<===> none/green/error +Error: $green: Expected 1 to have unit "%". + , +2 | a {b: color.scale(white, $green: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/blue/input.scss +@use 'sass:color'; +a {b: color.scale(white, $blue: 1)} + +<===> none/blue/error +Error: $blue: Expected 1 to have unit "%". + , +2 | a {b: color.scale(white, $blue: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/red/input.scss +@use 'sass:color'; +a {b: color.scale(white, $red: 1px)} + +<===> wrong/red/error +Error: $red: Expected 1px to have unit "%". + , +2 | a {b: color.scale(white, $red: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/green/input.scss +@use 'sass:color'; +a {b: color.scale(white, $green: 1px)} + +<===> wrong/green/error +Error: $green: Expected 1px to have unit "%". + , +2 | a {b: color.scale(white, $green: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/blue/input.scss +@use 'sass:color'; +a {b: color.scale(white, $blue: 1px)} + +<===> wrong/blue/error +Error: $blue: Expected 1px to have unit "%". + , +2 | a {b: color.scale(white, $blue: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/srgb.hrx b/spec/core_functions/color/scale/error/units/srgb.hrx new file mode 100644 index 0000000000..818bbed16e --- /dev/null +++ b/spec/core_functions/color/scale/error/units/srgb.hrx @@ -0,0 +1,81 @@ +<===> none/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 1)} + +<===> none/red/error +Error: $red: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 1)} + +<===> none/green/error +Error: $green: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 1)} + +<===> none/blue/error +Error: $blue: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 1px)} + +<===> wrong/red/error +Error: $red: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 1px)} + +<===> wrong/green/error +Error: $green: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 1px)} + +<===> wrong/blue/error +Error: $blue: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/srgb_linear.hrx b/spec/core_functions/color/scale/error/units/srgb_linear.hrx new file mode 100644 index 0000000000..dfda62e1e8 --- /dev/null +++ b/spec/core_functions/color/scale/error/units/srgb_linear.hrx @@ -0,0 +1,81 @@ +<===> none/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 1)} + +<===> none/red/error +Error: $red: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 1)} + +<===> none/green/error +Error: $green: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 1)} + +<===> none/blue/error +Error: $blue: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/red/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 1px)} + +<===> wrong/red/error +Error: $red: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/green/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 1px)} + +<===> wrong/green/error +Error: $green: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/blue/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 1px)} + +<===> wrong/blue/error +Error: $blue: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/xyz_d50.hrx b/spec/core_functions/color/scale/error/units/xyz_d50.hrx new file mode 100644 index 0000000000..38f0ca35fc --- /dev/null +++ b/spec/core_functions/color/scale/error/units/xyz_d50.hrx @@ -0,0 +1,81 @@ +<===> none/x/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 1)} + +<===> none/x/error +Error: $x: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/y/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 1)} + +<===> none/y/error +Error: $y: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/z/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 1)} + +<===> none/z/error +Error: $z: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/x/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 1px)} + +<===> wrong/x/error +Error: $x: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/y/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 1px)} + +<===> wrong/y/error +Error: $y: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/z/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 1px)} + +<===> wrong/z/error +Error: $z: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/units/xyz_d65.hrx b/spec/core_functions/color/scale/error/units/xyz_d65.hrx new file mode 100644 index 0000000000..640ea963dd --- /dev/null +++ b/spec/core_functions/color/scale/error/units/xyz_d65.hrx @@ -0,0 +1,81 @@ +<===> none/x/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 1)} + +<===> none/x/error +Error: $x: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/y/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 1)} + +<===> none/y/error +Error: $y: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> none/z/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 1)} + +<===> none/z/error +Error: $z: Expected 1 to have unit "%". + , +2 | a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/x/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 1px)} + +<===> wrong/x/error +Error: $x: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/y/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 1px)} + +<===> wrong/y/error +Error: $y: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> wrong/z/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 1px)} + +<===> wrong/z/error +Error: $z: Expected 1px to have unit "%". + , +2 | a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 1px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/global.hrx b/spec/core_functions/color/scale/global.hrx new file mode 100644 index 0000000000..ce1704d54a --- /dev/null +++ b/spec/core_functions/color/scale/global.hrx @@ -0,0 +1,17 @@ +<===> legacy/input.scss +a {b: scale-color(pink, $blue: 20%)} + +<===> legacy/output.css +a { + b: rgb(255, 192, 213.4); +} + +<===> +================================================================================ +<===> non_legacy/input.scss +a {b: scale-color(pink, $chroma: -10%, $space: oklch)} + +<===> non_legacy/output.css +a { + b: rgb(250.9720040643, 194.0861924561, 203.8303793932); +} diff --git a/spec/core_functions/color/scale_color/hsl.hrx b/spec/core_functions/color/scale/hsl.hrx similarity index 73% rename from spec/core_functions/color/scale_color/hsl.hrx rename to spec/core_functions/color/scale/hsl.hrx index 3aadddd40f..41ccb4a4e5 100644 --- a/spec/core_functions/color/scale_color/hsl.hrx +++ b/spec/core_functions/color/scale/hsl.hrx @@ -1,5 +1,6 @@ <===> saturation/max/input.scss -a {b: scale-color(plum, $saturation: 100%)} +@use 'sass:color'; +a {b: color.scale(plum, $saturation: 100%)} <===> saturation/max/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> saturation/zero/input.scss -a {b: scale-color(plum, $saturation: 0%)} +@use 'sass:color'; +a {b: color.scale(plum, $saturation: 0%)} <===> saturation/zero/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> saturation/min/input.scss -a {b: scale-color(plum, $saturation: -100%)} +@use 'sass:color'; +a {b: color.scale(plum, $saturation: -100%)} <===> saturation/min/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> saturation/high/input.scss -a {b: scale-color(plum, $saturation: 67%)} +@use 'sass:color'; +a {b: color.scale(plum, $saturation: 67%)} <===> saturation/high/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> saturation/low/input.scss -a {b: scale-color(plum, $saturation: -43%)} +@use 'sass:color'; +a {b: color.scale(plum, $saturation: -43%)} <===> saturation/low/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> lightness/max/input.scss -a {b: scale-color(red, $lightness: 100%)} +@use 'sass:color'; +a {b: color.scale(red, $lightness: 100%)} <===> lightness/max/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> lightness/zero/input.scss -a {b: scale-color(red, $lightness: 0%)} +@use 'sass:color'; +a {b: color.scale(red, $lightness: 0%)} <===> lightness/zero/output.css a { @@ -69,7 +76,8 @@ a { <===> ================================================================================ <===> lightness/min/input.scss -a {b: scale-color(red, $lightness: -100%)} +@use 'sass:color'; +a {b: color.scale(red, $lightness: -100%)} <===> lightness/min/output.css a { @@ -79,7 +87,8 @@ a { <===> ================================================================================ <===> lightness/high/input.scss -a {b: scale-color(red, $lightness: 94%)} +@use 'sass:color'; +a {b: color.scale(red, $lightness: 94%)} <===> lightness/high/output.css a { @@ -89,7 +98,8 @@ a { <===> ================================================================================ <===> lightness/low/input.scss -a {b: scale-color(red, $lightness: -14%)} +@use 'sass:color'; +a {b: color.scale(red, $lightness: -14%)} <===> lightness/low/output.css a { @@ -99,7 +109,8 @@ a { <===> ================================================================================ <===> all/input.scss -a {b: scale-color(turquoise, $saturation: 24%, $lightness: -48%)} +@use 'sass:color'; +a {b: color.scale(turquoise, $saturation: 24%, $lightness: -48%)} <===> all/output.css a { @@ -109,7 +120,8 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -a {b: scale-color(rgba(turquoise, 0.7), $saturation: 24%, $lightness: -48%)} +@use 'sass:color'; +a {b: color.scale(rgba(turquoise, 0.7), $saturation: 24%, $lightness: -48%)} <===> alpha_input/output.css a { @@ -119,7 +131,8 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -a {b: scale-color(turquoise, $saturation: 24%, $lightness: -48%, $alpha: -70%)} +@use 'sass:color'; +a {b: color.scale(turquoise, $saturation: 24%, $lightness: -48%, $alpha: -70%)} <===> alpha_arg/output.css a { @@ -129,7 +142,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: scale-color($color: turquoise, $saturation: 24%, $lightness: -48%)} +@use 'sass:color'; +a {b: color.scale($color: turquoise, $saturation: 24%, $lightness: -48%)} <===> named/output.css a { diff --git a/spec/core_functions/color/scale_color/hwb.hrx b/spec/core_functions/color/scale/hwb.hrx similarity index 71% rename from spec/core_functions/color/scale_color/hwb.hrx rename to spec/core_functions/color/scale/hwb.hrx index 22e4305db2..5c55594298 100644 --- a/spec/core_functions/color/scale_color/hwb.hrx +++ b/spec/core_functions/color/scale/hwb.hrx @@ -1,5 +1,6 @@ <===> whiteness/max/input.scss -a {b: scale-color(#66cc99, $whiteness: 100%)} +@use 'sass:color'; +a {b: color.scale(#66cc99, $whiteness: 100%)} <===> whiteness/max/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> whiteness/zero/input.scss -a {b: scale-color(#66cc99, $whiteness: 0%)} +@use 'sass:color'; +a {b: color.scale(#66cc99, $whiteness: 0%)} <===> whiteness/zero/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> whiteness/min/input.scss -a {b: scale-color(#66cc99, $whiteness: -100%)} +@use 'sass:color'; +a {b: color.scale(#66cc99, $whiteness: -100%)} <===> whiteness/min/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> whiteness/high/input.scss -a {b: scale-color(#33cc80, $whiteness: 50%)} +@use 'sass:color'; +a {b: color.scale(#33cc80, $whiteness: 50%)} <===> whiteness/high/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> whiteness/low/input.scss -a {b: scale-color(#66cc99, $whiteness: -50%)} +@use 'sass:color'; +a {b: color.scale(#66cc99, $whiteness: -50%)} <===> whiteness/low/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> blackness/max/input.scss -a {b: scale-color(#339966, $blackness: 100%)} +@use 'sass:color'; +a {b: color.scale(#339966, $blackness: 100%)} <===> blackness/max/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> blackness/zero/input.scss -a {b: scale-color(#339966, $blackness: 0%)} +@use 'sass:color'; +a {b: color.scale(#339966, $blackness: 0%)} <===> blackness/zero/output.css a { @@ -69,7 +76,8 @@ a { <===> ================================================================================ <===> blackness/min/input.scss -a {b: scale-color(#339966, $blackness: -100%)} +@use 'sass:color'; +a {b: color.scale(#339966, $blackness: -100%)} <===> blackness/min/output.css a { @@ -79,7 +87,8 @@ a { <===> ================================================================================ <===> blackness/high/input.scss -a {b: scale-color(#33cc80, $blackness: 50%)} +@use 'sass:color'; +a {b: color.scale(#33cc80, $blackness: 50%)} <===> blackness/high/output.css a { @@ -89,7 +98,8 @@ a { <===> ================================================================================ <===> blackness/low/input.scss -a {b: scale-color(#339966, $blackness: -50%)} +@use 'sass:color'; +a {b: color.scale(#339966, $blackness: -50%)} <===> blackness/low/output.css a { @@ -99,7 +109,8 @@ a { <===> ================================================================================ <===> all/input.scss -a {b: scale-color(#66cc99, $whiteness: -50%, $blackness: 50%)} +@use 'sass:color'; +a {b: color.scale(#66cc99, $whiteness: -50%, $blackness: 50%)} <===> all/output.css a { @@ -109,7 +120,8 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -a {b: scale-color(rgba(#66cc99, 0.7), $whiteness: -50%, $blackness: 50%)} +@use 'sass:color'; +a {b: color.scale(rgba(#66cc99, 0.7), $whiteness: -50%, $blackness: 50%)} <===> alpha_input/output.css a { @@ -119,7 +131,8 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -a {b: scale-color(#66cc99, $whiteness: -50%, $blackness: 50%, $alpha: -70%)} +@use 'sass:color'; +a {b: color.scale(#66cc99, $whiteness: -50%, $blackness: 50%, $alpha: -70%)} <===> alpha_arg/output.css a { @@ -129,7 +142,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: scale-color($color: #66cc99, $whiteness: -50%, $blackness: 50%)} +@use 'sass:color'; +a {b: color.scale($color: #66cc99, $whiteness: -50%, $blackness: 50%)} <===> named/output.css a { diff --git a/spec/core_functions/color/scale/lab.hrx b/spec/core_functions/color/scale/lab.hrx new file mode 100644 index 0000000000..68c46da23a --- /dev/null +++ b/spec/core_functions/color/scale/lab.hrx @@ -0,0 +1,217 @@ +<===> lightness/max/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $lightness: 100%)} + +<===> lightness/max/output.css +a { + b: lab(100% 100 -60); +} + +<===> +================================================================================ +<===> lightness/min/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $lightness: -100%)} + +<===> lightness/min/output.css +a { + b: lab(0% 100 -60); +} + +<===> +================================================================================ +<===> lightness/zero/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $lightness: 0%)} + +<===> lightness/zero/output.css +a { + b: lab(70% 100 -60); +} + +<===> +================================================================================ +<===> lightness/low/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $lightness: -33%)} + +<===> lightness/low/output.css +a { + b: lab(46.9% 100 -60); +} + +<===> +================================================================================ +<===> lightness/high/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $lightness: 86%)} + +<===> lightness/high/output.css +a { + b: lab(95.8% 100 -60); +} + +<===> +================================================================================ +<===> a/max/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $a: 100%)} + +<===> a/max/output.css +a { + b: lab(70% 125 -60); +} + +<===> +================================================================================ +<===> a/min/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $a: -100%)} + +<===> a/min/output.css +a { + b: lab(70% -125 -60); +} + +<===> +================================================================================ +<===> a/zero/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $a: 0%)} + +<===> a/zero/output.css +a { + b: lab(70% 100 -60); +} + +<===> +================================================================================ +<===> a/low/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $a: -86%)} + +<===> a/low/output.css +a { + b: lab(70% -93.5 -60); +} + +<===> +================================================================================ +<===> a/high/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $a: 12%)} + +<===> a/high/output.css +a { + b: lab(70% 103 -60); +} + +<===> +================================================================================ +<===> b/max/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $b: 100%)} + +<===> b/max/output.css +a { + b: lab(70% 100 125); +} + +<===> +================================================================================ +<===> b/min/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $b: -100%)} + +<===> b/min/output.css +a { + b: lab(70% 100 -125); +} + +<===> +================================================================================ +<===> b/zero/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $b: 0%)} + +<===> b/zero/output.css +a { + b: lab(70% 100 -60); +} + +<===> +================================================================================ +<===> b/low/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $b: -16%)} + +<===> b/low/output.css +a { + b: lab(70% 100 -70.4); +} + +<===> +================================================================================ +<===> b/high/input.scss +@use 'sass:color'; +a {b: color.scale(lab(70% 100 -60), $b: 42%)} + +<===> b/high/output.css +a { + b: lab(70% 100 17.7); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale(lab(70% 100 -60), $lightness: 12%, $a: 24%, $b: 48%); +} + +<===> all/output.css +a { + b: lab(73.6% 106 28.8); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale(lab(70% 100 -60 / 0.3), $lightness: 12%, $a: 24%, $b: 48%); +} + +<===> alpha_input/output.css +a { + b: lab(73.6% 106 28.8 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + lab(70% 100 -60), + $lightness: 12%, $a: 24%, $b: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: lab(73.6% 106 28.8 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale($color: lab(70% 100 -60), $lightness: 12%, $a: 24%, $b: 48%); +} + +<===> named/output.css +a { + b: lab(73.6% 106 28.8); +} diff --git a/spec/core_functions/color/scale/lch.hrx b/spec/core_functions/color/scale/lch.hrx new file mode 100644 index 0000000000..a0a5204057 --- /dev/null +++ b/spec/core_functions/color/scale/lch.hrx @@ -0,0 +1,158 @@ +<===> lightness/max/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $lightness: 100%)} + +<===> lightness/max/output.css +a { + b: lch(100% 30 80deg); +} + +<===> +================================================================================ +<===> lightness/min/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $lightness: -100%)} + +<===> lightness/min/output.css +a { + b: lch(0% 30 80deg); +} + +<===> +================================================================================ +<===> lightness/zero/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $lightness: 0%)} + +<===> lightness/zero/output.css +a { + b: lch(70% 30 80deg); +} + +<===> +================================================================================ +<===> lightness/low/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $lightness: -33%)} + +<===> lightness/low/output.css +a { + b: lch(46.9% 30 80deg); +} + +<===> +================================================================================ +<===> lightness/high/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $lightness: 86%)} + +<===> lightness/high/output.css +a { + b: lch(95.8% 30 80deg); +} + +<===> +================================================================================ +<===> chroma/max/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $chroma: 100%)} + +<===> chroma/max/output.css +a { + b: lch(70% 150 80deg); +} + +<===> +================================================================================ +<===> chroma/min/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $chroma: -100%)} + +<===> chroma/min/output.css +a { + b: lch(70% 0 80deg); +} + +<===> +================================================================================ +<===> chroma/zero/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $chroma: 0%)} + +<===> chroma/zero/output.css +a { + b: lch(70% 30 80deg); +} + +<===> +================================================================================ +<===> chroma/low/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $chroma: -86%)} + +<===> chroma/low/output.css +a { + b: lch(70% 4.2 80deg); +} + +<===> +================================================================================ +<===> chroma/high/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $chroma: 12%)} + +<===> chroma/high/output.css +a { + b: lch(70% 44.4 80deg); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a {b: color.scale(lch(70% 20% 80deg), $lightness: 12%, $chroma: 24%)} + +<===> all/output.css +a { + b: lch(73.6% 58.8 80deg); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale(lch(70% 20% 80deg / 0.3), $lightness: 12%, $chroma: 24%); +} + +<===> alpha_input/output.css +a { + b: lch(73.6% 58.8 80deg / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + lch(70% 20% 80deg), + $lightness: 12%, $chroma: 24%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: lch(73.6% 58.8 80deg / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a {b: color.scale($color: lch(70% 20% 80deg), $lightness: 12%, $chroma: 24%)} + +<===> named/output.css +a { + b: lch(73.6% 58.8 80deg); +} diff --git a/spec/core_functions/color/scale/no_channels.hrx b/spec/core_functions/color/scale/no_channels.hrx new file mode 100644 index 0000000000..8758389ad3 --- /dev/null +++ b/spec/core_functions/color/scale/no_channels.hrx @@ -0,0 +1,19 @@ +<===> identical/input.scss +@use 'sass:color'; +a {b: color.scale(oklch(50% 0.2 0deg), $space: lab)} + +<===> identical/output.css +a { + b: oklch(50% 0.2 0deg); +} + +<===> +================================================================================ +<===> powerless/input.scss +@use 'sass:color'; +a {b: color.scale(oklch(50% 0 0deg), $space: lab)} + +<===> powerless/output.css +a { + b: oklch(50% 0 none); +} diff --git a/spec/core_functions/color/scale_color/no_rgb_hsl.hrx b/spec/core_functions/color/scale/no_space.hrx similarity index 71% rename from spec/core_functions/color/scale_color/no_rgb_hsl.hrx rename to spec/core_functions/color/scale/no_space.hrx index 634574c8c2..c1a4c4a853 100644 --- a/spec/core_functions/color/scale_color/no_rgb_hsl.hrx +++ b/spec/core_functions/color/scale/no_space.hrx @@ -1,5 +1,6 @@ <===> positional/input.scss -a {b: scale-color(red)} +@use 'sass:color'; +a {b: color.scale(red)} <===> positional/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: scale-color($color: red)} +@use 'sass:color'; +a {b: color.scale($color: red)} <===> named/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> alpha/max/input.scss -a {b: scale-color(rgba(red, 0.5), $alpha: 100%)} +@use 'sass:color'; +a {b: color.scale(rgba(red, 0.5), $alpha: 100%)} <===> alpha/max/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> alpha/zero/input.scss -a {b: scale-color(rgba(red, 0.5), $alpha: 0%)} +@use 'sass:color'; +a {b: color.scale(rgba(red, 0.5), $alpha: 0%)} <===> alpha/zero/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> alpha/min/input.scss -a {b: scale-color(rgba(red, 0.5), $alpha: -100%)} +@use 'sass:color'; +a {b: color.scale(rgba(red, 0.5), $alpha: -100%)} <===> alpha/min/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> alpha/high/input.scss -a {b: scale-color(rgba(red, 0.5), $alpha: 14%)} +@use 'sass:color'; +a {b: color.scale(rgba(red, 0.5), $alpha: 14%)} <===> alpha/high/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> alpha/low/input.scss -a {b: scale-color(rgba(red, 0.3), $alpha: -36%)} +@use 'sass:color'; +a {b: color.scale(rgba(red, 0.3), $alpha: -36%)} <===> alpha/low/output.css a { diff --git a/spec/core_functions/color/scale/oklab.hrx b/spec/core_functions/color/scale/oklab.hrx new file mode 100644 index 0000000000..2f511ee2d2 --- /dev/null +++ b/spec/core_functions/color/scale/oklab.hrx @@ -0,0 +1,217 @@ +<===> lightness/max/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: 100%)} + +<===> lightness/max/output.css +a { + b: oklab(100% 0.3 -0.25); +} + +<===> +================================================================================ +<===> lightness/min/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: -100%)} + +<===> lightness/min/output.css +a { + b: oklab(0% 0.3 -0.25); +} + +<===> +================================================================================ +<===> lightness/zero/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: 0%)} + +<===> lightness/zero/output.css +a { + b: oklab(70% 0.3 -0.25); +} + +<===> +================================================================================ +<===> lightness/low/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: -33%)} + +<===> lightness/low/output.css +a { + b: oklab(46.9% 0.3 -0.25); +} + +<===> +================================================================================ +<===> lightness/high/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: 86%)} + +<===> lightness/high/output.css +a { + b: oklab(95.8% 0.3 -0.25); +} + +<===> +================================================================================ +<===> a/max/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $a: 100%)} + +<===> a/max/output.css +a { + b: oklab(70% 0.4 -0.25); +} + +<===> +================================================================================ +<===> a/min/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $a: -100%)} + +<===> a/min/output.css +a { + b: oklab(70% -0.4 -0.25); +} + +<===> +================================================================================ +<===> a/zero/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $a: 0%)} + +<===> a/zero/output.css +a { + b: oklab(70% 0.3 -0.25); +} + +<===> +================================================================================ +<===> a/low/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $a: -86%)} + +<===> a/low/output.css +a { + b: oklab(70% -0.302 -0.25); +} + +<===> +================================================================================ +<===> a/high/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $a: 12%)} + +<===> a/high/output.css +a { + b: oklab(70% 0.312 -0.25); +} + +<===> +================================================================================ +<===> b/max/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $b: 100%)} + +<===> b/max/output.css +a { + b: oklab(70% 0.3 0.4); +} + +<===> +================================================================================ +<===> b/min/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $b: -100%)} + +<===> b/min/output.css +a { + b: oklab(70% 0.3 -0.4); +} + +<===> +================================================================================ +<===> b/zero/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $b: 0%)} + +<===> b/zero/output.css +a { + b: oklab(70% 0.3 -0.25); +} + +<===> +================================================================================ +<===> b/low/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $b: -16%)} + +<===> b/low/output.css +a { + b: oklab(70% 0.3 -0.274); +} + +<===> +================================================================================ +<===> b/high/input.scss +@use 'sass:color'; +a {b: color.scale(oklab(70% 0.3 -0.25), $b: 42%)} + +<===> b/high/output.css +a { + b: oklab(70% 0.3 0.023); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale(oklab(70% 0.3 -0.25), $lightness: 12%, $a: 24%, $b: 48%); +} + +<===> all/output.css +a { + b: oklab(73.6% 0.324 0.062); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale(oklab(70% 0.3 -0.25 / 0.3), $lightness: 12%, $a: 24%, $b: 48%); +} + +<===> alpha_input/output.css +a { + b: oklab(73.6% 0.324 0.062 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + oklab(70% 0.3 -0.25), + $lightness: 12%, $a: 24%, $b: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: oklab(73.6% 0.324 0.062 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale($color: oklab(70% 0.3 -0.25), $lightness: 12%, $a: 24%, $b: 48%); +} + +<===> named/output.css +a { + b: oklab(73.6% 0.324 0.062); +} diff --git a/spec/core_functions/color/scale/out_of_gamut.hrx b/spec/core_functions/color/scale/out_of_gamut.hrx new file mode 100644 index 0000000000..3641143439 --- /dev/null +++ b/spec/core_functions/color/scale/out_of_gamut.hrx @@ -0,0 +1,41 @@ +<===> above_gamut/up/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 1.2 0.5 0.7), $red: 10%)} + +<===> above_gamut/up/output.css +a { + b: color(srgb 1.2 0.5 0.7); +} + +<===> +================================================================================ +<===> above_gamut/down/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 1.2 0.5 0.7), $red: -10%)} + +<===> above_gamut/down/output.css +a { + b: color(srgb 1.08 0.5 0.7); +} + +<===> +================================================================================ +<===> below_gamut/up/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb -0.5 0.5 0.7), $red: 10%)} + +<===> below_gamut/up/output.css +a { + b: color(srgb -0.35 0.5 0.7); +} + +<===> +================================================================================ +<===> below_gamut/down/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb -0.5 0.5 0.7), $red: -10%)} + +<===> below_gamut/down/output.css +a { + b: color(srgb -0.5 0.5 0.7); +} diff --git a/spec/core_functions/color/scale/prophoto_rgb.hrx b/spec/core_functions/color/scale/prophoto_rgb.hrx new file mode 100644 index 0000000000..a00ddfc6cc --- /dev/null +++ b/spec/core_functions/color/scale/prophoto_rgb.hrx @@ -0,0 +1,225 @@ +<===> red/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 100%)} + +<===> red/max/output.css +a { + b: color(prophoto-rgb 1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: -100%)} + +<===> red/min/output.css +a { + b: color(prophoto-rgb 0 0.5 0.7); +} + +<===> +================================================================================ +<===> red/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 0%)} + +<===> red/zero/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> red/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: -33%)} + +<===> red/low/output.css +a { + b: color(prophoto-rgb 0.134 0.5 0.7); +} + +<===> +================================================================================ +<===> red/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 86%)} + +<===> red/high/output.css +a { + b: color(prophoto-rgb 0.888 0.5 0.7); +} + +<===> +================================================================================ +<===> green/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 100%)} + +<===> green/max/output.css +a { + b: color(prophoto-rgb 0.2 1 0.7); +} + +<===> +================================================================================ +<===> green/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: -100%)} + +<===> green/min/output.css +a { + b: color(prophoto-rgb 0.2 0 0.7); +} + +<===> +================================================================================ +<===> green/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 0%)} + +<===> green/zero/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: -86%)} + +<===> green/low/output.css +a { + b: color(prophoto-rgb 0.2 0.07 0.7); +} + +<===> +================================================================================ +<===> green/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 12%)} + +<===> green/high/output.css +a { + b: color(prophoto-rgb 0.2 0.56 0.7); +} + +<===> +================================================================================ +<===> blue/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 100%)} + +<===> blue/max/output.css +a { + b: color(prophoto-rgb 0.2 0.5 1); +} + +<===> +================================================================================ +<===> blue/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: -100%)} + +<===> blue/min/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0); +} + +<===> +================================================================================ +<===> blue/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0%)} + +<===> blue/zero/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> blue/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: -16%)} + +<===> blue/low/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.588); +} + +<===> +================================================================================ +<===> blue/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 42%)} + +<===> blue/high/output.css +a { + b: color(prophoto-rgb 0.2 0.5 0.826); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(prophoto-rgb 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> all/output.css +a { + b: color(prophoto-rgb 0.296 0.62 0.844); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(prophoto-rgb 0.2 0.5 0.7 / 0.3), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> alpha_input/output.css +a { + b: color(prophoto-rgb 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(prophoto-rgb 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: color(prophoto-rgb 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale( + $color: color(prophoto-rgb 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> named/output.css +a { + b: color(prophoto-rgb 0.296 0.62 0.844); +} diff --git a/spec/core_functions/color/scale/rec2020.hrx b/spec/core_functions/color/scale/rec2020.hrx new file mode 100644 index 0000000000..5f05d3215b --- /dev/null +++ b/spec/core_functions/color/scale/rec2020.hrx @@ -0,0 +1,225 @@ +<===> red/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 100%)} + +<===> red/max/output.css +a { + b: color(rec2020 1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: -100%)} + +<===> red/min/output.css +a { + b: color(rec2020 0 0.5 0.7); +} + +<===> +================================================================================ +<===> red/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 0%)} + +<===> red/zero/output.css +a { + b: color(rec2020 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> red/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: -33%)} + +<===> red/low/output.css +a { + b: color(rec2020 0.134 0.5 0.7); +} + +<===> +================================================================================ +<===> red/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 86%)} + +<===> red/high/output.css +a { + b: color(rec2020 0.888 0.5 0.7); +} + +<===> +================================================================================ +<===> green/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 100%)} + +<===> green/max/output.css +a { + b: color(rec2020 0.2 1 0.7); +} + +<===> +================================================================================ +<===> green/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: -100%)} + +<===> green/min/output.css +a { + b: color(rec2020 0.2 0 0.7); +} + +<===> +================================================================================ +<===> green/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 0%)} + +<===> green/zero/output.css +a { + b: color(rec2020 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: -86%)} + +<===> green/low/output.css +a { + b: color(rec2020 0.2 0.07 0.7); +} + +<===> +================================================================================ +<===> green/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 12%)} + +<===> green/high/output.css +a { + b: color(rec2020 0.2 0.56 0.7); +} + +<===> +================================================================================ +<===> blue/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 100%)} + +<===> blue/max/output.css +a { + b: color(rec2020 0.2 0.5 1); +} + +<===> +================================================================================ +<===> blue/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: -100%)} + +<===> blue/min/output.css +a { + b: color(rec2020 0.2 0.5 0); +} + +<===> +================================================================================ +<===> blue/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 0%)} + +<===> blue/zero/output.css +a { + b: color(rec2020 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> blue/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: -16%)} + +<===> blue/low/output.css +a { + b: color(rec2020 0.2 0.5 0.588); +} + +<===> +================================================================================ +<===> blue/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 42%)} + +<===> blue/high/output.css +a { + b: color(rec2020 0.2 0.5 0.826); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(rec2020 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> all/output.css +a { + b: color(rec2020 0.296 0.62 0.844); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(rec2020 0.2 0.5 0.7 / 0.3), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> alpha_input/output.css +a { + b: color(rec2020 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(rec2020 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: color(rec2020 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale( + $color: color(rec2020 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> named/output.css +a { + b: color(rec2020 0.296 0.62 0.844); +} diff --git a/spec/core_functions/color/scale_color/rgb.hrx b/spec/core_functions/color/scale/rgb.hrx similarity index 72% rename from spec/core_functions/color/scale_color/rgb.hrx rename to spec/core_functions/color/scale/rgb.hrx index dade6d2776..d80ba9482d 100644 --- a/spec/core_functions/color/scale_color/rgb.hrx +++ b/spec/core_functions/color/scale/rgb.hrx @@ -1,5 +1,6 @@ <===> red/max/input.scss -a {b: scale-color(black, $red: 100%)} +@use 'sass:color'; +a {b: color.scale(black, $red: 100%)} <===> red/max/output.css a { @@ -9,7 +10,8 @@ a { <===> ================================================================================ <===> red/min/input.scss -a {b: scale-color(red, $red: -100%)} +@use 'sass:color'; +a {b: color.scale(red, $red: -100%)} <===> red/min/output.css a { @@ -19,7 +21,8 @@ a { <===> ================================================================================ <===> red/zero/input.scss -a {b: scale-color(black, $red: 0%)} +@use 'sass:color'; +a {b: color.scale(black, $red: 0%)} <===> red/zero/output.css a { @@ -29,7 +32,8 @@ a { <===> ================================================================================ <===> red/low/input.scss -a {b: scale-color(lightcoral, $red: -33%)} +@use 'sass:color'; +a {b: color.scale(lightcoral, $red: -33%)} <===> red/low/output.css a { @@ -39,7 +43,8 @@ a { <===> ================================================================================ <===> red/high/input.scss -a {b: scale-color(turquoise, $red: 86%)} +@use 'sass:color'; +a {b: color.scale(turquoise, $red: 86%)} <===> red/high/output.css a { @@ -49,7 +54,8 @@ a { <===> ================================================================================ <===> green/max/input.scss -a {b: scale-color(black, $green: 100%)} +@use 'sass:color'; +a {b: color.scale(black, $green: 100%)} <===> green/max/output.css a { @@ -59,7 +65,8 @@ a { <===> ================================================================================ <===> green/min/input.scss -a {b: scale-color(lime, $green: -100%)} +@use 'sass:color'; +a {b: color.scale(lime, $green: -100%)} <===> green/min/output.css a { @@ -69,7 +76,8 @@ a { <===> ================================================================================ <===> green/zero/input.scss -a {b: scale-color(black, $green: 0%)} +@use 'sass:color'; +a {b: color.scale(black, $green: 0%)} <===> green/zero/output.css a { @@ -79,7 +87,8 @@ a { <===> ================================================================================ <===> green/low/input.scss -a {b: scale-color(seagreen, $green: -86%)} +@use 'sass:color'; +a {b: color.scale(seagreen, $green: -86%)} <===> green/low/output.css a { @@ -89,7 +98,8 @@ a { <===> ================================================================================ <===> green/high/input.scss -a {b: scale-color(cadetblue, $green: 12%)} +@use 'sass:color'; +a {b: color.scale(cadetblue, $green: 12%)} <===> green/high/output.css a { @@ -99,7 +109,8 @@ a { <===> ================================================================================ <===> blue/max/input.scss -a {b: scale-color(black, $blue: 100%)} +@use 'sass:color'; +a {b: color.scale(black, $blue: 100%)} <===> blue/max/output.css a { @@ -109,7 +120,8 @@ a { <===> ================================================================================ <===> blue/min/input.scss -a {b: scale-color(blue, $blue: -100%)} +@use 'sass:color'; +a {b: color.scale(blue, $blue: -100%)} <===> blue/min/output.css a { @@ -119,7 +131,8 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -a {b: scale-color(black, $blue: 0%)} +@use 'sass:color'; +a {b: color.scale(black, $blue: 0%)} <===> blue/zero/output.css a { @@ -129,7 +142,8 @@ a { <===> ================================================================================ <===> blue/low/input.scss -a {b: scale-color(slategray, $blue: -16%)} +@use 'sass:color'; +a {b: color.scale(slategray, $blue: -16%)} <===> blue/low/output.css a { @@ -139,7 +153,8 @@ a { <===> ================================================================================ <===> blue/high/input.scss -a {b: scale-color(salmon, $blue: 42%)} +@use 'sass:color'; +a {b: color.scale(salmon, $blue: 42%)} <===> blue/high/output.css a { @@ -149,7 +164,8 @@ a { <===> ================================================================================ <===> all/input.scss -a {b: scale-color(sienna, $red: 12%, $green: 24%, $blue: 48%)} +@use 'sass:color'; +a {b: color.scale(sienna, $red: 12%, $green: 24%, $blue: 48%)} <===> all/output.css a { @@ -159,7 +175,8 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -a {b: scale-color(rgba(sienna, 0.3), $red: 12%, $green: 24%, $blue: 48%)} +@use 'sass:color'; +a {b: color.scale(rgba(sienna, 0.3), $red: 12%, $green: 24%, $blue: 48%)} <===> alpha_input/output.css a { @@ -169,7 +186,8 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -a {b: scale-color(sienna, $red: 12%, $green: 24%, $blue: 48%, $alpha: -70%)} +@use 'sass:color'; +a {b: color.scale(sienna, $red: 12%, $green: 24%, $blue: 48%, $alpha: -70%)} <===> alpha_arg/output.css a { @@ -179,7 +197,8 @@ a { <===> ================================================================================ <===> named/input.scss -a {b: scale-color($color: sienna, $red: 12%, $green: 24%, $blue: 48%)} +@use 'sass:color'; +a {b: color.scale($color: sienna, $red: 12%, $green: 24%, $blue: 48%)} <===> named/output.css a { diff --git a/spec/core_functions/color/scale/space.hrx b/spec/core_functions/color/scale/space.hrx new file mode 100644 index 0000000000..df196933ad --- /dev/null +++ b/spec/core_functions/color/scale/space.hrx @@ -0,0 +1,41 @@ +<===> legacy/to_legacy/input.scss +@use 'sass:color'; +a {b: color.scale(red, $saturation: -10%, $space: hsl)} + +<===> legacy/to_legacy/output.css +a { + b: rgb(242.25, 12.75, 12.75); +} + +<===> +================================================================================ +<===> legacy/to_modern/input.scss +@use 'sass:color'; +a {b: color.scale(red, $a: 10%, $space: lab)} + +<===> legacy/to_modern/output.css +a { + b: hsl(352.5777091359, 128.657405446%, 44.6392534152%); +} + +<===> +================================================================================ +<===> modern/to_legacy/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% 10 -20), $saturation: -20%, $space: hsl)} + +<===> modern/to_legacy/output.css +a { + b: lab(51.1280465895% 7.8762091679 -15.9907381545); +} + +<===> +================================================================================ +<===> modern/to_modern/input.scss +@use 'sass:color'; +a {b: color.scale(lab(50% 10 -20), $chroma: 20%, $space: oklch)} + +<===> modern/to_modern/output.css +a { + b: lab(48.9487508713% 24.2085150873 -41.732226413); +} diff --git a/spec/core_functions/color/scale/srgb.hrx b/spec/core_functions/color/scale/srgb.hrx new file mode 100644 index 0000000000..790cce490f --- /dev/null +++ b/spec/core_functions/color/scale/srgb.hrx @@ -0,0 +1,223 @@ +<===> red/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 100%)} + +<===> red/max/output.css +a { + b: color(srgb 1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: -100%)} + +<===> red/min/output.css +a { + b: color(srgb 0 0.5 0.7); +} + +<===> +================================================================================ +<===> red/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 0%)} + +<===> red/zero/output.css +a { + b: color(srgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> red/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: -33%)} + +<===> red/low/output.css +a { + b: color(srgb 0.134 0.5 0.7); +} + +<===> +================================================================================ +<===> red/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 86%)} + +<===> red/high/output.css +a { + b: color(srgb 0.888 0.5 0.7); +} + +<===> +================================================================================ +<===> green/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 100%)} + +<===> green/max/output.css +a { + b: color(srgb 0.2 1 0.7); +} + +<===> +================================================================================ +<===> green/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: -100%)} + +<===> green/min/output.css +a { + b: color(srgb 0.2 0 0.7); +} + +<===> +================================================================================ +<===> green/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 0%)} + +<===> green/zero/output.css +a { + b: color(srgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: -86%)} + +<===> green/low/output.css +a { + b: color(srgb 0.2 0.07 0.7); +} + +<===> +================================================================================ +<===> green/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 12%)} + +<===> green/high/output.css +a { + b: color(srgb 0.2 0.56 0.7); +} + +<===> +================================================================================ +<===> blue/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 100%)} + +<===> blue/max/output.css +a { + b: color(srgb 0.2 0.5 1); +} + +<===> +================================================================================ +<===> blue/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: -100%)} + +<===> blue/min/output.css +a { + b: color(srgb 0.2 0.5 0); +} + +<===> +================================================================================ +<===> blue/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 0%)} + +<===> blue/zero/output.css +a { + b: color(srgb 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> blue/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: -16%)} + +<===> blue/low/output.css +a { + b: color(srgb 0.2 0.5 0.588); +} + +<===> +================================================================================ +<===> blue/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 42%)} + +<===> blue/high/output.css +a { + b: color(srgb 0.2 0.5 0.826); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale(color(srgb 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48%); +} + +<===> all/output.css +a { + b: color(srgb 0.296 0.62 0.844); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(srgb 0.2 0.5 0.7 / 0.3), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> alpha_input/output.css +a { + b: color(srgb 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(srgb 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: color(srgb 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale( + $color: color(srgb 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> named/output.css +a { + b: color(srgb 0.296 0.62 0.844); +} diff --git a/spec/core_functions/color/scale/srgb_linear.hrx b/spec/core_functions/color/scale/srgb_linear.hrx new file mode 100644 index 0000000000..461f03ee9f --- /dev/null +++ b/spec/core_functions/color/scale/srgb_linear.hrx @@ -0,0 +1,225 @@ +<===> red/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 100%)} + +<===> red/max/output.css +a { + b: color(srgb-linear 1 0.5 0.7); +} + +<===> +================================================================================ +<===> red/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: -100%)} + +<===> red/min/output.css +a { + b: color(srgb-linear 0 0.5 0.7); +} + +<===> +================================================================================ +<===> red/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 0%)} + +<===> red/zero/output.css +a { + b: color(srgb-linear 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> red/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: -33%)} + +<===> red/low/output.css +a { + b: color(srgb-linear 0.134 0.5 0.7); +} + +<===> +================================================================================ +<===> red/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 86%)} + +<===> red/high/output.css +a { + b: color(srgb-linear 0.888 0.5 0.7); +} + +<===> +================================================================================ +<===> green/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 100%)} + +<===> green/max/output.css +a { + b: color(srgb-linear 0.2 1 0.7); +} + +<===> +================================================================================ +<===> green/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: -100%)} + +<===> green/min/output.css +a { + b: color(srgb-linear 0.2 0 0.7); +} + +<===> +================================================================================ +<===> green/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 0%)} + +<===> green/zero/output.css +a { + b: color(srgb-linear 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> green/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: -86%)} + +<===> green/low/output.css +a { + b: color(srgb-linear 0.2 0.07 0.7); +} + +<===> +================================================================================ +<===> green/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 12%)} + +<===> green/high/output.css +a { + b: color(srgb-linear 0.2 0.56 0.7); +} + +<===> +================================================================================ +<===> blue/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 100%)} + +<===> blue/max/output.css +a { + b: color(srgb-linear 0.2 0.5 1); +} + +<===> +================================================================================ +<===> blue/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: -100%)} + +<===> blue/min/output.css +a { + b: color(srgb-linear 0.2 0.5 0); +} + +<===> +================================================================================ +<===> blue/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 0%)} + +<===> blue/zero/output.css +a { + b: color(srgb-linear 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> blue/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: -16%)} + +<===> blue/low/output.css +a { + b: color(srgb-linear 0.2 0.5 0.588); +} + +<===> +================================================================================ +<===> blue/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 42%)} + +<===> blue/high/output.css +a { + b: color(srgb-linear 0.2 0.5 0.826); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(srgb-linear 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> all/output.css +a { + b: color(srgb-linear 0.296 0.62 0.844); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(srgb-linear 0.2 0.5 0.7 / 0.3), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> alpha_input/output.css +a { + b: color(srgb-linear 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(srgb-linear 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: color(srgb-linear 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale( + $color: color(srgb-linear 0.2 0.5 0.7), + $red: 12%, $green: 24%, $blue: 48% + ); +} + +<===> named/output.css +a { + b: color(srgb-linear 0.296 0.62 0.844); +} diff --git a/spec/core_functions/color/scale/xyz_d50.hrx b/spec/core_functions/color/scale/xyz_d50.hrx new file mode 100644 index 0000000000..d07168feae --- /dev/null +++ b/spec/core_functions/color/scale/xyz_d50.hrx @@ -0,0 +1,217 @@ +<===> x/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 100%)} + +<===> x/max/output.css +a { + b: color(xyz-d50 1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: -100%)} + +<===> x/min/output.css +a { + b: color(xyz-d50 0 0.5 0.7); +} + +<===> +================================================================================ +<===> x/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 0%)} + +<===> x/zero/output.css +a { + b: color(xyz-d50 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> x/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: -33%)} + +<===> x/low/output.css +a { + b: color(xyz-d50 0.134 0.5 0.7); +} + +<===> +================================================================================ +<===> x/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 86%)} + +<===> x/high/output.css +a { + b: color(xyz-d50 0.888 0.5 0.7); +} + +<===> +================================================================================ +<===> y/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 100%)} + +<===> y/max/output.css +a { + b: color(xyz-d50 0.2 1 0.7); +} + +<===> +================================================================================ +<===> y/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: -100%)} + +<===> y/min/output.css +a { + b: color(xyz-d50 0.2 0 0.7); +} + +<===> +================================================================================ +<===> y/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 0%)} + +<===> y/zero/output.css +a { + b: color(xyz-d50 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> y/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: -86%)} + +<===> y/low/output.css +a { + b: color(xyz-d50 0.2 0.07 0.7); +} + +<===> +================================================================================ +<===> y/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 12%)} + +<===> y/high/output.css +a { + b: color(xyz-d50 0.2 0.56 0.7); +} + +<===> +================================================================================ +<===> z/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 100%)} + +<===> z/max/output.css +a { + b: color(xyz-d50 0.2 0.5 1); +} + +<===> +================================================================================ +<===> z/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: -100%)} + +<===> z/min/output.css +a { + b: color(xyz-d50 0.2 0.5 0); +} + +<===> +================================================================================ +<===> z/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 0%)} + +<===> z/zero/output.css +a { + b: color(xyz-d50 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> z/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: -16%)} + +<===> z/low/output.css +a { + b: color(xyz-d50 0.2 0.5 0.588); +} + +<===> +================================================================================ +<===> z/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 42%)} + +<===> z/high/output.css +a { + b: color(xyz-d50 0.2 0.5 0.826); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 12%, $y: 24%, $z: 48%); +} + +<===> all/output.css +a { + b: color(xyz-d50 0.296 0.62 0.844); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale(color(xyz-d50 0.2 0.5 0.7 / 0.3), $x: 12%, $y: 24%, $z: 48%); +} + +<===> alpha_input/output.css +a { + b: color(xyz-d50 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(xyz-d50 0.2 0.5 0.7), + $x: 12%, $y: 24%, $z: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: color(xyz-d50 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale($color: color(xyz-d50 0.2 0.5 0.7), $x: 12%, $y: 24%, $z: 48%); +} + +<===> named/output.css +a { + b: color(xyz-d50 0.296 0.62 0.844); +} diff --git a/spec/core_functions/color/scale/xyz_d65.hrx b/spec/core_functions/color/scale/xyz_d65.hrx new file mode 100644 index 0000000000..e115d74268 --- /dev/null +++ b/spec/core_functions/color/scale/xyz_d65.hrx @@ -0,0 +1,217 @@ +<===> x/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 100%)} + +<===> x/max/output.css +a { + b: color(xyz 1 0.5 0.7); +} + +<===> +================================================================================ +<===> x/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: -100%)} + +<===> x/min/output.css +a { + b: color(xyz 0 0.5 0.7); +} + +<===> +================================================================================ +<===> x/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 0%)} + +<===> x/zero/output.css +a { + b: color(xyz 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> x/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: -33%)} + +<===> x/low/output.css +a { + b: color(xyz 0.134 0.5 0.7); +} + +<===> +================================================================================ +<===> x/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 86%)} + +<===> x/high/output.css +a { + b: color(xyz 0.888 0.5 0.7); +} + +<===> +================================================================================ +<===> y/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 100%)} + +<===> y/max/output.css +a { + b: color(xyz 0.2 1 0.7); +} + +<===> +================================================================================ +<===> y/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: -100%)} + +<===> y/min/output.css +a { + b: color(xyz 0.2 0 0.7); +} + +<===> +================================================================================ +<===> y/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 0%)} + +<===> y/zero/output.css +a { + b: color(xyz 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> y/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: -86%)} + +<===> y/low/output.css +a { + b: color(xyz 0.2 0.07 0.7); +} + +<===> +================================================================================ +<===> y/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 12%)} + +<===> y/high/output.css +a { + b: color(xyz 0.2 0.56 0.7); +} + +<===> +================================================================================ +<===> z/max/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 100%)} + +<===> z/max/output.css +a { + b: color(xyz 0.2 0.5 1); +} + +<===> +================================================================================ +<===> z/min/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: -100%)} + +<===> z/min/output.css +a { + b: color(xyz 0.2 0.5 0); +} + +<===> +================================================================================ +<===> z/zero/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 0%)} + +<===> z/zero/output.css +a { + b: color(xyz 0.2 0.5 0.7); +} + +<===> +================================================================================ +<===> z/low/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: -16%)} + +<===> z/low/output.css +a { + b: color(xyz 0.2 0.5 0.588); +} + +<===> +================================================================================ +<===> z/high/input.scss +@use 'sass:color'; +a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 42%)} + +<===> z/high/output.css +a { + b: color(xyz 0.2 0.5 0.826); +} + +<===> +================================================================================ +<===> all/input.scss +@use 'sass:color'; +a { + b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 12%, $y: 24%, $z: 48%); +} + +<===> all/output.css +a { + b: color(xyz 0.296 0.62 0.844); +} + +<===> +================================================================================ +<===> alpha_input/input.scss +@use 'sass:color'; +a { + b: color.scale(color(xyz-d65 0.2 0.5 0.7 / 0.3), $x: 12%, $y: 24%, $z: 48%); +} + +<===> alpha_input/output.css +a { + b: color(xyz 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> alpha_arg/input.scss +@use 'sass:color'; +a { + b: color.scale( + color(xyz-d65 0.2 0.5 0.7), + $x: 12%, $y: 24%, $z: 48%, $alpha: -70% + ); +} + +<===> alpha_arg/output.css +a { + b: color(xyz 0.296 0.62 0.844 / 0.3); +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a { + b: color.scale($color: color(xyz-d65 0.2 0.5 0.7), $x: 12%, $y: 24%, $z: 48%); +} + +<===> named/output.css +a { + b: color(xyz 0.296 0.62 0.844); +} diff --git a/spec/core_functions/color/scale_color/error/bounds.hrx b/spec/core_functions/color/scale_color/error/bounds.hrx deleted file mode 100644 index f43a45eee9..0000000000 --- a/spec/core_functions/color/scale_color/error/bounds.hrx +++ /dev/null @@ -1,206 +0,0 @@ -<===> red/too_low/input.scss -a {b: scale-color(red, $red: -100.001%)} - -<===> red/too_low/error -Error: $red: Expected -100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $red: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> red/too_high/input.scss -a {b: scale-color(red, $red: 100.001%)} - -<===> red/too_high/error -Error: $red: Expected 100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $red: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> green/too_low/input.scss -a {b: scale-color(green, $green: -100.001%)} - -<===> green/too_low/error -Error: $green: Expected -100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(green, $green: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> green/too_high/input.scss -a {b: scale-color(green, $green: 100.001%)} - -<===> green/too_high/error -Error: $green: Expected 100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(green, $green: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blue/too_low/input.scss -a {b: scale-color(blue, $blue: -100.001%)} - -<===> blue/too_low/error -Error: $blue: Expected -100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(blue, $blue: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blue/too_high/input.scss -a {b: scale-color(blue, $blue: 100.001%)} - -<===> blue/too_high/error -Error: $blue: Expected 100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(blue, $blue: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturation/too_low/input.scss -a {b: scale-color(red, $saturation: -100.001%)} - -<===> saturation/too_low/error -Error: $saturation: Expected -100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $saturation: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturation/too_high/input.scss -a {b: scale-color(red, $saturation: 100.001%)} - -<===> saturation/too_high/error -Error: $saturation: Expected 100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $saturation: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/too_low/input.scss -a {b: scale-color(red, $lightness: -100.001%)} - -<===> lightness/too_low/error -Error: $lightness: Expected -100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $lightness: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/too_high/input.scss -a {b: scale-color(red, $lightness: 100.001%)} - -<===> lightness/too_high/error -Error: $lightness: Expected 100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $lightness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/too_low/input.scss -a {b: scale-color(red, $alpha: -100.001%)} - -<===> alpha/too_low/error -Error: $alpha: Expected -100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $alpha: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/too_high/input.scss -a {b: scale-color(red, $alpha: 100.001%)} - -<===> alpha/too_high/error -Error: $alpha: Expected 100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $alpha: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blackness/too_low/input.scss -a {b: scale-color(red, $blackness: -100.001%)} - -<===> blackness/too_low/error -Error: $blackness: Expected -100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $blackness: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blackness/too_high/input.scss -a {b: scale-color(red, $blackness: 100.001%)} - -<===> blackness/too_high/error -Error: $blackness: Expected 100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $blackness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/too_low/input.scss -a {b: scale-color(red, $whiteness: -100.001%)} - -<===> whiteness/too_low/error -Error: $whiteness: Expected -100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $whiteness: -100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/too_high/input.scss -a {b: scale-color(red, $whiteness: 100.001%)} - -<===> whiteness/too_high/error -Error: $whiteness: Expected 100.001% to be within -100% and 100%. - , -1 | a {b: scale-color(red, $whiteness: 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - diff --git a/spec/core_functions/color/scale_color/error/units.hrx b/spec/core_functions/color/scale_color/error/units.hrx deleted file mode 100644 index 395f26a302..0000000000 --- a/spec/core_functions/color/scale_color/error/units.hrx +++ /dev/null @@ -1,206 +0,0 @@ -<===> none/red/input.scss -a {b: scale-color(red, $red: 1px)} - -<===> none/red/error -Error: $red: Expected 1px to have unit "%". - , -1 | a {b: scale-color(red, $red: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> none/green/input.scss -a {b: scale-color(green, $green: 1)} - -<===> none/green/error -Error: $green: Expected 1 to have unit "%". - , -1 | a {b: scale-color(green, $green: 1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> none/blue/input.scss -a {b: scale-color(blue, $blue: 1)} - -<===> none/blue/error -Error: $blue: Expected 1 to have unit "%". - , -1 | a {b: scale-color(blue, $blue: 1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> none/saturation/input.scss -a {b: scale-color(red, $saturation: 1)} - -<===> none/saturation/error -Error: $saturation: Expected 1 to have unit "%". - , -1 | a {b: scale-color(red, $saturation: 1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> none/lightness/input.scss -a {b: scale-color(red, $lightness: 1)} - -<===> none/lightness/error -Error: $lightness: Expected 1 to have unit "%". - , -1 | a {b: scale-color(red, $lightness: 1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> none/whiteness/input.scss -a {b: scale-color(white, $whiteness: 1)} - -<===> none/whiteness/error -Error: $whiteness: Expected 1 to have unit "%". - , -1 | a {b: scale-color(white, $whiteness: 1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - - -<===> -================================================================================ -<===> none/blackness/input.scss -a {b: scale-color(black, $blackness: 1)} - -<===> none/blackness/error -Error: $blackness: Expected 1 to have unit "%". - , -1 | a {b: scale-color(black, $blackness: 1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> none/alpha/input.scss -a {b: scale-color(red, $alpha: 1)} - -<===> none/alpha/error -Error: $alpha: Expected 1 to have unit "%". - , -1 | a {b: scale-color(red, $alpha: 1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> wrong/red/input.scss -a {b: scale-color(red, $red: 1px)} - -<===> wrong/red/error -Error: $red: Expected 1px to have unit "%". - , -1 | a {b: scale-color(red, $red: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> wrong/green/input.scss -a {b: scale-color(green, $green: 1px)} - -<===> wrong/green/error -Error: $green: Expected 1px to have unit "%". - , -1 | a {b: scale-color(green, $green: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> wrong/blue/input.scss -a {b: scale-color(blue, $blue: 1px)} - -<===> wrong/blue/error -Error: $blue: Expected 1px to have unit "%". - , -1 | a {b: scale-color(blue, $blue: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> wrong/saturation/input.scss -a {b: scale-color(red, $saturation: 1px)} - -<===> wrong/saturation/error -Error: $saturation: Expected 1px to have unit "%". - , -1 | a {b: scale-color(red, $saturation: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> wrong/lightness/input.scss -a {b: scale-color(red, $lightness: 1px)} - -<===> wrong/lightness/error -Error: $lightness: Expected 1px to have unit "%". - , -1 | a {b: scale-color(red, $lightness: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> wrong/whiteness/input.scss -a {b: scale-color(white, $whiteness: 1px)} - -<===> wrong/whiteness/error -Error: $whiteness: Expected 1px to have unit "%". - , -1 | a {b: scale-color(white, $whiteness: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> wrong/blackness/input.scss -a {b: scale-color(black, $blackness: 1px)} - -<===> wrong/blackness/error -Error: $blackness: Expected 1px to have unit "%". - , -1 | a {b: scale-color(black, $blackness: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> wrong/alpha/input.scss -a {b: scale-color(red, $alpha: 1px)} - -<===> wrong/alpha/error -Error: $alpha: Expected 1px to have unit "%". - , -1 | a {b: scale-color(red, $alpha: 1px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet From c20c741a57f358ba920fbf03c3f16cfdf0ce48c8 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Thu, 9 May 2024 13:17:21 -0700 Subject: [PATCH 38/45] [Color 4] Add tests for color equality with `same()` and `==` (#1984) --- spec/core_functions/color/same.hrx | 244 ++++++++++++++++++++++++++++ spec/values/colors/equality.hrx | 251 +++++++++++++++++++++++++++++ 2 files changed, 495 insertions(+) create mode 100644 spec/core_functions/color/same.hrx create mode 100644 spec/values/colors/equality.hrx diff --git a/spec/core_functions/color/same.hrx b/spec/core_functions/color/same.hrx new file mode 100644 index 0000000000..3add2658f2 --- /dev/null +++ b/spec/core_functions/color/same.hrx @@ -0,0 +1,244 @@ +<===> true/same_space/identical/input.scss +@use 'sass:color'; +a {b: color.same(#abcdef, #abcdef)} + +<===> true/same_space/identical/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/same_space/within_epsilon/input.scss +@use 'sass:color'; +a { + b: color.same( + lab(50.0000000000001 29.9999999999999 -20.0000000000001), + lab(50 30 -20) + ); +} + +<===> true/same_space/within_epsilon/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/same_space/with_alpha/input.scss +@use 'sass:color'; +a {b: color.same(oklch(50% 30% 120deg / 0.3), oklch(50% 30% 120deg / 0.3))} + +<===> true/same_space/with_alpha/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/same_space/out_of_gamut/input.scss +@use 'sass:color'; +a {b: color.same(color(srgb 2.3 -1 42), color(srgb 2.3 -1 42))} + +<===> true/same_space/out_of_gamut/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/same_space/none_and_zero/input.scss +@use 'sass:color'; +a {b: color.same(color(display-p3 0.1 0.3 none), color(display-p3 0.1 0.3 0))} + +<===> true/same_space/none_and_zero/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/same_space/both_none/input.scss +@use 'sass:color'; +a { + b: color.same(color(display-p3 0.1 0.3 none), color(display-p3 0.1 0.3 none)); +} + +<===> true/same_space/both_none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/different_space/no_none/input.scss +@use 'sass:color'; +a {b: color.same(plum, hsl(300, 47.2868217054%, 74.7058823529%))} + +<===> true/different_space/no_none/output.css +a { + b: true; +} + + +<===> +================================================================================ +<===> true/different_space/one_none/input.scss +@use 'sass:color'; +a { + b: color.same( + color(rec2020 0.5 none 0.2), + oklab(44.668866707461% 0.236673642675 0.018728349677) + ); +} + +<===> true/different_space/one_none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/different_space/both_none/input.scss +@use 'sass:color'; +a { + b: color.same( + color(srgb-linear none 0.9 0.8), + rgb(none 243.445228830895 231.114597102735) + ); +} + +<===> true/different_space/both_none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> false/same_space/no_none/input.scss +@use 'sass:color'; +a {b: color.same(#abcdef, #fedcba)} + +<===> false/same_space/no_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/same_space/none_and_nonzero/input.scss +@use 'sass:color'; +a { + b: color.same( + color(prophoto-rgb 0.1 0.2 none), + color(prophoto-rgb 0.1 0.2 0.3) + ); +} + +<===> false/same_space/none_and_nonzero/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/different_space/no_none/input.scss +@use 'sass:color'; +a {b: color.same(color(srgb 0.1 0.2 0.3), color(srgb-linear 0.1 0.2 0.3))} + +<===> false/different_space/no_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/different_space/both_none/input.scss +// This test verifies that none is converted to 0 *before* conversion to XYZ. +@use 'sass:color'; +a { + b: color.same( + color(rec2020 0.5 none 0.2), + color(xyz 0.174805932224126 none 0.058901333881161) + ); +} + +<===> false/different_space/both_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> named/input.scss +@use 'sass:color'; +a {b: color.same($color1: red, $color2: green)} + +<===> named/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> error/too_few_args/input.scss +@use 'sass:color'; +a {b: color.same(plum)} + +<===> error/too_few_args/error +Error: Missing argument $color2. + ,--> input.scss +2 | a {b: color.same(plum)} + | ^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function same($color1, $color2) { + | ====================== declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/too_many_args/input.scss +@use 'sass:color'; +a {b: color.same(red, green, blue)} + +<===> error/too_many_args/error +Error: Only 2 arguments allowed, but 3 were passed. + ,--> input.scss +2 | a {b: color.same(red, green, blue)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function same($color1, $color2) { + | ====================== declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/type/color1/input.scss +@use 'sass:color'; +a {b: color.same(1, red)} + +<===> error/type/color1/error +Error: $color1: 1 is not a color. + , +2 | a {b: color.same(1, red)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/type/color2/input.scss +@use 'sass:color'; +a {b: color.same(red, 1)} + +<===> error/type/color2/error +Error: $color2: 1 is not a color. + , +2 | a {b: color.same(red, 1)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/values/colors/equality.hrx b/spec/values/colors/equality.hrx new file mode 100644 index 0000000000..44f1e9b0c7 --- /dev/null +++ b/spec/values/colors/equality.hrx @@ -0,0 +1,251 @@ +<===> true/legacy/same_space/rgb/no_none/input.scss +a {b: #abcdef == #abcdef} + +<===> true/legacy/same_space/rgb/no_none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/legacy/same_space/rgb/none/input.scss +a {b: rgb(50 none 120) == rgb(50 none 120)} + +<===> true/legacy/same_space/rgb/none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/legacy/same_space/hsl/no_none/input.scss +a {b: hsl(250, 80%, 20%) == hsl(250deg, 80%, 20%)} + +<===> true/legacy/same_space/hsl/no_none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/legacy/same_space/hsl/none/input.scss +a {b: hsl(none 80% 20%) == hsl(none 80% 20%)} + +<===> true/legacy/same_space/hsl/none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/legacy/same_space/hsl/wrapped_hue/input.scss +a {b: hsl(180, 80%, 20%) == hsl(540, 80%, 20%)} + +<===> true/legacy/same_space/hsl/wrapped_hue/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/legacy/same_space/hwb/no_none/input.scss +a {b: hwb(250 30% 20%) == hwb(250deg 30% 20%)} + +<===> true/legacy/same_space/hwb/no_none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/legacy/same_space/hwb/none/input.scss +a {b: hwb(none 30% 20%) == hwb(none 30% 20%)} + +<===> true/legacy/same_space/hwb/none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/legacy/different_space/no_none/input.scss +a {b: purple == hsl(300, 100%, 25.098039215686%)} + +<===> true/legacy/different_space/no_none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/legacy/different_space/none/input.scss +a {b: gray == hsl(none 0% 50.196078431373%)} + +<===> true/legacy/different_space/none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/no_alpha_or_none/input.scss +a {b: lab(66% 50 -100) == lab(66% 50 -100)} + +<===> true/no_alpha_or_none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/alpha/input.scss +a {b: color(prophoto-rgb 0.3 0.4 0.5 / 0.6) == color(prophoto-rgb 0.3 0.4 0.5 / 0.6)} + +<===> true/alpha/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/none/input.scss +a {b: lch(100% 0% none) == lch(100% 0% none)} + +<===> true/none/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> true/within_epsilon/input.scss +a { + b: oklab( + 50.0000000000001 29.9999999999999 -20.0000000000001 / 0.999999999999 + ) == oklab(50 30 -20); +} + +<===> true/within_epsilon/output.css +a { + b: true; +} + +<===> +================================================================================ +<===> false/different_type/input.scss +a {b: red == unquote("red")} + +<===> false/different_type/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/legacy/same_space/rgb/no_none/input.scss +a {b: red == blue} + +<===> false/legacy/same_space/rgb/no_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/legacy/same_space/rgb/one_none/input.scss +a {b: rgb(0 100 200) == rgb(none 100 200)} + +<===> false/legacy/same_space/rgb/one_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/legacy/same_space/hsl/no_none/input.scss +a {b: hsl(50deg 50% 80%) == hsl(51deg 50% 80%)} + +<===> false/legacy/same_space/hsl/no_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/legacy/same_space/hsl/one_none/input.scss +a {b: hsl(0 0% 80%) == hsl(none 0% 80%)} + +<===> false/legacy/same_space/hsl/one_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/legacy/same_space/hwb/no_none/input.scss +a {b: hwb(50deg 20% 30%) == hwb(51deg 20% 30%)} + +<===> false/legacy/same_space/hwb/no_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/legacy/same_space/hwb/one_none/input.scss +a {b: hwb(0 0% 0%) == hwb(none 0% 0%)} + +<===> false/legacy/same_space/hwb/one_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/legacy/different_space/input.scss +a {b: red == hsl(0, 0%, 50%)} + +<===> false/legacy/different_space/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/same_space/no_none/input.scss +a {b: color(prophoto-rgb 0.1 0.2 0.3) == color(prophoto-rgb 0.1 0.2 0.4)} + +<===> false/same_space/no_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/same_space/one_none/input.scss +a {b: oklch(50% 0% none) == oklch(50% 0% 0)} + +<===> false/same_space/one_none/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/same_space/different_alpha/input.scss +a {b: lab(50% 100 -100) == lab(50% 100 -100 / 0.9)} + +<===> false/same_space/different_alpha/output.css +a { + b: false; +} + +<===> +================================================================================ +<===> false/different_space/input.scss +a {b: color(srgb 0 0 0) == color(srgb-linear 0 0 0)} + +<===> false/different_space/output.css +a { + b: false; +} From 916302cb7a01317bf1a21127399cac55721b61aa Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 10 May 2024 14:10:32 -0700 Subject: [PATCH 39/45] [Color 4] Update tests for `color.invert()` (#1990) --- spec/core_functions/color/invert.hrx | 311 ------------------ spec/core_functions/color/invert/alpha.hrx | 8 + spec/core_functions/color/invert/error.hrx | 157 +++++++++ spec/core_functions/color/invert/global.hrx | 57 ++++ spec/core_functions/color/invert/legacy.hrx | 215 ++++++++++++ spec/core_functions/color/invert/modern.hrx | 107 ++++++ spec/core_functions/color/invert/named.hrx | 8 + spec/core_functions/color/invert/number.hrx | 19 ++ spec/core_functions/color/mix/alpha.hrx | 6 +- .../core_functions/color/mix/both_weights.hrx | 4 +- .../color/mix/explicit_weight.hrx | 6 +- spec/core_functions/color/mix/units.hrx | 4 +- spec/core_functions/color/mix/unweighted.hrx | 4 +- spec/core_functions/modules/color/mix.hrx | 2 +- .../basic/22_colors_with_alpha.hrx | 2 +- 15 files changed, 585 insertions(+), 325 deletions(-) delete mode 100644 spec/core_functions/color/invert.hrx create mode 100644 spec/core_functions/color/invert/alpha.hrx create mode 100644 spec/core_functions/color/invert/error.hrx create mode 100644 spec/core_functions/color/invert/global.hrx create mode 100644 spec/core_functions/color/invert/legacy.hrx create mode 100644 spec/core_functions/color/invert/modern.hrx create mode 100644 spec/core_functions/color/invert/named.hrx create mode 100644 spec/core_functions/color/invert/number.hrx diff --git a/spec/core_functions/color/invert.hrx b/spec/core_functions/color/invert.hrx deleted file mode 100644 index 1faaca7138..0000000000 --- a/spec/core_functions/color/invert.hrx +++ /dev/null @@ -1,311 +0,0 @@ -<===> white/input.scss -a {b: invert(white)} - -<===> white/output.css -a { - b: black; -} - -<===> -================================================================================ -<===> black/input.scss -a {b: invert(black)} - -<===> black/output.css -a { - b: white; -} - -<===> -================================================================================ -<===> gray/input.scss -a {b: invert(gray)} - -<===> gray/output.css -a { - b: #7f7f7f; -} - -<===> -================================================================================ -<===> turquoise/input.scss -a {b: invert(turquoise)} - -<===> turquoise/output.css -a { - b: #bf1f2f; -} - -<===> -================================================================================ -<===> weighted/min/input.scss -a {b: invert(turquoise, 0%)} - -<===> weighted/min/output.css -a { - b: turquoise; -} - -<===> -================================================================================ -<===> weighted/max/input.scss -a {b: invert(turquoise, 100%)} - -<===> weighted/max/output.css -a { - b: #bf1f2f; -} - -<===> -================================================================================ -<===> weighted/middle/input.scss -a {b: invert(turquoise, 50%)} - -<===> weighted/middle/output.css -a { - b: gray; -} - -<===> -================================================================================ -<===> weighted/low/input.scss -a {b: invert(turquoise, 23%)} - -<===> weighted/low/output.css -a { - b: #5db4ab; -} - -<===> -================================================================================ -<===> weighted/high/input.scss -a {b: invert(turquoise, 92%)} - -<===> weighted/high/output.css -a { - b: #b52e3c; -} - -<===> -================================================================================ -<===> alpha/input.scss -a {b: invert(rgba(turquoise, 0.4))} - -<===> alpha/output.css -a { - b: rgba(191, 31, 47, 0.4); -} - -<===> -================================================================================ -<===> number/input.scss -a {b: invert(10%)} - -<===> number/output.css -a { - b: invert(10%); -} - -<===> -================================================================================ -<===> named/input.scss -a {b: invert($color: turquoise, $weight: 0%)} - -<===> named/output.css -a { - b: turquoise; -} - -<===> -================================================================================ -<===> units/weight/unitless/input.scss -a {b: invert(turquoise, 10)} - -<===> units/weight/unitless/output.css -a { - b: #4dcdc0; -} - -<===> units/weight/unitless/warning -DEPRECATION WARNING: $weight: Passing a number without unit % (10) is deprecated. - -To preserve current behavior: $weight * 1% - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: invert(turquoise, 10)} - | ^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> units/weight/unknown/input.scss -a {b: invert(turquoise, 10px)} - -<===> units/weight/unknown/output.css -a { - b: #4dcdc0; -} - -<===> units/weight/unknown/warning -DEPRECATION WARNING: $weight: Passing a number without unit % (10px) is deprecated. - -To preserve current behavior: calc($weight / 1px * 1%) - -More info: https://sass-lang.com/d/function-units - - , -1 | a {b: invert(turquoise, 10px)} - | ^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> with_css_var/input.scss -a {b: invert(var(--c))} - -<===> with_css_var/output.css -a { - b: invert(var(--c)); -} - -<===> -================================================================================ -<===> with_calc/input.scss -a {b: invert(calc(1 + 2))} - -<===> with_calc/output.css -a { - b: invert(3); -} - -<===> -================================================================================ -<===> with_unquoted_calc/input.scss -a {b: invert(unquote('calc(1)'))} - -<===> with_unquoted_calc/output.css -a { - b: invert(calc(1)); -} - -<===> -================================================================================ -<===> error/too_few_args/input.scss -a {b: invert()} - -<===> error/too_few_args/error -Error: Missing argument $color. - ,--> input.scss -1 | a {b: invert()} - | ^^^^^^^^ invocation - ' - ,--> sass:color -1 | @function invert($color, $weight: 100%, $space: null) { - | =========================================== declaration - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/too_many_args/options.yml ---- -:todo: -- dart-sass - -<===> error/too_many_args/input.scss -a {b: invert(turquoise, 0%, 1)} - -<===> error/too_many_args/error -Error: Only 2 arguments allowed, but 3 were passed. - ,--> input.scss -1 | a {b: invert(turquoise, 0%, 1)} - | ^^^^^^^^^^^^^^^^^^^^^^^^ invocation - ' - ,--> sass:color -1 | @function invert($color, $weight: 100%) { - | ============================= declaration - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/number_with_weight/input.scss -a {b: invert(1, 50%)} - -<===> error/number_with_weight/error -Error: Only one argument may be passed to the plain-CSS invert() function. - , -1 | a {b: invert(1, 50%)} - | ^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/type/color/input.scss -a {b: invert(c)} - -<===> error/type/color/error -Error: $color: c is not a color. - , -1 | a {b: invert(c)} - | ^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/type/with_module/input.scss -@use 'sass:color'; -a {b: color.invert(var(--c))} - -<===> error/type/with_module/error -Error: $color: var(--c) is not a color. - , -2 | a {b: color.invert(var(--c))} - | ^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/type/weight/input.scss -a {b: invert(red, c)} - -<===> error/type/weight/error -Error: $weight: c is not a number. - , -1 | a {b: invert(red, c)} - | ^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/bounds/too_low/input.scss -a {b: invert(red, -0.001%)} - -<===> error/bounds/too_low/error -Error: $weight: Expected -0.001% to be within 0% and 100%. - , -1 | a {b: invert(red, -0.001%)} - | ^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/bounds/too_high/input.scss -a {b: invert(red, 100.001%)} - -<===> error/bounds/too_high/error -Error: $weight: Expected 100.001% to be within 0% and 100%. - , -1 | a {b: invert(red, 100.001%)} - | ^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/invert/alpha.hrx b/spec/core_functions/color/invert/alpha.hrx new file mode 100644 index 0000000000..f29372f18e --- /dev/null +++ b/spec/core_functions/color/invert/alpha.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.invert(rgba(turquoise, 0.4))} + +<===> output.css +a { + b: rgba(191, 31, 47, 0.4); +} diff --git a/spec/core_functions/color/invert/error.hrx b/spec/core_functions/color/invert/error.hrx new file mode 100644 index 0000000000..7ed58d4915 --- /dev/null +++ b/spec/core_functions/color/invert/error.hrx @@ -0,0 +1,157 @@ +<===> too_few_args/input.scss +@use 'sass:color'; +a {b: color.invert()} + +<===> too_few_args/error +Error: Missing argument $color. + ,--> input.scss +2 | a {b: color.invert()} + | ^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function invert($color, $weight: 100%, $space: null) { + | =========================================== declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> too_many_args/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise, 0%, hsl, 1)} + +<===> too_many_args/error +Error: Only 3 arguments allowed, but 4 were passed. + ,--> input.scss +2 | a {b: color.invert(turquoise, 0%, hsl, 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ invocation + ' + ,--> sass:color +1 | @function invert($color, $weight: 100%, $space: null) { + | =========================================== declaration + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> global/number_with_weight/input.scss +a {b: invert(1, 50%)} + +<===> global/number_with_weight/error +Error: Only one argument may be passed to the plain-CSS invert() function. + , +1 | a {b: invert(1, 50%)} + | ^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> global/type/color/input.scss +a {b: invert(c)} + +<===> global/type/color/error +Error: $color: c is not a color. + , +1 | a {b: invert(c)} + | ^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> type/color/input.scss +@use 'sass:color'; +a {b: color.invert(c)} + +<===> type/color/error +Error: $color: c is not a color. + , +2 | a {b: color.invert(c)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/weight/input.scss +@use 'sass:color'; +a {b: color.invert(red, c)} + +<===> type/weight/error +Error: $weight: c is not a number. + , +2 | a {b: color.invert(red, c)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> type/space/input.scss +@use 'sass:color'; +a {b: color.invert(red, 10%, 1)} + +<===> type/space/error +Error: $space: 1 is not a string. + , +2 | a {b: color.invert(red, 10%, 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/quoted/input.scss +@use 'sass:color'; +a {b: color.invert(red, 10%, "lch")} + +<===> space/quoted/error +Error: $space: Expected "lch" to be an unquoted string. + , +2 | a {b: color.invert(red, 10%, "lch")} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/unknown/input.scss +@use 'sass:color'; +a {b: color.invert(red, 10%, c)} + +<===> space/unknown/error +Error: $space: Unknown color space "c". + , +2 | a {b: color.invert(red, 10%, c)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> bounds/too_low/input.scss +@use 'sass:color'; +a {b: color.invert(red, -0.001%)} + +<===> bounds/too_low/error +Error: $weight: Expected -0.001% to be within 0% and 100%. + , +2 | a {b: color.invert(red, -0.001%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> bounds/too_high/input.scss +@use 'sass:color'; +a {b: color.invert(red, 100.001%)} + +<===> bounds/too_high/error +Error: $weight: Expected 100.001% to be within 0% and 100%. + , +2 | a {b: color.invert(red, 100.001%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/invert/global.hrx b/spec/core_functions/color/invert/global.hrx new file mode 100644 index 0000000000..e991643d4e --- /dev/null +++ b/spec/core_functions/color/invert/global.hrx @@ -0,0 +1,57 @@ +<===> legacy/input.scss +a {b: invert(red)} + +<===> legacy/output.css +a { + b: aqua; +} + +<===> +================================================================================ +<===> modern/input.scss +a {b: invert(color(srgb 0 0.4 1), $space: srgb)} + +<===> modern/output.css +a { + b: color(srgb 1 0.6 0); +} + +<===> +================================================================================ +<===> number/input.scss +a {b: invert(10%)} + +<===> number/output.css +a { + b: invert(10%); +} + +<===> +================================================================================ +<===> with_css_var/input.scss +a {b: invert(var(--c))} + +<===> with_css_var/output.css +a { + b: invert(var(--c)); +} + +<===> +================================================================================ +<===> with_calc/input.scss +a {b: invert(calc(1 + 2))} + +<===> with_calc/output.css +a { + b: invert(3); +} + +<===> +================================================================================ +<===> with_unquoted_calc/input.scss +a {b: invert(unquote('calc(1)'))} + +<===> with_unquoted_calc/output.css +a { + b: invert(calc(1)); +} diff --git a/spec/core_functions/color/invert/legacy.hrx b/spec/core_functions/color/invert/legacy.hrx new file mode 100644 index 0000000000..915a921156 --- /dev/null +++ b/spec/core_functions/color/invert/legacy.hrx @@ -0,0 +1,215 @@ +<===> no_space/white/input.scss +@use 'sass:color'; +a {b: color.invert(white)} + +<===> no_space/white/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> no_space/black/input.scss +@use 'sass:color'; +a {b: color.invert(black)} + +<===> no_space/black/output.css +a { + b: white; +} + +<===> +================================================================================ +<===> no_space/gray/input.scss +@use 'sass:color'; +a {b: color.invert(gray)} + +<===> no_space/gray/output.css +a { + b: #7f7f7f; +} + +<===> +================================================================================ +<===> no_space/turquoise/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise)} + +<===> no_space/turquoise/output.css +a { + b: #bf1f2f; +} + +<===> +================================================================================ +<===> no_space/out_of_gamut/input.scss +@use 'sass:color'; +@use 'core_functions/color/utils'; +@include utils.inspect( + color.invert(color.change(rgb(0 50 0), $red: -100, $blue: 500)) +); + +<===> no_space/out_of_gamut/output.css +a { + value: hsl(45, 545.4545454545%, 21.568627451%); + space: rgb; + channels: 355 205 -245 / 1; +} + +<===> +================================================================================ +<===> no_space/weighted/min/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise, 0%)} + +<===> no_space/weighted/min/output.css +a { + b: turquoise; +} + +<===> +================================================================================ +<===> no_space/weighted/max/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise, 100%)} + +<===> no_space/weighted/max/output.css +a { + b: #bf1f2f; +} + +<===> +================================================================================ +<===> no_space/weighted/middle/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise, 50%)} + +<===> no_space/weighted/middle/output.css +a { + b: rgb(127.5, 127.5, 127.5); +} + +<===> +================================================================================ +<===> no_space/weighted/low/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise, 23%)} + +<===> no_space/weighted/low/output.css +a { + b: rgb(93.21, 179.61, 170.97); +} + +<===> +================================================================================ +<===> no_space/weighted/high/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise, 92%)} + +<===> no_space/weighted/high/output.css +a { + b: rgb(180.84, 46.44, 59.88); +} + +<===> +================================================================================ +<===> no_space/hsl/input.scss +@use 'sass:color'; +a {b: color.invert(hsl(30deg 20% 40%))} + +<===> no_space/hsl/output.css +a { + b: hsl(210, 20%, 60%); +} + +<===> +================================================================================ +<===> no_space/hwb/input.scss +@use 'sass:color'; +a {b: color.invert(hsl(30deg 20% 40%))} + +<===> no_space/hwb/output.css +a { + b: hsl(210, 20%, 60%); +} + +<===> +================================================================================ +<===> space/hsl/input.scss +@use 'sass:color'; +a {b: color.invert(hsl(30deg 20% 40%), $space: hsl)} + +<===> space/hsl/output.css +a { + b: hsl(210, 20%, 60%); +} + +<===> +================================================================================ +<===> space/hwb/input.scss +@use 'sass:color'; +a {b: color.invert(hwb(30deg 20% 40%), $space: hwb)} + +<===> space/hwb/output.css +a { + b: #6699cc; +} + +<===> +================================================================================ +<===> space/modern/input.scss +@use 'sass:color'; +a {b: color.invert(#abcdef, $space: display-p3)} + +<===> space/modern/output.css +a { + b: rgb(81.948808543, 49.5520621504, 10.5024231747); +} + +<===> +================================================================================ +<===> units/weight/unitless/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise, 10)} + +<===> units/weight/unitless/output.css +a { + b: rgb(76.7, 204.7, 191.9); +} + +<===> units/weight/unitless/warning +DEPRECATION WARNING: $weight: Passing a number without unit % (10) is deprecated. + +To preserve current behavior: $weight * 1% + +More info: https://sass-lang.com/d/function-units + + , +2 | a {b: color.invert(turquoise, 10)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> units/weight/unknown/input.scss +@use 'sass:color'; +a {b: color.invert(turquoise, 10px)} + +<===> units/weight/unknown/output.css +a { + b: rgb(76.7, 204.7, 191.9); +} + +<===> units/weight/unknown/warning +DEPRECATION WARNING: $weight: Passing a number without unit % (10px) is deprecated. + +To preserve current behavior: calc($weight / 1px * 1%) + +More info: https://sass-lang.com/d/function-units + + , +2 | a {b: color.invert(turquoise, 10px)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/invert/modern.hrx b/spec/core_functions/color/invert/modern.hrx new file mode 100644 index 0000000000..041c57af86 --- /dev/null +++ b/spec/core_functions/color/invert/modern.hrx @@ -0,0 +1,107 @@ +<===> zero_min/input.scss +@use 'sass:color'; +a {b: color.invert(color(rec2020 0 0.4 1), $space: rec2020)} + +<===> zero_min/output.css +a { + b: color(rec2020 1 0.6 0); +} + +<===> +================================================================================ +<===> negative_min/input.scss +@use 'sass:color'; +a {b: color.invert(lab(20% -30 110), $space: lab)} + +<===> negative_min/output.css +a { + b: lab(80% 30 -110); +} + +<===> +================================================================================ +<===> polar/input.scss +@use 'sass:color'; +a {b: color.invert(lch(20% 80 50deg), $space: lch)} + +<===> polar/output.css +a { + b: lch(80% 80 230deg); +} + +<===> +================================================================================ +<===> weight/min/input.scss +@use 'sass:color'; +a {b: color.invert(color(a98-rgb 0.1 0.4 0.8), 0%, $space: a98-rgb)} + +<===> weight/min/output.css +a { + b: color(a98-rgb 0.1 0.4 0.8); +} + +<===> +================================================================================ +<===> weight/max/input.scss +@use 'sass:color'; +a {b: color.invert(color(a98-rgb 0.1 0.4 0.8), 100%, $space: a98-rgb)} + +<===> weight/max/output.css +a { + b: color(a98-rgb 0.9 0.6 0.2); +} + +<===> +================================================================================ +<===> weight/middle/input.scss +@use 'sass:color'; +a {b: color.invert(color(a98-rgb 0.1 0.4 0.8), 50%, $space: a98-rgb)} + +<===> weight/middle/output.css +a { + b: color(a98-rgb 0.5 0.5 0.5); +} + +<===> +================================================================================ +<===> weight/high/input.scss +@use 'sass:color'; +a {b: color.invert(color(a98-rgb 0.1 0.4 0.8), 60%, $space: a98-rgb)} + +<===> weight/high/output.css +a { + b: color(a98-rgb 0.58 0.52 0.44); +} + +<===> +================================================================================ +<===> space/modern/input.scss +@use 'sass:color'; +a {b: color.invert(lch(20% 80 50deg), $space: xyz)} + +<===> space/modern/output.css +a { + b: lch(98.9503159926% 3.6006542179 45.9089280707deg); +} + +<===> +================================================================================ +<===> space/legacy/input.scss +@use 'sass:color'; +a {b: color.invert(lch(20% 80 50deg), $space: rgb)} + +<===> space/legacy/output.css +a { + b: color-mix(in lch, color(xyz 0.8040115061 1.0427791446 1.4858460828) 100%, black); +} + +<===> +================================================================================ +<===> space/case/input.scss +@use 'sass:color'; +a {b: color.invert(lch(20% 80 50deg), $space: DISPLAY-p3)} + +<===> space/case/output.css +a { + b: lch(97.4036876937% 47.4823953357 211.8732507605deg); +} diff --git a/spec/core_functions/color/invert/named.hrx b/spec/core_functions/color/invert/named.hrx new file mode 100644 index 0000000000..70d91937f7 --- /dev/null +++ b/spec/core_functions/color/invert/named.hrx @@ -0,0 +1,8 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.invert($color: turquoise, $weight: 10%, $space: oklch)} + +<===> output.css +a { + b: rgb(72.3071640492, 202.5503954693, 158.9647820206); +} diff --git a/spec/core_functions/color/invert/number.hrx b/spec/core_functions/color/invert/number.hrx new file mode 100644 index 0000000000..a2b70e5ffc --- /dev/null +++ b/spec/core_functions/color/invert/number.hrx @@ -0,0 +1,19 @@ +<===> input.scss +@use 'sass:color'; +a {b: color.invert(1)} + +<===> output.css +a { + b: invert(1); +} + +<===> warning +DEPRECATION WARNING: Passing a number (1) to color.invert() is deprecated. + +Recommendation: invert(1) + + , +2 | a {b: color.invert(1)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/mix/alpha.hrx b/spec/core_functions/color/mix/alpha.hrx index a6e8469c5a..0f63657175 100644 --- a/spec/core_functions/color/mix/alpha.hrx +++ b/spec/core_functions/color/mix/alpha.hrx @@ -3,7 +3,7 @@ a {b: mix(rgba(#91e16f, 0.3), rgba(#0144bf, 0.3))} <===> even/output.css a { - b: rgba(73, 147, 151, 0.3); + b: rgba(73, 146.5, 151, 0.3); } <===> @@ -33,7 +33,7 @@ a {b: mix(rgba(#91e16f, 0.8), rgba(#0144bf, 0.3))} <===> firstwards/output.css a { - b: rgba(109, 186, 131, 0.55); + b: rgba(109, 185.75, 131, 0.55); } <===> @@ -43,5 +43,5 @@ a {b: mix(rgba(#91e16f, 0.4), rgba(#0144bf, 0.9))} <===> lastwards/output.css a { - b: rgba(37, 107, 171, 0.65); + b: rgba(37, 107.25, 171, 0.65); } diff --git a/spec/core_functions/color/mix/both_weights.hrx b/spec/core_functions/color/mix/both_weights.hrx index d48a37a6b6..bb90bd43c4 100644 --- a/spec/core_functions/color/mix/both_weights.hrx +++ b/spec/core_functions/color/mix/both_weights.hrx @@ -43,7 +43,7 @@ a {b: mix(rgba(#91e16f, 0.8), rgba(#0144bf, 0.3), 63%)} <===> mixed/firstwards/output.css a { - b: rgba(121, 199, 124, 0.615); + b: rgba(121.4247787611, 199.296460177, 124.0973451327, 0.615); } <===> @@ -53,7 +53,7 @@ a {b: mix(rgba(#91e16f, 0.2), rgba(#0144bf, 0.7), 42%)} <===> mixed/lastwards/output.css a { - b: rgba(29, 99, 175, 0.49); + b: rgba(29, 98.5277777778, 175.4444444444, 0.49); } <===> diff --git a/spec/core_functions/color/mix/explicit_weight.hrx b/spec/core_functions/color/mix/explicit_weight.hrx index ed3a386480..32e49e2ca9 100644 --- a/spec/core_functions/color/mix/explicit_weight.hrx +++ b/spec/core_functions/color/mix/explicit_weight.hrx @@ -3,7 +3,7 @@ a {b: mix(#91e16f, #0144bf, 50%)} <===> even/output.css a { - b: #499397; + b: rgb(73, 146.5, 151); } <===> @@ -33,7 +33,7 @@ a {b: mix(#91e16f, #0144bf, 92%)} <===> firstwards/output.css a { - b: #85d475; + b: rgb(133.48, 212.44, 117.4); } <===> @@ -43,5 +43,5 @@ a {b: mix(#91e16f, #0144bf, 43%)} <===> lastwards/output.css a { - b: #3f889d; + b: rgb(62.92, 135.51, 156.6); } diff --git a/spec/core_functions/color/mix/units.hrx b/spec/core_functions/color/mix/units.hrx index ac13e78413..c4c2e1e0d0 100644 --- a/spec/core_functions/color/mix/units.hrx +++ b/spec/core_functions/color/mix/units.hrx @@ -3,7 +3,7 @@ a {b: mix(#91e16f, #0144bf, 50)} <===> weight/unitless/output.css a { - b: #499397; + b: rgb(73, 146.5, 151); } <===> weight/unitless/warning @@ -26,7 +26,7 @@ a {b: mix(#91e16f, #0144bf, 50px)} <===> weight/unknown/output.css a { - b: #499397; + b: rgb(73, 146.5, 151); } <===> weight/unknown/warning diff --git a/spec/core_functions/color/mix/unweighted.hrx b/spec/core_functions/color/mix/unweighted.hrx index 996ea22aeb..6794e918d3 100644 --- a/spec/core_functions/color/mix/unweighted.hrx +++ b/spec/core_functions/color/mix/unweighted.hrx @@ -4,7 +4,7 @@ a {b: mix(#ff00ff, #00ff00)} <===> min_and_max/output.css a { - b: gray; + b: rgb(127.5, 127.5, 127.5); } <===> @@ -26,5 +26,5 @@ a {b: mix(#91e16f, #0144bf)} <===> average/output.css a { - b: #499397; + b: rgb(73, 146.5, 151); } diff --git a/spec/core_functions/modules/color/mix.hrx b/spec/core_functions/modules/color/mix.hrx index f17eb40e4c..82fb2dcac9 100644 --- a/spec/core_functions/modules/color/mix.hrx +++ b/spec/core_functions/modules/color/mix.hrx @@ -4,5 +4,5 @@ a {b: color.mix(#abcdef, #daddee)} <===> output.css a { - b: #c3d5ef; + b: rgb(194.5, 213, 238.5); } diff --git a/spec/non_conformant/basic/22_colors_with_alpha.hrx b/spec/non_conformant/basic/22_colors_with_alpha.hrx index ca9a1ba7ad..787ca0a4a6 100644 --- a/spec/non_conformant/basic/22_colors_with_alpha.hrx +++ b/spec/non_conformant/basic/22_colors_with_alpha.hrx @@ -34,7 +34,7 @@ div { hoo: 123; moo: 45; poo: 6; - goo: rgba(64, 0, 191, 0.75); + goo: rgba(63.75, 0, 191.25, 0.75); boo: #edcba9; } From a92cec73f4c4a05ccef01c028837a8ddc9b63dd5 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 10 May 2024 14:12:02 -0700 Subject: [PATCH 40/45] Update grayscale specs to match other spec styles (#1991) --- spec/core_functions/color/grayscale.hrx | 155 +++++++++++++++--------- 1 file changed, 95 insertions(+), 60 deletions(-) diff --git a/spec/core_functions/color/grayscale.hrx b/spec/core_functions/color/grayscale.hrx index 604112db90..5376f97e55 100644 --- a/spec/core_functions/color/grayscale.hrx +++ b/spec/core_functions/color/grayscale.hrx @@ -1,188 +1,223 @@ -<===> no_saturation/white/input.scss -a {b: grayscale(white)} +<===> legacy/no_saturation/white/input.scss +@use 'sass:color'; +a {b: color.grayscale(white)} -<===> no_saturation/white/output.css +<===> legacy/no_saturation/white/output.css a { b: white; } <===> ================================================================================ -<===> no_saturation/black/input.scss -a {b: grayscale(black)} +<===> legacy/no_saturation/black/input.scss +@use 'sass:color'; +a {b: color.grayscale(black)} -<===> no_saturation/black/output.css +<===> legacy/no_saturation/black/output.css a { b: black; } <===> ================================================================================ -<===> no_saturation/gray/input.scss -a {b: grayscale(#494949)} +<===> legacy/no_saturation/gray/input.scss +@use 'sass:color'; +a {b: color.grayscale(#494949)} -<===> no_saturation/gray/output.css +<===> legacy/no_saturation/gray/output.css a { b: #494949; } <===> ================================================================================ -<===> max_saturation/input.scss -a {b: grayscale(red)} +<===> legacy/max_saturation/input.scss +@use 'sass:color'; +a {b: color.grayscale(red)} -<===> max_saturation/output.css +<===> legacy/max_saturation/output.css a { b: rgb(127.5, 127.5, 127.5); } <===> ================================================================================ -<===> mid_saturation/input.scss -a {b: grayscale(#633736)} +<===> legacy/mid_saturation/input.scss +@use 'sass:color'; +a {b: color.grayscale(#633736)} -<===> mid_saturation/output.css +<===> legacy/mid_saturation/output.css a { b: rgb(76.5, 76.5, 76.5); } <===> ================================================================================ -<===> alpha/input.scss -a {b: grayscale(rgba(#633736, 0.3))} +<===> legacy/alpha/input.scss +@use 'sass:color'; +a {b: color.grayscale(rgba(#633736, 0.3))} -<===> alpha/output.css +<===> legacy/alpha/output.css a { b: rgba(76.5, 76.5, 76.5, 0.3); } <===> ================================================================================ -<===> number/input.scss +<===> global/number/input.scss // A number should produce a plain function string, for CSS filter functions. a {b: grayscale(15%)} -<===> number/output.css +<===> global/number/output.css a { b: grayscale(15%); } <===> ================================================================================ -<===> named/input.scss -a {b: grayscale($color: white)} +<===> global/with_css_var/input.scss +a {b: grayscale(var(--c))} -<===> named/output.css +<===> global/with_css_var/output.css a { - b: white; + b: grayscale(var(--c)); } <===> ================================================================================ -<===> non_legacy/rectangular/input.scss -a {b: grayscale(lab(50 -30 40))} +<===> global/with_calc/input.scss +a {b: grayscale(calc(1 + 2))} -<===> non_legacy/rectangular/output.css +<===> global/with_calc/output.css a { - b: lab(48.58892555% 0.0000000648 -0.0000078984); + b: grayscale(3); } <===> ================================================================================ -<===> non_legacy/polar/input.scss -a {b: grayscale(lch(54.3 107 40.9))} +<===> global/with_unquoted_calc/input.scss +a {b: grayscale(unquote('calc(1)'))} -<===> non_legacy/polar/output.css +<===> global/with_unquoted_calc/output.css a { - b: lch(56.854581217% 0.0000089094 270.4699001175deg); + b: grayscale(calc(1)); } <===> ================================================================================ -<===> non_legacy/predefined/input.scss -a {b: grayscale(color(xyz-d65 0.41 0.21 0.02))} +<===> number/input.scss +@use 'sass:color'; +a {b: color.grayscale(1)} -<===> non_legacy/predefined/output.css +<===> number/output.css a { - b: color(xyz 0.232829773 0.2449664044 0.2667826176); + b: grayscale(1); } +<===> number/warning +DEPRECATION WARNING: Passing a number (1) to color.grayscale() is deprecated. + +Recommendation: grayscale(1) + + , +2 | a {b: color.grayscale(1)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ -<===> with_css_var/input.scss -a {b: grayscale(var(--c))} +<===> named/input.scss +@use 'sass:color'; +a {b: color.grayscale($color: white)} -<===> with_css_var/output.css +<===> named/output.css a { - b: grayscale(var(--c)); + b: white; } <===> ================================================================================ -<===> with_calc/input.scss -a {b: grayscale(calc(1 + 2))} +<===> modern/rectangular/input.scss +@use 'sass:color'; +a {b: color.grayscale(lab(50 -30 40))} -<===> with_calc/output.css +<===> modern/rectangular/output.css a { - b: grayscale(3); + b: lab(48.58892555% 0.0000000648 -0.0000078984); } <===> ================================================================================ -<===> with_unquoted_calc/input.scss -a {b: grayscale(unquote('calc(1)'))} +<===> modern/polar/input.scss +@use 'sass:color'; +a {b: color.grayscale(lch(54.3 107 40.9))} -<===> with_unquoted_calc/output.css +<===> modern/polar/output.css a { - b: grayscale(calc(1)); + b: lch(56.854581217% 0.0000089094 270.4699001175deg); +} + +<===> +================================================================================ +<===> non_legacy/predefined/input.scss +@use 'sass:color'; +a {b: color.grayscale(color(xyz-d65 0.41 0.21 0.02))} + +<===> non_legacy/predefined/output.css +a { + b: color(xyz 0.232829773 0.2449664044 0.2667826176); } <===> ================================================================================ <===> error/too_few_args/input.scss -a {b: grayscale()} +@use 'sass:color'; +a {b: color.grayscale()} <===> error/too_few_args/error Error: Missing argument $color. ,--> input.scss -1 | a {b: grayscale()} - | ^^^^^^^^^^^ invocation +2 | a {b: color.grayscale()} + | ^^^^^^^^^^^^^^^^^ invocation ' ,--> sass:color 1 | @function grayscale($color) { | ================= declaration ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> error/too_many_args/input.scss -a {b: grayscale(red, 1)} +@use 'sass:color'; +a {b: color.grayscale(red, 1)} <===> error/too_many_args/error Error: Only 1 argument allowed, but 2 were passed. ,--> input.scss -1 | a {b: grayscale(red, 1)} - | ^^^^^^^^^^^^^^^^^ invocation +2 | a {b: color.grayscale(red, 1)} + | ^^^^^^^^^^^^^^^^^^^^^^^ invocation ' ,--> sass:color 1 | @function grayscale($color) { | ================= declaration ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ <===> error/type/input.scss -a {b: grayscale(c)} +@use 'sass:color'; +a {b: color.grayscale(c)} <===> error/type/error Error: $color: c is not a color. , -1 | a {b: grayscale(c)} - | ^^^^^^^^^^^^ +2 | a {b: color.grayscale(c)} + | ^^^^^^^^^^^^^^^^^^ ' - input.scss 1:7 root stylesheet + input.scss 2:7 root stylesheet <===> ================================================================================ From 7e48831b15cbb343efd46c923aeb9878377fd4f1 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Fri, 10 May 2024 14:27:12 -0700 Subject: [PATCH 41/45] [Color 4] Fix remaining Dart Sass TODOs (#1992) --- .../color/hsl/one_arg/relative_color.hrx | 14 +- .../hsl/one_arg/special_functions/alpha.hrx | 28 +-- .../color/hwb/error/four_args.hrx | 152 ---------------- .../color/hwb/error/one_arg.hrx | 168 ------------------ spec/core_functions/color/hwb/four_args.hrx | 88 +++++++++ spec/core_functions/color/hwb/global.hrx | 16 +- spec/core_functions/color/hwb/one_arg.hrx | 115 ++++++++++-- spec/core_functions/color/lab/error.hrx | 31 +++- .../color/lab/relative_color.hrx | 14 +- .../color/lab/special_functions/alpha.hrx | 72 ++------ .../color/rgb/four_args/clamped.hrx | 12 -- .../color/rgb/one_arg/no_alpha.hrx | 24 --- .../color/rgb/one_arg/relative_color.hrx | 14 +- .../rgb/one_arg/special_functions/alpha.hrx | 28 +-- .../color/rgb/three_args/percents.hrx | 12 -- .../color/rgb/three_args/unitless.hrx | 12 -- .../color/to_space/a98_rgb/lab.hrx | 9 +- .../color/to_space/a98_rgb/lch.hrx | 9 +- .../color/to_space/a98_rgb/oklab.hrx | 9 +- .../color/to_space/a98_rgb/oklch.hrx | 9 +- .../color/to_space/display_p3/lab.hrx | 9 +- .../color/to_space/display_p3/lch.hrx | 9 +- .../color/to_space/display_p3/oklab.hrx | 9 +- .../color/to_space/display_p3/oklch.hrx | 9 +- .../color/to_space/oklab/lab.hrx | 6 +- .../color/to_space/oklab/lch.hrx | 6 +- .../color/to_space/prophoto_rgb/lab.hrx | 13 +- .../color/to_space/prophoto_rgb/lch.hrx | 13 +- .../color/to_space/prophoto_rgb/oklab.hrx | 9 +- .../color/to_space/prophoto_rgb/oklch.hrx | 9 +- .../color/to_space/rec2020/lab.hrx | 9 +- .../color/to_space/rec2020/lch.hrx | 9 +- .../color/to_space/rec2020/oklab.hrx | 9 +- .../color/to_space/rec2020/oklch.hrx | 9 +- .../core_functions/color/to_space/rgb/lab.hrx | 9 +- .../core_functions/color/to_space/rgb/lch.hrx | 9 +- .../color/to_space/rgb/oklab.hrx | 9 +- .../color/to_space/rgb/oklch.hrx | 9 +- .../color/to_space/srgb/lab.hrx | 9 +- .../color/to_space/srgb/lch.hrx | 9 +- .../color/to_space/srgb/oklab.hrx | 9 +- .../color/to_space/srgb/oklch.hrx | 9 +- .../color/to_space/srgb_linear/lab.hrx | 9 +- .../color/to_space/srgb_linear/lch.hrx | 9 +- .../color/to_space/srgb_linear/oklab.hrx | 9 +- .../color/to_space/srgb_linear/oklch.hrx | 9 +- .../core_functions/color/to_space/xyz/lab.hrx | 21 +-- .../core_functions/color/to_space/xyz/lch.hrx | 21 +-- .../color/to_space/xyz/oklab.hrx | 9 +- .../color/to_space/xyz/oklch.hrx | 9 +- .../color/to_space/xyz_d50/xyz-d50/lab.hrx | 9 +- .../color/to_space/xyz_d50/xyz-d50/lch.hrx | 9 +- .../color/to_space/xyz_d50/xyz-d50/oklab.hrx | 9 +- .../color/to_space/xyz_d50/xyz-d50/oklch.hrx | 9 +- spec/libsass-closed-issues/issue_221255.hrx | 14 +- spec/libsass-closed-issues/issue_2509.hrx | 28 +-- 56 files changed, 478 insertions(+), 732 deletions(-) diff --git a/spec/core_functions/color/hsl/one_arg/relative_color.hrx b/spec/core_functions/color/hsl/one_arg/relative_color.hrx index 94a31093b8..3f0e1021d2 100644 --- a/spec/core_functions/color/hsl/one_arg/relative_color.hrx +++ b/spec/core_functions/color/hsl/one_arg/relative_color.hrx @@ -86,19 +86,13 @@ a { b: hsl(from #aaa h s l / 25%); } -<===> -================================================================================ -<===> error/options.yml -:todo: - - dart-sass - <===> ================================================================================ <===> error/quoted/alpha/input.scss a {b: hsl("from" #aaa h s l / 25%)} <===> error/quoted/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was "from". , 1 | a {b: hsl("from" #aaa h s l / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -111,7 +105,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hsl("from" #aaa h s l)} <===> error/quoted/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was "from". , 1 | a {b: hsl("from" #aaa h s l)} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -124,7 +118,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hsl(c #aaa h s l / 25%)} <===> error/wrong_keyword/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was c. , 1 | a {b: hsl(c #aaa h s l / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^ @@ -137,7 +131,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hsl(c #aaa h s l)} <===> error/wrong_keyword/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was c. , 1 | a {b: hsl(c #aaa h s l)} | ^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/hsl/one_arg/special_functions/alpha.hrx b/spec/core_functions/color/hsl/one_arg/special_functions/alpha.hrx index 1478ac8514..f486d51ad3 100644 --- a/spec/core_functions/color/hsl/one_arg/special_functions/alpha.hrx +++ b/spec/core_functions/color/hsl/one_arg/special_functions/alpha.hrx @@ -23,7 +23,7 @@ a {b: hsl(1 2% unquote("calc(3%)") / 0.4)} <===> calc/string/arg_3/output.css a { - b: hsl(1 2% calc(3%)/0.4); + b: hsl(1, 2%, calc(3%), 0.4); } <===> @@ -33,7 +33,7 @@ a {b: hsl(1 2% 3% / unquote("calc(0.4)"))} <===> calc/string/arg_4/output.css a { - b: hsl(1 2% 3%/calc(0.4)); + b: hsl(1, 2%, 3%, calc(0.4)); } <===> @@ -63,7 +63,7 @@ a {b: hsl(1 2% calc(1px + 1%) / 0.4)} <===> calc/calculation/arg_3/output.css a { - b: hsl(1 2% calc(1px + 1%)/0.4); + b: hsl(1, 2%, calc(1px + 1%), 0.4); } <===> @@ -73,7 +73,7 @@ a {b: hsl(1 2% 3% / calc(1px + 1%))} <===> calc/calculation/arg_4/output.css a { - b: hsl(1 2% 3%/calc(1px + 1%)); + b: hsl(1, 2%, 3%, calc(1px + 1%)); } <===> @@ -103,7 +103,7 @@ a {b: hsl(1 2% var(--foo) / 0.4)} <===> var/arg_3/output.css a { - b: hsl(1 2% var(--foo)/0.4); + b: hsl(1, 2%, var(--foo), 0.4); } <===> @@ -113,7 +113,7 @@ a {b: hsl(1 2% 3% / var(--foo))} <===> var/arg_4/output.css a { - b: hsl(1 2% 3%/var(--foo)); + b: hsl(1, 2%, 3%, var(--foo)); } <===> @@ -143,7 +143,7 @@ a {b: hsl(1 2% env(--foo) / 0.4)} <===> env/arg_3/output.css a { - b: hsl(1 2% env(--foo)/0.4); + b: hsl(1, 2%, env(--foo), 0.4); } <===> @@ -153,7 +153,7 @@ a {b: hsl(1 2% 3% / env(--foo))} <===> env/arg_4/output.css a { - b: hsl(1 2% 3%/env(--foo)); + b: hsl(1, 2%, 3%, env(--foo)); } <===> @@ -183,7 +183,7 @@ a {b: hsl(1 2% unquote("min(3%)") / 0.4)} <===> min/string/arg_3/output.css a { - b: hsl(1 2% min(3%)/0.4); + b: hsl(1, 2%, min(3%), 0.4); } <===> @@ -193,7 +193,7 @@ a {b: hsl(1 2% 3% / unquote("min(0.4)"))} <===> min/string/arg_4/output.css a { - b: hsl(1 2% 3%/min(0.4)); + b: hsl(1, 2%, 3%, min(0.4)); } <===> @@ -223,7 +223,7 @@ a {b: hsl(1 2% unquote("max(3%)") / 0.4)} <===> max/string/arg_3/output.css a { - b: hsl(1 2% max(3%)/0.4); + b: hsl(1, 2%, max(3%), 0.4); } <===> @@ -233,7 +233,7 @@ a {b: hsl(1 2% 3% / unquote("max(0.4)"))} <===> max/string/arg_4/output.css a { - b: hsl(1 2% 3%/max(0.4)); + b: hsl(1, 2%, 3%, max(0.4)); } <===> @@ -263,7 +263,7 @@ a {b: hsl(1 2% unquote("clamp(3%, 4%, 5%)") / 0.4)} <===> clamp/string/arg_3/output.css a { - b: hsl(1 2% clamp(3%, 4%, 5%)/0.4); + b: hsl(1, 2%, clamp(3%, 4%, 5%), 0.4); } <===> @@ -273,7 +273,7 @@ a {b: hsl(1 2% 3% / unquote("clamp(0.4, 0.5, 0.6)"))} <===> clamp/string/arg_4/output.css a { - b: hsl(1 2% 3%/clamp(0.4, 0.5, 0.6)); + b: hsl(1, 2%, 3%, clamp(0.4, 0.5, 0.6)); } <===> diff --git a/spec/core_functions/color/hwb/error/four_args.hrx b/spec/core_functions/color/hwb/error/four_args.hrx index 3a26596ccb..f111792526 100644 --- a/spec/core_functions/color/hwb/error/four_args.hrx +++ b/spec/core_functions/color/hwb/error/four_args.hrx @@ -10,25 +10,6 @@ Error: Expected hue channel to be a number, was "foo". ' input.scss 2:7 root stylesheet -<===> -================================================================================ -<===> hue/var/options.yml ---- -:todo: -- dart-sass - -<===> hue/var/input.scss -@use 'sass:color'; -a {b: color.hwb(var(--c), 30%, 40%, 0.5)} - -<===> hue/var/error -Error: $hue: var(--c) is not a number. - , -2 | a {b: color.hwb(var(--c), 30%, 40%, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - <===> ================================================================================ <===> whiteness/type/input.scss @@ -71,63 +52,6 @@ Error: $whiteness: Expected 30px to have unit "%". ' input.scss 2:7 root stylesheet -<===> -================================================================================ -<===> whiteness/too_high/options.yml ---- -:todo: -- dart-sass - -<===> whiteness/too_high/input.scss -@use 'sass:color'; -a {b: color.hwb(0, 101%, 40%, 0.5)} - -<===> whiteness/too_high/error -Error: $whiteness: Expected 101% to be within 0% and 100%. - , -2 | a {b: color.hwb(0, 101%, 40%, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/too_low/options.yml ---- -:todo: -- dart-sass - -<===> whiteness/too_low/input.scss -@use 'sass:color'; -a {b: color.hwb(0, -1%, 40%, 0.5)} - -<===> whiteness/too_low/error -Error: $whiteness: Expected -1% to be within 0% and 100%. - , -2 | a {b: color.hwb(0, -1%, 40%, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/var/options.yml ---- -:todo: -- dart-sass - -<===> whiteness/var/input.scss -@use 'sass:color'; -a {b: color.hwb(0, var(--c), 40%, 0.5)} - -<===> whiteness/var/error -Error: $whiteness: var(--c) is not a number. - , -2 | a {b: color.hwb(0, var(--c), 40%, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - <===> ================================================================================ <===> blackness/type/input.scss @@ -170,63 +94,6 @@ Error: $blackness: Expected 40px to have unit "%". ' input.scss 2:7 root stylesheet -<===> -================================================================================ -<===> blackness/too_high/options.yml ---- -:todo: -- dart-sass - -<===> blackness/too_high/input.scss -@use 'sass:color'; -a {b: color.hwb(0, 30%, 101%, 0.5)} - -<===> blackness/too_high/error -Error: $blackness: Expected 101% to be within 0% and 100%. - , -2 | a {b: color.hwb(0, 30%, 101%, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> blackness/too_low/options.yml ---- -:todo: -- dart-sass - -<===> blackness/too_low/input.scss -@use 'sass:color'; -a {b: color.hwb(0, 30%, -1%, 0.5)} - -<===> blackness/too_low/error -Error: $blackness: Expected -1% to be within 0% and 100%. - , -2 | a {b: color.hwb(0, 30%, -1%, 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> blackness/var/options.yml ---- -:todo: -- dart-sass - -<===> blackness/var/input.scss -@use 'sass:color'; -a {b: color.hwb(0, 30%, var(--c), 0.5)} - -<===> blackness/var/error -Error: $blackness: var(--c) is not a number. - , -2 | a {b: color.hwb(0, 30%, var(--c), 0.5)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - <===> ================================================================================ <===> alpha/unit/input.scss @@ -240,22 +107,3 @@ Error: $alpha: Expected 0.5px to have unit "%" or no units. | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> alpha/var/options.yml ---- -:todo: -- dart-sass - -<===> alpha/var/input.scss -@use 'sass:color'; -a {b: color.hwb(0, 0%, 0%, var(--c))} - -<===> alpha/var/error -Error: $alpha: var(--c) is not a number. - , -2 | a {b: color.hwb(0, 0%, 0%, var(--c))} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/hwb/error/one_arg.hrx b/spec/core_functions/color/hwb/error/one_arg.hrx index 8740f3c491..eefa0a578e 100644 --- a/spec/core_functions/color/hwb/error/one_arg.hrx +++ b/spec/core_functions/color/hwb/error/one_arg.hrx @@ -94,25 +94,6 @@ Error: $channels: Expected hue channel to be a number, was "foo". ' input.scss 2:7 root stylesheet -<===> -================================================================================ -<===> hue/var/options.yml ---- -:todo: -- dart-sass - -<===> hue/var/input.scss -@use 'sass:color'; -a {b: color.hwb(var(--c) 30% 40%)} - -<===> hue/var/error -Error: $hue: var(--c) is not a number. - , -2 | a {b: color.hwb(var(--c) 30% 40%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - <===> ================================================================================ <===> whiteness/type/input.scss @@ -155,63 +136,6 @@ Error: $whiteness: Expected 30px to have unit "%". ' input.scss 2:7 root stylesheet -<===> -================================================================================ -<===> whiteness/too_high/options.yml ---- -:todo: -- dart-sass - -<===> whiteness/too_high/input.scss -@use 'sass:color'; -a {b: color.hwb(0 101% 40%)} - -<===> whiteness/too_high/error -Error: $whiteness: Expected 101% to be within 0% and 100%. - , -2 | a {b: color.hwb(0 101% 40%)} - | ^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/too_low/options.yml ---- -:todo: -- dart-sass - -<===> whiteness/too_low/input.scss -@use 'sass:color'; -a {b: color.hwb(0 -1% 40%)} - -<===> whiteness/too_low/error -Error: $whiteness: Expected -1% to be within 0% and 100%. - , -2 | a {b: color.hwb(0 -1% 40%)} - | ^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> whiteness/var/options.yml ---- -:todo: -- dart-sass - -<===> whiteness/var/input.scss -@use 'sass:color'; -a {b: color.hwb(0 var(--c) 40%)} - -<===> whiteness/var/error -Error: $whiteness: var(--c) is not a number. - , -2 | a {b: color.hwb(0 var(--c) 40%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - <===> ================================================================================ <===> blackness/type/input.scss @@ -254,79 +178,6 @@ Error: $blackness: Expected 40px to have unit "%". ' input.scss 2:7 root stylesheet -<===> -================================================================================ -<===> blackness/too_high/options.yml ---- -:todo: -- dart-sass - -<===> blackness/too_high/input.scss -@use 'sass:color'; -a {b: color.hwb(0 30% 101%)} - -<===> blackness/too_high/error -Error: $blackness: Expected 101% to be within 0% and 100%. - , -2 | a {b: color.hwb(0 30% 101%)} - | ^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> blackness/too_low/options.yml ---- -:todo: -- dart-sass - -<===> blackness/too_low/input.scss -@use 'sass:color'; -a {b: color.hwb(0 30% -1%)} - -<===> blackness/too_low/error -Error: $blackness: Expected -1% to be within 0% and 100%. - , -2 | a {b: color.hwb(0 30% -1%)} - | ^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> blackness/var/options.yml ---- -:todo: -- dart-sass - -<===> -================================================================================ -<===> blackness/var/no_alpha/input.scss -@use 'sass:color'; -a {b: color.hwb(0 30% var(--c))} - -<===> blackness/var/no_alpha/error -Error: $blackness: var(--c) is not a number. - , -2 | a {b: color.hwb(0 30% var(--c))} - | ^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> blackness/var/alpha/input.scss -@use 'sass:color'; -a {b: color.hwb(0 30% var(--c) / 0.5px)} - -<===> blackness/var/alpha/error -Error: Expected numeric channels, got "hwb(0 30% var(--c)/0.5px)". - , -2 | a {b: color.hwb(0 30% var(--c) / 0.5px)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - <===> ================================================================================ <===> alpha/unit/input.scss @@ -341,25 +192,6 @@ Error: $alpha: Expected 0.5px to have unit "%" or no units. ' input.scss 2:7 root stylesheet -<===> -================================================================================ -<===> alpha/var/options.yml ---- -:todo: -- dart-sass - -<===> alpha/var/input.scss -@use 'sass:color'; -a {b: color.hwb(0 0 0 / var(--c))} - -<===> alpha/var/error -Error: Expected numeric channels, got "hwb(0 0 0/var(--c))". - , -2 | a {b: color.hwb(0 0 0 / var(--c))} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet - <===> ================================================================================ <===> quoted_var_slash/input.scss diff --git a/spec/core_functions/color/hwb/four_args.hrx b/spec/core_functions/color/hwb/four_args.hrx index 897f6f99b4..c42598cdf2 100644 --- a/spec/core_functions/color/hwb/four_args.hrx +++ b/spec/core_functions/color/hwb/four_args.hrx @@ -1,3 +1,80 @@ +<===> hue/var/input.scss +@use 'sass:color'; +a {b: color.hwb(var(--c), 30%, 40%, 0.5)} + +<===> hue/var/output.css +a { + b: hwb(var(--c) 30% 40% / 0.5); +} + +<===> +================================================================================ +<===> whiteness/above_max/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 101%, 40%, 0.5)} + +<===> whiteness/above_max/output.css +a { + b: hsla(0, 0%, 71.6312056738%, 0.5); +} + +<===> +================================================================================ +<===> whiteness/below_min/input.scss +@use 'sass:color'; +a {b: color.hwb(0, -1%, 40%, 0.5)} + +<===> whiteness/below_min/output.css +a { + b: hsla(0, 103.3898305085%, 29.5%, 0.5); +} + +<===> +================================================================================ +<===> whiteness/var/input.scss +@use 'sass:color'; +a {b: color.hwb(0, var(--c), 40%, 0.5)} + +<===> whiteness/var/output.css +a { + b: hwb(0 var(--c) 40% / 0.5); +} + +<===> +================================================================================ +<===> blackness/above_max/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, 101%, 0.5)} + +<===> blackness/above_max/output.css +a { + b: hsla(0, 0%, 22.9007633588%, 0.5); +} + +<===> +================================================================================ +<===> blackness/below_min/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, -1%, 0.5)} + +<===> blackness/below_min/output.css +a { + b: hsla(0, 102.8985507246%, 65.5%, 0.5); +} + +<===> +================================================================================ +<===> blackness/var/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, var(--c), 0.5)} + +<===> blackness/var/output.css +a { + b: hwb(0 30% var(--c) / 0.5); +} + +<===> +================================================================================ <===> alpha/percent/negative/input.scss @use 'sass:color'; a {b: color.hwb(0, 0%, 0%, -10%)} @@ -106,6 +183,17 @@ a { b: red; } +<===> +================================================================================ +<===> alpha/var/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 0%, 0%, var(--c))} + +<===> alpha/var/output.css +a { + b: hwb(0 0% 0% / var(--c)); +} + <===> ================================================================================ <===> named/input.scss diff --git a/spec/core_functions/color/hwb/global.hrx b/spec/core_functions/color/hwb/global.hrx index 98324996d8..b7624e9128 100644 --- a/spec/core_functions/color/hwb/global.hrx +++ b/spec/core_functions/color/hwb/global.hrx @@ -228,19 +228,13 @@ a { b: hwb(from #aaa h w b / 25%); } -<===> -================================================================================ -<===> relative_color/error/options.yml -:todo: - - dart-sass - <===> ================================================================================ <===> relative_color/error/quoted/alpha/input.scss a {b: hwb("from" #aaa h w b / 25%)} <===> relative_color/error/quoted/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was "from". , 1 | a {b: hwb("from" #aaa h w b / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -253,7 +247,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hwb("from" #aaa h w b)} <===> relative_color/error/quoted/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was "from". , 1 | a {b: hwb("from" #aaa h w b)} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -266,7 +260,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hwb(c #aaa h w b / 25%)} <===> relative_color/error/wrong_keyword/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was c. , 1 | a {b: hwb(c #aaa h w b / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^ @@ -279,11 +273,9 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hwb(c #aaa h w b)} <===> relative_color/error/wrong_keyword/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was c. , 1 | a {b: hwb(c #aaa h w b)} | ^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet - - diff --git a/spec/core_functions/color/hwb/one_arg.hrx b/spec/core_functions/color/hwb/one_arg.hrx index 5f1bc2a3c1..401490f657 100644 --- a/spec/core_functions/color/hwb/one_arg.hrx +++ b/spec/core_functions/color/hwb/one_arg.hrx @@ -1,3 +1,91 @@ +<===> hue/var/input.scss +@use 'sass:color'; +a {b: color.hwb(var(--c) 30% 40%)} + +<===> hue/var/output.css +a { + b: hwb(var(--c) 30% 40%); +} + +<===> +================================================================================ +<===> whiteness/above_max/input.scss +@use 'sass:color'; +a {b: color.hwb(0 101% 40%)} + +<===> whiteness/above_max/output.css +a { + b: hsl(0, 0%, 71.6312056738%); +} + +<===> +================================================================================ +<===> whiteness/below_min/input.scss +@use 'sass:color'; +a {b: color.hwb(0 -1% 40%)} + +<===> whiteness/below_min/output.css +a { + b: hsl(0, 103.3898305085%, 29.5%); +} + +<===> +================================================================================ +<===> whiteness/var/input.scss +@use 'sass:color'; +a {b: color.hwb(0 var(--c) 40%)} + +<===> whiteness/var/output.css +a { + b: hwb(0 var(--c) 40%); +} + +<===> +================================================================================ +<===> blackness/var/no_alpha/input.scss +@use 'sass:color'; +a {b: color.hwb(0 30% var(--c))} + +<===> blackness/var/no_alpha/output.css +a { + b: hwb(0 30% var(--c)); +} + +<===> +================================================================================ +<===> blackness/var/alpha/input.scss +@use 'sass:color'; +a {b: color.hwb(0 30% var(--c) / 0.5)} + +<===> blackness/var/alpha/output.css +a { + b: hwb(0 30% var(--c)/0.5); +} + +<===> +================================================================================ +<===> blackness/above_max/input.scss +@use 'sass:color'; +a {b: color.hwb(0 30% 101%)} + +<===> blackness/above_max/output.css +a { + b: hsl(0, 0%, 22.9007633588%); +} + +<===> +================================================================================ +<===> blackness/below_min/input.scss +@use 'sass:color'; +a {b: color.hwb(0 30% -1%)} + +<===> blackness/below_min/output.css +a { + b: hsl(0, 102.8985507246%, 65.5%); +} + +<===> +================================================================================ <===> alpha/in_gamut/transparent/input.scss @use 'sass:color'; a {b: color.hwb(180 30% 40% / 0)} @@ -53,6 +141,17 @@ a { b: hsla(180, 33.3333333333%, 45%, 0.4); } +<===> +================================================================================ +<===> alpha/var/input.scss +@use 'sass:color'; +a {b: color.hwb(0 0 0 / var(--c))} + +<===> alpha/var/output.css +a { + b: hwb(0 0 0/var(--c)); +} + <===> ================================================================================ <===> alpha/clamped/above/input.scss @@ -187,19 +286,13 @@ a { b: hwb(from #aaa h w b / 25%); } -<===> -================================================================================ -<===> relative_color/error/options.yml -:todo: - - dart-sass - <===> ================================================================================ <===> relative_color/error/quoted/alpha/input.scss a {b: hwb("from" #aaa h w b / 25%)} <===> relative_color/error/quoted/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was "from". , 1 | a {b: hwb("from" #aaa h w b / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -212,7 +305,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hwb("from" #aaa h w b)} <===> relative_color/error/quoted/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was "from". , 1 | a {b: hwb("from" #aaa h w b)} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -225,7 +318,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hwb(c #aaa h w b / 25%)} <===> relative_color/error/wrong_keyword/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was c. , 1 | a {b: hwb(c #aaa h w b / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^ @@ -238,11 +331,9 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: hwb(c #aaa h w b)} <===> relative_color/error/wrong_keyword/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected hue channel to be a number, was c. , 1 | a {b: hwb(c #aaa h w b)} | ^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet - - diff --git a/spec/core_functions/color/lab/error.hrx b/spec/core_functions/color/lab/error.hrx index 27363ac64a..c5d57a3cbf 100644 --- a/spec/core_functions/color/lab/error.hrx +++ b/spec/core_functions/color/lab/error.hrx @@ -90,10 +90,10 @@ Error: $channels: Expected a channel to be a number, was c. <===> ================================================================================ -<===> type/b/input.scss +<===> type/b/direct/input.scss a {b: lab(1% 2 c)} -<===> type/b/error +<===> type/b/direct/error Error: $channels: Expected b channel to be a number, was c. , 1 | a {b: lab(1% 2 c)} @@ -101,6 +101,19 @@ Error: $channels: Expected b channel to be a number, was c. ' input.scss 1:7 root stylesheet +<===> +================================================================================ +<===> type/b/slash/input.scss +a {b: lab(1% 2 c / 0.4)} + +<===> type/b/slash/error +Error: $channels: Expected b channel to be a number, was c. + , +1 | a {b: lab(1% 2 c / 0.4)} + | ^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> type/alpha/slash_list/input.scss @@ -115,6 +128,20 @@ Error: $channels: c is not a number. ' input.scss 2:7 root stylesheet +<===> +================================================================================ +<===> type/alpha/slash/input.scss +@use 'sass:list'; +a {b: lab(1% 2 3 / c)} + +<===> type/alpha/slash/error +Error: $channels: c is not a number. + , +2 | a {b: lab(1% 2 3 / c)} + | ^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> list/bracketed/input.scss diff --git a/spec/core_functions/color/lab/relative_color.hrx b/spec/core_functions/color/lab/relative_color.hrx index e378f93761..771096a218 100644 --- a/spec/core_functions/color/lab/relative_color.hrx +++ b/spec/core_functions/color/lab/relative_color.hrx @@ -87,19 +87,13 @@ a { b: lab(from #aaa r g b / 25%); } -<===> -================================================================================ -<===> error/options.yml -:todo: - - dart-sass - <===> ================================================================================ <===> error/quoted/alpha/input.scss a {b: lab("from" #aaa l a b / 25%)} <===> error/quoted/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected lightness channel to be a number, was "from". , 1 | a {b: lab("from" #aaa l a b / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -112,7 +106,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: lab("from" #aaa l a b)} <===> error/quoted/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected lightness channel to be a number, was "from". , 1 | a {b: lab("from" #aaa l a b)} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -125,7 +119,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: lab(c #aaa l a b / 25%)} <===> error/wrong_keyword/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected lightness channel to be a number, was c. , 1 | a {b: lab(c #aaa l a b / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^ @@ -138,7 +132,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: lab(c #aaa l a b)} <===> error/wrong_keyword/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected lightness channel to be a number, was c. , 1 | a {b: lab(c #aaa l a b)} | ^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/lab/special_functions/alpha.hrx b/spec/core_functions/color/lab/special_functions/alpha.hrx index 081d164f88..3ba4fca260 100644 --- a/spec/core_functions/color/lab/special_functions/alpha.hrx +++ b/spec/core_functions/color/lab/special_functions/alpha.hrx @@ -92,6 +92,18 @@ a { type: string; } +<===> +================================================================================ +<===> calc/calculation/with_slash/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% 2 3 / calc(var(--a) / 2))); + +<===> calc/calculation/with_slash/output.css +a { + value: lab(1% 2 3/calc(var(--a) / 2)); + type: string; +} + <===> ================================================================================ <===> var/arg_1/input.scss @@ -332,66 +344,6 @@ a { type: string; } -<===> -================================================================================ -<===> unknown/arg_3/with_number/input.scss -@use 'core_functions/color/utils'; -@include utils.inspect(lab(1% 2 b / 0.4)); - -<===> unknown/arg_3/with_number/output.css -a { - value: lab(1% 2 b/0.4); - type: string; -} - -<===> -================================================================================ -<===> unknown/arg_3/with_none/input.scss -@use 'core_functions/color/utils'; -@include utils.inspect(lab(1% 2 b / none)); - -<===> unknown/arg_3/with_none/output.css -a { - value: lab(1% 2 b/none); - type: string; -} - -<===> -================================================================================ -<===> unknown/arg_4/with_number/input.scss -@use 'core_functions/color/utils'; -@include utils.inspect(lab(1% 2 3 / b)); - -<===> unknown/arg_4/with_number/output.css -a { - value: lab(1% 2 3/b); - type: string; -} - -<===> -================================================================================ -<===> unknown/arg_4/with_none/input.scss -@use 'core_functions/color/utils'; -@include utils.inspect(lab(1% 2 none / b)); - -<===> unknown/arg_4/with_none/output.css -a { - value: lab(1% 2 none/b); - type: string; -} - -<===> -================================================================================ -<===> unknown/arg_3_and_4/input.scss -@use 'core_functions/color/utils'; -@include utils.inspect(lab(1% 2 b / c)); - -<===> unknown/arg_3_and_4/output.css -a { - value: lab(1% 2 b/c); - type: string; -} - <===> ================================================================================ <===> multi_argument_var/1_of_2/input.scss diff --git a/spec/core_functions/color/rgb/four_args/clamped.hrx b/spec/core_functions/color/rgb/four_args/clamped.hrx index ca9c6caf7a..ea4e6788df 100644 --- a/spec/core_functions/color/rgb/four_args/clamped.hrx +++ b/spec/core_functions/color/rgb/four_args/clamped.hrx @@ -3,10 +3,6 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ -<===> red/options.yml -:todo: - - dart-sass - <===> red/input.scss a {b: rgb(256, 0, 0, 0.5)} @@ -17,10 +13,6 @@ a { <===> ================================================================================ -<===> green/options.yml -:todo: - - dart-sass - <===> green/input.scss a {b: rgb(0, -1, 0, 0.5)} @@ -31,10 +23,6 @@ a { <===> ================================================================================ -<===> blue/options.yml -:todo: - - dart-sass - <===> blue/input.scss a {b: rgb(0, 0, 9999, 0.5)} diff --git a/spec/core_functions/color/rgb/one_arg/no_alpha.hrx b/spec/core_functions/color/rgb/one_arg/no_alpha.hrx index 7b86b6c1ca..8d5c41608c 100644 --- a/spec/core_functions/color/rgb/one_arg/no_alpha.hrx +++ b/spec/core_functions/color/rgb/one_arg/no_alpha.hrx @@ -48,10 +48,6 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ -<===> unitless/clamped/red/options.yml -:todo: - - dart-sass - <===> unitless/clamped/red/input.scss a {b: rgb(256 0 0)} @@ -62,10 +58,6 @@ a { <===> ================================================================================ -<===> unitless/clamped/green/options.yml -:todo: - - dart-sass - <===> unitless/clamped/green/input.scss a {b: rgb(0 -1 0)} @@ -76,10 +68,6 @@ a { <===> ================================================================================ -<===> unitless/clamped/blue/options.yml -:todo: - - dart-sass - <===> unitless/clamped/blue/input.scss a {b: rgb(0 0 9999)} @@ -141,10 +129,6 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ -<===> percents/clamped/red/options.yml -:todo: - - dart-sass - <===> percents/clamped/red/input.scss a {b: rgb(100.1% 0 0)} @@ -155,10 +139,6 @@ a { <===> ================================================================================ -<===> percents/clamped/green/options.yml -:todo: - - dart-sass - <===> percents/clamped/green/input.scss a {b: rgb(0 -0.1% 0)} @@ -169,10 +149,6 @@ a { <===> ================================================================================ -<===> percents/clamped/blue/options.yml -:todo: - - dart-sass - <===> percents/clamped/blue/input.scss a {b: rgb(0 0 200%)} diff --git a/spec/core_functions/color/rgb/one_arg/relative_color.hrx b/spec/core_functions/color/rgb/one_arg/relative_color.hrx index 38805f5091..429d4ee135 100644 --- a/spec/core_functions/color/rgb/one_arg/relative_color.hrx +++ b/spec/core_functions/color/rgb/one_arg/relative_color.hrx @@ -87,19 +87,13 @@ a { b: rgb(from #aaa r g b / 25%); } -<===> -================================================================================ -<===> error/options.yml -:todo: - - dart-sass - <===> ================================================================================ <===> error/quoted/alpha/input.scss a {b: rgb("from" #aaa r g b / 25%)} <===> error/quoted/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected red channel to be a number, was "from". , 1 | a {b: rgb("from" #aaa r g b / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ @@ -112,7 +106,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: rgb("from" #aaa r g b)} <===> error/quoted/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected red channel to be a number, was "from". , 1 | a {b: rgb("from" #aaa r g b)} | ^^^^^^^^^^^^^^^^^^^^^^ @@ -125,7 +119,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: rgb(c #aaa r g b / 25%)} <===> error/wrong_keyword/alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected red channel to be a number, was c. , 1 | a {b: rgb(c #aaa r g b / 25%)} | ^^^^^^^^^^^^^^^^^^^^^^^ @@ -138,7 +132,7 @@ Error: Only 3 elements allowed, but 5 were passed. a {b: rgb(c #aaa r g b)} <===> error/wrong_keyword/no_alpha/error -Error: Only 3 elements allowed, but 5 were passed. +Error: $channels: Expected red channel to be a number, was c. , 1 | a {b: rgb(c #aaa r g b)} | ^^^^^^^^^^^^^^^^^ diff --git a/spec/core_functions/color/rgb/one_arg/special_functions/alpha.hrx b/spec/core_functions/color/rgb/one_arg/special_functions/alpha.hrx index e9f7576483..0bf8bf0ae8 100644 --- a/spec/core_functions/color/rgb/one_arg/special_functions/alpha.hrx +++ b/spec/core_functions/color/rgb/one_arg/special_functions/alpha.hrx @@ -23,7 +23,7 @@ a {b: rgb(1 2 unquote("calc(3)") / 0.4)} <===> calc/string/arg_3/output.css a { - b: rgb(1 2 calc(3)/0.4); + b: rgb(1, 2, calc(3), 0.4); } <===> @@ -33,7 +33,7 @@ a {b: rgb(1 2 3 / unquote("calc(0.4)"))} <===> calc/string/arg_4/output.css a { - b: rgb(1 2 3/calc(0.4)); + b: rgb(1, 2, 3, calc(0.4)); } <===> @@ -63,7 +63,7 @@ a {b: rgb(1 2 calc(1px + 1%) / 0.4)} <===> calc/calculation/arg_3/output.css a { - b: rgb(1 2 calc(1px + 1%)/0.4); + b: rgb(1, 2, calc(1px + 1%), 0.4); } <===> @@ -73,7 +73,7 @@ a {b: rgb(1 2 3 / calc(1px + 1%))} <===> calc/calculation/arg_4/output.css a { - b: rgb(1 2 3/calc(1px + 1%)); + b: rgb(1, 2, 3, calc(1px + 1%)); } <===> @@ -103,7 +103,7 @@ a {b: rgb(1 2 var(--foo) / 0.4)} <===> var/arg_3/output.css a { - b: rgb(1 2 var(--foo)/0.4); + b: rgb(1, 2, var(--foo), 0.4); } <===> @@ -113,7 +113,7 @@ a {b: rgb(1 2 3 / var(--foo))} <===> var/arg_4/output.css a { - b: rgb(1 2 3/var(--foo)); + b: rgb(1, 2, 3, var(--foo)); } <===> @@ -143,7 +143,7 @@ a {b: rgb(1 2 env(--foo) / 0.4)} <===> env/arg_3/output.css a { - b: rgb(1 2 env(--foo)/0.4); + b: rgb(1, 2, env(--foo), 0.4); } <===> @@ -153,7 +153,7 @@ a {b: rgb(1 2 3 / env(--foo))} <===> env/arg_4/output.css a { - b: rgb(1 2 3/env(--foo)); + b: rgb(1, 2, 3, env(--foo)); } <===> @@ -183,7 +183,7 @@ a {b: rgb(1 2 unquote("min(3)") / 0.4)} <===> min/string/arg_3/output.css a { - b: rgb(1 2 min(3)/0.4); + b: rgb(1, 2, min(3), 0.4); } <===> @@ -193,7 +193,7 @@ a {b: rgb(1 2 3 / unquote("min(0.4)"))} <===> min/string/arg_4/output.css a { - b: rgb(1 2 3/min(0.4)); + b: rgb(1, 2, 3, min(0.4)); } <===> @@ -223,7 +223,7 @@ a {b: rgb(1 2 unquote("max(3)") / 0.4)} <===> max/string/arg_3/output.css a { - b: rgb(1 2 max(3)/0.4); + b: rgb(1, 2, max(3), 0.4); } <===> @@ -233,7 +233,7 @@ a {b: rgb(1 2 3 / unquote("max(0.4)"))} <===> max/string/arg_4/output.css a { - b: rgb(1 2 3/max(0.4)); + b: rgb(1, 2, 3, max(0.4)); } <===> @@ -263,7 +263,7 @@ a {b: rgb(1 2 unquote("clamp(3, 4, 5)") / 0.4)} <===> clamp/string/arg_3/output.css a { - b: rgb(1 2 clamp(3, 4, 5)/0.4); + b: rgb(1, 2, clamp(3, 4, 5), 0.4); } <===> @@ -273,7 +273,7 @@ a {b: rgb(1 2 3 / unquote("clamp(0.4, 0.5, 0.6)"))} <===> clamp/string/arg_4/output.css a { - b: rgb(1 2 3/clamp(0.4, 0.5, 0.6)); + b: rgb(1, 2, 3, clamp(0.4, 0.5, 0.6)); } <===> diff --git a/spec/core_functions/color/rgb/three_args/percents.hrx b/spec/core_functions/color/rgb/three_args/percents.hrx index 3a7c0aa576..6572c45523 100644 --- a/spec/core_functions/color/rgb/three_args/percents.hrx +++ b/spec/core_functions/color/rgb/three_args/percents.hrx @@ -49,10 +49,6 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ -<===> clamped/red/options.yml -:todo: - - dart-sass - <===> clamped/red/input.scss a {b: rgb(100.1%, 0, 0)} @@ -63,10 +59,6 @@ a { <===> ================================================================================ -<===> clamped/green/options.yml -:todo: - - dart-sass - <===> clamped/green/input.scss a {b: rgb(0, -0.1%, 0)} @@ -77,10 +69,6 @@ a { <===> ================================================================================ -<===> clamped/blue/options.yml -:todo: - - dart-sass - <===> clamped/blue/input.scss a {b: rgb(0, 0, 200%)} diff --git a/spec/core_functions/color/rgb/three_args/unitless.hrx b/spec/core_functions/color/rgb/three_args/unitless.hrx index d5b57f3c61..5a456d37b1 100644 --- a/spec/core_functions/color/rgb/three_args/unitless.hrx +++ b/spec/core_functions/color/rgb/three_args/unitless.hrx @@ -48,10 +48,6 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ -<===> clamped/red/options.yml -:todo: - - dart-sass - <===> clamped/red/input.scss a {b: rgb(256, 0, 0)} @@ -62,10 +58,6 @@ a { <===> ================================================================================ -<===> clamped/green/options.yml -:todo: - - dart-sass - <===> clamped/green/input.scss a {b: rgb(0, -1, 0)} @@ -76,10 +68,6 @@ a { <===> ================================================================================ -<===> clamped/blue/options.yml -:todo: - - dart-sass - <===> clamped/blue/input.scss a {b: rgb(0, 0, 9999)} diff --git a/spec/core_functions/color/to_space/a98_rgb/lab.hrx b/spec/core_functions/color/to_space/a98_rgb/lab.hrx index 8127f5522e..4a48c3bd91 100644 --- a/spec/core_functions/color/to_space/a98_rgb/lab.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/lab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(a98-rgb -999999 0 0), lab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -9041452038524.754 -4661998707364.328 -423818064305.84766) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/a98_rgb/lch.hrx b/spec/core_functions/color/to_space/a98_rgb/lch.hrx index 0a1827957c..1e366c8f35 100644 --- a/spec/core_functions/color/to_space/a98_rgb/lch.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/lch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(a98-rgb -999999 0 0), lch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -9041452038524.758 -4661998707364.329 -423818064305.86096) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/a98_rgb/oklab.hrx b/spec/core_functions/color/to_space/a98_rgb/oklab.hrx index 4298fd6b50..ffa55034d4 100644 --- a/spec/core_functions/color/to_space/a98_rgb/oklab.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/oklab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(a98-rgb -999999 0 0), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -9041452038524.754 -4661998707364.326 -423818064305.84424) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/a98_rgb/oklch.hrx b/spec/core_functions/color/to_space/a98_rgb/oklch.hrx index 82b9cd759a..5d97880ac5 100644 --- a/spec/core_functions/color/to_space/a98_rgb/oklch.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/oklch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(a98-rgb -999999 0 0), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -9041452038524.746 -4661998707364.325 -423818064305.8496) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/display_p3/lab.hrx b/spec/core_functions/color/to_space/display_p3/lab.hrx index 971c6c5c74..c36752382b 100644 --- a/spec/core_functions/color/to_space/display_p3/lab.hrx +++ b/spec/core_functions/color/to_space/display_p3/lab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(display-p3 -999999 0 0), lab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -107482877956690.4 -50580177881913.99 3039800.685913086) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/display_p3/lch.hrx b/spec/core_functions/color/to_space/display_p3/lch.hrx index 546280126e..50dbdaa329 100644 --- a/spec/core_functions/color/to_space/display_p3/lch.hrx +++ b/spec/core_functions/color/to_space/display_p3/lch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(display-p3 -999999 0 0), lch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -107482896009634.61 -50580183886727.57 -376620475.52490234) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/display_p3/oklab.hrx b/spec/core_functions/color/to_space/display_p3/oklab.hrx index 50b1643e8e..cd316220b5 100644 --- a/spec/core_functions/color/to_space/display_p3/oklab.hrx +++ b/spec/core_functions/color/to_space/display_p3/oklab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(display-p3 -999999 0 0), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -107482878101233.5 -50580177929992.28 0.0234375) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/display_p3/oklch.hrx b/spec/core_functions/color/to_space/display_p3/oklch.hrx index 2f068545af..358d1d052e 100644 --- a/spec/core_functions/color/to_space/display_p3/oklch.hrx +++ b/spec/core_functions/color/to_space/display_p3/oklch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(display-p3 -999999 0 0), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -107482878101233.53 -50580177929992.31 0.078125) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/oklab/lab.hrx b/spec/core_functions/color/to_space/oklab/lab.hrx index c024bf381b..1e3ac4c358 100644 --- a/spec/core_functions/color/to_space/oklab/lab.hrx +++ b/spec/core_functions/color/to_space/oklab/lab.hrx @@ -9,17 +9,13 @@ a { <===> ================================================================================ -<===> white/options.yml -:todo: - - dart-sass - <===> white/input.scss @use 'sass:color'; a {b: color.to-space(oklab(100% 0 0), lab)} <===> white/output.css a { - b: okoklab(99.9999993474% 0.0000000001 0.0000000373); + b: color-mix(in lab, color(xyz 0.9504559526 1.0000000182 1.0890580001) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/oklab/lch.hrx b/spec/core_functions/color/to_space/oklab/lch.hrx index f55bfef8c9..3f9d17ef23 100644 --- a/spec/core_functions/color/to_space/oklab/lch.hrx +++ b/spec/core_functions/color/to_space/oklab/lch.hrx @@ -9,17 +9,13 @@ a { <===> ================================================================================ -<===> white/options.yml -:todo: - - dart-sass - <===> white/input.scss @use 'sass:color'; a {b: color.to-space(oklab(100% 0 0), lch)} <===> white/output.css a { - b: lch(100% 0 none); + b: color-mix(in lch, color(xyz 0.9504559526 1.0000000182 1.0890580001) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx b/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx index d78de9c6dc..ca58be4f13 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx @@ -40,12 +40,6 @@ a { b: lab(46.0098211673% -39.6566664112 -68.0244470598); } -<===> -================================================================================ -<===> out_of_range/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> ================================================================================ <===> out_of_range/near/input.scss @@ -54,7 +48,7 @@ a {b: color.to-space(color(prophoto-rgb -1 0.4 2), lab)} <===> out_of_range/near/output.css a { - b: lab(30.0623308533% 38.5823326773 -241.4998540297); + b: color-mix(in lab, color(xyz -0.4478815578 -0.0732156915 3.8173184875) 100%, black); } <===> @@ -63,6 +57,11 @@ a { @use 'sass:color'; a {b: color.to-space(color(prophoto-rgb -999999 0 0), lab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -47674467013.1876 -16929933315.113932 -247080732.77775204) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx b/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx index 481afd35d4..6774528130 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx @@ -40,12 +40,6 @@ a { b: lch(46.0098211673% 78.7399300777 239.7588117754deg); } -<===> -================================================================================ -<===> out_of_range/options.yml -:todo: - - dart-sass # # w3c/csswg-drafts#9484 - <===> ================================================================================ <===> out_of_range/near/input.scss @@ -54,7 +48,7 @@ a {b: color.to-space(color(prophoto-rgb -1 0.4 2), lch)} <===> out_of_range/near/output.css a { - b: lch(30.0623308533% 244.5624171683 279.0769417748deg); + b: color-mix(in lch, color(xyz -0.4478815578 -0.0732156915 3.8173184875) 100%, black); } <===> @@ -63,6 +57,11 @@ a { @use 'sass:color'; a {b: color.to-space(color(prophoto-rgb -999999 0 0), lch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -47674467013.187614 -16929933315.113934 -247080732.77789402) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx b/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx index d9fabded28..3f02fa5f24 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(prophoto-rgb -999999 0 0), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -47674467013.18752 -16929933315.11392 -247080732.77775192) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx b/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx index da780f59d8..11beac981e 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(prophoto-rgb -999999 0 0), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -47674467013.18753 -16929933315.11391 -247080732.777771) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/rec2020/lab.hrx b/spec/core_functions/color/to_space/rec2020/lab.hrx index a0deb83d90..451f2df74e 100644 --- a/spec/core_functions/color/to_space/rec2020/lab.hrx +++ b/spec/core_functions/color/to_space/rec2020/lab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(rec2020 -999999 0 0), lab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -11119280450344.598 -4585917925394.642 -119556.2596893311) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/rec2020/lch.hrx b/spec/core_functions/color/to_space/rec2020/lch.hrx index a7a357040e..ae9acbd910 100644 --- a/spec/core_functions/color/to_space/rec2020/lch.hrx +++ b/spec/core_functions/color/to_space/rec2020/lch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(rec2020 -999999 0 0), lch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -11119280261600.67 -4585917862614.184 3849800.247779846) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/rec2020/oklab.hrx b/spec/core_functions/color/to_space/rec2020/oklab.hrx index 583e646b89..7c90cb9e3a 100644 --- a/spec/core_functions/color/to_space/rec2020/oklab.hrx +++ b/spec/core_functions/color/to_space/rec2020/oklab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(rec2020 -999999 0 0), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -11119280444659.65 -4585917923503.701 0.0024414063) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/rec2020/oklch.hrx b/spec/core_functions/color/to_space/rec2020/oklch.hrx index 6e58a0250c..0eb2f182cd 100644 --- a/spec/core_functions/color/to_space/rec2020/oklch.hrx +++ b/spec/core_functions/color/to_space/rec2020/oklch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(rec2020 -999999 0 0), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -11119280444659.652 -4585917923503.7 -0.009765625) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/rgb/lab.hrx b/spec/core_functions/color/to_space/rgb/lab.hrx index 5aed29df8b..52953fe8fb 100644 --- a/spec/core_functions/color/to_space/rgb/lab.hrx +++ b/spec/core_functions/color/to_space/rgb/lab.hrx @@ -64,14 +64,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color.change(black, $red: -999999), lab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -152693379.43919498 -78732523.77333494 -7157502.161212263) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/rgb/lch.hrx b/spec/core_functions/color/to_space/rgb/lch.hrx index c5d5765c6e..26ed649553 100644 --- a/spec/core_functions/color/to_space/rgb/lch.hrx +++ b/spec/core_functions/color/to_space/rgb/lch.hrx @@ -64,14 +64,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color.change(black, $red: -999999), lch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -152693379.43919504 -78732523.77333494 -7157502.161212466) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/rgb/oklab.hrx b/spec/core_functions/color/to_space/rgb/oklab.hrx index d3fefb026a..543f290f8d 100644 --- a/spec/core_functions/color/to_space/rgb/oklab.hrx +++ b/spec/core_functions/color/to_space/rgb/oklab.hrx @@ -64,14 +64,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color.change(black, $red: -999999), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -152693379.43919483 -78732523.77333483 -7157502.161212221) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/rgb/oklch.hrx b/spec/core_functions/color/to_space/rgb/oklch.hrx index d1268f085f..cbd0812da7 100644 --- a/spec/core_functions/color/to_space/rgb/oklch.hrx +++ b/spec/core_functions/color/to_space/rgb/oklch.hrx @@ -64,14 +64,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color.change(black, $red: -999999), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -152693379.43919486 -78732523.77333483 -7157502.16121231) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/srgb/lab.hrx b/spec/core_functions/color/to_space/srgb/lab.hrx index 1de6dc21d9..abbe9f2edf 100644 --- a/spec/core_functions/color/to_space/srgb/lab.hrx +++ b/spec/core_functions/color/to_space/srgb/lab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(srgb -999999 0 0), lab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -91096581353071.61 -46971674760177.555 -4270152250925.234) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/srgb/lch.hrx b/spec/core_functions/color/to_space/srgb/lch.hrx index a1456aeb40..fbb66e4d83 100644 --- a/spec/core_functions/color/to_space/srgb/lch.hrx +++ b/spec/core_functions/color/to_space/srgb/lch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(srgb -999999 0 0), lch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -91096581353071.64 -46971674760177.555 -4270152250925.3564) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/srgb/oklab.hrx b/spec/core_functions/color/to_space/srgb/oklab.hrx index 8662d047c8..3675a809d7 100644 --- a/spec/core_functions/color/to_space/srgb/oklab.hrx +++ b/spec/core_functions/color/to_space/srgb/oklab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(srgb -999999 0 0), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -91096581353071.4 -46971674760177.49 -4270152250925.199) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/srgb/oklch.hrx b/spec/core_functions/color/to_space/srgb/oklch.hrx index 0804b9dbd2..bd7604e97e 100644 --- a/spec/core_functions/color/to_space/srgb/oklch.hrx +++ b/spec/core_functions/color/to_space/srgb/oklch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(srgb -999999 0 0), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -91096581353071.39 -46971674760177.49 -4270152250925.1875) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/srgb_linear/lab.hrx b/spec/core_functions/color/to_space/srgb_linear/lab.hrx index b9348c4bf6..3f900f8720 100644 --- a/spec/core_functions/color/to_space/srgb_linear/lab.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/lab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(srgb-linear -999999 0 0), lab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -412390.3868751603 -212638.7932325045 -19330.7993847731) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/srgb_linear/lch.hrx b/spec/core_functions/color/to_space/srgb_linear/lch.hrx index 3aa0bd1638..b4857b6dbc 100644 --- a/spec/core_functions/color/to_space/srgb_linear/lch.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/lch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(srgb-linear -999999 0 0), lch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -412390.3868751603 -212638.7932325045 -19330.7993847737) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/srgb_linear/oklab.hrx b/spec/core_functions/color/to_space/srgb_linear/oklab.hrx index d1952fbb57..c19e272d9c 100644 --- a/spec/core_functions/color/to_space/srgb_linear/oklab.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/oklab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(srgb-linear -999999 0 0), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -412390.3868751598 -212638.7932325045 -19330.799384773) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/srgb_linear/oklch.hrx b/spec/core_functions/color/to_space/srgb_linear/oklch.hrx index 09b691ad6c..084a76c8f8 100644 --- a/spec/core_functions/color/to_space/srgb_linear/oklch.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/oklch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(srgb-linear -999999 0 0), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -412390.3868751598 -212638.7932325044 -19330.7993847733) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/xyz/lab.hrx b/spec/core_functions/color/to_space/xyz/lab.hrx index 15b88a9927..5dd1feccb4 100644 --- a/spec/core_functions/color/to_space/xyz/lab.hrx +++ b/spec/core_functions/color/to_space/xyz/lab.hrx @@ -9,17 +9,13 @@ a { <===> ================================================================================ -<===> white/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> white/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz 1 1 1), lab)} <===> white/output.css a { - b: lab(100% 0 0); + b: color-mix(in lab, color(xyz 1 1 1) 100%, black); } <===> @@ -57,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz -999999 0 0), lab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lab, color(xyz -999999 0 0.000000002) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss @@ -100,17 +97,13 @@ a { <===> ================================================================================ -<===> missing/green/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> missing/green/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz 0.1 none 0.3), lab)} <===> missing/green/output.css a { - b: lab(5.8200823344% 29.1326658037 -42.4044732971); + b: color-mix(in lab, color(xyz 0.1 0 0.3) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/xyz/lch.hrx b/spec/core_functions/color/to_space/xyz/lch.hrx index 68db6cf2ee..20d1d42226 100644 --- a/spec/core_functions/color/to_space/xyz/lch.hrx +++ b/spec/core_functions/color/to_space/xyz/lch.hrx @@ -9,17 +9,13 @@ a { <===> ================================================================================ -<===> white/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> white/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz 1 1 1), lch)} <===> white/output.css a { - b: lch(100% 0 none); + b: color-mix(in lch, color(xyz 1 1 1) 100%, black); } <===> @@ -57,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz -999999 0 0), lch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in lch, color(xyz -999998.9999993658 0.000000211 0.0000133413) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss @@ -100,17 +97,13 @@ a { <===> ================================================================================ -<===> missing/green/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> missing/green/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz 0.1 none 0.3), lch)} <===> missing/green/output.css a { - b: lch(5.8200823344% 51.4475613847 304.4897928318deg); + b: color-mix(in lch, color(xyz 0.1 0 0.3) 100%, black); } <===> diff --git a/spec/core_functions/color/to_space/xyz/oklab.hrx b/spec/core_functions/color/to_space/xyz/oklab.hrx index a69a68934c..2f66320d65 100644 --- a/spec/core_functions/color/to_space/xyz/oklab.hrx +++ b/spec/core_functions/color/to_space/xyz/oklab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz -999999 0 0), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -999998.9999999991 -0.0000000001 0) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/xyz/oklch.hrx b/spec/core_functions/color/to_space/xyz/oklch.hrx index 8c82b703f3..6d4ccd6c01 100644 --- a/spec/core_functions/color/to_space/xyz/oklch.hrx +++ b/spec/core_functions/color/to_space/xyz/oklch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz -999999 0 0), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -999998.9999999985 -0.0000000001 -0.0000000012) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx index b92ecb7958..cfa7e92d6a 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz-d50 -999999 0 0), lab)} +<===> out_of_range/far/output.css +a { + b: lab(0% -4037677156.674863 0); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx index 4e429c840b..cd22e4b42b 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz-d50 -999999 0 0), lch)} +<===> out_of_range/far/output.css +a { + b: lch(0% 4037677156.674863 180deg); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx index 0e68a97eea..a0efdb422f 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz-d50 -999999 0 0), oklab)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklab, color(xyz -955472.4660146529 28369.6809641542 -12314.0025504671) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx index 98ebfe65df..1dfe85982a 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx @@ -53,14 +53,15 @@ a { <===> ================================================================================ -<===> out_of_range/far/options.yml -:todo: - - dart-sass # w3c/csswg-drafts#9484 - <===> out_of_range/far/input.scss @use 'sass:color'; a {b: color.to-space(color(xyz-d50 -999999 0 0), oklch)} +<===> out_of_range/far/output.css +a { + b: color-mix(in oklch, color(xyz -955472.4660146533 28369.6809641542 -12314.0025504659) 100%, black); +} + <===> ================================================================================ <===> alpha/partial/input.scss diff --git a/spec/libsass-closed-issues/issue_221255.hrx b/spec/libsass-closed-issues/issue_221255.hrx index d0e86470e3..b17fef082b 100644 --- a/spec/libsass-closed-issues/issue_221255.hrx +++ b/spec/libsass-closed-issues/issue_221255.hrx @@ -1,10 +1,10 @@ -<===> options.yml ---- -:todo: -- dart-sass <===> input.scss '#{)'{ + <===> error -Error: Invalid CSS after "'#{": expected expression (e.g. 1px, bold), was ")'{" - on line 1 of input.scss - Use --trace for backtrace. +Error: Expected expression. + , +1 | '#{)'{ + | ^^ + ' + input.scss 1:2 root stylesheet diff --git a/spec/libsass-closed-issues/issue_2509.hrx b/spec/libsass-closed-issues/issue_2509.hrx index ce041dbc87..d04f20c994 100644 --- a/spec/libsass-closed-issues/issue_2509.hrx +++ b/spec/libsass-closed-issues/issue_2509.hrx @@ -1,8 +1,3 @@ -<===> options.yml ---- -:todo: -- dart-sass - <===> input.scss [charset i] { display: block; @@ -19,19 +14,10 @@ [charset="utf-8" I] { display: block; } -<===> output.css -[charset i] { - display: block; -} - -[charset I] { - display: block; -} - -[charset="utf-8" i] { - display: block; -} - -[charset="utf-8" I] { - display: block; -} +<===> error +Error: Expected "]". + , +1 | [charset i] { + | ^ + ' + input.scss 1:10 root stylesheet From 12fabe23bd2f4bb640280b4a0aed1f0e4d60d795 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Thu, 16 May 2024 15:50:31 -0700 Subject: [PATCH 42/45] Add relative color syntax tests for the color() function (#1993) --- spec/core_functions/color/color/error.hrx | 52 +++++++++++ .../color/color/relative_color.hrx | 88 +++++++++++++++++++ 2 files changed, 140 insertions(+) create mode 100644 spec/core_functions/color/color/relative_color.hrx diff --git a/spec/core_functions/color/color/error.hrx b/spec/core_functions/color/color/error.hrx index 7bf9c7c8c4..e6b1bd1809 100644 --- a/spec/core_functions/color/color/error.hrx +++ b/spec/core_functions/color/color/error.hrx @@ -277,3 +277,55 @@ Error: $description: Unknown color space "foo". | ^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/quoted/alpha/input.scss +a {b: color("from" #aaa srgb r g b / 25%)} + +<===> relative_color/quoted/alpha/error +Error: $description: Expected "from" to be an unquoted string. + , +1 | a {b: color("from" #aaa srgb r g b / 25%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/quoted/no_alpha/input.scss +a {b: color("from" #aaa srgb r g b)} + +<===> relative_color/quoted/no_alpha/error +Error: $description: Expected "from" to be an unquoted string. + , +1 | a {b: color("from" #aaa srgb r g b)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/wrong_keyword/alpha/input.scss +a {b: color(c #aaa srgb r g b / 25%)} + +<===> relative_color/wrong_keyword/alpha/error +Error: $description: Unknown color space "c". + , +1 | a {b: color(c #aaa srgb r g b / 25%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> relative_color/wrong_keyword/no_alpha/input.scss +a {b: color(c #aaa srgb r g b)} + +<===> relative_color/wrong_keyword/no_alpha/error +Error: $description: Unknown color space "c". + , +1 | a {b: color(c #aaa srgb r g b)} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/color/relative_color.hrx b/spec/core_functions/color/color/relative_color.hrx new file mode 100644 index 0000000000..5407f9ea3e --- /dev/null +++ b/spec/core_functions/color/color/relative_color.hrx @@ -0,0 +1,88 @@ +<===> static/alpha/input.scss +a {b: color(from #aaa srgb r g b / 25%)} + +<===> static/alpha/output.css +a { + b: color(from #aaa srgb r g b/25%); +} + +<===> +================================================================================ +<===> static/no_alpha/input.scss +a {b: color(from #aaa srgb r g b)} + +<===> static/no_alpha/output.css +a { + b: color(from #aaa srgb r g b); +} + +<===> +================================================================================ +<===> calc/alpha/input.scss +a {b: color(from #aaa srgb calc(l + 0.2) a b / 25%)} + +<===> calc/alpha/output.css +a { + b: color(from #aaa srgb calc(l + 0.2) a b/25%); +} + +<===> +================================================================================ +<===> calc/no_alpha/input.scss +a {b: color(from #aaa srgb calc(l + 0.2) a b)} + +<===> calc/no_alpha/output.css +a { + b: color(from #aaa srgb calc(l + 0.2) a b); +} + +<===> +================================================================================ +<===> var/alpha/input.scss +a {b: color(from var(--c) srgb r g b / 25%)} + +<===> var/alpha/output.css +a { + b: color(from var(--c) srgb r g b/25%); +} + +<===> +================================================================================ +<===> var/no_alpha/input.scss +a {b: color(from var(--c) srgb r g b)} + +<===> var/no_alpha/output.css +a { + b: color(from var(--c) srgb r g b); +} + +<===> +================================================================================ +<===> different_case/alpha/input.scss +a {b: color(From #aaa srgb r g b / 25%)} + +<===> different_case/alpha/output.css +a { + b: color(From #aaa srgb r g b/25%); +} + +<===> +================================================================================ +<===> different_case/no_alpha/input.scss +a {b: color(From #aaa srgb r g b)} + +<===> different_case/no_alpha/output.css +a { + b: color(From #aaa srgb r g b); +} + +<===> +================================================================================ +<===> slash_list_alpha/input.scss +@use "sass:list"; +a {b: color(list.slash(from #aaa srgb r g b, 25%))} + +<===> slash_list_alpha/output.css +a { + b: color(from #aaa srgb r g b / 25%); +} From e95562a65d1b5c49dbfda7bb5601029af1771f00 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Wed, 17 Jul 2024 18:21:45 -0700 Subject: [PATCH 43/45] [Color 4] Add tests to match updated spec (#1995) --- .../color/adjust/error/missing.hrx | 67 ++++ spec/core_functions/color/adjust/space.hrx | 147 +++++++- spec/core_functions/color/adjust_hue.hrx | 13 + spec/core_functions/color/alpha.hrx | 14 + spec/core_functions/color/blackness.hrx | 14 + spec/core_functions/color/blue.hrx | 14 + .../color/change/no_channels.hrx | 19 -- .../core_functions/color/change/none_case.hrx | 30 -- spec/core_functions/color/change/space.hrx | 228 +++++++++++++ .../core_functions/color/color/degenerate.hrx | 87 +++++ spec/core_functions/color/complement.hrx | 242 ++++++++++++- spec/core_functions/color/darken.hrx | 13 + spec/core_functions/color/desaturate.hrx | 13 + spec/core_functions/color/fade_in.hrx | 13 + spec/core_functions/color/fade_out.hrx | 13 + spec/core_functions/color/grayscale.hrx | 59 +++- spec/core_functions/color/green.hrx | 14 + .../color/hsl/four_args/clamped.hrx | 42 --- .../color/hsl/four_args/out_of_gamut.hrx | 235 +++++++++++++ spec/core_functions/color/hue.hrx | 14 + spec/core_functions/color/hwb/four_args.hrx | 132 ++++++++ spec/core_functions/color/invert/error.hrx | 132 ++++++++ spec/core_functions/color/invert/legacy.hrx | 66 +++- spec/core_functions/color/invert/modern.hrx | 33 ++ spec/core_functions/color/lab/alpha.hrx | 39 +++ spec/core_functions/color/lab/no_alpha.hrx | 117 +++++++ spec/core_functions/color/lch/alpha.hrx | 39 +++ spec/core_functions/color/lch/no_alpha.hrx | 117 +++++++ spec/core_functions/color/lighten.hrx | 13 + spec/core_functions/color/lightness.hrx | 14 + .../color/mix/hue_interpolation.hrx | 106 +++++- spec/core_functions/color/mix/missing.hrx | 231 +++++++++++++ spec/core_functions/color/oklab/alpha.hrx | 39 +++ spec/core_functions/color/oklab/no_alpha.hrx | 117 +++++++ spec/core_functions/color/oklch/alpha.hrx | 39 +++ spec/core_functions/color/oklch/no_alpha.hrx | 117 +++++++ spec/core_functions/color/red.hrx | 14 + .../color/rgb/four_args/clamped.hrx | 131 ++++++- spec/core_functions/color/saturate.hrx | 13 + spec/core_functions/color/saturation.hrx | 14 + .../color/scale/error/missing.hrx | 39 +++ .../color/scale/no_channels.hrx | 11 + spec/core_functions/color/scale/space.hrx | 99 ++++++ spec/core_functions/color/to_gamut/space.hrx | 320 ++++++++++++++++++ spec/core_functions/color/whiteness.hrx | 14 + 45 files changed, 3176 insertions(+), 121 deletions(-) create mode 100644 spec/core_functions/color/adjust/error/missing.hrx delete mode 100644 spec/core_functions/color/change/no_channels.hrx delete mode 100644 spec/core_functions/color/change/none_case.hrx create mode 100644 spec/core_functions/color/change/space.hrx create mode 100644 spec/core_functions/color/color/degenerate.hrx delete mode 100644 spec/core_functions/color/hsl/four_args/clamped.hrx create mode 100644 spec/core_functions/color/hsl/four_args/out_of_gamut.hrx create mode 100644 spec/core_functions/color/mix/missing.hrx create mode 100644 spec/core_functions/color/scale/error/missing.hrx diff --git a/spec/core_functions/color/adjust/error/missing.hrx b/spec/core_functions/color/adjust/error/missing.hrx new file mode 100644 index 0000000000..d161d5ab9e --- /dev/null +++ b/spec/core_functions/color/adjust/error/missing.hrx @@ -0,0 +1,67 @@ +<===> legacy/input.scss +@use 'sass:color'; +a {b: color.adjust(rgb(none 0 0), $red: 10)} + +<===> legacy/error +Error: $red: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: rgb(none 0 0)). + , +2 | a {b: color.adjust(rgb(none 0 0), $red: 10)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> modern/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(none 0 0), $lightness: 10%)} + +<===> modern/error +Error: $lightness: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lab(none 0 0)). + , +2 | a {b: color.adjust(lab(none 0 0), $lightness: 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> powerless/legacy/input.scss +@use 'sass:color'; +a {b: color.adjust(grey, $hue: 10deg, $space: hsl)} + +<===> powerless/legacy/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: hsl(none 0% 50.1960784314%)). + , +2 | a {b: color.adjust(grey, $hue: 10deg, $space: hsl)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> powerless/modern/input.scss +@use 'sass:color'; +a {b: color.adjust(grey, $hue: 10deg, $space: lch)} + +<===> powerless/modern/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lch(53.5850134522% 0 none)). + , +2 | a {b: color.adjust(grey, $hue: 10deg, $space: lch)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> alpha/input.scss +@use 'sass:color'; +a {b: color.adjust(rgb(0 0 0 / none), $alpha: 0.1)} + +<===> alpha/error +Error: $alpha: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: rgb(0 0 0 / none)). + , +2 | a {b: color.adjust(rgb(0 0 0 / none), $alpha: 0.1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/adjust/space.hrx b/spec/core_functions/color/adjust/space.hrx index e94266928d..878ed33600 100644 --- a/spec/core_functions/color/adjust/space.hrx +++ b/spec/core_functions/color/adjust/space.hrx @@ -1,8 +1,151 @@ -<===> input.scss +<===> identical/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(50% 0.2 0deg), $space: lab)} + +<===> identical/output.css +a { + b: oklch(50% 0.2 0deg); +} + +<===> +================================================================================ +<===> legacy/to_legacy/input.scss +@use 'sass:color'; +a {b: color.adjust(pink, $saturation: -5%, $space: hsl)} + +<===> legacy/to_legacy/output.css +a { + b: rgb(253.425, 193.575, 204.025); +} + +<===> +================================================================================ +<===> legacy/to_modern/input.scss @use 'sass:color'; a {b: color.adjust(pink, $chroma: -0.01, $space: oklch)} -<===> output.css +<===> legacy/to_modern/output.css a { b: rgb(249.5073873455, 194.8272088475, 204.1290090118); } + +<===> +================================================================================ +<===> modern/to_legacy/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(50% 10 -20), $saturation: 5%, $space: hsl)} + +<===> modern/to_legacy/output.css +a { + b: lab(48.2797960499% 13.4192461856 -26.2119638245); +} + +<===> +================================================================================ +<===> modern/to_modern/input.scss +@use 'sass:color'; +a {b: color.adjust(lab(50% 10 -20), $chroma: 0.01, $space: oklch)} + +<===> modern/to_modern/output.css +a { + b: lab(49.8635566117% 11.8934236813 -23.2342925555); +} + +<===> +================================================================================ +<===> powerless/legacy/input.scss +@use 'sass:color'; +a {b: color.adjust(hsl(0deg 0% 50%), $space: lab)} + +<===> powerless/legacy/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> +================================================================================ +<===> powerless/modern/input.scss +@use 'sass:color'; +a {b: color.adjust(oklch(50% 0 0deg), $space: lab)} + +<===> powerless/modern/output.css +a { + b: oklch(50% 0 none); +} + +<===> +================================================================================ +<===> missing/legacy/same/implicit/input.scss +@use 'sass:color'; +a {b: color.adjust(rgb(none none none))} + +<===> missing/legacy/same/implicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> missing/legacy/same/explicit/input.scss +@use 'sass:color'; +a {b: color.adjust(rgb(none none none), $space: rgb)} + +<===> missing/legacy/same/explicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> missing/legacy/analogous/legacy/input.scss +@use 'sass:color'; +a {b: color.adjust(hsl(none 50% 50%), $space: hwb)} + +<===> missing/legacy/analogous/legacy/output.css +a { + b: hsl(0, 50%, 50%); +} + +<===> +================================================================================ +<===> missing/legacy/analogous/modern/input.scss +@use 'sass:color'; +a {b: color.adjust(rgb(none none none), $space: display-p3)} + +<===> missing/legacy/analogous/modern/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> missing/modern/same/implicit/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb none none none))} + +<===> missing/modern/same/implicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> missing/modern/same/explicit/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb none none none), $space: srgb)} + +<===> missing/modern/same/explicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> missing/modern/analogous/input.scss +@use 'sass:color'; +a {b: color.adjust(color(srgb none none none), $space: display-p3)} + +<===> missing/modern/analogous/output.css +a { + b: color(srgb none none none); +} diff --git a/spec/core_functions/color/adjust_hue.hrx b/spec/core_functions/color/adjust_hue.hrx index 87c1bd6116..a97d14f1f2 100644 --- a/spec/core_functions/color/adjust_hue.hrx +++ b/spec/core_functions/color/adjust_hue.hrx @@ -343,3 +343,16 @@ Error: $degrees: blue is not a number. | ^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +a {b: adjust-hue(lch(0% 0 0deg), 10deg)} + +<===> error/non_legacy/error +Error: adjust-hue() is only supported for legacy colors. Please use color.adjust() instead with an explicit $space argument. + , +1 | a {b: adjust-hue(lch(0% 0 0deg), 10deg)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/alpha.hrx b/spec/core_functions/color/alpha.hrx index 0f1d9a97a3..30f1ca4482 100644 --- a/spec/core_functions/color/alpha.hrx +++ b/spec/core_functions/color/alpha.hrx @@ -217,3 +217,17 @@ Error: $color: 1=c is not a color. | ^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.alpha(color(srgb 1 1 1))} + +<===> error/non_legacy/error +Error: color.alpha() is only supported for legacy colors. Please use color.channel() instead. + , +2 | a {b: color.alpha(color(srgb 1 1 1))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/blackness.hrx b/spec/core_functions/color/blackness.hrx index 4a5cde2c07..2307234373 100644 --- a/spec/core_functions/color/blackness.hrx +++ b/spec/core_functions/color/blackness.hrx @@ -213,3 +213,17 @@ Error: $color: 1 is not a color. | ^^^^^^^^^^^^^^^^^^ ' input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.blackness(color(srgb 1 1 1))} + +<===> error/non_legacy/error +Error: color.blackness() is only supported for legacy colors. Please use color.channel() instead with an explicit $space argument. + , +2 | a {b: color.blackness(color(srgb 1 1 1))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/blue.hrx b/spec/core_functions/color/blue.hrx index de497d03b6..f2111b37f8 100644 --- a/spec/core_functions/color/blue.hrx +++ b/spec/core_functions/color/blue.hrx @@ -134,3 +134,17 @@ Error: $color: 1 is not a color. | ^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.blue(color(srgb 1 1 1))} + +<===> error/non_legacy/error +Error: color.blue() is only supported for legacy colors. Please use color.channel() instead with an explicit $space argument. + , +2 | a {b: color.blue(color(srgb 1 1 1))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/change/no_channels.hrx b/spec/core_functions/color/change/no_channels.hrx deleted file mode 100644 index f59b2e6437..0000000000 --- a/spec/core_functions/color/change/no_channels.hrx +++ /dev/null @@ -1,19 +0,0 @@ -<===> identical/input.scss -@use 'sass:color'; -a {b: color.change(oklch(50% 0.2 0deg), $space: lab)} - -<===> identical/output.css -a { - b: oklch(50% 0.2 0deg); -} - -<===> -================================================================================ -<===> powerless/input.scss -@use 'sass:color'; -a {b: color.change(oklch(50% 0 0deg), $space: lab)} - -<===> powerless/output.css -a { - b: oklch(50% 0 none); -} diff --git a/spec/core_functions/color/change/none_case.hrx b/spec/core_functions/color/change/none_case.hrx deleted file mode 100644 index 2f5d1bbf43..0000000000 --- a/spec/core_functions/color/change/none_case.hrx +++ /dev/null @@ -1,30 +0,0 @@ -<===> legacy/input.scss -@use 'sass:color'; -a {b: color.change(red, $blue: NoNe)} - -<===> legacy/output.css -a { - b: rgb(255 0 none); -} - -<===> -================================================================================ -<===> non_legacy/input.scss -@use 'sass:color'; -a {b: color.change(lab(50% 10 20), $a: nOnE)} - -<===> non_legacy/output.css -a { - b: lab(50% none 20); -} - -<===> -================================================================================ -<===> alpha/input.scss -@use 'sass:color'; -a {b: color.change(red, $alpha: NONE)} - -<===> alpha/output.css -a { - b: rgb(255 0 0 / none); -} diff --git a/spec/core_functions/color/change/space.hrx b/spec/core_functions/color/change/space.hrx new file mode 100644 index 0000000000..2028be2df6 --- /dev/null +++ b/spec/core_functions/color/change/space.hrx @@ -0,0 +1,228 @@ +<===> identical/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0.2 0deg), $space: lab)} + +<===> identical/output.css +a { + b: oklch(50% 0.2 0deg); +} + +<===> +================================================================================ +<===> legacy/to_legacy/input.scss +@use 'sass:color'; +a {b: color.change(pink, $saturation: 5%, $space: hsl)} + +<===> legacy/to_legacy/output.css +a { + b: rgb(225.075, 221.925, 222.475); +} + +<===> +================================================================================ +<===> legacy/to_modern/input.scss +@use 'sass:color'; +a {b: color.change(pink, $chroma: 0.01, $space: oklch)} + +<===> legacy/to_modern/output.css +a { + b: rgb(217.7587670223, 208.8497864408, 210.1600909257); +} + +<===> +================================================================================ +<===> modern/to_legacy/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 10 -20), $saturation: 5%, $space: hsl)} + +<===> modern/to_legacy/output.css +a { + b: lab(53.9442763509% 2.9406893179 -6.1872703789); +} + +<===> +================================================================================ +<===> modern/to_modern/input.scss +@use 'sass:color'; +a {b: color.change(lab(50% 10 -20), $chroma: 0.01, $space: oklch)} + +<===> modern/to_modern/output.css +a { + b: lab(50.5994457353% 1.499908117 -3.4111247636); +} + +<===> +================================================================================ +<===> powerless/legacy/input.scss +@use 'sass:color'; +a {b: color.change(hsl(0deg 0% 50%), $space: lab)} + +<===> powerless/legacy/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> +================================================================================ +<===> powerless/modern/input.scss +@use 'sass:color'; +a {b: color.change(oklch(50% 0 0deg), $space: lab)} + +<===> powerless/modern/output.css +a { + b: oklch(50% 0 none); +} + +<===> +================================================================================ +<===> missing/arg/legacy/same/implicit/input.scss +@use 'sass:color'; +a {b: color.change(pink, $red: none)} + +<===> missing/arg/legacy/same/implicit/output.css +a { + b: rgb(none 192 203); +} + +<===> +================================================================================ +<===> missing/arg/legacy/same/explicit/input.scss +@use 'sass:color'; +a {b: color.change(pink, $red: none, $space: rgb)} + +<===> missing/arg/legacy/same/explicit/output.css +a { + b: rgb(none 192 203); +} + +<===> +================================================================================ +<===> missing/arg/legacy/analogous/legacy/input.scss +@use 'sass:color'; +a {b: color.change(hsl(100deg 50% 50%), $hue: none, $space: hwb)} + +<===> missing/arg/legacy/analogous/legacy/output.css +a { + b: hsl(0, 50%, 50%); +} + +<===> +================================================================================ +<===> missing/arg/legacy/analogous/modern/input.scss +@use 'sass:color'; +a {b: color.change(pink, $red: none, $space: display-p3)} + +<===> missing/arg/legacy/analogous/modern/output.css +a { + b: rgb(0, 198.1453699836, 205.7002828396); +} + +<===> +================================================================================ +<===> missing/arg/modern/same/implicit/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.1 0.2 0.3), $red: none)} + +<===> missing/arg/modern/same/implicit/output.css +a { + b: color(srgb none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/arg/modern/same/explicit/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.1 0.2 0.3), $red: none, $space: srgb)} + +<===> missing/arg/modern/same/explicit/output.css +a { + b: color(srgb none 0.2 0.3); +} + +<===> +================================================================================ +<===> missing/arg/modern/analogous/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb 0.1 0.2 0.3), $red: none, $space: display-p3)} + +<===> missing/arg/modern/analogous/output.css +a { + b: color(srgb none 0.2018961688 0.3005594241); +} + +<===> +================================================================================ +<===> missing/color/legacy/same/implicit/input.scss +@use 'sass:color'; +a {b: color.change(rgb(none none none))} + +<===> missing/color/legacy/same/implicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> missing/color/legacy/same/explicit/input.scss +@use 'sass:color'; +a {b: color.change(rgb(none none none), $space: rgb)} + +<===> missing/color/legacy/same/explicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> missing/color/legacy/analogous/legacy/input.scss +@use 'sass:color'; +a {b: color.change(hsl(none 50% 50%), $space: hwb)} + +<===> missing/color/legacy/analogous/legacy/output.css +a { + b: hsl(0, 50%, 50%); +} + +<===> +================================================================================ +<===> missing/color/legacy/analogous/modern/input.scss +@use 'sass:color'; +a {b: color.change(rgb(none none none), $space: display-p3)} + +<===> missing/color/legacy/analogous/modern/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> missing/color/modern/same/implicit/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb none none none))} + +<===> missing/color/modern/same/implicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> missing/color/modern/same/explicit/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb none none none), $space: srgb)} + +<===> missing/color/modern/same/explicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> missing/color/modern/analogous/input.scss +@use 'sass:color'; +a {b: color.change(color(srgb none none none), $space: display-p3)} + +<===> missing/color/modern/analogous/output.css +a { + b: color(srgb none none none); +} diff --git a/spec/core_functions/color/color/degenerate.hrx b/spec/core_functions/color/color/degenerate.hrx new file mode 100644 index 0000000000..0f2d8b88bc --- /dev/null +++ b/spec/core_functions/color/color/degenerate.hrx @@ -0,0 +1,87 @@ +<===> arg1/positive_infinity/input.scss +a {b: color(srgb calc(infinity) 0 0)} + +<===> arg1/positive_infinity/output.css +a { + b: color(srgb calc(infinity) 0 0); +} + +<===> +================================================================================ +<===> arg1/negative_infinity/input.scss +a {b: color(srgb calc(-infinity) 0 0)} + +<===> arg1/negative_infinity/output.css +a { + b: color(srgb calc(-infinity) 0 0); +} + +<===> +================================================================================ +<===> arg1/nan/input.scss +a {b: color(srgb calc(NaN) 0 0)} + +<===> arg1/nan/output.css +a { + b: color(srgb calc(NaN) 0 0); +} + +<===> +================================================================================ +<===> before_alpha/positive_infinity/input.scss +a {b: color(srgb 0 0 calc(infinity) / 0.5)} + +<===> before_alpha/positive_infinity/output.css +a { + b: color(srgb 0 0 calc(infinity) / 0.5); +} + +<===> +================================================================================ +<===> before_alpha/negative_infinity/input.scss +a {b: color(srgb 0 0 calc(-infinity) / 0.5)} + +<===> before_alpha/negative_infinity/output.css +a { + b: color(srgb 0 0 calc(-infinity) / 0.5); +} + +<===> +================================================================================ +<===> before_alpha/nan/input.scss +a {b: color(srgb 0 0 calc(NaN) / 0.5)} + +<===> before_alpha/nan/output.css +a { + b: color(srgb 0 0 calc(NaN) / 0.5); +} + +<===> +================================================================================ +<===> alpha/positive_infinity/input.scss +a {b: color(srgb 0 0 0 / calc(infinity))} + +<===> alpha/positive_infinity/output.css +a { + b: color(srgb 0 0 0); +} + +<===> +================================================================================ +<===> alpha/negative_infinity/input.scss +a {b: color(srgb 0 0 0 / calc(-infinity))} + +<===> alpha/negative_infinity/output.css +a { + b: color(srgb 0 0 0 / 0); +} + +<===> +================================================================================ +<===> alpha/nan/input.scss +a {b: color(srgb 0 0 0 / calc(NaN))} + +<===> alpha/nan/output.css +a { + b: color(srgb 0 0 0 / 0); +} diff --git a/spec/core_functions/color/complement.hrx b/spec/core_functions/color/complement.hrx index 8f9ec08513..bcca07395e 100644 --- a/spec/core_functions/color/complement.hrx +++ b/spec/core_functions/color/complement.hrx @@ -68,22 +68,134 @@ a { <===> ================================================================================ -<===> non_legacy/input.scss -a {b: complement(lab(54.3 80.8 69.9), lch)} +<===> space/legacy/to_legacy/input.scss +@use 'sass:color'; +a {b: color.complement(red, $space: hwb)} -<===> non_legacy/output.css +<===> space/legacy/to_legacy/output.css a { - b: lab(54.3% -80.8 -69.9); + b: aqua; +} + +<===> +================================================================================ +<===> space/legacy/to_modern/input.scss +@use 'sass:color'; +a {b: color.complement(red, $space: oklch)} + +<===> space/legacy/to_modern/output.css +a { + b: hsl(188.1998868883, 488.1808399597%, 14.588696385%); +} + +<===> +================================================================================ +<===> space/modern/to_legacy/input.scss +@use 'sass:color'; +a {b: color.complement(lab(50% 10 -20), $space: hsl)} + +<===> space/modern/to_legacy/output.css +a { + b: lab(61.7521821385% -8.5219772697 19.4842183485); +} + +<===> +================================================================================ +<===> space/modern/to_modern/input.scss +@use 'sass:color'; +a {b: color.complement(lab(50% 10 -20), $space: oklch)} + +<===> space/modern/to_modern/output.css +a { + b: lab(51.2269614349% -7.7080887555 21.8652618775); +} + +<===> +================================================================================ +<===> space/missing/legacy/same/implicit/input.scss +@use 'sass:color'; +a {b: color.complement(hsl(0deg 50% none))} + +<===> space/missing/legacy/same/implicit/output.css +a { + b: hsl(180deg 50% none); +} + +<===> +================================================================================ +<===> space/missing/legacy/same/explicit/input.scss +@use 'sass:color'; +a {b: color.complement(hsl(0deg 50% none), $space: hsl)} + +<===> space/missing/legacy/same/explicit/output.css +a { + b: hsl(180deg 50% none); +} + +<===> +================================================================================ +<===> space/missing/legacy/different/implicit/input.scss +@use 'sass:color'; +a {b: color.complement(hwb(0deg 50% none))} + +<===> space/missing/legacy/different/implicit/output.css +a { + b: hsl(180, 100%, 75%); +} + +<===> +================================================================================ +<===> space/missing/legacy/different/explicit/input.scss +@use 'sass:color'; +a {b: color.complement(hwb(0deg 50% none), $space: hsl)} + +<===> space/missing/legacy/different/explicit/output.css +a { + b: hsl(180, 100%, 75%); +} + +<===> +================================================================================ +<===> space/missing/modern/same/input.scss +@use 'sass:color'; +a {b: color.complement(lch(none 50% 0deg), $space: hsl)} + +<===> space/missing/modern/same/output.css +a { + b: lch(none 0 none); +} + +<===> +================================================================================ +<===> space/missing/modern/different/input.scss +@use 'sass:color'; +a {b: color.complement(color(srgb none 100 200), $space: oklch)} + +<===> space/missing/modern/different/output.css +a { + b: color(srgb 156.4212689375 85.1578644836 -71.2263945029); } <===> ================================================================================ -<===> predefined/input.scss -a {b: complement(color(srgb-linear 0.6 0 0.6), hwb)} +<===> space/missing/modern/analogous/input.scss +@use 'sass:color'; +a {b: color.complement(lch(none 50% 0deg), $space: oklch)} -<===> predefined/output.css +<===> space/missing/modern/analogous/output.css a { - b: color(srgb-linear 0 0.6 0); + b: lch(none 24.5072211405 180.9107983689deg); +} + +<===> +================================================================================ +<===> space/powerless/legacy/implicit/input.scss +@use 'sass:color'; +a {b: color.complement(hsl(0deg 0% 50%))} + +<===> space/powerless/legacy/implicit/output.css +a { + b: hsl(180, 0%, 50%); } <===> @@ -168,3 +280,117 @@ Error: $space: Color space xyz doesn't have a hue channel. | ^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/space/missing/legacy/same/implicit/input.scss +@use 'sass:color'; +a {b: color.complement(hsl(none 30% 40%))} + +<===> error/space/missing/legacy/same/implicit/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: hsl(none 30% 40%)). + , +2 | a {b: color.complement(hsl(none 30% 40%))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/space/missing/legacy/same/explicit/input.scss +@use 'sass:color'; +a {b: color.complement(hsl(none 30% 40%), $space: hsl)} + +<===> error/space/missing/legacy/same/explicit/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: hsl(none 30% 40%)). + , +2 | a {b: color.complement(hsl(none 30% 40%), $space: hsl)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/space/missing/legacy/analogous/hue/input.scss +@use 'sass:color'; +a {b: color.complement(hsl(none 30% 40%), $space: lch)} + +<===> error/space/missing/legacy/analogous/hue/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lch(38.0910184332% 29.3078189694 none)). + , +2 | a {b: color.complement(hsl(none 30% 40%), $space: lch)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/space/missing/legacy/analogous/lightness/input.scss +// This is an error specifically because hsl(0deg 50% none) converts through +// rgb(0 0 0) to lch(none 0 none), so adjusting the hue fails. +@use 'sass:color'; +a {b: color.complement(hsl(0deg 50% none), $space: lch)} + +<===> error/space/missing/legacy/analogous/lightness/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lch(none 0 none)). + , +4 | a {b: color.complement(hsl(0deg 50% none), $space: lch)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 4:7 root stylesheet + +<===> +================================================================================ +<===> error/space/missing/modern/same/input.scss +@use 'sass:color'; +a {b: color.complement(lch(40% 30% none), $space: hsl)} + +<===> error/space/missing/modern/same/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: hsl(none 46.6772108151% 42.1546574074%)). + , +2 | a {b: color.complement(lch(40% 30% none), $space: hsl)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/space/missing/modern/analogous/input.scss +@use 'sass:color'; +a {b: color.complement(lch(40% 30% none), $space: lch)} + +<===> error/space/missing/modern/analogous/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lch(40% 45 none)). + , +2 | a {b: color.complement(lch(40% 30% none), $space: lch)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/space/powerless/legacy/explicit/input.scss +@use 'sass:color'; +a {b: color.complement(grey, $space: hsl)} + +<===> error/space/powerless/legacy/explicit/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: hsl(none 0% 50.1960784314%)). + , +2 | a {b: color.complement(grey, $space: hsl)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/space/powerless/modern/input.scss +@use 'sass:color'; +a {b: color.complement(lab(50% 0 0), $space: lch)} + +<===> error/space/powerless/modern/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lch(50% 0 none)). + , +2 | a {b: color.complement(lab(50% 0 0), $space: lch)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/darken.hrx b/spec/core_functions/color/darken.hrx index 627c742467..569cf90dbc 100644 --- a/spec/core_functions/color/darken.hrx +++ b/spec/core_functions/color/darken.hrx @@ -248,3 +248,16 @@ Error: $amount: Expected 100.001 to be within 0 and 100. | ^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +a {b: darken(color(srgb 1 1 1), 10%)} + +<===> error/non_legacy/error +Error: darken() is only supported for legacy colors. Please use color.adjust() instead with an explicit $space argument. + , +1 | a {b: darken(color(srgb 1 1 1), 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/desaturate.hrx b/spec/core_functions/color/desaturate.hrx index 48b3a43c1f..08a0fa1d18 100644 --- a/spec/core_functions/color/desaturate.hrx +++ b/spec/core_functions/color/desaturate.hrx @@ -241,3 +241,16 @@ Error: $amount: Expected 100.001 to be within 0 and 100. | ^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +a {b: desaturate(color(srgb 1 1 1), 10%)} + +<===> error/non_legacy/error +Error: desaturate() is only supported for legacy colors. Please use color.adjust() instead with an explicit $space argument. + , +1 | a {b: desaturate(color(srgb 1 1 1), 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/fade_in.hrx b/spec/core_functions/color/fade_in.hrx index 0d3f13151b..b99cf5af47 100644 --- a/spec/core_functions/color/fade_in.hrx +++ b/spec/core_functions/color/fade_in.hrx @@ -239,3 +239,16 @@ Error: $amount: Expected 50% to be within 0 and 1. | ^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +a {b: fade-in(color(srgb 1 1 1 / 0.1), 0.1)} + +<===> error/non_legacy/error +Error: fade-in() is only supported for legacy colors. Please use color.adjust() instead with an explicit $space argument. + , +1 | a {b: fade-in(color(srgb 1 1 1 / 0.1), 0.1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/fade_out.hrx b/spec/core_functions/color/fade_out.hrx index bdcb083c28..146ee8d427 100644 --- a/spec/core_functions/color/fade_out.hrx +++ b/spec/core_functions/color/fade_out.hrx @@ -239,3 +239,16 @@ Error: $amount: Expected 50% to be within 0 and 1. | ^^^^^^^^^^^^^^^^^^ ' input.scss 3:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +a {b: fade-out(color(srgb 1 1 1), 0.1)} + +<===> error/non_legacy/error +Error: fade-out() is only supported for legacy colors. Please use color.adjust() instead with an explicit $space argument. + , +1 | a {b: fade-out(color(srgb 1 1 1), 0.1)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/grayscale.hrx b/spec/core_functions/color/grayscale.hrx index 5376f97e55..ac27b818e4 100644 --- a/spec/core_functions/color/grayscale.hrx +++ b/spec/core_functions/color/grayscale.hrx @@ -62,6 +62,39 @@ a { b: rgba(76.5, 76.5, 76.5, 0.3); } +<===> +================================================================================ +<===> legacy/powerless/same/input.scss +@use 'sass:color'; +a {b: color.grayscale(hsl(120deg 10% 20%))} + +<===> legacy/powerless/same/output.css +a { + b: hsl(120, 0%, 20%); +} + +<===> +================================================================================ +<===> legacy/powerless/different/input.scss +@use 'sass:color'; +a {b: color.grayscale(hwb(120deg 10% 20%))} + +<===> legacy/powerless/different/output.css +a { + b: hsl(0, 0%, 45%); +} + +<===> +================================================================================ +<===> legacy/missing/input.scss +@use 'sass:color'; +a {b: color.grayscale(hsl(none none none))} + +<===> legacy/missing/output.css +a { + b: hsl(none 0% none); +} + <===> ================================================================================ <===> global/number/input.scss @@ -160,15 +193,37 @@ a { <===> ================================================================================ -<===> non_legacy/predefined/input.scss +<===> modern/predefined/input.scss @use 'sass:color'; a {b: color.grayscale(color(xyz-d65 0.41 0.21 0.02))} -<===> non_legacy/predefined/output.css +<===> modern/predefined/output.css a { b: color(xyz 0.232829773 0.2449664044 0.2667826176); } +<===> +================================================================================ +<===> modern/powerless/input.scss +@use 'sass:color'; +a {b: color.grayscale(oklch(20% 10% 120deg))} + +<===> modern/powerless/output.css +a { + b: oklch(20% 0 120deg); +} + +<===> +================================================================================ +<===> modern/missing/input.scss +@use 'sass:color'; +a {b: color.grayscale(oklch(none none none))} + +<===> modern/missing/output.css +a { + b: oklch(none 0 none); +} + <===> ================================================================================ <===> error/too_few_args/input.scss diff --git a/spec/core_functions/color/green.hrx b/spec/core_functions/color/green.hrx index f1d95aaa0b..8e858667df 100644 --- a/spec/core_functions/color/green.hrx +++ b/spec/core_functions/color/green.hrx @@ -134,3 +134,17 @@ Error: $color: 1 is not a color. | ^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.green(color(srgb 1 1 1))} + +<===> error/non_legacy/error +Error: color.green() is only supported for legacy colors. Please use color.channel() instead with an explicit $space argument. + , +2 | a {b: color.green(color(srgb 1 1 1))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/hsl/four_args/clamped.hrx b/spec/core_functions/color/hsl/four_args/clamped.hrx deleted file mode 100644 index 85a62b65dd..0000000000 --- a/spec/core_functions/color/hsl/four_args/clamped.hrx +++ /dev/null @@ -1,42 +0,0 @@ -<===> README.md -Channels that are out of bounds are clamped within bounds. - -<===> -================================================================================ -<===> saturation/input.scss -a {b: hsl(0, -0.1%, 50%, 0.5)} - -<===> saturation/output.css -a { - b: hsla(0, 0%, 50%, 0.5); -} - -<===> -================================================================================ -<===> blue/input.scss -a {b: hsl(0, 100%, 9999%, 0.5)} - -<===> blue/output.css -a { - b: hsla(0, 100%, 9999%, 0.5); -} - -<===> -================================================================================ -<===> alpha/above/input.scss -a {b: hsl(0, 100%, 50%, 1.1)} - -<===> alpha/above/output.css -a { - b: hsl(0, 100%, 50%); -} - -<===> -================================================================================ -<===> alpha/below/input.scss -a {b: hsla(0, 100%, 50%, -0.1)} - -<===> alpha/below/output.css -a { - b: hsla(0, 100%, 50%, 0); -} diff --git a/spec/core_functions/color/hsl/four_args/out_of_gamut.hrx b/spec/core_functions/color/hsl/four_args/out_of_gamut.hrx new file mode 100644 index 0000000000..c13e978275 --- /dev/null +++ b/spec/core_functions/color/hsl/four_args/out_of_gamut.hrx @@ -0,0 +1,235 @@ +<===> hue/degenerate/positive_infinity/input.scss +a {b: hsl(calc(infinity), 100%, 50%)} + +<===> hue/degenerate/positive_infinity/output.css +a { + b: hsl(calc(NaN), 100%, 50%); +} + +<===> +================================================================================ +<===> hue/degenerate/negative_infinity/input.scss +a {b: hsl(calc(-infinity), 100%, 50%)} + +<===> hue/degenerate/negative_infinity/output.css +a { + b: hsl(calc(NaN), 100%, 50%); +} + +<===> +================================================================================ +<===> hue/degenerate/nan/input.scss +a {b: hsl(calc(NaN), 100%, 50%)} + +<===> hue/degenerate/nan/output.css +a { + b: hsl(calc(NaN), 100%, 50%); +} + +<===> +================================================================================ +<===> saturation/finite/input.scss +a {b: hsl(0, -0.1%, 50%, 0.5)} + +<===> saturation/finite/output.css +a { + b: hsla(0, 0%, 50%, 0.5); +} + +<===> +================================================================================ +<===> saturation/degenerate/positive_infinity/input.scss +a {b: hsl(0, calc(infinity), 50%)} + +<===> saturation/degenerate/positive_infinity/output.css +a { + b: hsl(0, calc(infinity * 1%), 50%); +} + +<===> saturation/degenerate/positive_infinity/warning +DEPRECATION WARNING: $saturation: Passing a number without unit % (calc(infinity)) is deprecated. + +To preserve current behavior: $saturation * 1% + +More info: https://sass-lang.com/d/function-units + + , +1 | a {b: hsl(0, calc(infinity), 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> saturation/degenerate/negative_infinity/input.scss +a {b: hsl(0, calc(-infinity), 50%)} + +<===> saturation/degenerate/negative_infinity/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> saturation/degenerate/negative_infinity/warning +DEPRECATION WARNING: $saturation: Passing a number without unit % (calc(-infinity)) is deprecated. + +To preserve current behavior: $saturation * 1% + +More info: https://sass-lang.com/d/function-units + + , +1 | a {b: hsl(0, calc(-infinity), 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> saturation/degenerate/nan/input.scss +a {b: hsl(0, calc(NaN), 50%)} + +<===> saturation/degenerate/nan/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> saturation/degenerate/nan/warning +DEPRECATION WARNING: $saturation: Passing a number without unit % (calc(NaN)) is deprecated. + +To preserve current behavior: $saturation * 1% + +More info: https://sass-lang.com/d/function-units + + , +1 | a {b: hsl(0, calc(NaN), 50%)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> lightness/finite/input.scss +a {b: hsl(0, 100%, 9999%, 0.5)} + +<===> lightness/finite/output.css +a { + b: hsla(0, 100%, 9999%, 0.5); +} + +<===> +================================================================================ +<===> lightness/degenerate/positive_infinity/input.scss +a {b: hsl(0, 100%, calc(infinity))} + +<===> lightness/degenerate/positive_infinity/output.css +a { + b: hsl(0, 100%, calc(infinity * 1%)); +} + +<===> lightness/degenerate/positive_infinity/warning +DEPRECATION WARNING: $lightness: Passing a number without unit % (calc(infinity)) is deprecated. + +To preserve current behavior: $lightness * 1% + +More info: https://sass-lang.com/d/function-units + + , +1 | a {b: hsl(0, 100%, calc(infinity))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> lightness/degenerate/negative_infinity/input.scss +a {b: hsl(0, 100%, calc(-infinity))} + +<===> lightness/degenerate/negative_infinity/output.css +a { + b: hsl(0, 100%, calc(-infinity * 1%)); +} + +<===> lightness/degenerate/negative_infinity/warning +DEPRECATION WARNING: $lightness: Passing a number without unit % (calc(-infinity)) is deprecated. + +To preserve current behavior: $lightness * 1% + +More info: https://sass-lang.com/d/function-units + + , +1 | a {b: hsl(0, 100%, calc(-infinity))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> lightness/degenerate/nan/input.scss +a {b: hsl(0, 100%, calc(NaN))} + +<===> lightness/degenerate/nan/output.css +a { + b: hsl(0, 100%, calc(NaN * 1%)); +} + +<===> lightness/degenerate/nan/warning +DEPRECATION WARNING: $lightness: Passing a number without unit % (calc(NaN)) is deprecated. + +To preserve current behavior: $lightness * 1% + +More info: https://sass-lang.com/d/function-units + + , +1 | a {b: hsl(0, 100%, calc(NaN))} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> alpha/finite/above/input.scss +a {b: hsl(0, 100%, 50%, 1.1)} + +<===> alpha/finite/above/output.css +a { + b: hsl(0, 100%, 50%); +} + +<===> +================================================================================ +<===> alpha/finite/below/input.scss +a {b: hsla(0, 100%, 50%, -0.1)} + +<===> alpha/finite/below/output.css +a { + b: hsla(0, 100%, 50%, 0); +} + +<===> +================================================================================ +<===> alpha/degenerate/positive_infinity/input.scss +a {b: hsl(0, 100%, 50%, calc(infinity))} + +<===> alpha/degenerate/positive_infinity/output.css +a { + b: hsl(0, 100%, 50%); +} + +<===> +================================================================================ +<===> alpha/degenerate/negative_infinity/input.scss +a {b: hsl(0, 100%, 50%, calc(-infinity))} + +<===> alpha/degenerate/negative_infinity/output.css +a { + b: hsla(0, 100%, 50%, 0); +} + +<===> +================================================================================ +<===> alpha/degenerate/nan/input.scss +a {b: hsl(0, 100%, 50%, calc(NaN))} + +<===> alpha/degenerate/nan/output.css +a { + b: hsla(0, 100%, 50%, 0); +} diff --git a/spec/core_functions/color/hue.hrx b/spec/core_functions/color/hue.hrx index 9a06047b11..11dbc1e9eb 100644 --- a/spec/core_functions/color/hue.hrx +++ b/spec/core_functions/color/hue.hrx @@ -203,3 +203,17 @@ Error: $color: 1 is not a color. | ^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.hue(lch(0% 0 0deg))} + +<===> error/non_legacy/error +Error: color.hue() is only supported for legacy colors. Please use color.channel() instead with an explicit $space argument. + , +2 | a {b: color.hue(lch(0% 0 0deg))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/hwb/four_args.hrx b/spec/core_functions/color/hwb/four_args.hrx index c42598cdf2..37ecedcae1 100644 --- a/spec/core_functions/color/hwb/four_args.hrx +++ b/spec/core_functions/color/hwb/four_args.hrx @@ -7,6 +7,39 @@ a { b: hwb(var(--c) 30% 40% / 0.5); } +<===> +================================================================================ +<===> hue/degenerate/positive_infinity/input.scss +@use 'sass:color'; +a {b: color.hwb(calc(infinity), 30%, 40%, 0.5)} + +<===> hue/degenerate/positive_infinity/output.css +a { + b: hsla(0, 0%, 30%, 0.5); +} + +<===> +================================================================================ +<===> hue/degenerate/negative_infinity/input.scss +@use 'sass:color'; +a {b: color.hwb(calc(-infinity), 30%, 40%, 0.5)} + +<===> hue/degenerate/negative_infinity/output.css +a { + b: hsla(0, 0%, 30%, 0.5); +} + +<===> +================================================================================ +<===> hue/degenerate/nan/input.scss +@use 'sass:color'; +a {b: color.hwb(calc(NaN), 30%, 40%, 0.5)} + +<===> hue/degenerate/nan/output.css +a { + b: hsla(0, 0%, 30%, 0.5); +} + <===> ================================================================================ <===> whiteness/above_max/input.scss @@ -40,6 +73,39 @@ a { b: hwb(0 var(--c) 40% / 0.5); } +<===> +================================================================================ +<===> whiteness/degenerate/positive_infinity/input.scss +@use 'sass:color'; +a {b: color.hwb(0, calc(infinity * 1%), 40%, 0.5)} + +<===> whiteness/degenerate/positive_infinity/output.css +a { + b: hsla(calc(NaN), calc(NaN * 1%), calc(NaN * 1%), 0.5); +} + +<===> +================================================================================ +<===> whiteness/degenerate/negative_infinity/input.scss +@use 'sass:color'; +a {b: color.hwb(0, calc(-infinity * 1%), 40%, 0.5)} + +<===> whiteness/degenerate/negative_infinity/output.css +a { + b: hsla(calc(NaN), calc(NaN * 1%), calc(NaN * 1%), 0.5); +} + +<===> +================================================================================ +<===> whiteness/degenerate/nan/input.scss +@use 'sass:color'; +a {b: color.hwb(0, calc(NaN * 1%), 40%, 0.5)} + +<===> whiteness/degenerate/nan/output.css +a { + b: hsla(calc(NaN), calc(NaN * 1%), calc(NaN * 1%), 0.5); +} + <===> ================================================================================ <===> blackness/above_max/input.scss @@ -73,6 +139,39 @@ a { b: hwb(0 30% var(--c) / 0.5); } +<===> +================================================================================ +<===> blackness/degenerate/positive_infinity/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, calc(infinity * 1%), 0.5)} + +<===> blackness/degenerate/positive_infinity/output.css +a { + b: hsla(calc(NaN), calc(NaN * 1%), calc(NaN * 1%), 0.5); +} + +<===> +================================================================================ +<===> blackness/degenerate/negative_infinity/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, calc(-infinity * 1%), 0.5)} + +<===> blackness/degenerate/negative_infinity/output.css +a { + b: hsla(calc(NaN), calc(NaN * 1%), calc(NaN * 1%), 0.5); +} + +<===> +================================================================================ +<===> blackness/degenerate/nan/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, calc(NaN * 1%), 0.5)} + +<===> blackness/degenerate/nan/output.css +a { + b: hsla(calc(NaN), calc(NaN * 1%), calc(NaN * 1%), 0.5); +} + <===> ================================================================================ <===> alpha/percent/negative/input.scss @@ -194,6 +293,39 @@ a { b: hwb(0 0% 0% / var(--c)); } +<===> +================================================================================ +<===> alpha/degenerate/positive_infinity/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, 40%, calc(infinity))} + +<===> alpha/degenerate/positive_infinity/output.css +a { + b: hsl(0, 33.3333333333%, 45%); +} + +<===> +================================================================================ +<===> alpha/degenerate/negative_infinity/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, 40%, calc(-infinity))} + +<===> alpha/degenerate/negative_infinity/output.css +a { + b: hsla(0, 33.3333333333%, 45%, 0); +} + +<===> +================================================================================ +<===> alpha/degenerate/nan/input.scss +@use 'sass:color'; +a {b: color.hwb(0, 30%, 40%, calc(NaN))} + +<===> alpha/degenerate/nan/output.css +a { + b: hsla(0, 33.3333333333%, 45%, 0); +} + <===> ================================================================================ <===> named/input.scss diff --git a/spec/core_functions/color/invert/error.hrx b/spec/core_functions/color/invert/error.hrx index 7ed58d4915..5d5b31f41d 100644 --- a/spec/core_functions/color/invert/error.hrx +++ b/spec/core_functions/color/invert/error.hrx @@ -58,6 +58,110 @@ Error: $color: c is not a color. ' input.scss 1:7 root stylesheet +<===> +================================================================================ +<===> missing/legacy/same/implicit/input.scss +a {b: invert(rgb(none 10 20))} + +<===> missing/legacy/same/implicit/error +Error: $red: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: rgb(none 10 20)). + , +1 | a {b: invert(rgb(none 10 20))} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> missing/legacy/same/explicit/input.scss +a {b: invert(hsl(0 40% none), $space: hsl)} + +<===> missing/legacy/same/explicit/error +Error: $lightness: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: hsl(0deg 40% none)). + , +1 | a {b: invert(hsl(0 40% none), $space: hsl)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> missing/legacy/same/hwb_hue/input.scss +a {b: invert(hwb(none 10% 20%), $space: hwb)} + +<===> missing/legacy/same/hwb_hue/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: hwb(none 10% 20%)). + , +1 | a {b: invert(hwb(none 10% 20%), $space: hwb)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> missing/legacy/analogous/input.scss +a {b: invert(rgb(10 none 20), $space: xyz)} + +<===> missing/legacy/analogous/error +Error: $y: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: color(xyz 0.0025142545 none 0.0067080366)). + , +1 | a {b: invert(rgb(10 none 20), $space: xyz)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> missing/legacy/powerless/input.scss +a {b: invert(grey, $space: hsl)} + +<===> missing/legacy/powerless/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: hsl(none 0% 50.1960784314%)). + , +1 | a {b: invert(grey, $space: hsl)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> missing/modern/same/input.scss +a {b: invert(color(srgb none 0.1 0.2), $space: srgb)} + +<===> missing/modern/same/error +Error: $red: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: color(srgb none 0.1 0.2)). + , +1 | a {b: invert(color(srgb none 0.1 0.2), $space: srgb)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> missing/modern/analogous/input.scss +a {b: invert(color(rec2020 0.1 none 0.2), $space: xyz)} + +<===> missing/modern/analogous/error +Error: $y: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: color(xyz 0.0237000113 none 0.0589013339)). + , +1 | a {b: invert(color(rec2020 0.1 none 0.2), $space: xyz)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> missing/modern/powerless/input.scss +a {b: invert(color(rec2020 0.4 0.4 0.4), $space: lch)} + +<===> missing/modern/powerless/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lch(48.649404846% 0 none)). + , +1 | a {b: invert(color(rec2020 0.4 0.4 0.4), $space: lch)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + <===> ================================================================================ <===> type/color/input.scss @@ -128,6 +232,34 @@ Error: $space: Unknown color space "c". ' input.scss 2:7 root stylesheet +<===> +================================================================================ +<===> space/missing/default_weight/input.scss +@use 'sass:color'; +a {b: color.invert(lab(50% -10 10))} + +<===> space/missing/default_weight/error +Error: $color: To use color.invert() with non-legacy color lab(50% -10 10), you must provide a $space. + , +2 | a {b: color.invert(lab(50% -10 10))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/missing/zero_weight/input.scss +@use 'sass:color'; +a {b: color.invert(lab(50% -10 10), 0%)} + +<===> space/missing/zero_weight/error +Error: $color: To use color.invert() with non-legacy color lab(50% -10 10), you must provide a $space. + , +2 | a {b: color.invert(lab(50% -10 10), 0%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + <===> ================================================================================ <===> bounds/too_low/input.scss diff --git a/spec/core_functions/color/invert/legacy.hrx b/spec/core_functions/color/invert/legacy.hrx index 915a921156..38670ab456 100644 --- a/spec/core_functions/color/invert/legacy.hrx +++ b/spec/core_functions/color/invert/legacy.hrx @@ -135,26 +135,84 @@ a { <===> ================================================================================ -<===> space/hsl/input.scss +<===> space/hsl/no_missing/input.scss @use 'sass:color'; a {b: color.invert(hsl(30deg 20% 40%), $space: hsl)} -<===> space/hsl/output.css +<===> space/hsl/no_missing/output.css a { b: hsl(210, 20%, 60%); } <===> ================================================================================ -<===> space/hwb/input.scss +<===> space/hsl/missing/same/input.scss +@use 'sass:color'; +a {b: color.invert(hsl(30deg none 40%), $space: hsl)} + +<===> space/hsl/missing/same/output.css +a { + b: hsl(210deg none 60%); +} + +<===> +================================================================================ +<===> space/hsl/missing/analogous/input.scss +@use 'sass:color'; +a {b: color.invert(hsl(30deg none 40%), $space: lch)} + +<===> space/hsl/missing/analogous/error +Error: $hue: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lch(43.192289563% none none)). + , +2 | a {b: color.invert(hsl(30deg none 40%), $space: lch)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> space/hwb/no_missing/input.scss @use 'sass:color'; a {b: color.invert(hwb(30deg 20% 40%), $space: hwb)} -<===> space/hwb/output.css +<===> space/hwb/no_missing/output.css a { b: #6699cc; } +<===> +================================================================================ +<===> space/hwb/missing/input.scss +@use 'sass:color'; +a {b: color.invert(hwb(30deg none 40%), $space: hwb)} + +<===> space/hwb/missing/output.css +a { + b: hwb(210deg 40% none); +} + +<===> +================================================================================ +<===> space/powerless/same/input.scss +@use 'sass:color'; +a {b: color.invert(hsl(120deg 0% 40%), $space: hsl)} + +<===> space/powerless/same/output.css +a { + b: hsl(300, 0%, 60%); +} + +<===> +================================================================================ +<===> space/powerless/different/input.scss +@use 'sass:color'; +a {b: color.invert(hsl(120deg 0% 40%), $space: rgb)} + +<===> space/powerless/different/output.css +a { + b: hsl(0, 0%, 60%); +} + <===> ================================================================================ <===> space/modern/input.scss diff --git a/spec/core_functions/color/invert/modern.hrx b/spec/core_functions/color/invert/modern.hrx index 041c57af86..ee583bbc16 100644 --- a/spec/core_functions/color/invert/modern.hrx +++ b/spec/core_functions/color/invert/modern.hrx @@ -105,3 +105,36 @@ a {b: color.invert(lch(20% 80 50deg), $space: DISPLAY-p3)} a { b: lch(97.4036876937% 47.4823953357 211.8732507605deg); } + +<===> +================================================================================ +<===> space/missing_converted/input.scss +@use 'sass:color'; +a {b: color.invert(color(rec2020 none none none), $space: lab)} + +<===> space/missing_converted/output.css +a { + b: color(rec2020 1 1 1); +} + +<===> +================================================================================ +<===> space/powerless/same/input.scss +@use 'sass:color'; +a {b: color.invert(lch(40% 0% 120deg), $space: lch)} + +<===> space/powerless/same/output.css +a { + b: lch(60% 0 300deg); +} + +<===> +================================================================================ +<===> space/powerless/different/input.scss +@use 'sass:color'; +a {b: color.invert(lch(40% 0% 120deg), $space: lab)} + +<===> space/powerless/different/output.css +a { + b: lch(60% 0 none); +} diff --git a/spec/core_functions/color/lab/alpha.hrx b/spec/core_functions/color/lab/alpha.hrx index cff840012c..f5cbdb3bed 100644 --- a/spec/core_functions/color/lab/alpha.hrx +++ b/spec/core_functions/color/lab/alpha.hrx @@ -48,6 +48,45 @@ a { channels: 1% 2 3 / 0.4; } +<===> +================================================================================ +<===> degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% 2 -3 / calc(infinity))); + +<===> degenerate/positive_infinity/output.css +a { + value: lab(1% 2 -3); + space: lab; + channels: 1% 2 -3 / 1; +} + +<===> +================================================================================ +<===> degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% 2 -3 / calc(-infinity))); + +<===> degenerate/negative_infinity/output.css +a { + value: lab(1% 2 -3 / 0); + space: lab; + channels: 1% 2 -3 / 0; +} + +<===> +================================================================================ +<===> degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% 2 -3 / calc(NaN))); + +<===> degenerate/nan/output.css +a { + value: lab(1% 2 -3 / 0); + space: lab; + channels: 1% 2 -3 / 0; +} + <===> ================================================================================ <===> named/input.scss diff --git a/spec/core_functions/color/lab/no_alpha.hrx b/spec/core_functions/color/lab/no_alpha.hrx index 39d71357fe..a8dbf05b22 100644 --- a/spec/core_functions/color/lab/no_alpha.hrx +++ b/spec/core_functions/color/lab/no_alpha.hrx @@ -35,6 +35,84 @@ a { channels: 1% -126 -300 / 1; } +<===> +================================================================================ +<===> unitless/a/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% calc(infinity) -3)); + +<===> unitless/a/degenerate/positive_infinity/output.css +a { + value: lab(1% calc(infinity) -3); + space: lab; + channels: 1% calc(infinity) -3 / 1; +} + +<===> +================================================================================ +<===> unitless/a/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% calc(-infinity) -3)); + +<===> unitless/a/degenerate/negative_infinity/output.css +a { + value: lab(1% calc(-infinity) -3); + space: lab; + channels: 1% calc(-infinity) -3 / 1; +} + +<===> +================================================================================ +<===> unitless/a/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% calc(NaN) -3)); + +<===> unitless/a/degenerate/nan/output.css +a { + value: lab(1% calc(NaN) -3); + space: lab; + channels: 1% calc(NaN) -3 / 1; +} + +<===> +================================================================================ +<===> unitless/b/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% 2 calc(infinity))); + +<===> unitless/b/degenerate/positive_infinity/output.css +a { + value: lab(1% 2 calc(infinity)); + space: lab; + channels: 1% 2 calc(infinity) / 1; +} + +<===> +================================================================================ +<===> unitless/b/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% 2 calc(-infinity))); + +<===> unitless/b/degenerate/negative_infinity/output.css +a { + value: lab(1% 2 calc(-infinity)); + space: lab; + channels: 1% 2 calc(-infinity) / 1; +} + +<===> +================================================================================ +<===> unitless/b/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(1% 2 calc(NaN))); + +<===> unitless/b/degenerate/nan/output.css +a { + value: lab(1% 2 calc(NaN)); + space: lab; + channels: 1% 2 calc(NaN) / 1; +} + <===> ================================================================================ <===> unitless/lightness/in_range/input.scss @@ -74,6 +152,45 @@ a { channels: 0% 2 3 / 1; } +<===> +================================================================================ +<===> unitless/lightness/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(calc(infinity) 2 -3)); + +<===> unitless/lightness/degenerate/positive_infinity/output.css +a { + value: lab(100% 2 -3); + space: lab; + channels: 100% 2 -3 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(calc(-infinity) 2 -3)); + +<===> unitless/lightness/degenerate/negative_infinity/output.css +a { + value: lab(0% 2 -3); + space: lab; + channels: 0% 2 -3 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lab(calc(NaN) 2 -3)); + +<===> unitless/lightness/degenerate/nan/output.css +a { + value: lab(0% 2 -3); + space: lab; + channels: 0% 2 -3 / 1; +} + <===> ================================================================================ <===> percent/ab/in_range/input.scss diff --git a/spec/core_functions/color/lch/alpha.hrx b/spec/core_functions/color/lch/alpha.hrx index a5957e271f..d3e730ebf8 100644 --- a/spec/core_functions/color/lch/alpha.hrx +++ b/spec/core_functions/color/lch/alpha.hrx @@ -48,6 +48,45 @@ a { channels: 1% 2 3deg / 0.4; } +<===> +================================================================================ +<===> degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% 2 3deg / calc(infinity))); + +<===> degenerate/positive_infinity/output.css +a { + value: lch(1% 2 3deg); + space: lch; + channels: 1% 2 3deg / 1; +} + +<===> +================================================================================ +<===> degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% 2 3deg / calc(-infinity))); + +<===> degenerate/negative_infinity/output.css +a { + value: lch(1% 2 3deg / 0); + space: lch; + channels: 1% 2 3deg / 0; +} + +<===> +================================================================================ +<===> degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% 2 3deg / calc(NaN))); + +<===> degenerate/nan/output.css +a { + value: lch(1% 2 3deg / 0); + space: lch; + channels: 1% 2 3deg / 0; +} + <===> ================================================================================ <===> named/input.scss diff --git a/spec/core_functions/color/lch/no_alpha.hrx b/spec/core_functions/color/lch/no_alpha.hrx index 8d01279b8a..1402f79413 100644 --- a/spec/core_functions/color/lch/no_alpha.hrx +++ b/spec/core_functions/color/lch/no_alpha.hrx @@ -35,6 +35,45 @@ a { channels: 0% 2 3deg / 1; } +<===> +================================================================================ +<===> unitless/lightness/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(calc(infinity) 2 3deg)); + +<===> unitless/lightness/degenerate/positive_infinity/output.css +a { + value: lch(100% 2 3deg); + space: lch; + channels: 100% 2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(calc(-infinity) 2 3deg)); + +<===> unitless/lightness/degenerate/negative_infinity/output.css +a { + value: lch(0% 2 3deg); + space: lch; + channels: 0% 2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(calc(NaN) 2 3deg)); + +<===> unitless/lightness/degenerate/nan/output.css +a { + value: lch(0% 2 3deg); + space: lch; + channels: 0% 2 3deg / 1; +} + <===> ================================================================================ <===> unitless/chroma/above_range/input.scss @@ -61,6 +100,45 @@ a { channels: 1% 0 3deg / 1; } +<===> +================================================================================ +<===> unitless/chroma/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% calc(infinity) 3deg)); + +<===> unitless/chroma/degenerate/positive_infinity/output.css +a { + value: lch(1% calc(infinity) 3deg); + space: lch; + channels: 1% calc(infinity) 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/chroma/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% calc(-infinity) 3deg)); + +<===> unitless/chroma/degenerate/negative_infinity/output.css +a { + value: lch(1% 0 3deg); + space: lch; + channels: 1% 0 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/chroma/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% calc(NaN) 3deg)); + +<===> unitless/chroma/degenerate/nan/output.css +a { + value: lch(1% 0 3deg); + space: lch; + channels: 1% 0 3deg / 1; +} + <===> ================================================================================ <===> unitless/hue/above_range/input.scss @@ -87,6 +165,45 @@ a { channels: 1% 2 359deg / 1; } +<===> +================================================================================ +<===> unitless/hue/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% 2 calc(infinity))); + +<===> unitless/hue/degenerate/positive_infinity/output.css +a { + value: lch(1% 2 calc(NaN * 1deg)); + space: lch; + channels: 1% 2 calc(NaN * 1deg) / 1; +} + +<===> +================================================================================ +<===> unitless/hue/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% 2 calc(-infinity))); + +<===> unitless/hue/degenerate/negative_infinity/output.css +a { + value: lch(1% 2 calc(NaN * 1deg)); + space: lch; + channels: 1% 2 calc(NaN * 1deg) / 1; +} + +<===> +================================================================================ +<===> unitless/hue/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(lch(1% 2 calc(NaN))); + +<===> unitless/hue/degenerate/nan/output.css +a { + value: lch(1% 2 calc(NaN * 1deg)); + space: lch; + channels: 1% 2 calc(NaN * 1deg) / 1; +} + <===> ================================================================================ <===> percent/in_range/input.scss diff --git a/spec/core_functions/color/lighten.hrx b/spec/core_functions/color/lighten.hrx index f84b565f11..39d882a390 100644 --- a/spec/core_functions/color/lighten.hrx +++ b/spec/core_functions/color/lighten.hrx @@ -248,3 +248,16 @@ Error: $amount: Expected 100.001 to be within 0 and 100. | ^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +a {b: lighten(color(srgb 0 0 0), 10%)} + +<===> error/non_legacy/error +Error: lighten() is only supported for legacy colors. Please use color.adjust() instead with an explicit $space argument. + , +1 | a {b: lighten(color(srgb 0 0 0), 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/lightness.hrx b/spec/core_functions/color/lightness.hrx index c2f5fc7f2d..4de9980184 100644 --- a/spec/core_functions/color/lightness.hrx +++ b/spec/core_functions/color/lightness.hrx @@ -157,3 +157,17 @@ Error: $color: 1 is not a color. | ^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.lightness(lch(0% 0 0deg))} + +<===> error/non_legacy/error +Error: color.lightness() is only supported for legacy colors. Please use color.channel() instead with an explicit $space argument. + , +2 | a {b: color.lightness(lch(0% 0 0deg))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/mix/hue_interpolation.hrx b/spec/core_functions/color/mix/hue_interpolation.hrx index df1c19a673..1b5b55bdb7 100644 --- a/spec/core_functions/color/mix/hue_interpolation.hrx +++ b/spec/core_functions/color/mix/hue_interpolation.hrx @@ -1,17 +1,107 @@ -<===> longer/input.scss -a {b: mix(red, green, $method: hsl longer hue)} +<===> default/acute/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 190), $method: oklch)} -<===> longer/output.css +<===> default/acute/output.css a { - b: rgb(0, 0, 191.5); + b: oklch(50% 0.1 110deg); } <===> ================================================================================ -<===> increasing/weighted/input.scss -a {b: mix(red, green, 20%, lch increasing hue)} +<===> default/obtuse/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 230), $method: oklch)} -<===> increasing/weighted/output.css +<===> default/obtuse/output.css a { - b: hsl(78.7622147036, 186.3907911016%, 17.4030704435%); + b: oklch(50% 0.1 310deg); +} + +<===> +================================================================================ +<===> shorter/acute/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 190), $method: oklch shorter hue)} + +<===> shorter/acute/output.css +a { + b: oklch(50% 0.1 110deg); +} + +<===> +================================================================================ +<===> shorter/obtuse/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 230), $method: oklch shorter hue)} + +<===> shorter/obtuse/output.css +a { + b: oklch(50% 0.1 310deg); +} + +<===> +================================================================================ +<===> longer/obtuse/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 230), $method: oklch longer hue)} + +<===> longer/obtuse/output.css +a { + b: oklch(50% 0.1 130deg); +} + +<===> +================================================================================ +<===> increasing/acute/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 190), $method: oklch increasing hue)} + +<===> increasing/acute/output.css +a { + b: oklch(50% 0.1 110deg); +} + +<===> +================================================================================ +<===> increasing/obtuse/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 230), $method: oklch increasing hue)} + +<===> increasing/obtuse/output.css +a { + b: oklch(50% 0.1 130deg); +} + +<===> +================================================================================ +<===> decreasing/acute/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 190), $method: oklch decreasing hue)} + +<===> decreasing/acute/output.css +a { + b: oklch(50% 0.1 290deg); +} + +<===> +================================================================================ +<===> decreasing/obtuse/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 230), $method: oklch decreasing hue)} + +<===> decreasing/obtuse/output.css +a { + b: oklch(50% 0.1 310deg); +} + +<===> +================================================================================ +<===> weighted/input.scss +a {b: mix(red, green, 20%, lch longer hue)} + +<===> weighted/output.css +a { + b: rgb(201.9125152451, 62.5456438786, 25.0531427989); +} + +<===> +================================================================================ +<===> case_insensitive/input.scss +a {b: mix(oklch(0.5 0.1 30), oklch(0.5 0.1 190), $method: oKlCh LONger HUE)} + +<===> case_insensitive/output.css +a { + b: oklch(50% 0.1 290deg); } diff --git a/spec/core_functions/color/mix/missing.hrx b/spec/core_functions/color/mix/missing.hrx new file mode 100644 index 0000000000..e3fd25c166 --- /dev/null +++ b/spec/core_functions/color/mix/missing.hrx @@ -0,0 +1,231 @@ +<===> explicit/same/legacy/color1/input.scss +@use 'sass:color'; +a {b: color.mix(rgb(none 100 200), rgb(200 100 0), $method: rgb)} + +<===> explicit/same/legacy/color1/output.css +a { + b: #c86464; +} + +<===> +================================================================================ +<===> explicit/same/legacy/color2/input.scss +@use 'sass:color'; +a {b: color.mix(rgb(0 100 200), rgb(200 none 0), $method: rgb)} + +<===> explicit/same/legacy/color2/output.css +a { + b: #646464; +} + +<===> +================================================================================ +<===> explicit/same/legacy/both/input.scss +@use 'sass:color'; +a {b: color.mix(rgb(0 none 200), rgb(200 none 0), $method: rgb)} + +<===> explicit/same/legacy/both/output.css +a { + b: rgb(100 none 100); +} + +<===> +================================================================================ +<===> explicit/same/modern/color1/input.scss +@use 'sass:color'; +a { + b: color.mix( + color(srgb none 0.1 0.2), + color(srgb 0.1 0.2 0.3), + $method: srgb + ); +} + +<===> explicit/same/modern/color1/output.css +a { + b: color(srgb 0.1 0.15 0.25); +} + +<===> +================================================================================ +<===> explicit/same/modern/color2/input.scss +@use 'sass:color'; +a { + b: color.mix( + color(srgb 0.1 0.2 0.3), + color(srgb 0.1 none 0.2), + $method: srgb + ); +} + +<===> explicit/same/modern/color2/output.css +a { + b: color(srgb 0.1 0.2 0.25); +} + +<===> +================================================================================ +<===> explicit/same/modern/both/input.scss +@use 'sass:color'; +a { + b: color.mix( + color(srgb 0.1 0.2 none), + color(srgb 0.3 0.2 none), + $method: srgb + ); +} + +<===> explicit/same/modern/both/output.css +a { + b: color(srgb 0.2 0.2 none); +} + +<===> +================================================================================ +<===> explicit/analogous/legacy/color1/input.scss +@use 'sass:color'; +a {b: color.mix(rgb(none 100 200), rgb(200 100 0), $method: rec2020)} + +<===> explicit/analogous/legacy/color1/output.css +a { + b: rgb(199.7671172587, 91.8239078594, 117.7284104313); +} + +<===> +================================================================================ +<===> explicit/analogous/legacy/color2/input.scss +@use 'sass:color'; +a {b: color.mix(rgb(0 100 200), rgb(200 none 0), $method: rec2020)} + +<===> explicit/analogous/legacy/color2/output.css +a { + b: rgb(128.6114294932, 95.678836923, 112.8090426091); +} + +<===> +================================================================================ +<===> explicit/analogous/legacy/both/input.scss +@use 'sass:color'; +a {b: color.mix(rgb(0 none 200), rgb(200 none 0), $method: rec2020)} + +<===> explicit/analogous/legacy/both/output.css +a { + b: rgb(129.0248146672, 0, 115.9531222724); +} + +<===> +================================================================================ +<===> explicit/analogous/modern/color1/input.scss +@use 'sass:color'; +a { + b: color.mix( + color(srgb none 0.1 0.2), + color(srgb 0.1 0.2 0.3), + $method: rec2020 + ); +} + +<===> explicit/analogous/modern/color1/output.css +a { + b: color(srgb 0.146201736 0.1492595622 0.2497768167); +} + +<===> +================================================================================ +<===> explicit/analogous/modern/color2/input.scss +@use 'sass:color'; +a { + b: color.mix( + color(srgb 0.1 0.2 0.3), + color(srgb 0.1 none 0.2), + $method: rec2020 + ); +} + +<===> explicit/analogous/modern/color2/output.css +a { + b: color(srgb 0.0134568276 0.2030946777 0.2456679982); +} + +<===> +================================================================================ +<===> explicit/analogous/modern/both/input.scss +@use 'sass:color'; +a { + b: color.mix( + color(srgb 0.1 0.2 none), + color(srgb 0.3 0.2 none), + $method: rec2020 + ); +} + +<===> explicit/analogous/modern/both/output.css +a { + b: color(srgb 0.2110804397 0.2012136757 none); +} + +<===> +================================================================================ +<===> powerless/legacy/color1/input.scss +@use 'sass:color'; +a {b: color.mix(hsl(0deg 0% 30%), hsl(120deg 50% 50%), $method: lch)} + +<===> powerless/legacy/color1/output.css +a { + b: hsl(113.4583259264, 28.061366187%, 40.5877359835%); +} + +<===> +================================================================================ +<===> powerless/legacy/color2/input.scss +@use 'sass:color'; +a {b: color.mix(hsl(120deg 50% 50%), hsl(0deg 0% 30%), $method: lch)} + +<===> powerless/legacy/color2/output.css +a { + b: hsl(113.4583259264, 28.061366187%, 40.5877359835%); +} + +<===> +================================================================================ +<===> powerless/legacy/both/input.scss +@use 'sass:color'; +a {b: color.mix(hsl(120deg 0% 50%), hsl(0deg 0% 30%), $method: lch)} + +<===> powerless/legacy/both/output.css +a { + b: hsl(0, 0%, 39.7779408276%); +} + +<===> +================================================================================ +<===> powerless/modern/color1/input.scss +@use 'sass:color'; +a {b: color.mix(lch(30% 0% 0deg), lch(50% 10% 120deg), $method: hsl)} + +<===> powerless/modern/color1/output.css +a { + b: lch(39.8551054023% 6.455971398 120.4338354849deg); +} + +<===> +================================================================================ +<===> powerless/modern/color2/input.scss +@use 'sass:color'; +a {b: color.mix(lch(50% 10% 120deg), lch(30% 0% 0deg), $method: hsl)} + +<===> powerless/modern/color2/output.css +a { + b: lch(39.8551054023% 6.455971398 120.4338354849deg); +} + +<===> +================================================================================ +<===> powerless/modern/both/input.scss +@use 'sass:color'; +a {b: color.mix(lch(50% 0% 120deg), lch(30% 0% 0deg), $method: hsl)} + +<===> powerless/modern/both/output.css +a { + b: lch(40.2238896861% 0 none); +} diff --git a/spec/core_functions/color/oklab/alpha.hrx b/spec/core_functions/color/oklab/alpha.hrx index ee7f24dac2..9addc41b23 100644 --- a/spec/core_functions/color/oklab/alpha.hrx +++ b/spec/core_functions/color/oklab/alpha.hrx @@ -48,6 +48,45 @@ a { channels: 1% 2 3 / 0.4; } +<===> +================================================================================ +<===> degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% 2 -3 / calc(infinity))); + +<===> degenerate/positive_infinity/output.css +a { + value: oklab(1% 2 -3); + space: oklab; + channels: 1% 2 -3 / 1; +} + +<===> +================================================================================ +<===> degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% 2 -3 / calc(-infinity))); + +<===> degenerate/negative_infinity/output.css +a { + value: oklab(1% 2 -3 / 0); + space: oklab; + channels: 1% 2 -3 / 0; +} + +<===> +================================================================================ +<===> degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% 2 -3 / calc(NaN))); + +<===> degenerate/nan/output.css +a { + value: oklab(1% 2 -3 / 0); + space: oklab; + channels: 1% 2 -3 / 0; +} + <===> ================================================================================ <===> named/input.scss diff --git a/spec/core_functions/color/oklab/no_alpha.hrx b/spec/core_functions/color/oklab/no_alpha.hrx index 21698a935a..cc39abb303 100644 --- a/spec/core_functions/color/oklab/no_alpha.hrx +++ b/spec/core_functions/color/oklab/no_alpha.hrx @@ -35,6 +35,84 @@ a { channels: 1% -126 -300 / 1; } +<===> +================================================================================ +<===> unitless/a/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% calc(infinity) -300)); + +<===> unitless/a/degenerate/positive_infinity/output.css +a { + value: oklab(1% calc(infinity) -300); + space: oklab; + channels: 1% calc(infinity) -300 / 1; +} + +<===> +================================================================================ +<===> unitless/a/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% calc(-infinity) -300)); + +<===> unitless/a/degenerate/negative_infinity/output.css +a { + value: oklab(1% calc(-infinity) -300); + space: oklab; + channels: 1% calc(-infinity) -300 / 1; +} + +<===> +================================================================================ +<===> unitless/a/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% calc(NaN) -300)); + +<===> unitless/a/degenerate/nan/output.css +a { + value: oklab(1% calc(NaN) -300); + space: oklab; + channels: 1% calc(NaN) -300 / 1; +} + +<===> +================================================================================ +<===> unitless/b/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% 2 calc(infinity))); + +<===> unitless/b/degenerate/positive_infinity/output.css +a { + value: oklab(1% 2 calc(infinity)); + space: oklab; + channels: 1% 2 calc(infinity) / 1; +} + +<===> +================================================================================ +<===> unitless/b/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% 2 calc(-infinity))); + +<===> unitless/b/degenerate/negative_infinity/output.css +a { + value: oklab(1% 2 calc(-infinity)); + space: oklab; + channels: 1% 2 calc(-infinity) / 1; +} + +<===> +================================================================================ +<===> unitless/b/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(1% 2 calc(NaN))); + +<===> unitless/b/degenerate/nan/output.css +a { + value: oklab(1% 2 calc(NaN)); + space: oklab; + channels: 1% 2 calc(NaN) / 1; +} + <===> ================================================================================ <===> unitless/lightness/in_range/input.scss @@ -74,6 +152,45 @@ a { channels: 0% 2 3 / 1; } +<===> +================================================================================ +<===> unitless/lightness/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(calc(infinity) 2 -3)); + +<===> unitless/lightness/degenerate/positive_infinity/output.css +a { + value: oklab(100% 2 -3); + space: oklab; + channels: 100% 2 -3 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(calc(-infinity) 2 -3)); + +<===> unitless/lightness/degenerate/negative_infinity/output.css +a { + value: oklab(0% 2 -3); + space: oklab; + channels: 0% 2 -3 / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklab(calc(NaN) 2 -3)); + +<===> unitless/lightness/degenerate/nan/output.css +a { + value: oklab(0% 2 -3); + space: oklab; + channels: 0% 2 -3 / 1; +} + <===> ================================================================================ <===> percent/ab/in_range/input.scss diff --git a/spec/core_functions/color/oklch/alpha.hrx b/spec/core_functions/color/oklch/alpha.hrx index 8ac85be2fa..7209e0ab8c 100644 --- a/spec/core_functions/color/oklch/alpha.hrx +++ b/spec/core_functions/color/oklch/alpha.hrx @@ -48,6 +48,45 @@ a { channels: 1% 0.2 3deg / 0.4; } +<===> +================================================================================ +<===> degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / calc(infinity))); + +<===> degenerate/positive_infinity/output.css +a { + value: oklch(1% 0.2 3deg); + space: oklch; + channels: 1% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / calc(-infinity))); + +<===> degenerate/negative_infinity/output.css +a { + value: oklch(1% 0.2 3deg / 0); + space: oklch; + channels: 1% 0.2 3deg / 0; +} + +<===> +================================================================================ +<===> degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% 0.2 3deg / calc(NaN))); + +<===> degenerate/nan/output.css +a { + value: oklch(1% 0.2 3deg / 0); + space: oklch; + channels: 1% 0.2 3deg / 0; +} + <===> ================================================================================ <===> named/input.scss diff --git a/spec/core_functions/color/oklch/no_alpha.hrx b/spec/core_functions/color/oklch/no_alpha.hrx index 2c8c27848a..851b8f73eb 100644 --- a/spec/core_functions/color/oklch/no_alpha.hrx +++ b/spec/core_functions/color/oklch/no_alpha.hrx @@ -35,6 +35,45 @@ a { channels: 0% 0.2 3deg / 1; } +<===> +================================================================================ +<===> unitless/lightness/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(calc(infinity) 0.2 3deg)); + +<===> unitless/lightness/degenerate/positive_infinity/output.css +a { + value: oklch(100% 0.2 3deg); + space: oklch; + channels: 100% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(calc(-infinity) 0.2 3deg)); + +<===> unitless/lightness/degenerate/negative_infinity/output.css +a { + value: oklch(0% 0.2 3deg); + space: oklch; + channels: 0% 0.2 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/lightness/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(calc(NaN) 0.2 3deg)); + +<===> unitless/lightness/degenerate/nan/output.css +a { + value: oklch(0% 0.2 3deg); + space: oklch; + channels: 0% 0.2 3deg / 1; +} + <===> ================================================================================ <===> unitless/chroma/above_range/input.scss @@ -61,6 +100,45 @@ a { channels: 1% 0 3deg / 1; } +<===> +================================================================================ +<===> unitless/chroma/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% calc(infinity) 3deg)); + +<===> unitless/chroma/degenerate/positive_infinity/output.css +a { + value: oklch(1% calc(infinity) 3deg); + space: oklch; + channels: 1% calc(infinity) 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/chroma/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% calc(-infinity) 3deg)); + +<===> unitless/chroma/degenerate/negative_infinity/output.css +a { + value: oklch(1% 0 3deg); + space: oklch; + channels: 1% 0 3deg / 1; +} + +<===> +================================================================================ +<===> unitless/chroma/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% calc(NaN) 3deg)); + +<===> unitless/chroma/degenerate/nan/output.css +a { + value: oklch(1% 0 3deg); + space: oklch; + channels: 1% 0 3deg / 1; +} + <===> ================================================================================ <===> unitless/hue/above_range/input.scss @@ -87,6 +165,45 @@ a { channels: 1% 0.2 359deg / 1; } +<===> +================================================================================ +<===> unitless/hue/degenerate/positive_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% 2 calc(infinity))); + +<===> unitless/hue/degenerate/positive_infinity/output.css +a { + value: oklch(1% 2 calc(NaN * 1deg)); + space: oklch; + channels: 1% 2 calc(NaN * 1deg) / 1; +} + +<===> +================================================================================ +<===> unitless/hue/degenerate/negative_infinity/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% 2 calc(-infinity))); + +<===> unitless/hue/degenerate/negative_infinity/output.css +a { + value: oklch(1% 2 calc(NaN * 1deg)); + space: oklch; + channels: 1% 2 calc(NaN * 1deg) / 1; +} + +<===> +================================================================================ +<===> unitless/hue/degenerate/nan/input.scss +@use 'core_functions/color/utils'; +@include utils.inspect(oklch(1% 2 calc(NaN))); + +<===> unitless/hue/degenerate/nan/output.css +a { + value: oklch(1% 2 calc(NaN * 1deg)); + space: oklch; + channels: 1% 2 calc(NaN * 1deg) / 1; +} + <===> ================================================================================ <===> percent/in_range/input.scss diff --git a/spec/core_functions/color/red.hrx b/spec/core_functions/color/red.hrx index b20dfc2006..72ec4515e2 100644 --- a/spec/core_functions/color/red.hrx +++ b/spec/core_functions/color/red.hrx @@ -134,3 +134,17 @@ Error: $color: 1 is not a color. | ^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.red(color(srgb 1 1 1))} + +<===> error/non_legacy/error +Error: color.red() is only supported for legacy colors. Please use color.channel() instead with an explicit $space argument. + , +2 | a {b: color.red(color(srgb 1 1 1))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/rgb/four_args/clamped.hrx b/spec/core_functions/color/rgb/four_args/clamped.hrx index ea4e6788df..d59ef5025e 100644 --- a/spec/core_functions/color/rgb/four_args/clamped.hrx +++ b/spec/core_functions/color/rgb/four_args/clamped.hrx @@ -3,34 +3,124 @@ Channels that are out of bounds are clamped within bounds. <===> ================================================================================ -<===> red/input.scss +<===> red/finite/input.scss a {b: rgb(256, 0, 0, 0.5)} -<===> red/output.css +<===> red/finite/output.css a { b: rgba(255, 0, 0, 0.5); } <===> ================================================================================ -<===> green/input.scss +<===> red/degenerate/positive_infinity/input.scss +a {b: rgb(calc(infinity), 0, 0, 0.5)} + +<===> red/degenerate/positive_infinity/output.css +a { + b: rgba(255, 0, 0, 0.5); +} + +<===> +================================================================================ +<===> red/degenerate/negative_infinity/input.scss +a {b: rgb(calc(-infinity), 0, 0, 0.5)} + +<===> red/degenerate/negative_infinity/output.css +a { + b: rgba(0, 0, 0, 0.5); +} + +<===> +================================================================================ +<===> red/degenerate/nan/input.scss +a {b: rgb(calc(NaN), 0, 0, 0.5)} + +<===> red/degenerate/nan/output.css +a { + b: rgba(0, 0, 0, 0.5); +} + +<===> +================================================================================ +<===> green/finite/input.scss a {b: rgb(0, -1, 0, 0.5)} -<===> green/output.css +<===> green/finite/output.css +a { + b: rgba(0, 0, 0, 0.5); +} + +<===> +================================================================================ +<===> green/degenerate/positive_infinity/input.scss +a {b: rgb(0, calc(infinity), 0, 0.5)} + +<===> green/degenerate/positive_infinity/output.css +a { + b: rgba(0, 255, 0, 0.5); +} + +<===> +================================================================================ +<===> green/degenerate/negative_infinity/input.scss +a {b: rgb(0, calc(-infinity), 0, 0.5)} + +<===> green/degenerate/negative_infinity/output.css +a { + b: rgba(0, 0, 0, 0.5); +} + +<===> +================================================================================ +<===> green/degenerate/nan/input.scss +a {b: rgb(0, calc(NaN), 0, 0.5)} + +<===> green/degenerate/nan/output.css a { b: rgba(0, 0, 0, 0.5); } <===> ================================================================================ -<===> blue/input.scss +<===> blue/finite/input.scss a {b: rgb(0, 0, 9999, 0.5)} -<===> blue/output.css +<===> blue/finite/output.css a { b: rgba(0, 0, 255, 0.5); } +<===> +================================================================================ +<===> blue/degenerate/positive_infinity/input.scss +a {b: rgb(0, 0, calc(infinity), 0.5)} + +<===> blue/degenerate/positive_infinity/output.css +a { + b: rgba(0, 0, 255, 0.5); +} + +<===> +================================================================================ +<===> blue/degenerate/negative_infinity/input.scss +a {b: rgb(0, 0, calc(-infinity), 0.5)} + +<===> blue/degenerate/negative_infinity/output.css +a { + b: rgba(0, 0, 0, 0.5); +} + +<===> +================================================================================ +<===> blue/degenerate/nan/input.scss +a {b: rgb(0, 0, calc(NaN), 0.5)} + +<===> blue/degenerate/nan/output.css +a { + b: rgba(0, 0, 0, 0.5); +} + <===> ================================================================================ <===> alpha/above/input.scss @@ -51,3 +141,32 @@ a { b: rgba(0, 0, 0, 0); } +<===> +================================================================================ +<===> alpha/degenerate/positive_infinity/input.scss +a {b: rgb(0, 0, 0, calc(infinity))} + +<===> alpha/degenerate/positive_infinity/output.css +a { + b: rgb(0, 0, 0); +} + +<===> +================================================================================ +<===> alpha/degenerate/negative_infinity/input.scss +a {b: rgb(0, 0, 0, calc(-infinity))} + +<===> alpha/degenerate/negative_infinity/output.css +a { + b: rgba(0, 0, 0, 0); +} + +<===> +================================================================================ +<===> alpha/degenerate/nan/input.scss +a {b: rgb(0, 0, 0, calc(NaN))} + +<===> alpha/degenerate/nan/output.css +a { + b: rgba(0, 0, 0, 0); +} diff --git a/spec/core_functions/color/saturate.hrx b/spec/core_functions/color/saturate.hrx index 1229cd662c..c5c9cbf8a5 100644 --- a/spec/core_functions/color/saturate.hrx +++ b/spec/core_functions/color/saturate.hrx @@ -334,3 +334,16 @@ Error: $amount: Expected 100.001 to be within 0 and 100. | ^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +a {b: saturate(color(srgb 1 1 1), 10%)} + +<===> error/non_legacy/error +Error: saturate() is only supported for legacy colors. Please use color.adjust() instead with an explicit $space argument. + , +1 | a {b: saturate(color(srgb 1 1 1), 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/color/saturation.hrx b/spec/core_functions/color/saturation.hrx index e1cc6b35ca..b1c4802b47 100644 --- a/spec/core_functions/color/saturation.hrx +++ b/spec/core_functions/color/saturation.hrx @@ -157,3 +157,17 @@ Error: $color: 1 is not a color. | ^^^^^^^^^^^^^ ' input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.saturation(color(srgb 1 1 1))} + +<===> error/non_legacy/error +Error: color.saturation() is only supported for legacy colors. Please use color.channel() instead with an explicit $space argument. + , +2 | a {b: color.saturation(color(srgb 1 1 1))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/error/missing.hrx b/spec/core_functions/color/scale/error/missing.hrx new file mode 100644 index 0000000000..5d964eda3e --- /dev/null +++ b/spec/core_functions/color/scale/error/missing.hrx @@ -0,0 +1,39 @@ +<===> legacy/input.scss +@use 'sass:color'; +a {b: color.scale(rgb(none 0 0), $red: 10%)} + +<===> legacy/error +Error: $red: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: rgb(none 0 0)). + , +2 | a {b: color.scale(rgb(none 0 0), $red: 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> modern/input.scss +@use 'sass:color'; +a {b: color.scale(lab(none 0 0), $lightness: 10%, $space: lab)} + +<===> modern/error +Error: $lightness: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: lab(none 0 0)). + , +2 | a {b: color.scale(lab(none 0 0), $lightness: 10%, $space: lab)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> alpha/input.scss +@use 'sass:color'; +a {b: color.scale(rgb(0 0 0 / none), $alpha: 10%)} + +<===> alpha/error +Error: $alpha: Because the CSS working group is still deciding on the best behavior, Sass doesn't currently support modifying missing channels (color: rgb(0 0 0 / none)). + , +2 | a {b: color.scale(rgb(0 0 0 / none), $alpha: 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet diff --git a/spec/core_functions/color/scale/no_channels.hrx b/spec/core_functions/color/scale/no_channels.hrx index 8758389ad3..52280d0d1c 100644 --- a/spec/core_functions/color/scale/no_channels.hrx +++ b/spec/core_functions/color/scale/no_channels.hrx @@ -17,3 +17,14 @@ a {b: color.scale(oklch(50% 0 0deg), $space: lab)} a { b: oklch(50% 0 none); } + +<===> +================================================================================ +<===> missing/input.scss +@use 'sass:color'; +a {b: color.scale(rgb(none none none))} + +<===> missing/output.css +a { + b: rgb(none none none); +} diff --git a/spec/core_functions/color/scale/space.hrx b/spec/core_functions/color/scale/space.hrx index df196933ad..31dd144ed8 100644 --- a/spec/core_functions/color/scale/space.hrx +++ b/spec/core_functions/color/scale/space.hrx @@ -39,3 +39,102 @@ a {b: color.scale(lab(50% 10 -20), $chroma: 20%, $space: oklch)} a { b: lab(48.9487508713% 24.2085150873 -41.732226413); } + +<===> +================================================================================ +<===> powerless/legacy/input.scss +@use 'sass:color'; +a {b: color.scale(hsl(0deg 0% 50%), $space: lab)} + +<===> powerless/legacy/output.css +a { + b: hsl(0, 0%, 50%); +} + +<===> +================================================================================ +<===> powerless/modern/input.scss +@use 'sass:color'; +a {b: color.scale(oklch(50% 0 0deg), $space: lab)} + +<===> powerless/modern/output.css +a { + b: oklch(50% 0 none); +} + +<===> +================================================================================ +<===> missing/legacy/same/implicit/input.scss +@use 'sass:color'; +a {b: color.scale(rgb(none none none))} + +<===> missing/legacy/same/implicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> missing/legacy/same/explicit/input.scss +@use 'sass:color'; +a {b: color.scale(rgb(none none none), $space: rgb)} + +<===> missing/legacy/same/explicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> missing/legacy/analogous/legacy/input.scss +@use 'sass:color'; +a {b: color.scale(hsl(none 50% 50%), $space: hwb)} + +<===> missing/legacy/analogous/legacy/output.css +a { + b: hsl(0, 50%, 50%); +} + +<===> +================================================================================ +<===> missing/legacy/analogous/modern/input.scss +@use 'sass:color'; +a {b: color.scale(rgb(none none none), $space: display-p3)} + +<===> missing/legacy/analogous/modern/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> missing/modern/same/implicit/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb none none none))} + +<===> missing/modern/same/implicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> missing/modern/same/explicit/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb none none none), $space: srgb)} + +<===> missing/modern/same/explicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> missing/modern/analogous/input.scss +@use 'sass:color'; +a {b: color.scale(color(srgb none none none), $space: display-p3)} + +<===> missing/modern/analogous/output.css +a { + b: color(srgb none none none); +} diff --git a/spec/core_functions/color/to_gamut/space.hrx b/spec/core_functions/color/to_gamut/space.hrx index c10a8170dc..45f7ac5145 100644 --- a/spec/core_functions/color/to_gamut/space.hrx +++ b/spec/core_functions/color/to_gamut/space.hrx @@ -18,6 +18,160 @@ a { b: oklch(60.4068473688% 0.1443906201 242.3895382399deg); } +<===> +================================================================================ +<===> clip/missing/legacy/same/implicit/input.scss +@use 'sass:color'; +a {b: color.to-gamut(rgb(none none none), $method: clip)} + +<===> clip/missing/legacy/same/implicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> clip/missing/legacy/same/explicit/input.scss +@use 'sass:color'; +a {b: color.to-gamut(rgb(none none none), $space: rgb, $method: clip)} + +<===> clip/missing/legacy/same/explicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> clip/missing/legacy/same/with_mapping/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(rgb(none 0 none), $green: 300), + $method: clip + ); +} + +<===> clip/missing/legacy/same/with_mapping/output.css +a { + b: rgb(none 255 none); +} + +<===> +================================================================================ +<===> clip/missing/legacy/analogous/legacy/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hsl(none 50% 50%), $space: hwb, $method: clip)} + +<===> clip/missing/legacy/analogous/legacy/output.css +a { + b: hsl(0, 50%, 50%); +} + +<===> +================================================================================ +<===> clip/missing/legacy/analogous/modern/input.scss +@use 'sass:color'; +a {b: color.to-gamut(rgb(none none none), $space: display-p3, $method: clip)} + +<===> clip/missing/legacy/analogous/modern/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> clip/missing/modern/same/implicit/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb none none none), $method: clip)} + +<===> clip/missing/modern/same/implicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> clip/missing/modern/same/explicit/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb none none none), $space: srgb, $method: clip)} + +<===> clip/missing/modern/same/explicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> clip/missing/modern/same/with_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb none 1.2 none), $method: clip)} + +<===> clip/missing/modern/same/with_mapping/output.css +a { + b: color(srgb none 1 none); +} + +<===> +================================================================================ +<===> clip/missing/modern/analogous/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color(srgb none none none), + $space: display-p3, + $method: clip + ); +} + +<===> clip/missing/modern/analogous/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> clip/powerless/legacy/no_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hsl(0deg 0% 20%), $space: srgb, $method: clip)} + +<===> clip/powerless/legacy/no_mapping/output.css +a { + b: hsl(0, 0%, 20%); +} + +<===> +================================================================================ +<===> clip/powerless/legacy/with_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hsl(0deg 10% 1000%), $space: srgb, $method: clip)} + +<===> clip/powerless/legacy/with_mapping/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> clip/powerless/modern/no_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(oklch(10% 0% 0deg), $space: srgb, $method: clip)} + +<===> clip/powerless/modern/no_mapping/output.css +a { + b: oklch(10% 0 none); +} + +<===> +================================================================================ +<===> clip/powerless/modern/with_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(lch(1000% 10% 0deg), $space: hsl, $method: clip)} + +<===> clip/powerless/modern/with_mapping/output.css +a { + b: lch(100% 0 none); +} + <===> ================================================================================ <===> local_minde/in_gamut/input.scss @@ -61,3 +215,169 @@ a {b: color.to-gamut(oklch(0% 0.13 240deg), $space: rgb, $method: local-minde)} a { b: oklch(0% 0 none); } + +<===> +================================================================================ +<===> local_minde/missing/legacy/same/implicit/input.scss +@use 'sass:color'; +a {b: color.to-gamut(rgb(none none none), $method: local-minde)} + +<===> local_minde/missing/legacy/same/implicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> local_minde/missing/legacy/same/explicit/input.scss +@use 'sass:color'; +a {b: color.to-gamut(rgb(none none none), $space: rgb, $method: local-minde)} + +<===> local_minde/missing/legacy/same/explicit/output.css +a { + b: rgb(none none none); +} + +<===> +================================================================================ +<===> local_minde/missing/legacy/same/with_mapping/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color.change(rgb(none 0 none), $green: 300), + $method: local-minde + ); +} + +<===> local_minde/missing/legacy/same/with_mapping/output.css +a { + b: rgb(220.0210985908, 255, 215.6454599021); +} + +<===> +================================================================================ +<===> local_minde/missing/legacy/analogous/legacy/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hsl(none 50% 50%), $space: hwb, $method: local-minde)} + +<===> local_minde/missing/legacy/analogous/legacy/output.css +a { + b: hsl(0, 50%, 50%); +} + +<===> +================================================================================ +<===> local_minde/missing/legacy/analogous/modern/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + rgb(none none none), + $space: display-p3, + $method: local-minde + ); +} + +<===> local_minde/missing/legacy/analogous/modern/output.css +a { + b: black; +} + +<===> +================================================================================ +<===> local_minde/missing/modern/same/implicit/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb none none none), $method: local-minde)} + +<===> local_minde/missing/modern/same/implicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> local_minde/missing/modern/same/explicit/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color(srgb none none none), + $space: srgb, + $method: local-minde + ); +} + +<===> local_minde/missing/modern/same/explicit/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> local_minde/missing/modern/same/with_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(color(srgb none 1.2 none), $method: local-minde)} + +<===> local_minde/missing/modern/same/with_mapping/output.css +a { + b: color(srgb 0.9249489323 1 0.9135716721); +} + +<===> +================================================================================ +<===> local_minde/missing/modern/analogous/input.scss +@use 'sass:color'; +a { + b: color.to-gamut( + color(srgb none none none), + $space: display-p3, + $method: local-minde + ); +} + +<===> local_minde/missing/modern/analogous/output.css +a { + b: color(srgb none none none); +} + +<===> +================================================================================ +<===> local_minde/powerless/legacy/no_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hsl(0deg 0% 20%), $space: srgb, $method: local-minde)} + +<===> local_minde/powerless/legacy/no_mapping/output.css +a { + b: hsl(0, 0%, 20%); +} + +<===> +================================================================================ +<===> local_minde/powerless/legacy/with_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(hsl(0deg 10% 1000%), $space: srgb, $method: local-minde)} + +<===> local_minde/powerless/legacy/with_mapping/output.css +a { + b: hsl(0, 0%, 100%); +} + +<===> +================================================================================ +<===> local_minde/powerless/modern/no_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(oklch(10% 0% 0deg), $space: srgb, $method: local-minde)} + +<===> local_minde/powerless/modern/no_mapping/output.css +a { + b: oklch(10% 0 none); +} + +<===> +================================================================================ +<===> local_minde/powerless/modern/with_mapping/input.scss +@use 'sass:color'; +a {b: color.to-gamut(lch(1000% 10% 0deg), $space: srgb, $method: local-minde)} + +<===> local_minde/powerless/modern/with_mapping/output.css +a { + b: lch(100% 0 none); +} diff --git a/spec/core_functions/color/whiteness.hrx b/spec/core_functions/color/whiteness.hrx index 0a36e3c608..53788ed4a5 100644 --- a/spec/core_functions/color/whiteness.hrx +++ b/spec/core_functions/color/whiteness.hrx @@ -213,3 +213,17 @@ Error: $color: 1 is not a color. | ^^^^^^^^^^^^^^^^^^ ' input.scss 2:7 root stylesheet + +<===> +================================================================================ +<===> error/non_legacy/input.scss +@use 'sass:color'; +a {b: color.whiteness(color(srgb 1 1 1))} + +<===> error/non_legacy/error +Error: color.whiteness() is only supported for legacy colors. Please use color.channel() instead with an explicit $space argument. + , +2 | a {b: color.whiteness(color(srgb 1 1 1))} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 2:7 root stylesheet From 00338ba08885f48353e98860f661fad7e7e779ba Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Mon, 12 Aug 2024 12:41:14 -0700 Subject: [PATCH 44/45] Coisnstently use double quotes for `@use "sass:color"` This mitigates the merge conflicts with main, where the module system migrator uses double quotes. --- spec/core_functions/color/_utils.scss | 2 +- spec/core_functions/color/adjust/a98_rgb.hrx | 42 +++++------ .../color/adjust/display_p3.hrx | 42 +++++------ .../color/adjust/error/args.hrx | 6 +- .../adjust/error/incompatible_channel.hrx | 6 +- .../color/adjust/error/missing.hrx | 10 +-- .../color/adjust/error/mixed_formats.hrx | 14 ++-- .../color/adjust/error/space.hrx | 4 +- .../color/adjust/error/type.hrx | 24 +++---- .../color/adjust/error/units/a98_rgb.hrx | 6 +- .../color/adjust/error/units/display_p3.hrx | 6 +- .../color/adjust/error/units/hwb.hrx | 8 +-- .../color/adjust/error/units/lab.hrx | 6 +- .../color/adjust/error/units/lch.hrx | 6 +- .../color/adjust/error/units/oklab.hrx | 6 +- .../color/adjust/error/units/oklch.hrx | 6 +- .../color/adjust/error/units/prophoto_rgb.hrx | 6 +- .../color/adjust/error/units/rec2020.hrx | 6 +- .../color/adjust/error/units/srgb.hrx | 6 +- .../color/adjust/error/units/srgb_linear.hrx | 6 +- .../color/adjust/error/units/xyz.hrx | 6 +- .../color/adjust/error/units/xyz_d50.hrx | 6 +- spec/core_functions/color/adjust/hsl.hrx | 64 ++++++++--------- spec/core_functions/color/adjust/hwb.hrx | 38 +++++----- spec/core_functions/color/adjust/lab.hrx | 42 +++++------ spec/core_functions/color/adjust/lch.hrx | 34 ++++----- .../color/adjust/no_channels.hrx | 22 +++--- spec/core_functions/color/adjust/oklab.hrx | 42 +++++------ spec/core_functions/color/adjust/oklch.hrx | 34 ++++----- .../color/adjust/prophoto_rgb.hrx | 42 +++++------ spec/core_functions/color/adjust/rec2020.hrx | 42 +++++------ spec/core_functions/color/adjust/rgb.hrx | 62 ++++++++-------- spec/core_functions/color/adjust/space.hrx | 28 ++++---- spec/core_functions/color/adjust/srgb.hrx | 42 +++++------ .../color/adjust/srgb_linear.hrx | 42 +++++------ spec/core_functions/color/adjust/units.hrx | 26 +++---- spec/core_functions/color/adjust/xyz_d50.hrx | 42 +++++------ spec/core_functions/color/adjust/xyz_d65.hrx | 42 +++++------ spec/core_functions/color/alpha.hrx | 4 +- spec/core_functions/color/blackness.hrx | 22 +++--- spec/core_functions/color/blue.hrx | 2 +- spec/core_functions/color/change/a98_rgb.hrx | 30 ++++---- .../color/change/display_p3.hrx | 30 ++++---- .../color/change/error/args.hrx | 6 +- .../color/change/error/bounds.hrx | 6 +- .../change/error/incompatible_channel.hrx | 6 +- .../color/change/error/mixed_formats.hrx | 12 ++-- .../color/change/error/space.hrx | 4 +- .../color/change/error/type.hrx | 24 +++---- .../color/change/error/units/a98_rgb.hrx | 6 +- .../color/change/error/units/display_p3.hrx | 6 +- .../color/change/error/units/hwb.hrx | 8 +-- .../color/change/error/units/lab.hrx | 6 +- .../color/change/error/units/lch.hrx | 6 +- .../color/change/error/units/oklab.hrx | 6 +- .../color/change/error/units/oklch.hrx | 6 +- .../color/change/error/units/prophoto_rgb.hrx | 6 +- .../color/change/error/units/rec2020.hrx | 6 +- .../color/change/error/units/srgb.hrx | 6 +- .../color/change/error/units/srgb_linear.hrx | 6 +- .../color/change/error/units/xyz.hrx | 6 +- .../color/change/error/units/xyz_d50.hrx | 6 +- spec/core_functions/color/change/hsl.hrx | 72 +++++++++---------- spec/core_functions/color/change/hwb.hrx | 30 ++++---- spec/core_functions/color/change/lab.hrx | 30 ++++---- spec/core_functions/color/change/lch.hrx | 32 ++++----- spec/core_functions/color/change/no_space.hrx | 24 +++---- spec/core_functions/color/change/oklab.hrx | 30 ++++---- spec/core_functions/color/change/oklch.hrx | 32 ++++----- .../color/change/prophoto_rgb.hrx | 30 ++++---- spec/core_functions/color/change/rec2020.hrx | 30 ++++---- spec/core_functions/color/change/rgb.hrx | 44 ++++++------ spec/core_functions/color/change/space.hrx | 42 +++++------ spec/core_functions/color/change/srgb.hrx | 30 ++++---- .../color/change/srgb_linear.hrx | 30 ++++---- spec/core_functions/color/change/xyz.hrx | 30 ++++---- spec/core_functions/color/change/xyz_d50.hrx | 30 ++++---- spec/core_functions/color/channel/a98-rgb.hrx | 6 +- .../color/channel/display-p3.hrx | 6 +- spec/core_functions/color/channel/hsl.hrx | 8 +-- spec/core_functions/color/channel/hwb.hrx | 10 +-- spec/core_functions/color/channel/lab.hrx | 6 +- spec/core_functions/color/channel/lch.hrx | 6 +- spec/core_functions/color/channel/missing.hrx | 2 +- spec/core_functions/color/channel/oklab.hrx | 6 +- spec/core_functions/color/channel/oklch.hrx | 6 +- .../color/channel/positional.hrx | 2 +- .../color/channel/prophoto-rgb.hrx | 6 +- spec/core_functions/color/channel/rec2020.hrx | 6 +- spec/core_functions/color/channel/rgb.hrx | 6 +- .../color/channel/srgb-linear.hrx | 6 +- spec/core_functions/color/channel/srgb.hrx | 6 +- spec/core_functions/color/channel/xyz-d50.hrx | 6 +- spec/core_functions/color/channel/xyz.hrx | 6 +- spec/core_functions/color/complement.hrx | 40 +++++------ spec/core_functions/color/grayscale.hrx | 40 +++++------ spec/core_functions/color/green.hrx | 2 +- spec/core_functions/color/hue.hrx | 2 +- .../color/hwb/error/five_args.hrx | 2 +- .../color/hwb/error/four_args.hrx | 16 ++--- .../color/hwb/error/one_arg.hrx | 30 ++++---- .../color/hwb/error/three_args.hrx | 6 +- .../color/hwb/error/two_args.hrx | 2 +- .../color/hwb/error/zero_args.hrx | 2 +- spec/core_functions/color/hwb/four_args.hrx | 62 ++++++++-------- spec/core_functions/color/hwb/one_arg.hrx | 36 +++++----- .../color/hwb/three_args/bounds.hrx | 32 ++++----- .../color/hwb/three_args/named.hrx | 2 +- .../color/hwb/three_args/units.hrx | 6 +- .../color/hwb/three_args/w3c/_test-hue.scss | 2 +- spec/core_functions/color/invert/alpha.hrx | 2 +- spec/core_functions/color/invert/error.hrx | 22 +++--- spec/core_functions/color/invert/legacy.hrx | 44 ++++++------ spec/core_functions/color/invert/modern.hrx | 26 +++---- spec/core_functions/color/invert/named.hrx | 2 +- spec/core_functions/color/invert/number.hrx | 2 +- spec/core_functions/color/is_missing.hrx | 38 +++++----- .../color/is_powerless/error.hrx | 22 +++--- .../core_functions/color/is_powerless/hsl.hrx | 14 ++-- .../core_functions/color/is_powerless/hwb.hrx | 14 ++-- .../core_functions/color/is_powerless/lab.hrx | 8 +-- .../core_functions/color/is_powerless/lch.hrx | 14 ++-- .../color/is_powerless/named.hrx | 2 +- .../color/is_powerless/oklab.hrx | 8 +-- .../color/is_powerless/oklch.hrx | 14 ++-- .../color/is_powerless/space.hrx | 4 +- spec/core_functions/color/lightness.hrx | 2 +- spec/core_functions/color/mix/missing.hrx | 36 +++++----- spec/core_functions/color/red.hrx | 2 +- spec/core_functions/color/same.hrx | 36 +++++----- spec/core_functions/color/saturate.hrx | 2 +- spec/core_functions/color/saturation.hrx | 2 +- spec/core_functions/color/scale/a98_rgb.hrx | 38 +++++----- .../core_functions/color/scale/display_p3.hrx | 38 +++++----- .../core_functions/color/scale/error/args.hrx | 6 +- .../color/scale/error/bounds.hrx | 8 +-- .../scale/error/incompatible_channel.hrx | 6 +- .../color/scale/error/missing.hrx | 6 +- .../color/scale/error/mixed_formats.hrx | 14 ++-- .../color/scale/error/polar.hrx | 6 +- .../color/scale/error/space.hrx | 4 +- .../core_functions/color/scale/error/type.hrx | 22 +++--- .../color/scale/error/units/a98_rgb.hrx | 12 ++-- .../color/scale/error/units/display_p3.hrx | 12 ++-- .../color/scale/error/units/hsl.hrx | 8 +-- .../color/scale/error/units/hwb.hrx | 8 +-- .../color/scale/error/units/lab.hrx | 12 ++-- .../color/scale/error/units/lch.hrx | 8 +-- .../color/scale/error/units/oklab.hrx | 12 ++-- .../color/scale/error/units/oklch.hrx | 8 +-- .../color/scale/error/units/prophoto_rgb.hrx | 12 ++-- .../color/scale/error/units/rec2020.hrx | 12 ++-- .../color/scale/error/units/rgb.hrx | 12 ++-- .../color/scale/error/units/srgb.hrx | 12 ++-- .../color/scale/error/units/srgb_linear.hrx | 12 ++-- .../color/scale/error/units/xyz_d50.hrx | 12 ++-- .../color/scale/error/units/xyz_d65.hrx | 12 ++-- spec/core_functions/color/scale/hsl.hrx | 28 ++++---- spec/core_functions/color/scale/hwb.hrx | 28 ++++---- spec/core_functions/color/scale/lab.hrx | 38 +++++----- spec/core_functions/color/scale/lch.hrx | 28 ++++---- .../color/scale/no_channels.hrx | 6 +- spec/core_functions/color/scale/no_space.hrx | 14 ++-- spec/core_functions/color/scale/oklab.hrx | 38 +++++----- .../color/scale/out_of_gamut.hrx | 8 +-- .../color/scale/prophoto_rgb.hrx | 38 +++++----- spec/core_functions/color/scale/rec2020.hrx | 38 +++++----- spec/core_functions/color/scale/rgb.hrx | 38 +++++----- spec/core_functions/color/scale/space.hrx | 26 +++---- spec/core_functions/color/scale/srgb.hrx | 38 +++++----- .../color/scale/srgb_linear.hrx | 38 +++++----- spec/core_functions/color/scale/xyz_d50.hrx | 38 +++++----- spec/core_functions/color/scale/xyz_d65.hrx | 38 +++++----- .../core_functions/color/to_gamut/a98_rgb.hrx | 12 ++-- .../color/to_gamut/display_p3.hrx | 12 ++-- spec/core_functions/color/to_gamut/error.hrx | 22 +++--- spec/core_functions/color/to_gamut/hsl.hrx | 12 ++-- spec/core_functions/color/to_gamut/hwb.hrx | 12 ++-- spec/core_functions/color/to_gamut/lab.hrx | 4 +- spec/core_functions/color/to_gamut/lch.hrx | 4 +- spec/core_functions/color/to_gamut/named.hrx | 2 +- spec/core_functions/color/to_gamut/oklab.hrx | 4 +- spec/core_functions/color/to_gamut/oklch.hrx | 4 +- .../color/to_gamut/positional.hrx | 2 +- .../color/to_gamut/prophoto_rgb.hrx | 12 ++-- .../core_functions/color/to_gamut/rec2020.hrx | 12 ++-- spec/core_functions/color/to_gamut/rgb.hrx | 12 ++-- spec/core_functions/color/to_gamut/space.hrx | 64 ++++++++--------- spec/core_functions/color/to_gamut/srgb.hrx | 12 ++-- .../color/to_gamut/srgb_linear.hrx | 12 ++-- spec/core_functions/color/to_gamut/xyz.hrx | 4 +- .../core_functions/color/to_gamut/xyz_d50.hrx | 4 +- .../color/to_space/a98_rgb/a98_rgb.hrx | 10 +-- .../color/to_space/a98_rgb/display_p3.hrx | 22 +++--- .../color/to_space/a98_rgb/hsl.hrx | 22 +++--- .../color/to_space/a98_rgb/hwb.hrx | 22 +++--- .../color/to_space/a98_rgb/lab.hrx | 22 +++--- .../color/to_space/a98_rgb/lch.hrx | 22 +++--- .../color/to_space/a98_rgb/oklab.hrx | 22 +++--- .../color/to_space/a98_rgb/oklch.hrx | 22 +++--- .../color/to_space/a98_rgb/prophoto_rgb.hrx | 22 +++--- .../color/to_space/a98_rgb/rec2020.hrx | 22 +++--- .../color/to_space/a98_rgb/rgb.hrx | 22 +++--- .../color/to_space/a98_rgb/srgb.hrx | 22 +++--- .../color/to_space/a98_rgb/srgb_linear.hrx | 22 +++--- .../color/to_space/a98_rgb/xyz.hrx | 22 +++--- .../color/to_space/a98_rgb/xyz_d50.hrx | 22 +++--- .../color/to_space/display_p3/a98_rgb.hrx | 22 +++--- .../color/to_space/display_p3/display_p3.hrx | 10 +-- .../color/to_space/display_p3/hsl.hrx | 22 +++--- .../color/to_space/display_p3/hwb.hrx | 22 +++--- .../color/to_space/display_p3/lab.hrx | 22 +++--- .../color/to_space/display_p3/lch.hrx | 22 +++--- .../color/to_space/display_p3/oklab.hrx | 22 +++--- .../color/to_space/display_p3/oklch.hrx | 22 +++--- .../to_space/display_p3/prophoto_rgb.hrx | 22 +++--- .../color/to_space/display_p3/rec2020.hrx | 22 +++--- .../color/to_space/display_p3/rgb.hrx | 22 +++--- .../color/to_space/display_p3/srgb.hrx | 22 +++--- .../color/to_space/display_p3/srgb_linear.hrx | 22 +++--- .../color/to_space/display_p3/xyz.hrx | 22 +++--- .../color/to_space/display_p3/xyz_d50.hrx | 22 +++--- spec/core_functions/color/to_space/error.hrx | 12 ++-- .../color/to_space/hsl/a98_rgb.hrx | 24 +++---- .../color/to_space/hsl/display_p3.hrx | 24 +++---- .../core_functions/color/to_space/hsl/hsl.hrx | 10 +-- .../core_functions/color/to_space/hsl/hwb.hrx | 24 +++---- .../core_functions/color/to_space/hsl/lab.hrx | 24 +++---- .../core_functions/color/to_space/hsl/lch.hrx | 24 +++---- .../color/to_space/hsl/oklab.hrx | 24 +++---- .../color/to_space/hsl/oklch.hrx | 24 +++---- .../color/to_space/hsl/prophoto_rgb.hrx | 24 +++---- .../color/to_space/hsl/rec2020.hrx | 24 +++---- .../core_functions/color/to_space/hsl/rgb.hrx | 24 +++---- .../color/to_space/hsl/srgb.hrx | 24 +++---- .../color/to_space/hsl/srgb_linear.hrx | 24 +++---- .../core_functions/color/to_space/hsl/xyz.hrx | 24 +++---- .../color/to_space/hsl/xyz_d50.hrx | 24 +++---- .../color/to_space/hwb/a98_rgb.hrx | 24 +++---- .../color/to_space/hwb/display_p3.hrx | 24 +++---- .../core_functions/color/to_space/hwb/hsl.hrx | 24 +++---- .../core_functions/color/to_space/hwb/hwb.hrx | 10 +-- .../core_functions/color/to_space/hwb/lab.hrx | 24 +++---- .../core_functions/color/to_space/hwb/lch.hrx | 24 +++---- .../color/to_space/hwb/oklab.hrx | 24 +++---- .../color/to_space/hwb/oklch.hrx | 24 +++---- .../color/to_space/hwb/prophoto_rgb.hrx | 24 +++---- .../color/to_space/hwb/rec2020.hrx | 24 +++---- .../core_functions/color/to_space/hwb/rgb.hrx | 24 +++---- .../color/to_space/hwb/srgb.hrx | 24 +++---- .../color/to_space/hwb/srgb_linear.hrx | 24 +++---- .../core_functions/color/to_space/hwb/xyz.hrx | 24 +++---- .../color/to_space/hwb/xyz_d50.hrx | 24 +++---- .../color/to_space/lab/a98_rgb.hrx | 22 +++--- .../color/to_space/lab/display_p3.hrx | 22 +++--- .../core_functions/color/to_space/lab/hsl.hrx | 22 +++--- .../core_functions/color/to_space/lab/hwb.hrx | 22 +++--- .../core_functions/color/to_space/lab/lab.hrx | 10 +-- .../core_functions/color/to_space/lab/lch.hrx | 22 +++--- .../color/to_space/lab/oklab.hrx | 22 +++--- .../color/to_space/lab/oklch.hrx | 22 +++--- .../color/to_space/lab/prophoto_rgb.hrx | 22 +++--- .../color/to_space/lab/rec2020.hrx | 22 +++--- .../core_functions/color/to_space/lab/rgb.hrx | 22 +++--- .../color/to_space/lab/srgb.hrx | 22 +++--- .../color/to_space/lab/srgb_linear.hrx | 22 +++--- .../core_functions/color/to_space/lab/xyz.hrx | 22 +++--- .../color/to_space/lab/xyz_d50.hrx | 22 +++--- .../color/to_space/lch/a98_rgb.hrx | 24 +++---- .../color/to_space/lch/display_p3.hrx | 24 +++---- .../core_functions/color/to_space/lch/hsl.hrx | 24 +++---- .../core_functions/color/to_space/lch/hwb.hrx | 24 +++---- .../core_functions/color/to_space/lch/lab.hrx | 24 +++---- .../core_functions/color/to_space/lch/lch.hrx | 10 +-- .../color/to_space/lch/oklab.hrx | 24 +++---- .../color/to_space/lch/oklch.hrx | 24 +++---- .../color/to_space/lch/prophoto_rgb.hrx | 24 +++---- .../color/to_space/lch/rec2020.hrx | 24 +++---- .../core_functions/color/to_space/lch/rgb.hrx | 24 +++---- .../color/to_space/lch/srgb.hrx | 24 +++---- .../color/to_space/lch/srgb_linear.hrx | 24 +++---- .../core_functions/color/to_space/lch/xyz.hrx | 24 +++---- .../color/to_space/lch/xyz_d50.hrx | 24 +++---- .../color/to_space/oklab/a98_rgb.hrx | 22 +++--- .../color/to_space/oklab/display_p3.hrx | 22 +++--- .../color/to_space/oklab/hsl.hrx | 22 +++--- .../color/to_space/oklab/hwb.hrx | 22 +++--- .../color/to_space/oklab/lab.hrx | 22 +++--- .../color/to_space/oklab/lch.hrx | 22 +++--- .../color/to_space/oklab/oklab.hrx | 10 +-- .../color/to_space/oklab/oklch.hrx | 22 +++--- .../color/to_space/oklab/prophoto_rgb.hrx | 22 +++--- .../color/to_space/oklab/rec2020.hrx | 22 +++--- .../color/to_space/oklab/rgb.hrx | 22 +++--- .../color/to_space/oklab/srgb.hrx | 22 +++--- .../color/to_space/oklab/srgb_linear.hrx | 22 +++--- .../color/to_space/oklab/xyz.hrx | 22 +++--- .../color/to_space/oklab/xyz_d50.hrx | 22 +++--- .../color/to_space/oklch/a98_rgb.hrx | 24 +++---- .../color/to_space/oklch/display_p3.hrx | 24 +++---- .../color/to_space/oklch/hsl.hrx | 24 +++---- .../color/to_space/oklch/hwb.hrx | 24 +++---- .../color/to_space/oklch/lab.hrx | 24 +++---- .../color/to_space/oklch/lch.hrx | 24 +++---- .../color/to_space/oklch/oklab.hrx | 24 +++---- .../color/to_space/oklch/oklch.hrx | 10 +-- .../color/to_space/oklch/prophoto_rgb.hrx | 24 +++---- .../color/to_space/oklch/rec2020.hrx | 24 +++---- .../color/to_space/oklch/rgb.hrx | 24 +++---- .../color/to_space/oklch/srgb.hrx | 24 +++---- .../color/to_space/oklch/srgb_linear.hrx | 24 +++---- .../color/to_space/oklch/xyz.hrx | 24 +++---- .../color/to_space/oklch/xyz_d50.hrx | 24 +++---- .../color/to_space/prophoto_rgb/a98_rgb.hrx | 22 +++--- .../to_space/prophoto_rgb/display_p3.hrx | 22 +++--- .../color/to_space/prophoto_rgb/hsl.hrx | 22 +++--- .../color/to_space/prophoto_rgb/hwb.hrx | 22 +++--- .../color/to_space/prophoto_rgb/lab.hrx | 22 +++--- .../color/to_space/prophoto_rgb/lch.hrx | 22 +++--- .../color/to_space/prophoto_rgb/oklab.hrx | 22 +++--- .../color/to_space/prophoto_rgb/oklch.hrx | 22 +++--- .../to_space/prophoto_rgb/prophoto_rgb.hrx | 10 +-- .../color/to_space/prophoto_rgb/rec2020.hrx | 22 +++--- .../color/to_space/prophoto_rgb/rgb.hrx | 22 +++--- .../color/to_space/prophoto_rgb/srgb.hrx | 22 +++--- .../to_space/prophoto_rgb/srgb_linear.hrx | 22 +++--- .../color/to_space/prophoto_rgb/xyz.hrx | 22 +++--- .../color/to_space/prophoto_rgb/xyz_d50.hrx | 22 +++--- .../color/to_space/rec2020/a98_rgb.hrx | 22 +++--- .../color/to_space/rec2020/display_p3.hrx | 22 +++--- .../color/to_space/rec2020/hsl.hrx | 22 +++--- .../color/to_space/rec2020/hwb.hrx | 22 +++--- .../color/to_space/rec2020/lab.hrx | 22 +++--- .../color/to_space/rec2020/lch.hrx | 22 +++--- .../color/to_space/rec2020/oklab.hrx | 22 +++--- .../color/to_space/rec2020/oklch.hrx | 22 +++--- .../color/to_space/rec2020/prophoto_rgb.hrx | 22 +++--- .../color/to_space/rec2020/rec2020.hrx | 10 +-- .../color/to_space/rec2020/rgb.hrx | 22 +++--- .../color/to_space/rec2020/srgb.hrx | 22 +++--- .../color/to_space/rec2020/srgb_linear.hrx | 22 +++--- .../color/to_space/rec2020/xyz.hrx | 22 +++--- .../color/to_space/rec2020/xyz_d50.hrx | 22 +++--- .../color/to_space/rgb/a98_rgb.hrx | 24 +++---- .../color/to_space/rgb/display_p3.hrx | 24 +++---- .../core_functions/color/to_space/rgb/hsl.hrx | 24 +++---- .../core_functions/color/to_space/rgb/hwb.hrx | 24 +++---- .../core_functions/color/to_space/rgb/lab.hrx | 24 +++---- .../core_functions/color/to_space/rgb/lch.hrx | 24 +++---- .../color/to_space/rgb/oklab.hrx | 24 +++---- .../color/to_space/rgb/oklch.hrx | 24 +++---- .../color/to_space/rgb/prophoto_rgb.hrx | 24 +++---- .../color/to_space/rgb/rec2020.hrx | 24 +++---- .../core_functions/color/to_space/rgb/rgb.hrx | 10 +-- .../color/to_space/rgb/srgb.hrx | 24 +++---- .../color/to_space/rgb/srgb_linear.hrx | 24 +++---- .../core_functions/color/to_space/rgb/xyz.hrx | 24 +++---- .../color/to_space/rgb/xyz_d50.hrx | 24 +++---- .../color/to_space/srgb/a98_rgb.hrx | 22 +++--- .../color/to_space/srgb/display_p3.hrx | 22 +++--- .../color/to_space/srgb/hsl.hrx | 22 +++--- .../color/to_space/srgb/hwb.hrx | 22 +++--- .../color/to_space/srgb/lab.hrx | 22 +++--- .../color/to_space/srgb/lch.hrx | 22 +++--- .../color/to_space/srgb/oklab.hrx | 22 +++--- .../color/to_space/srgb/oklch.hrx | 22 +++--- .../color/to_space/srgb/prophoto_rgb.hrx | 22 +++--- .../color/to_space/srgb/rec2020.hrx | 22 +++--- .../color/to_space/srgb/rgb.hrx | 22 +++--- .../color/to_space/srgb/srgb.hrx | 10 +-- .../color/to_space/srgb/srgb_linear.hrx | 22 +++--- .../color/to_space/srgb/xyz.hrx | 22 +++--- .../color/to_space/srgb/xyz_d50.hrx | 22 +++--- .../color/to_space/srgb_linear/a98_rgb.hrx | 22 +++--- .../color/to_space/srgb_linear/display_p3.hrx | 22 +++--- .../color/to_space/srgb_linear/hsl.hrx | 22 +++--- .../color/to_space/srgb_linear/hwb.hrx | 22 +++--- .../color/to_space/srgb_linear/lab.hrx | 22 +++--- .../color/to_space/srgb_linear/lch.hrx | 22 +++--- .../color/to_space/srgb_linear/oklab.hrx | 22 +++--- .../color/to_space/srgb_linear/oklch.hrx | 22 +++--- .../to_space/srgb_linear/prophoto_rgb.hrx | 22 +++--- .../color/to_space/srgb_linear/rec2020.hrx | 22 +++--- .../color/to_space/srgb_linear/rgb.hrx | 22 +++--- .../color/to_space/srgb_linear/srgb.hrx | 22 +++--- .../to_space/srgb_linear/srgb_linear.hrx | 10 +-- .../color/to_space/srgb_linear/xyz.hrx | 22 +++--- .../color/to_space/srgb_linear/xyz_d50.hrx | 22 +++--- .../color/to_space/xyz/a98_rgb.hrx | 22 +++--- .../color/to_space/xyz/display_p3.hrx | 22 +++--- .../core_functions/color/to_space/xyz/hsl.hrx | 22 +++--- .../core_functions/color/to_space/xyz/hwb.hrx | 22 +++--- .../core_functions/color/to_space/xyz/lab.hrx | 22 +++--- .../core_functions/color/to_space/xyz/lch.hrx | 22 +++--- .../color/to_space/xyz/oklab.hrx | 22 +++--- .../color/to_space/xyz/oklch.hrx | 22 +++--- .../color/to_space/xyz/prophoto_rgb.hrx | 22 +++--- .../color/to_space/xyz/rec2020.hrx | 22 +++--- .../core_functions/color/to_space/xyz/rgb.hrx | 22 +++--- .../color/to_space/xyz/srgb.hrx | 22 +++--- .../color/to_space/xyz/srgb_linear.hrx | 22 +++--- .../core_functions/color/to_space/xyz/xyz.hrx | 10 +-- .../color/to_space/xyz/xyz_d50.hrx | 22 +++--- .../to_space/xyz_d50/xyz-d50/a98_rgb.hrx | 10 +-- .../to_space/xyz_d50/xyz-d50/display_p3.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/hsl.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/hwb.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/lab.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/lch.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/oklab.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/oklch.hrx | 22 +++--- .../to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx | 22 +++--- .../to_space/xyz_d50/xyz-d50/rec2020.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/rgb.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/srgb.hrx | 22 +++--- .../to_space/xyz_d50/xyz-d50/srgb_linear.hrx | 22 +++--- .../color/to_space/xyz_d50/xyz-d50/xyz.hrx | 22 +++--- .../to_space/xyz_d50/xyz-d50/xyz_d50.hrx | 22 +++--- spec/core_functions/color/whiteness.hrx | 22 +++--- 419 files changed, 4136 insertions(+), 4136 deletions(-) diff --git a/spec/core_functions/color/_utils.scss b/spec/core_functions/color/_utils.scss index 375c314cf7..95eff4c8a1 100644 --- a/spec/core_functions/color/_utils.scss +++ b/spec/core_functions/color/_utils.scss @@ -1,4 +1,4 @@ -@use 'sass:color'; +@use "sass:color"; @use 'sass:list'; @use 'sass:meta'; diff --git a/spec/core_functions/color/adjust/a98_rgb.hrx b/spec/core_functions/color/adjust/a98_rgb.hrx index a1579e1742..2828f551de 100644 --- a/spec/core_functions/color/adjust/a98_rgb.hrx +++ b/spec/core_functions/color/adjust/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: -10%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.9)} <===> red/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: -0.3)} <===> red/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 1.9)} <===> red/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> red/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: -1.3)} <===> red/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: -0.3)} <===> green/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 0.7)} <===> green/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: -0.8)} <===> green/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> green/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 1.7)} <===> green/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> green/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: -1.8)} <===> green/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: -0.3)} <===> blue/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 20%)} <===> blue/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 0.7)} <===> blue/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> blue/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: -0.8)} <===> blue/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> blue/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 1.7)} <===> blue/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> blue/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: -1.8)} <===> blue/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/display_p3.hrx b/spec/core_functions/color/adjust/display_p3.hrx index 417f5707ec..eeef7b1c27 100644 --- a/spec/core_functions/color/adjust/display_p3.hrx +++ b/spec/core_functions/color/adjust/display_p3.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: -10%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.9)} <===> red/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: -0.3)} <===> red/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 1.9)} <===> red/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> red/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: -1.3)} <===> red/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: -0.3)} <===> green/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 0.7)} <===> green/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: -0.8)} <===> green/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> green/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 1.7)} <===> green/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> green/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: -1.8)} <===> green/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: -0.3)} <===> blue/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 20%)} <===> blue/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 0.7)} <===> blue/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> blue/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: -0.8)} <===> blue/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> blue/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 1.7)} <===> blue/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> blue/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: -1.8)} <===> blue/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/error/args.hrx b/spec/core_functions/color/adjust/error/args.hrx index 58b6aee6f6..62b4fa08ad 100644 --- a/spec/core_functions/color/adjust/error/args.hrx +++ b/spec/core_functions/color/adjust/error/args.hrx @@ -1,5 +1,5 @@ <===> too_few/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust()} <===> too_few/error @@ -17,7 +17,7 @@ Error: Missing argument $color. <===> ================================================================================ <===> too_many/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, 1)} <===> too_many/error @@ -31,7 +31,7 @@ Error: Only one positional argument is allowed. All other arguments must be pass <===> ================================================================================ <===> unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $ambience: 10%)} <===> unknown/error diff --git a/spec/core_functions/color/adjust/error/incompatible_channel.hrx b/spec/core_functions/color/adjust/error/incompatible_channel.hrx index e066559495..a6a8e26742 100644 --- a/spec/core_functions/color/adjust/error/incompatible_channel.hrx +++ b/spec/core_functions/color/adjust/error/incompatible_channel.hrx @@ -1,5 +1,5 @@ <===> legacy_space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $chroma: 50%)} <===> legacy_space/error @@ -13,7 +13,7 @@ Error: $chroma: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> legacy_channel/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} <===> legacy_channel/error @@ -27,7 +27,7 @@ Error: $whiteness: Color space srgb doesn't have a channel with this name. <===> ================================================================================ <===> modern_both/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $chroma: 50%)} <===> modern_both/error diff --git a/spec/core_functions/color/adjust/error/missing.hrx b/spec/core_functions/color/adjust/error/missing.hrx index d161d5ab9e..62832fbcb7 100644 --- a/spec/core_functions/color/adjust/error/missing.hrx +++ b/spec/core_functions/color/adjust/error/missing.hrx @@ -1,5 +1,5 @@ <===> legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgb(none 0 0), $red: 10)} <===> legacy/error @@ -13,7 +13,7 @@ Error: $red: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(none 0 0), $lightness: 10%)} <===> modern/error @@ -27,7 +27,7 @@ Error: $lightness: Because the CSS working group is still deciding on the best b <===> ================================================================================ <===> powerless/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(grey, $hue: 10deg, $space: hsl)} <===> powerless/legacy/error @@ -41,7 +41,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> powerless/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(grey, $hue: 10deg, $space: lch)} <===> powerless/modern/error @@ -55,7 +55,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgb(0 0 0 / none), $alpha: 0.1)} <===> alpha/error diff --git a/spec/core_functions/color/adjust/error/mixed_formats.hrx b/spec/core_functions/color/adjust/error/mixed_formats.hrx index 9860d05cf1..1eb3a9caa8 100644 --- a/spec/core_functions/color/adjust/error/mixed_formats.hrx +++ b/spec/core_functions/color/adjust/error/mixed_formats.hrx @@ -1,5 +1,5 @@ <===> red_and_hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $red: 1, $hue: 1)} <===> red_and_hue/error @@ -13,7 +13,7 @@ Error: $hue: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> green_and_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $green: 1, $saturation: 1%)} <===> green_and_saturation/error @@ -27,7 +27,7 @@ Error: $saturation: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> blue_and_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $blue: 1, $lightness: 1%)} <===> blue_and_lightness/error @@ -41,7 +41,7 @@ Error: $lightness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> red_and_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $red: 1, $blackness: 1%)} <===> red_and_blackness/error @@ -55,7 +55,7 @@ Error: $blackness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> green_and_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $green: 1, $whiteness: 1%)} <===> green_and_whiteness/error @@ -69,7 +69,7 @@ Error: $whiteness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> saturation_and_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error @@ -83,7 +83,7 @@ Error: $blackness: Color space hsl doesn't have a channel with this name. <===> ================================================================================ <===> lightness_and_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error diff --git a/spec/core_functions/color/adjust/error/space.hrx b/spec/core_functions/color/adjust/error/space.hrx index b8bb10afd0..9741f4e26e 100644 --- a/spec/core_functions/color/adjust/error/space.hrx +++ b/spec/core_functions/color/adjust/error/space.hrx @@ -1,5 +1,5 @@ <===> unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $space: c)} <===> unknown/error @@ -13,7 +13,7 @@ Error: $space: Unknown color space "c". <===> ================================================================================ <===> quoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $space: "lab")} <===> quoted/error diff --git a/spec/core_functions/color/adjust/error/type.hrx b/spec/core_functions/color/adjust/error/type.hrx index 045e6a451c..ff2fd2e4e5 100644 --- a/spec/core_functions/color/adjust/error/type.hrx +++ b/spec/core_functions/color/adjust/error/type.hrx @@ -1,5 +1,5 @@ <===> color/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(1)} <===> color/error @@ -13,7 +13,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $red: c)} <===> red/error @@ -27,7 +27,7 @@ Error: $red: c is not a number. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $green: c)} <===> green/error @@ -41,7 +41,7 @@ Error: $green: c is not a number. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $blue: c)} <===> blue/error @@ -55,7 +55,7 @@ Error: $blue: c is not a number. <===> ================================================================================ <===> hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: c)} <===> hue/error @@ -69,7 +69,7 @@ Error: $hue: c is not a number. <===> ================================================================================ <===> saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $saturation: c)} <===> saturation/error @@ -83,7 +83,7 @@ Error: $saturation: c is not a number. <===> ================================================================================ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: c)} <===> lightness/error @@ -97,7 +97,7 @@ Error: $lightness: c is not a number. <===> ================================================================================ <===> alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $alpha: c)} <===> alpha/error @@ -111,7 +111,7 @@ Error: $alpha: c is not a number. <===> ================================================================================ <===> none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $alpha: none)} <===> none/error @@ -125,7 +125,7 @@ Error: $alpha: none is not a number. <===> ================================================================================ <===> blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $blackness: c)} <===> blackness/error @@ -139,7 +139,7 @@ Error: $blackness: c is not a number. <===> ================================================================================ <===> whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $whiteness: c)} <===> whiteness/error @@ -153,7 +153,7 @@ Error: $whiteness: c is not a number. <===> ================================================================================ <===> space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $space: 1)} <===> space/error diff --git a/spec/core_functions/color/adjust/error/units/a98_rgb.hrx b/spec/core_functions/color/adjust/error/units/a98_rgb.hrx index 5dc0e9927a..aac8d46368 100644 --- a/spec/core_functions/color/adjust/error/units/a98_rgb.hrx +++ b/spec/core_functions/color/adjust/error/units/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(a98-rgb 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/adjust/error/units/display_p3.hrx b/spec/core_functions/color/adjust/error/units/display_p3.hrx index 5233b1950c..1038ec13fe 100644 --- a/spec/core_functions/color/adjust/error/units/display_p3.hrx +++ b/spec/core_functions/color/adjust/error/units/display_p3.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(display-p3 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/adjust/error/units/hwb.hrx b/spec/core_functions/color/adjust/error/units/hwb.hrx index 13a4f62f08..1a9edfbae2 100644 --- a/spec/core_functions/color/adjust/error/units/hwb.hrx +++ b/spec/core_functions/color/adjust/error/units/hwb.hrx @@ -1,5 +1,5 @@ <===> none/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(white, $whiteness: 1)} <===> none/whiteness/error @@ -13,7 +13,7 @@ Error: $whiteness: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $blackness: 1)} <===> none/blackness/error @@ -27,7 +27,7 @@ Error: $blackness: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(white, $whiteness: 1px)} <===> wrong/whiteness/error @@ -41,7 +41,7 @@ Error: $whiteness: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $blackness: 1px)} <===> wrong/blackness/error diff --git a/spec/core_functions/color/adjust/error/units/lab.hrx b/spec/core_functions/color/adjust/error/units/lab.hrx index b178fd4315..7fee8a45f9 100644 --- a/spec/core_functions/color/adjust/error/units/lab.hrx +++ b/spec/core_functions/color/adjust/error/units/lab.hrx @@ -1,5 +1,5 @@ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(50% 30 -50), $lightness: 30px)} <===> lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 30px to have unit "%" or no units. <===> ================================================================================ <===> a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(50% 30 -50), $a: 20px)} <===> a/error @@ -27,7 +27,7 @@ Error: $a: Expected 20px to have unit "%" or no units. <===> ================================================================================ <===> b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(50% 30 -50), $b: 20px)} <===> b/error diff --git a/spec/core_functions/color/adjust/error/units/lch.hrx b/spec/core_functions/color/adjust/error/units/lch.hrx index 1bfbd106ec..d489267595 100644 --- a/spec/core_functions/color/adjust/error/units/lch.hrx +++ b/spec/core_functions/color/adjust/error/units/lch.hrx @@ -1,5 +1,5 @@ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(50% 30 50deg), $lightness: 30px)} <===> lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 30px to have unit "%" or no units. <===> ================================================================================ <===> chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(50% 30 50deg), $chroma: 20px)} <===> chroma/error @@ -27,7 +27,7 @@ Error: $chroma: Expected 20px to have unit "%" or no units. <===> ================================================================================ <===> hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(50% 30 50deg), $hue: 20%)} <===> hue/error diff --git a/spec/core_functions/color/adjust/error/units/oklab.hrx b/spec/core_functions/color/adjust/error/units/oklab.hrx index 01f20c5a4e..825f8e4149 100644 --- a/spec/core_functions/color/adjust/error/units/oklab.hrx +++ b/spec/core_functions/color/adjust/error/units/oklab.hrx @@ -1,5 +1,5 @@ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(50% 0.2 -0.3), $lightness: 0.3px)} <===> lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 0.3px to have unit "%" or no units. <===> ================================================================================ <===> a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(50% 0.2 -0.3), $a: 0.2px)} <===> a/error @@ -27,7 +27,7 @@ Error: $a: Expected 0.2px to have unit "%" or no units. <===> ================================================================================ <===> b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(50% 0.2 -0.3), $b: 0.2px)} <===> b/error diff --git a/spec/core_functions/color/adjust/error/units/oklch.hrx b/spec/core_functions/color/adjust/error/units/oklch.hrx index 49aa5e6dda..839c0b48ad 100644 --- a/spec/core_functions/color/adjust/error/units/oklch.hrx +++ b/spec/core_functions/color/adjust/error/units/oklch.hrx @@ -1,5 +1,5 @@ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(50% 0.3 50deg), $lightness: 30px)} <===> lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 30px to have unit "%" or no units. <===> ================================================================================ <===> chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(50% 0.3 50deg), $chroma: 0.2px)} <===> chroma/error @@ -27,7 +27,7 @@ Error: $chroma: Expected 0.2px to have unit "%" or no units. <===> ================================================================================ <===> hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(50% 0.3 50deg), $hue: 20%)} <===> hue/error diff --git a/spec/core_functions/color/adjust/error/units/prophoto_rgb.hrx b/spec/core_functions/color/adjust/error/units/prophoto_rgb.hrx index 5d0fdff11b..3f5ba2e740 100644 --- a/spec/core_functions/color/adjust/error/units/prophoto_rgb.hrx +++ b/spec/core_functions/color/adjust/error/units/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/adjust/error/units/rec2020.hrx b/spec/core_functions/color/adjust/error/units/rec2020.hrx index 54f219416d..10ef7739aa 100644 --- a/spec/core_functions/color/adjust/error/units/rec2020.hrx +++ b/spec/core_functions/color/adjust/error/units/rec2020.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/adjust/error/units/srgb.hrx b/spec/core_functions/color/adjust/error/units/srgb.hrx index 733226d1a8..66e456e932 100644 --- a/spec/core_functions/color/adjust/error/units/srgb.hrx +++ b/spec/core_functions/color/adjust/error/units/srgb.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/adjust/error/units/srgb_linear.hrx b/spec/core_functions/color/adjust/error/units/srgb_linear.hrx index 2cd639e34c..ff821c6a18 100644 --- a/spec/core_functions/color/adjust/error/units/srgb_linear.hrx +++ b/spec/core_functions/color/adjust/error/units/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/adjust/error/units/xyz.hrx b/spec/core_functions/color/adjust/error/units/xyz.hrx index c75280ea3b..488f1a44e0 100644 --- a/spec/core_functions/color/adjust/error/units/xyz.hrx +++ b/spec/core_functions/color/adjust/error/units/xyz.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz 0.2 0.5 0.7), $x: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $x: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz 0.2 0.5 0.7), $y: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $y: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz 0.2 0.5 0.7), $z: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/adjust/error/units/xyz_d50.hrx b/spec/core_functions/color/adjust/error/units/xyz_d50.hrx index 462eb76398..dfee678cef 100644 --- a/spec/core_functions/color/adjust/error/units/xyz_d50.hrx +++ b/spec/core_functions/color/adjust/error/units/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $x: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $y: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/adjust/hsl.hrx b/spec/core_functions/color/adjust/hsl.hrx index 06763c4ef0..39acc1d980 100644 --- a/spec/core_functions/color/adjust/hsl.hrx +++ b/spec/core_functions/color/adjust/hsl.hrx @@ -1,5 +1,5 @@ <===> hue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 359)} <===> hue/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 540)} <===> hue/arg_above_max/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(blue, $hue: 0)} <===> hue/min/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> hue/negative/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: -180)} <===> hue/negative/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> hue/middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 123)} <===> hue/middle/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> hue/fraction/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 0.5)} <===> hue/fraction/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> saturation/max_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: 53%)} <===> saturation/max_remaining/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> saturation/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: 0%)} <===> saturation/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> saturation/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: -100%)} <===> saturation/min/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> saturation/min_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: -48%)} <===> saturation/min_remaining/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> saturation/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: 14%)} <===> saturation/high/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> saturation/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: -14%)} <===> saturation/low/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> saturation/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: 100%)} <===> saturation/above_max/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> saturation/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: -100%)} <===> saturation/below_min/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> saturation/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: 200%)} <===> saturation/arg_above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> saturation/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $saturation: -200%)} <===> saturation/arg_below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> lightness/max_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 50%)} <===> lightness/max_remaining/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> lightness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 0%)} <===> lightness/zero/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> lightness/fraction/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 0.5%)} <===> lightness/fraction/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> lightness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: -100%)} <===> lightness/min/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> lightness/min_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: -50%)} <===> lightness/min_remaining/output.css @@ -230,7 +230,7 @@ a { <===> ================================================================================ <===> lightness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 14%)} <===> lightness/high/output.css @@ -241,7 +241,7 @@ a { <===> ================================================================================ <===> lightness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: -14%)} <===> lightness/low/output.css @@ -252,7 +252,7 @@ a { <===> ================================================================================ <===> lightness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 100%)} <===> lightness/above_max/output.css @@ -263,7 +263,7 @@ a { <===> ================================================================================ <===> lightness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $lightness: -100%)} <===> lightness/below_min/output.css @@ -274,7 +274,7 @@ a { <===> ================================================================================ <===> lightness/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 200%)} <===> lightness/arg_above_max/output.css @@ -285,7 +285,7 @@ a { <===> ================================================================================ <===> lightness/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(plum, $lightness: -200%)} <===> lightness/arg_below_min/output.css @@ -296,7 +296,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> all/output.css @@ -307,7 +307,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.adjust( rgba(black, 0.7), @@ -325,7 +325,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.adjust( black, @@ -345,7 +345,7 @@ a { ================================================================================ <===> alpha_arg_above_max/input.scss // Regression test for sass/dart-sass#708. -@use 'sass:color'; +@use "sass:color"; a { b: color.adjust( black, @@ -364,7 +364,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust($color: black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> named/output.css diff --git a/spec/core_functions/color/adjust/hwb.hrx b/spec/core_functions/color/adjust/hwb.hrx index 1d0dcea541..0e38a7b017 100644 --- a/spec/core_functions/color/adjust/hwb.hrx +++ b/spec/core_functions/color/adjust/hwb.hrx @@ -1,5 +1,5 @@ <===> whiteness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#cc6666, $whiteness: 100%)} <===> whiteness/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> whiteness/max_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#cc6666, $whiteness: 60%)} <===> whiteness/max_remaining/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> whiteness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#cc6666, $whiteness: 0%)} <===> whiteness/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> whiteness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#cc6666, $whiteness: -100%)} <===> whiteness/min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> whiteness/min_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#cc6666, $whiteness: -40%)} <===> whiteness/min_remaining/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> whiteness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#cc6666, $whiteness: 40%)} <===> whiteness/high/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> whiteness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#cc6666, $whiteness: -20%)} <===> whiteness/low/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> blackness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#993333, $blackness: 100%)} <===> blackness/max/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blackness/max_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#993333, $blackness: 60%)} <===> blackness/max_remaining/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blackness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#993333, $blackness: 0%)} <===> blackness/zero/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blackness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#993333, $blackness: -100%)} <===> blackness/min/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blackness/min_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#993333, $blackness: -40%)} <===> blackness/min_remaining/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blackness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#993333, $blackness: 40%)} <===> blackness/high/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blackness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#993333, $blackness: -20%)} <===> blackness/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> all/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.7), $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> alpha_input/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.adjust( red, @@ -194,7 +194,7 @@ a { <===> ================================================================================ <===> alpha_arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.adjust( red, @@ -213,7 +213,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust($color: red, $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> named/output.css diff --git a/spec/core_functions/color/adjust/lab.hrx b/spec/core_functions/color/adjust/lab.hrx index f6386fbd98..78468941f6 100644 --- a/spec/core_functions/color/adjust/lab.hrx +++ b/spec/core_functions/color/adjust/lab.hrx @@ -1,5 +1,5 @@ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $lightness: 50)} <===> lightness/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $lightness: -10%)} <===> lightness/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $lightness: 90)} <===> lightness/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $lightness: -40%)} <===> lightness/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> lightness/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $lightness: 120%)} <===> lightness/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> lightness/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $lightness: -130%)} <===> lightness/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> a/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $a: -30)} <===> a/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> a/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $a: 40%)} <===> a/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> a/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $a: 70)} <===> a/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> a/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $a: -200)} <===> a/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> a/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $a: 130)} <===> a/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> a/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $a: -500)} <===> a/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> b/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $b: -30)} <===> b/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> b/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $b: 20%)} <===> b/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> b/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $b: 70)} <===> b/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> b/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $b: -80)} <===> b/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> b/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $b: 500)} <===> b/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> b/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $b: -500)} <===> b/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $lightness: 40%, $a: 50, $b: 60)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100 / 0.9), $lightness: 50%)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(30% 60 -100), $lightness: 50%, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/lch.hrx b/spec/core_functions/color/adjust/lch.hrx index ae05ef0a33..139328a5c3 100644 --- a/spec/core_functions/color/adjust/lch.hrx +++ b/spec/core_functions/color/adjust/lch.hrx @@ -1,5 +1,5 @@ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $lightness: 50)} <===> lightness/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $lightness: -10%)} <===> lightness/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $lightness: 90)} <===> lightness/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $lightness: -40%)} <===> lightness/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> lightness/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $lightness: 120%)} <===> lightness/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> lightness/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $lightness: -130%)} <===> lightness/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> chroma/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $chroma: -30)} <===> chroma/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> chroma/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $chroma: 40%)} <===> chroma/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> chroma/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $chroma: 100)} <===> chroma/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> chroma/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $chroma: -100)} <===> chroma/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> chroma/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $chroma: 200)} <===> chroma/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> chroma/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $chroma: -200)} <===> chroma/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> hue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $hue: -30)} <===> hue/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> hue/turn/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $hue: 0.5turn)} <===> hue/turn/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $lightness: 40%, $chroma: 50, $hue: 60)} <===> all/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg / 0.9), $lightness: 50%)} <===> alpha_input/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lch(30% 60 180deg), $lightness: 50%, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/no_channels.hrx b/spec/core_functions/color/adjust/no_channels.hrx index a2ed7bd9be..297ee4362d 100644 --- a/spec/core_functions/color/adjust/no_channels.hrx +++ b/spec/core_functions/color/adjust/no_channels.hrx @@ -1,5 +1,5 @@ <===> positional/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red)} <===> positional/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust($color: red)} <===> named/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> alpha/max_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: 0.5)} <===> alpha/max_remaining/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> alpha/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: 0)} <===> alpha/zero/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> alpha/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: 1)} <===> alpha/above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> alpha/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: -1)} <===> alpha/below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: 2)} <===> alpha/arg_above_max/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: -2)} <===> alpha/arg_below_min/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/min_remaining/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: -0.5)} <===> alpha/min_remaining/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> alpha/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: 0.14)} <===> alpha/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> alpha/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(red, 0.5), $alpha: -0.14)} <===> alpha/low/output.css diff --git a/spec/core_functions/color/adjust/oklab.hrx b/spec/core_functions/color/adjust/oklab.hrx index ad67317ffa..ca3fef77f8 100644 --- a/spec/core_functions/color/adjust/oklab.hrx +++ b/spec/core_functions/color/adjust/oklab.hrx @@ -1,5 +1,5 @@ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 0.5)} <===> lightness/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: -10%)} <===> lightness/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 0.9)} <===> lightness/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: -40%)} <===> lightness/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> lightness/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 120%)} <===> lightness/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> lightness/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: -130%)} <===> lightness/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> a/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $a: -0.2)} <===> a/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> a/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $a: 40%)} <===> a/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> a/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $a: 0.7)} <===> a/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> a/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $a: -0.6)} <===> a/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> a/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $a: 1)} <===> a/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> a/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $a: -1)} <===> a/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> b/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $b: -0.05)} <===> b/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> b/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $b: 20%)} <===> b/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> b/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $b: 0.8)} <===> b/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> b/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $b: -0.2)} <===> b/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> b/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $b: 1)} <===> b/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> b/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $b: -1)} <===> b/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 40%, $a: 0.2, $b: 0.3)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3 / 0.9), $lightness: 50%)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklab(30% 0.1 -0.3), $lightness: 50%, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/oklch.hrx b/spec/core_functions/color/adjust/oklch.hrx index d264b84158..cf5e0e2fc6 100644 --- a/spec/core_functions/color/adjust/oklch.hrx +++ b/spec/core_functions/color/adjust/oklch.hrx @@ -1,5 +1,5 @@ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 0.5)} <===> lightness/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: -10%)} <===> lightness/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 0.9)} <===> lightness/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: -40%)} <===> lightness/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> lightness/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 120%)} <===> lightness/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> lightness/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: -130%)} <===> lightness/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> chroma/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: -0.1)} <===> chroma/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> chroma/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: 40%)} <===> chroma/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> chroma/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: 0.3)} <===> chroma/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> chroma/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: -0.2)} <===> chroma/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> chroma/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: 1)} <===> chroma/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> chroma/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $chroma: -1)} <===> chroma/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> hue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $hue: -30)} <===> hue/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> hue/turn/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $hue: 0.5turn)} <===> hue/turn/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 40%, $chroma: 0.2, $hue: 60)} <===> all/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg / 0.9), $lightness: 50%)} <===> alpha_input/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(30% 0.15 180deg), $lightness: 50%, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/prophoto_rgb.hrx b/spec/core_functions/color/adjust/prophoto_rgb.hrx index ad17a1163c..25890ca132 100644 --- a/spec/core_functions/color/adjust/prophoto_rgb.hrx +++ b/spec/core_functions/color/adjust/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: -10%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.9)} <===> red/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: -0.3)} <===> red/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 1.9)} <===> red/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> red/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: -1.3)} <===> red/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: -0.3)} <===> green/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.7)} <===> green/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: -0.8)} <===> green/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> green/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: 1.7)} <===> green/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> green/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $green: -1.8)} <===> green/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: -0.3)} <===> blue/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 20%)} <===> blue/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.7)} <===> blue/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> blue/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: -0.8)} <===> blue/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> blue/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: 1.7)} <===> blue/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> blue/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $blue: -1.8)} <===> blue/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/rec2020.hrx b/spec/core_functions/color/adjust/rec2020.hrx index bc20b2a780..6b0e2a74bb 100644 --- a/spec/core_functions/color/adjust/rec2020.hrx +++ b/spec/core_functions/color/adjust/rec2020.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: -10%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.9)} <===> red/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: -0.3)} <===> red/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 1.9)} <===> red/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> red/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: -1.3)} <===> red/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: -0.3)} <===> green/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 0.7)} <===> green/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: -0.8)} <===> green/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> green/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: 1.7)} <===> green/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> green/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $green: -1.8)} <===> green/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: -0.3)} <===> blue/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 20%)} <===> blue/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 0.7)} <===> blue/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> blue/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: -0.8)} <===> blue/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> blue/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: 1.7)} <===> blue/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> blue/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $blue: -1.8)} <===> blue/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(rec2020 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/rgb.hrx b/spec/core_functions/color/adjust/rgb.hrx index e3b4c9a08a..8ae06f087b 100644 --- a/spec/core_functions/color/adjust/rgb.hrx +++ b/spec/core_functions/color/adjust/rgb.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $red: 255)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $red: -255)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $red: 0)} <===> red/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $red: -100)} <===> red/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $red: 200)} <===> red/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> red/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#abcdef, $red: 200)} <===> red/above_max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> red/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#abcdef, $red: -200)} <===> red/below_min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> red/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#abcdef, $red: 500)} <===> red/arg_above_max/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> red/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#abcdef, $red: -500)} <===> red/arg_below_min/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $green: 255)} <===> green/max/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lime, $green: -255)} <===> green/min/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> green/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $green: 0)} <===> green/zero/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lime, $green: -100)} <===> green/low/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $green: 200)} <===> green/high/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> green/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#abcdef, $green: 200)} <===> green/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> green/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#abcdef, $green: -210)} <===> green/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> green/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#abcdef, $green: 500)} <===> green/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> green/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#abcdef, $green: -500)} <===> green/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $blue: 255)} <===> blue/max/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(blue, $blue: -255)} <===> blue/min/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $blue: 0)} <===> blue/zero/output.css @@ -230,7 +230,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(blue, $blue: -100)} <===> blue/low/output.css @@ -241,7 +241,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $blue: 200)} <===> blue/high/output.css @@ -252,7 +252,7 @@ a { <===> ================================================================================ <===> blue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#fedcba, $blue: 200)} <===> blue/above_max/output.css @@ -263,7 +263,7 @@ a { <===> ================================================================================ <===> blue/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#fedcba, $blue: -200)} <===> blue/below_min/output.css @@ -274,7 +274,7 @@ a { <===> ================================================================================ <===> blue/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#fedcba, $blue: 500)} <===> blue/arg_above_max/output.css @@ -285,7 +285,7 @@ a { <===> ================================================================================ <===> blue/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(#fedcba, $blue: -500)} <===> blue/arg_below_min/output.css @@ -296,7 +296,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $red: 12, $green: 24, $blue: 48)} <===> all/output.css @@ -307,7 +307,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgba(black, 0.3), $red: 12, $green: 24, $blue: 48)} <===> alpha_input/output.css @@ -318,7 +318,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(black, $red: 12, $green: 24, $blue: 48, $alpha: -0.3)} <===> alpha_arg/output.css @@ -329,7 +329,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust($color: black, $red: 12, $green: 24, $blue: 48)} <===> named/output.css diff --git a/spec/core_functions/color/adjust/space.hrx b/spec/core_functions/color/adjust/space.hrx index 878ed33600..cb8662cf74 100644 --- a/spec/core_functions/color/adjust/space.hrx +++ b/spec/core_functions/color/adjust/space.hrx @@ -1,5 +1,5 @@ <===> identical/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(50% 0.2 0deg), $space: lab)} <===> identical/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> legacy/to_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(pink, $saturation: -5%, $space: hsl)} <===> legacy/to_legacy/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> legacy/to_modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(pink, $chroma: -0.01, $space: oklch)} <===> legacy/to_modern/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> modern/to_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(50% 10 -20), $saturation: 5%, $space: hsl)} <===> modern/to_legacy/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> modern/to_modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(lab(50% 10 -20), $chroma: 0.01, $space: oklch)} <===> modern/to_modern/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> powerless/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(hsl(0deg 0% 50%), $space: lab)} <===> powerless/legacy/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> powerless/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(oklch(50% 0 0deg), $space: lab)} <===> powerless/modern/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> missing/legacy/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgb(none none none))} <===> missing/legacy/same/implicit/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/legacy/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgb(none none none), $space: rgb)} <===> missing/legacy/same/explicit/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/legacy/analogous/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(hsl(none 50% 50%), $space: hwb)} <===> missing/legacy/analogous/legacy/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/legacy/analogous/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(rgb(none none none), $space: display-p3)} <===> missing/legacy/analogous/modern/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/modern/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb none none none))} <===> missing/modern/same/implicit/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> missing/modern/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb none none none), $space: srgb)} <===> missing/modern/same/explicit/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> missing/modern/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb none none none), $space: display-p3)} <===> missing/modern/analogous/output.css diff --git a/spec/core_functions/color/adjust/srgb.hrx b/spec/core_functions/color/adjust/srgb.hrx index 4520d0956e..285ebfe6fb 100644 --- a/spec/core_functions/color/adjust/srgb.hrx +++ b/spec/core_functions/color/adjust/srgb.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: -10%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.9)} <===> red/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: -0.3)} <===> red/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 1.9)} <===> red/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> red/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: -1.3)} <===> red/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: -0.3)} <===> green/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 0.7)} <===> green/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: -0.8)} <===> green/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> green/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: 1.7)} <===> green/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> green/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $green: -1.8)} <===> green/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: -0.3)} <===> blue/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 20%)} <===> blue/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 0.7)} <===> blue/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> blue/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: -0.8)} <===> blue/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> blue/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: 1.7)} <===> blue/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> blue/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $blue: -1.8)} <===> blue/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/srgb_linear.hrx b/spec/core_functions/color/adjust/srgb_linear.hrx index 7caf5ebc5c..529aa22441 100644 --- a/spec/core_functions/color/adjust/srgb_linear.hrx +++ b/spec/core_functions/color/adjust/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: -10%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.9)} <===> red/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: -0.3)} <===> red/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 1.9)} <===> red/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> red/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: -1.3)} <===> red/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: -0.3)} <===> green/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 0.7)} <===> green/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: -0.8)} <===> green/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> green/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: 1.7)} <===> green/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> green/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $green: -1.8)} <===> green/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: -0.3)} <===> blue/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 20%)} <===> blue/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 0.7)} <===> blue/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> blue/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: -0.8)} <===> blue/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> blue/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: 1.7)} <===> blue/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> blue/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $blue: -1.8)} <===> blue/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.3, $green: 0.2, $blue: 0.1)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(srgb-linear 0.2 0.5 0.7), $red: 0.5, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/units.hrx b/spec/core_functions/color/adjust/units.hrx index c10683b97d..1de839cbad 100644 --- a/spec/core_functions/color/adjust/units.hrx +++ b/spec/core_functions/color/adjust/units.hrx @@ -1,5 +1,5 @@ <===> hue/deg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 60deg)} <===> hue/deg/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 60)} <===> hue/unitless/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 60in)} <===> hue/unknown/output.css @@ -45,7 +45,7 @@ See https://sass-lang.com/d/function-units <===> ================================================================================ <===> hue/angle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $hue: 60rad)} <===> hue/angle/output.css @@ -56,7 +56,7 @@ a { <===> ================================================================================ <===> saturation/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $saturation: -10%)} <===> saturation/percent/output.css @@ -67,7 +67,7 @@ a { <===> ================================================================================ <===> saturation/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $saturation: -10)} <===> saturation/unitless/output.css @@ -91,7 +91,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> saturation/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $saturation: -10in)} <===> saturation/unknown/output.css @@ -115,7 +115,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 10%)} <===> lightness/percent/output.css @@ -126,7 +126,7 @@ a { <===> ================================================================================ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 10)} <===> lightness/unitless/output.css @@ -150,7 +150,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> lightness/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $lightness: 10in)} <===> lightness/unknown/output.css @@ -174,7 +174,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> alpha/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $alpha: -0.3)} <===> alpha/unitless/output.css @@ -185,7 +185,7 @@ a { <===> ================================================================================ <===> alpha/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $alpha: -0.3%)} <===> alpha/percent/output.css @@ -209,7 +209,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> alpha/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(red, $alpha: -0.3px)} <===> alpha/unknown/output.css diff --git a/spec/core_functions/color/adjust/xyz_d50.hrx b/spec/core_functions/color/adjust/xyz_d50.hrx index c9f49a55cf..38e6db87d6 100644 --- a/spec/core_functions/color/adjust/xyz_d50.hrx +++ b/spec/core_functions/color/adjust/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> x/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.5)} <===> x/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> x/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: -10%)} <===> x/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> x/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.9)} <===> x/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> x/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: -0.3)} <===> x/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> x/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 1.9)} <===> x/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> x/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: -1.3)} <===> x/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> y/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: -0.3)} <===> y/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> y/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 40%)} <===> y/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> y/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 0.7)} <===> y/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> y/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: -0.8)} <===> y/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> y/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: 1.7)} <===> y/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> y/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $y: -1.8)} <===> y/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> z/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: -0.3)} <===> z/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> z/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 20%)} <===> z/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> z/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 0.7)} <===> z/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> z/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: -0.8)} <===> z/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> z/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: 1.7)} <===> z/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> z/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $z: -1.8)} <===> z/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.3, $y: 0.2, $z: 0.1)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7 / 0.9), $x: 0.5)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d50 0.2 0.5 0.7), $x: 0.5, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/adjust/xyz_d65.hrx b/spec/core_functions/color/adjust/xyz_d65.hrx index 30abb1432d..fcab7a2b36 100644 --- a/spec/core_functions/color/adjust/xyz_d65.hrx +++ b/spec/core_functions/color/adjust/xyz_d65.hrx @@ -1,5 +1,5 @@ <===> x/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 0.5)} <===> x/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> x/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: -10%)} <===> x/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> x/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 0.9)} <===> x/above_max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> x/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: -0.3)} <===> x/below_min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> x/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 1.9)} <===> x/arg_above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> x/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: -1.3)} <===> x/arg_below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> y/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: -0.3)} <===> y/unitless/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> y/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: 40%)} <===> y/percent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> y/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: 0.7)} <===> y/above_max/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> y/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: -0.8)} <===> y/below_min/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> y/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: 1.7)} <===> y/arg_above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> y/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $y: -1.8)} <===> y/arg_below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> z/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: -0.3)} <===> z/unitless/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> z/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: 20%)} <===> z/percent/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> z/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: 0.7)} <===> z/above_max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> z/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: -0.8)} <===> z/below_min/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> z/arg_above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: 1.7)} <===> z/arg_above_max/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> z/arg_below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $z: -1.8)} <===> z/arg_below_min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 0.3, $y: 0.2, $z: 0.1)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7 / 0.9), $x: 0.5)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.adjust(color(xyz-d65 0.2 0.5 0.7), $x: 0.5, $alpha: -0.1)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/alpha.hrx b/spec/core_functions/color/alpha.hrx index 30f1ca4482..94b5758022 100644 --- a/spec/core_functions/color/alpha.hrx +++ b/spec/core_functions/color/alpha.hrx @@ -168,7 +168,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/with_module/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.opacity(var(--c))} <===> error/with_module/type/error @@ -221,7 +221,7 @@ Error: $color: 1=c is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.alpha(color(srgb 1 1 1))} <===> error/non_legacy/error diff --git a/spec/core_functions/color/blackness.hrx b/spec/core_functions/color/blackness.hrx index 2307234373..c67e3aa6ef 100644 --- a/spec/core_functions/color/blackness.hrx +++ b/spec/core_functions/color/blackness.hrx @@ -1,5 +1,5 @@ <===> max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(black)} <===> max/output.css @@ -23,7 +23,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(white)} <===> min/output.css @@ -47,7 +47,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> middle/zero_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(hwb(0 0% 50%))} <===> middle/zero_whiteness/output.css @@ -71,7 +71,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> middle/half_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(hwb(0 50% 50%))} <===> middle/half_whiteness/output.css @@ -95,7 +95,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> middle/high_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(hwb(0 70% 70%))} <===> middle/high_whiteness/output.css @@ -119,7 +119,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> fraction/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(hwb(0 0% 0.5%))} <===> fraction/output.css @@ -143,7 +143,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness($color: hwb(0 0% 42%))} <===> named/output.css @@ -167,7 +167,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> error/too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness()} <===> error/too_few_args/error @@ -185,7 +185,7 @@ Error: Missing argument $color. <===> ================================================================================ <===> error/too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(red, green)} <===> error/too_many_args/error @@ -203,7 +203,7 @@ Error: Only 1 argument allowed, but 2 were passed. <===> ================================================================================ <===> error/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(1)} <===> error/type/error @@ -217,7 +217,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blackness(color(srgb 1 1 1))} <===> error/non_legacy/error diff --git a/spec/core_functions/color/blue.hrx b/spec/core_functions/color/blue.hrx index f2111b37f8..3e60eeb95b 100644 --- a/spec/core_functions/color/blue.hrx +++ b/spec/core_functions/color/blue.hrx @@ -138,7 +138,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.blue(color(srgb 1 1 1))} <===> error/non_legacy/error diff --git a/spec/core_functions/color/change/a98_rgb.hrx b/spec/core_functions/color/change/a98_rgb.hrx index 138f135d3a..fb38e635a8 100644 --- a/spec/core_functions/color/change/a98_rgb.hrx +++ b/spec/core_functions/color/change/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 50%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 1.2)} <===> red/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: none)} <===> red/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: 0.4)} <===> green/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: -0.2)} <===> green/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: none)} <===> green/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 0.5)} <===> blue/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 50%)} <===> blue/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 100)} <===> blue/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: none)} <===> blue/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/display_p3.hrx b/spec/core_functions/color/change/display_p3.hrx index f251299f93..9a0779113d 100644 --- a/spec/core_functions/color/change/display_p3.hrx +++ b/spec/core_functions/color/change/display_p3.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 50%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 1.2)} <===> red/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: none)} <===> red/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: 0.4)} <===> green/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: -0.2)} <===> green/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: none)} <===> green/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 0.5)} <===> blue/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 50%)} <===> blue/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 100)} <===> blue/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: none)} <===> blue/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/error/args.hrx b/spec/core_functions/color/change/error/args.hrx index c78b5593bb..71c90663ad 100644 --- a/spec/core_functions/color/change/error/args.hrx +++ b/spec/core_functions/color/change/error/args.hrx @@ -1,5 +1,5 @@ <===> too_few/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change()} <===> too_few/error @@ -17,7 +17,7 @@ Error: Missing argument $color. <===> ================================================================================ <===> too_many/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, 1)} <===> too_many/error @@ -31,7 +31,7 @@ Error: Only one positional argument is allowed. All other arguments must be pass <===> ================================================================================ <===> unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $ambience: 10%)} <===> unknown/error diff --git a/spec/core_functions/color/change/error/bounds.hrx b/spec/core_functions/color/change/error/bounds.hrx index 855de13fd8..cc04390c61 100644 --- a/spec/core_functions/color/change/error/bounds.hrx +++ b/spec/core_functions/color/change/error/bounds.hrx @@ -1,5 +1,5 @@ <===> alpha/too_low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: -0.001)} <===> alpha/too_low/error @@ -13,7 +13,7 @@ Error: $alpha: Expected -0.001 to be within 0 and 1. <===> ================================================================================ <===> alpha/too_high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: 1.001)} <===> alpha/too_high/error @@ -27,7 +27,7 @@ Error: $alpha: Expected 1.001 to be within 0 and 1. <===> ================================================================================ <===> alpha/unit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: 150%)} <===> alpha/unit/error diff --git a/spec/core_functions/color/change/error/incompatible_channel.hrx b/spec/core_functions/color/change/error/incompatible_channel.hrx index e31e48ce1f..b989f771a0 100644 --- a/spec/core_functions/color/change/error/incompatible_channel.hrx +++ b/spec/core_functions/color/change/error/incompatible_channel.hrx @@ -1,5 +1,5 @@ <===> legacy_space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $chroma: 50%)} <===> legacy_space/error @@ -13,7 +13,7 @@ Error: $chroma: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> legacy_channel/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} <===> legacy_channel/error @@ -27,7 +27,7 @@ Error: $whiteness: Color space srgb doesn't have a channel with this name. <===> ================================================================================ <===> modern_both/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $chroma: 50%)} <===> modern_both/error diff --git a/spec/core_functions/color/change/error/mixed_formats.hrx b/spec/core_functions/color/change/error/mixed_formats.hrx index b02876f20f..fd2d16193a 100644 --- a/spec/core_functions/color/change/error/mixed_formats.hrx +++ b/spec/core_functions/color/change/error/mixed_formats.hrx @@ -1,5 +1,5 @@ <===> red_and_hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $red: 1, $hue: 1)} <===> red_and_hue/error @@ -13,7 +13,7 @@ Error: $hue: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> green_and_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $green: 1, $saturation: 1%)} <===> green_and_saturation/error @@ -27,7 +27,7 @@ Error: $saturation: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> blue_and_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $blue: 1, $lightness: 1%)} <===> blue_and_lightness/error @@ -54,7 +54,7 @@ Error: $blackness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> green_and_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $green: 1, $whiteness: 1%)} <===> green_and_whiteness/error @@ -68,7 +68,7 @@ Error: $whiteness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> saturation_and_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error @@ -82,7 +82,7 @@ Error: $blackness: Color space hsl doesn't have a channel with this name. <===> ================================================================================ <===> lightness_and_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error diff --git a/spec/core_functions/color/change/error/space.hrx b/spec/core_functions/color/change/error/space.hrx index 01f2e35374..d2431675ad 100644 --- a/spec/core_functions/color/change/error/space.hrx +++ b/spec/core_functions/color/change/error/space.hrx @@ -1,5 +1,5 @@ <===> unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $space: c)} <===> unknown/error @@ -13,7 +13,7 @@ Error: $space: Unknown color space "c". <===> ================================================================================ <===> quoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $space: "lab")} <===> quoted/error diff --git a/spec/core_functions/color/change/error/type.hrx b/spec/core_functions/color/change/error/type.hrx index 510f66e00f..d421de68a6 100644 --- a/spec/core_functions/color/change/error/type.hrx +++ b/spec/core_functions/color/change/error/type.hrx @@ -1,5 +1,5 @@ <===> color/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(1)} <===> color/error @@ -13,7 +13,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $red: c)} <===> red/error @@ -27,7 +27,7 @@ Error: $red: c is not a number or unquoted "none". <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $green: c)} <===> green/error @@ -41,7 +41,7 @@ Error: $green: c is not a number or unquoted "none". <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $blue: c)} <===> blue/error @@ -55,7 +55,7 @@ Error: $blue: c is not a number or unquoted "none". <===> ================================================================================ <===> hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: c)} <===> hue/error @@ -69,7 +69,7 @@ Error: $hue: c is not a number or unquoted "none". <===> ================================================================================ <===> saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $saturation: c)} <===> saturation/error @@ -83,7 +83,7 @@ Error: $saturation: c is not a number or unquoted "none". <===> ================================================================================ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: c)} <===> lightness/error @@ -97,7 +97,7 @@ Error: $lightness: c is not a number or unquoted "none". <===> ================================================================================ <===> alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: c)} <===> alpha/error @@ -111,7 +111,7 @@ Error: $alpha: c is not a number or unquoted "none". <===> ================================================================================ <===> quoted_none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: "none")} <===> quoted_none/error @@ -125,7 +125,7 @@ Error: $alpha: "none" is not a number or unquoted "none". <===> ================================================================================ <===> blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $blackness: c)} <===> blackness/error @@ -139,7 +139,7 @@ Error: $blackness: c is not a number or unquoted "none". <===> ================================================================================ <===> whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $whiteness: c)} <===> whiteness/error @@ -153,7 +153,7 @@ Error: $whiteness: c is not a number or unquoted "none". <===> ================================================================================ <===> space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $space: 1)} <===> space/error diff --git a/spec/core_functions/color/change/error/units/a98_rgb.hrx b/spec/core_functions/color/change/error/units/a98_rgb.hrx index a5f63c8794..0a2553a7ec 100644 --- a/spec/core_functions/color/change/error/units/a98_rgb.hrx +++ b/spec/core_functions/color/change/error/units/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(a98-rgb 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/change/error/units/display_p3.hrx b/spec/core_functions/color/change/error/units/display_p3.hrx index 97d91bc967..4df0277296 100644 --- a/spec/core_functions/color/change/error/units/display_p3.hrx +++ b/spec/core_functions/color/change/error/units/display_p3.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(display-p3 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/change/error/units/hwb.hrx b/spec/core_functions/color/change/error/units/hwb.hrx index 115e87e0dd..d204b5a567 100644 --- a/spec/core_functions/color/change/error/units/hwb.hrx +++ b/spec/core_functions/color/change/error/units/hwb.hrx @@ -1,5 +1,5 @@ <===> none/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(white, $whiteness: 1)} <===> none/whiteness/error @@ -13,7 +13,7 @@ Error: $whiteness: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $blackness: 1)} <===> none/blackness/error @@ -27,7 +27,7 @@ Error: $blackness: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(white, $whiteness: 1px)} <===> wrong/whiteness/error @@ -41,7 +41,7 @@ Error: $whiteness: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $blackness: 1px)} <===> wrong/blackness/error diff --git a/spec/core_functions/color/change/error/units/lab.hrx b/spec/core_functions/color/change/error/units/lab.hrx index 6fa7249055..b292514712 100644 --- a/spec/core_functions/color/change/error/units/lab.hrx +++ b/spec/core_functions/color/change/error/units/lab.hrx @@ -1,5 +1,5 @@ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 30 -50), $lightness: 30px)} <===> lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 30px to have unit "%" or no units. <===> ================================================================================ <===> a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 30 -50), $a: 20px)} <===> a/error @@ -27,7 +27,7 @@ Error: $a: Expected 20px to have unit "%" or no units. <===> ================================================================================ <===> b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 30 -50), $b: 20px)} <===> b/error diff --git a/spec/core_functions/color/change/error/units/lch.hrx b/spec/core_functions/color/change/error/units/lch.hrx index 0c08c79dd8..296fd9ecff 100644 --- a/spec/core_functions/color/change/error/units/lch.hrx +++ b/spec/core_functions/color/change/error/units/lch.hrx @@ -1,5 +1,5 @@ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 30 50deg), $lightness: 30px)} <===> lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 30px to have unit "%" or no units. <===> ================================================================================ <===> chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 30 50deg), $chroma: 20px)} <===> chroma/error @@ -27,7 +27,7 @@ Error: $chroma: Expected 20px to have unit "%" or no units. <===> ================================================================================ <===> hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 30 50deg), $hue: 20%)} <===> hue/error diff --git a/spec/core_functions/color/change/error/units/oklab.hrx b/spec/core_functions/color/change/error/units/oklab.hrx index c2210ee2ee..1415ccbe80 100644 --- a/spec/core_functions/color/change/error/units/oklab.hrx +++ b/spec/core_functions/color/change/error/units/oklab.hrx @@ -1,5 +1,5 @@ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 0.3px)} <===> lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 0.3px to have unit "%" or no units. <===> ================================================================================ <===> a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $a: 0.2px)} <===> a/error @@ -27,7 +27,7 @@ Error: $a: Expected 0.2px to have unit "%" or no units. <===> ================================================================================ <===> b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $b: 0.2px)} <===> b/error diff --git a/spec/core_functions/color/change/error/units/oklch.hrx b/spec/core_functions/color/change/error/units/oklch.hrx index f89fc46da4..66a5850478 100644 --- a/spec/core_functions/color/change/error/units/oklch.hrx +++ b/spec/core_functions/color/change/error/units/oklch.hrx @@ -1,5 +1,5 @@ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.3 50deg), $lightness: 30px)} <===> lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 30px to have unit "%" or no units. <===> ================================================================================ <===> chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.3 50deg), $chroma: 0.2px)} <===> chroma/error @@ -27,7 +27,7 @@ Error: $chroma: Expected 0.2px to have unit "%" or no units. <===> ================================================================================ <===> hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.3 50deg), $hue: 20%)} <===> hue/error diff --git a/spec/core_functions/color/change/error/units/prophoto_rgb.hrx b/spec/core_functions/color/change/error/units/prophoto_rgb.hrx index eb44f0ec4e..9f119dc18e 100644 --- a/spec/core_functions/color/change/error/units/prophoto_rgb.hrx +++ b/spec/core_functions/color/change/error/units/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/change/error/units/rec2020.hrx b/spec/core_functions/color/change/error/units/rec2020.hrx index 4193d05aef..3b0f5249ce 100644 --- a/spec/core_functions/color/change/error/units/rec2020.hrx +++ b/spec/core_functions/color/change/error/units/rec2020.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/change/error/units/srgb.hrx b/spec/core_functions/color/change/error/units/srgb.hrx index 9d583bf7fd..00b3019aa5 100644 --- a/spec/core_functions/color/change/error/units/srgb.hrx +++ b/spec/core_functions/color/change/error/units/srgb.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/change/error/units/srgb_linear.hrx b/spec/core_functions/color/change/error/units/srgb_linear.hrx index 6f6df601d3..c8ac9202d7 100644 --- a/spec/core_functions/color/change/error/units/srgb_linear.hrx +++ b/spec/core_functions/color/change/error/units/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $red: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $green: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/change/error/units/xyz.hrx b/spec/core_functions/color/change/error/units/xyz.hrx index 0e4f0c15d4..f4dcd916b0 100644 --- a/spec/core_functions/color/change/error/units/xyz.hrx +++ b/spec/core_functions/color/change/error/units/xyz.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $x: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $y: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $y: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/change/error/units/xyz_d50.hrx b/spec/core_functions/color/change/error/units/xyz_d50.hrx index 9a46b0ba59..25b5a8478c 100644 --- a/spec/core_functions/color/change/error/units/xyz_d50.hrx +++ b/spec/core_functions/color/change/error/units/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.5px)} <===> red/error @@ -13,7 +13,7 @@ Error: $x: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: 0.5px)} <===> green/error @@ -27,7 +27,7 @@ Error: $y: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 0.5px)} <===> blue/error diff --git a/spec/core_functions/color/change/hsl.hrx b/spec/core_functions/color/change/hsl.hrx index 83e9eb45b5..b98d1969b0 100644 --- a/spec/core_functions/color/change/hsl.hrx +++ b/spec/core_functions/color/change/hsl.hrx @@ -1,5 +1,5 @@ <===> hue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: 359)} <===> hue/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: 540)} <===> hue/above_max/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(blue, $hue: 0)} <===> hue/min/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> hue/negative/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: -60)} <===> hue/negative/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> hue/middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: 123)} <===> hue/middle/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> hue/fraction/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: 0.5)} <===> hue/fraction/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> hue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(hsl(0deg 100% 50%), $hue: none)} <===> hue/none/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> saturation/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(plum, $saturation: 100%)} <===> saturation/max/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> saturation/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(plum, $saturation: 0%)} <===> saturation/min/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> saturation/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(plum, $saturation: 76%)} <===> saturation/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> saturation/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(plum, $saturation: 14%)} <===> saturation/low/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> saturation/above_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(plum, $saturation: 120%)} <===> saturation/above_range/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> saturation/below_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(plum, $saturation: -20%)} <===> saturation/below_range/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> saturation/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(hsl(0deg 100% 50%), $saturation: none)} <===> saturation/none/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> lightness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 100%)} <===> lightness/max/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> lightness/fraction/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 0.5%)} <===> lightness/fraction/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> lightness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 0%)} <===> lightness/min/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> lightness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 63%)} <===> lightness/high/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> lightness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 27%)} <===> lightness/low/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> lightness/above_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 120%)} <===> lightness/above_range/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> lightness/below_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: -20%)} <===> lightness/below_range/output.css @@ -230,7 +230,7 @@ a { <===> ================================================================================ <===> lightness/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(hsl(0deg 100% 50%), $lightness: none)} <===> lightness/none/output.css @@ -241,7 +241,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> all/output.css @@ -252,7 +252,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgba(black, 0.7), $hue: 12, $saturation: 24%, $lightness: 48%)} <===> alpha_input/output.css @@ -263,7 +263,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $hue: 12, $saturation: 24%, $lightness: 48%, $alpha: 0.7)} <===> alpha_arg/output.css @@ -274,7 +274,7 @@ a { <===> ================================================================================ <===> units/hue/deg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: 60deg)} <===> units/hue/deg/output.css @@ -285,7 +285,7 @@ a { <===> ================================================================================ <===> units/hue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: 60)} <===> units/hue/unitless/output.css @@ -296,7 +296,7 @@ a { <===> ================================================================================ <===> units/hue/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: 60in)} <===> units/hue/unknown/output.css @@ -320,7 +320,7 @@ See https://sass-lang.com/d/function-units <===> ================================================================================ <===> units/hue/angle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $hue: 60rad)} <===> units/hue/angle/output.css @@ -331,7 +331,7 @@ a { <===> ================================================================================ <===> units/saturation/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $saturation: 50%)} <===> units/saturation/percent/output.css @@ -342,7 +342,7 @@ a { <===> ================================================================================ <===> units/saturation/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $saturation: 50)} <===> units/saturation/unitless/output.css @@ -366,7 +366,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> units/saturation/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $saturation: 50in)} <===> units/saturation/unknown/output.css @@ -390,7 +390,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> units/lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 30%)} <===> units/lightness/percent/output.css @@ -401,7 +401,7 @@ a { <===> ================================================================================ <===> units/lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 30)} <===> units/lightness/unitless/output.css @@ -425,7 +425,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> units/lightness/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $lightness: 30in)} <===> units/lightness/unknown/output.css @@ -449,7 +449,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change($color: black, $hue: 12, $saturation: 24%, $lightness: 48%)} <===> named/output.css diff --git a/spec/core_functions/color/change/hwb.hrx b/spec/core_functions/color/change/hwb.hrx index 16aa70406b..500d055c75 100644 --- a/spec/core_functions/color/change/hwb.hrx +++ b/spec/core_functions/color/change/hwb.hrx @@ -1,5 +1,5 @@ <===> whiteness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#cc6666, $whiteness: 100%)} <===> whiteness/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> whiteness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#cc6666, $whiteness: 0%)} <===> whiteness/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> whiteness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#cc6666, $whiteness: 80%)} <===> whiteness/high/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> whiteness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#cc6666, $whiteness: 20%)} <===> whiteness/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> whiteness/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(hwb(180deg 30% 50%), $whiteness: none)} <===> whiteness/none/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> blackness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#993333, $blackness: 100%)} <===> blackness/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> blackness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#993333, $blackness: 0%)} <===> blackness/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> blackness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#993333, $blackness: 80%)} <===> blackness/high/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blackness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#993333, $blackness: 20%)} <===> blackness/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blackness/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(hwb(180deg 30% 50%), $blackness: none)} <===> blackness/none/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(#993333, $whiteness: 50%, $blackness: -20%)} <===> out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(blue, $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> all/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgba(blue, 0.7), $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> alpha_input/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(blue, $hue: 150, $whiteness: 20%, $blackness: 40%, $alpha: 0.3)} <===> alpha_arg/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change($color: blue, $hue: 150, $whiteness: 20%, $blackness: 40%)} <===> named/output.css diff --git a/spec/core_functions/color/change/lab.hrx b/spec/core_functions/color/change/lab.hrx index 154ed30363..ebfff685f0 100644 --- a/spec/core_functions/color/change/lab.hrx +++ b/spec/core_functions/color/change/lab.hrx @@ -1,5 +1,5 @@ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $lightness: 30)} <===> lightness/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $lightness: 30%)} <===> lightness/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $lightness: 120%)} <===> lightness/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $lightness: none)} <===> lightness/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> a/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $a: 50)} <===> a/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> a/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $a: -40%)} <===> a/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> a/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $a: 200)} <===> a/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> a/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $a: none)} <===> a/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> b/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $b: 50)} <===> b/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> b/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $b: -40%)} <===> b/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> b/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $b: -200)} <===> b/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> b/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $b: none)} <===> b/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $lightness: 20%, $a: -30, $b: 40)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30 / 0.9), $lightness: 30%)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 20 -30), $lightness: 30%, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/lch.hrx b/spec/core_functions/color/change/lch.hrx index 37b42a0bb8..7bc57bd218 100644 --- a/spec/core_functions/color/change/lch.hrx +++ b/spec/core_functions/color/change/lch.hrx @@ -1,5 +1,5 @@ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $lightness: 30)} <===> lightness/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $lightness: 30%)} <===> lightness/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $lightness: 120%)} <===> lightness/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $lightness: none)} <===> lightness/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> chroma/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $chroma: 50)} <===> chroma/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> chroma/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $chroma: 40%)} <===> chroma/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> chroma/negative/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $chroma: -10)} <===> chroma/negative/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> chroma/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $chroma: 200)} <===> chroma/out_of_range/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> chroma/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $chroma: none)} <===> chroma/none/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> hue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $hue: 50deg)} <===> hue/unitless/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> hue/negative/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $hue: -20deg)} <===> hue/negative/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> hue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $hue: 400deg)} <===> hue/above_max/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> hue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $hue: none)} <===> hue/none/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $lightness: 20%, $chroma: 30, $hue: 40deg)} <===> all/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg / 0.9), $lightness: 30%)} <===> alpha_input/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lch(50% 20 30deg), $lightness: 30%, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/no_space.hrx b/spec/core_functions/color/change/no_space.hrx index 8f7198feb9..52537c87d8 100644 --- a/spec/core_functions/color/change/no_space.hrx +++ b/spec/core_functions/color/change/no_space.hrx @@ -1,5 +1,5 @@ <===> positional/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red)} <===> positional/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change($color: red)} <===> named/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 50 50))} <===> non_legacy/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> alpha/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgba(red, 0.5), $alpha: 1)} <===> alpha/max/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> alpha/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgba(red, 0.5), $alpha: 0)} <===> alpha/min/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> alpha/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgba(red, 0.5), $alpha: 0.72)} <===> alpha/high/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgba(red, 0.5), $alpha: 0.36)} <===> alpha/low/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 50 50), $alpha: 0.36)} <===> alpha/non_legacy/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/units/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: 0.5)} <===> alpha/units/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> alpha/units/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: 50%)} <===> alpha/units/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> alpha/units/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: 0.5px)} <===> alpha/units/unknown/output.css @@ -133,7 +133,7 @@ See https://sass-lang.com/d/function-units <===> ================================================================================ <===> alpha/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $alpha: none)} <===> alpha/none/output.css diff --git a/spec/core_functions/color/change/oklab.hrx b/spec/core_functions/color/change/oklab.hrx index dd04b70b75..e6f12e30cf 100644 --- a/spec/core_functions/color/change/oklab.hrx +++ b/spec/core_functions/color/change/oklab.hrx @@ -1,5 +1,5 @@ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 0.3)} <===> lightness/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 30%)} <===> lightness/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 1.2)} <===> lightness/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $lightness: none)} <===> lightness/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> a/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $a: 0.1)} <===> a/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> a/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $a: -40%)} <===> a/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> a/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $a: 1)} <===> a/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> a/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $a: none)} <===> a/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> b/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $b: 0.4)} <===> b/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> b/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $b: -40%)} <===> b/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> b/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $b: -1)} <===> b/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> b/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $b: none)} <===> b/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 20%, $a: -0.3, $b: 0.4)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3 / 0.9), $lightness: 30%)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklab(50% 0.2 -0.3), $lightness: 30%, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/oklch.hrx b/spec/core_functions/color/change/oklch.hrx index b74bf3b4f2..9137a93b71 100644 --- a/spec/core_functions/color/change/oklch.hrx +++ b/spec/core_functions/color/change/oklch.hrx @@ -1,5 +1,5 @@ <===> lightness/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $lightness: 0.3)} <===> lightness/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $lightness: 30%)} <===> lightness/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $lightness: 120%)} <===> lightness/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $lightness: none)} <===> lightness/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> chroma/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $chroma: 0.1)} <===> chroma/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> chroma/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $chroma: 40%)} <===> chroma/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> chroma/negative/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $chroma: -0.1)} <===> chroma/negative/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> chroma/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $chroma: 1)} <===> chroma/out_of_range/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> chroma/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $chroma: none)} <===> chroma/none/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> hue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $hue: 50deg)} <===> hue/unitless/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> hue/negative/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $hue: -20deg)} <===> hue/negative/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> hue/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $hue: 400deg)} <===> hue/above_max/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> hue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $hue: none)} <===> hue/none/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $lightness: 20%, $chroma: 0.1, $hue: 40deg)} <===> all/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg / 0.9), $lightness: 30%)} <===> alpha_input/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 30deg), $lightness: 30%, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/prophoto_rgb.hrx b/spec/core_functions/color/change/prophoto_rgb.hrx index a6213fecae..fe96dcfccb 100644 --- a/spec/core_functions/color/change/prophoto_rgb.hrx +++ b/spec/core_functions/color/change/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 50%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 1.2)} <===> red/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: none)} <===> red/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: 0.4)} <===> green/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: -0.2)} <===> green/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $green: none)} <===> green/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0.5)} <===> blue/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 50%)} <===> blue/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: 100)} <===> blue/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $blue: none)} <===> blue/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(prophoto-rgb 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/rec2020.hrx b/spec/core_functions/color/change/rec2020.hrx index a68578c85e..e3c2070ed9 100644 --- a/spec/core_functions/color/change/rec2020.hrx +++ b/spec/core_functions/color/change/rec2020.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 50%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 1.2)} <===> red/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: none)} <===> red/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: 0.4)} <===> green/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: -0.2)} <===> green/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $green: none)} <===> green/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 0.5)} <===> blue/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 50%)} <===> blue/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: 100)} <===> blue/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $blue: none)} <===> blue/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(rec2020 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/rgb.hrx b/spec/core_functions/color/change/rgb.hrx index dec11b5425..cfff566692 100644 --- a/spec/core_functions/color/change/rgb.hrx +++ b/spec/core_functions/color/change/rgb.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $red: 255)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $red: 0)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(red, $red: 100)} <===> red/low/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $red: 200)} <===> red/high/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $red: 500)} <===> red/out_of_range/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> red/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $red: none)} <===> red/none/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $green: 255)} <===> green/max/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lime, $green: 0)} <===> green/min/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lime, $green: 100)} <===> green/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $green: 200)} <===> green/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> green/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $green: -50)} <===> green/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> green/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $green: none)} <===> green/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $blue: 255)} <===> blue/max/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(blue, $blue: 0)} <===> blue/min/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(blue, $blue: 100)} <===> blue/low/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $blue: 200)} <===> blue/high/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> blue/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $blue: 256)} <===> blue/out_of_range/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> blue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $blue: none)} <===> blue/none/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $red: 12, $green: 24, $blue: 48)} <===> all/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgba(black, 0.3), $red: 12, $green: 24, $blue: 48)} <===> alpha_input/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(black, $red: 12, $green: 24, $blue: 48, $alpha: 0.3)} <===> alpha_arg/output.css @@ -230,7 +230,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change($color: black, $red: 12, $green: 24, $blue: 48)} <===> named/output.css diff --git a/spec/core_functions/color/change/space.hrx b/spec/core_functions/color/change/space.hrx index 2028be2df6..986f71f6db 100644 --- a/spec/core_functions/color/change/space.hrx +++ b/spec/core_functions/color/change/space.hrx @@ -1,5 +1,5 @@ <===> identical/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0.2 0deg), $space: lab)} <===> identical/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> legacy/to_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(pink, $saturation: 5%, $space: hsl)} <===> legacy/to_legacy/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> legacy/to_modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(pink, $chroma: 0.01, $space: oklch)} <===> legacy/to_modern/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> modern/to_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 10 -20), $saturation: 5%, $space: hsl)} <===> modern/to_legacy/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> modern/to_modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(lab(50% 10 -20), $chroma: 0.01, $space: oklch)} <===> modern/to_modern/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> powerless/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(hsl(0deg 0% 50%), $space: lab)} <===> powerless/legacy/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> powerless/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(oklch(50% 0 0deg), $space: lab)} <===> powerless/modern/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> missing/arg/legacy/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(pink, $red: none)} <===> missing/arg/legacy/same/implicit/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/arg/legacy/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(pink, $red: none, $space: rgb)} <===> missing/arg/legacy/same/explicit/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/arg/legacy/analogous/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(hsl(100deg 50% 50%), $hue: none, $space: hwb)} <===> missing/arg/legacy/analogous/legacy/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/arg/legacy/analogous/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(pink, $red: none, $space: display-p3)} <===> missing/arg/legacy/analogous/modern/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/arg/modern/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.1 0.2 0.3), $red: none)} <===> missing/arg/modern/same/implicit/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> missing/arg/modern/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.1 0.2 0.3), $red: none, $space: srgb)} <===> missing/arg/modern/same/explicit/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> missing/arg/modern/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.1 0.2 0.3), $red: none, $space: display-p3)} <===> missing/arg/modern/analogous/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> missing/color/legacy/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgb(none none none))} <===> missing/color/legacy/same/implicit/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> missing/color/legacy/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgb(none none none), $space: rgb)} <===> missing/color/legacy/same/explicit/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> missing/color/legacy/analogous/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(hsl(none 50% 50%), $space: hwb)} <===> missing/color/legacy/analogous/legacy/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> missing/color/legacy/analogous/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(rgb(none none none), $space: display-p3)} <===> missing/color/legacy/analogous/modern/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> missing/color/modern/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb none none none))} <===> missing/color/modern/same/implicit/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> missing/color/modern/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb none none none), $space: srgb)} <===> missing/color/modern/same/explicit/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> missing/color/modern/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb none none none), $space: display-p3)} <===> missing/color/modern/analogous/output.css diff --git a/spec/core_functions/color/change/srgb.hrx b/spec/core_functions/color/change/srgb.hrx index c65e09d295..955eab264d 100644 --- a/spec/core_functions/color/change/srgb.hrx +++ b/spec/core_functions/color/change/srgb.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 50%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 1.2)} <===> red/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $red: none)} <===> red/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $green: 0.4)} <===> green/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $green: -0.2)} <===> green/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $green: none)} <===> green/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 0.5)} <===> blue/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 50%)} <===> blue/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: 100)} <===> blue/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $blue: none)} <===> blue/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/srgb_linear.hrx b/spec/core_functions/color/change/srgb_linear.hrx index 1a77e1ffad..945480f624 100644 --- a/spec/core_functions/color/change/srgb_linear.hrx +++ b/spec/core_functions/color/change/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> red/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.5)} <===> red/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 50%)} <===> red/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 1.2)} <===> red/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: none)} <===> red/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> green/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: 0.4)} <===> green/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: 40%)} <===> green/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: -0.2)} <===> green/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $green: none)} <===> green/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blue/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 0.5)} <===> blue/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blue/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 50%)} <===> blue/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: 100)} <===> blue/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $blue: none)} <===> blue/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.7, $green: 0.4, $blue: 0.2)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7 / 0.9), $red: 0.5)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(srgb-linear 0.2 0.5 0.7), $red: 0.5, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/xyz.hrx b/spec/core_functions/color/change/xyz.hrx index de856f1c12..7316ae29f7 100644 --- a/spec/core_functions/color/change/xyz.hrx +++ b/spec/core_functions/color/change/xyz.hrx @@ -1,5 +1,5 @@ <===> x/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.5)} <===> x/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> x/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 50%)} <===> x/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> x/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 1.2)} <===> x/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> x/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $x: none)} <===> x/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> y/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $y: 0.4)} <===> y/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> y/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $y: 40%)} <===> y/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> y/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $y: -0.2)} <===> y/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> y/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $y: none)} <===> y/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> z/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 0.5)} <===> z/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> z/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 50%)} <===> z/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> z/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $z: 100)} <===> z/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> z/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $z: none)} <===> z/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.7, $y: 0.4, $z: 0.2)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7 / 0.9), $x: 0.5)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz 0.2 0.5 0.7), $x: 0.5, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/change/xyz_d50.hrx b/spec/core_functions/color/change/xyz_d50.hrx index b7c1803b12..eeae1d6eb8 100644 --- a/spec/core_functions/color/change/xyz_d50.hrx +++ b/spec/core_functions/color/change/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> x/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.5)} <===> x/unitless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> x/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 50%)} <===> x/percent/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> x/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 1.2)} <===> x/out_of_range/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> x/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: none)} <===> x/none/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> y/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: 0.4)} <===> y/unitless/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> y/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: 40%)} <===> y/percent/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> y/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: -0.2)} <===> y/out_of_range/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> y/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $y: none)} <===> y/none/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> z/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 0.5)} <===> z/unitless/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> z/percent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 50%)} <===> z/percent/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> z/out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: 100)} <===> z/out_of_range/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> z/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $z: none)} <===> z/none/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.7, $y: 0.4, $z: 0.2)} <===> all/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7 / 0.9), $x: 0.5)} <===> alpha_input/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.change(color(xyz-d50 0.2 0.5 0.7), $x: 0.5, $alpha: 0.9)} <===> alpha_arg/output.css diff --git a/spec/core_functions/color/channel/a98-rgb.hrx b/spec/core_functions/color/channel/a98-rgb.hrx index 0af8bc0856..54d9ca4f3c 100644 --- a/spec/core_functions/color/channel/a98-rgb.hrx +++ b/spec/core_functions/color/channel/a98-rgb.hrx @@ -1,5 +1,5 @@ <===> local/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "red")} <===> local/red/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "green")} <===> local/green/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(a98-rgb 0.2 0.5 0.8), "blue")} <===> local/blue/output.css diff --git a/spec/core_functions/color/channel/display-p3.hrx b/spec/core_functions/color/channel/display-p3.hrx index 4d9af63766..06e4af4a59 100644 --- a/spec/core_functions/color/channel/display-p3.hrx +++ b/spec/core_functions/color/channel/display-p3.hrx @@ -1,5 +1,5 @@ <===> local/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(display-p3 0.2 0.5 0.8), "red")} <===> local/red/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(display-p3 0.2 0.5 0.8), "green")} <===> local/green/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(display-p3 0.2 0.5 0.8), "blue")} <===> local/blue/output.css diff --git a/spec/core_functions/color/channel/hsl.hrx b/spec/core_functions/color/channel/hsl.hrx index fd85220df1..38d42c5a3d 100644 --- a/spec/core_functions/color/channel/hsl.hrx +++ b/spec/core_functions/color/channel/hsl.hrx @@ -1,5 +1,5 @@ <===> local/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hsl(10 40% 60%), "hue")} <===> local/hue/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hsl(10deg 40% 60%), "saturation")} <===> local/saturation/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hsl(10deg 40% 60%), "lightness")} <===> local/lightness/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local/normalized/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hsl(540 40% 60%), "hue")} <===> local/normalized/hue/output.css diff --git a/spec/core_functions/color/channel/hwb.hrx b/spec/core_functions/color/channel/hwb.hrx index a88c874a32..2b52eb80cd 100644 --- a/spec/core_functions/color/channel/hwb.hrx +++ b/spec/core_functions/color/channel/hwb.hrx @@ -1,5 +1,5 @@ <===> local/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hwb(10 30% 40%), "hue")} <===> local/hue/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hwb(10deg 30% 40%), "whiteness")} <===> local/whiteness/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hwb(10deg 30% 40%), "blackness")} <===> local/blackness/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local/normalized/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hwb(10deg 70% 50%), "whiteness")} <===> local/normalized/whiteness/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local/normalized/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(hwb(10deg 70% 50%), "blackness")} <===> local/normalized/blackness/output.css diff --git a/spec/core_functions/color/channel/lab.hrx b/spec/core_functions/color/channel/lab.hrx index aca18b5ae0..027b517bbd 100644 --- a/spec/core_functions/color/channel/lab.hrx +++ b/spec/core_functions/color/channel/lab.hrx @@ -1,5 +1,5 @@ <===> local/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(lab(50 -150 30), "lightness")} <===> local/lightness/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(lab(50% -150 30), "a")} <===> local/a/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(lab(50% -150 30), "b")} <===> local/b/output.css diff --git a/spec/core_functions/color/channel/lch.hrx b/spec/core_functions/color/channel/lch.hrx index 1df44f8161..3672227bca 100644 --- a/spec/core_functions/color/channel/lch.hrx +++ b/spec/core_functions/color/channel/lch.hrx @@ -1,5 +1,5 @@ <===> local/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(lch(50 80% 0.5turn), "lightness")} <===> local/lightness/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(lch(50 80% 0.5turn), "chroma")} <===> local/a/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(lch(50 80% 0.5turn), "hue")} <===> local/b/output.css diff --git a/spec/core_functions/color/channel/missing.hrx b/spec/core_functions/color/channel/missing.hrx index cfe9a30966..82071d88a8 100644 --- a/spec/core_functions/color/channel/missing.hrx +++ b/spec/core_functions/color/channel/missing.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(rgb(255 none 255), "green")} <===> output.css diff --git a/spec/core_functions/color/channel/oklab.hrx b/spec/core_functions/color/channel/oklab.hrx index 5ce02231a6..fc84df0cc0 100644 --- a/spec/core_functions/color/channel/oklab.hrx +++ b/spec/core_functions/color/channel/oklab.hrx @@ -1,5 +1,5 @@ <===> local/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(oklab(0.5 -1 50%), "lightness")} <===> local/lightness/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(oklab(0.5 -1 50%), "a")} <===> local/a/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(oklab(0.5 -1 50%), "b")} <===> local/b/output.css diff --git a/spec/core_functions/color/channel/oklch.hrx b/spec/core_functions/color/channel/oklch.hrx index 2620a130a5..e9987c9483 100644 --- a/spec/core_functions/color/channel/oklch.hrx +++ b/spec/core_functions/color/channel/oklch.hrx @@ -1,5 +1,5 @@ <===> local/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(oklch(0.3 80% 30), "lightness")} <===> local/lightness/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(oklch(0.3 80% 30), "chroma")} <===> local/a/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(oklch(0.3 80% 30), "hue")} <===> local/b/output.css diff --git a/spec/core_functions/color/channel/positional.hrx b/spec/core_functions/color/channel/positional.hrx index 212bad64af..b1aeb10f4b 100644 --- a/spec/core_functions/color/channel/positional.hrx +++ b/spec/core_functions/color/channel/positional.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(oklch(60% 70% 0.6turn), "red", rgb)} <===> output.css diff --git a/spec/core_functions/color/channel/prophoto-rgb.hrx b/spec/core_functions/color/channel/prophoto-rgb.hrx index 32e7116738..23ddb0ad6c 100644 --- a/spec/core_functions/color/channel/prophoto-rgb.hrx +++ b/spec/core_functions/color/channel/prophoto-rgb.hrx @@ -1,5 +1,5 @@ <===> local/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(prophoto-rgb 0.2 0.5 0.8), "red")} <===> local/red/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(prophoto-rgb 0.2 0.5 0.8), "green")} <===> local/green/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(prophoto-rgb 0.2 0.5 0.8), "blue")} <===> local/blue/output.css diff --git a/spec/core_functions/color/channel/rec2020.hrx b/spec/core_functions/color/channel/rec2020.hrx index 1daa6eecc7..ed636db547 100644 --- a/spec/core_functions/color/channel/rec2020.hrx +++ b/spec/core_functions/color/channel/rec2020.hrx @@ -1,5 +1,5 @@ <===> local/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(rec2020 0.2 0.5 0.8), "red")} <===> local/red/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(rec2020 0.2 0.5 0.8), "green")} <===> local/green/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(rec2020 0.2 0.5 0.8), "blue")} <===> local/blue/output.css diff --git a/spec/core_functions/color/channel/rgb.hrx b/spec/core_functions/color/channel/rgb.hrx index dfc8674ff4..339047ff87 100644 --- a/spec/core_functions/color/channel/rgb.hrx +++ b/spec/core_functions/color/channel/rgb.hrx @@ -1,5 +1,5 @@ <===> local/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(#abcdef, "red")} <===> local/red/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(#abcdef, "green")} <===> local/green/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(#abcdef, "blue")} <===> local/blue/output.css diff --git a/spec/core_functions/color/channel/srgb-linear.hrx b/spec/core_functions/color/channel/srgb-linear.hrx index ab8863b11d..855d017f8f 100644 --- a/spec/core_functions/color/channel/srgb-linear.hrx +++ b/spec/core_functions/color/channel/srgb-linear.hrx @@ -1,5 +1,5 @@ <===> local/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(srgb-linear 0.2 0.5 0.8), "red")} <===> local/red/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(srgb-linear 0.2 0.5 0.8), "green")} <===> local/green/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(srgb-linear 0.2 0.5 0.8), "blue")} <===> local/blue/output.css diff --git a/spec/core_functions/color/channel/srgb.hrx b/spec/core_functions/color/channel/srgb.hrx index 867c9791b1..253a0905c2 100644 --- a/spec/core_functions/color/channel/srgb.hrx +++ b/spec/core_functions/color/channel/srgb.hrx @@ -1,5 +1,5 @@ <===> local/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(srgb 0.2 0.5 0.8), "red")} <===> local/red/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(srgb 0.2 0.5 0.8), "green")} <===> local/green/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(srgb 0.2 0.5 0.8), "blue")} <===> local/blue/output.css diff --git a/spec/core_functions/color/channel/xyz-d50.hrx b/spec/core_functions/color/channel/xyz-d50.hrx index 940553329c..aecd360bc7 100644 --- a/spec/core_functions/color/channel/xyz-d50.hrx +++ b/spec/core_functions/color/channel/xyz-d50.hrx @@ -1,5 +1,5 @@ <===> local/x/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(xyz-d50 -0.2 0.5 1.8), "x")} <===> local/x/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/y/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(xyz-d50 -0.2 0.5 1.8), "y")} <===> local/y/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/z/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(xyz-d50 -0.2 0.5 1.8), "z")} <===> local/z/output.css diff --git a/spec/core_functions/color/channel/xyz.hrx b/spec/core_functions/color/channel/xyz.hrx index b00abf32da..2c2ea7a5c7 100644 --- a/spec/core_functions/color/channel/xyz.hrx +++ b/spec/core_functions/color/channel/xyz.hrx @@ -1,5 +1,5 @@ <===> local/x/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(xyz-d65 -0.2 0.5 1.8), "x")} <===> local/x/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local/y/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(xyz-d65 -0.2 0.5 1.8), "y")} <===> local/y/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local/z/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.channel(color(xyz-d65 -0.2 0.5 1.8), "z")} <===> local/z/output.css diff --git a/spec/core_functions/color/complement.hrx b/spec/core_functions/color/complement.hrx index bcca07395e..a067dfd953 100644 --- a/spec/core_functions/color/complement.hrx +++ b/spec/core_functions/color/complement.hrx @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> space/legacy/to_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(red, $space: hwb)} <===> space/legacy/to_legacy/output.css @@ -80,7 +80,7 @@ a { <===> ================================================================================ <===> space/legacy/to_modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(red, $space: oklch)} <===> space/legacy/to_modern/output.css @@ -91,7 +91,7 @@ a { <===> ================================================================================ <===> space/modern/to_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(lab(50% 10 -20), $space: hsl)} <===> space/modern/to_legacy/output.css @@ -102,7 +102,7 @@ a { <===> ================================================================================ <===> space/modern/to_modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(lab(50% 10 -20), $space: oklch)} <===> space/modern/to_modern/output.css @@ -113,7 +113,7 @@ a { <===> ================================================================================ <===> space/missing/legacy/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hsl(0deg 50% none))} <===> space/missing/legacy/same/implicit/output.css @@ -124,7 +124,7 @@ a { <===> ================================================================================ <===> space/missing/legacy/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hsl(0deg 50% none), $space: hsl)} <===> space/missing/legacy/same/explicit/output.css @@ -135,7 +135,7 @@ a { <===> ================================================================================ <===> space/missing/legacy/different/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hwb(0deg 50% none))} <===> space/missing/legacy/different/implicit/output.css @@ -146,7 +146,7 @@ a { <===> ================================================================================ <===> space/missing/legacy/different/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hwb(0deg 50% none), $space: hsl)} <===> space/missing/legacy/different/explicit/output.css @@ -157,7 +157,7 @@ a { <===> ================================================================================ <===> space/missing/modern/same/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(lch(none 50% 0deg), $space: hsl)} <===> space/missing/modern/same/output.css @@ -168,7 +168,7 @@ a { <===> ================================================================================ <===> space/missing/modern/different/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(color(srgb none 100 200), $space: oklch)} <===> space/missing/modern/different/output.css @@ -179,7 +179,7 @@ a { <===> ================================================================================ <===> space/missing/modern/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(lch(none 50% 0deg), $space: oklch)} <===> space/missing/modern/analogous/output.css @@ -190,7 +190,7 @@ a { <===> ================================================================================ <===> space/powerless/legacy/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hsl(0deg 0% 50%))} <===> space/powerless/legacy/implicit/output.css @@ -284,7 +284,7 @@ Error: $space: Color space xyz doesn't have a hue channel. <===> ================================================================================ <===> error/space/missing/legacy/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hsl(none 30% 40%))} <===> error/space/missing/legacy/same/implicit/error @@ -298,7 +298,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> error/space/missing/legacy/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hsl(none 30% 40%), $space: hsl)} <===> error/space/missing/legacy/same/explicit/error @@ -312,7 +312,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> error/space/missing/legacy/analogous/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hsl(none 30% 40%), $space: lch)} <===> error/space/missing/legacy/analogous/hue/error @@ -328,7 +328,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> error/space/missing/legacy/analogous/lightness/input.scss // This is an error specifically because hsl(0deg 50% none) converts through // rgb(0 0 0) to lch(none 0 none), so adjusting the hue fails. -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(hsl(0deg 50% none), $space: lch)} <===> error/space/missing/legacy/analogous/lightness/error @@ -342,7 +342,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> error/space/missing/modern/same/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(lch(40% 30% none), $space: hsl)} <===> error/space/missing/modern/same/error @@ -356,7 +356,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> error/space/missing/modern/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(lch(40% 30% none), $space: lch)} <===> error/space/missing/modern/analogous/error @@ -370,7 +370,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> error/space/powerless/legacy/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(grey, $space: hsl)} <===> error/space/powerless/legacy/explicit/error @@ -384,7 +384,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> error/space/powerless/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.complement(lab(50% 0 0), $space: lch)} <===> error/space/powerless/modern/error diff --git a/spec/core_functions/color/grayscale.hrx b/spec/core_functions/color/grayscale.hrx index ac27b818e4..68ce5c3466 100644 --- a/spec/core_functions/color/grayscale.hrx +++ b/spec/core_functions/color/grayscale.hrx @@ -1,5 +1,5 @@ <===> legacy/no_saturation/white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(white)} <===> legacy/no_saturation/white/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> legacy/no_saturation/black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(black)} <===> legacy/no_saturation/black/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> legacy/no_saturation/gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(#494949)} <===> legacy/no_saturation/gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> legacy/max_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(red)} <===> legacy/max_saturation/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> legacy/mid_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(#633736)} <===> legacy/mid_saturation/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> legacy/alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(rgba(#633736, 0.3))} <===> legacy/alpha/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> legacy/powerless/same/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(hsl(120deg 10% 20%))} <===> legacy/powerless/same/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> legacy/powerless/different/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(hwb(120deg 10% 20%))} <===> legacy/powerless/different/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> legacy/missing/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(hsl(none none none))} <===> legacy/missing/output.css @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> number/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(1)} <===> number/output.css @@ -161,7 +161,7 @@ Recommendation: grayscale(1) <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale($color: white)} <===> named/output.css @@ -172,7 +172,7 @@ a { <===> ================================================================================ <===> modern/rectangular/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(lab(50 -30 40))} <===> modern/rectangular/output.css @@ -183,7 +183,7 @@ a { <===> ================================================================================ <===> modern/polar/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(lch(54.3 107 40.9))} <===> modern/polar/output.css @@ -194,7 +194,7 @@ a { <===> ================================================================================ <===> modern/predefined/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(color(xyz-d65 0.41 0.21 0.02))} <===> modern/predefined/output.css @@ -205,7 +205,7 @@ a { <===> ================================================================================ <===> modern/powerless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(oklch(20% 10% 120deg))} <===> modern/powerless/output.css @@ -216,7 +216,7 @@ a { <===> ================================================================================ <===> modern/missing/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(oklch(none none none))} <===> modern/missing/output.css @@ -227,7 +227,7 @@ a { <===> ================================================================================ <===> error/too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale()} <===> error/too_few_args/error @@ -245,7 +245,7 @@ Error: Missing argument $color. <===> ================================================================================ <===> error/too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(red, 1)} <===> error/too_many_args/error @@ -263,7 +263,7 @@ Error: Only 1 argument allowed, but 2 were passed. <===> ================================================================================ <===> error/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(c)} <===> error/type/error @@ -277,7 +277,7 @@ Error: $color: c is not a color. <===> ================================================================================ <===> error/with_module/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.grayscale(var(--c))} <===> error/with_module/type/error diff --git a/spec/core_functions/color/green.hrx b/spec/core_functions/color/green.hrx index 8e858667df..df45a7183f 100644 --- a/spec/core_functions/color/green.hrx +++ b/spec/core_functions/color/green.hrx @@ -138,7 +138,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.green(color(srgb 1 1 1))} <===> error/non_legacy/error diff --git a/spec/core_functions/color/hue.hrx b/spec/core_functions/color/hue.hrx index 11dbc1e9eb..a21198993c 100644 --- a/spec/core_functions/color/hue.hrx +++ b/spec/core_functions/color/hue.hrx @@ -207,7 +207,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hue(lch(0% 0 0deg))} <===> error/non_legacy/error diff --git a/spec/core_functions/color/hwb/error/five_args.hrx b/spec/core_functions/color/hwb/error/five_args.hrx index 3101c968bc..8828d7efc9 100644 --- a/spec/core_functions/color/hwb/error/five_args.hrx +++ b/spec/core_functions/color/hwb/error/five_args.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, 40%, 0.5, 0)} <===> error diff --git a/spec/core_functions/color/hwb/error/four_args.hrx b/spec/core_functions/color/hwb/error/four_args.hrx index f111792526..7a1e87c7ff 100644 --- a/spec/core_functions/color/hwb/error/four_args.hrx +++ b/spec/core_functions/color/hwb/error/four_args.hrx @@ -1,5 +1,5 @@ <===> hue/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb("foo", 30%, 40%, 0.5)} <===> hue/type/error @@ -13,7 +13,7 @@ Error: Expected hue channel to be a number, was "foo". <===> ================================================================================ <===> whiteness/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, "foo", 40%, 0.5)} <===> whiteness/type/error @@ -27,7 +27,7 @@ Error: Expected whiteness channel to be a number, was "foo". <===> ================================================================================ <===> whiteness/unit/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30, 40%, 0.5)} <===> whiteness/unit/none/error @@ -41,7 +41,7 @@ Error: $whiteness: Expected 30 to have unit "%". <===> ================================================================================ <===> whiteness/unit/wrong/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30px, 40%, 0.5)} <===> whiteness/unit/wrong/error @@ -55,7 +55,7 @@ Error: $whiteness: Expected 30px to have unit "%". <===> ================================================================================ <===> blackness/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, "foo", 0.5)} <===> blackness/type/error @@ -69,7 +69,7 @@ Error: Expected blackness channel to be a number, was "foo". <===> ================================================================================ <===> blackness/unit/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, 40, 0.5)} <===> blackness/unit/none/error @@ -83,7 +83,7 @@ Error: $blackness: Expected 40 to have unit "%". <===> ================================================================================ <===> blackness/unit/wrong/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, 40px, 0.5)} <===> blackness/unit/wrong/error @@ -97,7 +97,7 @@ Error: $blackness: Expected 40px to have unit "%". <===> ================================================================================ <===> alpha/unit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 0.5px)} <===> alpha/unit/error diff --git a/spec/core_functions/color/hwb/error/one_arg.hrx b/spec/core_functions/color/hwb/error/one_arg.hrx index eefa0a578e..0f15c8f647 100644 --- a/spec/core_functions/color/hwb/error/one_arg.hrx +++ b/spec/core_functions/color/hwb/error/one_arg.hrx @@ -1,5 +1,5 @@ <===> list/empty/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(())} <===> list/empty/error @@ -13,7 +13,7 @@ Error: $channels: Color component list may not be empty. <===> ================================================================================ <===> list/comma_separated/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb((0, 30%, 40%))} <===> list/comma_separated/error @@ -27,7 +27,7 @@ Error: $channels: Expected a space- or slash-separated list, was (0, 30%, 40%) <===> ================================================================================ <===> list/bracketed/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb([0 30% 40%])} <===> list/bracketed/error @@ -41,7 +41,7 @@ Error: $channels: Expected an unbracketed list, was [0 30% 40%] <===> ================================================================================ <===> list/one_element/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0)} <===> list/one_element/error @@ -55,7 +55,7 @@ Error: $channels: The hwb color space has 3 channels but 0 has 1. <===> ================================================================================ <===> list/two_elements/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30%)} <===> list/two_elements/error @@ -69,7 +69,7 @@ Error: $channels: The hwb color space has 3 channels but (0 30%) has 2. <===> ================================================================================ <===> list/four_elements/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% 40% 0.4)} <===> list/four_elements/error @@ -83,7 +83,7 @@ Error: $channels: The hwb color space has 3 channels but (0 30% 40% 0.4) has 4. <===> ================================================================================ <===> hue/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb("foo" 30% 40%)} <===> hue/type/error @@ -97,7 +97,7 @@ Error: $channels: Expected hue channel to be a number, was "foo". <===> ================================================================================ <===> whiteness/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 "foo" 40%)} <===> whiteness/type/error @@ -111,7 +111,7 @@ Error: $channels: Expected whiteness channel to be a number, was "foo". <===> ================================================================================ <===> whiteness/unit/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30 40%)} <===> whiteness/unit/none/error @@ -125,7 +125,7 @@ Error: $whiteness: Expected 30 to have unit "%". <===> ================================================================================ <===> whiteness/unit/wrong/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30px 40%)} <===> whiteness/unit/wrong/error @@ -139,7 +139,7 @@ Error: $whiteness: Expected 30px to have unit "%". <===> ================================================================================ <===> blackness/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% "foo")} <===> blackness/type/error @@ -153,7 +153,7 @@ Error: $channels: Expected blackness channel to be a number, was "foo". <===> ================================================================================ <===> blackness/unit/none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% 40)} <===> blackness/unit/none/error @@ -167,7 +167,7 @@ Error: $blackness: Expected 40 to have unit "%". <===> ================================================================================ <===> blackness/unit/wrong/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% 40px)} <===> blackness/unit/wrong/error @@ -181,7 +181,7 @@ Error: $blackness: Expected 40px to have unit "%". <===> ================================================================================ <===> alpha/unit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 0% 0% / 0.5px)} <===> alpha/unit/error @@ -195,7 +195,7 @@ Error: $alpha: Expected 0.5px to have unit "%" or no units. <===> ================================================================================ <===> quoted_var_slash/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% "var(--foo) / 0.4")} <===> quoted_var_slash/error diff --git a/spec/core_functions/color/hwb/error/three_args.hrx b/spec/core_functions/color/hwb/error/three_args.hrx index 3de2ce26ce..c162afcc03 100644 --- a/spec/core_functions/color/hwb/error/three_args.hrx +++ b/spec/core_functions/color/hwb/error/three_args.hrx @@ -1,5 +1,5 @@ <===> hue/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb("foo", 100%, 50%)} <===> hue/type/error @@ -13,7 +13,7 @@ Error: Expected hue channel to be a number, was "foo". <===> ================================================================================ <===> whiteness/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, "foo", 50%)} <===> whiteness/type/error @@ -27,7 +27,7 @@ Error: Expected whiteness channel to be a number, was "foo". <===> ================================================================================ <===> blackness/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 100%, "foo")} <===> blackness/type/error diff --git a/spec/core_functions/color/hwb/error/two_args.hrx b/spec/core_functions/color/hwb/error/two_args.hrx index d5f6cc76ec..c247beb1c7 100644 --- a/spec/core_functions/color/hwb/error/two_args.hrx +++ b/spec/core_functions/color/hwb/error/two_args.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(#123, 0.5)} <===> error diff --git a/spec/core_functions/color/hwb/error/zero_args.hrx b/spec/core_functions/color/hwb/error/zero_args.hrx index 508a69d7bf..0fe1fe4e81 100644 --- a/spec/core_functions/color/hwb/error/zero_args.hrx +++ b/spec/core_functions/color/hwb/error/zero_args.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb()} <===> error diff --git a/spec/core_functions/color/hwb/four_args.hrx b/spec/core_functions/color/hwb/four_args.hrx index 37ecedcae1..51e57a8454 100644 --- a/spec/core_functions/color/hwb/four_args.hrx +++ b/spec/core_functions/color/hwb/four_args.hrx @@ -1,5 +1,5 @@ <===> hue/var/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(var(--c), 30%, 40%, 0.5)} <===> hue/var/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/degenerate/positive_infinity/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(calc(infinity), 30%, 40%, 0.5)} <===> hue/degenerate/positive_infinity/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/degenerate/negative_infinity/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(calc(-infinity), 30%, 40%, 0.5)} <===> hue/degenerate/negative_infinity/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> hue/degenerate/nan/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(calc(NaN), 30%, 40%, 0.5)} <===> hue/degenerate/nan/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> whiteness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 101%, 40%, 0.5)} <===> whiteness/above_max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> whiteness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, -1%, 40%, 0.5)} <===> whiteness/below_min/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> whiteness/var/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, var(--c), 40%, 0.5)} <===> whiteness/var/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> whiteness/degenerate/positive_infinity/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, calc(infinity * 1%), 40%, 0.5)} <===> whiteness/degenerate/positive_infinity/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> whiteness/degenerate/negative_infinity/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, calc(-infinity * 1%), 40%, 0.5)} <===> whiteness/degenerate/negative_infinity/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> whiteness/degenerate/nan/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, calc(NaN * 1%), 40%, 0.5)} <===> whiteness/degenerate/nan/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blackness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, 101%, 0.5)} <===> blackness/above_max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blackness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, -1%, 0.5)} <===> blackness/below_min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blackness/var/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, var(--c), 0.5)} <===> blackness/var/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blackness/degenerate/positive_infinity/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, calc(infinity * 1%), 0.5)} <===> blackness/degenerate/positive_infinity/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blackness/degenerate/negative_infinity/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, calc(-infinity * 1%), 0.5)} <===> blackness/degenerate/negative_infinity/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> blackness/degenerate/nan/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, calc(NaN * 1%), 0.5)} <===> blackness/degenerate/nan/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> alpha/percent/negative/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, -10%)} <===> alpha/percent/negative/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> alpha/percent/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 0%)} <===> alpha/percent/min/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> alpha/percent/positive/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 45.6%)} <===> alpha/percent/positive/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> alpha/percent/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 100%)} <===> alpha/percent/max/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> alpha/percent/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 250%)} <===> alpha/percent/above_max/output.css @@ -230,7 +230,7 @@ a { <===> ================================================================================ <===> alpha/unitless/negative/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, -10)} <===> alpha/unitless/negative/output.css @@ -241,7 +241,7 @@ a { <===> ================================================================================ <===> alpha/unitless/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 0)} <===> alpha/unitless/min/output.css @@ -252,7 +252,7 @@ a { <===> ================================================================================ <===> alpha/unitless/positive/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 0.456)} <===> alpha/unitless/positive/output.css @@ -263,7 +263,7 @@ a { <===> ================================================================================ <===> alpha/unitless/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 1)} <===> alpha/unitless/max/output.css @@ -274,7 +274,7 @@ a { <===> ================================================================================ <===> alpha/unitless/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, 250)} <===> alpha/unitless/above_max/output.css @@ -285,7 +285,7 @@ a { <===> ================================================================================ <===> alpha/var/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 0%, 0%, var(--c))} <===> alpha/var/output.css @@ -296,7 +296,7 @@ a { <===> ================================================================================ <===> alpha/degenerate/positive_infinity/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, 40%, calc(infinity))} <===> alpha/degenerate/positive_infinity/output.css @@ -307,7 +307,7 @@ a { <===> ================================================================================ <===> alpha/degenerate/negative_infinity/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, 40%, calc(-infinity))} <===> alpha/degenerate/negative_infinity/output.css @@ -318,7 +318,7 @@ a { <===> ================================================================================ <===> alpha/degenerate/nan/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0, 30%, 40%, calc(NaN))} <===> alpha/degenerate/nan/output.css @@ -329,7 +329,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb($hue: 180, $whiteness: 30%, $blackness: 40%, $alpha: 0.4)} <===> named/output.css diff --git a/spec/core_functions/color/hwb/one_arg.hrx b/spec/core_functions/color/hwb/one_arg.hrx index 401490f657..65fdb7a8a1 100644 --- a/spec/core_functions/color/hwb/one_arg.hrx +++ b/spec/core_functions/color/hwb/one_arg.hrx @@ -1,5 +1,5 @@ <===> hue/var/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(var(--c) 30% 40%)} <===> hue/var/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> whiteness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 101% 40%)} <===> whiteness/above_max/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> whiteness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 -1% 40%)} <===> whiteness/below_min/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> whiteness/var/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 var(--c) 40%)} <===> whiteness/var/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> blackness/var/no_alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% var(--c))} <===> blackness/var/no_alpha/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> blackness/var/alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% var(--c) / 0.5)} <===> blackness/var/alpha/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> blackness/above_max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% 101%)} <===> blackness/above_max/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> blackness/below_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% -1%)} <===> blackness/below_min/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/in_gamut/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(180 30% 40% / 0)} <===> alpha/in_gamut/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> alpha/in_gamut/opaque/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(180 30% 40% / 1)} <===> alpha/in_gamut/opaque/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> alpha/in_gamut/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(180 30% 40% / 0.5)} <===> alpha/in_gamut/partial/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> alpha/in_gamut/named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb($channels: 180 30% 40% / 0.4)} <===> alpha/in_gamut/named/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> alpha/in_gamut/parenthesized/input.scss -@use 'sass:color'; +@use "sass:color"; // Extra parens shouldn't cause the slash to be forced into division. a {b: (color.hwb(180 30% 40% / 0.4))} @@ -144,7 +144,7 @@ a { <===> ================================================================================ <===> alpha/var/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 0 0 / var(--c))} <===> alpha/var/output.css @@ -155,7 +155,7 @@ a { <===> ================================================================================ <===> alpha/clamped/above/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% 40% / 1.1)} <===> alpha/clamped/above/output.css @@ -166,7 +166,7 @@ a { <===> ================================================================================ <===> alpha/clamped/below/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0 30% 40% / -0.1)} <===> alpha/clamped/below/output.css @@ -177,7 +177,7 @@ a { <===> ================================================================================ <===> no_alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(180 30% 40%)} <===> no_alpha/output.css @@ -188,7 +188,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb($channels: 180 30% 40% / 0.4)} <===> named/output.css diff --git a/spec/core_functions/color/hwb/three_args/bounds.hrx b/spec/core_functions/color/hwb/three_args/bounds.hrx index 05e6750290..200dd6a649 100644 --- a/spec/core_functions/color/hwb/three_args/bounds.hrx +++ b/spec/core_functions/color/hwb/three_args/bounds.hrx @@ -1,5 +1,5 @@ <===> whiteness/above/blackness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 150%, 0%)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> whiteness/above/blackness/mid/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 150%, 10%)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> whiteness/above/blackness/above/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 150%, 120%)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> whiteness/above/blackness/below/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 150%, -20%)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> whiteness/below/blackness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, -50%, 0%)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> whiteness/below/blackness/mid/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, -50%, 10%)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> whiteness/below/blackness/above/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, -50%, 120%)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> whiteness/below/blackness/below/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, -50%, -20%)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> blackness/above/whiteness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 0%, 150%)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> blackness/above/whiteness/mid/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 10%, 150%)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> blackness/above/whiteness/above/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 120%, 150%)); @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blackness/above/whiteness/below/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, -20%, 150%)); @@ -167,7 +167,7 @@ a { <===> ================================================================================ <===> blackness/below/whiteness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 0%, -50%)); @@ -181,7 +181,7 @@ a { <===> ================================================================================ <===> blackness/below/whiteness/mid/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 10%, -50%)); @@ -195,7 +195,7 @@ a { <===> ================================================================================ <===> blackness/below/whiteness/above/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, 120%, -50%)); @@ -209,7 +209,7 @@ a { <===> ================================================================================ <===> blackness/below/whiteness/below/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.hwb(0, -20%, -50%)); diff --git a/spec/core_functions/color/hwb/three_args/named.hrx b/spec/core_functions/color/hwb/three_args/named.hrx index 7999c4908f..63ff9dc833 100644 --- a/spec/core_functions/color/hwb/three_args/named.hrx +++ b/spec/core_functions/color/hwb/three_args/named.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb($hue: 0, $whiteness: 30%, $blackness: 40%)} <===> output.css diff --git a/spec/core_functions/color/hwb/three_args/units.hrx b/spec/core_functions/color/hwb/three_args/units.hrx index d34dca9a6d..7e6f17ec55 100644 --- a/spec/core_functions/color/hwb/three_args/units.hrx +++ b/spec/core_functions/color/hwb/three_args/units.hrx @@ -1,5 +1,5 @@ <===> hue/deg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(0deg, 30%, 40%)} <===> hue/deg/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/rad/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(1rad, 30%, 40%)} <===> hue/rad/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/non_angle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.hwb(1in, 30%, 40%)} <===> hue/non_angle/output.css diff --git a/spec/core_functions/color/hwb/three_args/w3c/_test-hue.scss b/spec/core_functions/color/hwb/three_args/w3c/_test-hue.scss index 5d0189bb9e..de9d06e190 100644 --- a/spec/core_functions/color/hwb/three_args/w3c/_test-hue.scss +++ b/spec/core_functions/color/hwb/three_args/w3c/_test-hue.scss @@ -1,4 +1,4 @@ -@use 'sass:color'; +@use "sass:color"; @mixin test-hue($hue) { @for $whiteness from 0 through 5 { diff --git a/spec/core_functions/color/invert/alpha.hrx b/spec/core_functions/color/invert/alpha.hrx index f29372f18e..efcb8880dd 100644 --- a/spec/core_functions/color/invert/alpha.hrx +++ b/spec/core_functions/color/invert/alpha.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(rgba(turquoise, 0.4))} <===> output.css diff --git a/spec/core_functions/color/invert/error.hrx b/spec/core_functions/color/invert/error.hrx index 5d5b31f41d..8c17ee6535 100644 --- a/spec/core_functions/color/invert/error.hrx +++ b/spec/core_functions/color/invert/error.hrx @@ -1,5 +1,5 @@ <===> too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert()} <===> too_few_args/error @@ -17,7 +17,7 @@ Error: Missing argument $color. <===> ================================================================================ <===> too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise, 0%, hsl, 1)} <===> too_many_args/error @@ -165,7 +165,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> type/color/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(c)} <===> type/color/error @@ -179,7 +179,7 @@ Error: $color: c is not a color. <===> ================================================================================ <===> type/weight/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(red, c)} <===> type/weight/error @@ -193,7 +193,7 @@ Error: $weight: c is not a number. <===> ================================================================================ <===> type/space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(red, 10%, 1)} <===> type/space/error @@ -207,7 +207,7 @@ Error: $space: 1 is not a string. <===> ================================================================================ <===> space/quoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(red, 10%, "lch")} <===> space/quoted/error @@ -221,7 +221,7 @@ Error: $space: Expected "lch" to be an unquoted string. <===> ================================================================================ <===> space/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(red, 10%, c)} <===> space/unknown/error @@ -235,7 +235,7 @@ Error: $space: Unknown color space "c". <===> ================================================================================ <===> space/missing/default_weight/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lab(50% -10 10))} <===> space/missing/default_weight/error @@ -249,7 +249,7 @@ Error: $color: To use color.invert() with non-legacy color lab(50% -10 10), you <===> ================================================================================ <===> space/missing/zero_weight/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lab(50% -10 10), 0%)} <===> space/missing/zero_weight/error @@ -263,7 +263,7 @@ Error: $color: To use color.invert() with non-legacy color lab(50% -10 10), you <===> ================================================================================ <===> bounds/too_low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(red, -0.001%)} <===> bounds/too_low/error @@ -277,7 +277,7 @@ Error: $weight: Expected -0.001% to be within 0% and 100%. <===> ================================================================================ <===> bounds/too_high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(red, 100.001%)} <===> bounds/too_high/error diff --git a/spec/core_functions/color/invert/legacy.hrx b/spec/core_functions/color/invert/legacy.hrx index 38670ab456..b3720d9239 100644 --- a/spec/core_functions/color/invert/legacy.hrx +++ b/spec/core_functions/color/invert/legacy.hrx @@ -1,5 +1,5 @@ <===> no_space/white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(white)} <===> no_space/white/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> no_space/black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(black)} <===> no_space/black/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> no_space/gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(gray)} <===> no_space/gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> no_space/turquoise/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise)} <===> no_space/turquoise/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> no_space/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect( color.invert(color.change(rgb(0 50 0), $red: -100, $blue: 500)) @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> no_space/weighted/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise, 0%)} <===> no_space/weighted/min/output.css @@ -70,7 +70,7 @@ a { <===> ================================================================================ <===> no_space/weighted/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise, 100%)} <===> no_space/weighted/max/output.css @@ -81,7 +81,7 @@ a { <===> ================================================================================ <===> no_space/weighted/middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise, 50%)} <===> no_space/weighted/middle/output.css @@ -92,7 +92,7 @@ a { <===> ================================================================================ <===> no_space/weighted/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise, 23%)} <===> no_space/weighted/low/output.css @@ -103,7 +103,7 @@ a { <===> ================================================================================ <===> no_space/weighted/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise, 92%)} <===> no_space/weighted/high/output.css @@ -114,7 +114,7 @@ a { <===> ================================================================================ <===> no_space/hsl/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hsl(30deg 20% 40%))} <===> no_space/hsl/output.css @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> no_space/hwb/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hsl(30deg 20% 40%))} <===> no_space/hwb/output.css @@ -136,7 +136,7 @@ a { <===> ================================================================================ <===> space/hsl/no_missing/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hsl(30deg 20% 40%), $space: hsl)} <===> space/hsl/no_missing/output.css @@ -147,7 +147,7 @@ a { <===> ================================================================================ <===> space/hsl/missing/same/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hsl(30deg none 40%), $space: hsl)} <===> space/hsl/missing/same/output.css @@ -158,7 +158,7 @@ a { <===> ================================================================================ <===> space/hsl/missing/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hsl(30deg none 40%), $space: lch)} <===> space/hsl/missing/analogous/error @@ -172,7 +172,7 @@ Error: $hue: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> space/hwb/no_missing/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hwb(30deg 20% 40%), $space: hwb)} <===> space/hwb/no_missing/output.css @@ -183,7 +183,7 @@ a { <===> ================================================================================ <===> space/hwb/missing/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hwb(30deg none 40%), $space: hwb)} <===> space/hwb/missing/output.css @@ -194,7 +194,7 @@ a { <===> ================================================================================ <===> space/powerless/same/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hsl(120deg 0% 40%), $space: hsl)} <===> space/powerless/same/output.css @@ -205,7 +205,7 @@ a { <===> ================================================================================ <===> space/powerless/different/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(hsl(120deg 0% 40%), $space: rgb)} <===> space/powerless/different/output.css @@ -216,7 +216,7 @@ a { <===> ================================================================================ <===> space/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(#abcdef, $space: display-p3)} <===> space/modern/output.css @@ -227,7 +227,7 @@ a { <===> ================================================================================ <===> units/weight/unitless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise, 10)} <===> units/weight/unitless/output.css @@ -251,7 +251,7 @@ More info: https://sass-lang.com/d/function-units <===> ================================================================================ <===> units/weight/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(turquoise, 10px)} <===> units/weight/unknown/output.css diff --git a/spec/core_functions/color/invert/modern.hrx b/spec/core_functions/color/invert/modern.hrx index ee583bbc16..bee9768452 100644 --- a/spec/core_functions/color/invert/modern.hrx +++ b/spec/core_functions/color/invert/modern.hrx @@ -1,5 +1,5 @@ <===> zero_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(color(rec2020 0 0.4 1), $space: rec2020)} <===> zero_min/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> negative_min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lab(20% -30 110), $space: lab)} <===> negative_min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> polar/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lch(20% 80 50deg), $space: lch)} <===> polar/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> weight/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(color(a98-rgb 0.1 0.4 0.8), 0%, $space: a98-rgb)} <===> weight/min/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> weight/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(color(a98-rgb 0.1 0.4 0.8), 100%, $space: a98-rgb)} <===> weight/max/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> weight/middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(color(a98-rgb 0.1 0.4 0.8), 50%, $space: a98-rgb)} <===> weight/middle/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> weight/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(color(a98-rgb 0.1 0.4 0.8), 60%, $space: a98-rgb)} <===> weight/high/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> space/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lch(20% 80 50deg), $space: xyz)} <===> space/modern/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> space/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lch(20% 80 50deg), $space: rgb)} <===> space/legacy/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> space/case/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lch(20% 80 50deg), $space: DISPLAY-p3)} <===> space/case/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> space/missing_converted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(color(rec2020 none none none), $space: lab)} <===> space/missing_converted/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> space/powerless/same/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lch(40% 0% 120deg), $space: lch)} <===> space/powerless/same/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> space/powerless/different/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(lch(40% 0% 120deg), $space: lab)} <===> space/powerless/different/output.css diff --git a/spec/core_functions/color/invert/named.hrx b/spec/core_functions/color/invert/named.hrx index 70d91937f7..02e4c50045 100644 --- a/spec/core_functions/color/invert/named.hrx +++ b/spec/core_functions/color/invert/named.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert($color: turquoise, $weight: 10%, $space: oklch)} <===> output.css diff --git a/spec/core_functions/color/invert/number.hrx b/spec/core_functions/color/invert/number.hrx index a2b70e5ffc..78daa6edd6 100644 --- a/spec/core_functions/color/invert/number.hrx +++ b/spec/core_functions/color/invert/number.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.invert(1)} <===> output.css diff --git a/spec/core_functions/color/is_missing.hrx b/spec/core_functions/color/is_missing.hrx index 44b5335759..b545e79eb2 100644 --- a/spec/core_functions/color/is_missing.hrx +++ b/spec/core_functions/color/is_missing.hrx @@ -1,5 +1,5 @@ <===> false/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(#abcdef, "red")} <===> false/explicit/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> false/not_powerless/converted/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(color.to-space(#aaaaab, lch), "hue")} <===> false/not_powerless/converted/non_legacy/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> false/not_powerless/converted/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(color.to-space(#aaaaab, hsl), "hue")} <===> false/not_powerless/converted/legacy/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> false/not_powerless/direct/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(lch(50% 1% 0deg), "hue")} <===> false/not_powerless/direct/non_legacy/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> false/not_powerless/direct/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(hsl(0deg 50% 1%), "hue")} <===> false/not_powerless/direct/legacy/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> false/powerless/direct/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(lch(50% 0% 0deg), "hue")} <===> false/powerless/direct/non_legacy/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> false/powerless/direct/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(hsl(0deg 50% 0%), "hue")} <===> false/powerless/direct/legacy/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> false/powerless/converted/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(color.to-space(#aaaaaa, hsl), "hue")} <===> false/powerless/converted/legacy/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> true/explicit/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(lab(50% 30 none), "b")} <===> true/explicit/non_legacy/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> true/explicit/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(rgb(none 30 100), "red")} <===> true/explicit/legacy/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> true/powerless/converted/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(color.to-space(#aaaaaa, lch), "hue")} <===> true/powerless/converted/non_legacy/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing($color: black, $channel: "red")} <===> named/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> error/too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(black)} <===> error/too_few_args/error @@ -149,7 +149,7 @@ Error: Missing argument $channel. <===> ================================================================================ <===> error/too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(black, "red", rgb)} <===> error/too_many_args/error @@ -167,7 +167,7 @@ Error: Only 2 arguments allowed, but 3 were passed. <===> ================================================================================ <===> error/type/color/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing("black", "red")} <===> error/type/color/error @@ -181,7 +181,7 @@ Error: $color: "black" is not a color. <===> ================================================================================ <===> error/type/channel/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(black, red)} <===> error/type/channel/error @@ -195,7 +195,7 @@ Error: $channel: red is not a string. <===> ================================================================================ <===> error/channel/wrong_space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(black, "hue")} <===> error/channel/wrong_space/error @@ -209,7 +209,7 @@ Error: $channel: Color black doesn't have a channel named "hue". <===> ================================================================================ <===> error/channel/unquoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(hsl(0deg 50% 50%), hue)} <===> error/channel/unquoted/error @@ -223,7 +223,7 @@ Error: $channel: Expected hue to be a quoted string. <===> ================================================================================ <===> error/channel/wrong_case/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-missing(black, "RED")} <===> error/channel/wrong_case/error diff --git a/spec/core_functions/color/is_powerless/error.hrx b/spec/core_functions/color/is_powerless/error.hrx index be2c06c401..8011f86f8e 100644 --- a/spec/core_functions/color/is_powerless/error.hrx +++ b/spec/core_functions/color/is_powerless/error.hrx @@ -1,5 +1,5 @@ <===> too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black)} <===> too_few_args/error @@ -17,7 +17,7 @@ Error: Missing argument $channel. <===> ================================================================================ <===> too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black, "red", rgb, c)} <===> too_many_args/error @@ -35,7 +35,7 @@ Error: Only 3 arguments allowed, but 4 were passed. <===> ================================================================================ <===> type/color/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(c, "red")} <===> type/color/error @@ -49,7 +49,7 @@ Error: $color: c is not a color. <===> ================================================================================ <===> type/channel/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black, 1)} <===> type/channel/error @@ -63,7 +63,7 @@ Error: $channel: 1 is not a string. <===> ================================================================================ <===> type/space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black, "red", $space: 1)} <===> type/space/error @@ -77,7 +77,7 @@ Error: $space: 1 is not a string. <===> ================================================================================ <===> channel/unquoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hsl(0deg 0% 0%), hue)} <===> channel/unquoted/error @@ -91,7 +91,7 @@ Error: $channel: Expected hue to be a quoted string. <===> ================================================================================ <===> channel/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black, "c")} <===> channel/unknown/error @@ -105,7 +105,7 @@ Error: $channel: Color black doesn't have a channel named "c". <===> ================================================================================ <===> channel/wrong_space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black, "hue")} <===> channel/wrong_space/error @@ -119,7 +119,7 @@ Error: $channel: Color black doesn't have a channel named "hue". <===> ================================================================================ <===> channel/wrong_case/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black, "RED")} <===> channel/wrong_case/error @@ -133,7 +133,7 @@ Error: $channel: Color black doesn't have a channel named "RED". <===> ================================================================================ <===> space/quoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black, "red", $space: "rgb")} <===> space/quoted/error @@ -147,7 +147,7 @@ Error: $space: Expected "rgb" to be an unquoted string. <===> ================================================================================ <===> space/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(black, "red", $space: c)} <===> space/unknown/error diff --git a/spec/core_functions/color/is_powerless/hsl.hrx b/spec/core_functions/color/is_powerless/hsl.hrx index 5a7b5d1f1a..1cb72da4d7 100644 --- a/spec/core_functions/color/is_powerless/hsl.hrx +++ b/spec/core_functions/color/is_powerless/hsl.hrx @@ -1,5 +1,5 @@ <===> hue/positive_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hsl(0deg 50% 50%), "hue")} <===> hue/positive_saturation/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/zero_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hsl(0deg 0% 50%), "hue")} <===> hue/zero_saturation/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/near_zero_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hsl(0deg 0.000000000001% 50%), "hue")} <===> hue/near_zero_saturation/output.css @@ -34,7 +34,7 @@ a { <===> hue/full_lightness/input.scss // These used to be considered powerless by the CSS spec, but are no longer, so // Sass shouldn't consdier it powerless either. -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hsl(0deg 50% 100%), "hue")} <===> hue/full_lightness/output.css @@ -47,7 +47,7 @@ a { <===> hue/zero_lightness/input.scss // These used to be considered powerless by the CSS spec, but are no longer, so // Sass shouldn't consdier it powerless either. -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hsl(0deg 50% 0%), "hue")} <===> hue/zero_lightness/output.css @@ -64,7 +64,7 @@ Sass shouldn't consdier them powerless either. <===> ================================================================================ <===> saturation/full_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hsl(0deg 0% 100%), "saturation")} <===> saturation/full_lightness/output.css @@ -75,7 +75,7 @@ a { <===> ================================================================================ <===> saturation/zero_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hsl(0deg 0% 0%), "saturation")} <===> saturation/zero_lightness/output.css diff --git a/spec/core_functions/color/is_powerless/hwb.hrx b/spec/core_functions/color/is_powerless/hwb.hrx index 25781e3c70..2968d29e24 100644 --- a/spec/core_functions/color/is_powerless/hwb.hrx +++ b/spec/core_functions/color/is_powerless/hwb.hrx @@ -1,5 +1,5 @@ <===> hue/not_greyscale/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hwb(0deg 30% 40%), "hue")} <===> hue/not_greyscale/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/full_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hwb(0deg 100% 0%), "hue")} <===> hue/full_whiteness/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/full_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hwb(0deg 0% 100%), "hue")} <===> hue/full_blackness/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> hue/grey/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hwb(0deg 40% 60%), "hue")} <===> hue/grey/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> hue/normalized_grey/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hwb(0deg 60% 80%), "hue")} <===> hue/normalized_grey/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> hue/out_of_gamut/colorful/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hwb(0deg -30% 50%), "hue")} <===> hue/out_of_gamut/colorful/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> hue/out_of_gamut/grey/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(hwb(0deg -30% 130%), "hue")} <===> hue/out_of_gamut/grey/output.css diff --git a/spec/core_functions/color/is_powerless/lab.hrx b/spec/core_functions/color/is_powerless/lab.hrx index 5827957f15..30cf426b0c 100644 --- a/spec/core_functions/color/is_powerless/lab.hrx +++ b/spec/core_functions/color/is_powerless/lab.hrx @@ -5,7 +5,7 @@ Sass shouldn't consdier them powerless either. <===> ================================================================================ <===> a/full_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lab(100% 0 0), "a")} <===> a/full_lightness/output.css @@ -16,7 +16,7 @@ a { <===> ================================================================================ <===> a/zero_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lab(0% 0 0), "a")} <===> a/zero_lightness/output.css @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> b/full_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lab(100% 0 0), "b")} <===> b/full_lightness/output.css @@ -38,7 +38,7 @@ a { <===> ================================================================================ <===> b/zero_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lab(0% 0 0), "b")} <===> b/zero_lightness/output.css diff --git a/spec/core_functions/color/is_powerless/lch.hrx b/spec/core_functions/color/is_powerless/lch.hrx index af1e50e7ad..0f07f3f56e 100644 --- a/spec/core_functions/color/is_powerless/lch.hrx +++ b/spec/core_functions/color/is_powerless/lch.hrx @@ -1,5 +1,5 @@ <===> hue/positive_chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lch(50% 50% 0deg), "hue")} <===> hue/positive_chroma/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/zero_chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lch(50% 0% 0deg), "hue")} <===> hue/zero_chroma/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/near_zero_chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lch(50% 0.000000000001% 0deg), "hue")} <===> hue/near_zero_chroma/output.css @@ -34,7 +34,7 @@ a { <===> hue/full_lightness/input.scss // These used to be considered powerless by the CSS spec, but are no longer, so // Sass shouldn't consdier it powerless either. -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lch(100% 50% 0deg), "hue")} <===> hue/full_lightness/output.css @@ -47,7 +47,7 @@ a { <===> hue/zero_lightness/input.scss // These used to be considered powerless by the CSS spec, but are no longer, so // Sass shouldn't consdier it powerless either. -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lch(0% 50% 0deg), "hue")} <===> hue/zero_lightness/output.css @@ -64,7 +64,7 @@ Sass shouldn't consdier them powerless either. <===> ================================================================================ <===> chroma/full_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lch(100% 0% 0deg), "chroma")} <===> chroma/full_lightness/output.css @@ -75,7 +75,7 @@ a { <===> ================================================================================ <===> chroma/zero_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(lch(0% 0% 0deg), "chroma")} <===> chroma/zero_lightness/output.css diff --git a/spec/core_functions/color/is_powerless/named.hrx b/spec/core_functions/color/is_powerless/named.hrx index 3cd4a4c71e..2168d3a323 100644 --- a/spec/core_functions/color/is_powerless/named.hrx +++ b/spec/core_functions/color/is_powerless/named.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless($color: red, $channel: "a", $space: lab)} <===> output.css diff --git a/spec/core_functions/color/is_powerless/oklab.hrx b/spec/core_functions/color/is_powerless/oklab.hrx index b289ab0d3d..4c92e26e2f 100644 --- a/spec/core_functions/color/is_powerless/oklab.hrx +++ b/spec/core_functions/color/is_powerless/oklab.hrx @@ -5,7 +5,7 @@ Sass shouldn't consdier them powerless either. <===> ================================================================================ <===> a/full_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklab(100% 0 0), "a")} <===> a/full_lightness/output.css @@ -16,7 +16,7 @@ a { <===> ================================================================================ <===> a/zero_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklab(0% 0 0), "a")} <===> a/zero_lightness/output.css @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> b/full_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklab(100% 0 0), "b")} <===> b/full_lightness/output.css @@ -38,7 +38,7 @@ a { <===> ================================================================================ <===> b/zero_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklab(0% 0 0), "b")} <===> b/zero_lightness/output.css diff --git a/spec/core_functions/color/is_powerless/oklch.hrx b/spec/core_functions/color/is_powerless/oklch.hrx index a9b0bc7fb9..64d17911e8 100644 --- a/spec/core_functions/color/is_powerless/oklch.hrx +++ b/spec/core_functions/color/is_powerless/oklch.hrx @@ -1,5 +1,5 @@ <===> hue/positive_chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklch(50% 50% 0deg), "hue")} <===> hue/positive_chroma/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> hue/zero_chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklch(50% 0% 0deg), "hue")} <===> hue/zero_chroma/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> hue/near_zero_chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklch(50% 0.000000000001% 0deg), "hue")} <===> hue/near_zero_chroma/output.css @@ -34,7 +34,7 @@ a { <===> hue/full_lightness/input.scss // These used to be considered powerless by the CSS spec, but are no longer, so // Sass shouldn't consdier it powerless either. -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklch(100% 50% 0deg), "hue")} <===> hue/full_lightness/output.css @@ -47,7 +47,7 @@ a { <===> hue/zero_lightness/input.scss // These used to be considered powerless by the CSS spec, but are no longer, so // Sass shouldn't consdier it powerless either. -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklch(0% 50% 0deg), "hue")} <===> hue/zero_lightness/output.css @@ -64,7 +64,7 @@ Sass shouldn't consdier them powerless either. <===> ================================================================================ <===> chroma/full_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklch(100% 0% 0deg), "chroma")} <===> chroma/full_lightness/output.css @@ -75,7 +75,7 @@ a { <===> ================================================================================ <===> chroma/zero_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(oklch(0% 0% 0deg), "chroma")} <===> chroma/zero_lightness/output.css diff --git a/spec/core_functions/color/is_powerless/space.hrx b/spec/core_functions/color/is_powerless/space.hrx index 1809e78af5..92eac48ebe 100644 --- a/spec/core_functions/color/is_powerless/space.hrx +++ b/spec/core_functions/color/is_powerless/space.hrx @@ -1,5 +1,5 @@ <===> powerless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(grey, "hue", $space: hsl)} <===> powerless/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> not_powerless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.is-powerless(grey, "a", $space: lab)} <===> not_powerless/output.css diff --git a/spec/core_functions/color/lightness.hrx b/spec/core_functions/color/lightness.hrx index 4de9980184..858874bd98 100644 --- a/spec/core_functions/color/lightness.hrx +++ b/spec/core_functions/color/lightness.hrx @@ -161,7 +161,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.lightness(lch(0% 0 0deg))} <===> error/non_legacy/error diff --git a/spec/core_functions/color/mix/missing.hrx b/spec/core_functions/color/mix/missing.hrx index e3fd25c166..553e43e4cf 100644 --- a/spec/core_functions/color/mix/missing.hrx +++ b/spec/core_functions/color/mix/missing.hrx @@ -1,5 +1,5 @@ <===> explicit/same/legacy/color1/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(rgb(none 100 200), rgb(200 100 0), $method: rgb)} <===> explicit/same/legacy/color1/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> explicit/same/legacy/color2/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(rgb(0 100 200), rgb(200 none 0), $method: rgb)} <===> explicit/same/legacy/color2/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> explicit/same/legacy/both/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(rgb(0 none 200), rgb(200 none 0), $method: rgb)} <===> explicit/same/legacy/both/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> explicit/same/modern/color1/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.mix( color(srgb none 0.1 0.2), @@ -49,7 +49,7 @@ a { <===> ================================================================================ <===> explicit/same/modern/color2/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.mix( color(srgb 0.1 0.2 0.3), @@ -66,7 +66,7 @@ a { <===> ================================================================================ <===> explicit/same/modern/both/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.mix( color(srgb 0.1 0.2 none), @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> explicit/analogous/legacy/color1/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(rgb(none 100 200), rgb(200 100 0), $method: rec2020)} <===> explicit/analogous/legacy/color1/output.css @@ -94,7 +94,7 @@ a { <===> ================================================================================ <===> explicit/analogous/legacy/color2/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(rgb(0 100 200), rgb(200 none 0), $method: rec2020)} <===> explicit/analogous/legacy/color2/output.css @@ -105,7 +105,7 @@ a { <===> ================================================================================ <===> explicit/analogous/legacy/both/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(rgb(0 none 200), rgb(200 none 0), $method: rec2020)} <===> explicit/analogous/legacy/both/output.css @@ -116,7 +116,7 @@ a { <===> ================================================================================ <===> explicit/analogous/modern/color1/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.mix( color(srgb none 0.1 0.2), @@ -133,7 +133,7 @@ a { <===> ================================================================================ <===> explicit/analogous/modern/color2/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.mix( color(srgb 0.1 0.2 0.3), @@ -150,7 +150,7 @@ a { <===> ================================================================================ <===> explicit/analogous/modern/both/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.mix( color(srgb 0.1 0.2 none), @@ -167,7 +167,7 @@ a { <===> ================================================================================ <===> powerless/legacy/color1/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(hsl(0deg 0% 30%), hsl(120deg 50% 50%), $method: lch)} <===> powerless/legacy/color1/output.css @@ -178,7 +178,7 @@ a { <===> ================================================================================ <===> powerless/legacy/color2/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(hsl(120deg 50% 50%), hsl(0deg 0% 30%), $method: lch)} <===> powerless/legacy/color2/output.css @@ -189,7 +189,7 @@ a { <===> ================================================================================ <===> powerless/legacy/both/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(hsl(120deg 0% 50%), hsl(0deg 0% 30%), $method: lch)} <===> powerless/legacy/both/output.css @@ -200,7 +200,7 @@ a { <===> ================================================================================ <===> powerless/modern/color1/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(lch(30% 0% 0deg), lch(50% 10% 120deg), $method: hsl)} <===> powerless/modern/color1/output.css @@ -211,7 +211,7 @@ a { <===> ================================================================================ <===> powerless/modern/color2/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(lch(50% 10% 120deg), lch(30% 0% 0deg), $method: hsl)} <===> powerless/modern/color2/output.css @@ -222,7 +222,7 @@ a { <===> ================================================================================ <===> powerless/modern/both/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.mix(lch(50% 0% 120deg), lch(30% 0% 0deg), $method: hsl)} <===> powerless/modern/both/output.css diff --git a/spec/core_functions/color/red.hrx b/spec/core_functions/color/red.hrx index 72ec4515e2..310db66479 100644 --- a/spec/core_functions/color/red.hrx +++ b/spec/core_functions/color/red.hrx @@ -138,7 +138,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.red(color(srgb 1 1 1))} <===> error/non_legacy/error diff --git a/spec/core_functions/color/same.hrx b/spec/core_functions/color/same.hrx index 3add2658f2..a507389e35 100644 --- a/spec/core_functions/color/same.hrx +++ b/spec/core_functions/color/same.hrx @@ -1,5 +1,5 @@ <===> true/same_space/identical/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(#abcdef, #abcdef)} <===> true/same_space/identical/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> true/same_space/within_epsilon/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.same( lab(50.0000000000001 29.9999999999999 -20.0000000000001), @@ -26,7 +26,7 @@ a { <===> ================================================================================ <===> true/same_space/with_alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(oklch(50% 30% 120deg / 0.3), oklch(50% 30% 120deg / 0.3))} <===> true/same_space/with_alpha/output.css @@ -37,7 +37,7 @@ a { <===> ================================================================================ <===> true/same_space/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(color(srgb 2.3 -1 42), color(srgb 2.3 -1 42))} <===> true/same_space/out_of_gamut/output.css @@ -48,7 +48,7 @@ a { <===> ================================================================================ <===> true/same_space/none_and_zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(color(display-p3 0.1 0.3 none), color(display-p3 0.1 0.3 0))} <===> true/same_space/none_and_zero/output.css @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> true/same_space/both_none/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.same(color(display-p3 0.1 0.3 none), color(display-p3 0.1 0.3 none)); } @@ -72,7 +72,7 @@ a { <===> ================================================================================ <===> true/different_space/no_none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(plum, hsl(300, 47.2868217054%, 74.7058823529%))} <===> true/different_space/no_none/output.css @@ -84,7 +84,7 @@ a { <===> ================================================================================ <===> true/different_space/one_none/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.same( color(rec2020 0.5 none 0.2), @@ -100,7 +100,7 @@ a { <===> ================================================================================ <===> true/different_space/both_none/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.same( color(srgb-linear none 0.9 0.8), @@ -116,7 +116,7 @@ a { <===> ================================================================================ <===> false/same_space/no_none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(#abcdef, #fedcba)} <===> false/same_space/no_none/output.css @@ -127,7 +127,7 @@ a { <===> ================================================================================ <===> false/same_space/none_and_nonzero/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.same( color(prophoto-rgb 0.1 0.2 none), @@ -143,7 +143,7 @@ a { <===> ================================================================================ <===> false/different_space/no_none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(color(srgb 0.1 0.2 0.3), color(srgb-linear 0.1 0.2 0.3))} <===> false/different_space/no_none/output.css @@ -155,7 +155,7 @@ a { ================================================================================ <===> false/different_space/both_none/input.scss // This test verifies that none is converted to 0 *before* conversion to XYZ. -@use 'sass:color'; +@use "sass:color"; a { b: color.same( color(rec2020 0.5 none 0.2), @@ -171,7 +171,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same($color1: red, $color2: green)} <===> named/output.css @@ -182,7 +182,7 @@ a { <===> ================================================================================ <===> error/too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(plum)} <===> error/too_few_args/error @@ -200,7 +200,7 @@ Error: Missing argument $color2. <===> ================================================================================ <===> error/too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(red, green, blue)} <===> error/too_many_args/error @@ -218,7 +218,7 @@ Error: Only 2 arguments allowed, but 3 were passed. <===> ================================================================================ <===> error/type/color1/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(1, red)} <===> error/type/color1/error @@ -232,7 +232,7 @@ Error: $color1: 1 is not a color. <===> ================================================================================ <===> error/type/color2/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.same(red, 1)} <===> error/type/color2/error diff --git a/spec/core_functions/color/saturate.hrx b/spec/core_functions/color/saturate.hrx index c5c9cbf8a5..2d19a47d27 100644 --- a/spec/core_functions/color/saturate.hrx +++ b/spec/core_functions/color/saturate.hrx @@ -268,7 +268,7 @@ Error: $amount: red is not a number. <===> ================================================================================ <===> error/with_module/one_arg/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.saturate(var(--c))} <===> error/with_module/one_arg/type/error diff --git a/spec/core_functions/color/saturation.hrx b/spec/core_functions/color/saturation.hrx index b1c4802b47..9a93322dde 100644 --- a/spec/core_functions/color/saturation.hrx +++ b/spec/core_functions/color/saturation.hrx @@ -161,7 +161,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.saturation(color(srgb 1 1 1))} <===> error/non_legacy/error diff --git a/spec/core_functions/color/scale/a98_rgb.hrx b/spec/core_functions/color/scale/a98_rgb.hrx index 16e70f0258..404ec2e67a 100644 --- a/spec/core_functions/color/scale/a98_rgb.hrx +++ b/spec/core_functions/color/scale/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 100%)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: -100%)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 0%)} <===> red/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: -33%)} <===> red/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 86%)} <===> red/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 100%)} <===> green/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: -100%)} <===> green/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 0%)} <===> green/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: -86%)} <===> green/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 12%)} <===> green/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 100%)} <===> blue/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: -100%)} <===> blue/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 0%)} <===> blue/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: -16%)} <===> blue/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 42%)} <===> blue/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(a98-rgb 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% @@ -179,7 +179,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(a98-rgb 0.2 0.5 0.7 / 0.3), @@ -195,7 +195,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(a98-rgb 0.2 0.5 0.7), @@ -211,7 +211,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( $color: color(a98-rgb 0.2 0.5 0.7), diff --git a/spec/core_functions/color/scale/display_p3.hrx b/spec/core_functions/color/scale/display_p3.hrx index 3f962c3983..f7c037d0a1 100644 --- a/spec/core_functions/color/scale/display_p3.hrx +++ b/spec/core_functions/color/scale/display_p3.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 100%)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: -100%)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 0%)} <===> red/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: -33%)} <===> red/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 86%)} <===> red/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 100%)} <===> green/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: -100%)} <===> green/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 0%)} <===> green/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: -86%)} <===> green/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 12%)} <===> green/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 100%)} <===> blue/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: -100%)} <===> blue/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 0%)} <===> blue/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: -16%)} <===> blue/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 42%)} <===> blue/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(display-p3 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% @@ -179,7 +179,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(display-p3 0.2 0.5 0.7 / 0.3), @@ -195,7 +195,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(display-p3 0.2 0.5 0.7), @@ -211,7 +211,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( $color: color(display-p3 0.2 0.5 0.7), diff --git a/spec/core_functions/color/scale/error/args.hrx b/spec/core_functions/color/scale/error/args.hrx index 394dd6805c..ce45f01805 100644 --- a/spec/core_functions/color/scale/error/args.hrx +++ b/spec/core_functions/color/scale/error/args.hrx @@ -1,5 +1,5 @@ <===> too_few/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale()} <===> too_few/error @@ -17,7 +17,7 @@ Error: Missing argument $color. <===> ================================================================================ <===> too_many/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, 1)} <===> too_many/error @@ -31,7 +31,7 @@ Error: Only one positional argument is allowed. All other arguments must be pass <===> ================================================================================ <===> unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $hue: 10%)} <===> unknown/error diff --git a/spec/core_functions/color/scale/error/bounds.hrx b/spec/core_functions/color/scale/error/bounds.hrx index 1ef57005a1..f470062b51 100644 --- a/spec/core_functions/color/scale/error/bounds.hrx +++ b/spec/core_functions/color/scale/error/bounds.hrx @@ -1,5 +1,5 @@ <===> legacy/too_low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $saturation: -100.001%)} <===> legacy/too_low/error @@ -13,7 +13,7 @@ Error: $saturation: Expected -100.001% to be within -100% and 100%. <===> ================================================================================ <===> legacy/too_high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $whiteness: 100.001%)} <===> legacy/too_high/error @@ -27,7 +27,7 @@ Error: $whiteness: Expected 100.001% to be within -100% and 100%. <===> ================================================================================ <===> modern/too_low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% -70 60), $a: -100.001%)} <===> modern/too_low/error @@ -41,7 +41,7 @@ Error: $a: Expected -100.001% to be within -100% and 100%. <===> ================================================================================ <===> modern/too_high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% -70 60), $b: 100.001%)} <===> modern/too_high/error diff --git a/spec/core_functions/color/scale/error/incompatible_channel.hrx b/spec/core_functions/color/scale/error/incompatible_channel.hrx index d855830f1d..cf404a9d26 100644 --- a/spec/core_functions/color/scale/error/incompatible_channel.hrx +++ b/spec/core_functions/color/scale/error/incompatible_channel.hrx @@ -1,5 +1,5 @@ <===> legacy_space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $chroma: 50%)} <===> legacy_space/error @@ -13,7 +13,7 @@ Error: $chroma: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> legacy_channel/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $whiteness: 50%)} <===> legacy_channel/error @@ -27,7 +27,7 @@ Error: $whiteness: Color space srgb doesn't have a channel with this name. <===> ================================================================================ <===> modern_both/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $chroma: 50%)} <===> modern_both/error diff --git a/spec/core_functions/color/scale/error/missing.hrx b/spec/core_functions/color/scale/error/missing.hrx index 5d964eda3e..b6d2bba0bb 100644 --- a/spec/core_functions/color/scale/error/missing.hrx +++ b/spec/core_functions/color/scale/error/missing.hrx @@ -1,5 +1,5 @@ <===> legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgb(none 0 0), $red: 10%)} <===> legacy/error @@ -13,7 +13,7 @@ Error: $red: Because the CSS working group is still deciding on the best behavio <===> ================================================================================ <===> modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(none 0 0), $lightness: 10%, $space: lab)} <===> modern/error @@ -27,7 +27,7 @@ Error: $lightness: Because the CSS working group is still deciding on the best b <===> ================================================================================ <===> alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgb(0 0 0 / none), $alpha: 10%)} <===> alpha/error diff --git a/spec/core_functions/color/scale/error/mixed_formats.hrx b/spec/core_functions/color/scale/error/mixed_formats.hrx index c5dbc0ab3a..20620a690d 100644 --- a/spec/core_functions/color/scale/error/mixed_formats.hrx +++ b/spec/core_functions/color/scale/error/mixed_formats.hrx @@ -1,5 +1,5 @@ <===> red_and_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $red: 1%, $saturation: 1%)} <===> red_and_saturation/error @@ -13,7 +13,7 @@ Error: $saturation: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> green_and_saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $green: 1%, $saturation: 1%)} <===> green_and_saturation/error @@ -27,7 +27,7 @@ Error: $saturation: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> blue_and_lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $blue: 1%, $lightness: 1%)} <===> blue_and_lightness/error @@ -41,7 +41,7 @@ Error: $lightness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> red_and_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $red: 1%, $blackness: 1%)} <===> red_and_blackness/error @@ -55,7 +55,7 @@ Error: $blackness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> green_and_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $green: 1%, $whiteness: 1%)} <===> green_and_whiteness/error @@ -69,7 +69,7 @@ Error: $whiteness: Color space rgb doesn't have a channel with this name. <===> ================================================================================ <===> saturation_and_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $saturation: 1%, $blackness: 1%)} <===> saturation_and_blackness/error @@ -83,7 +83,7 @@ Error: $blackness: Color space hsl doesn't have a channel with this name. <===> ================================================================================ <===> lightness_and_whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $lightness: 1%, $whiteness: 1%)} <===> lightness_and_whiteness/error diff --git a/spec/core_functions/color/scale/error/polar.hrx b/spec/core_functions/color/scale/error/polar.hrx index 54ff18b398..2f1c5d7344 100644 --- a/spec/core_functions/color/scale/error/polar.hrx +++ b/spec/core_functions/color/scale/error/polar.hrx @@ -1,5 +1,5 @@ <===> legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $hue: 10%)} <===> legacy/error @@ -13,7 +13,7 @@ Error: $hue: Channel isn't scalable. <===> ================================================================================ <===> lch/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(50% 30% 180deg), $hue: 10%)} <===> lch/error @@ -27,7 +27,7 @@ Error: $hue: Channel isn't scalable. <===> ================================================================================ <===> oklch/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(50% 30% 180deg), $hue: 10%)} <===> oklch/error diff --git a/spec/core_functions/color/scale/error/space.hrx b/spec/core_functions/color/scale/error/space.hrx index 5214992c0b..46c2c6c42b 100644 --- a/spec/core_functions/color/scale/error/space.hrx +++ b/spec/core_functions/color/scale/error/space.hrx @@ -1,5 +1,5 @@ <===> unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $space: c)} <===> unknown/error @@ -13,7 +13,7 @@ Error: $space: Unknown color space "c". <===> ================================================================================ <===> quoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $space: "lab")} <===> quoted/error diff --git a/spec/core_functions/color/scale/error/type.hrx b/spec/core_functions/color/scale/error/type.hrx index a45a9ec641..95eee880b4 100644 --- a/spec/core_functions/color/scale/error/type.hrx +++ b/spec/core_functions/color/scale/error/type.hrx @@ -1,5 +1,5 @@ <===> color/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(1)} <===> color/error @@ -13,7 +13,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $red: c)} <===> red/error @@ -27,7 +27,7 @@ Error: $red: c is not a number. <===> ================================================================================ <===> green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $green: c)} <===> green/error @@ -41,7 +41,7 @@ Error: $green: c is not a number. <===> ================================================================================ <===> blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $blue: c)} <===> blue/error @@ -55,7 +55,7 @@ Error: $blue: c is not a number. <===> ================================================================================ <===> saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $saturation: c)} <===> saturation/error @@ -69,7 +69,7 @@ Error: $saturation: c is not a number. <===> ================================================================================ <===> lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $lightness: c)} <===> lightness/error @@ -83,7 +83,7 @@ Error: $lightness: c is not a number. <===> ================================================================================ <===> alpha/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $alpha: c)} <===> alpha/error @@ -97,7 +97,7 @@ Error: $alpha: c is not a number. <===> ================================================================================ <===> none/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $alpha: none)} <===> none/error @@ -111,7 +111,7 @@ Error: $alpha: none is not a number. <===> ================================================================================ <===> blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $blackness: c)} <===> blackness/error @@ -125,7 +125,7 @@ Error: $blackness: c is not a number. <===> ================================================================================ <===> whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $whiteness: c)} <===> whiteness/error @@ -139,7 +139,7 @@ Error: $whiteness: c is not a number. <===> ================================================================================ <===> space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $space: 1)} <===> space/error diff --git a/spec/core_functions/color/scale/error/units/a98_rgb.hrx b/spec/core_functions/color/scale/error/units/a98_rgb.hrx index 5fa1f11a7f..69326ff261 100644 --- a/spec/core_functions/color/scale/error/units/a98_rgb.hrx +++ b/spec/core_functions/color/scale/error/units/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> none/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 1)} <===> none/red/error @@ -13,7 +13,7 @@ Error: $red: Expected 1 to have unit "%". <===> ================================================================================ <===> none/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 1)} <===> none/green/error @@ -27,7 +27,7 @@ Error: $green: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 1)} <===> none/blue/error @@ -41,7 +41,7 @@ Error: $blue: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $red: 1px)} <===> wrong/red/error @@ -55,7 +55,7 @@ Error: $red: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $green: 1px)} <===> wrong/green/error @@ -69,7 +69,7 @@ Error: $green: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(a98-rgb 0.2 0.5 0.7), $blue: 1px)} <===> wrong/blue/error diff --git a/spec/core_functions/color/scale/error/units/display_p3.hrx b/spec/core_functions/color/scale/error/units/display_p3.hrx index fb43ae196a..ef2e712ade 100644 --- a/spec/core_functions/color/scale/error/units/display_p3.hrx +++ b/spec/core_functions/color/scale/error/units/display_p3.hrx @@ -1,5 +1,5 @@ <===> none/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 1)} <===> none/red/error @@ -13,7 +13,7 @@ Error: $red: Expected 1 to have unit "%". <===> ================================================================================ <===> none/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 1)} <===> none/green/error @@ -27,7 +27,7 @@ Error: $green: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 1)} <===> none/blue/error @@ -41,7 +41,7 @@ Error: $blue: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $red: 1px)} <===> wrong/red/error @@ -55,7 +55,7 @@ Error: $red: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $green: 1px)} <===> wrong/green/error @@ -69,7 +69,7 @@ Error: $green: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(display-p3 0.2 0.5 0.7), $blue: 1px)} <===> wrong/blue/error diff --git a/spec/core_functions/color/scale/error/units/hsl.hrx b/spec/core_functions/color/scale/error/units/hsl.hrx index c08824457c..a113686237 100644 --- a/spec/core_functions/color/scale/error/units/hsl.hrx +++ b/spec/core_functions/color/scale/error/units/hsl.hrx @@ -1,5 +1,5 @@ <===> none/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $saturation: 1)} <===> none/saturation/error @@ -13,7 +13,7 @@ Error: $saturation: Expected 1 to have unit "%". <===> ================================================================================ <===> none/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $lightness: 1)} <===> none/lightness/error @@ -27,7 +27,7 @@ Error: $lightness: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $saturation: 1px)} <===> wrong/saturation/error @@ -41,7 +41,7 @@ Error: $saturation: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $lightness: 1px)} <===> wrong/lightness/error diff --git a/spec/core_functions/color/scale/error/units/hwb.hrx b/spec/core_functions/color/scale/error/units/hwb.hrx index 7883c9e210..772efb34a2 100644 --- a/spec/core_functions/color/scale/error/units/hwb.hrx +++ b/spec/core_functions/color/scale/error/units/hwb.hrx @@ -1,5 +1,5 @@ <===> none/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $whiteness: 1)} <===> none/whiteness/error @@ -13,7 +13,7 @@ Error: $whiteness: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $blackness: 1)} <===> none/blackness/error @@ -27,7 +27,7 @@ Error: $blackness: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $whiteness: 1px)} <===> wrong/whiteness/error @@ -41,7 +41,7 @@ Error: $whiteness: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $blackness: 1px)} <===> wrong/blackness/error diff --git a/spec/core_functions/color/scale/error/units/lab.hrx b/spec/core_functions/color/scale/error/units/lab.hrx index 2d626e78c3..8b184aeaec 100644 --- a/spec/core_functions/color/scale/error/units/lab.hrx +++ b/spec/core_functions/color/scale/error/units/lab.hrx @@ -1,5 +1,5 @@ <===> none/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% 40% -20%), $lightness: 1)} <===> none/lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 1 to have unit "%". <===> ================================================================================ <===> none/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% 40% -20%), $a: 1)} <===> none/a/error @@ -27,7 +27,7 @@ Error: $a: Expected 1 to have unit "%". <===> ================================================================================ <===> none/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% 40% -20%), $b: 1)} <===> none/b/error @@ -41,7 +41,7 @@ Error: $b: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% 40% -20%), $lightness: 1px)} <===> wrong/lightness/error @@ -55,7 +55,7 @@ Error: $lightness: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% 40% -20%), $a: 1px)} <===> wrong/a/error @@ -69,7 +69,7 @@ Error: $a: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% 40% -20%), $b: 1px)} <===> wrong/b/error diff --git a/spec/core_functions/color/scale/error/units/lch.hrx b/spec/core_functions/color/scale/error/units/lch.hrx index 14cd387d23..fc3c27d3d4 100644 --- a/spec/core_functions/color/scale/error/units/lch.hrx +++ b/spec/core_functions/color/scale/error/units/lch.hrx @@ -1,5 +1,5 @@ <===> none/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(30% 70% 200deg), $lightness: 1)} <===> none/lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 1 to have unit "%". <===> ================================================================================ <===> none/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(30% 70% 200deg), $chroma: 1)} <===> none/chroma/error @@ -27,7 +27,7 @@ Error: $chroma: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(30% 70% 200deg), $lightness: 1px)} <===> wrong/lightness/error @@ -41,7 +41,7 @@ Error: $lightness: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(30% 70% 200deg), $chroma: 1px)} <===> wrong/chroma/error diff --git a/spec/core_functions/color/scale/error/units/oklab.hrx b/spec/core_functions/color/scale/error/units/oklab.hrx index 298bf58df1..6d173c1b1d 100644 --- a/spec/core_functions/color/scale/error/units/oklab.hrx +++ b/spec/core_functions/color/scale/error/units/oklab.hrx @@ -1,5 +1,5 @@ <===> none/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(50% 40% -20%), $lightness: 1)} <===> none/lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 1 to have unit "%". <===> ================================================================================ <===> none/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(50% 40% -20%), $a: 1)} <===> none/a/error @@ -27,7 +27,7 @@ Error: $a: Expected 1 to have unit "%". <===> ================================================================================ <===> none/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(50% 40% -20%), $b: 1)} <===> none/b/error @@ -41,7 +41,7 @@ Error: $b: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(50% 40% -20%), $lightness: 1px)} <===> wrong/lightness/error @@ -55,7 +55,7 @@ Error: $lightness: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(50% 40% -20%), $a: 1px)} <===> wrong/a/error @@ -69,7 +69,7 @@ Error: $a: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(50% 40% -20%), $b: 1px)} <===> wrong/b/error diff --git a/spec/core_functions/color/scale/error/units/oklch.hrx b/spec/core_functions/color/scale/error/units/oklch.hrx index 14cd387d23..fc3c27d3d4 100644 --- a/spec/core_functions/color/scale/error/units/oklch.hrx +++ b/spec/core_functions/color/scale/error/units/oklch.hrx @@ -1,5 +1,5 @@ <===> none/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(30% 70% 200deg), $lightness: 1)} <===> none/lightness/error @@ -13,7 +13,7 @@ Error: $lightness: Expected 1 to have unit "%". <===> ================================================================================ <===> none/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(30% 70% 200deg), $chroma: 1)} <===> none/chroma/error @@ -27,7 +27,7 @@ Error: $chroma: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(30% 70% 200deg), $lightness: 1px)} <===> wrong/lightness/error @@ -41,7 +41,7 @@ Error: $lightness: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(30% 70% 200deg), $chroma: 1px)} <===> wrong/chroma/error diff --git a/spec/core_functions/color/scale/error/units/prophoto_rgb.hrx b/spec/core_functions/color/scale/error/units/prophoto_rgb.hrx index 0cabe6f1d5..8078d52e35 100644 --- a/spec/core_functions/color/scale/error/units/prophoto_rgb.hrx +++ b/spec/core_functions/color/scale/error/units/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> none/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 1)} <===> none/red/error @@ -13,7 +13,7 @@ Error: $red: Expected 1 to have unit "%". <===> ================================================================================ <===> none/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 1)} <===> none/green/error @@ -27,7 +27,7 @@ Error: $green: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 1)} <===> none/blue/error @@ -41,7 +41,7 @@ Error: $blue: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 1px)} <===> wrong/red/error @@ -55,7 +55,7 @@ Error: $red: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 1px)} <===> wrong/green/error @@ -69,7 +69,7 @@ Error: $green: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 1px)} <===> wrong/blue/error diff --git a/spec/core_functions/color/scale/error/units/rec2020.hrx b/spec/core_functions/color/scale/error/units/rec2020.hrx index ff2a9c135f..3fc9090ab4 100644 --- a/spec/core_functions/color/scale/error/units/rec2020.hrx +++ b/spec/core_functions/color/scale/error/units/rec2020.hrx @@ -1,5 +1,5 @@ <===> none/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 1)} <===> none/red/error @@ -13,7 +13,7 @@ Error: $red: Expected 1 to have unit "%". <===> ================================================================================ <===> none/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 1)} <===> none/green/error @@ -27,7 +27,7 @@ Error: $green: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 1)} <===> none/blue/error @@ -41,7 +41,7 @@ Error: $blue: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 1px)} <===> wrong/red/error @@ -55,7 +55,7 @@ Error: $red: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 1px)} <===> wrong/green/error @@ -69,7 +69,7 @@ Error: $green: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 1px)} <===> wrong/blue/error diff --git a/spec/core_functions/color/scale/error/units/rgb.hrx b/spec/core_functions/color/scale/error/units/rgb.hrx index 713f594fe4..d8b90585c6 100644 --- a/spec/core_functions/color/scale/error/units/rgb.hrx +++ b/spec/core_functions/color/scale/error/units/rgb.hrx @@ -1,5 +1,5 @@ <===> none/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $red: 1)} <===> none/red/error @@ -13,7 +13,7 @@ Error: $red: Expected 1 to have unit "%". <===> ================================================================================ <===> none/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $green: 1)} <===> none/green/error @@ -27,7 +27,7 @@ Error: $green: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $blue: 1)} <===> none/blue/error @@ -41,7 +41,7 @@ Error: $blue: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $red: 1px)} <===> wrong/red/error @@ -55,7 +55,7 @@ Error: $red: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $green: 1px)} <===> wrong/green/error @@ -69,7 +69,7 @@ Error: $green: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(white, $blue: 1px)} <===> wrong/blue/error diff --git a/spec/core_functions/color/scale/error/units/srgb.hrx b/spec/core_functions/color/scale/error/units/srgb.hrx index 818bbed16e..a60db7d908 100644 --- a/spec/core_functions/color/scale/error/units/srgb.hrx +++ b/spec/core_functions/color/scale/error/units/srgb.hrx @@ -1,5 +1,5 @@ <===> none/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 1)} <===> none/red/error @@ -13,7 +13,7 @@ Error: $red: Expected 1 to have unit "%". <===> ================================================================================ <===> none/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 1)} <===> none/green/error @@ -27,7 +27,7 @@ Error: $green: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 1)} <===> none/blue/error @@ -41,7 +41,7 @@ Error: $blue: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 1px)} <===> wrong/red/error @@ -55,7 +55,7 @@ Error: $red: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 1px)} <===> wrong/green/error @@ -69,7 +69,7 @@ Error: $green: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 1px)} <===> wrong/blue/error diff --git a/spec/core_functions/color/scale/error/units/srgb_linear.hrx b/spec/core_functions/color/scale/error/units/srgb_linear.hrx index dfda62e1e8..92292b25ad 100644 --- a/spec/core_functions/color/scale/error/units/srgb_linear.hrx +++ b/spec/core_functions/color/scale/error/units/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> none/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 1)} <===> none/red/error @@ -13,7 +13,7 @@ Error: $red: Expected 1 to have unit "%". <===> ================================================================================ <===> none/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 1)} <===> none/green/error @@ -27,7 +27,7 @@ Error: $green: Expected 1 to have unit "%". <===> ================================================================================ <===> none/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 1)} <===> none/blue/error @@ -41,7 +41,7 @@ Error: $blue: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 1px)} <===> wrong/red/error @@ -55,7 +55,7 @@ Error: $red: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 1px)} <===> wrong/green/error @@ -69,7 +69,7 @@ Error: $green: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 1px)} <===> wrong/blue/error diff --git a/spec/core_functions/color/scale/error/units/xyz_d50.hrx b/spec/core_functions/color/scale/error/units/xyz_d50.hrx index 38f0ca35fc..a42bbf4f73 100644 --- a/spec/core_functions/color/scale/error/units/xyz_d50.hrx +++ b/spec/core_functions/color/scale/error/units/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> none/x/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 1)} <===> none/x/error @@ -13,7 +13,7 @@ Error: $x: Expected 1 to have unit "%". <===> ================================================================================ <===> none/y/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 1)} <===> none/y/error @@ -27,7 +27,7 @@ Error: $y: Expected 1 to have unit "%". <===> ================================================================================ <===> none/z/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 1)} <===> none/z/error @@ -41,7 +41,7 @@ Error: $z: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/x/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 1px)} <===> wrong/x/error @@ -55,7 +55,7 @@ Error: $x: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/y/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 1px)} <===> wrong/y/error @@ -69,7 +69,7 @@ Error: $y: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/z/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 1px)} <===> wrong/z/error diff --git a/spec/core_functions/color/scale/error/units/xyz_d65.hrx b/spec/core_functions/color/scale/error/units/xyz_d65.hrx index 640ea963dd..327ccbecf5 100644 --- a/spec/core_functions/color/scale/error/units/xyz_d65.hrx +++ b/spec/core_functions/color/scale/error/units/xyz_d65.hrx @@ -1,5 +1,5 @@ <===> none/x/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 1)} <===> none/x/error @@ -13,7 +13,7 @@ Error: $x: Expected 1 to have unit "%". <===> ================================================================================ <===> none/y/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 1)} <===> none/y/error @@ -27,7 +27,7 @@ Error: $y: Expected 1 to have unit "%". <===> ================================================================================ <===> none/z/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 1)} <===> none/z/error @@ -41,7 +41,7 @@ Error: $z: Expected 1 to have unit "%". <===> ================================================================================ <===> wrong/x/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 1px)} <===> wrong/x/error @@ -55,7 +55,7 @@ Error: $x: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/y/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 1px)} <===> wrong/y/error @@ -69,7 +69,7 @@ Error: $y: Expected 1px to have unit "%". <===> ================================================================================ <===> wrong/z/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 1px)} <===> wrong/z/error diff --git a/spec/core_functions/color/scale/hsl.hrx b/spec/core_functions/color/scale/hsl.hrx index 41ccb4a4e5..81d24de9ac 100644 --- a/spec/core_functions/color/scale/hsl.hrx +++ b/spec/core_functions/color/scale/hsl.hrx @@ -1,5 +1,5 @@ <===> saturation/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(plum, $saturation: 100%)} <===> saturation/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> saturation/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(plum, $saturation: 0%)} <===> saturation/zero/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> saturation/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(plum, $saturation: -100%)} <===> saturation/min/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> saturation/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(plum, $saturation: 67%)} <===> saturation/high/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> saturation/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(plum, $saturation: -43%)} <===> saturation/low/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> lightness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $lightness: 100%)} <===> lightness/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> lightness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $lightness: 0%)} <===> lightness/zero/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> lightness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $lightness: -100%)} <===> lightness/min/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> lightness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $lightness: 94%)} <===> lightness/high/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> lightness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $lightness: -14%)} <===> lightness/low/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(turquoise, $saturation: 24%, $lightness: -48%)} <===> all/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgba(turquoise, 0.7), $saturation: 24%, $lightness: -48%)} <===> alpha_input/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(turquoise, $saturation: 24%, $lightness: -48%, $alpha: -70%)} <===> alpha_arg/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale($color: turquoise, $saturation: 24%, $lightness: -48%)} <===> named/output.css diff --git a/spec/core_functions/color/scale/hwb.hrx b/spec/core_functions/color/scale/hwb.hrx index 5c55594298..28bf63f782 100644 --- a/spec/core_functions/color/scale/hwb.hrx +++ b/spec/core_functions/color/scale/hwb.hrx @@ -1,5 +1,5 @@ <===> whiteness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#66cc99, $whiteness: 100%)} <===> whiteness/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> whiteness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#66cc99, $whiteness: 0%)} <===> whiteness/zero/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> whiteness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#66cc99, $whiteness: -100%)} <===> whiteness/min/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> whiteness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#33cc80, $whiteness: 50%)} <===> whiteness/high/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> whiteness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#66cc99, $whiteness: -50%)} <===> whiteness/low/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> blackness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#339966, $blackness: 100%)} <===> blackness/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> blackness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#339966, $blackness: 0%)} <===> blackness/zero/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> blackness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#339966, $blackness: -100%)} <===> blackness/min/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> blackness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#33cc80, $blackness: 50%)} <===> blackness/high/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> blackness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#339966, $blackness: -50%)} <===> blackness/low/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#66cc99, $whiteness: -50%, $blackness: 50%)} <===> all/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgba(#66cc99, 0.7), $whiteness: -50%, $blackness: 50%)} <===> alpha_input/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(#66cc99, $whiteness: -50%, $blackness: 50%, $alpha: -70%)} <===> alpha_arg/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale($color: #66cc99, $whiteness: -50%, $blackness: 50%)} <===> named/output.css diff --git a/spec/core_functions/color/scale/lab.hrx b/spec/core_functions/color/scale/lab.hrx index 68c46da23a..730debbc66 100644 --- a/spec/core_functions/color/scale/lab.hrx +++ b/spec/core_functions/color/scale/lab.hrx @@ -1,5 +1,5 @@ <===> lightness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $lightness: 100%)} <===> lightness/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $lightness: -100%)} <===> lightness/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $lightness: 0%)} <===> lightness/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $lightness: -33%)} <===> lightness/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> lightness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $lightness: 86%)} <===> lightness/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> a/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $a: 100%)} <===> a/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> a/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $a: -100%)} <===> a/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> a/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $a: 0%)} <===> a/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> a/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $a: -86%)} <===> a/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> a/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $a: 12%)} <===> a/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> b/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $b: 100%)} <===> b/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> b/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $b: -100%)} <===> b/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> b/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $b: 0%)} <===> b/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> b/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $b: -16%)} <===> b/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> b/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(70% 100 -60), $b: 42%)} <===> b/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(lab(70% 100 -60), $lightness: 12%, $a: 24%, $b: 48%); } @@ -177,7 +177,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(lab(70% 100 -60 / 0.3), $lightness: 12%, $a: 24%, $b: 48%); } @@ -190,7 +190,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( lab(70% 100 -60), @@ -206,7 +206,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale($color: lab(70% 100 -60), $lightness: 12%, $a: 24%, $b: 48%); } diff --git a/spec/core_functions/color/scale/lch.hrx b/spec/core_functions/color/scale/lch.hrx index a0a5204057..de5e4bfc0c 100644 --- a/spec/core_functions/color/scale/lch.hrx +++ b/spec/core_functions/color/scale/lch.hrx @@ -1,5 +1,5 @@ <===> lightness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $lightness: 100%)} <===> lightness/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $lightness: -100%)} <===> lightness/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $lightness: 0%)} <===> lightness/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $lightness: -33%)} <===> lightness/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> lightness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $lightness: 86%)} <===> lightness/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> chroma/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $chroma: 100%)} <===> chroma/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> chroma/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $chroma: -100%)} <===> chroma/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> chroma/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $chroma: 0%)} <===> chroma/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> chroma/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $chroma: -86%)} <===> chroma/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> chroma/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $chroma: 12%)} <===> chroma/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lch(70% 20% 80deg), $lightness: 12%, $chroma: 24%)} <===> all/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(lch(70% 20% 80deg / 0.3), $lightness: 12%, $chroma: 24%); } @@ -133,7 +133,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( lch(70% 20% 80deg), @@ -149,7 +149,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale($color: lch(70% 20% 80deg), $lightness: 12%, $chroma: 24%)} <===> named/output.css diff --git a/spec/core_functions/color/scale/no_channels.hrx b/spec/core_functions/color/scale/no_channels.hrx index 52280d0d1c..b3c20aa395 100644 --- a/spec/core_functions/color/scale/no_channels.hrx +++ b/spec/core_functions/color/scale/no_channels.hrx @@ -1,5 +1,5 @@ <===> identical/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklch(50% 0.2 0deg), $space: lab)} <===> identical/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> powerless/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklch(50% 0 0deg), $space: lab)} <===> powerless/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgb(none none none))} <===> missing/output.css diff --git a/spec/core_functions/color/scale/no_space.hrx b/spec/core_functions/color/scale/no_space.hrx index c1a4c4a853..a07bee6631 100644 --- a/spec/core_functions/color/scale/no_space.hrx +++ b/spec/core_functions/color/scale/no_space.hrx @@ -1,5 +1,5 @@ <===> positional/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red)} <===> positional/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale($color: red)} <===> named/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> alpha/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgba(red, 0.5), $alpha: 100%)} <===> alpha/max/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> alpha/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgba(red, 0.5), $alpha: 0%)} <===> alpha/zero/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> alpha/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgba(red, 0.5), $alpha: -100%)} <===> alpha/min/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> alpha/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgba(red, 0.5), $alpha: 14%)} <===> alpha/high/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgba(red, 0.3), $alpha: -36%)} <===> alpha/low/output.css diff --git a/spec/core_functions/color/scale/oklab.hrx b/spec/core_functions/color/scale/oklab.hrx index 2f511ee2d2..8b48035794 100644 --- a/spec/core_functions/color/scale/oklab.hrx +++ b/spec/core_functions/color/scale/oklab.hrx @@ -1,5 +1,5 @@ <===> lightness/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: 100%)} <===> lightness/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> lightness/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: -100%)} <===> lightness/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> lightness/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: 0%)} <===> lightness/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> lightness/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: -33%)} <===> lightness/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> lightness/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $lightness: 86%)} <===> lightness/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> a/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $a: 100%)} <===> a/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> a/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $a: -100%)} <===> a/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> a/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $a: 0%)} <===> a/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> a/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $a: -86%)} <===> a/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> a/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $a: 12%)} <===> a/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> b/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $b: 100%)} <===> b/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> b/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $b: -100%)} <===> b/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> b/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $b: 0%)} <===> b/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> b/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $b: -16%)} <===> b/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> b/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklab(70% 0.3 -0.25), $b: 42%)} <===> b/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(oklab(70% 0.3 -0.25), $lightness: 12%, $a: 24%, $b: 48%); } @@ -177,7 +177,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(oklab(70% 0.3 -0.25 / 0.3), $lightness: 12%, $a: 24%, $b: 48%); } @@ -190,7 +190,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( oklab(70% 0.3 -0.25), @@ -206,7 +206,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale($color: oklab(70% 0.3 -0.25), $lightness: 12%, $a: 24%, $b: 48%); } diff --git a/spec/core_functions/color/scale/out_of_gamut.hrx b/spec/core_functions/color/scale/out_of_gamut.hrx index 3641143439..b53c3b18fb 100644 --- a/spec/core_functions/color/scale/out_of_gamut.hrx +++ b/spec/core_functions/color/scale/out_of_gamut.hrx @@ -1,5 +1,5 @@ <===> above_gamut/up/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 1.2 0.5 0.7), $red: 10%)} <===> above_gamut/up/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> above_gamut/down/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 1.2 0.5 0.7), $red: -10%)} <===> above_gamut/down/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> below_gamut/up/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb -0.5 0.5 0.7), $red: 10%)} <===> below_gamut/up/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> below_gamut/down/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb -0.5 0.5 0.7), $red: -10%)} <===> below_gamut/down/output.css diff --git a/spec/core_functions/color/scale/prophoto_rgb.hrx b/spec/core_functions/color/scale/prophoto_rgb.hrx index a00ddfc6cc..e9ec44ead2 100644 --- a/spec/core_functions/color/scale/prophoto_rgb.hrx +++ b/spec/core_functions/color/scale/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 100%)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: -100%)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 0%)} <===> red/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: -33%)} <===> red/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $red: 86%)} <===> red/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 100%)} <===> green/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: -100%)} <===> green/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 0%)} <===> green/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: -86%)} <===> green/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $green: 12%)} <===> green/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 100%)} <===> blue/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: -100%)} <===> blue/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 0%)} <===> blue/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: -16%)} <===> blue/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(prophoto-rgb 0.2 0.5 0.7), $blue: 42%)} <===> blue/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(prophoto-rgb 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% @@ -179,7 +179,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(prophoto-rgb 0.2 0.5 0.7 / 0.3), @@ -195,7 +195,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(prophoto-rgb 0.2 0.5 0.7), @@ -211,7 +211,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( $color: color(prophoto-rgb 0.2 0.5 0.7), diff --git a/spec/core_functions/color/scale/rec2020.hrx b/spec/core_functions/color/scale/rec2020.hrx index 5f05d3215b..68ba4dc093 100644 --- a/spec/core_functions/color/scale/rec2020.hrx +++ b/spec/core_functions/color/scale/rec2020.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 100%)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: -100%)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 0%)} <===> red/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: -33%)} <===> red/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $red: 86%)} <===> red/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 100%)} <===> green/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: -100%)} <===> green/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 0%)} <===> green/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: -86%)} <===> green/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $green: 12%)} <===> green/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 100%)} <===> blue/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: -100%)} <===> blue/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 0%)} <===> blue/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: -16%)} <===> blue/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(rec2020 0.2 0.5 0.7), $blue: 42%)} <===> blue/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(rec2020 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% @@ -179,7 +179,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(rec2020 0.2 0.5 0.7 / 0.3), @@ -195,7 +195,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(rec2020 0.2 0.5 0.7), @@ -211,7 +211,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( $color: color(rec2020 0.2 0.5 0.7), diff --git a/spec/core_functions/color/scale/rgb.hrx b/spec/core_functions/color/scale/rgb.hrx index d80ba9482d..5864fa88f9 100644 --- a/spec/core_functions/color/scale/rgb.hrx +++ b/spec/core_functions/color/scale/rgb.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(black, $red: 100%)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $red: -100%)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(black, $red: 0%)} <===> red/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lightcoral, $red: -33%)} <===> red/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(turquoise, $red: 86%)} <===> red/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(black, $green: 100%)} <===> green/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lime, $green: -100%)} <===> green/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(black, $green: 0%)} <===> green/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(seagreen, $green: -86%)} <===> green/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(cadetblue, $green: 12%)} <===> green/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(black, $blue: 100%)} <===> blue/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(blue, $blue: -100%)} <===> blue/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(black, $blue: 0%)} <===> blue/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(slategray, $blue: -16%)} <===> blue/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(salmon, $blue: 42%)} <===> blue/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(sienna, $red: 12%, $green: 24%, $blue: 48%)} <===> all/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgba(sienna, 0.3), $red: 12%, $green: 24%, $blue: 48%)} <===> alpha_input/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(sienna, $red: 12%, $green: 24%, $blue: 48%, $alpha: -70%)} <===> alpha_arg/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale($color: sienna, $red: 12%, $green: 24%, $blue: 48%)} <===> named/output.css diff --git a/spec/core_functions/color/scale/space.hrx b/spec/core_functions/color/scale/space.hrx index 31dd144ed8..de91dcf6c3 100644 --- a/spec/core_functions/color/scale/space.hrx +++ b/spec/core_functions/color/scale/space.hrx @@ -1,5 +1,5 @@ <===> legacy/to_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $saturation: -10%, $space: hsl)} <===> legacy/to_legacy/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> legacy/to_modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(red, $a: 10%, $space: lab)} <===> legacy/to_modern/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> modern/to_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% 10 -20), $saturation: -20%, $space: hsl)} <===> modern/to_legacy/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> modern/to_modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(lab(50% 10 -20), $chroma: 20%, $space: oklch)} <===> modern/to_modern/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> powerless/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(hsl(0deg 0% 50%), $space: lab)} <===> powerless/legacy/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> powerless/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(oklch(50% 0 0deg), $space: lab)} <===> powerless/modern/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> missing/legacy/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgb(none none none))} <===> missing/legacy/same/implicit/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> missing/legacy/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgb(none none none), $space: rgb)} <===> missing/legacy/same/explicit/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/legacy/analogous/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(hsl(none 50% 50%), $space: hwb)} <===> missing/legacy/analogous/legacy/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/legacy/analogous/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(rgb(none none none), $space: display-p3)} <===> missing/legacy/analogous/modern/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/modern/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb none none none))} <===> missing/modern/same/implicit/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/modern/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb none none none), $space: srgb)} <===> missing/modern/same/explicit/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> missing/modern/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb none none none), $space: display-p3)} <===> missing/modern/analogous/output.css diff --git a/spec/core_functions/color/scale/srgb.hrx b/spec/core_functions/color/scale/srgb.hrx index 790cce490f..90c044f48b 100644 --- a/spec/core_functions/color/scale/srgb.hrx +++ b/spec/core_functions/color/scale/srgb.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 100%)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: -100%)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 0%)} <===> red/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: -33%)} <===> red/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $red: 86%)} <===> red/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 100%)} <===> green/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: -100%)} <===> green/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 0%)} <===> green/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: -86%)} <===> green/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $green: 12%)} <===> green/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 100%)} <===> blue/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: -100%)} <===> blue/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 0%)} <===> blue/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: -16%)} <===> blue/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb 0.2 0.5 0.7), $blue: 42%)} <===> blue/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(color(srgb 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48%); } @@ -177,7 +177,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(srgb 0.2 0.5 0.7 / 0.3), @@ -193,7 +193,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(srgb 0.2 0.5 0.7), @@ -209,7 +209,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( $color: color(srgb 0.2 0.5 0.7), diff --git a/spec/core_functions/color/scale/srgb_linear.hrx b/spec/core_functions/color/scale/srgb_linear.hrx index 461f03ee9f..ec5c7ab514 100644 --- a/spec/core_functions/color/scale/srgb_linear.hrx +++ b/spec/core_functions/color/scale/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> red/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 100%)} <===> red/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> red/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: -100%)} <===> red/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> red/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 0%)} <===> red/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> red/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: -33%)} <===> red/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> red/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $red: 86%)} <===> red/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> green/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 100%)} <===> green/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> green/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: -100%)} <===> green/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> green/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 0%)} <===> green/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> green/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: -86%)} <===> green/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> green/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $green: 12%)} <===> green/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> blue/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 100%)} <===> blue/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> blue/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: -100%)} <===> blue/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> blue/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 0%)} <===> blue/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> blue/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: -16%)} <===> blue/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> blue/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(srgb-linear 0.2 0.5 0.7), $blue: 42%)} <===> blue/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(srgb-linear 0.2 0.5 0.7), $red: 12%, $green: 24%, $blue: 48% @@ -179,7 +179,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(srgb-linear 0.2 0.5 0.7 / 0.3), @@ -195,7 +195,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(srgb-linear 0.2 0.5 0.7), @@ -211,7 +211,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( $color: color(srgb-linear 0.2 0.5 0.7), diff --git a/spec/core_functions/color/scale/xyz_d50.hrx b/spec/core_functions/color/scale/xyz_d50.hrx index d07168feae..99be36e19a 100644 --- a/spec/core_functions/color/scale/xyz_d50.hrx +++ b/spec/core_functions/color/scale/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> x/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 100%)} <===> x/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> x/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: -100%)} <===> x/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> x/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 0%)} <===> x/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> x/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: -33%)} <===> x/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> x/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 86%)} <===> x/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> y/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 100%)} <===> y/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> y/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: -100%)} <===> y/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> y/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 0%)} <===> y/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> y/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: -86%)} <===> y/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> y/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $y: 12%)} <===> y/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> z/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 100%)} <===> z/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> z/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: -100%)} <===> z/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> z/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 0%)} <===> z/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> z/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: -16%)} <===> z/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> z/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d50 0.2 0.5 0.7), $z: 42%)} <===> z/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(color(xyz-d50 0.2 0.5 0.7), $x: 12%, $y: 24%, $z: 48%); } @@ -177,7 +177,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(color(xyz-d50 0.2 0.5 0.7 / 0.3), $x: 12%, $y: 24%, $z: 48%); } @@ -190,7 +190,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(xyz-d50 0.2 0.5 0.7), @@ -206,7 +206,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale($color: color(xyz-d50 0.2 0.5 0.7), $x: 12%, $y: 24%, $z: 48%); } diff --git a/spec/core_functions/color/scale/xyz_d65.hrx b/spec/core_functions/color/scale/xyz_d65.hrx index e115d74268..96488172da 100644 --- a/spec/core_functions/color/scale/xyz_d65.hrx +++ b/spec/core_functions/color/scale/xyz_d65.hrx @@ -1,5 +1,5 @@ <===> x/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 100%)} <===> x/max/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> x/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: -100%)} <===> x/min/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> x/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 0%)} <===> x/zero/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> x/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: -33%)} <===> x/low/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> x/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 86%)} <===> x/high/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> y/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 100%)} <===> y/max/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> y/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: -100%)} <===> y/min/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> y/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 0%)} <===> y/zero/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> y/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: -86%)} <===> y/low/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> y/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $y: 12%)} <===> y/high/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> z/max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 100%)} <===> z/max/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> z/min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: -100%)} <===> z/min/output.css @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> z/zero/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 0%)} <===> z/zero/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> z/low/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: -16%)} <===> z/low/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> z/high/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.scale(color(xyz-d65 0.2 0.5 0.7), $z: 42%)} <===> z/high/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> all/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(color(xyz-d65 0.2 0.5 0.7), $x: 12%, $y: 24%, $z: 48%); } @@ -177,7 +177,7 @@ a { <===> ================================================================================ <===> alpha_input/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale(color(xyz-d65 0.2 0.5 0.7 / 0.3), $x: 12%, $y: 24%, $z: 48%); } @@ -190,7 +190,7 @@ a { <===> ================================================================================ <===> alpha_arg/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale( color(xyz-d65 0.2 0.5 0.7), @@ -206,7 +206,7 @@ a { <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.scale($color: color(xyz-d65 0.2 0.5 0.7), $x: 12%, $y: 24%, $z: 48%); } diff --git a/spec/core_functions/color/to_gamut/a98_rgb.hrx b/spec/core_functions/color/to_gamut/a98_rgb.hrx index 9f9536a350..5fbe456a74 100644 --- a/spec/core_functions/color/to_gamut/a98_rgb.hrx +++ b/spec/core_functions/color/to_gamut/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(a98-rgb 0.2 0.5 0.8), $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(a98-rgb 1.5 0.5 0.8), $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(a98-rgb 0.2 0.5 0.8), $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(a98-rgb 1.1 0.5 0.8), $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(a98-rgb 0.8 1.1 1.4), $method: local-minde)} <===> local_minde/to_white/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(a98-rgb 0 -0.05 -0.05), $method: local-minde)} <===> local_minde/to_black/output.css diff --git a/spec/core_functions/color/to_gamut/display_p3.hrx b/spec/core_functions/color/to_gamut/display_p3.hrx index f66eb6148d..a4d8f4e7de 100644 --- a/spec/core_functions/color/to_gamut/display_p3.hrx +++ b/spec/core_functions/color/to_gamut/display_p3.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(display-p3 0.2 0.5 0.8), $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(display-p3 1.5 0.5 0.8), $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(display-p3 0.2 0.5 0.8), $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(display-p3 1.5 0.5 0.8), $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(display-p3 0.8 1.1 1.4), $method: local-minde)} <===> local_minde/to_white/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(display-p3 0 -0.05 -0.05), $method: local-minde)} <===> local_minde/to_black/output.css diff --git a/spec/core_functions/color/to_gamut/error.hrx b/spec/core_functions/color/to_gamut/error.hrx index 810f466bab..87bb177c5b 100644 --- a/spec/core_functions/color/to_gamut/error.hrx +++ b/spec/core_functions/color/to_gamut/error.hrx @@ -1,5 +1,5 @@ <===> color/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(c, $method: local-minde)} <===> color/type/error @@ -13,7 +13,7 @@ Error: $color: c is not a color. <===> ================================================================================ <===> space/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink, $space: red, $method: local-minde)} <===> space/type/error @@ -27,7 +27,7 @@ Error: $space: red is not a string. <===> ================================================================================ <===> space/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink, $space: c, $method: local-minde)} <===> space/unknown/error @@ -41,7 +41,7 @@ Error: $space: Unknown color space "c". <===> ================================================================================ <===> space/quoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink, $space: "rgb", $method: local-minde)} <===> space/quoted/error @@ -55,7 +55,7 @@ Error: $space: Expected "rgb" to be an unquoted string. <===> ================================================================================ <===> method/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink, $method: 1)} <===> method/type/error @@ -69,7 +69,7 @@ Error: $method: 1 is not a string. <===> ================================================================================ <===> method/unknown/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink, $method: c)} <===> method/unknown/error @@ -83,7 +83,7 @@ Error: Unknown gamut map method "c". <===> ================================================================================ <===> method/quoted/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink, $method: "clip")} <===> method/quoted/error @@ -97,7 +97,7 @@ Error: $method: Expected "clip" to be an unquoted string. <===> ================================================================================ <===> method/absent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink)} <===> method/absent/error @@ -113,7 +113,7 @@ $method: local-minde <===> ================================================================================ <===> method/null/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink, $method: null)} <===> method/null/error @@ -129,7 +129,7 @@ $method: local-minde <===> ================================================================================ <===> too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut()} <===> too_few_args/error @@ -147,7 +147,7 @@ Error: Missing argument $color. <===> ================================================================================ <===> too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(red, rgb, clip, c)} <===> too_many_args/error diff --git a/spec/core_functions/color/to_gamut/hsl.hrx b/spec/core_functions/color/to_gamut/hsl.hrx index 8acaf5982b..83e74bb291 100644 --- a/spec/core_functions/color/to_gamut/hsl.hrx +++ b/spec/core_functions/color/to_gamut/hsl.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hsl(70deg 50% 50%), $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(hsl(70deg 50% 50%), $saturation: 200%), @@ -26,7 +26,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hsl(70deg 50% 50%), $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -37,7 +37,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(hsl(70deg 50% 50%), $saturation: 107%), @@ -53,7 +53,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(hsl(70deg 50% 50%), $saturation: 120%), @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(hsl(70deg 100% 50%), $lightness: -1%), diff --git a/spec/core_functions/color/to_gamut/hwb.hrx b/spec/core_functions/color/to_gamut/hwb.hrx index 37c7578659..38fd408772 100644 --- a/spec/core_functions/color/to_gamut/hwb.hrx +++ b/spec/core_functions/color/to_gamut/hwb.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hwb(70deg 30% 30%), $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hwb(70deg 200% -50%), $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hwb(70deg 30% 30%), $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hwb(70deg -5% -5%), $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hwb(70deg -10% -10%), $method: local-minde)} <===> local_minde/to_white/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hwb(70deg -2% 100%), $method: local-minde)} <===> local_minde/to_black/output.css diff --git a/spec/core_functions/color/to_gamut/lab.hrx b/spec/core_functions/color/to_gamut/lab.hrx index 7ef179777e..60d1897deb 100644 --- a/spec/core_functions/color/to_gamut/lab.hrx +++ b/spec/core_functions/color/to_gamut/lab.hrx @@ -1,5 +1,5 @@ <===> clip/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(lab(50% 500 -999999), $lightness: 150%), @@ -15,7 +15,7 @@ a { <===> ================================================================================ <===> local_minde/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(lab(50% 500 -999999), $lightness: 150%), diff --git a/spec/core_functions/color/to_gamut/lch.hrx b/spec/core_functions/color/to_gamut/lch.hrx index bc58238646..4c0fd721b7 100644 --- a/spec/core_functions/color/to_gamut/lch.hrx +++ b/spec/core_functions/color/to_gamut/lch.hrx @@ -1,5 +1,5 @@ <===> clip/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(lch(50% 200% 70deg), $lightness: 150%), @@ -15,7 +15,7 @@ a { <===> ================================================================================ <===> local_minde/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(lch(50% 200% 70deg), $lightness: 150%), diff --git a/spec/core_functions/color/to_gamut/named.hrx b/spec/core_functions/color/to_gamut/named.hrx index 8e8f5de8c6..ece135cde1 100644 --- a/spec/core_functions/color/to_gamut/named.hrx +++ b/spec/core_functions/color/to_gamut/named.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut($color: pink, $space: rgb, $method: local-minde)} <===> output.css diff --git a/spec/core_functions/color/to_gamut/oklab.hrx b/spec/core_functions/color/to_gamut/oklab.hrx index 5ed7412f29..c6e6780dbf 100644 --- a/spec/core_functions/color/to_gamut/oklab.hrx +++ b/spec/core_functions/color/to_gamut/oklab.hrx @@ -1,5 +1,5 @@ <===> clip/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(oklab(50% 500 -999999), $lightness: 150%), @@ -15,7 +15,7 @@ a { <===> ================================================================================ <===> local_minde/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(oklab(50% 500 -999999), $lightness: 150%), diff --git a/spec/core_functions/color/to_gamut/oklch.hrx b/spec/core_functions/color/to_gamut/oklch.hrx index 41cf10892e..8394a7c7c5 100644 --- a/spec/core_functions/color/to_gamut/oklch.hrx +++ b/spec/core_functions/color/to_gamut/oklch.hrx @@ -1,5 +1,5 @@ <===> clip/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(oklch(50% 200% 70deg), $lightness: 150%), @@ -15,7 +15,7 @@ a { <===> ================================================================================ <===> local_minde/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(oklch(50% 200% 70deg), $lightness: 150%), diff --git a/spec/core_functions/color/to_gamut/positional.hrx b/spec/core_functions/color/to_gamut/positional.hrx index 6852cedaeb..c4bf4f302c 100644 --- a/spec/core_functions/color/to_gamut/positional.hrx +++ b/spec/core_functions/color/to_gamut/positional.hrx @@ -1,5 +1,5 @@ <===> input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(pink, rgb, local-minde)} <===> output.css diff --git a/spec/core_functions/color/to_gamut/prophoto_rgb.hrx b/spec/core_functions/color/to_gamut/prophoto_rgb.hrx index 656bb175bb..f78d0b034f 100644 --- a/spec/core_functions/color/to_gamut/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_gamut/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(prophoto-rgb 0.2 0.5 0.8), $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(prophoto-rgb 1.5 0.5 0.8), $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(prophoto-rgb 0.2 0.5 0.8), $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(prophoto-rgb 1.1 0.5 0.8), $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(prophoto-rgb 0.8 1.1 1.4), $method: local-minde)} <===> local_minde/to_white/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(prophoto-rgb 0 -0.05 -0.05), $method: local-minde)} <===> local_minde/to_black/output.css diff --git a/spec/core_functions/color/to_gamut/rec2020.hrx b/spec/core_functions/color/to_gamut/rec2020.hrx index 927de88e9f..ba8c3aee64 100644 --- a/spec/core_functions/color/to_gamut/rec2020.hrx +++ b/spec/core_functions/color/to_gamut/rec2020.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(rec2020 0.2 0.5 0.8), $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(rec2020 1.5 0.5 0.8), $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(rec2020 0.2 0.5 0.8), $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(rec2020 1.1 0.5 0.8), $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(rec2020 0.8 1.1 1.4), $method: local-minde)} <===> local_minde/to_white/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(rec2020 0 -0.05 -0.05), $method: local-minde)} <===> local_minde/to_black/output.css diff --git a/spec/core_functions/color/to_gamut/rgb.hrx b/spec/core_functions/color/to_gamut/rgb.hrx index 06c6708308..ef5d5b3f9b 100644 --- a/spec/core_functions/color/to_gamut/rgb.hrx +++ b/spec/core_functions/color/to_gamut/rgb.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(#abcdef, $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color.change(#abcdef, $red: 300), $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(#abcdef, $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color.change(#abcdef, $red: 300), $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(#e6ff00, $green: 280, $blue: -25), @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(black, $red: -5, $green: -5), diff --git a/spec/core_functions/color/to_gamut/space.hrx b/spec/core_functions/color/to_gamut/space.hrx index 45f7ac5145..99f46fe997 100644 --- a/spec/core_functions/color/to_gamut/space.hrx +++ b/spec/core_functions/color/to_gamut/space.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(oklch(60% 0.13 240deg), $space: rgb, $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(oklch(60% 0.15 240deg), $space: rgb, $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> clip/missing/legacy/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(rgb(none none none), $method: clip)} <===> clip/missing/legacy/same/implicit/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> clip/missing/legacy/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(rgb(none none none), $space: rgb, $method: clip)} <===> clip/missing/legacy/same/explicit/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> clip/missing/legacy/same/with_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(rgb(none 0 none), $green: 300), @@ -59,7 +59,7 @@ a { <===> ================================================================================ <===> clip/missing/legacy/analogous/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hsl(none 50% 50%), $space: hwb, $method: clip)} <===> clip/missing/legacy/analogous/legacy/output.css @@ -70,7 +70,7 @@ a { <===> ================================================================================ <===> clip/missing/legacy/analogous/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(rgb(none none none), $space: display-p3, $method: clip)} <===> clip/missing/legacy/analogous/modern/output.css @@ -81,7 +81,7 @@ a { <===> ================================================================================ <===> clip/missing/modern/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb none none none), $method: clip)} <===> clip/missing/modern/same/implicit/output.css @@ -92,7 +92,7 @@ a { <===> ================================================================================ <===> clip/missing/modern/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb none none none), $space: srgb, $method: clip)} <===> clip/missing/modern/same/explicit/output.css @@ -103,7 +103,7 @@ a { <===> ================================================================================ <===> clip/missing/modern/same/with_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb none 1.2 none), $method: clip)} <===> clip/missing/modern/same/with_mapping/output.css @@ -114,7 +114,7 @@ a { <===> ================================================================================ <===> clip/missing/modern/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color(srgb none none none), @@ -131,7 +131,7 @@ a { <===> ================================================================================ <===> clip/powerless/legacy/no_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hsl(0deg 0% 20%), $space: srgb, $method: clip)} <===> clip/powerless/legacy/no_mapping/output.css @@ -142,7 +142,7 @@ a { <===> ================================================================================ <===> clip/powerless/legacy/with_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hsl(0deg 10% 1000%), $space: srgb, $method: clip)} <===> clip/powerless/legacy/with_mapping/output.css @@ -153,7 +153,7 @@ a { <===> ================================================================================ <===> clip/powerless/modern/no_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(oklch(10% 0% 0deg), $space: srgb, $method: clip)} <===> clip/powerless/modern/no_mapping/output.css @@ -164,7 +164,7 @@ a { <===> ================================================================================ <===> clip/powerless/modern/with_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(lch(1000% 10% 0deg), $space: hsl, $method: clip)} <===> clip/powerless/modern/with_mapping/output.css @@ -175,7 +175,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(oklch(60% 0.13 240deg), $space: rgb, $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -186,7 +186,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(oklch(60% 0.15 240deg), $space: rgb, $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -197,7 +197,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(oklch(100% 0.13 240deg), $space: rgb, $method: local-minde)} <===> local_minde/to_white/output.css @@ -208,7 +208,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(oklch(0% 0.13 240deg), $space: rgb, $method: local-minde)} <===> local_minde/to_black/output.css @@ -219,7 +219,7 @@ a { <===> ================================================================================ <===> local_minde/missing/legacy/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(rgb(none none none), $method: local-minde)} <===> local_minde/missing/legacy/same/implicit/output.css @@ -230,7 +230,7 @@ a { <===> ================================================================================ <===> local_minde/missing/legacy/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(rgb(none none none), $space: rgb, $method: local-minde)} <===> local_minde/missing/legacy/same/explicit/output.css @@ -241,7 +241,7 @@ a { <===> ================================================================================ <===> local_minde/missing/legacy/same/with_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color.change(rgb(none 0 none), $green: 300), @@ -257,7 +257,7 @@ a { <===> ================================================================================ <===> local_minde/missing/legacy/analogous/legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hsl(none 50% 50%), $space: hwb, $method: local-minde)} <===> local_minde/missing/legacy/analogous/legacy/output.css @@ -268,7 +268,7 @@ a { <===> ================================================================================ <===> local_minde/missing/legacy/analogous/modern/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( rgb(none none none), @@ -285,7 +285,7 @@ a { <===> ================================================================================ <===> local_minde/missing/modern/same/implicit/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb none none none), $method: local-minde)} <===> local_minde/missing/modern/same/implicit/output.css @@ -296,7 +296,7 @@ a { <===> ================================================================================ <===> local_minde/missing/modern/same/explicit/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color(srgb none none none), @@ -313,7 +313,7 @@ a { <===> ================================================================================ <===> local_minde/missing/modern/same/with_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb none 1.2 none), $method: local-minde)} <===> local_minde/missing/modern/same/with_mapping/output.css @@ -324,7 +324,7 @@ a { <===> ================================================================================ <===> local_minde/missing/modern/analogous/input.scss -@use 'sass:color'; +@use "sass:color"; a { b: color.to-gamut( color(srgb none none none), @@ -341,7 +341,7 @@ a { <===> ================================================================================ <===> local_minde/powerless/legacy/no_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hsl(0deg 0% 20%), $space: srgb, $method: local-minde)} <===> local_minde/powerless/legacy/no_mapping/output.css @@ -352,7 +352,7 @@ a { <===> ================================================================================ <===> local_minde/powerless/legacy/with_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(hsl(0deg 10% 1000%), $space: srgb, $method: local-minde)} <===> local_minde/powerless/legacy/with_mapping/output.css @@ -363,7 +363,7 @@ a { <===> ================================================================================ <===> local_minde/powerless/modern/no_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(oklch(10% 0% 0deg), $space: srgb, $method: local-minde)} <===> local_minde/powerless/modern/no_mapping/output.css @@ -374,7 +374,7 @@ a { <===> ================================================================================ <===> local_minde/powerless/modern/with_mapping/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(lch(1000% 10% 0deg), $space: srgb, $method: local-minde)} <===> local_minde/powerless/modern/with_mapping/output.css diff --git a/spec/core_functions/color/to_gamut/srgb.hrx b/spec/core_functions/color/to_gamut/srgb.hrx index 0ebdad5865..34df863306 100644 --- a/spec/core_functions/color/to_gamut/srgb.hrx +++ b/spec/core_functions/color/to_gamut/srgb.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb 0.2 0.5 0.8), $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb 1.5 0.5 0.8), $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb 0.2 0.5 0.8), $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb 1.5 0.5 0.8), $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb 0.9 1.1 -0.1), $method: local-minde)} <===> local_minde/to_white/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb 0 -0.05 -0.05), $method: local-minde)} <===> local_minde/to_black/output.css diff --git a/spec/core_functions/color/to_gamut/srgb_linear.hrx b/spec/core_functions/color/to_gamut/srgb_linear.hrx index 12c0aad915..5daf813118 100644 --- a/spec/core_functions/color/to_gamut/srgb_linear.hrx +++ b/spec/core_functions/color/to_gamut/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> clip/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb-linear 0.2 0.5 0.8), $method: clip)} <===> clip/in_gamut/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> clip/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb-linear 1.5 0.5 0.8), $method: clip)} <===> clip/out_of_gamut/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> local_minde/in_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb-linear 0.2 0.5 0.8), $method: local-minde)} <===> local_minde/in_gamut/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> local_minde/out_of_gamut/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb-linear 1.5 0.5 0.8), $method: local-minde)} <===> local_minde/out_of_gamut/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> local_minde/to_white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb-linear 0.9 1.2 1.6), $method: local-minde)} <===> local_minde/to_white/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> local_minde/to_black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(srgb-linear 0 -0.05 -0.05), $method: local-minde)} <===> local_minde/to_black/output.css diff --git a/spec/core_functions/color/to_gamut/xyz.hrx b/spec/core_functions/color/to_gamut/xyz.hrx index 4a1a112aba..c94b5aec40 100644 --- a/spec/core_functions/color/to_gamut/xyz.hrx +++ b/spec/core_functions/color/to_gamut/xyz.hrx @@ -1,5 +1,5 @@ <===> clip/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(xyz 123 -456 999999), $method: clip)} <===> clip/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local_minde/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(xyz 123 -456 999999), $method: local-minde)} <===> local_minde/output.css diff --git a/spec/core_functions/color/to_gamut/xyz_d50.hrx b/spec/core_functions/color/to_gamut/xyz_d50.hrx index 29e382f14b..b382f29e4f 100644 --- a/spec/core_functions/color/to_gamut/xyz_d50.hrx +++ b/spec/core_functions/color/to_gamut/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> clip/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(xyz-d50 123 -456 999999), $method: clip)} <===> clip/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> local_minde/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-gamut(color(xyz-d50 123 -456 999999), $method: local-minde)} <===> local_minde/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/a98_rgb.hrx b/spec/core_functions/color/to_space/a98_rgb/a98_rgb.hrx index 4bc1c0f90f..849e036c8f 100644 --- a/spec/core_functions/color/to_space/a98_rgb/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), a98-rgb)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), a98-rgb)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), a98-rgb)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), a98-rgb)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), a98-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/display_p3.hrx b/spec/core_functions/color/to_space/a98_rgb/display_p3.hrx index f9b4cced51..06e3aa43c5 100644 --- a/spec/core_functions/color/to_space/a98_rgb/display_p3.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), display-p3)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), display-p3)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/hsl.hrx b/spec/core_functions/color/to_space/a98_rgb/hsl.hrx index 7cd8479c26..4953d6d219 100644 --- a/spec/core_functions/color/to_space/a98_rgb/hsl.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), hsl)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), hsl)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/hwb.hrx b/spec/core_functions/color/to_space/a98_rgb/hwb.hrx index 3bb49a02da..0ac786841b 100644 --- a/spec/core_functions/color/to_space/a98_rgb/hwb.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb 0 0 0), hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb 1 1 1), hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb 0.5 0.5 0.5), hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb 0.2 0.4 0.8), hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb -1 0.4 2), hwb)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb -999999 0 0), hwb)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), hwb)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), hwb)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb none 0.2 0.3), hwb)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(a98-rgb 0.1 none 0.3), hwb)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), hwb)} diff --git a/spec/core_functions/color/to_space/a98_rgb/lab.hrx b/spec/core_functions/color/to_space/a98_rgb/lab.hrx index 4a48c3bd91..016a5d6a6c 100644 --- a/spec/core_functions/color/to_space/a98_rgb/lab.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), lab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), lab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/lch.hrx b/spec/core_functions/color/to_space/a98_rgb/lch.hrx index 1e366c8f35..13ece3e954 100644 --- a/spec/core_functions/color/to_space/a98_rgb/lch.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), lch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), lch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/oklab.hrx b/spec/core_functions/color/to_space/a98_rgb/oklab.hrx index ffa55034d4..fdca2567fb 100644 --- a/spec/core_functions/color/to_space/a98_rgb/oklab.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), oklab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), oklab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/oklch.hrx b/spec/core_functions/color/to_space/a98_rgb/oklch.hrx index 5d97880ac5..9f2e1e6a2c 100644 --- a/spec/core_functions/color/to_space/a98_rgb/oklch.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), oklch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), oklch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/a98_rgb/prophoto_rgb.hrx index 6a88485ab3..1e9750e56b 100644 --- a/spec/core_functions/color/to_space/a98_rgb/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), prophoto-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), prophoto-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/rec2020.hrx b/spec/core_functions/color/to_space/a98_rgb/rec2020.hrx index 6d7c159b65..77284b927c 100644 --- a/spec/core_functions/color/to_space/a98_rgb/rec2020.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), rec2020)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), rec2020)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/rgb.hrx b/spec/core_functions/color/to_space/a98_rgb/rgb.hrx index bd182a171f..a2c0d680a7 100644 --- a/spec/core_functions/color/to_space/a98_rgb/rgb.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/srgb.hrx b/spec/core_functions/color/to_space/a98_rgb/srgb.hrx index 055a335bb1..25fe9220d3 100644 --- a/spec/core_functions/color/to_space/a98_rgb/srgb.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), srgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), srgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/srgb_linear.hrx b/spec/core_functions/color/to_space/a98_rgb/srgb_linear.hrx index 5331e68fd9..83a119d04f 100644 --- a/spec/core_functions/color/to_space/a98_rgb/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), srgb-linear)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), srgb-linear)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/xyz.hrx b/spec/core_functions/color/to_space/a98_rgb/xyz.hrx index f28f378cf4..65d23f1fe4 100644 --- a/spec/core_functions/color/to_space/a98_rgb/xyz.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), xyz)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), xyz)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/a98_rgb/xyz_d50.hrx b/spec/core_functions/color/to_space/a98_rgb/xyz_d50.hrx index eea89911d6..be6ccb697c 100644 --- a/spec/core_functions/color/to_space/a98_rgb/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/a98_rgb/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 1 1 1), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.5 0.5 0.5), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.2 0.4 0.8), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -1 0.4 2), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb -999999 0 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(a98-rgb 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/a98_rgb.hrx b/spec/core_functions/color/to_space/display_p3/a98_rgb.hrx index e955516f64..9bb4c67416 100644 --- a/spec/core_functions/color/to_space/display_p3/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/display_p3/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), a98-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), a98-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), a98-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), a98-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), a98-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/display_p3.hrx b/spec/core_functions/color/to_space/display_p3/display_p3.hrx index add7546595..cc74a18d75 100644 --- a/spec/core_functions/color/to_space/display_p3/display_p3.hrx +++ b/spec/core_functions/color/to_space/display_p3/display_p3.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), display-p3)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), display-p3)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), display-p3)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), display-p3)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/hsl.hrx b/spec/core_functions/color/to_space/display_p3/hsl.hrx index d7a6690c16..d276ccc3cd 100644 --- a/spec/core_functions/color/to_space/display_p3/hsl.hrx +++ b/spec/core_functions/color/to_space/display_p3/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), hsl)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), hsl)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/hwb.hrx b/spec/core_functions/color/to_space/display_p3/hwb.hrx index 5177aca637..08ec3b60a4 100644 --- a/spec/core_functions/color/to_space/display_p3/hwb.hrx +++ b/spec/core_functions/color/to_space/display_p3/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 0 0 0), hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 1 1 1), hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 0.5 0.5 0.5), hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 0.2 0.4 0.8), hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 -1 0.4 2), hwb)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 -999999 0 0), hwb)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), hwb)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), hwb)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 none 0.2 0.3), hwb)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(display-p3 0.1 none 0.3), hwb)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(color(display-p3 0.1 0.2 none), hwb)} diff --git a/spec/core_functions/color/to_space/display_p3/lab.hrx b/spec/core_functions/color/to_space/display_p3/lab.hrx index c36752382b..b58a51efa4 100644 --- a/spec/core_functions/color/to_space/display_p3/lab.hrx +++ b/spec/core_functions/color/to_space/display_p3/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), lab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), lab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/lch.hrx b/spec/core_functions/color/to_space/display_p3/lch.hrx index 50dbdaa329..672ceba870 100644 --- a/spec/core_functions/color/to_space/display_p3/lch.hrx +++ b/spec/core_functions/color/to_space/display_p3/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), lch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), lch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/oklab.hrx b/spec/core_functions/color/to_space/display_p3/oklab.hrx index cd316220b5..8d87bef4e2 100644 --- a/spec/core_functions/color/to_space/display_p3/oklab.hrx +++ b/spec/core_functions/color/to_space/display_p3/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), oklab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), oklab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/oklch.hrx b/spec/core_functions/color/to_space/display_p3/oklch.hrx index 358d1d052e..69ae84b779 100644 --- a/spec/core_functions/color/to_space/display_p3/oklch.hrx +++ b/spec/core_functions/color/to_space/display_p3/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), oklch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), oklch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/prophoto_rgb.hrx b/spec/core_functions/color/to_space/display_p3/prophoto_rgb.hrx index 54cffa4144..4647430450 100644 --- a/spec/core_functions/color/to_space/display_p3/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/display_p3/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), prophoto-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), prophoto-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/rec2020.hrx b/spec/core_functions/color/to_space/display_p3/rec2020.hrx index 66bbb591ba..6f5ae22185 100644 --- a/spec/core_functions/color/to_space/display_p3/rec2020.hrx +++ b/spec/core_functions/color/to_space/display_p3/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), rec2020)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), rec2020)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/rgb.hrx b/spec/core_functions/color/to_space/display_p3/rgb.hrx index f447f77038..050651b9a5 100644 --- a/spec/core_functions/color/to_space/display_p3/rgb.hrx +++ b/spec/core_functions/color/to_space/display_p3/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/srgb.hrx b/spec/core_functions/color/to_space/display_p3/srgb.hrx index 0ba1c089a0..32ee1b1a8a 100644 --- a/spec/core_functions/color/to_space/display_p3/srgb.hrx +++ b/spec/core_functions/color/to_space/display_p3/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), srgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), srgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/srgb_linear.hrx b/spec/core_functions/color/to_space/display_p3/srgb_linear.hrx index 3d54ca5325..9cf242227c 100644 --- a/spec/core_functions/color/to_space/display_p3/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/display_p3/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), srgb-linear)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), srgb-linear)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/xyz.hrx b/spec/core_functions/color/to_space/display_p3/xyz.hrx index 43ecb686cc..b0c7795a36 100644 --- a/spec/core_functions/color/to_space/display_p3/xyz.hrx +++ b/spec/core_functions/color/to_space/display_p3/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), xyz)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), xyz)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/display_p3/xyz_d50.hrx b/spec/core_functions/color/to_space/display_p3/xyz_d50.hrx index 5bd4149c20..cff2de15b5 100644 --- a/spec/core_functions/color/to_space/display_p3/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/display_p3/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 1 1 1), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.5 0.5 0.5), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.2 0.4 0.8), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -1 0.4 2), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 -999999 0 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(display-p3 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/error.hrx b/spec/core_functions/color/to_space/error.hrx index 1d0122ad3b..a1c9b368b9 100644 --- a/spec/core_functions/color/to_space/error.hrx +++ b/spec/core_functions/color/to_space/error.hrx @@ -1,5 +1,5 @@ <===> undefined_space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#abc, c)} <===> undefined_space/error @@ -13,7 +13,7 @@ Error: $space: Unknown color space "c". <===> ================================================================================ <===> quoted_space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#abc, "hsl")} <===> quoted_space/error @@ -27,7 +27,7 @@ Error: $space: Expected "hsl" to be an unquoted string. <===> ================================================================================ <===> too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#abc)} <===> too_few_args/error @@ -45,7 +45,7 @@ Error: Missing argument $space. <===> ================================================================================ <===> too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#abc, rgb, hsl)} <===> too_many_args/error @@ -63,7 +63,7 @@ Error: Only 2 arguments allowed, but 3 were passed. <===> ================================================================================ <===> type/color/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(1, rgb)} <===> type/color/error @@ -77,7 +77,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> type/space/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#abc, #def)} <===> type/space/error diff --git a/spec/core_functions/color/to_space/hsl/a98_rgb.hrx b/spec/core_functions/color/to_space/hsl/a98_rgb.hrx index 3a29b9188d..acb66a22d1 100644 --- a/spec/core_functions/color/to_space/hsl/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/hsl/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), a98-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), a98-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), a98-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), a98-rgb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), a98-rgb)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), a98-rgb)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/display_p3.hrx b/spec/core_functions/color/to_space/hsl/display_p3.hrx index 0a7daa3769..e81c384dd7 100644 --- a/spec/core_functions/color/to_space/hsl/display_p3.hrx +++ b/spec/core_functions/color/to_space/hsl/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), display-p3)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), display-p3)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), display-p3)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), display-p3)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), display-p3)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), display-p3)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), display-p3)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/hsl.hrx b/spec/core_functions/color/to_space/hsl/hsl.hrx index 2739692dad..d33b5731f9 100644 --- a/spec/core_functions/color/to_space/hsl/hsl.hrx +++ b/spec/core_functions/color/to_space/hsl/hsl.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 20% 40%), hsl)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), hsl)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), hsl)} <===> missing/hue/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), hsl)} <===> missing/saturation/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), hsl)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/hwb.hrx b/spec/core_functions/color/to_space/hsl/hwb.hrx index 0e2cfb1a18..72fc49f477 100644 --- a/spec/core_functions/color/to_space/hsl/hwb.hrx +++ b/spec/core_functions/color/to_space/hsl/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), hwb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), hwb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), hwb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), hwb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), hwb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), hwb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), hwb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), hwb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), hwb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), hwb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), hwb)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), hwb)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/lab.hrx b/spec/core_functions/color/to_space/hsl/lab.hrx index bf3a6b1b90..0325b86cb8 100644 --- a/spec/core_functions/color/to_space/hsl/lab.hrx +++ b/spec/core_functions/color/to_space/hsl/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), lab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), lab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), lab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), lab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), lab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), lab)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), lab)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), lab)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/lch.hrx b/spec/core_functions/color/to_space/hsl/lch.hrx index 4414beb84d..d390e36ecf 100644 --- a/spec/core_functions/color/to_space/hsl/lch.hrx +++ b/spec/core_functions/color/to_space/hsl/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), lch)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), lch)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), lch)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), lch)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), lch)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), lch)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), lch)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), lch)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/oklab.hrx b/spec/core_functions/color/to_space/hsl/oklab.hrx index b2b6515301..d2ee1ffeaf 100644 --- a/spec/core_functions/color/to_space/hsl/oklab.hrx +++ b/spec/core_functions/color/to_space/hsl/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), oklab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), oklab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), oklab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), oklab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), oklab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), oklab)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), oklab)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), oklab)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/oklch.hrx b/spec/core_functions/color/to_space/hsl/oklch.hrx index f9fda4187d..1f10c5d6c8 100644 --- a/spec/core_functions/color/to_space/hsl/oklch.hrx +++ b/spec/core_functions/color/to_space/hsl/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), oklch)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), oklch)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), oklch)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), oklch)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), oklch)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), oklch)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), oklch)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), oklch)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/prophoto_rgb.hrx b/spec/core_functions/color/to_space/hsl/prophoto_rgb.hrx index c06257a9b2..81453b78c9 100644 --- a/spec/core_functions/color/to_space/hsl/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/hsl/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), prophoto-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), prophoto-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), prophoto-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), prophoto-rgb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), prophoto-rgb)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), prophoto-rgb)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/rec2020.hrx b/spec/core_functions/color/to_space/hsl/rec2020.hrx index 6c3b33cc50..ea2e1c3c9f 100644 --- a/spec/core_functions/color/to_space/hsl/rec2020.hrx +++ b/spec/core_functions/color/to_space/hsl/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), rec2020)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), rec2020)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), rec2020)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), rec2020)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), rec2020)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), rec2020)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), rec2020)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/rgb.hrx b/spec/core_functions/color/to_space/hsl/rgb.hrx index 08fc696e43..9c73be636d 100644 --- a/spec/core_functions/color/to_space/hsl/rgb.hrx +++ b/spec/core_functions/color/to_space/hsl/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), rgb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), rgb)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), rgb)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/srgb.hrx b/spec/core_functions/color/to_space/hsl/srgb.hrx index c8fdd63fd2..3a71716158 100644 --- a/spec/core_functions/color/to_space/hsl/srgb.hrx +++ b/spec/core_functions/color/to_space/hsl/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), srgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), srgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), srgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), srgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), srgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), srgb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), srgb)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), srgb)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/srgb_linear.hrx b/spec/core_functions/color/to_space/hsl/srgb_linear.hrx index eba0eeac34..8b50b8bcca 100644 --- a/spec/core_functions/color/to_space/hsl/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/hsl/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), srgb-linear)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), srgb-linear)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), srgb-linear)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), srgb-linear)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), srgb-linear)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), srgb-linear)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/xyz.hrx b/spec/core_functions/color/to_space/hsl/xyz.hrx index a745994d19..60204e1778 100644 --- a/spec/core_functions/color/to_space/hsl/xyz.hrx +++ b/spec/core_functions/color/to_space/hsl/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), xyz)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), xyz)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), xyz)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), xyz)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), xyz)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), xyz)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), xyz)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), xyz)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hsl/xyz_d50.hrx b/spec/core_functions/color/to_space/hsl/xyz_d50.hrx index 43a75aaf5a..6fa38d3f4c 100644 --- a/spec/core_functions/color/to_space/hsl/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/hsl/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 0%), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 100%), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(0deg 0% 50%), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(80deg 30% 60%), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20.123456789deg 30.987654321% 60.192837465%), xyz-d50)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 200% -50%), xyz-d50)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(20deg 999999% 50%), xyz-d50)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% 30% / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(none 20% 30%), xyz-d50)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/saturation/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg none 30%), xyz-d50)} <===> missing/saturation/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hsl(10deg 20% none), xyz-d50)} <===> missing/lightness/output.css diff --git a/spec/core_functions/color/to_space/hwb/a98_rgb.hrx b/spec/core_functions/color/to_space/hwb/a98_rgb.hrx index 92c8a3f06c..ea088e39f6 100644 --- a/spec/core_functions/color/to_space/hwb/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/hwb/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), a98-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), a98-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), a98-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), a98-rgb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), a98-rgb)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), a98-rgb)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/display_p3.hrx b/spec/core_functions/color/to_space/hwb/display_p3.hrx index 00f265a145..eee8a6ccaa 100644 --- a/spec/core_functions/color/to_space/hwb/display_p3.hrx +++ b/spec/core_functions/color/to_space/hwb/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), display-p3)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), display-p3)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), display-p3)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), display-p3)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), display-p3)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), display-p3)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), display-p3)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/hsl.hrx b/spec/core_functions/color/to_space/hwb/hsl.hrx index 7b449c7cac..8ccc6eb685 100644 --- a/spec/core_functions/color/to_space/hwb/hsl.hrx +++ b/spec/core_functions/color/to_space/hwb/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), hsl)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), hsl)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), hsl)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), hsl)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), hsl)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), hsl)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), hsl)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), hsl)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/hwb.hrx b/spec/core_functions/color/to_space/hwb/hwb.hrx index 85748076dc..1f22a20797 100644 --- a/spec/core_functions/color/to_space/hwb/hwb.hrx +++ b/spec/core_functions/color/to_space/hwb/hwb.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 20% 30%), hwb)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), hwb)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), hsl)} <===> missing/hue/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), hsl)} <===> missing/whiteness/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), hsl)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/lab.hrx b/spec/core_functions/color/to_space/hwb/lab.hrx index 32f1bf6a5e..6727778e5c 100644 --- a/spec/core_functions/color/to_space/hwb/lab.hrx +++ b/spec/core_functions/color/to_space/hwb/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), lab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), lab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), lab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), lab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), lab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), lab)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), lab)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), lab)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/lch.hrx b/spec/core_functions/color/to_space/hwb/lch.hrx index 1739ce2ab6..14727618c4 100644 --- a/spec/core_functions/color/to_space/hwb/lch.hrx +++ b/spec/core_functions/color/to_space/hwb/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), lch)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), lch)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), lch)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), lch)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), lch)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), lch)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), lch)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), lch)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/oklab.hrx b/spec/core_functions/color/to_space/hwb/oklab.hrx index 2b2d1c099b..d37240ef28 100644 --- a/spec/core_functions/color/to_space/hwb/oklab.hrx +++ b/spec/core_functions/color/to_space/hwb/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), oklab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), oklab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), oklab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), oklab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), oklab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), oklab)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), oklab)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), oklab)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/oklch.hrx b/spec/core_functions/color/to_space/hwb/oklch.hrx index 1708da5d79..34fea9de33 100644 --- a/spec/core_functions/color/to_space/hwb/oklch.hrx +++ b/spec/core_functions/color/to_space/hwb/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), oklch)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), oklch)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), oklch)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), oklch)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), oklch)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), oklch)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), oklch)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), oklch)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/hwb/prophoto_rgb.hrx index b7a59a9136..5210e50f74 100644 --- a/spec/core_functions/color/to_space/hwb/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/hwb/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), prophoto-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), prophoto-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), prophoto-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), prophoto-rgb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), prophoto-rgb)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), prophoto-rgb)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/rec2020.hrx b/spec/core_functions/color/to_space/hwb/rec2020.hrx index e1843dc52d..62eb282405 100644 --- a/spec/core_functions/color/to_space/hwb/rec2020.hrx +++ b/spec/core_functions/color/to_space/hwb/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), rec2020)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), rec2020)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), rec2020)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), rec2020)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), rec2020)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), rec2020)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), rec2020)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/rgb.hrx b/spec/core_functions/color/to_space/hwb/rgb.hrx index b5faeef92a..86fe7740ba 100644 --- a/spec/core_functions/color/to_space/hwb/rgb.hrx +++ b/spec/core_functions/color/to_space/hwb/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), rgb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), rgb)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), rgb)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/srgb.hrx b/spec/core_functions/color/to_space/hwb/srgb.hrx index bb90b12a95..a74be0c73d 100644 --- a/spec/core_functions/color/to_space/hwb/srgb.hrx +++ b/spec/core_functions/color/to_space/hwb/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), srgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), srgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), srgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), srgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), srgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), srgb)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), srgb)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), srgb)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/srgb_linear.hrx b/spec/core_functions/color/to_space/hwb/srgb_linear.hrx index 7e4b5a0c85..8fc58e015d 100644 --- a/spec/core_functions/color/to_space/hwb/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/hwb/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), srgb-linear)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), srgb-linear)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), srgb-linear)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), srgb-linear)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), srgb-linear)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), srgb-linear)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/xyz.hrx b/spec/core_functions/color/to_space/hwb/xyz.hrx index 7938a22570..57672f1371 100644 --- a/spec/core_functions/color/to_space/hwb/xyz.hrx +++ b/spec/core_functions/color/to_space/hwb/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), xyz)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), xyz)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), xyz)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), xyz)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), xyz)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), xyz)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), xyz)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), xyz)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/hwb/xyz_d50.hrx b/spec/core_functions/color/to_space/hwb/xyz_d50.hrx index c1da6bfc0b..d3b7c53e22 100644 --- a/spec/core_functions/color/to_space/hwb/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/hwb/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 0% 100%), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 100% 0%), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(0deg 50% 50%), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(80deg 20% 40%), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20.123456789deg 30.987654321% 40.192837465%), xyz-d50)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 200% -125%), xyz-d50)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(20deg 999999% -999950%), xyz-d50)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% 30% / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(none 20% 30%), xyz-d50)} <===> missing/hue/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/whiteness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg none 30%), xyz-d50)} <===> missing/whiteness/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(hwb(10deg 20% none), xyz-d50)} <===> missing/blackness/output.css diff --git a/spec/core_functions/color/to_space/lab/a98_rgb.hrx b/spec/core_functions/color/to_space/lab/a98_rgb.hrx index 76ea6d2bf8..0272e26384 100644 --- a/spec/core_functions/color/to_space/lab/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/lab/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), a98-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), a98-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), a98-rgb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), a98-rgb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), a98-rgb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/display_p3.hrx b/spec/core_functions/color/to_space/lab/display_p3.hrx index 455c576c92..be7746f843 100644 --- a/spec/core_functions/color/to_space/lab/display_p3.hrx +++ b/spec/core_functions/color/to_space/lab/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), display-p3)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), display-p3)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), display-p3)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/hsl.hrx b/spec/core_functions/color/to_space/lab/hsl.hrx index bb7b47371f..918bf4c441 100644 --- a/spec/core_functions/color/to_space/lab/hsl.hrx +++ b/spec/core_functions/color/to_space/lab/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), hsl)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), hsl)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), hsl)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/hwb.hrx b/spec/core_functions/color/to_space/lab/hwb.hrx index 7ca3d0c5d6..2c4f540cfb 100644 --- a/spec/core_functions/color/to_space/lab/hwb.hrx +++ b/spec/core_functions/color/to_space/lab/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), hwb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), hwb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), hwb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), hwb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), hwb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), hwb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), hwb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), hwb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), hwb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), hwb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), hwb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/lab.hrx b/spec/core_functions/color/to_space/lab/lab.hrx index 8adb6ffcf9..353a128071 100644 --- a/spec/core_functions/color/to_space/lab/lab.hrx +++ b/spec/core_functions/color/to_space/lab/lab.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), lab)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -150 150), lab)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), lab)} <===> missing/lightness/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), lab)} <===> missing/a/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), lab)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/lch.hrx b/spec/core_functions/color/to_space/lab/lch.hrx index dc10290577..a243afde88 100644 --- a/spec/core_functions/color/to_space/lab/lch.hrx +++ b/spec/core_functions/color/to_space/lab/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), lch)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), lch)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), lch)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/oklab.hrx b/spec/core_functions/color/to_space/lab/oklab.hrx index bc5714f240..2e342d0a72 100644 --- a/spec/core_functions/color/to_space/lab/oklab.hrx +++ b/spec/core_functions/color/to_space/lab/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), oklab)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), oklab)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), oklab)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/oklch.hrx b/spec/core_functions/color/to_space/lab/oklch.hrx index 3b514f14f9..3cb945ea0c 100644 --- a/spec/core_functions/color/to_space/lab/oklch.hrx +++ b/spec/core_functions/color/to_space/lab/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), oklch)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), oklch)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), oklch)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/prophoto_rgb.hrx b/spec/core_functions/color/to_space/lab/prophoto_rgb.hrx index a749af49c7..ce3cc40c43 100644 --- a/spec/core_functions/color/to_space/lab/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/lab/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), prophoto-rgb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), prophoto-rgb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), prophoto-rgb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/rec2020.hrx b/spec/core_functions/color/to_space/lab/rec2020.hrx index 46bdeca5a6..5ea39671eb 100644 --- a/spec/core_functions/color/to_space/lab/rec2020.hrx +++ b/spec/core_functions/color/to_space/lab/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), rec2020)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), rec2020)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), rec2020)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/rgb.hrx b/spec/core_functions/color/to_space/lab/rgb.hrx index 7a0d2828f8..ffffab524c 100644 --- a/spec/core_functions/color/to_space/lab/rgb.hrx +++ b/spec/core_functions/color/to_space/lab/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), rgb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), rgb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), rgb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/srgb.hrx b/spec/core_functions/color/to_space/lab/srgb.hrx index 051129a683..937766a819 100644 --- a/spec/core_functions/color/to_space/lab/srgb.hrx +++ b/spec/core_functions/color/to_space/lab/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), srgb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), srgb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), srgb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/srgb_linear.hrx b/spec/core_functions/color/to_space/lab/srgb_linear.hrx index b1571e3e32..991959b87b 100644 --- a/spec/core_functions/color/to_space/lab/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/lab/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), srgb-linear)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), srgb-linear)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), srgb-linear)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/xyz.hrx b/spec/core_functions/color/to_space/lab/xyz.hrx index f7a95e1c2d..6bee277bf2 100644 --- a/spec/core_functions/color/to_space/lab/xyz.hrx +++ b/spec/core_functions/color/to_space/lab/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), xyz)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), xyz)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), xyz)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lab/xyz_d50.hrx b/spec/core_functions/color/to_space/lab/xyz_d50.hrx index 5a8efed971..349ee58cb1 100644 --- a/spec/core_functions/color/to_space/lab/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/lab/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(0% 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(100% 0 0), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 0 0), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% 50 -75), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lab(0% -150 150), $lightness: -50%), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(50% -999999 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 30 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(none 20 30), xyz-d50)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% none 30), xyz-d50)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lab(10% 20 none), xyz-d50)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/lch/a98_rgb.hrx b/spec/core_functions/color/to_space/lch/a98_rgb.hrx index 039ab24446..36751b4315 100644 --- a/spec/core_functions/color/to_space/lch/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/lch/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), a98-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), a98-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), a98-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), a98-rgb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), a98-rgb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), a98-rgb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/display_p3.hrx b/spec/core_functions/color/to_space/lch/display_p3.hrx index feb57ac168..c34a776935 100644 --- a/spec/core_functions/color/to_space/lch/display_p3.hrx +++ b/spec/core_functions/color/to_space/lch/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), display-p3)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), display-p3)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), display-p3)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), display-p3)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), display-p3)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), display-p3)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), display-p3)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/hsl.hrx b/spec/core_functions/color/to_space/lch/hsl.hrx index 9ae96d8746..314b60c6a9 100644 --- a/spec/core_functions/color/to_space/lch/hsl.hrx +++ b/spec/core_functions/color/to_space/lch/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), hsl)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), hsl)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), hsl)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), hsl)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), hsl)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), hsl)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), hsl)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), hsl)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/hwb.hrx b/spec/core_functions/color/to_space/lch/hwb.hrx index 55e24ac9d7..6b5b315a8e 100644 --- a/spec/core_functions/color/to_space/lch/hwb.hrx +++ b/spec/core_functions/color/to_space/lch/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), hwb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), hwb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), hwb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), hwb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), hwb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), hwb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), hwb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), hwb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), hwb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), hwb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), hwb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), hwb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/lab.hrx b/spec/core_functions/color/to_space/lch/lab.hrx index 2fe08c506e..2512251ec7 100644 --- a/spec/core_functions/color/to_space/lch/lab.hrx +++ b/spec/core_functions/color/to_space/lch/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), lab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), lab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), lab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), lab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), lab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), lab)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), lab)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), lab)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/lch.hrx b/spec/core_functions/color/to_space/lch/lch.hrx index ba45e1f7bd..1407343af1 100644 --- a/spec/core_functions/color/to_space/lch/lch.hrx +++ b/spec/core_functions/color/to_space/lch/lch.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), lch)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), lch)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), lch)} <===> missing/lightness/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), lch)} <===> missing/chroma/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), lch)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/oklab.hrx b/spec/core_functions/color/to_space/lch/oklab.hrx index 45cc15adfe..85b110a17c 100644 --- a/spec/core_functions/color/to_space/lch/oklab.hrx +++ b/spec/core_functions/color/to_space/lch/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), oklab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), oklab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), oklab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), oklab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), oklab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), oklab)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), oklab)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), oklab)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/oklch.hrx b/spec/core_functions/color/to_space/lch/oklch.hrx index 6f3c432983..b2075e3290 100644 --- a/spec/core_functions/color/to_space/lch/oklch.hrx +++ b/spec/core_functions/color/to_space/lch/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), oklch)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), oklch)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), oklch)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), oklch)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), oklch)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), oklch)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), oklch)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), oklch)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/prophoto_rgb.hrx b/spec/core_functions/color/to_space/lch/prophoto_rgb.hrx index 0d6d455791..b16ee6343d 100644 --- a/spec/core_functions/color/to_space/lch/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/lch/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), prophoto-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), prophoto-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), prophoto-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), prophoto-rgb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), prophoto-rgb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), prophoto-rgb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/rec2020.hrx b/spec/core_functions/color/to_space/lch/rec2020.hrx index e729eaf983..74e0b2d835 100644 --- a/spec/core_functions/color/to_space/lch/rec2020.hrx +++ b/spec/core_functions/color/to_space/lch/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), rec2020)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), rec2020)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), rec2020)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), rec2020)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), rec2020)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), rec2020)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), rec2020)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/rgb.hrx b/spec/core_functions/color/to_space/lch/rgb.hrx index 0ee32433e8..5cc033f02c 100644 --- a/spec/core_functions/color/to_space/lch/rgb.hrx +++ b/spec/core_functions/color/to_space/lch/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), rgb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), rgb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), rgb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/srgb.hrx b/spec/core_functions/color/to_space/lch/srgb.hrx index 383d80e364..c4509407bc 100644 --- a/spec/core_functions/color/to_space/lch/srgb.hrx +++ b/spec/core_functions/color/to_space/lch/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), srgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), srgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), srgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), srgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), srgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), srgb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), srgb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), srgb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/srgb_linear.hrx b/spec/core_functions/color/to_space/lch/srgb_linear.hrx index 85d3385cbf..23c7ac3892 100644 --- a/spec/core_functions/color/to_space/lch/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/lch/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), srgb-linear)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), srgb-linear)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), srgb-linear)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), srgb-linear)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), srgb-linear)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), srgb-linear)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/xyz.hrx b/spec/core_functions/color/to_space/lch/xyz.hrx index 7bcb934888..64730b4993 100644 --- a/spec/core_functions/color/to_space/lch/xyz.hrx +++ b/spec/core_functions/color/to_space/lch/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), xyz)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), xyz)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), xyz)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), xyz)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), xyz)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), xyz)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), xyz)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), xyz)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/lch/xyz_d50.hrx b/spec/core_functions/color/to_space/lch/xyz_d50.hrx index 0aa02fbb4e..43223cc48f 100644 --- a/spec/core_functions/color/to_space/lch/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/lch/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(0% 0 0deg), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(100% 0 0deg), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(50% 0 0deg), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10.123456789% 20.987654321 30.192837465deg), xyz-d50)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(lch(0% 200 0deg), $lightness: -10%), xyz-d50)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 999999 0deg), xyz-d50)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 30deg / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(none 20 30deg), xyz-d50)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% none 30deg), xyz-d50)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(lch(10% 20 none), xyz-d50)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklab/a98_rgb.hrx b/spec/core_functions/color/to_space/oklab/a98_rgb.hrx index b9912f977e..04be5ea8c5 100644 --- a/spec/core_functions/color/to_space/oklab/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/oklab/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), a98-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), a98-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), a98-rgb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), a98-rgb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), a98-rgb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/display_p3.hrx b/spec/core_functions/color/to_space/oklab/display_p3.hrx index 1ed003395e..8a5b5a4f20 100644 --- a/spec/core_functions/color/to_space/oklab/display_p3.hrx +++ b/spec/core_functions/color/to_space/oklab/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), display-p3)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), display-p3)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), display-p3)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/hsl.hrx b/spec/core_functions/color/to_space/oklab/hsl.hrx index 4c79f22e5c..0634815f77 100644 --- a/spec/core_functions/color/to_space/oklab/hsl.hrx +++ b/spec/core_functions/color/to_space/oklab/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), hsl)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), hsl)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), hsl)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/hwb.hrx b/spec/core_functions/color/to_space/oklab/hwb.hrx index 7ece44fb56..67814d17e0 100644 --- a/spec/core_functions/color/to_space/oklab/hwb.hrx +++ b/spec/core_functions/color/to_space/oklab/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), hwb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), hwb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), hwb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), hwb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), hwb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), hwb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), hwb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), hwb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), hwb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), hwb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), hwb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/lab.hrx b/spec/core_functions/color/to_space/oklab/lab.hrx index 1e3ac4c358..8c4ba59ba9 100644 --- a/spec/core_functions/color/to_space/oklab/lab.hrx +++ b/spec/core_functions/color/to_space/oklab/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), lab)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), lab)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), lab)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/lch.hrx b/spec/core_functions/color/to_space/oklab/lch.hrx index 3f9d17ef23..fec8ca90f6 100644 --- a/spec/core_functions/color/to_space/oklab/lch.hrx +++ b/spec/core_functions/color/to_space/oklab/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), lch)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), lch)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), lch)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/oklab.hrx b/spec/core_functions/color/to_space/oklab/oklab.hrx index f569c6330e..a12ef7de1f 100644 --- a/spec/core_functions/color/to_space/oklab/oklab.hrx +++ b/spec/core_functions/color/to_space/oklab/oklab.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), oklab)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), oklab)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), oklab)} <===> missing/lightness/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), oklab)} <===> missing/a/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), oklab)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/oklch.hrx b/spec/core_functions/color/to_space/oklab/oklch.hrx index 668db0577b..6216bcfe86 100644 --- a/spec/core_functions/color/to_space/oklab/oklch.hrx +++ b/spec/core_functions/color/to_space/oklab/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), oklch)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), oklch)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), oklch)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/prophoto_rgb.hrx b/spec/core_functions/color/to_space/oklab/prophoto_rgb.hrx index bcbbeb6d8c..c7ba72553c 100644 --- a/spec/core_functions/color/to_space/oklab/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/oklab/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), prophoto-rgb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), prophoto-rgb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), prophoto-rgb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/rec2020.hrx b/spec/core_functions/color/to_space/oklab/rec2020.hrx index 48593816b4..70e0073a96 100644 --- a/spec/core_functions/color/to_space/oklab/rec2020.hrx +++ b/spec/core_functions/color/to_space/oklab/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), rec2020)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), rec2020)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), rec2020)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/rgb.hrx b/spec/core_functions/color/to_space/oklab/rgb.hrx index 7776479d26..099da0dc6b 100644 --- a/spec/core_functions/color/to_space/oklab/rgb.hrx +++ b/spec/core_functions/color/to_space/oklab/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), rgb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), rgb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), rgb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/srgb.hrx b/spec/core_functions/color/to_space/oklab/srgb.hrx index 4dca47bf10..aa6c480c74 100644 --- a/spec/core_functions/color/to_space/oklab/srgb.hrx +++ b/spec/core_functions/color/to_space/oklab/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), srgb)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), srgb)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), srgb)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/srgb_linear.hrx b/spec/core_functions/color/to_space/oklab/srgb_linear.hrx index 907d122d58..634cdfe901 100644 --- a/spec/core_functions/color/to_space/oklab/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/oklab/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), srgb-linear)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), srgb-linear)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), srgb-linear)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/xyz.hrx b/spec/core_functions/color/to_space/oklab/xyz.hrx index 6599ab53c2..805aa3cb1b 100644 --- a/spec/core_functions/color/to_space/oklab/xyz.hrx +++ b/spec/core_functions/color/to_space/oklab/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), xyz)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), xyz)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), xyz)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklab/xyz_d50.hrx b/spec/core_functions/color/to_space/oklab/xyz_d50.hrx index 378dec988a..b2794ee8b6 100644 --- a/spec/core_functions/color/to_space/oklab/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/oklab/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(0% 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(100% 0 0), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0 0), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% 0.2 -0.3), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklab(0% -2 2), $lightness: -50%), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(50% -999999 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(none 0.2 0.3), xyz-d50)} <===> missing/lightness/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/a/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% none 0.3), xyz-d50)} <===> missing/a/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/b/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklab(10% 0.2 none), xyz-d50)} <===> missing/b/output.css diff --git a/spec/core_functions/color/to_space/oklch/a98_rgb.hrx b/spec/core_functions/color/to_space/oklch/a98_rgb.hrx index 6f3b6445fa..976047713a 100644 --- a/spec/core_functions/color/to_space/oklch/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/oklch/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), a98-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), a98-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), a98-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), a98-rgb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), a98-rgb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), a98-rgb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/display_p3.hrx b/spec/core_functions/color/to_space/oklch/display_p3.hrx index 0d9d28afbd..0753730ca9 100644 --- a/spec/core_functions/color/to_space/oklch/display_p3.hrx +++ b/spec/core_functions/color/to_space/oklch/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), display-p3)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), display-p3)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), display-p3)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), display-p3)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), display-p3)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), display-p3)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), display-p3)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/hsl.hrx b/spec/core_functions/color/to_space/oklch/hsl.hrx index ecbef660a2..bc3ed7eab5 100644 --- a/spec/core_functions/color/to_space/oklch/hsl.hrx +++ b/spec/core_functions/color/to_space/oklch/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), hsl)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), hsl)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), hsl)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), hsl)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), hsl)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), hsl)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), hsl)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), hsl)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/hwb.hrx b/spec/core_functions/color/to_space/oklch/hwb.hrx index 4800a17404..3e6e8696f9 100644 --- a/spec/core_functions/color/to_space/oklch/hwb.hrx +++ b/spec/core_functions/color/to_space/oklch/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), hwb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), hwb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), hwb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), hwb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), hwb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), hwb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), hwb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), hwb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), hwb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), hwb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), hwb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), hwb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/lab.hrx b/spec/core_functions/color/to_space/oklch/lab.hrx index 8dec6f6f88..d648c62379 100644 --- a/spec/core_functions/color/to_space/oklch/lab.hrx +++ b/spec/core_functions/color/to_space/oklch/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), lab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), lab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), lab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), lab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), lab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), lab)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), lab)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), lab)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/lch.hrx b/spec/core_functions/color/to_space/oklch/lch.hrx index 36d448d474..78d3acdff1 100644 --- a/spec/core_functions/color/to_space/oklch/lch.hrx +++ b/spec/core_functions/color/to_space/oklch/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), lch)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), lch)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), lch)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), lch)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), lch)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), lch)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), lch)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), lch)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/oklab.hrx b/spec/core_functions/color/to_space/oklch/oklab.hrx index c1d401254b..095b09a9f4 100644 --- a/spec/core_functions/color/to_space/oklch/oklab.hrx +++ b/spec/core_functions/color/to_space/oklch/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), oklab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), oklab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), oklab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), oklab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), oklab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), oklab)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), oklab)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), oklab)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/oklch.hrx b/spec/core_functions/color/to_space/oklch/oklch.hrx index fb94e309d9..132bdcf60f 100644 --- a/spec/core_functions/color/to_space/oklch/oklch.hrx +++ b/spec/core_functions/color/to_space/oklch/oklch.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), oklch)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), oklch)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), oklch)} <===> missing/lightness/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), oklch)} <===> missing/chroma/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), oklch)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/prophoto_rgb.hrx b/spec/core_functions/color/to_space/oklch/prophoto_rgb.hrx index b95ded68d8..f6aab660c5 100644 --- a/spec/core_functions/color/to_space/oklch/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/oklch/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), prophoto-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), prophoto-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), prophoto-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), prophoto-rgb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), prophoto-rgb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), prophoto-rgb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/rec2020.hrx b/spec/core_functions/color/to_space/oklch/rec2020.hrx index 65d2714c48..f92c69dccd 100644 --- a/spec/core_functions/color/to_space/oklch/rec2020.hrx +++ b/spec/core_functions/color/to_space/oklch/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), rec2020)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), rec2020)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), rec2020)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), rec2020)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), rec2020)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), rec2020)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), rec2020)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/rgb.hrx b/spec/core_functions/color/to_space/oklch/rgb.hrx index 98ec3a4d61..a232869ffc 100644 --- a/spec/core_functions/color/to_space/oklch/rgb.hrx +++ b/spec/core_functions/color/to_space/oklch/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), rgb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), rgb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), rgb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/srgb.hrx b/spec/core_functions/color/to_space/oklch/srgb.hrx index c19e28b857..bce737c7e6 100644 --- a/spec/core_functions/color/to_space/oklch/srgb.hrx +++ b/spec/core_functions/color/to_space/oklch/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), srgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), srgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), srgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), srgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), srgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), srgb)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), srgb)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), srgb)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/srgb_linear.hrx b/spec/core_functions/color/to_space/oklch/srgb_linear.hrx index cd128bb27d..c2e702874e 100644 --- a/spec/core_functions/color/to_space/oklch/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/oklch/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), srgb-linear)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), srgb-linear)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), srgb-linear)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), srgb-linear)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), srgb-linear)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), srgb-linear)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/xyz.hrx b/spec/core_functions/color/to_space/oklch/xyz.hrx index c1be0a4b2b..adc9b79216 100644 --- a/spec/core_functions/color/to_space/oklch/xyz.hrx +++ b/spec/core_functions/color/to_space/oklch/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), xyz)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), xyz)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), xyz)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), xyz)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), xyz)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), xyz)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), xyz)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), xyz)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/oklch/xyz_d50.hrx b/spec/core_functions/color/to_space/oklch/xyz_d50.hrx index b5d2861076..9898d9fb20 100644 --- a/spec/core_functions/color/to_space/oklch/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/oklch/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(0% 0 0deg), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(100% 0 0deg), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(50% 0 0deg), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10.123456789% 0.198765432 30.192837465deg), xyz-d50)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(oklch(0% 1 0deg), $lightness: -10%), xyz-d50)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 999999 0deg), xyz-d50)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 30deg / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/lightness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(none 0.1 30deg), xyz-d50)} <===> missing/lightness/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/chroma/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% none 30deg), xyz-d50)} <===> missing/chroma/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/hue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(oklch(10% 0.1 none), xyz-d50)} <===> missing/hue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/a98_rgb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/a98_rgb.hrx index 83119c13f3..647da9d393 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), a98-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), a98-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), a98-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), a98-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), a98-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/display_p3.hrx b/spec/core_functions/color/to_space/prophoto_rgb/display_p3.hrx index 963621c62c..949122af11 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/display_p3.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), display-p3)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), display-p3)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/hsl.hrx b/spec/core_functions/color/to_space/prophoto_rgb/hsl.hrx index f01e523eec..f0b27df772 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/hsl.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), hsl)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), hsl)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/hwb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/hwb.hrx index 1192159ecc..e357ed31c3 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/hwb.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb 0 0 0), hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb 1 1 1), hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb 0.5 0.5 0.5), hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb 0.2 0.4 0.8), hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb -1 0.4 2), hwb)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb -999999 0 0), hwb)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), hwb)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), hwb)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb none 0.2 0.3), hwb)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(prophoto-rgb 0.1 none 0.3), hwb)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), hwb)} diff --git a/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx b/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx index ca58be4f13..bf8d01a067 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), lab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), lab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx b/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx index 6774528130..856aeb782d 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), lch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), lch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx b/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx index 3f02fa5f24..1922a97af1 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), oklab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), oklab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx b/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx index 11beac981e..7e8e1c47c8 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), oklch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), oklch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/prophoto_rgb.hrx index c4c9c1e346..bbde15641a 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), prophoto-rgb)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), prophoto-rgb)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), prophoto-rgb)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), prophoto-rgb)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/rec2020.hrx b/spec/core_functions/color/to_space/prophoto_rgb/rec2020.hrx index 3a172f985b..42e3711d22 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/rec2020.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), rec2020)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), rec2020)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/rgb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/rgb.hrx index b6788c7173..db24f3a527 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/rgb.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/srgb.hrx b/spec/core_functions/color/to_space/prophoto_rgb/srgb.hrx index c2f0ea5fb7..c3cb7426b9 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/srgb.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), srgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), srgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/srgb_linear.hrx b/spec/core_functions/color/to_space/prophoto_rgb/srgb_linear.hrx index 887db0215b..878aebe645 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), srgb-linear)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), srgb-linear)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/xyz.hrx b/spec/core_functions/color/to_space/prophoto_rgb/xyz.hrx index fb6e0d9664..b96ff9e511 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/xyz.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), xyz)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), xyz)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/prophoto_rgb/xyz_d50.hrx b/spec/core_functions/color/to_space/prophoto_rgb/xyz_d50.hrx index f8ce37c843..dce3fc6673 100644 --- a/spec/core_functions/color/to_space/prophoto_rgb/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/prophoto_rgb/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 1 1 1), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.5 0.5 0.5), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.2 0.4 0.8), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -1 0.4 2), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb -999999 0 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(prophoto-rgb 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/a98_rgb.hrx b/spec/core_functions/color/to_space/rec2020/a98_rgb.hrx index d7743ad10b..454891c7bf 100644 --- a/spec/core_functions/color/to_space/rec2020/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/rec2020/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), a98-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), a98-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), a98-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), a98-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), a98-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/display_p3.hrx b/spec/core_functions/color/to_space/rec2020/display_p3.hrx index 3321e3fec4..eba2196f9e 100644 --- a/spec/core_functions/color/to_space/rec2020/display_p3.hrx +++ b/spec/core_functions/color/to_space/rec2020/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), display-p3)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), display-p3)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/hsl.hrx b/spec/core_functions/color/to_space/rec2020/hsl.hrx index b8b59b7e1b..c20066b0bd 100644 --- a/spec/core_functions/color/to_space/rec2020/hsl.hrx +++ b/spec/core_functions/color/to_space/rec2020/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), hsl)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), hsl)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/hwb.hrx b/spec/core_functions/color/to_space/rec2020/hwb.hrx index 54449401d4..1a5f68efc2 100644 --- a/spec/core_functions/color/to_space/rec2020/hwb.hrx +++ b/spec/core_functions/color/to_space/rec2020/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 0 0 0), hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 1 1 1), hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 0.5 0.5 0.5), hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 0.2 0.4 0.8), hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 -1 0.4 2), hwb)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 -999999 0 0), hwb)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), hwb)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), hwb)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 none 0.2 0.3), hwb)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(rec2020 0.1 none 0.3), hwb)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(color(rec2020 0.1 0.2 none), hwb)} diff --git a/spec/core_functions/color/to_space/rec2020/lab.hrx b/spec/core_functions/color/to_space/rec2020/lab.hrx index 451f2df74e..32f8b89779 100644 --- a/spec/core_functions/color/to_space/rec2020/lab.hrx +++ b/spec/core_functions/color/to_space/rec2020/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), lab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), lab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/lch.hrx b/spec/core_functions/color/to_space/rec2020/lch.hrx index ae9acbd910..44cfac5515 100644 --- a/spec/core_functions/color/to_space/rec2020/lch.hrx +++ b/spec/core_functions/color/to_space/rec2020/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), lch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), lch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/oklab.hrx b/spec/core_functions/color/to_space/rec2020/oklab.hrx index 7c90cb9e3a..1917d1a192 100644 --- a/spec/core_functions/color/to_space/rec2020/oklab.hrx +++ b/spec/core_functions/color/to_space/rec2020/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), oklab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), oklab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/oklch.hrx b/spec/core_functions/color/to_space/rec2020/oklch.hrx index 0eb2f182cd..514f8f6893 100644 --- a/spec/core_functions/color/to_space/rec2020/oklch.hrx +++ b/spec/core_functions/color/to_space/rec2020/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), oklch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), oklch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/prophoto_rgb.hrx b/spec/core_functions/color/to_space/rec2020/prophoto_rgb.hrx index 67c4fe9069..b9116b823b 100644 --- a/spec/core_functions/color/to_space/rec2020/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/rec2020/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), prophoto-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), prophoto-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/rec2020.hrx b/spec/core_functions/color/to_space/rec2020/rec2020.hrx index bf9ceadd1b..a2767e9473 100644 --- a/spec/core_functions/color/to_space/rec2020/rec2020.hrx +++ b/spec/core_functions/color/to_space/rec2020/rec2020.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), rec2020)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), rec2020)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), rec2020)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), rec2020)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/rgb.hrx b/spec/core_functions/color/to_space/rec2020/rgb.hrx index cd87c3b27a..be92a9d204 100644 --- a/spec/core_functions/color/to_space/rec2020/rgb.hrx +++ b/spec/core_functions/color/to_space/rec2020/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/srgb.hrx b/spec/core_functions/color/to_space/rec2020/srgb.hrx index 467aa2fc91..8126230833 100644 --- a/spec/core_functions/color/to_space/rec2020/srgb.hrx +++ b/spec/core_functions/color/to_space/rec2020/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), srgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), srgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/srgb_linear.hrx b/spec/core_functions/color/to_space/rec2020/srgb_linear.hrx index 5b8ede6c36..705d562d37 100644 --- a/spec/core_functions/color/to_space/rec2020/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/rec2020/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), srgb-linear)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), srgb-linear)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/xyz.hrx b/spec/core_functions/color/to_space/rec2020/xyz.hrx index e563e7e8e3..acc6fecaf8 100644 --- a/spec/core_functions/color/to_space/rec2020/xyz.hrx +++ b/spec/core_functions/color/to_space/rec2020/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), xyz)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), xyz)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rec2020/xyz_d50.hrx b/spec/core_functions/color/to_space/rec2020/xyz_d50.hrx index 170adbf50c..45dbca47dd 100644 --- a/spec/core_functions/color/to_space/rec2020/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/rec2020/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 1 1 1), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.5 0.5 0.5), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.2 0.4 0.8), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -1 0.4 2), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 -999999 0 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(rec2020 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/a98_rgb.hrx b/spec/core_functions/color/to_space/rgb/a98_rgb.hrx index feed645db7..765b6c76bc 100644 --- a/spec/core_functions/color/to_space/rgb/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/rgb/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), a98-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), a98-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), a98-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), a98-rgb)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), a98-rgb)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), a98-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/display_p3.hrx b/spec/core_functions/color/to_space/rgb/display_p3.hrx index 3e40aa8dd2..16cb2d93fa 100644 --- a/spec/core_functions/color/to_space/rgb/display_p3.hrx +++ b/spec/core_functions/color/to_space/rgb/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), display-p3)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), display-p3)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), display-p3)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), display-p3)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), display-p3)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/hsl.hrx b/spec/core_functions/color/to_space/rgb/hsl.hrx index 041c0d0010..bc11e12384 100644 --- a/spec/core_functions/color/to_space/rgb/hsl.hrx +++ b/spec/core_functions/color/to_space/rgb/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), hsl)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), hsl)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), hsl)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), hsl)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), hsl)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), hsl)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/hwb.hrx b/spec/core_functions/color/to_space/rgb/hwb.hrx index 4de4725d36..bfa8a73b6e 100644 --- a/spec/core_functions/color/to_space/rgb/hwb.hrx +++ b/spec/core_functions/color/to_space/rgb/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(#000, hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(#fff, hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(#aaa, hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(#28d, hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect( color.to-space(rgb(50.123456789 100.987654321 200.192837465), hwb) @@ -71,7 +71,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), hwb)); @@ -85,7 +85,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color.change(black, $red: -999999), hwb)); @@ -99,7 +99,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(rgb(10 20 30 / 0.4), hwb)); @@ -113,7 +113,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(rgb(10 20 30 / 0.0), hwb)); @@ -127,7 +127,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(rgb(none 20 30), hwb)); @@ -141,7 +141,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(rgb(10 none 30), hwb)); @@ -155,7 +155,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(rgb(10 20 none), hwb)} diff --git a/spec/core_functions/color/to_space/rgb/lab.hrx b/spec/core_functions/color/to_space/rgb/lab.hrx index 52953fe8fb..0180bfcb9d 100644 --- a/spec/core_functions/color/to_space/rgb/lab.hrx +++ b/spec/core_functions/color/to_space/rgb/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), lab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), lab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), lab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), lab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), lab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), lab)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), lab)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/lch.hrx b/spec/core_functions/color/to_space/rgb/lch.hrx index 26ed649553..3fda67cbeb 100644 --- a/spec/core_functions/color/to_space/rgb/lch.hrx +++ b/spec/core_functions/color/to_space/rgb/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), lch)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), lch)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), lch)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), lch)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), lch)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), lch)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), lch)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/oklab.hrx b/spec/core_functions/color/to_space/rgb/oklab.hrx index 543f290f8d..8b3c9b638a 100644 --- a/spec/core_functions/color/to_space/rgb/oklab.hrx +++ b/spec/core_functions/color/to_space/rgb/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), oklab)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), oklab)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), oklab)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), oklab)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), oklab)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), oklab)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/oklch.hrx b/spec/core_functions/color/to_space/rgb/oklch.hrx index cbd0812da7..4708e8d674 100644 --- a/spec/core_functions/color/to_space/rgb/oklch.hrx +++ b/spec/core_functions/color/to_space/rgb/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), oklch)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), oklch)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), oklch)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), oklch)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), oklch)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), oklch)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/rgb/prophoto_rgb.hrx index 6196932c4f..19ba598f09 100644 --- a/spec/core_functions/color/to_space/rgb/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/rgb/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), prophoto-rgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), prophoto-rgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), prophoto-rgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), prophoto-rgb)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), prophoto-rgb)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/rec2020.hrx b/spec/core_functions/color/to_space/rgb/rec2020.hrx index 0728381f7f..90e0b68807 100644 --- a/spec/core_functions/color/to_space/rgb/rec2020.hrx +++ b/spec/core_functions/color/to_space/rgb/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), rec2020)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), rec2020)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), rec2020)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), rec2020)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), rec2020)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/rgb.hrx b/spec/core_functions/color/to_space/rgb/rgb.hrx index 1974692a39..8e3ceaab71 100644 --- a/spec/core_functions/color/to_space/rgb/rgb.hrx +++ b/spec/core_functions/color/to_space/rgb/rgb.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, rgb)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), rgb)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), rgb)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), rgb)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/srgb.hrx b/spec/core_functions/color/to_space/rgb/srgb.hrx index 06dec2742e..c906bbf3da 100644 --- a/spec/core_functions/color/to_space/rgb/srgb.hrx +++ b/spec/core_functions/color/to_space/rgb/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), srgb)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), srgb)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), srgb)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), srgb)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), srgb)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), srgb)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/srgb_linear.hrx b/spec/core_functions/color/to_space/rgb/srgb_linear.hrx index d3864f33a2..cf062b4c7a 100644 --- a/spec/core_functions/color/to_space/rgb/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/rgb/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), srgb-linear)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), srgb-linear)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), srgb-linear)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), srgb-linear)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), srgb-linear)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/xyz.hrx b/spec/core_functions/color/to_space/rgb/xyz.hrx index f40a1dc000..8a1fffc1c1 100644 --- a/spec/core_functions/color/to_space/rgb/xyz.hrx +++ b/spec/core_functions/color/to_space/rgb/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), xyz)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), xyz)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), xyz)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), xyz)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), xyz)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), xyz)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/rgb/xyz_d50.hrx b/spec/core_functions/color/to_space/rgb/xyz_d50.hrx index 65b7028aab..e7d2fe6f74 100644 --- a/spec/core_functions/color/to_space/rgb/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/rgb/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#000, xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#fff, xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#aaa, xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(#28d, xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> float/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(50.123456789 100.987654321 200.192837465), xyz-d50)} <===> float/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(rgb(0, 100, 0), $red: -50, $blue: 400), xyz-d50)} <===> out_of_range/near/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color.change(black, $red: -999999), xyz-d50)} <===> out_of_range/far/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 30 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(none 20 30), xyz-d50)} <===> missing/red/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 none 30), xyz-d50)} <===> missing/green/output.css @@ -120,7 +120,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(rgb(10 20 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/a98_rgb.hrx b/spec/core_functions/color/to_space/srgb/a98_rgb.hrx index 4958138a09..a0ad947a8c 100644 --- a/spec/core_functions/color/to_space/srgb/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/srgb/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), a98-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), a98-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), a98-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), a98-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), a98-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/display_p3.hrx b/spec/core_functions/color/to_space/srgb/display_p3.hrx index ce8e45e67c..0944312c66 100644 --- a/spec/core_functions/color/to_space/srgb/display_p3.hrx +++ b/spec/core_functions/color/to_space/srgb/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), display-p3)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), display-p3)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/hsl.hrx b/spec/core_functions/color/to_space/srgb/hsl.hrx index f9aef4686d..b60a50131e 100644 --- a/spec/core_functions/color/to_space/srgb/hsl.hrx +++ b/spec/core_functions/color/to_space/srgb/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), hsl)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), hsl)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/hwb.hrx b/spec/core_functions/color/to_space/srgb/hwb.hrx index 4d9059a291..162825c902 100644 --- a/spec/core_functions/color/to_space/srgb/hwb.hrx +++ b/spec/core_functions/color/to_space/srgb/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb 0 0 0), hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb 1 1 1), hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb 0.5 0.5 0.5), hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb 0.2 0.4 0.8), hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb -1 0.4 2), hwb)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb -999999 0 0), hwb)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), hwb)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), hwb)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb none 0.2 0.3), hwb)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb 0.1 none 0.3), hwb)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(color(srgb 0.1 0.2 none), hwb)} diff --git a/spec/core_functions/color/to_space/srgb/lab.hrx b/spec/core_functions/color/to_space/srgb/lab.hrx index abbe9f2edf..509e42d796 100644 --- a/spec/core_functions/color/to_space/srgb/lab.hrx +++ b/spec/core_functions/color/to_space/srgb/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), lab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), lab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/lch.hrx b/spec/core_functions/color/to_space/srgb/lch.hrx index fbb66e4d83..df1133f6f7 100644 --- a/spec/core_functions/color/to_space/srgb/lch.hrx +++ b/spec/core_functions/color/to_space/srgb/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), lch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), lch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/oklab.hrx b/spec/core_functions/color/to_space/srgb/oklab.hrx index 3675a809d7..7b01ff1f3a 100644 --- a/spec/core_functions/color/to_space/srgb/oklab.hrx +++ b/spec/core_functions/color/to_space/srgb/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), oklab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), oklab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/oklch.hrx b/spec/core_functions/color/to_space/srgb/oklch.hrx index bd7604e97e..860f973ecb 100644 --- a/spec/core_functions/color/to_space/srgb/oklch.hrx +++ b/spec/core_functions/color/to_space/srgb/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), oklch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), oklch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/prophoto_rgb.hrx b/spec/core_functions/color/to_space/srgb/prophoto_rgb.hrx index c639affac1..54823fa969 100644 --- a/spec/core_functions/color/to_space/srgb/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/srgb/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), prophoto-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), prophoto-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/rec2020.hrx b/spec/core_functions/color/to_space/srgb/rec2020.hrx index b0c43d329a..ffef61377c 100644 --- a/spec/core_functions/color/to_space/srgb/rec2020.hrx +++ b/spec/core_functions/color/to_space/srgb/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), rec2020)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), rec2020)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/rgb.hrx b/spec/core_functions/color/to_space/srgb/rgb.hrx index 959896e9eb..92850bcbc8 100644 --- a/spec/core_functions/color/to_space/srgb/rgb.hrx +++ b/spec/core_functions/color/to_space/srgb/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/srgb.hrx b/spec/core_functions/color/to_space/srgb/srgb.hrx index ef52d15fc6..ebbb15b267 100644 --- a/spec/core_functions/color/to_space/srgb/srgb.hrx +++ b/spec/core_functions/color/to_space/srgb/srgb.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), srgb)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), srgb)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), srgb)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), srgb)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/srgb_linear.hrx b/spec/core_functions/color/to_space/srgb/srgb_linear.hrx index f61fc54e43..7acc58c9bd 100644 --- a/spec/core_functions/color/to_space/srgb/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/srgb/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), srgb-linear)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), srgb-linear)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/xyz.hrx b/spec/core_functions/color/to_space/srgb/xyz.hrx index 334491ba30..663cfe2175 100644 --- a/spec/core_functions/color/to_space/srgb/xyz.hrx +++ b/spec/core_functions/color/to_space/srgb/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), xyz)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), xyz)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb/xyz_d50.hrx b/spec/core_functions/color/to_space/srgb/xyz_d50.hrx index f4e73ba99d..ba6d0d2d6a 100644 --- a/spec/core_functions/color/to_space/srgb/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/srgb/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 1 1 1), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.5 0.5 0.5), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.2 0.4 0.8), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -1 0.4 2), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb -999999 0 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/a98_rgb.hrx b/spec/core_functions/color/to_space/srgb_linear/a98_rgb.hrx index 5ed2f6ac63..418a940e36 100644 --- a/spec/core_functions/color/to_space/srgb_linear/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), a98-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), a98-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), a98-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), a98-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), a98-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/display_p3.hrx b/spec/core_functions/color/to_space/srgb_linear/display_p3.hrx index 215a92268a..ecb7f6fdeb 100644 --- a/spec/core_functions/color/to_space/srgb_linear/display_p3.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), display-p3)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), display-p3)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/hsl.hrx b/spec/core_functions/color/to_space/srgb_linear/hsl.hrx index 8efecba612..3141acf37c 100644 --- a/spec/core_functions/color/to_space/srgb_linear/hsl.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), hsl)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), hsl)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/hwb.hrx b/spec/core_functions/color/to_space/srgb_linear/hwb.hrx index 47d57d4a7b..a384818f4c 100644 --- a/spec/core_functions/color/to_space/srgb_linear/hwb.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear 0 0 0), hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear 1 1 1), hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear 0.5 0.5 0.5), hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear 0.2 0.4 0.8), hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear -1 0.4 2), hwb)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear -999999 0 0), hwb)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), hwb)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), hwb)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear none 0.2 0.3), hwb)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(srgb-linear 0.1 none 0.3), hwb)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), hwb)} diff --git a/spec/core_functions/color/to_space/srgb_linear/lab.hrx b/spec/core_functions/color/to_space/srgb_linear/lab.hrx index 3f900f8720..201237fb6a 100644 --- a/spec/core_functions/color/to_space/srgb_linear/lab.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), lab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), lab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/lch.hrx b/spec/core_functions/color/to_space/srgb_linear/lch.hrx index b4857b6dbc..26f865afee 100644 --- a/spec/core_functions/color/to_space/srgb_linear/lch.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), lch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), lch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/oklab.hrx b/spec/core_functions/color/to_space/srgb_linear/oklab.hrx index c19e272d9c..901af5ef0f 100644 --- a/spec/core_functions/color/to_space/srgb_linear/oklab.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), oklab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), oklab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/oklch.hrx b/spec/core_functions/color/to_space/srgb_linear/oklch.hrx index 084a76c8f8..e638aad55f 100644 --- a/spec/core_functions/color/to_space/srgb_linear/oklch.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), oklch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), oklch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/prophoto_rgb.hrx b/spec/core_functions/color/to_space/srgb_linear/prophoto_rgb.hrx index 083b98d99e..87eb4569f0 100644 --- a/spec/core_functions/color/to_space/srgb_linear/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), prophoto-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), prophoto-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/rec2020.hrx b/spec/core_functions/color/to_space/srgb_linear/rec2020.hrx index a17ad780d6..4f1d97d51e 100644 --- a/spec/core_functions/color/to_space/srgb_linear/rec2020.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), rec2020)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), rec2020)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/rgb.hrx b/spec/core_functions/color/to_space/srgb_linear/rgb.hrx index 29747cbfe4..81f98106e9 100644 --- a/spec/core_functions/color/to_space/srgb_linear/rgb.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/srgb.hrx b/spec/core_functions/color/to_space/srgb_linear/srgb.hrx index ea2c6f611f..aa7bf00340 100644 --- a/spec/core_functions/color/to_space/srgb_linear/srgb.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), srgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), srgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/srgb_linear.hrx b/spec/core_functions/color/to_space/srgb_linear/srgb_linear.hrx index 8a6fb2193a..8623ee99c6 100644 --- a/spec/core_functions/color/to_space/srgb_linear/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), srgb-linear)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), srgb-linear)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), srgb-linear)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), srgb-linear)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/xyz.hrx b/spec/core_functions/color/to_space/srgb_linear/xyz.hrx index 8cd03cec0a..f18163e9bc 100644 --- a/spec/core_functions/color/to_space/srgb_linear/xyz.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), xyz)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), xyz)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/srgb_linear/xyz_d50.hrx b/spec/core_functions/color/to_space/srgb_linear/xyz_d50.hrx index eb983fe952..7472591f50 100644 --- a/spec/core_functions/color/to_space/srgb_linear/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/srgb_linear/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 1 1 1), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.5 0.5 0.5), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.2 0.4 0.8), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -1 0.4 2), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear -999999 0 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(srgb-linear 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/a98_rgb.hrx b/spec/core_functions/color/to_space/xyz/a98_rgb.hrx index 48b5351e35..02e9031c89 100644 --- a/spec/core_functions/color/to_space/xyz/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/xyz/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), a98-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), a98-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), a98-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), a98-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), a98-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), a98-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), a98-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), a98-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), a98-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), a98-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), a98-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/display_p3.hrx b/spec/core_functions/color/to_space/xyz/display_p3.hrx index a3a28e22df..b1383e9adc 100644 --- a/spec/core_functions/color/to_space/xyz/display_p3.hrx +++ b/spec/core_functions/color/to_space/xyz/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), display-p3)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), display-p3)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/hsl.hrx b/spec/core_functions/color/to_space/xyz/hsl.hrx index 6e157ce424..03e8d0caaa 100644 --- a/spec/core_functions/color/to_space/xyz/hsl.hrx +++ b/spec/core_functions/color/to_space/xyz/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), hsl)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), hsl)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/hwb.hrx b/spec/core_functions/color/to_space/xyz/hwb.hrx index cafb0e07e9..c7c66e8f26 100644 --- a/spec/core_functions/color/to_space/xyz/hwb.hrx +++ b/spec/core_functions/color/to_space/xyz/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz 0 0 0), hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz 1 1 1), hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz 0.5 0.5 0.5), hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz 0.2 0.4 0.8), hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz -1 0.4 2), hwb)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz -999999 0 0), hwb)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), hwb)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), hwb)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz none 0.2 0.3), hwb)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz 0.1 none 0.3), hwb)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(color(xyz 0.1 0.2 none), hwb)} diff --git a/spec/core_functions/color/to_space/xyz/lab.hrx b/spec/core_functions/color/to_space/xyz/lab.hrx index 5dd1feccb4..f5d3c2eac5 100644 --- a/spec/core_functions/color/to_space/xyz/lab.hrx +++ b/spec/core_functions/color/to_space/xyz/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), lab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), lab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/lch.hrx b/spec/core_functions/color/to_space/xyz/lch.hrx index 20d1d42226..045fdeb008 100644 --- a/spec/core_functions/color/to_space/xyz/lch.hrx +++ b/spec/core_functions/color/to_space/xyz/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), lch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), lch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/oklab.hrx b/spec/core_functions/color/to_space/xyz/oklab.hrx index 2f66320d65..df59baac2a 100644 --- a/spec/core_functions/color/to_space/xyz/oklab.hrx +++ b/spec/core_functions/color/to_space/xyz/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), oklab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), oklab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/oklch.hrx b/spec/core_functions/color/to_space/xyz/oklch.hrx index 6d4ccd6c01..ffaa9d2570 100644 --- a/spec/core_functions/color/to_space/xyz/oklch.hrx +++ b/spec/core_functions/color/to_space/xyz/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), oklch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), oklch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/prophoto_rgb.hrx b/spec/core_functions/color/to_space/xyz/prophoto_rgb.hrx index 38e01822aa..a9ddb19964 100644 --- a/spec/core_functions/color/to_space/xyz/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/xyz/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), prophoto-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), prophoto-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/rec2020.hrx b/spec/core_functions/color/to_space/xyz/rec2020.hrx index 107b49888c..e5bf205acf 100644 --- a/spec/core_functions/color/to_space/xyz/rec2020.hrx +++ b/spec/core_functions/color/to_space/xyz/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), rec2020)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), rec2020)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/rgb.hrx b/spec/core_functions/color/to_space/xyz/rgb.hrx index 988e65f5df..42e00afb20 100644 --- a/spec/core_functions/color/to_space/xyz/rgb.hrx +++ b/spec/core_functions/color/to_space/xyz/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/srgb.hrx b/spec/core_functions/color/to_space/xyz/srgb.hrx index 1e4417ffcd..fd66c826de 100644 --- a/spec/core_functions/color/to_space/xyz/srgb.hrx +++ b/spec/core_functions/color/to_space/xyz/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), srgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), srgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/srgb_linear.hrx b/spec/core_functions/color/to_space/xyz/srgb_linear.hrx index aaf930abbb..db67b30a28 100644 --- a/spec/core_functions/color/to_space/xyz/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/xyz/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), srgb-linear)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), srgb-linear)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/xyz.hrx b/spec/core_functions/color/to_space/xyz/xyz.hrx index 1d30db6fc8..6a7a854801 100644 --- a/spec/core_functions/color/to_space/xyz/xyz.hrx +++ b/spec/core_functions/color/to_space/xyz/xyz.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), xyz)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), xyz)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), xyz)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), xyz)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz/xyz_d50.hrx b/spec/core_functions/color/to_space/xyz/xyz_d50.hrx index 98296f8c74..546f8d7e32 100644 --- a/spec/core_functions/color/to_space/xyz/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/xyz/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 1 1 1), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.5 0.5 0.5), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.2 0.4 0.8), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -1 0.4 2), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz -999999 0 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/a98_rgb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/a98_rgb.hrx index 1c954710a9..1d17f2ff98 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/a98_rgb.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/a98_rgb.hrx @@ -1,5 +1,5 @@ <===> in_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), xyz-d50)} <===> in_range/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> out_of_range/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), xyz-d50)} <===> out_of_range/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/display_p3.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/display_p3.hrx index 85e1130a04..d8e16a972c 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/display_p3.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/display_p3.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), display-p3)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), display-p3)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), display-p3)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), display-p3)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), display-p3)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), display-p3)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), display-p3)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), display-p3)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), display-p3)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), display-p3)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), display-p3)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hsl.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hsl.hrx index 2d8aa960e2..765a1743e2 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hsl.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hsl.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), hsl)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), hsl)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), hsl)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), hsl)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), hsl)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), hsl)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), hsl)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), hsl)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), hsl)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), hsl)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), hsl)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hwb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hwb.hrx index cb868440a7..bc1c5198a9 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hwb.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/hwb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 0 0 0), hwb)); @@ -13,7 +13,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 1 1 1), hwb)); @@ -27,7 +27,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 0.5 0.5 0.5), hwb)); @@ -41,7 +41,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 0.2 0.4 0.8), hwb)); @@ -55,7 +55,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 -1 0.4 2), hwb)); @@ -69,7 +69,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 -999999 0 0), hwb)); @@ -83,7 +83,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), hwb)); @@ -97,7 +97,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), hwb)); @@ -111,7 +111,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 none 0.2 0.3), hwb)); @@ -125,7 +125,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; @include utils.inspect(color.to-space(color(xyz-d50 0.1 none 0.3), hwb)); @@ -139,7 +139,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; @use 'core_functions/color/utils'; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), hwb)} diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx index cfa7e92d6a..a1fa3265e5 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), lab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), lab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), lab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), lab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), lab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), lab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), lab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), lab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), lab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), lab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), lab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx index cd22e4b42b..77da948878 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/lch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), lch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), lch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), lch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), lch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), lch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), lch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), lch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), lch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), lch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), lch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), lch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx index a0efdb422f..3faba56ba4 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklab.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), oklab)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), oklab)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), oklab)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), oklab)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), oklab)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), oklab)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), oklab)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), oklab)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), oklab)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), oklab)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), oklab)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx index 1dfe85982a..23bf2d569f 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/oklch.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), oklch)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), oklch)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), oklch)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), oklch)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), oklch)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), oklch)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), oklch)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), oklch)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), oklch)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), oklch)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), oklch)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx index 203310878d..f8b526bba7 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/prophoto_rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), prophoto-rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), prophoto-rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), prophoto-rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), prophoto-rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), prophoto-rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), prophoto-rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), prophoto-rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), prophoto-rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), prophoto-rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), prophoto-rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), prophoto-rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rec2020.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rec2020.hrx index 7e157d8144..ba37d1791d 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rec2020.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rec2020.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), rec2020)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), rec2020)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), rec2020)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), rec2020)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), rec2020)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), rec2020)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), rec2020)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), rec2020)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), rec2020)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), rec2020)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), rec2020)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rgb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rgb.hrx index 8055dff9d4..7891d1ae7d 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rgb.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/rgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), rgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), rgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), rgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), rgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), rgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), rgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), rgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), rgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), rgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), rgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), rgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb.hrx index 26daa49590..65f2132f29 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), srgb)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), srgb)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), srgb)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), srgb)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), srgb)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), srgb)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), srgb)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), srgb)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), srgb)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), srgb)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), srgb)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb_linear.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb_linear.hrx index 5531c32e23..2a9fac3211 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb_linear.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/srgb_linear.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), srgb-linear)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), srgb-linear)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), srgb-linear)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), srgb-linear)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), srgb-linear)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), srgb-linear)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), srgb-linear)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), srgb-linear)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), srgb-linear)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), srgb-linear)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), srgb-linear)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz.hrx index 25d2d2b887..45628af2d4 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), xyz)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), xyz)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), xyz)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), xyz)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), xyz)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), xyz)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), xyz)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), xyz)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), xyz)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), xyz)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), xyz)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz_d50.hrx b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz_d50.hrx index e6e632b18d..c29ed37099 100644 --- a/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz_d50.hrx +++ b/spec/core_functions/color/to_space/xyz_d50/xyz-d50/xyz_d50.hrx @@ -1,5 +1,5 @@ <===> black/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0 0 0), xyz-d50)} <===> black/output.css @@ -10,7 +10,7 @@ a { <===> ================================================================================ <===> white/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 1 1 1), xyz-d50)} <===> white/output.css @@ -21,7 +21,7 @@ a { <===> ================================================================================ <===> gray/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.5 0.5 0.5), xyz-d50)} <===> gray/output.css @@ -32,7 +32,7 @@ a { <===> ================================================================================ <===> middle/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.2 0.4 0.8), xyz-d50)} <===> middle/output.css @@ -43,7 +43,7 @@ a { <===> ================================================================================ <===> out_of_range/near/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -1 0.4 2), xyz-d50)} <===> out_of_range/near/output.css @@ -54,7 +54,7 @@ a { <===> ================================================================================ <===> out_of_range/far/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 -999999 0 0), xyz-d50)} <===> out_of_range/far/output.css @@ -65,7 +65,7 @@ a { <===> ================================================================================ <===> alpha/partial/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.4), xyz-d50)} <===> alpha/partial/output.css @@ -76,7 +76,7 @@ a { <===> ================================================================================ <===> alpha/transparent/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 0.3 / 0.0), xyz-d50)} <===> alpha/transparent/output.css @@ -87,7 +87,7 @@ a { <===> ================================================================================ <===> missing/red/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 none 0.2 0.3), xyz-d50)} <===> missing/red/output.css @@ -98,7 +98,7 @@ a { <===> ================================================================================ <===> missing/green/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 none 0.3), xyz-d50)} <===> missing/green/output.css @@ -109,7 +109,7 @@ a { <===> ================================================================================ <===> missing/blue/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.to-space(color(xyz-d50 0.1 0.2 none), xyz-d50)} <===> missing/blue/output.css diff --git a/spec/core_functions/color/whiteness.hrx b/spec/core_functions/color/whiteness.hrx index 53788ed4a5..63bfe24a21 100644 --- a/spec/core_functions/color/whiteness.hrx +++ b/spec/core_functions/color/whiteness.hrx @@ -1,5 +1,5 @@ <===> max/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(white)} <===> max/output.css @@ -23,7 +23,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> min/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(black)} <===> min/output.css @@ -47,7 +47,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> middle/zero_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(color.hwb(0, 50%, 0%))} <===> middle/zero_blackness/output.css @@ -71,7 +71,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> middle/half_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(color.hwb(0, 50%, 50%))} <===> middle/half_blackness/output.css @@ -95,7 +95,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> middle/high_blackness/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(color.hwb(0, 70%, 70%))} <===> middle/high_blackness/output.css @@ -119,7 +119,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> fraction/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(color.hwb(0, 0.5%, 0%))} <===> fraction/output.css @@ -143,7 +143,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> named/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness($color: color.hwb(0, 42%, 0%))} <===> named/output.css @@ -167,7 +167,7 @@ More info: https://sass-lang.com/d/color-functions <===> ================================================================================ <===> error/too_few_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness()} <===> error/too_few_args/error @@ -185,7 +185,7 @@ Error: Missing argument $color. <===> ================================================================================ <===> error/too_many_args/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(red, green)} <===> error/too_many_args/error @@ -203,7 +203,7 @@ Error: Only 1 argument allowed, but 2 were passed. <===> ================================================================================ <===> error/type/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(1)} <===> error/type/error @@ -217,7 +217,7 @@ Error: $color: 1 is not a color. <===> ================================================================================ <===> error/non_legacy/input.scss -@use 'sass:color'; +@use "sass:color"; a {b: color.whiteness(color(srgb 1 1 1))} <===> error/non_legacy/error From 37565926bab9fefce20d4f5baad963b251c97ad4 Mon Sep 17 00:00:00 2001 From: Natalie Weizenbaum Date: Mon, 12 Aug 2024 15:11:51 -0700 Subject: [PATCH 45/45] Fix static checks --- spec/core_functions/color/grayscale.hrx | 10 - spec/core_functions/global/color.hrx | 578 ------------------ spec/core_functions/global/color/alpha.hrx | 7 + spec/core_functions/global/color/blue.hrx | 20 + spec/core_functions/global/color/change.hrx | 7 + .../global/color/complement.hrx | 7 + spec/core_functions/global/color/darken.hrx | 21 + .../global/color/desaturate.hrx | 21 + spec/core_functions/global/color/error.hrx | 75 +++ spec/core_functions/global/color/fade-in.hrx | 21 + spec/core_functions/global/color/fade-out.hrx | 21 + .../core_functions/global/color/grayscale.hrx | 49 ++ spec/core_functions/global/color/green.hrx | 20 + spec/core_functions/global/color/hue.hrx | 20 + .../global/color/ie_hex_str.hrx | 7 + spec/core_functions/global/color/invert.hrx | 48 ++ spec/core_functions/global/color/lighten.hrx | 21 + .../core_functions/global/color/lightness.hrx | 20 + spec/core_functions/global/color/mix.hrx | 7 + spec/core_functions/global/color/opacify.hrx | 21 + spec/core_functions/global/color/opacity.hrx | 7 + spec/core_functions/global/color/red.hrx | 20 + spec/core_functions/global/color/saturate.hrx | 21 + .../global/color/saturation.hrx | 20 + spec/core_functions/global/color/scale.hrx | 7 + .../global/color/transparentize.hrx | 21 + 26 files changed, 509 insertions(+), 588 deletions(-) delete mode 100644 spec/core_functions/global/color.hrx create mode 100644 spec/core_functions/global/color/alpha.hrx create mode 100644 spec/core_functions/global/color/blue.hrx create mode 100644 spec/core_functions/global/color/change.hrx create mode 100644 spec/core_functions/global/color/complement.hrx create mode 100644 spec/core_functions/global/color/darken.hrx create mode 100644 spec/core_functions/global/color/desaturate.hrx create mode 100644 spec/core_functions/global/color/error.hrx create mode 100644 spec/core_functions/global/color/fade-in.hrx create mode 100644 spec/core_functions/global/color/fade-out.hrx create mode 100644 spec/core_functions/global/color/grayscale.hrx create mode 100644 spec/core_functions/global/color/green.hrx create mode 100644 spec/core_functions/global/color/hue.hrx create mode 100644 spec/core_functions/global/color/ie_hex_str.hrx create mode 100644 spec/core_functions/global/color/invert.hrx create mode 100644 spec/core_functions/global/color/lighten.hrx create mode 100644 spec/core_functions/global/color/lightness.hrx create mode 100644 spec/core_functions/global/color/mix.hrx create mode 100644 spec/core_functions/global/color/opacify.hrx create mode 100644 spec/core_functions/global/color/opacity.hrx create mode 100644 spec/core_functions/global/color/red.hrx create mode 100644 spec/core_functions/global/color/saturate.hrx create mode 100644 spec/core_functions/global/color/saturation.hrx create mode 100644 spec/core_functions/global/color/scale.hrx create mode 100644 spec/core_functions/global/color/transparentize.hrx diff --git a/spec/core_functions/color/grayscale.hrx b/spec/core_functions/color/grayscale.hrx index 2eec69db16..68ce5c3466 100644 --- a/spec/core_functions/color/grayscale.hrx +++ b/spec/core_functions/color/grayscale.hrx @@ -287,13 +287,3 @@ Error: $color: var(--c) is not a color. | ^^^^^^^^^^^^^^^^^^^^^^^^^ ' input.scss 2:7 root stylesheet - -<===> -================================================================================ -<===> error/css_variable/error -Error: $color: var(--c) is not a color. - , -2 | a {b: color.grayscale(var(--c))} - | ^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 2:7 root stylesheet diff --git a/spec/core_functions/global/color.hrx b/spec/core_functions/global/color.hrx deleted file mode 100644 index ec0d3d55eb..0000000000 --- a/spec/core_functions/global/color.hrx +++ /dev/null @@ -1,578 +0,0 @@ -<===> red/input.scss -a {b: red(#abcdef)} - -<===> red/output.css -a { - b: 171; -} - -<===> red/warning -DEPRECATION WARNING: red() is deprecated. Suggestion: - -color.channel($color, red) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: red(#abcdef)} - | ^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> green/input.scss -a {b: green(#abcdef)} - -<===> green/output.css -a { - b: 205; -} - -<===> green/warning -DEPRECATION WARNING: green() is deprecated. Suggestion: - -color.channel($color, green) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: green(#abcdef)} - | ^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> blue/input.scss -a {b: blue(#abcdef)} - -<===> blue/output.css -a { - b: 239; -} - -<===> blue/warning -DEPRECATION WARNING: blue() is deprecated. Suggestion: - -color.channel($color, blue) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: blue(#abcdef)} - | ^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> hue/input.scss -a {b: hue(#abcdef)} - -<===> hue/output.css -a { - b: 210deg; -} - -<===> hue/warning -DEPRECATION WARNING: hue() is deprecated. Suggestion: - -color.channel($color, hue) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: hue(#abcdef)} - | ^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturation/input.scss -a {b: saturation(#abcdef)} - -<===> saturation/output.css -a { - b: 68%; -} - -<===> saturation/warning -DEPRECATION WARNING: saturation() is deprecated. Suggestion: - -color.channel($color, saturation) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: saturation(#abcdef)} - | ^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lightness/input.scss -a {b: lightness(#abcdef)} - -<===> lightness/output.css -a { - b: 80.3921568627%; -} - -<===> lightness/warning -DEPRECATION WARNING: lightness() is deprecated. Suggestion: - -color.channel($color, lightness) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: lightness(#abcdef)} - | ^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> mix/input.scss -a {b: mix(#abcdef, #daddee)} - -<===> mix/output.css -a { - b: rgb(194.5, 213, 238.5); -} - -<===> -================================================================================ -<===> complement/input.scss -a {b: complement(#abcdef)} - -<===> complement/output.css -a { - b: #efcdab; -} - -<===> -================================================================================ -<===> darken/input.scss -a {b: darken(#abcdef, 10%)} - -<===> darken/output.css -a { - b: rgb(128.16, 179.5, 230.84); -} - -<===> darken/warning -DEPRECATION WARNING: darken() is deprecated. Suggestions: - -color.scale($color, $lightness: -12.4390243902%) -color.adjust($color, $lightness: -10%) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: darken(#abcdef, 10%)} - | ^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> desaturate/input.scss -a {b: desaturate(#abcdef, 10%)} - -<===> desaturate/output.css -a { - b: #b0cdea; -} - -<===> desaturate/warning -DEPRECATION WARNING: desaturate() is deprecated. Suggestions: - -color.scale($color, $saturation: -14.7058823529%) -color.adjust($color, $saturation: -10%) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: desaturate(#abcdef, 10%)} - | ^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> fade-in/input.scss -a {b: fade-in(rgba(red, 0.5), 0.3)} - -<===> fade-in/output.css -a { - b: rgba(255, 0, 0, 0.8); -} - -<===> fade-in/warning -DEPRECATION WARNING: fade-in() is deprecated. Suggestions: - -color.scale($color, $alpha: 60%) -color.adjust($color, $alpha: 0.3) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: fade-in(rgba(red, 0.5), 0.3)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> opacify/input.scss -a {b: opacify(rgba(red, 0.5), 0.3)} - -<===> opacify/output.css -a { - b: rgba(255, 0, 0, 0.8); -} - -<===> opacify/warning -DEPRECATION WARNING: opacify() is deprecated. Suggestions: - -color.scale($color, $alpha: 60%) -color.adjust($color, $alpha: 0.3) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: opacify(rgba(red, 0.5), 0.3)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> fade-out/input.scss -a {b: fade-out(rgba(red, 0.5), 0.3)} - -<===> fade-out/output.css -a { - b: rgba(255, 0, 0, 0.2); -} - -<===> fade-out/warning -DEPRECATION WARNING: fade-out() is deprecated. Suggestions: - -color.scale($color, $alpha: -60%) -color.adjust($color, $alpha: -0.3) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: fade-out(rgba(red, 0.5), 0.3)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> transparentize/input.scss -a {b: transparentize(rgba(red, 0.5), 0.3)} - -<===> transparentize/output.css -a { - b: rgba(255, 0, 0, 0.2); -} - -<===> transparentize/warning -DEPRECATION WARNING: transparentize() is deprecated. Suggestions: - -color.scale($color, $alpha: -60%) -color.adjust($color, $alpha: -0.3) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: transparentize(rgba(red, 0.5), 0.3)} - | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> lighten/input.scss -a {b: lighten(#abcdef, 10%)} - -<===> lighten/output.css -a { - b: rgb(213.84, 230.5, 247.16); -} - -<===> lighten/warning -DEPRECATION WARNING: lighten() is deprecated. Suggestions: - -color.scale($color, $lightness: 51%) -color.adjust($color, $lightness: 10%) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: lighten(#abcdef, 10%)} - | ^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> saturate/input.scss -a {b: saturate(#abcdef, 10%)} - -<===> saturate/output.css -a { - b: #a6cdf4; -} - -<===> saturate/warning -DEPRECATION WARNING: saturate() is deprecated. Suggestions: - -color.scale($color, $saturation: 31.25%) -color.adjust($color, $saturation: 10%) - -More info: https://sass-lang.com/d/color-functions - - , -1 | a {b: saturate(#abcdef, 10%)} - | ^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> alpha/input.scss -a {b: alpha(#abcdef)} - -<===> alpha/output.css -a { - b: 1; -} - -<===> -================================================================================ -<===> opacity/input.scss -a {b: opacity(#abcdef)} - -<===> opacity/output.css -a { - b: 1; -} - -<===> -================================================================================ -<===> scale/input.scss -a {b: scale-color(#abcdef, $red: 10%)} - -<===> scale/output.css -a { - b: rgb(179.4, 205, 239); -} - -<===> -================================================================================ -<===> change/input.scss -a {b: change-color(#abcdef, $red: 10)} - -<===> change/output.css -a { - b: #0acdef; -} - -<===> -================================================================================ -<===> ie_hex_str/input.scss -a {b: ie-hex-str(#abcdef)} - -<===> ie_hex_str/output.css -a { - b: #FFABCDEF; -} - -<===> -================================================================================ -<===> grayscale/with_color/input.scss -a {b: grayscale(red)} - -<===> grayscale/with_color/output.css -a { - b: rgb(127.5, 127.5, 127.5); -} - -<===> -================================================================================ -<===> grayscale/with_number/input.scss -// A number should produce a plain function string, for CSS filter functions. -a {b: grayscale(15%)} - -<===> grayscale/with_number/output.css -a { - b: grayscale(15%); -} - -<===> -================================================================================ -<===> grayscale/with_css_var/input.scss -a {b: grayscale(var(--c))} - -<===> grayscale/with_css_var/output.css -a { - b: grayscale(var(--c)); -} - -<===> -================================================================================ -<===> grayscale/with_calc/input.scss -a {b: grayscale(calc(1 + 2))} - -<===> grayscale/with_calc/output.css -a { - b: grayscale(3); -} - -<===> -================================================================================ -<===> grayscale/with_unquoted_calc/input.scss -@use "sass:string"; -a {b: grayscale(string.unquote('calc(1)'))} - -<===> grayscale/with_unquoted_calc/output.css -a { - b: grayscale(calc(1)); -} - -<===> -================================================================================ -<===> invert/with_color/input.scss -a {b: invert(#abcdef)} - -<===> invert/with_color/output.css -a { - b: #543210; -} - -<===> -================================================================================ -<===> invert/with_number/input.scss -a {b: invert(10%)} - -<===> invert/with_number/output.css -a { - b: invert(10%); -} - -<===> -================================================================================ -<===> invert/with_css_var/input.scss -a {b: invert(var(--c))} - -<===> invert/with_css_var/output.css -a { - b: invert(var(--c)); -} - -<===> -================================================================================ -<===> invert/with_calc/input.scss -a {b: invert(calc(1 + 2))} - -<===> invert/with_calc/output.css -a { - b: invert(3); -} - -<===> -================================================================================ -<===> invert/with_unquoted_calc/input.scss -@use "sass:string"; -a {b: invert(string.unquote('calc(1)'))} - -<===> invert/with_unquoted_calc/output.css -a { - b: invert(calc(1)); -} - -<===> -================================================================================ -<===> error/too_low/lighten/input.scss -a {b: lighten(red, -0.001)} - -<===> error/too_low/lighten/error -Error: $amount: Expected -0.001 to be within 0 and 100. - , -1 | a {b: lighten(red, -0.001)} - | ^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/too_low/darken/input.scss -a {b: darken(red, -0.001)} - -<===> error/too_low/darken/error -Error: $amount: Expected -0.001 to be within 0 and 100. - , -1 | a {b: darken(red, -0.001)} - | ^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/too_low/saturate/input.scss -a {b: saturate(red, -0.001)} - -<===> error/too_low/saturate/error -Error: $amount: Expected -0.001 to be within 0 and 100. - , -1 | a {b: saturate(red, -0.001)} - | ^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/too_low/desaturate/input.scss -a {b: desaturate(red, -0.001)} - -<===> error/too_low/desaturate/error -Error: $amount: Expected -0.001 to be within 0 and 100. - , -1 | a {b: desaturate(red, -0.001)} - | ^^^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/too_low/fade_in/input.scss -a {b: fade-in(red, -0.001)} - -<===> error/too_low/fade_in/error -Error: $amount: Expected -0.001 to be within 0 and 1. - , -1 | a {b: fade-in(red, -0.001)} - | ^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet - -<===> -================================================================================ -<===> error/too_low/fade_out/input.scss -a {b: fade-out(red, -0.001)} - -<===> error/too_low/fade_out/error -Error: $amount: Expected -0.001 to be within 0 and 1. - , -1 | a {b: fade-out(red, -0.001)} - | ^^^^^^^^^^^^^^^^^^^^^ - ' - input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/alpha.hrx b/spec/core_functions/global/color/alpha.hrx new file mode 100644 index 0000000000..ab487af7de --- /dev/null +++ b/spec/core_functions/global/color/alpha.hrx @@ -0,0 +1,7 @@ +<===> input.scss +a {b: alpha(#abcdef)} + +<===> output.css +a { + b: 1; +} diff --git a/spec/core_functions/global/color/blue.hrx b/spec/core_functions/global/color/blue.hrx new file mode 100644 index 0000000000..8f3126d10a --- /dev/null +++ b/spec/core_functions/global/color/blue.hrx @@ -0,0 +1,20 @@ +<===> input.scss +a {b: blue(#abcdef)} + +<===> output.css +a { + b: 239; +} + +<===> warning +DEPRECATION WARNING: blue() is deprecated. Suggestion: + +color.channel($color, blue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: blue(#abcdef)} + | ^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/change.hrx b/spec/core_functions/global/color/change.hrx new file mode 100644 index 0000000000..422e24da4b --- /dev/null +++ b/spec/core_functions/global/color/change.hrx @@ -0,0 +1,7 @@ +<===> input.scss +a {b: change-color(#abcdef, $red: 10)} + +<===> output.css +a { + b: #0acdef; +} diff --git a/spec/core_functions/global/color/complement.hrx b/spec/core_functions/global/color/complement.hrx new file mode 100644 index 0000000000..a92e5ecad8 --- /dev/null +++ b/spec/core_functions/global/color/complement.hrx @@ -0,0 +1,7 @@ +<===> input.scss +a {b: complement(#abcdef)} + +<===> output.css +a { + b: #efcdab; +} diff --git a/spec/core_functions/global/color/darken.hrx b/spec/core_functions/global/color/darken.hrx new file mode 100644 index 0000000000..c43a100a20 --- /dev/null +++ b/spec/core_functions/global/color/darken.hrx @@ -0,0 +1,21 @@ +<===> input.scss +a {b: darken(#abcdef, 10%)} + +<===> output.css +a { + b: rgb(128.16, 179.5, 230.84); +} + +<===> warning +DEPRECATION WARNING: darken() is deprecated. Suggestions: + +color.scale($color, $lightness: -12.4390243902%) +color.adjust($color, $lightness: -10%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: darken(#abcdef, 10%)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/desaturate.hrx b/spec/core_functions/global/color/desaturate.hrx new file mode 100644 index 0000000000..d7a75ae670 --- /dev/null +++ b/spec/core_functions/global/color/desaturate.hrx @@ -0,0 +1,21 @@ +<===> input.scss +a {b: desaturate(#abcdef, 10%)} + +<===> output.css +a { + b: #b0cdea; +} + +<===> warning +DEPRECATION WARNING: desaturate() is deprecated. Suggestions: + +color.scale($color, $saturation: -14.7058823529%) +color.adjust($color, $saturation: -10%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: desaturate(#abcdef, 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/error.hrx b/spec/core_functions/global/color/error.hrx new file mode 100644 index 0000000000..4a702d0de9 --- /dev/null +++ b/spec/core_functions/global/color/error.hrx @@ -0,0 +1,75 @@ +<===> too_low/lighten/input.scss +a {b: lighten(red, -0.001)} + +<===> too_low/lighten/error +Error: $amount: Expected -0.001 to be within 0 and 100. + , +1 | a {b: lighten(red, -0.001)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_low/darken/input.scss +a {b: darken(red, -0.001)} + +<===> too_low/darken/error +Error: $amount: Expected -0.001 to be within 0 and 100. + , +1 | a {b: darken(red, -0.001)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_low/saturate/input.scss +a {b: saturate(red, -0.001)} + +<===> too_low/saturate/error +Error: $amount: Expected -0.001 to be within 0 and 100. + , +1 | a {b: saturate(red, -0.001)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_low/desaturate/input.scss +a {b: desaturate(red, -0.001)} + +<===> too_low/desaturate/error +Error: $amount: Expected -0.001 to be within 0 and 100. + , +1 | a {b: desaturate(red, -0.001)} + | ^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_low/fade_in/input.scss +a {b: fade-in(red, -0.001)} + +<===> too_low/fade_in/error +Error: $amount: Expected -0.001 to be within 0 and 1. + , +1 | a {b: fade-in(red, -0.001)} + | ^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet + +<===> +================================================================================ +<===> too_low/fade_out/input.scss +a {b: fade-out(red, -0.001)} + +<===> too_low/fade_out/error +Error: $amount: Expected -0.001 to be within 0 and 1. + , +1 | a {b: fade-out(red, -0.001)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/fade-in.hrx b/spec/core_functions/global/color/fade-in.hrx new file mode 100644 index 0000000000..0bd3f2317e --- /dev/null +++ b/spec/core_functions/global/color/fade-in.hrx @@ -0,0 +1,21 @@ +<===> input.scss +a {b: fade-in(rgba(red, 0.5), 0.3)} + +<===> output.css +a { + b: rgba(255, 0, 0, 0.8); +} + +<===> warning +DEPRECATION WARNING: fade-in() is deprecated. Suggestions: + +color.scale($color, $alpha: 60%) +color.adjust($color, $alpha: 0.3) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-in(rgba(red, 0.5), 0.3)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/fade-out.hrx b/spec/core_functions/global/color/fade-out.hrx new file mode 100644 index 0000000000..b11d2f0942 --- /dev/null +++ b/spec/core_functions/global/color/fade-out.hrx @@ -0,0 +1,21 @@ +<===> input.scss +a {b: fade-out(rgba(red, 0.5), 0.3)} + +<===> output.css +a { + b: rgba(255, 0, 0, 0.2); +} + +<===> warning +DEPRECATION WARNING: fade-out() is deprecated. Suggestions: + +color.scale($color, $alpha: -60%) +color.adjust($color, $alpha: -0.3) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: fade-out(rgba(red, 0.5), 0.3)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/grayscale.hrx b/spec/core_functions/global/color/grayscale.hrx new file mode 100644 index 0000000000..d340eb2c4b --- /dev/null +++ b/spec/core_functions/global/color/grayscale.hrx @@ -0,0 +1,49 @@ +<===> with_color/input.scss +a {b: grayscale(red)} + +<===> with_color/output.css +a { + b: rgb(127.5, 127.5, 127.5); +} + +<===> +================================================================================ +<===> with_number/input.scss +// A number should produce a plain function string, for CSS filter functions. +a {b: grayscale(15%)} + +<===> with_number/output.css +a { + b: grayscale(15%); +} + +<===> +================================================================================ +<===> with_css_var/input.scss +a {b: grayscale(var(--c))} + +<===> with_css_var/output.css +a { + b: grayscale(var(--c)); +} + +<===> +================================================================================ +<===> with_calc/input.scss +a {b: grayscale(calc(1 + 2))} + +<===> with_calc/output.css +a { + b: grayscale(3); +} + +<===> +================================================================================ +<===> with_unquoted_calc/input.scss +@use "sass:string"; +a {b: grayscale(string.unquote('calc(1)'))} + +<===> with_unquoted_calc/output.css +a { + b: grayscale(calc(1)); +} diff --git a/spec/core_functions/global/color/green.hrx b/spec/core_functions/global/color/green.hrx new file mode 100644 index 0000000000..1c7847ec95 --- /dev/null +++ b/spec/core_functions/global/color/green.hrx @@ -0,0 +1,20 @@ +<===> input.scss +a {b: green(#abcdef)} + +<===> output.css +a { + b: 205; +} + +<===> warning +DEPRECATION WARNING: green() is deprecated. Suggestion: + +color.channel($color, green) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: green(#abcdef)} + | ^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/hue.hrx b/spec/core_functions/global/color/hue.hrx new file mode 100644 index 0000000000..83ee872fa0 --- /dev/null +++ b/spec/core_functions/global/color/hue.hrx @@ -0,0 +1,20 @@ +<===> input.scss +a {b: hue(#abcdef)} + +<===> output.css +a { + b: 210deg; +} + +<===> warning +DEPRECATION WARNING: hue() is deprecated. Suggestion: + +color.channel($color, hue) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: hue(#abcdef)} + | ^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/ie_hex_str.hrx b/spec/core_functions/global/color/ie_hex_str.hrx new file mode 100644 index 0000000000..faff0dcdfb --- /dev/null +++ b/spec/core_functions/global/color/ie_hex_str.hrx @@ -0,0 +1,7 @@ +<===> input.scss +a {b: ie-hex-str(#abcdef)} + +<===> output.css +a { + b: #FFABCDEF; +} diff --git a/spec/core_functions/global/color/invert.hrx b/spec/core_functions/global/color/invert.hrx new file mode 100644 index 0000000000..f283721d97 --- /dev/null +++ b/spec/core_functions/global/color/invert.hrx @@ -0,0 +1,48 @@ +<===> with_color/input.scss +a {b: invert(#abcdef)} + +<===> with_color/output.css +a { + b: #543210; +} + +<===> +================================================================================ +<===> with_number/input.scss +a {b: invert(10%)} + +<===> with_number/output.css +a { + b: invert(10%); +} + +<===> +================================================================================ +<===> with_css_var/input.scss +a {b: invert(var(--c))} + +<===> with_css_var/output.css +a { + b: invert(var(--c)); +} + +<===> +================================================================================ +<===> with_calc/input.scss +a {b: invert(calc(1 + 2))} + +<===> with_calc/output.css +a { + b: invert(3); +} + +<===> +================================================================================ +<===> with_unquoted_calc/input.scss +@use "sass:string"; +a {b: invert(string.unquote('calc(1)'))} + +<===> with_unquoted_calc/output.css +a { + b: invert(calc(1)); +} diff --git a/spec/core_functions/global/color/lighten.hrx b/spec/core_functions/global/color/lighten.hrx new file mode 100644 index 0000000000..2567e3adc2 --- /dev/null +++ b/spec/core_functions/global/color/lighten.hrx @@ -0,0 +1,21 @@ +<===> input.scss +a {b: lighten(#abcdef, 10%)} + +<===> output.css +a { + b: rgb(213.84, 230.5, 247.16); +} + +<===> warning +DEPRECATION WARNING: lighten() is deprecated. Suggestions: + +color.scale($color, $lightness: 51%) +color.adjust($color, $lightness: 10%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lighten(#abcdef, 10%)} + | ^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/lightness.hrx b/spec/core_functions/global/color/lightness.hrx new file mode 100644 index 0000000000..cc98cf849d --- /dev/null +++ b/spec/core_functions/global/color/lightness.hrx @@ -0,0 +1,20 @@ +<===> input.scss +a {b: lightness(#abcdef)} + +<===> output.css +a { + b: 80.3921568627%; +} + +<===> warning +DEPRECATION WARNING: lightness() is deprecated. Suggestion: + +color.channel($color, lightness) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: lightness(#abcdef)} + | ^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/mix.hrx b/spec/core_functions/global/color/mix.hrx new file mode 100644 index 0000000000..c58c24f4d5 --- /dev/null +++ b/spec/core_functions/global/color/mix.hrx @@ -0,0 +1,7 @@ +<===> input.scss +a {b: mix(#abcdef, #daddee)} + +<===> output.css +a { + b: rgb(194.5, 213, 238.5); +} diff --git a/spec/core_functions/global/color/opacify.hrx b/spec/core_functions/global/color/opacify.hrx new file mode 100644 index 0000000000..5d78f806c2 --- /dev/null +++ b/spec/core_functions/global/color/opacify.hrx @@ -0,0 +1,21 @@ +<===> input.scss +a {b: opacify(rgba(red, 0.5), 0.3)} + +<===> output.css +a { + b: rgba(255, 0, 0, 0.8); +} + +<===> warning +DEPRECATION WARNING: opacify() is deprecated. Suggestions: + +color.scale($color, $alpha: 60%) +color.adjust($color, $alpha: 0.3) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: opacify(rgba(red, 0.5), 0.3)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/opacity.hrx b/spec/core_functions/global/color/opacity.hrx new file mode 100644 index 0000000000..1073c8104f --- /dev/null +++ b/spec/core_functions/global/color/opacity.hrx @@ -0,0 +1,7 @@ +<===> input.scss +a {b: opacity(#abcdef)} + +<===> output.css +a { + b: 1; +} diff --git a/spec/core_functions/global/color/red.hrx b/spec/core_functions/global/color/red.hrx new file mode 100644 index 0000000000..1c8b799a1b --- /dev/null +++ b/spec/core_functions/global/color/red.hrx @@ -0,0 +1,20 @@ +<===> input.scss +a {b: red(#abcdef)} + +<===> output.css +a { + b: 171; +} + +<===> warning +DEPRECATION WARNING: red() is deprecated. Suggestion: + +color.channel($color, red) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: red(#abcdef)} + | ^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/saturate.hrx b/spec/core_functions/global/color/saturate.hrx new file mode 100644 index 0000000000..f8b0c74657 --- /dev/null +++ b/spec/core_functions/global/color/saturate.hrx @@ -0,0 +1,21 @@ +<===> input.scss +a {b: saturate(#abcdef, 10%)} + +<===> output.css +a { + b: #a6cdf4; +} + +<===> warning +DEPRECATION WARNING: saturate() is deprecated. Suggestions: + +color.scale($color, $saturation: 31.25%) +color.adjust($color, $saturation: 10%) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturate(#abcdef, 10%)} + | ^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/saturation.hrx b/spec/core_functions/global/color/saturation.hrx new file mode 100644 index 0000000000..6b137ad890 --- /dev/null +++ b/spec/core_functions/global/color/saturation.hrx @@ -0,0 +1,20 @@ +<===> input.scss +a {b: saturation(#abcdef)} + +<===> output.css +a { + b: 68%; +} + +<===> warning +DEPRECATION WARNING: saturation() is deprecated. Suggestion: + +color.channel($color, saturation) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: saturation(#abcdef)} + | ^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet diff --git a/spec/core_functions/global/color/scale.hrx b/spec/core_functions/global/color/scale.hrx new file mode 100644 index 0000000000..0825f037a7 --- /dev/null +++ b/spec/core_functions/global/color/scale.hrx @@ -0,0 +1,7 @@ +<===> input.scss +a {b: scale-color(#abcdef, $red: 10%)} + +<===> output.css +a { + b: rgb(179.4, 205, 239); +} diff --git a/spec/core_functions/global/color/transparentize.hrx b/spec/core_functions/global/color/transparentize.hrx new file mode 100644 index 0000000000..f1bbfdb4e6 --- /dev/null +++ b/spec/core_functions/global/color/transparentize.hrx @@ -0,0 +1,21 @@ +<===> input.scss +a {b: transparentize(rgba(red, 0.5), 0.3)} + +<===> output.css +a { + b: rgba(255, 0, 0, 0.2); +} + +<===> warning +DEPRECATION WARNING: transparentize() is deprecated. Suggestions: + +color.scale($color, $alpha: -60%) +color.adjust($color, $alpha: -0.3) + +More info: https://sass-lang.com/d/color-functions + + , +1 | a {b: transparentize(rgba(red, 0.5), 0.3)} + | ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ + ' + input.scss 1:7 root stylesheet