IlyaSobolev/DocSpace-client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

styles for webhooks history and webhook details pages were fixed

Browse Source
This commit is contained in:
Vladimir Khvan 2023-10-05 23:57:08 +05:00
parent 77949b5cb1
commit 4ddae7d546
3 changed files with 25 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/WebhookEventDetails/sub-components/DetailsNavigationHeader.js
View File

@ -13,7 +13,7 @@ import RetryIcon from "PUBLIC_DIR/images/refresh.react.svg?url";
import Headline from "@docspace/common/components/Headline";
import IconButton from "@docspace/components/icon-button";
import { tablet } from "@docspace/components/utils/device";
import { tablet, hugeMobile } from "@docspace/components/utils/device";
import { useTranslation } from "react-i18next";
import { useParams } from "react-router-dom";
@ -39,14 +39,21 @@ const HeaderContainer = styled.div`
}
svg {
${({ theme }) =>
theme.interfaceDirection === "rtl" && "transform: scaleX(-1);"}
${({ theme }) => theme.interfaceDirection === "rtl" && "transform: scaleX(-1);"}
}
}
.headline {
font-size: 18px;
margin-inline-end: 16px;
@media ${tablet} {
font-size: 21px;
}
@media ${hugeMobile} {
font-size: 18px;
}
}
`;

12
packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/WebhookHistory/sub-components/HistoryFilterHeader.js
View File

@ -19,15 +19,9 @@ const ListHeader = styled.header`
justify-content: space-between;
align-items: center;
${() =>
isMobile &&
css`
margin-top: 9px;
`}
${() =>
isMobileOnly &&
css`
margin-top: 35px;
padding-inline-end: 8px;
`}
`;
@ -54,8 +48,7 @@ const FilterButton = styled.div`
z-index: ${(props) => (props.isGroupMenuVisible ? 199 : 201)};
border: 1px solid;
border-color: ${(props) =>
props.theme.isBase ? "#d0d5da" : "rgb(71, 71, 71)"};
border-color: ${(props) => (props.theme.isBase ? "#d0d5da" : "rgb(71, 71, 71)")};
border-radius: 3px;
cursor: pointer;
@ -111,8 +104,7 @@ const HistoryFilterHeader = (props) => {
<FilterButton
id="filter-button"
onClick={openFiltersModal}
isGroupMenuVisible={isGroupMenuVisible}
>
isGroupMenuVisible={isGroupMenuVisible}>
<IconButton iconName={FilterReactSvrUrl} size={16} />
<span hidden={historyFilters === null}></span>
</FilterButton>

21
packages/client/src/pages/PortalSettings/categories/developer-tools/Webhooks/WebhookHistory/sub-components/HistoryHeader.js
View File

@ -10,7 +10,7 @@ import Headline from "@docspace/common/components/Headline";
import IconButton from "@docspace/components/icon-button";
// import { Hint } from "../../styled-components";
import { tablet } from "@docspace/components/utils/device";
import { tablet, hugeMobile } from "@docspace/components/utils/device";
import TableGroupMenu from "@docspace/components/table-container/TableGroupMenu";
import { isMobile, isMobileOnly } from "react-device-detect";
@ -30,7 +30,7 @@ const HeaderContainer = styled.div`
display: flex;
align-items: center;
width: 100%;
min-height: 70px;
min-height: 53px;
flex-wrap: wrap;
${() =>
@ -65,14 +65,20 @@ const HeaderContainer = styled.div`
`}
svg {
${({ theme }) =>
theme.interfaceDirection === "rtl" && "transform: scaleX(-1);"}
${({ theme }) => theme.interfaceDirection === "rtl" && "transform: scaleX(-1);"}
}
}
.headline {
font-size: 18px;
margin-inline-end: 16px;
@media ${tablet} {
font-size: 21px;
}
@media ${hugeMobile} {
font-size: 18px;
}
}
.table-container_group-menu {
@ -107,7 +113,7 @@ const HeaderContainer = styled.div`
css`
position: absolute;
height: 48px;
margin-block: -35px 0;
margin-block: -17px 0;
margin-inline: -17px 0;
width: calc(100% + 32px);
`}
@ -161,7 +167,7 @@ const HistoryHeader = (props) => {
});
toastr.success(
`${t("WebhookRedilivered")}: ${checkedEventIds.length}`,
<b>{t("Common:Done")}</b>
<b>{t("Common:Done")}</b>,
);
} catch (error) {
console.log(error);
@ -181,8 +187,7 @@ const HistoryHeader = (props) => {
},
];
const onKeyPress = (e) =>
(e.key === "Esc" || e.key === "Escape") && emptyCheckedIds();
const onKeyPress = (e) => (e.key === "Esc" || e.key === "Escape") && emptyCheckedIds();
useEffect(() => {
window.addEventListener("keyup", onKeyPress);