toeverything / design Goto Github PK
View Code? Open in Web Editor NEWDesign System for AFFiNE and BlockSuite
License: Mozilla Public License 2.0
Design System for AFFiNE and BlockSuite
License: Mozilla Public License 2.0
The "menu" component needs to have the following:
It should support the option to show or hide the following attributes:
It should be able to display different states:
Size information:
The title column defaults to uppercase text.
The title column has:
Size info:
0.5px, default is dividerColor
.
Typically, the delete button should be at the bottom of the list, separated by a divider above it. The hover state for the delete button is red.
Size info:
The style of the search item is relatively independent. Typically, the search item appears at the top of the list, separated by a divider:
Size info
It's basically consistent with the search item. Typically, the input item appears at the top of the list, separated by a divider.
And input item need support tooltips,only when hover:
Size info:
the layout of menu:
and the submenu:
the mini width of menu is 180px
== Check the the figma link ==
Warning: React does not recognize the `withoutHoverStyle` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `withouthoverstyle` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
at div
at ButtonIcon
at button
at eval (webpack-internal:///./node_modules/@toeverything/components/dist/button.js:77:64)
at div
at eval (webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-c39617d8.browser.esm.js:57:66)
at ClickAwayListener (webpack-internal:///./node_modules/@mui/base/ClickAwayListener/ClickAwayListener.js:42:5)
at Popper (webpack-internal:///./packages/component/src/ui/popper/popper.tsx:25:19)
at Menu (webpack-internal:///./packages/component/src/ui/menu/menu.tsx:18:13)
at div
at eval (webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-c39617d8.browser.esm.js:57:66)
at CollectionList (webpack-internal:///./packages/component/src/components/page-list/view/collection-list.tsx:129:27)
at div
at div
at div
at div
at Header (webpack-internal:///./apps/core/src/components/pure/header/index.tsx:88:19)
at WorkspaceHeader (webpack-internal:///./apps/core/src/components/workspace-header.tsx:110:28)
at AllPage (webpack-internal:///./apps/core/src/pages/workspace/all-page.tsx:60:106)
at Component
at RenderedRoute (webpack-internal:///./node_modules/react-router/dist/index.js:518:5)
at Outlet (webpack-internal:///./node_modules/react-router/dist/index.js:1066:26)
at div
at MainContainer (webpack-internal:///./packages/component/src/components/workspace/index.tsx:38:26)
at Suspense
at div
at AppContainer (webpack-internal:///./packages/component/src/components/workspace/index.tsx:21:25)
at AppContainer (webpack-internal:///./apps/core/src/components/affine/app-container.tsx:19:89)
at DndContext (webpack-internal:///./node_modules/@dnd-kit/core/dist/core.esm.js:2844:5)
at WorkspaceLayoutInner (webpack-internal:///./apps/core/src/layouts/workspace-layout.tsx:198:33)
at Suspense
at CurrentWorkspaceContext (webpack-internal:///./apps/core/src/layouts/workspace-layout.tsx:112:36)
at SWRConfig (webpack-internal:///./node_modules/swr/_internal/dist/index.mjs:556:13)
at Provider (webpack-internal:///./apps/core/src/components/cloud/provider.tsx:78:25)
at AdapterProviderWrapper (webpack-internal:///./apps/core/src/components/adapter-worksapce-wrapper.tsx:19:35)
at WorkspacesSuspense (webpack-internal:///./apps/core/src/layouts/workspace-layout.tsx:149:55)
at Component
at RenderedRoute (webpack-internal:///./node_modules/react-router/dist/index.js:518:5)
at RenderErrorBoundary (webpack-internal:///./node_modules/react-router/dist/index.js:465:5)
at DataRoutes (webpack-internal:///./node_modules/react-router/dist/index.js:975:5)
at Router (webpack-internal:///./node_modules/react-router/dist/index.js:1087:15)
at RouterProvider (webpack-internal:///./node_modules/react-router/dist/index.js:915:5)
at DebugProvider (webpack-internal:///./apps/core/src/app.tsx:45:26)
at f (webpack-internal:///./node_modules/next-themes/dist/index.module.js:7:597)
at $ (webpack-internal:///./node_modules/next-themes/dist/index.module.js:7:348)
at ThemeProvider (webpack-internal:///./packages/component/src/components/theme-provider/index.tsx:45:26)
at Provider (webpack-internal:///./node_modules/jotai/esm/react.mjs:19:3)
at ProviderComposer (webpack-internal:///./packages/component/src/components/provider-composer/index.tsx:13:29)
at AffineContext (webpack-internal:///./packages/component/src/components/context/index.tsx:31:19)
at SessionProvider (webpack-internal:///./node_modules/next-auth/react/index.js:454:24)
at App
at Suspense
at div
at ButtonIcon
at button
at eval (webpack-internal:///./node_modules/@toeverything/components/dist/button.js:77:64)
at div
at eval (webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-c39617d8.browser.esm.js:57:66)
at ClickAwayListener (webpack-internal:///./node_modules/@mui/base/ClickAwayListener/ClickAwayListener.js:42:5)
at Popper (webpack-internal:///./packages/component/src/ui/popper/popper.tsx:25:19)
at Menu (webpack-internal:///./packages/component/src/ui/menu/menu.tsx:18:13)
at div
at eval (webpack-internal:///./node_modules/@emotion/react/dist/emotion-element-c39617d8.browser.esm.js:57:66)
at CollectionList (webpack-internal:///./packages/component/src/components/page-list/view/collection-list.tsx:129:27)
at div
at div
at div
at div
at Header (webpack-internal:///./apps/core/src/components/pure/header/index.tsx:88:19)
at WorkspaceHeader (webpack-internal:///./apps/core/src/components/workspace-header.tsx:110:28)
at AllPage (webpack-internal:///./apps/core/src/pages/workspace/all-page.tsx:60:106)
at Component
at RenderedRoute (webpack-internal:///./node_modules/react-router/dist/index.js:518:5)
at Outlet (webpack-internal:///./node_modules/react-router/dist/index.js:1066:26)
at div
at MainContainer (webpack-internal:///./packages/component/src/components/workspace/index.tsx:38:26)
at Suspense
at div
at AppContainer (webpack-internal:///./packages/component/src/components/workspace/index.tsx:21:25)
at AppContainer (webpack-internal:///./apps/core/src/components/affine/app-container.tsx:19:89)
at DndContext (webpack-internal:///./node_modules/@dnd-kit/core/dist/core.esm.js:2844:5)
at WorkspaceLayoutInner (webpack-internal:///./apps/core/src/layouts/workspace-layout.tsx:198:33)
at Suspense
at CurrentWorkspaceContext (webpack-internal:///./apps/core/src/layouts/workspace-layout.tsx:112:36)
at SWRConfig (webpack-internal:///./node_modules/swr/_internal/dist/index.mjs:556:13)
at Provider (webpack-internal:///./apps/core/src/components/cloud/provider.tsx:78:25)
at AdapterProviderWrapper (webpack-internal:///./apps/core/src/components/adapter-worksapce-wrapper.tsx:19:35)
at WorkspacesSuspense (webpack-internal:///./apps/core/src/layouts/workspace-layout.tsx:149:55)
at Component
at RenderedRoute (webpack-internal:///./node_modules/react-router/dist/index.js:518:5)
at RenderErrorBoundary (webpack-internal:///./node_modules/react-router/dist/index.js:465:5)
at DataRoutes (webpack-internal:///./node_modules/react-router/dist/index.js:975:5)
at Router (webpack-internal:///./node_modules/react-router/dist/index.js:1087:15)
at RouterProvider (webpack-internal:///./node_modules/react-router/dist/index.js:915:5)
at DebugProvider (webpack-internal:///./apps/core/src/app.tsx:45:26)
at f (webpack-internal:///./node_modules/next-themes/dist/index.module.js:7:597)
at $ (webpack-internal:///./node_modules/next-themes/dist/index.module.js:7:348)
at ThemeProvider (webpack-internal:///./packages/component/src/components/theme-provider/index.tsx:45:26)
at Provider (webpack-internal:///./node_modules/jotai/esm/react.mjs:19:3)
at ProviderComposer (webpack-internal:///./packages/component/src/components/provider-composer/index.tsx:13:29)
at AffineContext (webpack-internal:///./packages/component/src/components/context/index.tsx:31:19)
at SessionProvider (webpack-internal:///./node_modules/next-auth/react/index.js:454:24)
at App
at Suspense
This issue serves as a list for continual collecting and tracking.
Will override styles
The goal is to make the appearance of the app more modern, elegant while keep its readability and legibility.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.