git/metabuilder
1
0
Fork 0
mirror of https://github.com/johndoe6345789/metabuilder.git synced 2026-04-25 14:25:02 +00:00
Code Issues Packages Projects Releases Wiki Activity

code: nextjs,frontends,scss (7 files)

Browse Source
This commit is contained in:
Richard Ward
2025-12-30 18:09:19 +00:00
parent cd3255a94e
commit 9be16fb0d2
7 changed files with 102 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
frontends/nextjs/src/components/ui/molecules/overlay/Dialog.module.scss Normal file
View File

@@ -0,0 +1,16 @@
// Dialog molecule component styles
.trigger {
display: inline-flex;
}
.closeButton {
position: absolute;
right: 8px;
top: 8px;
color: var(--color-text-secondary, rgba(0, 0, 0, 0.6));
}
.description {
color: var(--color-text-secondary, rgba(0, 0, 0, 0.6));
}

17
frontends/nextjs/src/components/ui/molecules/overlay/Dialog.tsx
View File

@@ -1,21 +1,22 @@
'use client'
import {
Box,
Dialog as MuiDialog,
DialogProps as MuiDialogProps,
DialogTitle as MuiDialogTitle,
IconButton,
Typography,
} from '@mui/material'
import { forwardRef, ReactNode } from 'react'
import { Box } from '@/fakemui/fakemui/layout'
import { Typography } from '@/fakemui/fakemui/data-display'
import { IconButton } from '@/fakemui/fakemui/inputs'
import {
Dialog as FakeMuiDialog,
DialogTitle as FakeMuiDialogTitle,
} from '@/fakemui/fakemui/utils'
import { Close } from '@/fakemui/icons'
import { DialogContent, type DialogContentProps } from './dialog/Body'
import { DialogFooter, type DialogFooterProps } from './dialog/Footer'
import { DialogHeader, type DialogHeaderProps } from './dialog/Header'
import styles from './Dialog.module.scss'
export interface DialogProps extends Omit<MuiDialogProps, 'onClose'> {
onOpenChange?: (open: boolean) => void
onClose?: () => void

17
frontends/nextjs/src/components/ui/molecules/overlay/Dialog/Body.module.scss Normal file
View File

@@ -0,0 +1,17 @@
// DialogBody molecule component styles
.body {
position: relative;
padding: 16px 24px;
&.hasCloseButton {
padding-top: 48px;
}
}
.closeButton {
position: absolute;
right: 8px;
top: 8px;
color: var(--color-text-secondary, rgba(0, 0, 0, 0.6));
}

9
frontends/nextjs/src/components/ui/molecules/overlay/Dialog/Footer.module.scss Normal file
View File

@@ -0,0 +1,9 @@
// DialogFooter molecule component styles
.footer {
display: flex;
align-items: center;
justify-content: flex-end;
padding: 16px 24px;
gap: 8px;
}

8
frontends/nextjs/src/components/ui/molecules/overlay/Dialog/Header.module.scss Normal file
View File

@@ -0,0 +1,8 @@
// DialogHeader molecule component styles
.header {
display: flex;
flex-direction: column;
gap: 8px;
padding-bottom: 16px;
}

12
frontends/nextjs/src/components/ui/molecules/overlay/Dialog/Sections.module.scss Normal file
View File

@@ -0,0 +1,12 @@
// DialogSections molecule component styles
.sections {
display: flex;
flex-direction: column;
}
.section {
display: flex;
flex-direction: column;
gap: 16px;
}

31
frontends/nextjs/src/components/ui/molecules/overlay/DropdownMenu/MenuItem.module.scss Normal file
View File

@@ -0,0 +1,31 @@
// MenuItem molecule component styles
.container {
display: flex;
align-items: center;
gap: 16px;
width: 100%;
&.hasDescription {
align-items: flex-start;
}
}
.content {
flex: 1;
}
.label {
font-size: 0.875rem;
line-height: 1.43;
}
.description {
margin-top: 4px;
color: var(--color-text-secondary, rgba(0, 0, 0, 0.6));
}
.detail {
color: var(--color-text-secondary, rgba(0, 0, 0, 0.6));
font-size: 0.875rem;
}