sass: Make tone() private and boolean

src/_colors.scss

@@ -15,16 +15,12 @@ $light-topbar: false !default;

                                
                                
                                
                            
                                
                                    
                                        
                                            15  
                                              @return if(alpha($color) < 1, true, false);
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            16  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            17  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        18 -
                                        // Determine whether the color is "light" or "dark".
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        19 -
                                        @function tone($color) {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        18 +
                                        // Determine whether the color is dark.
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        19 +
                                        @function _is-dark($color) {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            20  
                                              // Calculate color brightness as per https://www.w3.org/TR/AERT/#color-contrast
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            21  
                                              $brightness: (red($color) * 299 + green($color) * 587 + blue($color) * 114) / 1000;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            22  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        23 -
                                          @if $brightness >= 128 {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        24 -
                                            @return "light";
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        25 -
                                          } @else {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        26 -
                                            @return "dark";
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        27 -
                                          }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        23 +
                                          @return if($brightness < 128, true, false);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            24  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            25  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            26  
                                            $on-light: #000;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -33,7 +29,7 @@ $on-dark: #fff;

                                
                                
                                
                            
                                
                                    
                                        
                                            29  
                                            // Determine whether to use dark or light color on top of given color
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            30  
                                            // to meet accessibility standards for contrast.
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            31  
                                            @function on($color) {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        36 -
                                          $contrast-color: if(tone($color) == "dark", $on-dark, $on-light);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        32 +
                                          $contrast-color: if(_is-dark($color), $on-dark, $on-light);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            33  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            34  
                                              @if saturation($color) > 50% or alpha($color) < 1 {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            35  
                                                @return $contrast-color;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -195,11 +191,11 @@ $overlay-selected: rgba($primary, .24);

                                
                                
                                
                            
                                
                                    
                                        
                                            191  
                                            //
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            192  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            193  
                                            @function primary($color) {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        198 -
                                          @return if(tone($color) == "dark", $primary-on-light, $primary-on-dark);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        194 +
                                          @return if(_is-dark($color), $primary-on-light, $primary-on-dark);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            195  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            196  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            197  
                                            @function error($color) {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        202 -
                                          @return if(tone($color) == "dark", $error-on-light, $error-on-dark);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        198 +
                                          @return if(_is-dark($color), $error-on-light, $error-on-dark);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            199  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            200  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            201  
                                            @function hint($color) {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                            
                                

src/_colors.scss.template

@@ -15,16 +15,12 @@ $light-topbar: false !default;

                                
                                
                                
                            
                                
                                    
                                        
                                            15  
                                              @return if(alpha($color) < 1, true, false);
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            16  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            17  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        18 -
                                        // Determine whether the color is "light" or "dark".
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        19 -
                                        @function tone($color) {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        18 +
                                        // Determine whether the color is dark.
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        19 +
                                        @function _is-dark($color) {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            20  
                                              // Calculate color brightness as per https://www.w3.org/TR/AERT/#color-contrast
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            21  
                                              $brightness: (red($color) * 299 + green($color) * 587 + blue($color) * 114) / 1000;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            22  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        23 -
                                          @if $brightness >= 128 {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        24 -
                                            @return "light";
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        25 -
                                          } @else {
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        26 -
                                            @return "dark";
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        27 -
                                          }
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        23 +
                                          @return if($brightness < 128, true, false);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            24  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            25  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            26  
                                            $on-light: #000;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -33,7 +29,7 @@ $on-dark: #fff;

                                
                                
                                
                            
                                
                                    
                                        
                                            29  
                                            // Determine whether to use dark or light color on top of given color
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            30  
                                            // to meet accessibility standards for contrast.
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            31  
                                            @function on($color) {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        36 -
                                          $contrast-color: if(tone($color) == "dark", $on-dark, $on-light);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        32 +
                                          $contrast-color: if(_is-dark($color), $on-dark, $on-light);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            33  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            34  
                                              @if saturation($color) > 50% or alpha($color) < 1 {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            35  
                                                @return $contrast-color;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -144,11 +140,11 @@ $on-titlebar: %HDR_FG%;

                                
                                
                                
                            
                                
                                    
                                        
                                            140  
                                            $titlebar-indicator: currentcolor;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            141  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            142  
                                            @if $dark-theme {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        147 -
                                          $surface-z0: if(tone(%BG%) == "dark", %BG%, %FG%);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        148 -
                                          $surface-z1: if(tone(%BG%) == "dark", %MATERIA_VIEW%, mix(white, $surface-z0, 5%));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        149 -
                                          $surface-z8: if(tone(%BG%) == "dark", %MATERIA_SURFACE%, mix(white, $surface-z0, 12%));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        150 -
                                          $surface-switch-thumb: if(tone(%BG%) == "dark", %MATERIA_SURFACE%, mix(white, $surface-z0, 60%));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        151 -
                                          $on-surface: if(tone(%BG%) == "dark", %FG%, on($surface-z0));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        143 +
                                          $surface-z0: if(_is-dark(%BG%), %BG%, %FG%);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        144 +
                                          $surface-z1: if(_is-dark(%BG%), %MATERIA_VIEW%, mix(white, $surface-z0, 5%));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        145 +
                                          $surface-z8: if(_is-dark(%BG%), %MATERIA_SURFACE%, mix(white, $surface-z0, 12%));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        146 +
                                          $surface-switch-thumb: if(_is-dark(%BG%), %MATERIA_SURFACE%, mix(white, $surface-z0, 60%));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        147 +
                                          $on-surface: if(_is-dark(%BG%), %FG%, on($surface-z0));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            148  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            149  
                                              $primary: $primary-on-dark;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            150  
                                              $on-primary: on($primary);
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -165,9 +161,9 @@ $titlebar-indicator: currentcolor;

                                
                                
                                
                            
                                
                                    
                                        
                                            161  
                                              $visited: $visited-on-dark;
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            162  
                                              $on-visited: on($visited);
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            163  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        168 -
                                          $titlebar: if(tone(%BG%) == "dark", %HDR_BG%, mix(white, $surface-z0, 9%));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        169 -
                                          $titlebar-backdrop: if(tone(%BG%) == "dark", %HDR_BG2%, $surface-z1);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        170 -
                                          $on-titlebar: if(tone(%BG%) == "dark", %HDR_FG%, on($titlebar));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        164 +
                                          $titlebar: if(_is-dark(%BG%), %HDR_BG%, mix(white, $surface-z0, 9%));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        165 +
                                          $titlebar-backdrop: if(_is-dark(%BG%), %HDR_BG2%, $surface-z1);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        166 +
                                          $on-titlebar: if(_is-dark(%BG%), %HDR_FG%, on($titlebar));
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            167  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            168  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            169  
                                            @if $light-topbar {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        

@@ -188,11 +184,11 @@ $overlay-selected: rgba($primary, %MATERIA_SELECTION_OPACITY%);

                                
                                
                                
                            
                                
                                    
                                        
                                            184  
                                            //
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            185  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            186  
                                            @function primary($color) {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        191 -
                                          @return if(tone($color) == "dark", $primary-on-light, $primary-on-dark);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        187 +
                                          @return if(_is-dark($color), $primary-on-light, $primary-on-dark);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            188  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            189  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            190  
                                            @function error($color) {
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        195 -
                                          @return if(tone($color) == "dark", $error-on-light, $error-on-dark);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        191 +
                                          @return if(_is-dark($color), $error-on-light, $error-on-dark);
                                        
                                        
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            192  
                                            }
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            193  
                                            
                                        
                                        
                                            
                                            
                                            
                                            
                                        
                                    
                                
                                
                                
                            
                                
                                    
                                        
                                            194  
                                            @function hint($color) {