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

ui fixes

Browse Source
This commit is contained in:
MuslemRahimi 2024-12-27 15:52:47 +01:00
parent 2b59440abe
commit a0bfbb8fbd
4 changed files with 54 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
src/lib/components/IndustryTable.svelte
View File

@ -89,7 +89,9 @@
</script>
<div class="w-full overflow-x-scroll">
<table class="table rounded-none sm:rounded-md w-full m-auto mt-4">
<table
class="table rounded-none sm:rounded-md w-full m-auto bg-table border border-gray-800 mt-4"
>
<thead>
<TableHeader {columns} {sortOrders} {sortData} />
</thead>
@ -97,11 +99,9 @@
{#each displayList as item}
<!-- row -->
<tr
class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b-[#09090B]"
class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800"
>
<td
class="font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
>
<td class="font-medium text-sm sm:text-[1rem] whitespace-nowrap">
<a
href={`/list/industry/${item?.industry?.replace(/ /g, "-")?.replace(/&/g, "and")?.replace(/-{2,}/g, "-")?.toLowerCase()}`}
class="sm:hover:underline sm:hover:underline-offset-4 text-white"
@ -113,25 +113,25 @@
</td>
<td
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.numStocks}
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{abbreviateNumber(item?.totalMarketCap) ?? "-"}
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgDividendYield?.toFixed(2) ?? "-"}%
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.pe?.toFixed(2) ?? "-"}
</td>
@ -139,7 +139,7 @@
<td
class="{item?.profitMargin >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} font-medium text-sm sm:text-[1rem] whitespace-nowrap text-end border-b-[#09090B]"
: 'text-[#FF2F1F]'} font-medium text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
{abbreviateNumber(item?.profitMargin)}%
</td>
@ -147,7 +147,7 @@
<td
class="{item?.avgChange1M >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgChange1M?.toFixed(2) ?? "-"}%
</td>
@ -155,7 +155,7 @@
<td
class="{item?.avgChange1Y >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgChange1Y?.toFixed(2) ?? "-"}%
</td>

24
src/routes/industry/all/+page.svelte
View File

@ -96,7 +96,9 @@
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
<!-- Content area -->
<div class="w-full overflow-x-scroll">
<table class="table rounded-none sm:rounded-md w-full m-auto mt-4">
<table
class="table rounded-none sm:rounded-md w-full m-auto bg-table border border-gray-800 mt-4"
>
<thead>
<TableHeader {columns} {sortOrders} {sortData} />
</thead>
@ -104,11 +106,9 @@
{#each displayList as item}
<!-- row -->
<tr
class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b-[#09090B]"
class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800"
>
<td
class="font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
>
<td class="font-medium text-sm sm:text-[1rem] whitespace-nowrap">
<a
href={`/list/industry/${item?.industry?.replace(/ /g, "-")?.replace(/&/g, "and")?.replace(/-{2,}/g, "-")?.toLowerCase()}`}
class="sm:hover:underline sm:hover:underline-offset-4 text-white"
@ -120,25 +120,25 @@
</td>
<td
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.numStocks}
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{abbreviateNumber(item?.totalMarketCap) ?? "-"}
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgDividendYield?.toFixed(2) ?? "-"}%
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.pe?.toFixed(2) ?? "-"}
</td>
@ -146,7 +146,7 @@
<td
class=" {item?.profitMargin >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} font-medium text-sm sm:text-[1rem] whitespace-nowrap text-end border-b-[#09090B]"
: 'text-[#FF2F1F]'} font-medium text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
{abbreviateNumber(item?.profitMargin)}%
</td>
@ -154,7 +154,7 @@
<td
class="{item?.avgChange1M >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgChange1M?.toFixed(2) ?? "-"}%
</td>
@ -162,7 +162,7 @@
<td
class="{item?.avgChange1Y >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgChange1Y?.toFixed(2) ?? "-"}%
</td>

24
src/routes/industry/sectors/+page.svelte
View File

