Client: Fixed header for mobile invite panel.
This commit is contained in:
parent
9df57acd09
commit
3568959d17
@ -123,13 +123,6 @@ const ScrollList = styled.div`
|
||||
}
|
||||
`;
|
||||
|
||||
const StyledBlock = styled.div`
|
||||
border-bottom: ${(props) => props.theme.filesPanels.sharing.borderBottom};
|
||||
padding-inline: 16px 37px;
|
||||
`;
|
||||
|
||||
StyledBlock.defaultProps = { theme: Base };
|
||||
|
||||
const StyledExternalLink = styled.div`
|
||||
border-bottom: ${(props) => props.theme.filesPanels.sharing.borderBottom};
|
||||
`;
|
||||
@ -139,11 +132,6 @@ const StyledInviteUserBody = styled.div`
|
||||
overflow: auto;
|
||||
`;
|
||||
|
||||
const StyledHeading = styled(Heading)`
|
||||
font-weight: 700;
|
||||
font-size: 18px;
|
||||
`;
|
||||
|
||||
const StyledSubHeader = styled(Heading)`
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
@ -503,22 +491,6 @@ const StyledToggleButton = styled(ToggleButton)`
|
||||
margin-top: -4px;
|
||||
`;
|
||||
|
||||
const StyledControlContainer = styled.div`
|
||||
width: 17px;
|
||||
height: 17px;
|
||||
position: absolute;
|
||||
|
||||
cursor: pointer;
|
||||
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 450;
|
||||
|
||||
@media ${mobile} {
|
||||
top: 17px;
|
||||
inset-inline-end: 16px;
|
||||
}
|
||||
`;
|
||||
const StyledInviteLanguage = styled.div`
|
||||
padding-left: 16px;
|
||||
padding-right: 16px;
|
||||
@ -576,8 +548,6 @@ const StyledInviteLanguage = styled.div`
|
||||
|
||||
StyledCrossIcon.defaultProps = { theme: Base };
|
||||
export {
|
||||
StyledBlock,
|
||||
StyledHeading,
|
||||
StyledInvitePanel,
|
||||
StyledRow,
|
||||
StyledSubHeader,
|
||||
@ -599,7 +569,6 @@ export {
|
||||
StyledToggleButton,
|
||||
StyledDescription,
|
||||
StyledInviteLanguage,
|
||||
StyledControlContainer,
|
||||
StyledInviteUserBody,
|
||||
StyledExternalLink,
|
||||
};
|
||||
|
@ -38,19 +38,13 @@ import { DeviceType, EmployeeType } from "@docspace/shared/enums";
|
||||
import { LOADER_TIMEOUT } from "@docspace/shared/constants";
|
||||
|
||||
import { Backdrop } from "@docspace/shared/components/backdrop";
|
||||
import { Aside } from "@docspace/shared/components/aside";
|
||||
import { Aside, AsideHeader } from "@docspace/shared/components/aside";
|
||||
import { Button } from "@docspace/shared/components/button";
|
||||
import { toastr } from "@docspace/shared/components/toast";
|
||||
import { Portal } from "@docspace/shared/components/portal";
|
||||
import { isDesktop, isMobile, size } from "@docspace/shared/utils";
|
||||
|
||||
import {
|
||||
StyledBlock,
|
||||
StyledHeading,
|
||||
StyledInvitePanel,
|
||||
StyledButtons,
|
||||
StyledControlContainer,
|
||||
} from "./StyledInvitePanel";
|
||||
import { StyledInvitePanel, StyledButtons } from "./StyledInvitePanel";
|
||||
|
||||
import ItemsList from "./sub-components/ItemsList";
|
||||
import InviteInput from "./sub-components/InviteInput";
|
||||
@ -59,12 +53,10 @@ import { Scrollbar } from "@docspace/shared/components/scrollbar";
|
||||
|
||||
import InfoBar from "./sub-components/InfoBar";
|
||||
import InvitePanelLoader from "./sub-components/InvitePanelLoader";
|
||||
import { Link } from "@docspace/shared/components/link";
|
||||
|
||||
import { Text } from "@docspace/shared/components/text";
|
||||
import { combineUrl } from "@docspace/shared/utils/combineUrl";
|
||||
import { ColorTheme, ThemeId } from "@docspace/shared/components/color-theme";
|
||||
import { IconButton } from "@docspace/shared/components/icon-button";
|
||||
import CrossIconMobile from "PUBLIC_DIR/images/cross.react.svg?url";
|
||||
|
||||
const InvitePanel = ({
|
||||
folders,
|
||||
@ -430,11 +422,6 @@ const InvitePanel = ({
|
||||
|
||||
const invitePanelNode = (
|
||||
<>
|
||||
{isMobileView && (
|
||||
<StyledBlock>
|
||||
<StyledHeading truncate>{t("Common:InviteUsers")}</StyledHeading>
|
||||
</StyledBlock>
|
||||
)}
|
||||
{invitePanelIsLoding ? (
|
||||
<InvitePanelLoader />
|
||||
) : (
|
||||
@ -482,14 +469,11 @@ const InvitePanel = ({
|
||||
>
|
||||
{isMobileView ? (
|
||||
<div className="invite_panel" ref={invitePanelRef}>
|
||||
<StyledControlContainer onClick={onClose}>
|
||||
<IconButton
|
||||
size={17}
|
||||
className="close-button"
|
||||
iconName={CrossIconMobile}
|
||||
isClickable
|
||||
/>
|
||||
</StyledControlContainer>
|
||||
<AsideHeader
|
||||
header={t("Common:InviteUsers")}
|
||||
onCloseClick={onClose}
|
||||
/>
|
||||
|
||||
{invitePanelNode}
|
||||
</div>
|
||||
) : (
|
||||
|
@ -24,14 +24,10 @@
|
||||
// content are licensed under the terms of the Creative Commons Attribution-ShareAlike 4.0
|
||||
// International. See the License terms at http://creativecommons.org/licenses/by-sa/4.0/legalcode
|
||||
|
||||
import CrossReactSvgUrl from "PUBLIC_DIR/images/icons/17/cross.react.svg?url";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { withTranslation } from "react-i18next";
|
||||
|
||||
import { IconButton } from "@docspace/shared/components/icon-button";
|
||||
import { Text } from "@docspace/shared/components/text";
|
||||
|
||||
import { Tabs } from "@docspace/shared/components/tabs";
|
||||
import {
|
||||
isDesktop as isDesktopUtils,
|
||||
|
Loading…
Reference in New Issue
Block a user