fix: Sticky archive header

This commit is contained in:
Tom Moor
2021-03-24 18:42:12 -07:00
parent 46912f8ddb
commit 6a7d7af767
2 changed files with 10 additions and 15 deletions

View File

@ -83,6 +83,7 @@ const Wrapper = styled(Flex)`
transition: all 100ms ease-out; transition: all 100ms ease-out;
transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
backdrop-filter: blur(20px); backdrop-filter: blur(20px);
min-height: 56px;
@media print { @media print {
display: none; display: none;

View File

@ -1,27 +1,21 @@
// @flow // @flow
import { observer, inject } from "mobx-react"; import { observer } from "mobx-react";
import { ArchiveIcon } from "outline-icons";
import * as React from "react"; import * as React from "react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import DocumentsStore from "stores/DocumentsStore";
import CenteredContent from "components/CenteredContent";
import Empty from "components/Empty"; import Empty from "components/Empty";
import Heading from "components/Heading"; import Heading from "components/Heading";
import PageTitle from "components/PageTitle";
import PaginatedDocumentList from "components/PaginatedDocumentList"; import PaginatedDocumentList from "components/PaginatedDocumentList";
import Scene from "components/Scene";
import Subheading from "components/Subheading"; import Subheading from "components/Subheading";
import useStores from "hooks/useStores";
type Props = { function Archive() {
documents: DocumentsStore,
};
function Archive(props: Props) {
const { t } = useTranslation(); const { t } = useTranslation();
const { documents } = props; const { documents } = useStores();
return ( return (
<CenteredContent> <Scene icon={<ArchiveIcon color="currentColor" />} title={t("Archive")}>
<PageTitle title={t("Archive")} />
<Heading>{t("Archive")}</Heading> <Heading>{t("Archive")}</Heading>
<PaginatedDocumentList <PaginatedDocumentList
documents={documents.archived} documents={documents.archived}
@ -33,8 +27,8 @@ function Archive(props: Props) {
showCollection showCollection
showTemplate showTemplate
/> />
</CenteredContent> </Scene>
); );
} }
export default inject("documents")(observer(Archive)); export default observer(Archive);