Import source: src/components/RightPanel/RightPanel
Import the existing local project snapshot. This commit organizes existing files; it does not represent newly developed functionality.
This commit is contained in:
@@ -0,0 +1,50 @@
|
||||
import { ThemeSection } from './ThemeSection';
|
||||
import { PatternSection } from './PatternSection';
|
||||
import { ColorsSection } from './ColorsSection';
|
||||
import { GradientSection } from './GradientSection';
|
||||
import { CornerStyleSection } from './CornerStyleSection';
|
||||
import { LogoSection } from './LogoSection';
|
||||
import { FrameLabelSection } from './FrameLabelSection';
|
||||
import { DownloadSizeSection } from './DownloadSizeSection';
|
||||
|
||||
interface Props { embedded?: boolean }
|
||||
|
||||
function Divider() {
|
||||
return <div style={{ borderTop: '1px solid var(--border)' }} />;
|
||||
}
|
||||
|
||||
export function RightPanel({ embedded }: Props) {
|
||||
return (
|
||||
<div
|
||||
className="flex-shrink-0 flex flex-col h-full overflow-y-auto"
|
||||
style={{
|
||||
width: embedded ? '100%' : 'var(--right-w)',
|
||||
background: 'var(--bg-panel)',
|
||||
borderLeft: embedded ? 'none' : '1px solid var(--border)',
|
||||
}}
|
||||
>
|
||||
{!embedded && (
|
||||
<div className="p-5 pb-4 xl:p-6 xl:pb-4">
|
||||
<h2 className="text-[17px] xl:text-[19px] font-bold" style={{ color: 'var(--text-primary)' }}>Style your QR</h2>
|
||||
</div>
|
||||
)}
|
||||
<div className="flex flex-col gap-5 px-4 xl:px-6 pb-8 pt-4">
|
||||
<ThemeSection />
|
||||
<Divider />
|
||||
<PatternSection />
|
||||
<Divider />
|
||||
<CornerStyleSection />
|
||||
<Divider />
|
||||
<ColorsSection />
|
||||
<Divider />
|
||||
<GradientSection />
|
||||
<Divider />
|
||||
<LogoSection />
|
||||
<Divider />
|
||||
<FrameLabelSection />
|
||||
<Divider />
|
||||
<DownloadSizeSection />
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user