mirror of
https://github.com/BetterSEQTA/BetterSEQTA-Plus.git
synced 2026-06-06 11:44:40 +00:00
fixed menu tab scroll sizes
This commit is contained in:
@@ -31,7 +31,7 @@ const SettingsPage = ({ standalone }: SettingsPage) => {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<SettingsContextProvider>
|
<SettingsContextProvider>
|
||||||
<div className={`flex flex-col w-[384px] shadow-2xl gap-2 bg-white ${ standalone ? '' : 'rounded-xl' } ${ standalone ? 'h-[600px]' : 'h-[100vh]' } overflow-clip dark:bg-zinc-800 dark:text-white`}>
|
<div className={`flex flex-col w-[384px] shadow-2xl gap-2 bg-white ${ standalone ? 'h-[600px]' : 'h-[100vh] rounded-xl' } overflow-clip dark:bg-zinc-800 dark:text-white`}>
|
||||||
<div className="grid border-b border-b-zinc-200/40 place-items-center">
|
<div className="grid border-b border-b-zinc-200/40 place-items-center">
|
||||||
<img src={logo} className="w-4/5 dark:hidden" />
|
<img src={logo} className="w-4/5 dark:hidden" />
|
||||||
<img src={logoDark} className="hidden w-4/5 dark:block" />
|
<img src={logoDark} className="hidden w-4/5 dark:block" />
|
||||||
|
|||||||
@@ -77,20 +77,19 @@ const TabbedContainer: React.FC<TabbedContainerProps> = ({ tabs }) => {
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="h-full px-4 overflow-y-scroll overflow-x-clip">
|
<div className="h-full px-4 overflow-x-clip">
|
||||||
<motion.div
|
<motion.div
|
||||||
initial={false}
|
initial={false}
|
||||||
animate={{ x: `${position}%` }}
|
animate={{ x: `${position}%` }}
|
||||||
transition={springTransition}
|
transition={springTransition}
|
||||||
|
className='flex'
|
||||||
>
|
>
|
||||||
<div className="flex">
|
|
||||||
{tabs.map((tab, index) => (
|
{tabs.map((tab, index) => (
|
||||||
<div key={index} className={`absolute w-full transition-opacity duration-300 pb-4 ${activeTab === index ? 'opacity-100' : 'opacity-0'}`}
|
<div key={index} className={`absolute h-[100vh] overflow-y-scroll w-full pb-40 transition-opacity duration-300 ${activeTab === index ? 'opacity-100' : 'opacity-0'}`}
|
||||||
style={{left: `${index * 100}%`}}>
|
style={{left: `${index * 100}%`}}>
|
||||||
{tab.content}
|
{tab.content}
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
</div>
|
|
||||||
</motion.div>
|
</motion.div>
|
||||||
</div>
|
</div>
|
||||||
</>
|
</>
|
||||||
|
|||||||
@@ -5,8 +5,9 @@
|
|||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<title>BetterSEQTA+ Settings</title>
|
<title>BetterSEQTA+ Settings</title>
|
||||||
</head>
|
</head>
|
||||||
<body class="">
|
<body style="width: 384px; height: 600px;">
|
||||||
<div id="ExtensionPopup"></div>
|
<div id="ExtensionPopup">
|
||||||
|
</div>
|
||||||
<script type="module" src="./main.tsx"></script>
|
<script type="module" src="./main.tsx"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user