diff --git a/src/components/VinlottisPage.vue b/src/components/VinlottisPage.vue index 110c773..6c5b184 100644 --- a/src/components/VinlottisPage.vue +++ b/src/components/VinlottisPage.vue @@ -124,8 +124,6 @@ export default { } .highscore-container { - width: 35%; - @include mobile { width: 100%; } @@ -223,7 +221,7 @@ h1 { display: flex; flex-direction: column; align-items: flex-start; - padding-bottom: 25px; + padding-bottom: 20vw; border-right: 1px solid #333; } diff --git a/src/ui/PurchaseGraph.vue b/src/ui/PurchaseGraph.vue index b90fa3e..5039362 100644 --- a/src/ui/PurchaseGraph.vue +++ b/src/ui/PurchaseGraph.vue @@ -84,6 +84,9 @@ export default { data: chartdata, options: { maintainAspectRatio: false, + animation: { + duration: 0 // general animation time + }, title: { display: true, text: "Antall kjøpt", diff --git a/src/ui/WinGraph.vue b/src/ui/WinGraph.vue index 1fa7a5b..e5b575f 100644 --- a/src/ui/WinGraph.vue +++ b/src/ui/WinGraph.vue @@ -75,6 +75,9 @@ export default { type: "bar", data: chartdata, options: { + animation: { + duration: 0 // general animation time + }, maintainAspectRatio: false, title: { display: true, @@ -109,13 +112,13 @@ export default { .chart { height: 40vh; - max-height: 364px; + max-height: 500px; @include mobile { position: relative; width: 90vw !important; max-height: unset; - height: 50vh; + height: 30vh; margin-bottom: 2rem; } } diff --git a/src/ui/Wines.vue b/src/ui/Wines.vue index c3001df..3ac1f15 100644 --- a/src/ui/Wines.vue +++ b/src/ui/Wines.vue @@ -104,9 +104,13 @@ ol { .truncate { display: inline-block; - max-width: 250px; + max-width: 20vw; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; + + @include mobile { + max-width: calc(75vw - 90px - 62px); + } }