scroll tabs on mouse wheel

This commit is contained in:
Jan Prochazka 2022-02-10 11:26:10 +01:00
parent 062edafbe5
commit c3c63da752

View File

@ -24,11 +24,20 @@
import dragDropFileTarget from './utility/dragDropFileTarget'; import dragDropFileTarget from './utility/dragDropFileTarget';
$: currentThemeType = $currentThemeDefinition?.themeType == 'dark' ? 'theme-type-dark' : 'theme-type-light'; $: currentThemeType = $currentThemeDefinition?.themeType == 'dark' ? 'theme-type-dark' : 'theme-type-light';
let domTabs;
function handleTabsWheel(e) {
if (!e.shiftKey) {
e.preventDefault();
domTabs.scrollBy({ top: 0, left: e.deltaY < 0 ? -150 : 150, behavior: 'smooth' });
}
}
</script> </script>
<svelte:head> <svelte:head>
{#if $currentThemeDefinition?.themeCss} {#if $currentThemeDefinition?.themeCss}
{@html `<style id="themePlugin">${$currentThemeDefinition?.themeCss}</style>`} {@html `<style id="themePlugin" ✂prettier:content✂="JHskY3VycmVudFRoZW1lRGVmaW5pdGlvbj8udGhlbWVDc3N9" ✂prettier:content✂="" ✂prettier:content✂="" ✂prettier:content✂="" ✂prettier:content✂="" ✂prettier:content✂=""></style>`}
{/if} {/if}
</svelte:head> </svelte:head>
@ -48,7 +57,7 @@
<WidgetContainer /> <WidgetContainer />
</div> </div>
{/if} {/if}
<div class="tabs"> <div class="tabs" on:wheel={handleTabsWheel} bind:this={domTabs}>
<TabsPanel /> <TabsPanel />
</div> </div>
<div class="content"> <div class="content">