diff --git a/src/components/VinlottisPage.vue b/src/components/VinlottisPage.vue index 8e277a9..34099ef 100644 --- a/src/components/VinlottisPage.vue +++ b/src/components/VinlottisPage.vue @@ -65,6 +65,11 @@ export default { .left-bottom { width: 75%; + + @include mobile { + padding: 0 1.25rem; + width: 100%; + } } .bought-and-highscore-separator { @@ -180,7 +185,7 @@ h1 { justify-content: center; align-items: center; - padding-top: 0; + padding: 0; margin-top: 30px; } diff --git a/src/ui/TotalBought.vue b/src/ui/TotalBought.vue index 90a766f..d24d43e 100644 --- a/src/ui/TotalBought.vue +++ b/src/ui/TotalBought.vue @@ -106,6 +106,12 @@ export default { flex-direction: column; justify-content: center; align-items: flex-start; + + @include mobile { + flex-direction: row; + justify-content: unset; + align-items: center; + } } .number-container { @@ -120,6 +126,12 @@ export default { .inner-text-container { padding-left: 5px; + + // TODO fix styling for displaying in columns + @include mobile { + margin-top: auto; + padding-bottom: 5px; + } } .bought-number-span {