97 lines
3.6 KiB
Svelte
97 lines
3.6 KiB
Svelte
<script lang="ts">
|
|
export let data;
|
|
export let title;
|
|
export let color = "#27272A";
|
|
</script>
|
|
|
|
{#if data?.user?.tier !== "Pro"}
|
|
<div class="px-0 flex justify-center items-center">
|
|
<div
|
|
class="rounded bg-[{color}] pl-10 pr-10 text-center pb-10 pt-5 w-full h-full m-auto -mt-5 relative"
|
|
>
|
|
<h3 class="text-white font-bold text-xl sm:text-2xl text-center">
|
|
Upgrade to Pro
|
|
</h3>
|
|
<div
|
|
class="text-white text-center text-sm sm:text-[1rem] pt-5 text-center"
|
|
>
|
|
{title}
|
|
</div>
|
|
|
|
<!--Start Market Cap Group-->
|
|
<h2 class="text-center text-lg text-white font-bold mb-3 mt-3">
|
|
and even more...
|
|
</h2>
|
|
|
|
<div class="pt-3 flex justify-center items-center m-auto">
|
|
<div class="grid grid-cols-1 sm:grid-cols-2 m-auto">
|
|
<!-- Column 1 -->
|
|
<div class="mb-4">
|
|
<ul
|
|
class="list-disc space-y-4 sm:space-y-1 m-auto text-center sm:text-start w-48 sm:w-full"
|
|
>
|
|
<li class="mb-2 cursor-pointer">
|
|
<a href="/list/mega-cap-stocks" class="text-white text-sm"
|
|
>Unlimited access to all data and tools</a
|
|
>
|
|
</li>
|
|
<li class="mb-2 cursor-pointer">
|
|
<a href="/list/large-cap-stocks" class="text-white text-sm"
|
|
>Unlimited Options Data</a
|
|
>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<!-- Column 2 -->
|
|
<div class="sm:ml-10">
|
|
<ul
|
|
class="list-disc space-y-1 text-center sm:text-start w-48 sm:w-full"
|
|
>
|
|
<li class="mb-2 cursor-pointer">
|
|
<a href="/list/small-cap-stocks" class="text-white text-sm"
|
|
>Unlimited Wall Street Analysts Ratings</a
|
|
>
|
|
</li>
|
|
<li class="mb-2 cursor-pointer">
|
|
<a href="/list/nano-cap-stocks" class="text-white text-sm"
|
|
>Unlimited Price Alerts</a
|
|
>
|
|
</li>
|
|
<!-- ...other list items -->
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!--End Market Cap Group-->
|
|
|
|
<a
|
|
href="/pricing"
|
|
class="mt-10 flex justify-center items-center w-56 m-auto btn text-white bg-purple-600 hover:bg-purple-500 transition duration-150 ease-in-out group"
|
|
>
|
|
Become a Pro
|
|
<span
|
|
class="tracking-normal group-hover:translate-x-0.5 transition-transform duration-150 ease-in-out"
|
|
>
|
|
<svg
|
|
class="w-4 h-4"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 24 24"
|
|
><g transform="rotate(90 12 12)"
|
|
><g fill="none"
|
|
><path
|
|
d="M24 0v24H0V0h24ZM12.593 23.258l-.011.002l-.071.035l-.02.004l-.014-.004l-.071-.035c-.01-.004-.019-.001-.024.005l-.004.01l-.017.428l.005.02l.01.013l.104.074l.015.004l.012-.004l.104-.074l.012-.016l.004-.017l-.017-.427c-.002-.01-.009-.017-.017-.018Zm.265-.113l-.013.002l-.185.093l-.01.01l-.003.011l.018.43l.005.012l.008.007l.201.093c.012.004.023 0 .029-.008l.004-.014l-.034-.614c-.003-.012-.01-.02-.02-.022Zm-.715.002a.023.023 0 0 0-.027.006l-.006.014l-.034.614c0 .012.007.02.017.024l.015-.002l.201-.093l.01-.008l.004-.011l.017-.43l-.003-.012l-.01-.01l-.184-.092Z"
|
|
/><path
|
|
fill="white"
|
|
d="M13.06 3.283a1.5 1.5 0 0 0-2.12 0L5.281 8.939a1.5 1.5 0 0 0 2.122 2.122L10.5 7.965V19.5a1.5 1.5 0 0 0 3 0V7.965l3.096 3.096a1.5 1.5 0 1 0 2.122-2.122L13.06 3.283Z"
|
|
/></g
|
|
></g
|
|
></svg
|
|
>
|
|
</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
{/if}
|