web: people: fix headers
This commit is contained in:
parent
83ef9c584c
commit
acd456b8a0
@ -1,6 +1,6 @@
|
||||
import React, { useCallback } from "react";
|
||||
import { connect } from "react-redux";
|
||||
import { Text, IconButton, ContextMenuButton, toastr } from "asc-web-components";
|
||||
import { Text, IconButton, ContextMenuButton, toastr, utils } from "asc-web-components";
|
||||
import { withRouter } from "react-router";
|
||||
import { isAdmin, isMe } from "../../../../../store/auth/selectors";
|
||||
import { getUserStatus } from "../../../../../store/people/selectors";
|
||||
@ -8,16 +8,21 @@ import { useTranslation } from 'react-i18next';
|
||||
import { resendUserInvites } from "../../../../../store/services/api";
|
||||
import { EmployeeStatus } from "../../../../../helpers/constants";
|
||||
import { updateUserStatus } from "../../../../../store/people/actions";
|
||||
import { callbackify } from "util";
|
||||
import styled from 'styled-components';
|
||||
|
||||
const wrapperStyle = {
|
||||
display: "flex",
|
||||
alignItems: "center"
|
||||
};
|
||||
|
||||
const textStyle = {
|
||||
marginLeft: "16px",
|
||||
marginRight: "16px"
|
||||
};
|
||||
const Header = styled(Text.ContentHeader)`
|
||||
margin-left: 16px;
|
||||
margin-right: 16px;
|
||||
max-width: calc(100vw - 430px);
|
||||
@media ${utils.device.tablet} {
|
||||
max-width: calc(100vw - 96px);
|
||||
}
|
||||
`;
|
||||
|
||||
const SectionHeaderContent = props => {
|
||||
const { profile, history, settings, isAdmin, viewer, updateUserStatus } = props;
|
||||
@ -188,10 +193,10 @@ const SectionHeaderContent = props => {
|
||||
onClick={onClick}
|
||||
/>
|
||||
</div>
|
||||
<Text.ContentHeader truncate={true} style={textStyle}>
|
||||
<Header truncate={true}>
|
||||
{profile.displayName}
|
||||
{profile.isLDAP && ` (${t('LDAPLbl')})`}
|
||||
</Text.ContentHeader>
|
||||
</Header>
|
||||
{(isAdmin || isMe(viewer, profile.userName)) && (
|
||||
<ContextMenuButton
|
||||
directionX="right"
|
||||
|
@ -2,7 +2,7 @@ import React, { useCallback } from 'react';
|
||||
import styled from 'styled-components';
|
||||
import { connect } from 'react-redux';
|
||||
import { withRouter } from "react-router";
|
||||
import { IconButton, Text } from 'asc-web-components';
|
||||
import { IconButton, Text, utils } from 'asc-web-components';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import {typeUser, typeGuest } from './../../../../../helpers/customNames';
|
||||
|
||||
@ -13,6 +13,10 @@ const Wrapper = styled.div`
|
||||
|
||||
const Header = styled(Text.ContentHeader)`
|
||||
margin-left: 16px;
|
||||
max-width: calc(100vw - 430px);
|
||||
@media ${utils.device.tablet} {
|
||||
max-width: calc(100vw - 64px);
|
||||
}
|
||||
`;
|
||||
|
||||
const SectionHeaderContent = (props) => {
|
||||
@ -35,7 +39,7 @@ const SectionHeaderContent = (props) => {
|
||||
return (
|
||||
<Wrapper>
|
||||
<IconButton iconName={'ArrowPathIcon'} size="16" onClick={onClick}/>
|
||||
<Header>{headerText}</Header>
|
||||
<Header truncate={true}>{headerText}</Header>
|
||||
</Wrapper>
|
||||
);
|
||||
};
|
||||
|
Loading…
Reference in New Issue
Block a user