Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Sidebar couldn't redesign its shape #1391

Open
2 tasks done
eryue0220 opened this issue May 10, 2024 · 1 comment
Open
2 tasks done

Sidebar couldn't redesign its shape #1391

eryue0220 opened this issue May 10, 2024 · 1 comment

Comments

@eryue0220
Copy link

  • I have searched the Issues to see if this bug has already been reported
  • I have tested the latest version

Steps to reproduce

My following code is:

import type { CustomFlowbiteTheme } from 'flowbite-react';
import { Flowbite, Sidebar } from 'flowbite-react';

const customTheme: CustomFlowbiteTheme = {
  sidebar: {
    root: {
      base: 'w-full h-64',
      inner: 'bg-white',
    },
  },
};

export default function Side() {
  return (
    <Flowbite theme={{ theme: customTheme }}>
      <Sidebar className="h-full">
        <Sidebar.Items>
          <Sidebar.ItemGroup>
            <Sidebar.Item href="#">Kanban</Sidebar.Item>
            <Sidebar.Item href="#">Inbox</Sidebar.Item>
            <Sidebar.Item href="#">Users</Sidebar.Item>
          </Sidebar.ItemGroup>
        </Sidebar.Items>
      </Sidebar>
    </Flowbite>
  );
}

Current behavior

The current width is still w-64
image

Expected behavior

The width should be reset to w-full;

Context

"flowbite": "^2.3.0",
"flowbite-react": "^0.9.0",

@eryue0220
Copy link
Author

Updated: the style can be changed through className, but couldn't be changed by the above method.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant