aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/molecules/copyright/copyright.tsx
diff options
context:
space:
mode:
authorArmand Philippot <git@armandphilippot.com>2023-10-20 17:01:37 +0200
committerArmand Philippot <git@armandphilippot.com>2023-11-11 18:14:41 +0100
commit9492414d4ae94045eff4e06f636529bc0e71cb06 (patch)
tree7f268e6b62ee89128abd0581301265dc64f147d5 /src/components/molecules/copyright/copyright.tsx
parentc6f6f8f895e68f2d85ca681997ef613d982bac14 (diff)
refactor(components): rewrite Copyright component
* remove `icon` prop (it is confusing because a copyright should have the copyright symbol, the license is not part of the copyright) * reorganize copyright informations I also updated the CC BY SA icon because the elements was in the wrong order.
Diffstat (limited to 'src/components/molecules/copyright/copyright.tsx')
-rw-r--r--src/components/molecules/copyright/copyright.tsx48
1 files changed, 48 insertions, 0 deletions
diff --git a/src/components/molecules/copyright/copyright.tsx b/src/components/molecules/copyright/copyright.tsx
new file mode 100644
index 0000000..cef8ecb
--- /dev/null
+++ b/src/components/molecules/copyright/copyright.tsx
@@ -0,0 +1,48 @@
+import type { FC, HTMLAttributes } from 'react';
+import { Time } from '../../atoms';
+import styles from './copyright.module.scss';
+
+export type CopyrightProps = Omit<
+ HTMLAttributes<HTMLSpanElement>,
+ 'children'
+> & {
+ /**
+ * The start year of the copyright.
+ */
+ from: string;
+ /**
+ * The end year of the copyright.
+ */
+ to?: string;
+ /**
+ * The copyright owner.
+ */
+ owner: string;
+};
+
+export const Copyright: FC<CopyrightProps> = ({
+ className = '',
+ from,
+ owner,
+ to,
+ ...props
+}) => {
+ const wrapperClass = `${styles.wrapper} ${className}`;
+
+ /* eslint-disable react/jsx-no-literals -- Symbols allowed */
+ return (
+ <span {...props} className={wrapperClass}>
+ &copy;
+ <Time date={from} hideDay hideMonth />
+ {to ? (
+ <>
+ {'-'}
+ <Time date={to} hideDay hideMonth />
+ </>
+ ) : null}{' '}
+ {owner}
+ {'.'}
+ </span>
+ );
+ /* eslint-enable react/jsx-no-literals */
+};