Client:QuickButtons:Fix styles.
This commit is contained in:
parent
540693ac29
commit
db1738c2f2
@ -136,9 +136,7 @@ const StyledTableRow = styled(TableRow)`
|
|||||||
`}
|
`}
|
||||||
}
|
}
|
||||||
|
|
||||||
.table-container_element-wrapper,
|
.table-container_element-wrapper {
|
||||||
.table-container_quick-buttons-wrapper {
|
|
||||||
padding-inline-end: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.table-container_element-wrapper,
|
.table-container_element-wrapper,
|
||||||
@ -306,7 +304,10 @@ const StyledBadgesContainer = styled.div`
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
const StyledQuickButtonsContainer = styled.div`
|
const StyledQuickButtonsContainer = styled.div`
|
||||||
width: 100%;
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
flex-grow: 1;
|
||||||
|
|
||||||
.badges {
|
.badges {
|
||||||
display: flex;
|
display: flex;
|
||||||
@ -315,11 +316,7 @@ const StyledQuickButtonsContainer = styled.div`
|
|||||||
}
|
}
|
||||||
|
|
||||||
.badge {
|
.badge {
|
||||||
padding: 12px 7px;
|
padding: 12px 8px;
|
||||||
}
|
|
||||||
|
|
||||||
.badge:last-child {
|
|
||||||
margin-inline-end: 3px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.lock-file {
|
.lock-file {
|
||||||
|
@ -50,24 +50,6 @@ const contextCss = css`
|
|||||||
`;
|
`;
|
||||||
|
|
||||||
const StyledTableContainer = styled(TableContainer)`
|
const StyledTableContainer = styled(TableContainer)`
|
||||||
.badges__quickButtons {
|
|
||||||
display: flex;
|
|
||||||
flex-grow: 1;
|
|
||||||
justify-content: flex-end;
|
|
||||||
|
|
||||||
.badge {
|
|
||||||
padding-left: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.badge:first-child {
|
|
||||||
padding-left: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.badge:last-child {
|
|
||||||
padding-right: 8px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.table-row-selected {
|
.table-row-selected {
|
||||||
.table-container_file-name-cell {
|
.table-container_file-name-cell {
|
||||||
${fileNameCss}
|
${fileNameCss}
|
||||||
|
@ -33,10 +33,7 @@ import AuthorCell from "./AuthorCell";
|
|||||||
import DateCell from "./DateCell";
|
import DateCell from "./DateCell";
|
||||||
import SizeCell from "./SizeCell";
|
import SizeCell from "./SizeCell";
|
||||||
import { classNames, getLastColumn } from "@docspace/shared/utils";
|
import { classNames, getLastColumn } from "@docspace/shared/utils";
|
||||||
import {
|
import { StyledBadgesContainer } from "../StyledTable";
|
||||||
StyledBadgesContainer,
|
|
||||||
StyledQuickButtonsContainer,
|
|
||||||
} from "../StyledTable";
|
|
||||||
|
|
||||||
const RecentRowDataComponent = (props) => {
|
const RecentRowDataComponent = (props) => {
|
||||||
const {
|
const {
|
||||||
@ -213,26 +210,6 @@ const RecentRowDataComponent = (props) => {
|
|||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
)}
|
)}
|
||||||
{/* {quickButtonsColumnIsEnabled ? (
|
|
||||||
<TableCell
|
|
||||||
style={
|
|
||||||
!quickButtonsColumnIsEnabled
|
|
||||||
? { background: "none" }
|
|
||||||
: dragStyles.style
|
|
||||||
}
|
|
||||||
{...selectionProp}
|
|
||||||
className={classNames(
|
|
||||||
selectionProp?.className,
|
|
||||||
"table-container_quick-buttons-wrapper",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<StyledQuickButtonsContainer>
|
|
||||||
{quickButtonsComponent}
|
|
||||||
</StyledQuickButtonsContainer>
|
|
||||||
</TableCell>
|
|
||||||
) : (
|
|
||||||
<div />
|
|
||||||
)} */}
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -85,7 +85,13 @@ const RoomsRowDataComponent = (props) => {
|
|||||||
<StyledBadgesContainer showHotkeyBorder={showHotkeyBorder}>
|
<StyledBadgesContainer showHotkeyBorder={showHotkeyBorder}>
|
||||||
{badgesComponent}
|
{badgesComponent}
|
||||||
</StyledBadgesContainer>
|
</StyledBadgesContainer>
|
||||||
{lastColumn === "Name" ? quickButtonsComponent : <></>}
|
{lastColumn === "Name" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
|
|
||||||
{roomColumnTypeIsEnabled ? (
|
{roomColumnTypeIsEnabled ? (
|
||||||
@ -105,7 +111,13 @@ const RoomsRowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Type" ? quickButtonsComponent : <></>}
|
{lastColumn === "Type" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
@ -124,7 +136,13 @@ const RoomsRowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Tags" ? quickButtonsComponent : <></>}
|
{lastColumn === "Tags" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
@ -147,7 +165,13 @@ const RoomsRowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Owner" ? quickButtonsComponent : <></>}
|
{lastColumn === "Owner" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
@ -170,7 +194,13 @@ const RoomsRowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Activity" ? quickButtonsComponent : <></>}
|
{lastColumn === "Activity" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
@ -183,32 +213,17 @@ const RoomsRowDataComponent = (props) => {
|
|||||||
type="room"
|
type="room"
|
||||||
isReadOnly={!item?.security?.EditRoom}
|
isReadOnly={!item?.security?.EditRoom}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Storage" ? quickButtonsComponent : <></>}
|
{lastColumn === "Storage" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
))}
|
))}
|
||||||
|
|
||||||
{/* {roomColumnQuickButtonsIsEnabled ? (
|
|
||||||
<TableCell
|
|
||||||
style={
|
|
||||||
!roomColumnQuickButtonsIsEnabled
|
|
||||||
? { background: "none" }
|
|
||||||
: dragStyles.style
|
|
||||||
}
|
|
||||||
{...selectionProp}
|
|
||||||
className={classNames(
|
|
||||||
selectionProp?.className,
|
|
||||||
"table-container_quick-buttons-wrapper",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<StyledQuickButtonsContainer>
|
|
||||||
{quickButtonsComponent}
|
|
||||||
</StyledQuickButtonsContainer>
|
|
||||||
</TableCell>
|
|
||||||
) : (
|
|
||||||
<div />
|
|
||||||
)} */}
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -84,7 +84,13 @@ const RowDataComponent = (props) => {
|
|||||||
<StyledBadgesContainer showHotkeyBorder={showHotkeyBorder}>
|
<StyledBadgesContainer showHotkeyBorder={showHotkeyBorder}>
|
||||||
{badgesComponent}
|
{badgesComponent}
|
||||||
</StyledBadgesContainer>
|
</StyledBadgesContainer>
|
||||||
{lastColumn === "Name" ? quickButtonsComponent : <></>}
|
{lastColumn === "Name" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
|
|
||||||
{authorColumnIsEnabled ? (
|
{authorColumnIsEnabled ? (
|
||||||
@ -102,7 +108,13 @@ const RowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Author" ? quickButtonsComponent : <></>}
|
{lastColumn === "Author" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
@ -126,7 +138,13 @@ const RowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Created" ? quickButtonsComponent : <></>}
|
{lastColumn === "Created" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
@ -147,7 +165,13 @@ const RowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Modified" ? quickButtonsComponent : <></>}
|
{lastColumn === "Modified" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
@ -168,7 +192,13 @@ const RowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Size" ? quickButtonsComponent : <></>}
|
{lastColumn === "Size" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
@ -191,31 +221,17 @@ const RowDataComponent = (props) => {
|
|||||||
sideColor={theme.filesSection.tableView.row.sideColor}
|
sideColor={theme.filesSection.tableView.row.sideColor}
|
||||||
{...props}
|
{...props}
|
||||||
/>
|
/>
|
||||||
{lastColumn === "Type" ? quickButtonsComponent : <></>}
|
{lastColumn === "Type" ? (
|
||||||
|
<StyledQuickButtonsContainer>
|
||||||
|
{quickButtonsComponent}
|
||||||
|
</StyledQuickButtonsContainer>
|
||||||
|
) : (
|
||||||
|
<></>
|
||||||
|
)}
|
||||||
</TableCell>
|
</TableCell>
|
||||||
) : (
|
) : (
|
||||||
<div />
|
<div />
|
||||||
)}
|
)}
|
||||||
{/* {quickButtonsColumnIsEnabled ? (
|
|
||||||
<TableCell
|
|
||||||
style={
|
|
||||||
!quickButtonsColumnIsEnabled
|
|
||||||
? { background: "none" }
|
|
||||||
: dragStyles.style
|
|
||||||
}
|
|
||||||
{...selectionProp}
|
|
||||||
className={classNames(
|
|
||||||
selectionProp?.className,
|
|
||||||
"table-container_quick-buttons-wrapper",
|
|
||||||
)}
|
|
||||||
>
|
|
||||||
<StyledQuickButtonsContainer>
|
|
||||||
{quickButtonsComponent}
|
|
||||||
</StyledQuickButtonsContainer>
|
|
||||||
</TableCell>
|
|
||||||
) : (
|
|
||||||
<div />
|
|
||||||
)} */}
|
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -33,10 +33,7 @@ import AuthorCell from "./AuthorCell";
|
|||||||
import DateCell from "./DateCell";
|
import DateCell from "./DateCell";
|
||||||
import SizeCell from "./SizeCell";
|
import SizeCell from "./SizeCell";
|
||||||
import { classNames, getLastColumn } from "@docspace/shared/utils";
|
import { classNames, getLastColumn } from "@docspace/shared/utils";
|
||||||
import {
|
import { StyledBadgesContainer } from "../StyledTable";
|
||||||
StyledBadgesContainer,
|
|
||||||
StyledQuickButtonsContainer,
|
|
||||||
} from "../StyledTable";
|
|
||||||
import ErasureCell from "./ErasureCell";
|
import ErasureCell from "./ErasureCell";
|
||||||
import RoomCell from "./RoomCell";
|
import RoomCell from "./RoomCell";
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user