NQ-45 Responsive styling login and character select

2024-06-06 21:07:02 +02:00
parent 5c5b37d428
commit 147d034572
2 changed files with 21 additions and 2 deletions
--- a/src/components/screens/Characters.vue
+++ b/src/components/screens/Characters.vue
@ -106,7 +106,7 @@ function create() {
    flex-direction: column;
    justify-content: center;
    align-items: center;
-    gap: 100px;
+    gap: 80px;
    padding: 0 80px;
    &::before {
      content: '';
@ -115,10 +115,14 @@ function create() {
    .characters-wrapper {
      display: flex;
      justify-content: center;
-      gap: 80px;
+      flex-wrap: wrap;
+      gap: 60px;
      width: 100%;
+      max-height: 650px;
+      overflow: auto;

      .character {
+        margin: 10px;
        width: 170px;
        height: 275px;
        display: flex;