bugfixing: add plot toggle back to mobile
This commit is contained in:
parent
5d1da5cf96
commit
b04645ec9d
@ -460,10 +460,10 @@ $: {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flex flex-row items-center w-full justify-end sm:justify-center">
|
<div class="mb-2 flex flex-row items-center w-full justify-end sm:justify-center">
|
||||||
|
|
||||||
|
|
||||||
<label class="hidden sm:inline-flex mt-2 sm:mt-0 cursor-pointer relative mr-auto">
|
<label class="inline-flex mt-2 sm:mt-0 cursor-pointer relative mr-auto">
|
||||||
<input on:click={toggleMode} type="checkbox" checked={mode} value={mode} class="sr-only peer">
|
<input on:click={toggleMode} type="checkbox" checked={mode} value={mode} class="sr-only peer">
|
||||||
<div class="w-11 h-6 bg-gray-400 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-[#1563F9]"></div>
|
<div class="w-11 h-6 bg-gray-400 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-[#1563F9]"></div>
|
||||||
{#if mode}
|
{#if mode}
|
||||||
@ -486,6 +486,7 @@ $: {
|
|||||||
</label>
|
</label>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<label for="exportDataModal" class="ml-3 mr-2 sm:mr-0 cursor-pointer bg-[#202020] sm:hover:bg-[#313131] duration-100 transition ease-in-out px-4 py-1.5 rounded-lg shadow-md">
|
<label for="exportDataModal" class="ml-3 mr-2 sm:mr-0 cursor-pointer bg-[#202020] sm:hover:bg-[#313131] duration-100 transition ease-in-out px-4 py-1.5 rounded-lg shadow-md">
|
||||||
<div class="flex flex-row items-center">
|
<div class="flex flex-row items-center">
|
||||||
<span class="m-auto mr-0.5 text-white text-sm">Export</span>
|
<span class="m-auto mr-0.5 text-white text-sm">Export</span>
|
||||||
@ -495,7 +496,6 @@ $: {
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<ul class="text-[0.8rem] font-medium text-center w-56 pt-3 sm:w-56 mb-5 flex justify-center sm:justify-end items-center ml-auto">
|
<ul class="text-[0.8rem] font-medium text-center w-56 pt-3 sm:w-56 mb-5 flex justify-center sm:justify-end items-center ml-auto">
|
||||||
<li class="w-full">
|
<li class="w-full">
|
||||||
<label on:click={() => filterRule = 'annual'} class="cursor-pointer rounded-l-lg inline-block w-full py-2.5 text-white {filterRule === 'annual' ? 'bg-[#3C74D4]' : 'bg-[#2A303C]'} font-semibold border-r border-gray-600" aria-current="page">
|
<label on:click={() => filterRule = 'annual'} class="cursor-pointer rounded-l-lg inline-block w-full py-2.5 text-white {filterRule === 'annual' ? 'bg-[#3C74D4]' : 'bg-[#2A303C]'} font-semibold border-r border-gray-600" aria-current="page">
|
||||||
@ -517,7 +517,6 @@ $: {
|
|||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
|
||||||
{#if mode}
|
{#if mode}
|
||||||
<div class="w-full max-w-3xl">
|
<div class="w-full max-w-3xl">
|
||||||
<div class="relative">
|
<div class="relative">
|
||||||
|
|||||||
@ -423,10 +423,11 @@ $: {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flex flex-row items-center w-full justify-end sm:justify-center">
|
|
||||||
|
<div class="mb-2 flex flex-row items-center w-full justify-end sm:justify-center">
|
||||||
|
|
||||||
|
|
||||||
<label class="hidden sm:inline-flex mt-2 sm:mt-0 cursor-pointer relative mr-auto">
|
<label class="inline-flex mt-2 sm:mt-0 cursor-pointer relative mr-auto">
|
||||||
<input on:click={toggleMode} type="checkbox" checked={mode} value={mode} class="sr-only peer">
|
<input on:click={toggleMode} type="checkbox" checked={mode} value={mode} class="sr-only peer">
|
||||||
<div class="w-11 h-6 bg-gray-400 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-[#1563F9]"></div>
|
<div class="w-11 h-6 bg-gray-400 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-[#1563F9]"></div>
|
||||||
{#if mode}
|
{#if mode}
|
||||||
|
|||||||
@ -396,10 +396,11 @@ $: {
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
<div class="flex flex-row items-center w-full justify-end sm:justify-center">
|
|
||||||
|
<div class="mb-2 flex flex-row items-center w-full justify-end sm:justify-center">
|
||||||
|
|
||||||
|
|
||||||
<label class="hidden sm:inline-flex mt-2 sm:mt-0 cursor-pointer relative mr-auto">
|
<label class="inline-flex mt-2 sm:mt-0 cursor-pointer relative mr-auto">
|
||||||
<input on:click={toggleMode} type="checkbox" checked={mode} value={mode} class="sr-only peer">
|
<input on:click={toggleMode} type="checkbox" checked={mode} value={mode} class="sr-only peer">
|
||||||
<div class="w-11 h-6 bg-gray-400 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-[#1563F9]"></div>
|
<div class="w-11 h-6 bg-gray-400 rounded-full peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all peer-checked:bg-[#1563F9]"></div>
|
||||||
{#if mode}
|
{#if mode}
|
||||||
@ -430,10 +431,8 @@ $: {
|
|||||||
</div>
|
</div>
|
||||||
</label>
|
</label>
|
||||||
|
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
<ul class="text-[0.8rem] font-medium text-center w-56 pt-3 sm:w-56 mb-5 flex justify-center sm:justify-end items-center ml-auto">
|
<ul class="text-[0.8rem] font-medium text-center w-56 pt-3 sm:w-56 mb-5 flex justify-center sm:justify-end items-center ml-auto">
|
||||||
<li class="w-full">
|
<li class="w-full">
|
||||||
<label on:click={() => filterRule = 'annual'} class="cursor-pointer rounded-l-lg inline-block w-full py-2.5 text-white {filterRule === 'annual' ? 'bg-[#3C74D4]' : 'bg-[#2A303C]'} font-semibold border-r border-gray-600" aria-current="page">
|
<label on:click={() => filterRule = 'annual'} class="cursor-pointer rounded-l-lg inline-block w-full py-2.5 text-white {filterRule === 'annual' ? 'bg-[#3C74D4]' : 'bg-[#2A303C]'} font-semibold border-r border-gray-600" aria-current="page">
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user