diff --git a/CHANGELOG.md b/CHANGELOG.md index 515a34d4c..034b3c646 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -20,6 +20,7 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), - Styling issue on sidebar on mobile (#1194) - Styling issue preventing scrolling in the sidebar (#1216) +- Styling issue on status bar on mobile (#1217) ## [0.30.0] - 2025-04-15 diff --git a/src/assets/icons/cloud_tick.svg b/src/assets/icons/cloud_tick.svg index e274ab69f..cd8a8885c 100644 --- a/src/assets/icons/cloud_tick.svg +++ b/src/assets/icons/cloud_tick.svg @@ -1,14 +1 @@ - + \ No newline at end of file diff --git a/src/assets/icons/cloud_upload.svg b/src/assets/icons/cloud_upload.svg index bed6c38e1..58d87cd0a 100644 --- a/src/assets/icons/cloud_upload.svg +++ b/src/assets/icons/cloud_upload.svg @@ -1,10 +1 @@ - + \ No newline at end of file diff --git a/src/assets/stylesheets/MobileProjectBar.scss b/src/assets/stylesheets/MobileProjectBar.scss index 78ef5b366..a1c260b12 100644 --- a/src/assets/stylesheets/MobileProjectBar.scss +++ b/src/assets/stylesheets/MobileProjectBar.scss @@ -7,9 +7,9 @@ background-color: $rpf-white; border-block-start: 1px solid $rpf-grey-150; display: flex; - block-size: 25px; justify-content: space-between; - padding: 0 $space-0-5; + padding: $space-0-5; + gap: var(--space-1); } .mobile-project-bar__name { diff --git a/src/assets/stylesheets/SaveStatus.scss b/src/assets/stylesheets/SaveStatus.scss index b5092c45b..c55ccbbb8 100644 --- a/src/assets/stylesheets/SaveStatus.scss +++ b/src/assets/stylesheets/SaveStatus.scss @@ -8,14 +8,25 @@ gap: $space-0-25; justify-content: flex-end; margin-block: 0; - padding-inline: $space-1; + padding-inline: var(--space-1); } .save-status--mobile { margin: unset; + padding-inline: 0; .save-status__text { - @include font-size-1(regular); + @include font-size-0-75(regular); + } + + .save-status__icon { + inline-size: 16px; + block-size: 16px; + + svg { + width: 100%; + height: 100%; + } } } diff --git a/src/components/SaveStatus/SaveStatus.jsx b/src/components/SaveStatus/SaveStatus.jsx index 534a4a160..04bd8099a 100644 --- a/src/components/SaveStatus/SaveStatus.jsx +++ b/src/components/SaveStatus/SaveStatus.jsx @@ -43,7 +43,7 @@ const SaveStatus = ({ isMobile = false }) => {