@ -95,7 +95,9 @@
<div class="flex justify-center w-full m-auto h-full overflow-hidden">
<!-- Content area -->
<div class="w-full overflow-x-scroll">
<table class="table rounded-none sm:rounded-md w-full m-auto mt-4">
<table
class="table rounded-none sm:rounded-md w-full m-auto bg-table border border-gray-800 mt-4"
>
<thead>
<TableHeader {columns} {sortOrders} {sortData} />
</thead>
@ -103,11 +105,9 @@
{#each displayList as item}
<!-- row -->
<tr
class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b-[#09090B]"
class="sm:hover:bg-[#245073] sm:hover:bg-opacity-[0.2] odd:bg-odd border-b border-gray-800"
>
<td
class="font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
>
<td class="font-medium text-sm sm:text-[1rem] whitespace-nowrap">
<a
href={sectorNavigation?.find(
(listItem) => listItem?.title === item?.sector,
@ -121,25 +121,25 @@
</td>
<td
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.numStocks}
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{abbreviateNumber(item?.totalMarketCap) ?? "-"}
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgDividendYield?.toFixed(2) ?? "-"}%
</td>
<td
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
class="text-white text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.pe?.toFixed(2) ?? "-"}
</td>
@ -147,7 +147,7 @@
<td
class=" {item?.profitMargin >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} font-medium text-sm sm:text-[1rem] whitespace-nowrap text-end border-b-[#09090B]"
: 'text-[#FF2F1F]'} font-medium text-sm sm:text-[1rem] whitespace-nowrap text-end"
>
{abbreviateNumber(item?.profitMargin)}%
</td>
@ -155,7 +155,7 @@
<td
class="{item?.avgChange1M >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgChange1M?.toFixed(2) ?? "-"}%
</td>
@ -163,7 +163,7 @@
<td
class="{item?.avgChange1Y >= 0
? "before:content-['+'] text-[#00FC50]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap border-b-[#09090B]"
: 'text-[#FF2F1F]'} text-end font-medium text-sm sm:text-[1rem] whitespace-nowrap"
>
{item?.avgChange1Y?.toFixed(2) ?? "-"}%
</td>

29
src/routes/sector-flow/+page.svelte
View File

@ -1,10 +1,9 @@
<script lang="ts">
import { numberOfUnreadNotification } from "$lib/store";
import { onMount } from "svelte";
import HoverStockChart from "$lib/components/HoverStockChart.svelte";
import TableHeader from "$lib/components/Table/TableHeader.svelte";
import UpgradeToPro from "$lib/components/UpgradeToPro.svelte";
import { abbreviateNumberWithColor } from "$lib/utils";
import { abbreviateNumberWithColor, sectorNavigation } from "$lib/utils";
import * as HoverCard from "$lib/components/shadcn/hover-card/index.js";
export let data;
@ -112,19 +111,21 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>
{$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ""} Jim
Carmer Tracker · Stocknear
{$numberOfUnreadNotification > 0 ? `(${$numberOfUnreadNotification})` : ""} Live
Sector Flow · Stocknear
</title>
<meta
name="description"
content={`Track the stock recommendations and performance of CNBC's Jim Cramer`}
content={`Track and compare historical and current options activity
performances of sectors`}
/>
<!-- Other meta tags -->
<meta property="og:title" content={`Jim Carmer Tracker · Stocknear`} />
<meta
property="og:description"
content={`Track the stock recommendations and performance of CNBC's Jim Cramer`}
content={`Track and compare historical and current options activity
performances of sectors`}
/>
<meta property="og:type" content="website" />
<!-- Add more Open Graph meta tags as needed -->
@ -134,7 +135,8 @@
<meta name="twitter:title" content={`Jim Carmer Tracker · Stocknear`} />
<meta
name="twitter:description"
content={`Track the stock recommendations and performance of CNBC's Jim Cramer`}
content={`Track and compare historical and current options activity
performances of sectors`}
/>
<!-- Add more Twitter meta tags as needed -->
</svelte:head>
@ -196,9 +198,14 @@
<td
class="text-start text-sm sm:text-[1rem] whitespace-nowrap text-white"
>
{item?.name?.length > charNumber
? item?.name?.slice(0, charNumber) + "..."
: item?.name}
<a
href={sectorNavigation?.find(
(listItem) => listItem?.title === item?.name,
)?.link}
class="sm:hover:underline sm:hover:underline-offset-4 text-white"
>
{item?.name}
</a>
</td>
<td
@ -270,7 +277,7 @@
<!-- Neutral -->
<div
class="bg-gray-100 h-full"
class="bg-gray-300 h-full"
style="width: calc(({item
?.premium_ratio[1]} / ({item
?.premium_ratio[0]} + {item