Management: fix mobile style

This commit is contained in:
Viktor Fomin 2024-08-12 17:07:46 +03:00
parent 8611b8b0d1
commit 51fa9bc2c5

View File

@ -26,20 +26,17 @@
import React from "react"; import React from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import styled from "styled-components";
import { RowContent } from "@docspace/shared/components/row-content"; import { RowContent } from "@docspace/shared/components/row-content";
import { Text } from "@docspace/shared/components/text"; import { Text } from "@docspace/shared/components/text";
import styled, { css } from "styled-components";
import { isMobileOnly } from "react-device-detect";
import { getConvertedSize } from "@docspace/shared/utils/common"; import { getConvertedSize } from "@docspace/shared/utils/common";
import { mobile } from "@docspace/shared/utils";
import { TPortals } from "SRC_DIR/types/spaces"; import { TPortals } from "SRC_DIR/types/spaces";
const StyledRowContent = styled(RowContent)` const StyledRowContent = styled(RowContent)`
padding-bottom: 10px; padding-bottom: 10px;
.row-main-container-wrapper { .row-main-container-wrapper {
${isMobileOnly &&
css`
margin-top: 14px;
`}
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
} }
@ -47,6 +44,16 @@ const StyledRowContent = styled(RowContent)`
.mainIcons { .mainIcons {
height: 20px; height: 20px;
} }
@media ${mobile} {
.row-main-container-wrapper {
flex-direction: column;
}
.mainIcons {
align-self: flex-start;
}
}
`; `;
type TRoomContent = { type TRoomContent = {