4nk/lecoffre-front
4
0
Fork 0
Code Issues 1 Pull Requests 1 Actions Packages Projects Releases Wiki Activity

add separator thickness

Browse Source
This commit is contained in:
Max S 2024-08-13 10:37:50 +02:00
parent b3d8dfae5e
commit bd8c509151
1 changed files with 4 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
src/front/Components/DesignSystem/Separator/index.tsx
View File

@ -1,7 +1,7 @@
import classNames from "classnames";
import React from "react"; import React from "react";
import classes from "./classes.module.scss"; import classes from "./classes.module.scss";
import classNames from "classnames";
export enum ESeperatorColor { export enum ESeperatorColor {
LIGHT = "light", LIGHT = "light",
@ -19,15 +19,16 @@ type IProps = {
color?: ESeperatorColor; color?: ESeperatorColor;
direction?: ESeperatorDirection; direction?: ESeperatorDirection;
size?: number; size?: number;
thickness?: number;
}; };
export default function Separator(props: IProps) { export default function Separator(props: IProps) {
const { color = ESeperatorColor.DEFAULT, direction = ESeperatorDirection.HORIZONTAL, size } = props; const { color = ESeperatorColor.DEFAULT, direction = ESeperatorDirection.HORIZONTAL, size, thickness = 1 } = props;
return ( return (
<div <div
className={classNames(classes["root"], classes[color], classes[direction])} className={classNames(classes["root"], classes[color], classes[direction])}
style={direction === ESeperatorDirection.HORIZONTAL ? { width: size } : { height: size }} style={direction === ESeperatorDirection.HORIZONTAL ? { width: size, height: thickness } : { height: size, width: thickness }}
/> />
); );
} }