blob: e3accc5eb288dacce733c7b7caad8794517c0fd0 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
"""Market bar — displays major indices at the top of the app."""
import streamlit as st
from services.data_service import get_market_indices
def _delta_class(change_pct: float | None) -> str:
if change_pct is None:
return "neutral"
return "positive" if change_pct >= 0 else "negative"
def _delta_text(change_pct: float | None) -> str:
if change_pct is None:
return "—"
arrow = "▲" if change_pct >= 0 else "▼"
return f"{arrow} {change_pct * 100:+.2f}%"
def render_market_bar():
indices = get_market_indices()
st.markdown(
"""
<style>
.prism-market-card {
background: #11151C;
border: 1px solid #232934;
border-radius: 2px;
padding: 12px 16px;
}
.prism-market-label {
font-family: 'IBM Plex Sans', sans-serif;
font-size: 10px;
font-weight: 600;
letter-spacing: 0.14em;
text-transform: uppercase;
color: #5E5849;
margin-bottom: 6px;
}
.prism-market-value {
font-family: 'IBM Plex Mono', monospace;
font-variant-numeric: tabular-nums;
font-size: 1.25rem;
font-weight: 500;
color: #F2ECDC;
line-height: 1.1;
margin-bottom: 4px;
}
.prism-market-delta {
font-family: 'IBM Plex Mono', monospace;
font-variant-numeric: tabular-nums;
font-size: 11px;
font-weight: 500;
}
.prism-market-delta.positive { color: #4F8C5E; }
.prism-market-delta.negative { color: #B5494B; }
.prism-market-delta.neutral { color: #5E5849; }
</style>
""",
unsafe_allow_html=True,
)
cols = st.columns(len(indices))
for col, (name, data) in zip(cols, indices.items()):
price = data.get("price")
change_pct = data.get("change_pct")
value = f"{price:,.2f}" if price is not None else "—"
delta_class = _delta_class(change_pct)
delta_text = _delta_text(change_pct)
col.markdown(
f"""
<div class="prism-market-card">
<div class="prism-market-label">{name}</div>
<div class="prism-market-value">{value}</div>
<span class="prism-market-delta {delta_class}">{delta_text}</span>
</div>
""",
unsafe_allow_html=True,
)
|
