diff --git a/res/css/views/rooms/RoomListPanel/_RoomListHeaderView.pcss b/res/css/views/rooms/RoomListPanel/_RoomListHeaderView.pcss index 8ce4655e58..595f47f9c8 100644 --- a/res/css/views/rooms/RoomListPanel/_RoomListHeaderView.pcss +++ b/res/css/views/rooms/RoomListPanel/_RoomListHeaderView.pcss @@ -6,7 +6,7 @@ */ .mx_RoomListHeaderView { - height: 60px; + flex: 0 0 60px; padding: 0 var(--cpd-space-3x); .mx_RoomListHeaderView_title { diff --git a/res/css/views/rooms/RoomListPanel/_RoomListSearch.pcss b/res/css/views/rooms/RoomListPanel/_RoomListSearch.pcss index f175ab3976..8a97086df8 100644 --- a/res/css/views/rooms/RoomListPanel/_RoomListSearch.pcss +++ b/res/css/views/rooms/RoomListPanel/_RoomListSearch.pcss @@ -7,7 +7,7 @@ .mx_RoomListSearch { /* From figma, this should be aligned with the room header */ - height: 64px; + flex: 0 0 64px; box-sizing: border-box; border-bottom: var(--cpd-border-width-1) solid var(--cpd-color-bg-subtle-primary); padding: 0 var(--cpd-space-3x); diff --git a/src/components/views/rooms/RoomListPanel/RoomListPanel.tsx b/src/components/views/rooms/RoomListPanel/RoomListPanel.tsx index a52b619651..caa6241de7 100644 --- a/src/components/views/rooms/RoomListPanel/RoomListPanel.tsx +++ b/src/components/views/rooms/RoomListPanel/RoomListPanel.tsx @@ -13,6 +13,7 @@ import { shouldShowComponent } from "../../../../customisations/helpers/UICompon import { UIComponent } from "../../../../settings/UIFeature"; import { RoomListSearch } from "./RoomListSearch"; import { RoomListHeaderView } from "./RoomListHeaderView"; +import { Flex } from "../../../utils/Flex"; import { useRoomListViewModel } from "../../../viewmodels/roomlist/RoomListViewModel"; type RoomListPanelProps = { @@ -39,7 +40,13 @@ export const RoomListPanel: React.FC = ({ activeSpace }) => }; return ( -
+ {displayRoomSearch && } @@ -53,6 +60,6 @@ export const RoomListPanel: React.FC = ({ activeSpace }) => /> )} -
+ ); };