Skip to content

Commit b07502f

Browse files
Bulletdevclaude
Bulletdev
and
claude
committed
feat: increase global font size and fix season logos
- html font-size: 112% (scales all rem-based Tailwind classes) - Retro CSS components: bumped font sizes ~15-20% across all classes - _match_card: larger scores (34px), team names (14px), meta text (12px) - seasons/index: use Kings_Lendas_logo.webp + roman numeral badge for S1/S2/S3 Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
1 parent a26a111 commit b07502f

3 files changed

Lines changed: 47 additions & 44 deletions

File tree

‎app/assets/tailwind/application.css‎

Lines changed: 12 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
BASE — body overlay, headings, scrollbar (= prostaff)
3636
============================================================ */
3737
@layer base {
38-
html { overflow-x: hidden; width: 100%; scroll-behavior: smooth; }
38+
html { overflow-x: hidden; width: 100%; scroll-behavior: smooth; font-size: 112%; }
3939

4040
body {
4141
font-family: var(--font-inter);
@@ -223,7 +223,7 @@
223223
}
224224

225225
.retro-panel-footer-label {
226-
font-size: 9px;
226+
font-size: 11px;
227227
color: var(--retro-gold-dim);
228228
letter-spacing: 0.15em;
229229
text-transform: uppercase;
@@ -298,7 +298,7 @@
298298
flex-shrink: 0;
299299
}
300300
.retro-sep-label {
301-
font-size: 10px;
301+
font-size: 12px;
302302
color: var(--retro-gold-dim);
303303
letter-spacing: 0.2em;
304304
text-transform: uppercase;
@@ -307,7 +307,7 @@
307307

308308
/* ── RetroBadge — rótulo de categoria ── */
309309
.retro-badge {
310-
font-size: 10px;
310+
font-size: 12px;
311311
color: var(--retro-teal);
312312
letter-spacing: 0.15em;
313313
text-transform: uppercase;
@@ -317,7 +317,7 @@
317317

318318
/* ── Título retro dourado ── */
319319
.retro-title {
320-
font-size: 15px;
320+
font-size: 17px;
321321
font-weight: bold;
322322
color: var(--retro-gold);
323323
letter-spacing: 0.04em;
@@ -327,7 +327,7 @@
327327
}
328328

329329
.retro-title-lg {
330-
font-size: 22px;
330+
font-size: 26px;
331331
font-weight: bold;
332332
color: var(--retro-gold);
333333
letter-spacing: 0.04em;
@@ -349,30 +349,30 @@
349349
background: linear-gradient(to right, var(--retro-gold), transparent);
350350
}
351351
.retro-stat-label {
352-
font-size: 9px;
352+
font-size: 11px;
353353
color: var(--retro-gold-dim);
354354
letter-spacing: 0.18em;
355355
text-transform: uppercase;
356356
font-family: var(--retro-font);
357357
margin-bottom: 4px;
358358
}
359359
.retro-stat-value {
360-
font-size: 26px;
360+
font-size: 30px;
361361
font-weight: bold;
362362
color: var(--retro-gold);
363363
line-height: 1;
364364
font-family: var(--retro-font);
365365
}
366366
.retro-stat-sub {
367-
font-size: 11px;
367+
font-size: 13px;
368368
color: rgba(255,255,255,0.4);
369369
margin-top: 5px;
370370
font-family: var(--retro-font);
371371
}
372372

373373
/* ── Table rows retro ── */
374374
.retro-table-head {
375-
font-size: 10px;
375+
font-size: 12px;
376376
color: var(--retro-gold-dim);
377377
letter-spacing: 0.12em;
378378
text-transform: uppercase;
@@ -391,7 +391,7 @@
391391

392392
/* ── Section label com // prefix ── */
393393
.retro-section-label {
394-
font-size: 10px;
394+
font-size: 12px;
395395
color: var(--retro-gold-dim);
396396
letter-spacing: 0.2em;
397397
text-transform: uppercase;
@@ -401,7 +401,7 @@
401401

402402
/* ── Status badge retro ── */
403403
.retro-status {
404-
font-size: 10px;
404+
font-size: 11px;
405405
font-weight: bold;
406406
font-family: var(--retro-font);
407407
letter-spacing: 0.12em;

‎app/views/seasons/index.html.erb‎

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -17,10 +17,13 @@
1717
onmouseover="this.style.borderColor='var(--retro-gold)';this.style.background='rgba(200,155,60,0.05)'"
1818
onmouseout="this.style.borderColor='var(--retro-gold-dim)';this.style.background='var(--retro-card)'">
1919
<div class="retro-corners"></div>
20-
<!-- Season roman numeral badge -->
21-
<div style="width:56px;height:56px;border:1px solid var(--retro-gold);background:linear-gradient(135deg,var(--retro-blue),var(--retro-blue-dark));display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative">
22-
<div class="retro-corners"></div>
23-
<span style="font-size:20px;font-weight:bold;color:var(--retro-gold);font-family:var(--retro-font);text-shadow:0 0 8px rgba(200,155,60,0.6)"><%= roman_num %></span>
20+
<!-- Season logo + roman numeral badge -->
21+
<div style="width:56px;height:56px;flex-shrink:0;position:relative">
22+
<%= image_tag "/Kings_Lendas_logo.webp", alt: season[:label], width: 56, height: 56,
23+
style: "width:56px;height:56px;object-fit:contain" %>
24+
<div style="position:absolute;bottom:-4px;right:-6px;background:var(--retro-blue-dark);border:1px solid var(--retro-gold);padding:1px 5px">
25+
<span style="font-size:10px;font-weight:bold;color:var(--retro-gold);font-family:var(--retro-font)"><%= roman_num %></span>
26+
</div>
2427
</div>
2528
<div style="flex:1">
2629
<p style="font-size:9px;color:var(--retro-teal);letter-spacing:0.18em;font-family:var(--retro-font);text-transform:uppercase;margin-bottom:3px">IDL Kings Lendas</p>

‎app/views/shared/_match_card.html.erb‎

Lines changed: 28 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -19,14 +19,14 @@
1919
<% if show_expand && match_games.any? %>data-action="click->match-accordion#toggle"<% end %>>
2020
<div style="display:flex;align-items:center;gap:8px;margin-bottom:10px">
2121
<% if match["Phase"].present? %>
22-
<span class="retro-status" style="color:var(--retro-teal);border-color:var(--retro-teal);font-size:9px">
22+
<span class="retro-status" style="color:var(--retro-teal);border-color:var(--retro-teal)">
2323
<%= phase_label(match["Phase"]) %>
2424
</span>
2525
<% end %>
26-
<span style="font-size:10px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif">Bo<%= best_of > 0 ? best_of : 1 %></span>
27-
<span style="margin-left:auto;font-size:10px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif"><%= format_datetime_brt(dt) %> BRT</span>
26+
<span style="font-size:12px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif">Bo<%= best_of > 0 ? best_of : 1 %></span>
27+
<span style="margin-left:auto;font-size:12px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif"><%= format_datetime_brt(dt) %> BRT</span>
2828
<% if show_expand && match_games.any? %>
29-
<span style="color:rgba(255,255,255,0.35);font-size:12px" data-match-accordion-target="icon">▼</span>
29+
<span style="color:rgba(255,255,255,0.35);font-size:14px" data-match-accordion-target="icon">▼</span>
3030
<% end %>
3131
</div>
3232

@@ -35,27 +35,27 @@
3535

3636
<!-- Team 1 -->
3737
<div style="flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;opacity:<%= played && winner != t1 ? '0.35' : '1' %>">
38-
<%= team_logo(t1, size: 48) %>
39-
<span style="font-size:12px;font-weight:bold;color:rgba(255,255,255,0.85);font-family:Verdana,sans-serif;text-align:center"><%= team_abbr(t1) %></span>
38+
<%= team_logo(t1, size: 52) %>
39+
<span style="font-size:14px;font-weight:bold;color:rgba(255,255,255,0.85);font-family:Verdana,sans-serif;text-align:center"><%= team_abbr(t1) %></span>
4040
<% captain1 = TEAMS_DATA[t1]&.dig(:captain) %>
4141
<% if captain1 %>
42-
<span style="font-size:10px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif"><%= captain1 %></span>
42+
<span style="font-size:12px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif"><%= captain1 %></span>
4343
<% end %>
4444
</div>
4545

4646
<!-- Score / VS -->
4747
<div style="display:flex;flex-direction:column;align-items:center;gap:4px;min-width:72px">
4848
<% if played %>
4949
<div style="display:flex;align-items:center;gap:10px">
50-
<span style="font-size:30px;font-weight:900;font-family:Verdana,sans-serif;color:<%= winner == t1 ? 'var(--color-kl-win)' : 'rgba(255,255,255,0.25)' %>"><%= t1_score %></span>
51-
<span style="color:rgba(255,255,255,0.15);font-weight:bold;font-size:18px">:</span>
52-
<span style="font-size:30px;font-weight:900;font-family:Verdana,sans-serif;color:<%= winner == t2 ? 'var(--color-kl-win)' : 'rgba(255,255,255,0.25)' %>"><%= t2_score %></span>
50+
<span style="font-size:34px;font-weight:900;font-family:Verdana,sans-serif;color:<%= winner == t1 ? 'var(--color-kl-win)' : 'rgba(255,255,255,0.25)' %>"><%= t1_score %></span>
51+
<span style="color:rgba(255,255,255,0.15);font-weight:bold;font-size:20px">:</span>
52+
<span style="font-size:34px;font-weight:900;font-family:Verdana,sans-serif;color:<%= winner == t2 ? 'var(--color-kl-win)' : 'rgba(255,255,255,0.25)' %>"><%= t2_score %></span>
5353
</div>
54-
<span style="font-size:9px;font-weight:bold;color:var(--retro-gold);letter-spacing:0.12em;font-family:Verdana,sans-serif">ENCERRADO</span>
54+
<span style="font-size:11px;font-weight:bold;color:var(--retro-gold);letter-spacing:0.12em;font-family:Verdana,sans-serif">ENCERRADO</span>
5555
<% else %>
56-
<div style="font-size:24px;font-weight:900;color:rgba(255,255,255,0.2);font-family:Verdana,sans-serif">VS</div>
56+
<div style="font-size:28px;font-weight:900;color:rgba(255,255,255,0.2);font-family:Verdana,sans-serif">VS</div>
5757
<% if dt.present? %>
58-
<span style="font-size:9px;color:rgba(255,255,255,0.35);font-family:Verdana,sans-serif"
58+
<span style="font-size:11px;color:rgba(255,255,255,0.35);font-family:Verdana,sans-serif"
5959
data-controller="countdown"
6060
data-countdown-target-value="<%= dt %>">Em breve</span>
6161
<% end %>
@@ -64,11 +64,11 @@
6464

6565
<!-- Team 2 -->
6666
<div style="flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;opacity:<%= played && winner != t2 ? '0.35' : '1' %>">
67-
<%= team_logo(t2, size: 48) %>
68-
<span style="font-size:12px;font-weight:bold;color:rgba(255,255,255,0.85);font-family:Verdana,sans-serif;text-align:center"><%= team_abbr(t2) %></span>
67+
<%= team_logo(t2, size: 52) %>
68+
<span style="font-size:14px;font-weight:bold;color:rgba(255,255,255,0.85);font-family:Verdana,sans-serif;text-align:center"><%= team_abbr(t2) %></span>
6969
<% captain2 = TEAMS_DATA[t2]&.dig(:captain) %>
7070
<% if captain2 %>
71-
<span style="font-size:10px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif"><%= captain2 %></span>
71+
<span style="font-size:12px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif"><%= captain2 %></span>
7272
<% end %>
7373
</div>
7474
</div>
@@ -80,9 +80,9 @@
8080
<% match_games.each_with_index do |game, idx| %>
8181
<div style="padding:12px 16px;<%= idx > 0 ? 'border-top:1px solid rgba(200,155,60,0.08)' : '' %>">
8282
<div style="display:flex;align-items:center;gap:8px;margin-bottom:10px">
83-
<span style="font-size:10px;color:rgba(255,255,255,0.35);font-family:Verdana,sans-serif;letter-spacing:0.1em">GAME <%= idx + 1 %></span>
84-
<span style="font-size:10px;color:rgba(255,255,255,0.2);font-family:Verdana,sans-serif">◆ <%= format_game_duration(game["Gamelength"]) %></span>
85-
<span style="margin-left:auto;font-size:13px;font-family:Verdana,sans-serif">
83+
<span style="font-size:12px;color:rgba(255,255,255,0.35);font-family:Verdana,sans-serif;letter-spacing:0.1em">GAME <%= idx + 1 %></span>
84+
<span style="font-size:12px;color:rgba(255,255,255,0.2);font-family:Verdana,sans-serif">◆ <%= format_game_duration(game["Gamelength"]) %></span>
85+
<span style="margin-left:auto;font-size:14px;font-family:Verdana,sans-serif">
8686
<span style="color:<%= game['Winner'] == t1 ? 'var(--color-kl-win)' : 'var(--color-kl-loss)' %>;font-weight:bold"><%= game['Team1Kills'] %></span>
8787
<span style="color:rgba(255,255,255,0.2)">/</span>
8888
<span style="color:<%= game['Winner'] == t2 ? 'var(--color-kl-win)' : 'var(--color-kl-loss)' %>;font-weight:bold"><%= game['Team2Kills'] %></span>
@@ -92,18 +92,18 @@
9292
<!-- Picks row -->
9393
<div style="display:grid;grid-template-columns:1fr 1fr;gap:12px">
9494
<div>
95-
<p style="font-size:9px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif;margin-bottom:6px;letter-spacing:0.08em;text-transform:uppercase">Picks <%= team_abbr(t1) %></p>
95+
<p style="font-size:11px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif;margin-bottom:6px;letter-spacing:0.08em;text-transform:uppercase">Picks <%= team_abbr(t1) %></p>
9696
<div style="display:flex;gap:3px;flex-wrap:wrap">
9797
<% game["Team1Picks"].to_s.split(",").map(&:strip).each do |champ| %>
98-
<%= champion_icon(champ, size: 32) %>
98+
<%= champion_icon(champ, size: 36) %>
9999
<% end %>
100100
</div>
101101
</div>
102102
<div>
103-
<p style="font-size:9px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif;margin-bottom:6px;letter-spacing:0.08em;text-transform:uppercase">Picks <%= team_abbr(t2) %></p>
103+
<p style="font-size:11px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif;margin-bottom:6px;letter-spacing:0.08em;text-transform:uppercase">Picks <%= team_abbr(t2) %></p>
104104
<div style="display:flex;gap:3px;flex-wrap:wrap">
105105
<% game["Team2Picks"].to_s.split(",").map(&:strip).each do |champ| %>
106-
<%= champion_icon(champ, size: 32) %>
106+
<%= champion_icon(champ, size: 36) %>
107107
<% end %>
108108
</div>
109109
</div>
@@ -112,11 +112,11 @@
112112
<!-- Bans row -->
113113
<div style="display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:8px">
114114
<div>
115-
<p style="font-size:9px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif;margin-bottom:6px;letter-spacing:0.08em;text-transform:uppercase">Bans</p>
115+
<p style="font-size:11px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif;margin-bottom:6px;letter-spacing:0.08em;text-transform:uppercase">Bans</p>
116116
<div style="display:flex;gap:3px;flex-wrap:wrap">
117117
<% game["Team1Bans"].to_s.split(",").map(&:strip).each do |champ| %>
118118
<div style="position:relative">
119-
<%= champion_icon(champ, size: 28, css_class: "opacity-60 grayscale") %>
119+
<%= champion_icon(champ, size: 30, css_class: "opacity-60 grayscale") %>
120120
<div style="position:absolute;inset:0;display:flex;align-items:center;justify-content:center">
121121
<div style="width:100%;height:1px;background:#ef4444;transform:rotate(45deg);position:absolute"></div>
122122
</div>
@@ -125,11 +125,11 @@
125125
</div>
126126
</div>
127127
<div>
128-
<p style="font-size:9px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif;margin-bottom:6px;letter-spacing:0.08em;text-transform:uppercase">Bans</p>
128+
<p style="font-size:11px;color:rgba(255,255,255,0.3);font-family:Verdana,sans-serif;margin-bottom:6px;letter-spacing:0.08em;text-transform:uppercase">Bans</p>
129129
<div style="display:flex;gap:3px;flex-wrap:wrap">
130130
<% game["Team2Bans"].to_s.split(",").map(&:strip).each do |champ| %>
131131
<div style="position:relative">
132-
<%= champion_icon(champ, size: 28, css_class: "opacity-60 grayscale") %>
132+
<%= champion_icon(champ, size: 30, css_class: "opacity-60 grayscale") %>
133133
<div style="position:absolute;inset:0;display:flex;align-items:center;justify-content:center">
134134
<div style="width:100%;height:1px;background:#ef4444;transform:rotate(45deg);position:absolute"></div>
135135
</div>
@@ -143,7 +143,7 @@
143143
<div style="margin-top:10px;text-align:center">
144144
<%= turbo_frame_tag "scoreboard_#{game['UniqueGame']}" do %>
145145
<a href="#" data-lazy-src="<%= api_game_scoreboard_path(game['UniqueGame']) %>"
146-
style="font-size:10px;color:var(--retro-teal);font-family:Verdana,sans-serif;text-decoration:none;letter-spacing:0.08em">
146+
style="font-size:12px;color:var(--retro-teal);font-family:Verdana,sans-serif;text-decoration:none;letter-spacing:0.08em">
147147
VER SCOREBOARD DETALHADO →
148148
</a>
149149
<% end %>

0 commit comments

Comments
 (0)