Aesthetics

src/css/App.css

@@ -275,6 +275,8 @@ label .MuiIconButton-label > input {
 	justify-content: space-between;
 	align-items: baseline;
   flex-wrap: wrap;
+  word-wrap: break-word;
+  word-break: break-word;
 }
 
 .stat-row > h1, .stat-row > h2, .stat-row > h3 {

src/css/Button.css

@@ -82,7 +82,7 @@ main .button {
 	display: none;
 }
 
-@media screen and (max-width: 660px) {
+@media screen and (max-width: 700px) {
 	.button.button--hide-text-mobile {
 		background: none;
 		padding: 10px;

src/css/MistakesHistory.css

@@ -1,7 +1,7 @@
 .mistakes-history-container {
 	display: grid;
 	grid-column-gap: 12px;
-	grid-template-columns: repeat(2, minmax(110px,max-content));
+	grid-template-columns: repeat(2, 1fr);
 	width: min-content;
 	word-wrap: break-word;
   	word-break: break-word;

src/css/NavBar.css

@@ -24,7 +24,7 @@ nav {
 	justify-content: flex-end;
 }
 
-@media screen and (max-width: 660px) {
+@media screen and (max-width: 700px) {
 	#banner-logo {
 		display: none;
 	}