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

Ratio does not work for horizontal (vertical=false) layout #128

Open
renzo-cast opened this issue Nov 19, 2024 · 0 comments
Open

Ratio does not work for horizontal (vertical=false) layout #128

renzo-cast opened this issue Nov 19, 2024 · 0 comments

Comments

@renzo-cast
Copy link

On the React component setting vertical to 'false' seems to cause the 'ratio' unit size to be ignored. The resulting panes will have a pixel value matching the pane size.

Demo

import { Pane, ResizablePanes } from "resizable-panes-react";

export default function VerticalDemoPage() {
  return (
    <ResizablePanes uniqueId="uniqueId" vertical={false} resizerClass="bg-slate-500">
      <Pane id="P0" size={10} >
        <div className='w-screen h-dvh inline-block align-middle bg-cyan-500'>Component 1</div>
      </Pane>
      <Pane id="P1" size={20}>
        <div className='w-screen h-dvh inline-block align-middle bg-pink-500'>Component 2</div>
      </Pane>
    </ResizablePanes>
  )
}

image

changing vertical to true results in panes with a correct ratio

image

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