mirror of
https://github.com/webstudio-is/webstudio.git
synced 2026-11-08 21:15:18 +09:00
## Description Improving onboarding experience: - Intro video as a first item in resources of the dashboard - Hover/focus states of resource items more nice https://github.com/webstudio-is/webstudio/assets/52824/9ba48b1d-950e-49ca-b2fd-44c1a3ead5dc ## Code Review - [ ] hi @TrySound , I need you to do - conceptual review (architecture, feature-correctness) - detailed review (read every line) - test it on preview ## Before requesting a review - [ ] made a self-review - [ ] added inline comments where things may be not obvious (the "why", not "what") ## Before merging - [ ] tested locally and on preview environment (preview dev login: 5de6) - [ ] updated [test cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md) document - [ ] added tests - [ ] if any new env variables are added, added them to `.env.example` and the `builder/env-check.js` if mandatory
17 lines
519 B
TypeScript
17 lines
519 B
TypeScript
import { Flex, css, theme } from "@webstudio-is/design-system";
|
|
import type { ComponentProps } from "react";
|
|
|
|
const panelStyle = css({
|
|
background: theme.colors.backgroundPanel,
|
|
padding: theme.spacing[13],
|
|
borderRadius: theme.borderRadius[6],
|
|
color: theme.colors.foregroundMain,
|
|
minWidth: "min-content",
|
|
boxShadow: theme.shadows.brandElevationBig,
|
|
flexGrow: 1,
|
|
});
|
|
|
|
export const Panel = (props: ComponentProps<typeof Flex>) => (
|
|
<Flex direction="column" gap="5" className={panelStyle()} {...props} />
|
|
);
|