chore: replace css-color-converter with color

Author: LitoMore

badge-maker/README.md

@@ -105,6 +105,7 @@ There are three ways to specify `color` and `labelColor`:
 
 - `rgb(...)`, `rgba(...)`
 - `hsl(...)`, `hsla(...)`
+- `hwb(...)`
 - ![][aqua] ![][fuchsia] ![][lightslategray] etc.
 
 [brightgreen]: https://img.shields.io/badge/brightgreen-brightgreen.svg

badge-maker/lib/color.js

@@ -1,4 +1,4 @@
-import { fromString } from 'css-color-converter'
+import colour from 'color'
 
 // When updating these, be sure also to update the list in `badge-maker/README.md`.
 export const namedColors = {
@@ -36,7 +36,13 @@ export function isHexColor(s = '') {
 }
 
 function isCSSColor(color) {
-  return typeof color === 'string' && fromString(color.trim())
+  if (typeof color !== 'string') return false
+  try {
+    const cssColor = colour(color.trim())
+    return Boolean(cssColor)
+  } catch {
+    return false
+  }
 }
 
 export function normalizeColor(color) {
@@ -67,12 +73,15 @@ export function toSvgColor(color) {
 }
 
 export function brightness(color) {
-  if (color) {
-    const cssColor = fromString(color)
+  if (!color) return 0
+  try {
+    const cssColor = colour(color)
+
     if (cssColor) {
-      const rgb = cssColor.toRgbaArray()
+      const rgb = cssColor.rgb().array()
       return +((rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 255000).toFixed(2)
     }
+  } catch {
+    return 0
   }
-  return 0
 }

badge-maker/lib/color.spec.js

@@ -33,20 +33,23 @@ test(normalizeColor, () => {
   given('rgb(100%, 200%, 222%)').expect('rgb(100%, 200%, 222%)')
   given('rgb(122, 200, 222)').expect('rgb(122, 200, 222)')
   given('rgb(122, 200, 222, 1)').expect('rgb(122, 200, 222, 1)')
+  given('rgb(-100, 20, 111)').expect('rgb(-100, 20, 111)')
+  given('rgba(-100, 20, 111, 1.1)').expect('rgba(-100, 20, 111, 1.1)')
   given('rgba(100, 20, 111, 1)').expect('rgba(100, 20, 111, 1)')
   given('hsl(122, 200%, 222%)').expect('hsl(122, 200%, 222%)')
   given('hsla(122, 200%, 222%, 1)').expect('hsla(122, 200%, 222%, 1)')
+  given('hwb(122, 200%, 222%)').expect('hwb(122, 200%, 222%)')
+  given('hwb(122, 200%, 222%, 1)').expect('hwb(122, 200%, 222%, 1)')
   forCases([
     given(),
     given(''),
     given('not-a-color'),
     given('#ABCFGH'),
-    given('rgb(-100, 20, 111)'),
     given('rgb(100%, 200, 222)'),
-    given('rgba(-100, 20, 111, 1.1)'),
     given('hsl(122, 200, 222, 1)'),
     given('hsl(122, 200, 222)'),
     given('hsl(122, 200, 222%)'),
+    given('hwba(122, 200%, 222, 1)'),
     given(undefined),
     given(null),
     given(true),

badge-maker/package.json

@@ -42,7 +42,7 @@
   },
   "dependencies": {
     "anafanafo": "2.0.0",
-    "css-color-converter": "^2.0.0"
+    "color": "^5.0.0"
   },
   "scripts": {
     "test": "echo 'Run tests from parent dir'; false"

core/base-service/openapi.js

@@ -135,7 +135,7 @@ function category2openapi({ category, services, sort = false }) {
           in: 'query',
           required: false,
           description:
-            'The color of the logo (hex, rgb, rgba, hsl, hsla and css named colors supported). Supported for simple-icons logos but not for custom logos.',
+            'The color of the logo (hex, rgb, rgba, hsl, hsla, hwb and css named colors supported). Supported for simple-icons logos but not for custom logos.',
           schema: {
             type: 'string',
           },
@@ -168,7 +168,7 @@ function category2openapi({ category, services, sort = false }) {
           in: 'query',
           required: false,
           description:
-            'Background color of the left part (hex, rgb, rgba, hsl, hsla and css named colors supported).',
+            'Background color of the left part (hex, rgb, rgba, hsl, hsla, hwb and css named colors supported).',
           schema: {
             type: 'string',
           },
@@ -179,7 +179,7 @@ function category2openapi({ category, services, sort = false }) {
           in: 'query',
           required: false,
           description:
-            'Background color of the right part (hex, rgb, rgba, hsl, hsla and css named colors supported).',
+            'Background color of the right part (hex, rgb, rgba, hsl, hsla, hwb and css named colors supported).',
           schema: {
             type: 'string',
           },

core/base-service/openapi.spec.js

@@ -88,7 +88,7 @@ const expected = {
         in: 'query',
         required: false,
         description:
-          'The color of the logo (hex, rgb, rgba, hsl, hsla and css named colors supported). Supported for simple-icons logos but not for custom logos.',
+          'The color of the logo (hex, rgb, rgba, hsl, hsla, hwb and css named colors supported). Supported for simple-icons logos but not for custom logos.',
         schema: { type: 'string' },
         example: 'violet',
       },
@@ -117,7 +117,7 @@ const expected = {
         in: 'query',
         required: false,
         description:
-          'Background color of the left part (hex, rgb, rgba, hsl, hsla and css named colors supported).',
+          'Background color of the left part (hex, rgb, rgba, hsl, hsla, hwb and css named colors supported).',
         schema: { type: 'string' },
         example: 'abcdef',
       },
@@ -126,7 +126,7 @@ const expected = {
         in: 'query',
         required: false,
         description:
-          'Background color of the right part (hex, rgb, rgba, hsl, hsla and css named colors supported).',
+          'Background color of the right part (hex, rgb, rgba, hsl, hsla, hwb and css named colors supported).',
         schema: { type: 'string' },
         example: 'fedcba',
       },

core/server/error-pages/500.html

@@ -1,6 +1,5 @@
-<!doctype html><meta charset=utf-8><title>A server error occurred</title>
+<!doctype html><meta charset="utf-8" /><title>A server error occurred</title>
 
-<h1> I have nothing to offer for this request </h1>
-<p> … but blood, toil, tears and sweat.
-</p>
+<h1>I have nothing to offer for this request</h1>
+<p>… but blood, toil, tears and sweat.</p>
 <p>And trying again later.</p>

core/server/test-public/index.html

@@ -1,7 +1,7 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
   <head>
-    <meta charset="utf-8">
+    <meta charset="utf-8" />
     <title>shields.io</title>
   </head>
   <body>

frontend/docs/logos.md

@@ -20,7 +20,7 @@ Any custom logo can be passed in a URL parameter by base64 encoding it. e.g:
 
 ## logoColor parameter
 
-The `logoColor` param can be used to set the color of the SimpleIcons named logo. Hex, rgb, rgba, hsl, hsla and css named colors can all be used.
+The `logoColor` param can be used to set the color of the SimpleIcons named logo. Hex, rgb, rgba, hsl, hsla, hwb and css named colors can all be used.
 
 - ![](https://img.shields.io/badge/logo-javascript-blue?logo=javascript) - https://img.shields.io/badge/logo-javascript-blue?logo=javascript
 - ![](https://img.shields.io/badge/logo-javascript-blue?logo=javascript&logoColor=f5f5f5) - https://img.shields.io/badge/logo-javascript-blue?logo=javascript&logoColor=f5f5f5

frontend/src/css/custom.css

@@ -23,7 +23,7 @@
   padding: 0 var(--ifm-pre-padding);
 }
 
-html[data-theme="dark"] .docusaurus-highlight-code-line {
+html[data-theme='dark'] .docusaurus-highlight-code-line {
   background-color: rgba(0, 0, 0, 0.3);
 }