question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Allotment.Pane should allow css classes / styles

See original GitHub issue

For example, I want to add an overflow attribute to one of the panes.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:8 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
johnwalleycommented, Apr 3, 2022

I think this is done so I’m closing. Please let me know if this isn’t the case.

1reaction
johnwalleycommented, Dec 31, 2021

I have a prototype up and running and it looks good.

Dec-31-2021 15-42-46

Here, the content of the left pane is fixed width and I’ve set the overflow of the Allotment.Pane to be scroll. The white background is the Pane content, and the red background is the Pane background.

The only reason I’m not merging it straight away is a small issue with the specificity of the rules. Basically, the Allotment.Pane classes are more specific than the single custom class you’d add yourself. Which means, any css would override your custom css. Once I’ve moved overflow off the Allotment.Pane component I don’t see it being a problem but I’d like to do some testing first.

Read more comments on GitHub >

github_iconTop Results From Across the Web

johnwalley/allotment: A React component for resizable split ...
Some common style changes can be made by setting CSS variables. ... For more involved styling you can target the component's child elements....
Read more >
Which config allows to activate css style inside extjs tabpanel
I have tab panel inside the panel class. How I can to use CSS for tab panel items (title cls) and items of...
Read more >
CSS Modules with React: The Complete Guide | by Suraj KC
CSS module makes CSS classes local for every component declared within by adding hashes in class names which are unique to each component,...
Read more >
Getting Started - Allotment
Allotment is available as an npm package. ... Remember to import the required css: import "allotment/dist/style.css". Control over individual panes​.
Read more >
How to use styles in React: Inline styles, CSS Modules ...
Inline styles are often used when the styling has to change based on JavaScript logic or if you need to pass in calculated...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found