ui fix
This commit is contained in:
parent
46d0c44a3d
commit
9066db5362
@ -6,7 +6,6 @@
|
|||||||
compareTimes,
|
compareTimes,
|
||||||
formatTime,
|
formatTime,
|
||||||
abbreviateNumber,
|
abbreviateNumber,
|
||||||
calculateChange,
|
|
||||||
} from "$lib/utils";
|
} from "$lib/utils";
|
||||||
//import { enhance } from '$app/forms';
|
//import { enhance } from '$app/forms';
|
||||||
import toast from "svelte-french-toast";
|
import toast from "svelte-french-toast";
|
||||||
@ -272,7 +271,7 @@
|
|||||||
/>
|
/>
|
||||||
|
|
||||||
<section
|
<section
|
||||||
class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-4 lg:px-3"
|
class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden min-h-screen pb-20 pt-5 px-3"
|
||||||
>
|
>
|
||||||
<div class="text-sm sm:text-[1rem] breadcrumbs">
|
<div class="text-sm sm:text-[1rem] breadcrumbs">
|
||||||
<ul>
|
<ul>
|
||||||
@ -295,16 +294,14 @@
|
|||||||
|
|
||||||
{#if data?.user}
|
{#if data?.user}
|
||||||
<div
|
<div
|
||||||
class="w-full {$screenWidth < 640
|
class="w-full grid grid-cols-2 gap-3 sm:gap-0 sm:flex sm:flex-row sm:items-center"
|
||||||
? 'grid grid-cols-2'
|
|
||||||
: ''} gap-x-3 gap-y-3 sm:gap-x-0 sm:gap-y-0 relative inline-block text-left w-full flex flex-col sm:flex-row items-center"
|
|
||||||
>
|
>
|
||||||
<div class="order-4 w-fit flex justify-end sm:ml-3">
|
<div class="order-4 w-fit flex justify-end sm:ml-3">
|
||||||
<div class="flex flex-row items-center justify-end">
|
<div class="flex flex-row items-center justify-end">
|
||||||
{#if editMode}
|
{#if editMode}
|
||||||
<label
|
<label
|
||||||
on:click={handleDeleteTickers}
|
on:click={handleDeleteTickers}
|
||||||
class="border text-sm border-gray-600 mr-2 sm:ml-3 sm:mr-0 cursor-pointer inline-flex items-center justify-center space-x-1 whitespace-nowrap rounded-md py-2.5 pl-3 pr-4 font-semibold text-white bg-default sm:hover:bg-default/60 ease-out sm:hover:text-red-500"
|
class="border text-sm border-gray-600 mr-2 sm:ml-3 sm:mr-0 cursor-pointer inline-flex items-center justify-center space-x-1 whitespace-nowrap rounded-md py-2 pl-3 pr-4 font-semibold text-white bg-default sm:hover:bg-default/60 ease-out sm:hover:text-red-500"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
class="inline-block w-5 h-5"
|
class="inline-block w-5 h-5"
|
||||||
@ -322,7 +319,7 @@
|
|||||||
{/if}
|
{/if}
|
||||||
<label
|
<label
|
||||||
on:click={handleEditMode}
|
on:click={handleEditMode}
|
||||||
class="border text-sm border-gray-600 sm:ml-3 cursor-pointer inline-flex items-center justify-center space-x-1 whitespace-nowrap rounded-md py-2.5 px-3 text-white bg-default sm:hover:bg-primary ease-out sm:hover:text-red-500"
|
class="border text-sm border-gray-600 cursor-pointer inline-flex items-center justify-center space-x-1 whitespace-nowrap rounded-md py-2 px-3 text-white bg-default sm:hover:bg-primary ease-out sm:hover:text-red-500"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
class="inline-block w-5 h-5"
|
class="inline-block w-5 h-5"
|
||||||
|
|||||||
@ -25,14 +25,8 @@
|
|||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- HEADER FOR BETTER SEO -->
|
|
||||||
<svelte:head>
|
|
||||||
<meta charset="utf-8" />
|
|
||||||
<meta name="viewport" content="width=device-width" />
|
|
||||||
</svelte:head>
|
|
||||||
|
|
||||||
<section
|
<section
|
||||||
class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden pb-20 pt-5 px-4 lg:px-3"
|
class="w-full max-w-3xl sm:max-w-[1400px] overflow-hidden pb-20 pt-5 px-3"
|
||||||
>
|
>
|
||||||
<div class="text-sm sm:text-[1rem] breadcrumbs">
|
<div class="text-sm sm:text-[1rem] breadcrumbs">
|
||||||
<ul>
|
<ul>
|
||||||
|
|||||||
@ -1095,16 +1095,14 @@
|
|||||||
My Watchlist
|
My Watchlist
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div
|
||||||
class="{$screenWidth < 640
|
class="grid grid-cols-2 gap-3 sm:gap-0 sm:flex sm:flex-row sm:items-center"
|
||||||
? 'grid grid-cols-2'
|
|
||||||
: ''} gap-x-3 gap-y-3 sm:gap-x-0 sm:gap-y-0 relative inline-block text-left w-full flex flex-col sm:flex-row items-center"
|
|
||||||
>
|
>
|
||||||
<div class="order-0 w-full sm:w-fit">
|
<div class="order-0 w-full sm:w-fit">
|
||||||
<DropdownMenu.Root>
|
<DropdownMenu.Root>
|
||||||
<DropdownMenu.Trigger asChild let:builder>
|
<DropdownMenu.Trigger asChild let:builder>
|
||||||
<Button
|
<Button
|
||||||
builders={[builder]}
|
builders={[builder]}
|
||||||
class="min-w-[110px] w-full sm:w-fit border-gray-600 border bg-default sm:hover:bg-primary ease-out flex flex-row justify-between items-center px-3 py-2.5 text-white rounded-md truncate"
|
class="min-w-[110px] w-full sm:w-fit border-gray-600 border bg-default sm:hover:bg-primary ease-out flex flex-row justify-between items-center px-3 py-2.5 text-white rounded truncate"
|
||||||
>
|
>
|
||||||
<span
|
<span
|
||||||
class="truncate font-semibold text-white text-sm sm:text-[1rem]"
|
class="truncate font-semibold text-white text-sm sm:text-[1rem]"
|
||||||
@ -1201,7 +1199,7 @@
|
|||||||
{#if editMode}
|
{#if editMode}
|
||||||
<label
|
<label
|
||||||
on:click={handleDeleteTickers}
|
on:click={handleDeleteTickers}
|
||||||
class="border text-sm border-gray-600 mr-2 sm:ml-3 sm:mr-0 cursor-pointer inline-flex items-center justify-center space-x-1 whitespace-nowrap rounded-md py-2.5 pl-3 pr-4 font-semibold text-white bg-default sm:hover:bg-default/60 ease-out sm:hover:text-red-500"
|
class="border text-sm border-gray-600 mr-2 sm:ml-3 sm:mr-0 cursor-pointer inline-flex items-center justify-center space-x-1 whitespace-nowrap rounded py-2 pl-3 pr-4 font-semibold text-white bg-default sm:hover:bg-default/60 ease-out sm:hover:text-red-500"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
class="inline-block w-5 h-5"
|
class="inline-block w-5 h-5"
|
||||||
@ -1219,7 +1217,7 @@
|
|||||||
{/if}
|
{/if}
|
||||||
<label
|
<label
|
||||||
on:click={handleEditMode}
|
on:click={handleEditMode}
|
||||||
class="border text-sm border-gray-600 sm:ml-3 cursor-pointer inline-flex items-center justify-center space-x-1 whitespace-nowrap rounded-md py-2.5 px-3 text-white bg-default sm:hover:bg-primary ease-out sm:hover:text-red-500"
|
class="border text-sm border-gray-600 sm:ml-3 cursor-pointer inline-flex items-center justify-center space-x-1 whitespace-nowrap rounded py-2 px-3 text-white bg-default sm:hover:bg-primary ease-out sm:hover:text-red-500"
|
||||||
>
|
>
|
||||||
<svg
|
<svg
|
||||||
class="inline-block w-5 h-5"
|
class="inline-block w-5 h-5"
|
||||||
@ -1245,6 +1243,7 @@
|
|||||||
</label>
|
</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="order-2 sm:order-1 w-full sm:w-fit {displayWatchList?.title ===
|
class="order-2 sm:order-1 w-full sm:w-fit {displayWatchList?.title ===
|
||||||
undefined
|
undefined
|
||||||
@ -1277,14 +1276,14 @@
|
|||||||
</div>
|
</div>
|
||||||
<Combobox.Input
|
<Combobox.Input
|
||||||
on:input={search}
|
on:input={search}
|
||||||
class="text-sm sm:text-[1rem] controls-input text-white bg-default focus:outline-hidden border border-gray-600 rounded-md placeholder:text-white/80 px-3 py-2 pl-8 xs:pl-10 grow w-full sm:min-w-56 max-w-xs"
|
class="text-sm sm:text-[1rem] controls-input text-white bg-default focus:outline-hidden border border-gray-600 rounded placeholder:text-white/80 px-3 py-2 pl-8 xs:pl-10 grow w-full sm:min-w-56 max-w-xs"
|
||||||
placeholder="Add new stock"
|
placeholder="Add new stock"
|
||||||
aria-label="Add new stock"
|
aria-label="Add new stock"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
{#if inputValue?.length !== 0}
|
{#if inputValue?.length !== 0}
|
||||||
<Combobox.Content
|
<Combobox.Content
|
||||||
class="w-auto z-10 rounded-md border border-gray-700 bg-default px-1 py-3 shadow-popover outline-hidden"
|
class="w-auto z-10 rounded border border-gray-700 bg-default px-1 py-3 shadow-popover outline-hidden"
|
||||||
sideOffset={8}
|
sideOffset={8}
|
||||||
>
|
>
|
||||||
{#each searchBarData as item}
|
{#each searchBarData as item}
|
||||||
@ -1323,7 +1322,7 @@
|
|||||||
<DropdownMenu.Trigger asChild let:builder>
|
<DropdownMenu.Trigger asChild let:builder>
|
||||||
<Button
|
<Button
|
||||||
builders={[builder]}
|
builders={[builder]}
|
||||||
class="sm:ml-auto min-w-[110px] w-full sm:w-fit border-gray-600 border bg-default sm:hover:bg-primary ease-out flex flex-row justify-between items-center px-3 py-2.5 text-white rounded-md truncate"
|
class="sm:ml-auto min-w-[110px] w-full sm:w-fit border-gray-600 border bg-default sm:hover:bg-primary ease-out flex flex-row justify-between items-center px-3 py-2.5 text-white rounded truncate"
|
||||||
>
|
>
|
||||||
<span class="truncate text-white text-sm sm:text-[1rem]"
|
<span class="truncate text-white text-sm sm:text-[1rem]"
|
||||||
>Indicators</span
|
>Indicators</span
|
||||||
@ -1538,7 +1537,7 @@
|
|||||||
|
|
||||||
<div class="w-full overflow-x-auto">
|
<div class="w-full overflow-x-auto">
|
||||||
<table
|
<table
|
||||||
class="table table-sm table-compact rounded-none sm:rounded-md w-full bg-table border border-gray-800 m-auto mt-4"
|
class="table table-sm table-compact rounded-none sm:rounded w-full bg-table border border-gray-800 m-auto mt-4"
|
||||||
>
|
>
|
||||||
<!-- head -->
|
<!-- head -->
|
||||||
<thead>
|
<thead>
|
||||||
@ -1674,10 +1673,10 @@
|
|||||||
|
|
||||||
<div class=" text-white">
|
<div class=" text-white">
|
||||||
<div
|
<div
|
||||||
class="inline-flex justify-center w-full rounded-md sm:w-auto mb-3"
|
class="inline-flex justify-center w-full rounded sm:w-auto mb-3"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
class="bg-secondary w-full min-w-24 sm:w-fit relative flex flex-wrap items-center justify-center rounded-md p-1 mt-4"
|
class="bg-secondary w-full min-w-24 sm:w-fit relative flex flex-wrap items-center justify-center rounded p-1 mt-4"
|
||||||
>
|
>
|
||||||
{#each tabs as item, i}
|
{#each tabs as item, i}
|
||||||
{#if data?.user?.tier !== "Pro" && i > 0}
|
{#if data?.user?.tier !== "Pro" && i > 0}
|
||||||
@ -1710,7 +1709,7 @@
|
|||||||
>
|
>
|
||||||
{#if activeIdx === i}
|
{#if activeIdx === i}
|
||||||
<div
|
<div
|
||||||
class="absolute inset-0 rounded-md bg-[#fff]"
|
class="absolute inset-0 rounded bg-[#fff]"
|
||||||
></div>
|
></div>
|
||||||
{/if}
|
{/if}
|
||||||
<span
|
<span
|
||||||
@ -1888,7 +1887,7 @@
|
|||||||
<div class="flex justify-center items-center h-80">
|
<div class="flex justify-center items-center h-80">
|
||||||
<div class="relative">
|
<div class="relative">
|
||||||
<label
|
<label
|
||||||
class="bg-secondary rounded-md h-14 w-14 flex justify-center items-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2"
|
class="bg-secondary rounded h-14 w-14 flex justify-center items-center absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2"
|
||||||
>
|
>
|
||||||
<span class="loading loading-spinner loading-md text-gray-400"
|
<span class="loading loading-spinner loading-md text-gray-400"
|
||||||
></span>
|
></span>
|
||||||
@ -1913,7 +1912,7 @@
|
|||||||
></label>
|
></label>
|
||||||
|
|
||||||
<!-- Desktop modal content -->
|
<!-- Desktop modal content -->
|
||||||
<div class="modal-box w-full bg-secondary">
|
<div class="modal-box w-full bg-secondary rounded">
|
||||||
<div class="text-white mb-5">
|
<div class="text-white mb-5">
|
||||||
<h3 class="font-bold text-2xl mb-5">New Watchlist</h3>
|
<h3 class="font-bold text-2xl mb-5">New Watchlist</h3>
|
||||||
|
|
||||||
@ -1931,7 +1930,7 @@
|
|||||||
|
|
||||||
<button
|
<button
|
||||||
type="submit"
|
type="submit"
|
||||||
class="mt-10 btn bg-[#fff] sm:hover:bg-gray-300 btn-md w-full rounded-md m-auto text-black font-semibold text-md"
|
class="cursor-pointer mt-2 py-2.5 bg-[#fff] sm:hover:bg-gray-300 btn-md w-full rounded m-auto text-black font-semibold text-md"
|
||||||
>
|
>
|
||||||
Create Watchlist
|
Create Watchlist
|
||||||
</button>
|
</button>
|
||||||
@ -1953,7 +1952,7 @@
|
|||||||
></label>
|
></label>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="modal-box w-full bg-primary border border-gray-600 overflow-hidden"
|
class="modal-box w-full bg-secondary border border-gray-600 overflow-hidden"
|
||||||
>
|
>
|
||||||
<h3
|
<h3
|
||||||
class="font-bold text-[1rem] text-center sm:text-lg flex justify-center items-center mt-10 text-white"
|
class="font-bold text-[1rem] text-center sm:text-lg flex justify-center items-center mt-10 text-white"
|
||||||
@ -1967,7 +1966,7 @@
|
|||||||
<label
|
<label
|
||||||
for="deleteWatchlist"
|
for="deleteWatchlist"
|
||||||
on:click={deleteWatchlist}
|
on:click={deleteWatchlist}
|
||||||
class="mt-5 btn bg-[#fff] sm:hover:bg-gray-300 btn-md w-full rounded-md m-auto text-black font-semibold text-md"
|
class="cursor-pointer mt-2 py-2.5 text-center bg-[#fff] sm:hover:bg-gray-300 btn-md w-full rounded m-auto text-black font-semibold text-md"
|
||||||
>
|
>
|
||||||
Proceed
|
Proceed
|
||||||
</label>
|
</label>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user