diff --git a/src/components/modals/main/scss/settings/_main.scss b/src/components/modals/main/scss/settings/_main.scss index ad46b25a..7c2a5b44 100644 --- a/src/components/modals/main/scss/settings/_main.scss +++ b/src/components/modals/main/scss/settings/_main.scss @@ -132,22 +132,27 @@ h4 { } } -.statsGrid { - display: grid; - grid-template-columns: repeat(3, 1fr); - grid-template-rows: repeat(2, 1fr); - column-gap: 45px; - row-gap: 100px; - - .leftPanel { - grid-area: 1 / 1 / 3 / 3; - } +.stats { + display: flex; + flex-flow: column; + gap: 30px; + width: 100%; .rightPanel { - grid-area: 1 / 3 / 4 / 4; - display: flex; - flex-flow: column; - gap: 10px; + .statIcon { + display: flex; + justify-content: center; + margin-bottom: 30px; + } + .statGrid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + grid-gap: 10px; + div { + display: flex; + flex-flow: column; + } + } .subtitle { text-transform: capitalize; @@ -200,7 +205,6 @@ h4 { } .achievements { - margin-top: 25px; display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap: 10px; diff --git a/src/components/modals/main/settings/sections/Stats.jsx b/src/components/modals/main/settings/sections/Stats.jsx index d9f9a6da..acc95d0d 100644 --- a/src/components/modals/main/settings/sections/Stats.jsx +++ b/src/components/modals/main/settings/sections/Stats.jsx @@ -75,7 +75,7 @@ export default class Stats extends PureComponent { const achievementElement = (key, name, achieved) => (