diff --git a/src/components/ProfileHoldings.module.css b/src/components/ProfileHoldings.module.css index 4c9fe34..10aa9e3 100644 --- a/src/components/ProfileHoldings.module.css +++ b/src/components/ProfileHoldings.module.css @@ -138,17 +138,18 @@ } .container { - width: 700px; + width: calc(100% - 48px); padding: 24px 0 0 0; box-sizing: border-box; - margin: 0 auto; + margin: 0 24px; } @media (max-width: 768px) { .container { - width: 100%; - padding: 24px 8px; + width: calc(100% - 48px); + padding: 24px 0; overflow-x: hidden; + margin: 0 24px; } .holdingsTable { diff --git a/src/components/ProfileTotals.module.css b/src/components/ProfileTotals.module.css index e08f58a..1c34e4d 100644 --- a/src/components/ProfileTotals.module.css +++ b/src/components/ProfileTotals.module.css @@ -61,13 +61,13 @@ flex-direction: row; align-items: center; justify-content: center; - margin: 24px 0 16px 0; + margin: 24px 24px 16px 24px; padding: 4px; - width: 100%; + width: calc(100% - 48px); } .metricsBar { - width: 100%; + width: calc(100% - 48px); position: relative; background: linear-gradient(180deg, #9c9584, #736b55); border-radius: 14px; @@ -82,7 +82,7 @@ font-size: 24px; color: #fff; font-family: 'SF Compact Rounded'; - margin: 0; + margin: 0 24px; } .metricItem { @@ -157,13 +157,13 @@ @media (max-width: 768px) { .metricsBar { padding: 16px; - margin: 0; - width: 100%; + margin: 0 24px; + width: calc(100% - 48px); } .buttonParent { - margin: 24px 0 16px 0; - width: 100%; + margin: 24px 24px 16px 24px; + width: calc(100% - 48px); } }