diff --git a/frontend/src/app/components/statistics/statistics.component.html b/frontend/src/app/components/statistics/statistics.component.html index f36d74963..29089e43d 100644 --- a/frontend/src/app/components/statistics/statistics.component.html +++ b/frontend/src/app/components/statistics/statistics.component.html @@ -20,42 +20,46 @@ -
- - - - - - - - - - - +
+
+ + + + + +
+
+ + + + + + +
diff --git a/frontend/src/app/components/statistics/statistics.component.scss b/frontend/src/app/components/statistics/statistics.component.scss index f7230ce4b..f9e220daa 100644 --- a/frontend/src/app/components/statistics/statistics.component.scss +++ b/frontend/src/app/components/statistics/statistics.component.scss @@ -183,3 +183,43 @@ } } } + +.btn-toggle-rows { + display: flex; + flex-direction: row; + align-items: stretch; + justify-content: stretch; + + .btn-group { + flex-grow: 1; + flex-shrink: 1; + } + + @media (min-width: 500px) { + .btn-group:first-child > .btn:last-child { + border-top-right-radius: 0; + border-bottom-right-radius: 0; + } + .btn-group:last-child > .btn:first-child { + border-top-left-radius: 0; + border-bottom-left-radius: 0; + } + } + + @media (max-width: 499px) { + flex-direction: column; + + .btn-group:first-child > .btn:first-child { + border-bottom-left-radius: 0; + } + .btn-group:first-child > .btn:last-child { + border-bottom-right-radius: 0; + } + .btn-group:last-child > .btn:first-child { + border-top-left-radius: 0; + } + .btn-group:last-child > .btn:last-child { + border-top-right-radius: 0; + } + } +} \ No newline at end of file