svelte-tabs icon indicating copy to clipboard operation
svelte-tabs copied to clipboard

Changing margin shifts following content

Open Neon-Ape opened this issue 4 years ago • 2 comments

Any content after Tabs will be shifted upward by .5em when the last Tab is selected. This is due to this CSS rule: .svelte-tabs__tab-panel { margin-top: 0.5em; } Putting the margin on the TabList instead fixes the problem. .svelte-tabs__tab-list { margin-bottom: .5em; }

Neon-Ape avatar Aug 01 '20 10:08 Neon-Ape

Another option for removing the unwanted spacing would be to move the {#if $selectedPanel === panel} block to go around the entire div in the TabPanel component as opposed to just the slot.

JHethDev avatar Mar 17 '21 01:03 JHethDev

Another option for removing the unwanted spacing would be to move the {#if $selectedPanel === panel} block to go around the entire div in the TabPanel component as opposed to just the slot.

This is a perfect solution, since we can now apply any style rules we want to the panels with no 'stacking' consequences at all.

It seems like this repo is not maintained however...

Novaras avatar May 17 '21 17:05 Novaras