Wider operator cards on mobile (2 columns instead of 3)
- Gives more room for long character names - Cards are now wider with proper spacing
This commit is contained in:
+4
-5
@@ -702,26 +702,25 @@
|
||||
}
|
||||
|
||||
.hero h1 { font-size: 48px; }
|
||||
.operator-grid { grid-template-columns: repeat(3, 1fr); }
|
||||
.operator-grid { grid-template-columns: repeat(2, 1fr); }
|
||||
.operator-select { grid-template-columns: repeat(4, 1fr); }
|
||||
.guide-grid { grid-template-columns: 1fr; }
|
||||
|
||||
/* Fix operator cards on mobile for long names */
|
||||
.operator-card h4 {
|
||||
font-size: 11px;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0;
|
||||
word-wrap: break-word;
|
||||
overflow-wrap: break-word;
|
||||
hyphens: auto;
|
||||
line-height: 1.3;
|
||||
}
|
||||
|
||||
.operator-card-img {
|
||||
height: 140px;
|
||||
height: 160px;
|
||||
}
|
||||
|
||||
.operator-card-content {
|
||||
padding: 12px 8px;
|
||||
padding: 15px 10px;
|
||||
}
|
||||
|
||||
.character-showcase {
|
||||
|
||||
Reference in New Issue
Block a user