From 86cb17be8263bf33dd7185542272af7ba7a6290a Mon Sep 17 00:00:00 2001
From: HariramakrishnanK <102402105+HariramakrishnanK@users.noreply.github.com>
Date: Mon, 3 Feb 2025 19:40:31 +0530
Subject: [PATCH] fix(result): mobile tooltip alignment (@HariramakrishnanK)
 (#6205)

### Description
Fixed tooltip alignment issue for mobile and tablet views (#6042) and
formated the CSS file for improved readability

### Checks

- [ ] Adding quotes?
- [ ] Make sure to include translations for the quotes in the
description (or another comment) so we can verify their content.
- [ ] Adding a language or a theme?
- [ ] If is a language, did you edit `_list.json`, `_groups.json` and
add `languages.json`?
  - [ ] If is a theme, did you add the theme.css?
- Also please add a screenshot of the theme, it would be extra awesome
if you do so!
- [x] Check if any open issues are related to this PR; if so, be sure to
tag them below.
- [x] Make sure the PR title follows the Conventional Commits standard.
(https://www.conventionalcommits.org for more info)
- [x] Make sure to include your GitHub username prefixed with @ inside
parentheses at the end of the PR title.

Closes #6042

- Updated CSS for better tooltip positioning and formatted the file for
readability.
- Tested on mobile and tablet views (images attached below).

![Mobile
View](https://github.com/user-attachments/assets/d5331c4c-5479-4cb8-8e10-d6cde6daad1a)
![Tab
View](https://github.com/user-attachments/assets/97218bfb-c0e6-42bd-a1d3-affe9da4198f)
---
 frontend/src/styles/media-queries-green.scss  | 2 +-
 frontend/src/styles/media-queries-purple.scss | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/frontend/src/styles/media-queries-green.scss b/frontend/src/styles/media-queries-green.scss
index 50a996d41..6a0d11d68 100644
--- a/frontend/src/styles/media-queries-green.scss
+++ b/frontend/src/styles/media-queries-green.scss
@@ -52,7 +52,7 @@
   .pageTest {
     #result .wrapper .stats.morestats {
       display: grid;
-      grid-template-columns: 1fr 1fr 1fr;
+      grid-template-columns: repeat(3, max-content);
       grid-template-rows: 1fr 1fr;
     }
     #liveStatsTextTop,
diff --git a/frontend/src/styles/media-queries-purple.scss b/frontend/src/styles/media-queries-purple.scss
index f6b2610a3..b94edcfef 100644
--- a/frontend/src/styles/media-queries-purple.scss
+++ b/frontend/src/styles/media-queries-purple.scss
@@ -75,6 +75,11 @@
       .morestats {
         justify-self: unset;
         width: unset;
+
+        .group .bottom::after {
+          transform: none;
+          left: 0;
+        }
       }
       .buttons {
         grid-template-columns: 1fr 1fr;