diff --git a/src/routers/photo/item/index.tsx b/src/routers/photo/item/index.tsx
index bd290eb..3d01348 100644
--- a/src/routers/photo/item/index.tsx
+++ b/src/routers/photo/item/index.tsx
@@ -6,6 +6,7 @@ import { Link, styled } from "@mui/material";
import style from "./photo.module.less";
import { ImageBasic } from "@components/image";
import { Omit } from "@utils/index";
+import CollectionsIcon from "@mui/icons-material/Collections";
type CardType = {
data: PhotoRouterImageCardType;
};
@@ -40,16 +41,40 @@ export default function PhotoCard(props: CardType) {
+ {images.length > 1 && (
+
+
+ {images.length}
+
+ )}
);
}
+
+const DivImgNum = styled("div")`
+ position: absolute;
+ right: 0px;
+ top: 0px;
+ padding: 7px;
+ color: white;
+ background-color: rgba(0, 0, 0, 0.4);
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ column-gap: 2px;
+ pointer-events: none;
+`;
+
const DivJump = styled("div")(({ theme }) => ({
borderBottomLeftRadius: "8px",
borderBottomRightRadius: "8px",
position: "absolute",
bottom: "0px",
width: "100%",
- backgroundImage: `linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%)`,
+ backgroundImage: `linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(90, 90,90, 0.8) 100%)`,
+ "&:hover": {
+ backgroundImage: `linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0,0, 0.8) 100%)`,
+ },
[theme.breakpoints.down("sm")]: {
borderBottomLeftRadius: "4px",
borderBottomRightRadius: "4px",
diff --git a/src/routers/photo/item/photo.module.less b/src/routers/photo/item/photo.module.less
index dbf589a..06a560e 100644
--- a/src/routers/photo/item/photo.module.less
+++ b/src/routers/photo/item/photo.module.less
@@ -3,10 +3,6 @@
border-radius: 4px;
.show-img {
- max-width: 100%;
- object-fit: cover;
- height: auto;
- width: 100%;
- border-radius: 4px;
+ min-height: 150px;
}
}
\ No newline at end of file