AmineTMIRI/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

ui fix: scroller bar in options flow page

Browse Source
This commit is contained in:
MuslemRahimi 2024-11-21 17:29:43 +01:00
parent ce04f0e26a
commit da288f62e4
2 changed files with 10 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/routes/+page.svelte
View File

@ -227,7 +227,7 @@
<main class="flex flex-1 flex-col gap-4 sm:p-4 md:gap-8"> <main class="flex flex-1 flex-col gap-4 sm:p-4 md:gap-8">
<div class="grid gap-4 md:gap-8 grid-cols-1 lg:grid-cols-2 text-start"> <div class="grid gap-4 md:gap-8 grid-cols-1 lg:grid-cols-2 text-start">
<Card.Root <Card.Root
class="order-1 sm:order-2 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar max-h-[450px]" class="order-1 sm:order-2 overflow-x-scroll overflow-hidden overflow-y-auto no-scrollbar max-h-[450px]"
> >
<Card.Header class="flex flex-row items-center"> <Card.Header class="flex flex-row items-center">
<div class="flex flex-col items-start w-full"> <div class="flex flex-col items-start w-full">
@ -320,7 +320,7 @@
</Card.Content> </Card.Content>
</Card.Root> </Card.Root>
<Card.Root <Card.Root
class="order-1 sm:order-2 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar max-h-[450px]" class="order-1 sm:order-2 overflow-x-scroll overflow-hidden overflow-y-auto no-scrollbar max-h-[450px]"
> >
<Card.Header class="flex flex-row items-center"> <Card.Header class="flex flex-row items-center">
<div class="flex flex-col items-start w-full"> <div class="flex flex-col items-start w-full">
@ -415,9 +415,7 @@
</div> </div>
<div class="grid gap-4 md:gap-8 grid-cols-1 lg:grid-cols-2 text-start"> <div class="grid gap-4 md:gap-8 grid-cols-1 lg:grid-cols-2 text-start">
<Card.Root <Card.Root class="overflow-x-scroll overflow-hidden overflow-y-auto">
class="overflow-x-scroll overflow-hidden overflow-y-scroll"
>
<Card.Header class="flex flex-row items-center"> <Card.Header class="flex flex-row items-center">
<div class="flex flex-col items-start w-full"> <div class="flex flex-col items-start w-full">
<div class="flex flex-row w-full items-center"> <div class="flex flex-row w-full items-center">
@ -438,7 +436,7 @@
<Card.Description class="mt-2 text-sm sm:text-[1rem]" <Card.Description class="mt-2 text-sm sm:text-[1rem]"
>Recent unusual options with the highest ...</Card.Description >Recent unusual options with the highest ...</Card.Description
> >
<Tabs.Root value="premium" class="w-fit mt-5 "> <Tabs.Root value="premium" class="w-full sm:w-fit mt-5 ">
<Tabs.List class="grid w-full grid-cols-3 bg-[#313131]"> <Tabs.List class="grid w-full grid-cols-3 bg-[#313131]">
<Tabs.Trigger <Tabs.Trigger
on:click={() => changeTable("premium")} on:click={() => changeTable("premium")}
@ -539,7 +537,7 @@
</Card.Root> </Card.Root>
<Card.Root <Card.Root
class="order-3 sm:order-1 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar sm:max-h-[470px]" class="order-3 sm:order-1 overflow-x-scroll overflow-hidden overflow-y-auto no-scrollbar sm:max-h-[470px]"
> >
<Card.Header class="flex flex-row items-center"> <Card.Header class="flex flex-row items-center">
<div class="flex flex-col items-start w-full"> <div class="flex flex-col items-start w-full">
@ -635,7 +633,7 @@
</Card.Root> </Card.Root>
<Card.Root <Card.Root
class="order-1 sm:order-2 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar sm:max-h-[550px]" class="order-1 sm:order-2 overflow-x-scroll overflow-hidden overflow-y-auto no-scrollbar sm:max-h-[550px]"
> >
<Card.Header class="flex flex-row items-center"> <Card.Header class="flex flex-row items-center">
<div class="flex flex-col items-start w-full"> <div class="flex flex-col items-start w-full">
@ -722,7 +720,7 @@
</Card.Root> </Card.Root>
<Card.Root <Card.Root
class="order-2 sm:order-3 overflow-x-scroll overflow-hidden overflow-y-scroll no-scrollbar sm:max-h-[550px]" class="order-2 sm:order-3 overflow-x-scroll overflow-hidden overflow-y-auto no-scrollbar sm:max-h-[550px]"
> >
<Card.Header class="flex flex-row items-center"> <Card.Header class="flex flex-row items-center">
<div class="flex flex-col items-start w-full"> <div class="flex flex-col items-start w-full">

6
src/routes/options-flow/+page.svelte
View File

@ -997,7 +997,7 @@ function sendMessage(message) {
<!-- Add more Twitter meta tags as needed --> <!-- Add more Twitter meta tags as needed -->
</svelte:head> </svelte:head>
<body class="xl:fixed h-screen w-full max-w-screen-xl"> <body class="overflow-y-auto">
<section <section
class="w-full max-w-screen sm:max-w-6xl xl:max-w-7xl flex justify-center items-center bg-[#09090B] pb-20" class="w-full max-w-screen sm:max-w-6xl xl:max-w-7xl flex justify-center items-center bg-[#09090B] pb-20"
> >
@ -1297,7 +1297,7 @@ function sendMessage(message) {
</Button> </Button>
</DropdownMenu.Trigger> </DropdownMenu.Trigger>
<DropdownMenu.Content <DropdownMenu.Content
class="w-56 h-fit max-h-72 overflow-y-auto scroller" class="w-56 h-fit max-h-72 overflow-y-auto "
> >
{#if !["put_call", "sentiment", "execution_estimate", "option_activity_type", "date_expiration", "underlying_type"]?.includes(row?.rule)} {#if !["put_call", "sentiment", "execution_estimate", "option_activity_type", "date_expiration", "underlying_type"]?.includes(row?.rule)}
<DropdownMenu.Label <DropdownMenu.Label
@ -1611,7 +1611,7 @@ function sendMessage(message) {
<!-- Page wrapper --> <!-- Page wrapper -->
<div class="flex w-full m-auto h-full overflow-hidden"> <div class="flex w-full m-auto h-full overflow-hidden">
{#if displayedData?.length !== 0} {#if displayedData?.length !== 0}
<div class="mt-8 w-full overflow-x-auto overflow-y-auto h-[850px]"> <div class="mt-8 w-full overflow-x-auto h-[850px] overflow-hidden">
<div class="table-container"> <div class="table-container">
<div class="table"> <div class="table">
<VirtualList <VirtualList