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

ui fix

Browse Source
This commit is contained in:
MuslemRahimi 2025-04-04 11:46:06 +02:00
parent bdc97d13f2
commit e374c8d778
3 changed files with 25 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/lib/utils.ts
View File

@ -1301,6 +1301,7 @@ export function getPartyForPoliticians(name) {
"John Delaney": "Democratic",
"Cleo Fields": "Democratic",
"James Banks": "Republican",
"April Delaney": "Democratic",
};
// Combine first and last name to form the key

18
src/routes/market-flow/+page.svelte
View File

@ -263,12 +263,17 @@
},
title: {
text: null,
text: `<h3 class="mt-3 -mb-2">S&P500 Flow</h3>`,
style: {
color: $mode === "light" ? "black" : "white",
// Using inline CSS for margin-top and margin-bottom
},
useHTML: true, // Enable HTML to apply custom class styling
},
legend: {
enabled: true,
align: "left", // Positions legend at the left edge
align: "center", // Positions legend at the left edge
verticalAlign: "top", // Positions legend at the top
layout: "horizontal", // Align items horizontally (use 'vertical' if preferred)
itemStyle: {
@ -297,10 +302,9 @@
// Format the x value to display time in a custom format
let tooltipContent = `<span class="m-auto text-[1rem] font-[501]">${new Date(
this?.x,
).toLocaleDateString("en-US", {
year: "numeric",
month: "short",
day: "numeric",
)?.toLocaleTimeString("en-US", {
hour: "2-digit",
minute: "2-digit",
})}</span><br>`;
// Loop through each point in the shared tooltip
@ -462,7 +466,7 @@
{#if config !== null}
<p class="mt-4">
Market Flow evaluates the balance between advancing and
declining stocks by analyzing SP& 500 price movements, net call
declining stocks by analyzing S&P500 price movements, net call
premiums and net put premiums, providing a real-time snapshot of
market sentiment and momentum. <a
href="/learning-center/article/market-sentiment-through-options-activity-riding-the-tide"

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

@ -233,9 +233,7 @@
?.slice(0, 50);
};
function getPlotOptions() {
isLoading = true;
function plotData() {
// Determine the base date (using the first data point, or fallback to today)
const baseDate =
marketTideData && marketTideData.length
@ -288,12 +286,17 @@
},
title: {
text: null,
text: `<h3 class="mt-3 -mb-2">${selectedSector} Flow</h3>`,
style: {
color: $mode === "light" ? "black" : "white",
// Using inline CSS for margin-top and margin-bottom
},
useHTML: true, // Enable HTML to apply custom class styling
},
legend: {
enabled: true,
align: "left", // Positions legend at the left edge
align: "center", // Positions legend at the left edge
verticalAlign: "top", // Positions legend at the top
layout: "horizontal", // Align items horizontally (use 'vertical' if preferred)
itemStyle: {
@ -322,10 +325,9 @@
// Format the x value to display time in a custom format
let tooltipContent = `<span class="m-auto text-[1rem] font-[501]">${new Date(
this?.x,
).toLocaleDateString("en-US", {
year: "numeric",
month: "short",
day: "numeric",
)?.toLocaleTimeString("en-US", {
hour: "2-digit",
minute: "2-digit",
})}</span><br>`;
// Loop through each point in the shared tooltip
@ -461,11 +463,10 @@
},
};
isLoading = false;
return options;
}
config = marketTideData ? getPlotOptions() : null;
config = marketTideData ? plotData() : null;
$: {
if (selectedSector || $mode) {
@ -481,7 +482,7 @@
originalNegTickers = topNegNetPremium;
displayNegTickers = topNegNetPremium;
config = marketTideData ? getPlotOptions() : null;
config = marketTideData ? plotData() : null;
}
}
</script>