87dbb9b888
* chore: headers + common containers * fix: filters code splitting * fix: home header * fix: header changes * chore: page alignments fixed * fix: uncommented filters * fix: used enums * fix: cards + filters * fix: enum changes * fix: reverted package changes * fix: reverted package changes * fix: Card + tags seperated + naming fixed * fix: card + tags seperated + naming fixed * fix: mobile headers fixed partially * fix: build errors + minor css * fix: checkbox spacing * fix: review changes * fix: lint errors * fix: minor review changes
26 lines
1.2 KiB
TypeScript
26 lines
1.2 KiB
TypeScript
export enum EHeaderVariant {
|
|
PRIMARY = "primary",
|
|
SECONDARY = "secondary",
|
|
TERNARY = "ternary",
|
|
}
|
|
export type THeaderVariant = EHeaderVariant.PRIMARY | EHeaderVariant.SECONDARY | EHeaderVariant.TERNARY;
|
|
|
|
export interface IHeaderProperties {
|
|
[key: string]: string;
|
|
}
|
|
export const headerStyle: IHeaderProperties = {
|
|
[EHeaderVariant.PRIMARY]:
|
|
"relative flex w-full flex-shrink-0 flex-row items-center justify-between gap-x-2 gap-y-4 bg-custom-sidebar-background-100",
|
|
[EHeaderVariant.SECONDARY]: "!py-0 overflow-y-hidden border-b border-custom-border-200 justify-between",
|
|
[EHeaderVariant.TERNARY]: "flex flex-wrap justify-between py-2 border-b border-custom-border-200 gap-2",
|
|
};
|
|
export const minHeights: IHeaderProperties = {
|
|
[EHeaderVariant.PRIMARY]: "",
|
|
[EHeaderVariant.SECONDARY]: "min-h-[52px]",
|
|
[EHeaderVariant.TERNARY]: "",
|
|
};
|
|
export const getHeaderStyle = (variant: THeaderVariant, setMinHeight: boolean, showOnMobile: boolean) => {
|
|
const height = setMinHeight ? minHeights[variant] : "";
|
|
const display = variant === EHeaderVariant.SECONDARY ? (showOnMobile ? "flex" : "hidden md:flex") : "";
|
|
return " " + headerStyle[variant] + " " + height + " " + display;
|
|
};
|