diff --git a/src/styles.css b/src/styles.css index f9e2bea..da1ccc2 100644 --- a/src/styles.css +++ b/src/styles.css @@ -81,10 +81,10 @@ button { .layout { width: 100%; height: 100%; - padding: 1rem; + padding: 0.5rem; display: flex; flex-direction: column; - gap: 0.85rem; + gap: 0.5rem; overflow: hidden; } @@ -201,10 +201,11 @@ label span, flex: 1; position: relative; display: grid; - grid-template-columns: minmax(0, 1.9fr) minmax(320px, 0.85fr); - gap: 0.85rem; + grid-template-columns: minmax(0, 1.9fr) minmax(280px, 0.85fr); + gap: 0.5rem; min-height: 0; - align-items: start; + align-items: center; + overflow: hidden; } .board-shell, @@ -217,18 +218,25 @@ label span, .board-shell { min-height: 0; - padding: 0.8rem; + padding: 0.4rem; + display: flex; + align-items: center; + justify-content: center; + overflow: hidden; } .board { position: relative; - width: 100%; - height: auto; + width: auto; + height: 100%; + max-width: 100%; max-height: 100%; aspect-ratio: var(--board-columns) / var(--board-rows); display: grid; - gap: 0.32rem; + gap: 0.15rem; margin: 0 auto; + align-content: center; + justify-content: center; } .board__lines {