mirror of
https://github.com/openfrontio/OpenFrontIO.git
synced 2026-06-21 14:50:44 +00:00
fix: spacing between team leaderboard buttons (#3101)
## Description: In team games, the UI buttons for the leaderboard and the team leaderboard look out of place. A bit of tailwind css fixes the look and a making the gap window specific makes the accessibility better. ## Please complete the following: - [x] I have added screenshots for all UI updates - [x] I process any text displayed to the user through translateText() and I've added it to the en.json file - [x] I have added relevant tests to the test directory - [x] I confirm I have thoroughly tested these changes and take full responsibility for any bugs introduced *** Screenshots: Before change: <img width="218" height="130" alt="image" src="https://github.com/user-attachments/assets/e7366435-c3d3-44b9-af5f-05a1548bf743" /> After change: <img width="393" height="277" alt="image" src="https://github.com/user-attachments/assets/86dcb614-dd30-48f9-9048-fcb892a5dbae" /> Befre change with open leaderboard: <img width="491" height="211" alt="image" src="https://github.com/user-attachments/assets/4313fb89-8a61-4892-8c28-0c0d82bcc03b" /> After change with open leaderboard: <img width="531" height="251" alt="image" src="https://github.com/user-attachments/assets/9b4e2ed5-8427-4a7a-84dc-69169f53b031" /> Mobile before change: <img width="535" height="180" alt="image" src="https://github.com/user-attachments/assets/f6cc87be-1f7f-4bc7-bb1d-9afcce45ff6d" /> Mobile after change: <img width="469" height="199" alt="image" src="https://github.com/user-attachments/assets/ac4baa9d-4051-4938-a0a1-53d38efea7a8" /> Mobile before change with open leaderboard: <img width="501" height="195" alt="image" src="https://github.com/user-attachments/assets/a086cdd8-7898-4e13-a679-04b63be7a67b" /> Mobile after change with open leaderboard: <img width="446" height="238" alt="image" src="https://github.com/user-attachments/assets/8cc9c833-b8f9-43bb-9664-8cfb9f608cc4" /> Discord username: martoi *** Signed-off-by: MartinIvovIv <https://github.com/martinIvovIv>
This commit is contained in:
@@ -108,7 +108,7 @@ export class GameLeftSidebar extends LitElement implements Layer {
|
||||
`
|
||||
: null}
|
||||
<div
|
||||
class=${`flex items-center gap-2 text-white ${
|
||||
class=${`flex items-center gap-4 lg:gap-6 xl:gap-8 text-white ${this.isTeamGame ? "ml-8" : ""} ${
|
||||
this.isLeaderboardShow || this.isTeamLeaderboardShow ? "mb-2" : ""
|
||||
}`}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user