Jaspers Hub

jaspers / earningscall

pluginOfficialReviewed★ 0↓ 6

EarningsCall Transcripts & Calendar: Shows a company's earnings call transcripts and the daily earnings calendar from EarningsCall.biz in a single panel view.

3.7 KB
1/* The earnings calls view's CSS. A plugin view is an iframe of its own, so there is no Tailwind
2 here: plain classes, the house style by hand. Colours are the app's theme variables, so the view
3 follows its light and dark, each with its light value as the fallback for an app from before the
4 theme. Square everything, one grey line, muted secondary text, 13px. The only colour is find's
5 highlight, the plugin's own, with its dark values at the end. */
6
7.ec-root {
8 display: flex;
9 flex-direction: column;
10 height: 100%;
11 width: 100%;
12 background: var(--jaspers-background, #fff);
13 color: var(--jaspers-foreground, #171717);
14 font: 13px/1.45 var(--jaspers-font-sans, system-ui, -apple-system, sans-serif);
15}
16
17.ec-bar,
18.ec-subbar {
19 flex: 0 0 auto;
20 display: flex;
21 align-items: center;
22 gap: 8px;
23 padding: 6px 8px;
24 border-bottom: 1px solid var(--jaspers-border, #e5e5e5);
25 min-width: 0;
26}
27
28.ec-subbar {
29 padding: 4px 8px;
30}
31
32.ec-grow {
33 flex: 1 1 auto;
34 min-width: 0;
35}
36
37.ec-ellipsis {
38 overflow: hidden;
39 text-overflow: ellipsis;
40 white-space: nowrap;
41}
42
43.ec-title {
44 font-weight: 600;
45 white-space: nowrap;
46}
47
48.ec-muted {
49 color: var(--jaspers-muted-foreground, #737373);
50}
51
52.ec-input,
53.ec-select,
54.ec-button {
55 border: 1px solid var(--jaspers-border, #e5e5e5);
56 border-radius: 0;
57 background: var(--jaspers-background, #fff);
58 color: var(--jaspers-foreground, #171717);
59 font: inherit;
60 padding: 2px 6px;
61 outline: none;
62}
63
64.ec-input:focus,
65.ec-select:focus,
66.ec-button:focus-visible {
67 border-color: var(--jaspers-foreground, #171717);
68}
69
70.ec-button {
71 cursor: pointer;
72 white-space: nowrap;
73}
74
75.ec-button:hover {
76 background: var(--jaspers-muted, #f5f5f5);
77}
78
79.ec-input-ticker {
80 width: 72px;
81 text-transform: uppercase;
82}
83
84.ec-select {
85 max-width: 220px;
86}
87
88.ec-find {
89 display: inline-flex;
90 align-items: center;
91 gap: 4px;
92}
93
94.ec-input-find {
95 width: 140px;
96}
97
98.ec-count {
99 white-space: nowrap;
100 font-variant-numeric: tabular-nums;
101}
102
103.ec-body {
104 flex: 1 1 auto;
105 overflow: auto;
106 padding: 0 8px 8px;
107}
108
109.ec-note {
110 color: var(--jaspers-muted-foreground, #737373);
111 margin: 8px 0;
112}
113
114.ec-error {
115 color: var(--jaspers-destructive, #dc2626);
116 white-space: pre-wrap;
117 margin: 8px 0;
118}
119
120/* The calendar. */
121
122.ec-table {
123 border-collapse: collapse;
124 width: 100%;
125 margin: 4px 0;
126}
127
128.ec-table th,
129.ec-table td {
130 border-bottom: 1px solid var(--jaspers-border, #e5e5e5);
131 padding: 3px 6px;
132 text-align: left;
133 white-space: nowrap;
134}
135
136.ec-table th {
137 font-weight: 500;
138 color: var(--jaspers-muted-foreground, #737373);
139}
140
141.ec-table .ec-company {
142 white-space: normal;
143}
144
145.ec-row {
146 cursor: pointer;
147}
148
149.ec-row:hover td {
150 background: var(--jaspers-muted, #f5f5f5);
151}
152
153.ec-num {
154 font-variant-numeric: tabular-nums;
155}
156
157/* The transcript. */
158
159.ec-transcript {
160 max-width: 80ch;
161}
162
163.ec-p {
164 position: relative;
165 margin: 0;
166 padding: 6px 0 6px 36px;
167 line-height: 1.6;
168}
169
170.ec-n {
171 position: absolute;
172 left: 0;
173 width: 28px;
174 text-align: right;
175 color: var(--jaspers-muted-foreground, #a3a3a3);
176 font-size: 11px;
177 line-height: 20.8px;
178 font-variant-numeric: tabular-nums;
179 user-select: none;
180}
181
182.ec-divider {
183 margin: 12px 0 4px;
184 padding-top: 8px;
185 border-top: 1px solid var(--jaspers-border, #e5e5e5);
186 color: var(--jaspers-muted-foreground, #737373);
187 font-size: 11px;
188 font-weight: 600;
189 letter-spacing: 0.04em;
190 text-transform: uppercase;
191}
192
193.ec-p mark {
194 background: #fef3c7;
195 color: inherit;
196}
197
198.ec-p mark.ec-current {
199 background: #fcd34d;
200}
201
202/* Dark, for the one colour the theme does not have: find's highlight, a deep amber and a stronger
203 one for the current match, both dark enough that the text, still the foreground, reads on them. */
204
205@media (prefers-color-scheme: dark) {
206 .ec-p mark {
207 background: #422006;
208 }
209
210 .ec-p mark.ec-current {
211 background: #854d0e;
212 }
213}