TerribleDev/ente
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Inline

Browse Source
This commit is contained in:
Manav Rathi
2024-09-19 19:10:02 +05:30
parent 6a8ca4c2cf
commit 4b7104bf4e
2 changed files with 20 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
web/apps/photos/src/components/Collections/CollectionListBar.tsx
View File

@@ -14,11 +14,11 @@ import PeopleIcon from "@mui/icons-material/People";
import PushPin from "@mui/icons-material/PushPin";
import { Box, IconButton, Typography, styled } from "@mui/material";
import Tooltip from "@mui/material/Tooltip";
import { CollectionTile } from "components/Collections/styledComponents";
import {
CollectionListBarWrapper,
CollectionListWrapper,
CollectionTile,
} from "components/Collections/styledComponents";
IMAGE_CONTAINER_MAX_WIDTH,
MIN_COLUMNS,
} from "components/PhotoList/constants";
import { t } from "i18next";
import memoize from "memoize-one";
import React, { useEffect, useRef, useState } from "react";
@@ -193,6 +193,22 @@ export const CollectionListBar: React.FC<CollectionListBarProps> = ({
);
};
const CollectionListWrapper = styled(Box)`
position: relative;
overflow: hidden;
height: 86px;
width: 100%;
`;
const CollectionListBarWrapper = styled(Box)`
padding: 0 24px;
@media (max-width: ${IMAGE_CONTAINER_MAX_WIDTH * MIN_COLUMNS}px) {
padding: 0 4px;
}
margin-bottom: 16px;
border-bottom: 1px solid ${({ theme }) => theme.palette.divider};
`;
interface ItemData {
collectionSummaries: CollectionSummary[];
activeCollectionID?: number;

19
web/apps/photos/src/components/Collections/styledComponents.ts
View File

@@ -1,25 +1,6 @@
import { Overlay } from "@ente/shared/components/Container";
import { Box, styled } from "@mui/material";
import {
IMAGE_CONTAINER_MAX_WIDTH,
MIN_COLUMNS,
} from "components/PhotoList/constants";
export const CollectionListWrapper = styled(Box)`
position: relative;
overflow: hidden;
height: 86px;
width: 100%;
`;
export const CollectionListBarWrapper = styled(Box)`
padding: 0 24px;
@media (max-width: ${IMAGE_CONTAINER_MAX_WIDTH * MIN_COLUMNS}px) {
padding: 0 4px;
}
margin-bottom: 16px;
border-bottom: 1px solid ${({ theme }) => theme.palette.divider};
`;
export const CollectionInfoBarWrapper = styled(Box)`
width: 100%;