diff --git a/ui/v2.5/src/components/Galleries/GalleryCard.tsx b/ui/v2.5/src/components/Galleries/GalleryCard.tsx index 5a72a737c..933278b8b 100644 --- a/ui/v2.5/src/components/Galleries/GalleryCard.tsx +++ b/ui/v2.5/src/components/Galleries/GalleryCard.tsx @@ -111,7 +111,7 @@ export const GalleryCard: React.FC = (props) => { function maybeRenderOrganized() { if (props.gallery.organized) { return ( -
+
diff --git a/ui/v2.5/src/components/Images/ImageCard.tsx b/ui/v2.5/src/components/Images/ImageCard.tsx index 76b490682..e56733643 100644 --- a/ui/v2.5/src/components/Images/ImageCard.tsx +++ b/ui/v2.5/src/components/Images/ImageCard.tsx @@ -50,7 +50,7 @@ export const ImageCard: React.FC = ( function maybeRenderOCounter() { if (props.image.o_counter) { return ( -
+
diff --git a/ui/v2.5/src/components/Movies/MovieCard.tsx b/ui/v2.5/src/components/Movies/MovieCard.tsx index 28a1d8252..423768872 100644 --- a/ui/v2.5/src/components/Movies/MovieCard.tsx +++ b/ui/v2.5/src/components/Movies/MovieCard.tsx @@ -85,12 +85,14 @@ export const MovieCard: FunctionComponent = (props: IProps) => { } details={ - <> - {props.movie.date} -

- -

- +
+ {props.movie.date} + +
} selected={props.selected} selecting={props.selecting} diff --git a/ui/v2.5/src/components/Movies/styles.scss b/ui/v2.5/src/components/Movies/styles.scss index 773b04392..09cfa97da 100644 --- a/ui/v2.5/src/components/Movies/styles.scss +++ b/ui/v2.5/src/components/Movies/styles.scss @@ -17,6 +17,10 @@ .movie-scene-number { text-align: center; } + + &__details { + margin-bottom: 1rem; + } } .movie-images { diff --git a/ui/v2.5/src/components/Performers/PerformerCard.tsx b/ui/v2.5/src/components/Performers/PerformerCard.tsx index 115ba8363..937a2d81b 100644 --- a/ui/v2.5/src/components/Performers/PerformerCard.tsx +++ b/ui/v2.5/src/components/Performers/PerformerCard.tsx @@ -180,6 +180,22 @@ export const PerformerCard: React.FC = ({ ); } + function maybeRenderFlag() { + if (performer.country) { + return ( + + + + {performer.country} + + + ); + } + } + return ( = ({ /> {maybeRenderFavoriteIcon()} {maybeRenderRatingBanner()} + {maybeRenderFlag()} } details={ <> - {age !== 0 ?
{ageString}
: ""} - - - + {age !== 0 ? ( +
{ageString}
+ ) : ( + "" + )} {maybeRenderPopoverButtonGroup()} } diff --git a/ui/v2.5/src/components/Performers/styles.scss b/ui/v2.5/src/components/Performers/styles.scss index 6ca209092..a36e9263a 100644 --- a/ui/v2.5/src/components/Performers/styles.scss +++ b/ui/v2.5/src/components/Performers/styles.scss @@ -60,6 +60,10 @@ .performer-card { width: 20rem; + .thumbnail-section { + position: relative; + } + &-image { height: 30rem; min-width: 11.25rem; @@ -70,6 +74,7 @@ .flag-icon { bottom: 1rem; + filter: drop-shadow(0 0 2px rgba(0, 0, 0, 0.9)); height: 2rem; position: absolute; right: 1rem; @@ -83,6 +88,15 @@ right: 5px; top: 10px; } + + &__age { + color: $muted-gray; + } + + // allow country string to be shown, but disable by default + &__country-string { + display: none; + } } .card { diff --git a/ui/v2.5/src/components/Scenes/SceneCard.tsx b/ui/v2.5/src/components/Scenes/SceneCard.tsx index 3abd2f1b3..36b99ad8c 100644 --- a/ui/v2.5/src/components/Scenes/SceneCard.tsx +++ b/ui/v2.5/src/components/Scenes/SceneCard.tsx @@ -228,7 +228,7 @@ export const SceneCard: React.FC = ( function maybeRenderOCounter() { if (props.scene.o_counter) { return ( -
+