sass-apca 1.0.0 → 1.0.2

package/README.md

@@ -13,7 +13,7 @@ npm install sass-apca
 
 ### Contrast
 
-APCA reports lightness contrast as an L<sup>c</sup> value from L<sup>c</sup> 0 to L<sup>c</sup> 106 for dark text on a light background, and L<sup>c</sup> 0 to L<sup>c</sup> -108 for light text on a dark background (dark mode). The minus sign merely indicates negative contrast, which means light text on a dark background[^1].
+APCA reports lightness contrast as an L<sup>c</sup> value from L<sup>c</sup> 0 to L<sup>c</sup> 106 for dark text on a light background, and L<sup>c</sup> 0 to L<sup>c</sup> -108 for light text on a dark background (dark mode). The minus sign merely indicates negative contrast, which means light text on a dark background. [^1]
 
 | Parameter | Type | Description |
 |:--- |:--- |:--- |
@@ -28,7 +28,7 @@ $contrast-white-on-black: apca.contrast(white, black); // -107.8847261151
 ```
 
 ## About
-These general levels are appropriate for use by themselves, without the need to reference a lookup table. APCA reports contrast as an L<sup>c</sup> value (lightness contrast) from L<sup>c</sup> 0 to L<sup>c</sup> 105+. For accessibility, consider L<sup>c</sup> 15 the point of invisibility for many users, and L<sup>c</sup> 90 is preferred for body text[^2].
+These general levels are appropriate for use by themselves, without the need to reference a lookup table. APCA reports contrast as an L<sup>c</sup> value (lightness contrast) from L<sup>c</sup> 0 to L<sup>c</sup> 105+. For accessibility, consider L<sup>c</sup> 15 the point of invisibility for many users, and L<sup>c</sup> 90 is preferred for body text. [^2]
 
 - **L<sup>c</sup> 90** • Preferred level for fluent text and columns of body text with a font no smaller than 14px/weight 400 (normal).
 - **L<sup>c</sup> 75** • The minimum level for columns of body text with a font no smaller than 18px/400. L<sup>c</sup> 75 should be considered a minimum for text where readability is important.

package/apca.scss

@@ -30,22 +30,13 @@ $_greenMultiplier: 0.7151522;
 $_blueMultiplier: 0.072175;
 
 @function _luminance($color) {
-  // The floating point precision is poor so white would return 1.000001
-  @if ($color == white) {
-    @return 1;
-  }
-
-  @if ($color == black) {
-    @return 0;
-  }
-
   $red: color.red($color);
   $green: color.green($color);
   $blue: color.blue($color);
 
-  $redLuminance: math.pow($red / 255, $_Strc) * $_redMultiplier;
-  $greenLuminance: math.pow($green / 255, $_Strc) * $_greenMultiplier;
-  $blueLuminance: math.pow($blue / 255, $_Strc) * $_blueMultiplier;
+  $redLuminance: math.pow(math.div($red, 255), $_Strc) * $_redMultiplier;
+  $greenLuminance: math.pow(math.div($green, 255), $_Strc) * $_greenMultiplier;
+  $blueLuminance: math.pow(math.div($blue, 255), $_Strc) * $_blueMultiplier;
 
   @return $redLuminance + $greenLuminance + $blueLuminance;
 }
@@ -71,6 +62,15 @@ $_blueMultiplier: 0.072175;
   }
 }
 
+/**
+ * Determine the lightness contrast of a given text and background color using the
+ * APC algorithm
+ *
+ * @param   {color}  $textColor        Text color
+ * @param   {color}  $backgroundColor  Background color
+ *
+ * @return  {number}                    A number between -108 and 107 representing the lightness contrast 
+ */
 @function contrast($textColor, $backgroundColor) {
   @if (meta.type-of($textColor) != 'color') {
     @error "Type Error: apca.contrast expects a color as first argument but received #{meta.type-of($textColor)}. Please provide a valid color.";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sass-apca",
-  "version": "1.0.0",
+  "version": "1.0.2",
   "description": "Sass implementation of the [Accessible Perceptual Contrast Algorithm (APCA)](https://git.apcacontrast.com/) for the WCAG 3.0 specification.",
   "keywords": [
     "sass",
@@ -19,10 +19,17 @@
   },
   "bugs": "https://github.com/gfellerph/sass-apca/issues",
   "sass": "./apca.scss",
-  "devDependencies": {
-    "sass": "1.60.0"
+  "files": [
+    "./apca.scss"
+  ],
+  "scripts": {
+    "test": "sass test.scss",
+    "semantic-release": "semantic-release"
   },
-  "peerDependencies": {
-    "sass": ">=1.33.0"
+  "devDependencies": {
+    "@semantic-release/changelog": "6.0.3",
+    "@semantic-release/git": "10.0.1",
+    "sass": "1.60.0",
+    "semantic-release": "21.0.0"
   }
 }

package/.github/dependabot.yml

@@ -1,11 +0,0 @@
-# To get started with Dependabot version updates, you'll need to specify which
-# package ecosystems to update and where the package manifests are located.
-# Please see the documentation for all configuration options:
-# https://docs.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
-
-version: 2
-updates:
-  - package-ecosystem: "npm" # See documentation for possible values
-    directory: "/" # Location of package manifests
-    schedule:
-      interval: "weekly"

package/.github/workflows/release.yml

@@ -1,25 +0,0 @@
-name: Release
-on:
-  push:
-    branches:
-      - main
-jobs:
-  release:
-    name: Release
-    runs-on: ubuntu-latest
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v3
-        with:
-          fetch-depth: 0
-      - name: Setup Node.js
-        uses: actions/setup-node@v3
-        with:
-          node-version: "lts/*"
-      - name: Install dependencies
-        run: npm ci
-      - name: Release
-        env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
-        run: npx semantic-release

package/.releaserc

@@ -1,5 +0,0 @@
-{
-  "branches": [
-    "main"
-  ]
-}

package/test.scss

@@ -1,35 +0,0 @@
-@use './apca';
-
-/* tests */
-luminances {
-  --red-luminance: apca.luminance(red);
-  --green-luminance: apca.luminance(green);
-  --blue-luminance: apca.luminance(blue);
-
-  --yellow-luminance: apca.luminance(yellow);
-  --brown-luminance: apca.luminance(brown);
-  --violet-luminance: apca.luminance(violet);
-
-  --white-luminance: apca.luminance(white);
-  --black-luminance: apca.luminance(black);
-}
-
-softClip {
-  --black: apca.softClip(apca.luminance(black));
-  --white: apca.softClip(apca.luminance(white));
-  --brown: apca.softClip(apca.luminance(brown));
-}
-
-polarity {
-  --black-on-white: apca.polarity(black, white);
-  --white-on-black: apca.polarity(white, black);
-  --red-on-green: apca.polarity(red, green);
-  --green-on-red: apca.polarity(green, red);
-  --yellow-on-white: apca.polarity(#fc0, white);
-  --white-on-yellow: apca.polarity(white, #fc0);
-}
-
-contrast {
-  --black-on-white: apca.contrast(black, white);
-  --white-on-black: apca.contrast(white, black);
-}