impr(settings-page): responsive local font button style (@byseif21) (monkeytypegame#6855)

byseif21 · web-flow · commit 68d2370d94c3 · 2025-08-10T14:51:03.000+02:00
### Description in the smaller screens it's not looking the best * now <img width="561" height="432" alt="Screenshot 2025-08-09 090154" src="https://github.com/user-attachments/assets/72fc5fdb-a008-4699-9bfc-b766937bf72a" />
diff --git a/frontend/src/styles/media-queries-blue.scss b/frontend/src/styles/media-queries-blue.scss
@@ -131,6 +131,17 @@
         }
       }
     }
+    .section[data-config-name="fontFamily"] {
+      grid-template-areas:
+        "title"
+        "text"
+        "tabs"
+        "buttons";
+      .topRight {
+        grid-area: tabs;
+        align-self: start;
+      }
+    }
   }
   .profile {
     grid-template-columns: 1fr;

Original file line number	Diff line number	Diff line change
`@@ -131,6 +131,17 @@`
`131`	`131`	`}`
`132`	`132`	`}`
`133`	`133`	`}`
	`134`	`+ .section[data-config-name="fontFamily"] {`
	`135`	`+ grid-template-areas:`
	`136`	`+ "title"`
	`137`	`+ "text"`
	`138`	`+ "tabs"`
	`139`	`+ "buttons";`
	`140`	`+ .topRight {`
	`141`	`+ grid-area: tabs;`
	`142`	`+ align-self: start;`
	`143`	`+ }`
	`144`	`+ }`
`134`	`145`	`}`
`135`	`146`	`.profile {`
`136`	`147`	`grid-template-columns: 1fr;`