From 74216f75e2b47d517b50fa951a608f525dfd1f7b Mon Sep 17 00:00:00 2001 From: Ajay Bura Date: Sun, 24 Apr 2022 16:17:26 +0530 Subject: [PATCH] Fix padding in room header --- src/app/atoms/header/Header.scss | 5 ----- src/app/organisms/room/RoomView.scss | 8 ++++++++ src/app/organisms/room/RoomViewHeader.scss | 6 +++--- src/app/partials/{screen.scss => _screen.scss} | 0 4 files changed, 11 insertions(+), 8 deletions(-) rename src/app/partials/{screen.scss => _screen.scss} (100%) diff --git a/src/app/atoms/header/Header.scss b/src/app/atoms/header/Header.scss index 081b61e2..9e45f824 100644 --- a/src/app/atoms/header/Header.scss +++ b/src/app/atoms/header/Header.scss @@ -1,6 +1,5 @@ @use '../../partials/text'; @use '../../partials/dir'; -@use '../../partials/screen'; .header { @include dir.side(padding, var(--sp-normal), var(--sp-extra-tight)); @@ -41,8 +40,4 @@ display: -webkit-box; } } - - @include screen.smallerThan(mobileBreakpoint) { - @include dir.side(padding, calc(var(--sp-normal) - 10px), var(--sp-extra-tight)); - } } \ No newline at end of file diff --git a/src/app/organisms/room/RoomView.scss b/src/app/organisms/room/RoomView.scss index 2eda3ea7..4f06bf26 100644 --- a/src/app/organisms/room/RoomView.scss +++ b/src/app/organisms/room/RoomView.scss @@ -1,4 +1,6 @@ @use '../../partials/flex'; +@use '../../partials/screen'; +@use '../../partials/dir'; .room-view { @extend .cp-fx__column; @@ -18,6 +20,12 @@ box-shadow: var(--bs-popup); } + & .header { + @include screen.smallerThan(mobileBreakpoint) { + padding: 0 var(--sp-tight); + } + } + &__content-wrapper { @extend .cp-fx__item-one; @extend .cp-fx__column; diff --git a/src/app/organisms/room/RoomViewHeader.scss b/src/app/organisms/room/RoomViewHeader.scss index 79bb8dd2..267cd116 100644 --- a/src/app/organisms/room/RoomViewHeader.scss +++ b/src/app/organisms/room/RoomViewHeader.scss @@ -27,14 +27,14 @@ } } -.header .room-header__drawer-btn { +.room-header__drawer-btn { @include screen.smallerThan(tabletBreakpoint) { display: none; } } -.header .room-header__back-btn { - @include dir.side(margin, 0, 5px); +.room-header__back-btn { + @include dir.side(margin, 0, var(--sp-tight)); @include screen.biggerThan(mobileBreakpoint) { display: none; diff --git a/src/app/partials/screen.scss b/src/app/partials/_screen.scss similarity index 100% rename from src/app/partials/screen.scss rename to src/app/partials/_screen.scss