svelte-toolkit/sui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

tabs: more configurable content padding options

Browse Source 
choice between margin and padding. ngl, this feels kind of dumb, it
wasn't be problem and I don't know when it would ever be a problem.
perhaps i'll simplify or revert this later.
This commit is contained in:
Elijah Duffy
2026-03-15 22:03:59 -07:00
parent ffe9c0369b
commit 2c99c16b48
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/lib/Tabs.svelte
View File

@@ -26,7 +26,7 @@
/** Applies layout padding to the tab header (default: false) */ /** Applies layout padding to the tab header (default: false) */
padHeader?: boolean; padHeader?: boolean;
/** Applies layout padding to the content areas (default: false) */ /** Applies layout padding to the content areas (default: false) */
padContent?: boolean; padContent?: 'padding' | 'margin' | 'none';
/** Additional classes applied to the outer container */ /** Additional classes applied to the outer container */
class?: ClassValue | null; class?: ClassValue | null;
} }
@@ -36,7 +36,7 @@
activeIndex = 0, activeIndex = 0,
onchange, onchange,
padHeader = false, padHeader = false,
padContent = false, padContent = 'none',
class: classValue class: classValue
}: Props = $props(); }: Props = $props();
@@ -144,7 +144,7 @@
{#key activeIndex} {#key activeIndex}
<div <div
class={[padContent && 'px-layout']} class={[padContent === 'padding' && 'px-layout', padContent === 'margin' && 'mx-layout']}
in:flyX={{ direction: activeIndex > prevIndex ? 1 : -1, duration: 180, delay: 181 }} in:flyX={{ direction: activeIndex > prevIndex ? 1 : -1, duration: 180, delay: 181 }}
out:flyX={{ direction: activeIndex > prevIndex ? -1 : 1, duration: 180 }} out:flyX={{ direction: activeIndex > prevIndex ? -1 : 1, duration: 180 }}
onoutrostart={lockHeight} onoutrostart={lockHeight}