feat: course color generation (#179)

* feat: course color generation

* feat: add proper TS for hex colors

* refactor: fix oklab and improve contrast ratios

* fix: update HexColor type

* refactor: update color switch point

* refactor: color-related functions and types

* fix: imports and TS issues

* fix: imports and TS issues

* chore: add no-restricted-syntax ForInStatement

* chore(docs): add jsdoc

---------

Co-authored-by: doprz <52579214+doprz@users.noreply.github.com>
This commit is contained in:
Razboy20
2024-03-19 18:54:11 -05:00
committed by GitHub
parent c5fc6219e1
commit 5ed81e4be9
30 changed files with 424 additions and 422 deletions

View File

@@ -2,6 +2,11 @@ import clsx from 'clsx';
import type { SVGProps } from 'react';
import React from 'react';
/**
* Renders the logo icon.
* @param {SVGProps<SVGSVGElement>} props - The SVG props.
* @returns {JSX.Element} The rendered logo icon.
*/
export function LogoIcon(props: SVGProps<SVGSVGElement>): JSX.Element {
return (
<svg width='40' height='40' viewBox='0 0 40 40' fill='none' xmlns='http://www.w3.org/2000/svg' {...props}>
@@ -13,6 +18,12 @@ export function LogoIcon(props: SVGProps<SVGSVGElement>): JSX.Element {
);
}
/**
* Renders the small logo.
* @param {Object} props - The component props.
* @param {string} props.className - The class name for the logo container.
* @returns {JSX.Element} The rendered small logo.
*/
export function SmallLogo({ className }: { className?: string }): JSX.Element {
return (
<div className={clsx('flex items-center gap-2', className)}>
@@ -25,6 +36,12 @@ export function SmallLogo({ className }: { className?: string }): JSX.Element {
);
}
/**
* Renders the large logo.
* @param {Object} props - The component props.
* @param {string} props.className - The class name for the logo container.
* @returns {JSX.Element} The rendered large logo.
*/
export function LargeLogo({ className }: { className?: string }): JSX.Element {
return (
<div className={clsx('flex items-center gap-2', className)}>