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 2025-03-08 01:23:27 +01:00
parent cef80a527f
commit 697b33a110
2 changed files with 33 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
src/lib/components/Sidecard.svelte
View File

@ -15,9 +15,11 @@
let website = "n/a"; let website = "n/a";
let snippet; let snippet;
let strongBuyCount = 0;
let buyCount = 0; let buyCount = 0;
let holdCount = 0; let holdCount = 0;
let sellCount = 0; let sellCount = 0;
let strongSellCount = 0;
let priceTarget = "n/a"; let priceTarget = "n/a";
let numOfAnalyst = 0; let numOfAnalyst = 0;
let consensusRating = "n/a"; let consensusRating = "n/a";
@ -39,11 +41,23 @@
function plotData() { function plotData() {
// X-axis categories // X-axis categories
const categories = ["Sell", "Hold", "Buy"]; const categories = [
"Strong<br>Sell",
"Sell",
"Hold",
"Buy",
"Strong<br>Buy",
];
// Corresponding data // Corresponding data
const dataValues = [sellCount, holdCount, buyCount]; const dataValues = [
const colors = ["#FF4C4C", "#F5B700", "#008A00"]; strongSellCount,
sellCount,
holdCount,
buyCount,
strongBuyCount,
];
const colors = ["#FF4C4C", "#FF4C4C", "#F5B700", "#008A00", "#008A00"];
const options = { const options = {
chart: { chart: {
@ -54,7 +68,8 @@
animation: false, animation: false,
}, },
title: { title: {
text: `<div class="text-gray-200 mt-3 mb-2 text-center font-normal text-2xl">Price Target: <span class="${changesPercentage >= 0 ? "text-[#00FC50]" : "text-[#FF2F1F]"}">$${priceTarget}</span></div> text: `<div class="text-gray-200 mt-3 text-center font-normal text-2xl">Price Target: <span class="${changesPercentage >= 0 ? "text-[#00FC50]" : "text-[#FF2F1F]"}">$${priceTarget}</span></div>
<div class="text-gray-200 mb-2 text-center font-normal text-xl">(${changesPercentage}% ${changesPercentage >= 0 ? "upside" : "downside"})</div>
<div class="text-gray-200 text-center font-normal text-xl flex justify-center items-center">Analyst Consensus: <span class="ml-1 ${consensusRating === "Buy" ? "text-[#00FC50]" : consensusRating === "Sell" ? "text-[#FF2F1F]" : consensusRating === "Hold" ? "text-[#D5AB31]" : "text-white"}">${consensusRating ?? "n/a"}</span></div>`, <div class="text-gray-200 text-center font-normal text-xl flex justify-center items-center">Analyst Consensus: <span class="ml-1 ${consensusRating === "Buy" ? "text-[#00FC50]" : consensusRating === "Sell" ? "text-[#FF2F1F]" : consensusRating === "Hold" ? "text-[#D5AB31]" : "text-white"}">${consensusRating ?? "n/a"}</span></div>`,
style: { style: {
color: "white", color: "white",
@ -67,7 +82,8 @@
categories: categories, categories: categories,
gridLineWidth: 0, gridLineWidth: 0,
labels: { labels: {
style: { color: "white" }, rotation: 0,
style: { color: "white", fontSize: "12.5px" },
}, },
}, },
yAxis: { yAxis: {
@ -100,7 +116,7 @@
let tooltipContent = ""; let tooltipContent = "";
this.points.forEach((point) => { this.points.forEach((point) => {
tooltipContent += ` tooltipContent += `
<span class="text-white font-semibold text-sm">${point.key}:</span> <span class="text-white font-semibold text-sm">${point.key?.replace("<br>", " ")}:</span>
<span class="text-white font-normal text-sm" >${point.y}</span><br> <span class="text-white font-normal text-sm" >${point.y}</span><br>
`; `;
}); });
@ -157,9 +173,12 @@
snippet = description?.slice(0, 450) + "..."; snippet = description?.slice(0, 450) + "...";
numOfAnalyst = data?.getAnalystSummary?.numOfAnalyst; numOfAnalyst = data?.getAnalystSummary?.numOfAnalyst;
buyCount = data?.getAnalystSummary?.Buy; strongBuyCount = data?.getAnalystSummary?.strongBuy || 0;
holdCount = data?.getAnalystSummary?.Hold; buyCount = data?.getAnalystSummary?.buy || 0;
sellCount = data?.getAnalystSummary?.Sell; holdCount = data?.getAnalystSummary?.hold || 0;
sellCount = data?.getAnalystSummary?.sell || 0;
strongSellCount = data?.getAnalystSummary?.strongSell || 0;
priceTarget = priceTarget =
data?.getAnalystSummary?.medianPriceTarget !== ("n/a" && 0) data?.getAnalystSummary?.medianPriceTarget !== ("n/a" && 0)
? data?.getAnalystSummary?.medianPriceTarget ? data?.getAnalystSummary?.medianPriceTarget
@ -276,7 +295,7 @@
</p> </p>
<div <div
class="mt-5 border border-gray-700 rounded" class="mt-3 border border-gray-700 rounded"
use:highcharts={configAnalyst} use:highcharts={configAnalyst}
></div> ></div>

6
src/routes/potus-tracker/+page.svelte
View File

@ -158,8 +158,8 @@
enabled: true, enabled: true,
color: "white", color: "white",
style: { style: {
fontSize: "13px", fontSize: "14px",
fontWeight: "bold", fontWeight: "normal",
}, },
formatter: function () { formatter: function () {
return this.y.toFixed(2) + "%"; // Add percentage symbol return this.y.toFixed(2) + "%"; // Add percentage symbol
@ -178,11 +178,13 @@
{ {
value: 0, // Values below 0 value: 0, // Values below 0
color: "#E02424", // Red color: "#E02424", // Red
borderRadius: "0px",
borderColor: "#E02424", // Red border borderColor: "#E02424", // Red border
}, },
{ {
color: "#10B981", // Green for values 0 and above color: "#10B981", // Green for values 0 and above
borderColor: "#10B981", // Green border borderColor: "#10B981", // Green border
borderRadius: "0px",
}, },
], ],
}, },