Skip to content

Replace mantine with TailwindCSS #8

@sbsrnt

Description

@sbsrnt

User story
Currently, exile.watch design system utilizes components provided by Mantine components library.

While the library is great it has it's flaws:

  1. It's heavy. Even though authors removed emotion in 7.x version, there is still a boatload of unnecessary styles that are core and exile.watch does not really care about them.
  2. There is no SSR (Server Side Rendering) support so we can't really use RSC (React Server Components)
  3. @exile-watch/writ-react output has to be built in CommonJS due to the vast support of browsers Mantine handles.

Acceptance criteria

  1. Add Breakpoints (@media-query)
  2. Grid system
  3. Theme support
  4. Following components need to be rewritten to tailwind:
  • AppShell
  • Anchor
  • Badge
  • Burger
  • Button
  • Card
  • Center
  • Code
  • Container
  • Combobox
  • Divider
  • Flex
  • Group
  • InputBase
  • Loader
  • NavLink
  • SimpleGrid
  • Skeleton
  • Stack
  • Text
  • Title
  1. Add Storybook
  2. Remove @mantine/* packages
  3. Once everything is done, remove cjs output from this line https://github.com/exile-watch/writ/blob/main/packages/writ-react/rollup.config.ts#L7

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    Status

    No status

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions