diff --git a/assets/components/actors/actors.vue b/assets/components/actors/actors.vue index f38894b21..ecbed75c5 100644 --- a/assets/components/actors/actors.vue +++ b/assets/components/actors/actors.vue @@ -116,7 +116,7 @@ export default { .tiles { display: grid; - grid-template-columns: repeat(auto-fit, minmax(10rem, .5fr)); + grid-template-columns: repeat(auto-fit, 10rem); grid-gap: 0 .5rem; padding: 1rem; flex-grow: 1; @@ -127,10 +127,11 @@ export default { justify-content: center; align-items: center; padding: 0 1rem; - margin: 1rem 0 0 0; + margin: 1rem 0; } .genders { + flex-shrink: 0; padding: 0 .5rem 0 0; border-right: solid 1px $shadow-hint; margin: 0 1rem 0 0; @@ -186,7 +187,7 @@ export default { } @media(max-width: $breakpoint) { - .actors { + .tiles { grid-template-columns: repeat(auto-fit, minmax(8rem, 1fr)); } } diff --git a/assets/components/tags/tags.vue b/assets/components/tags/tags.vue index 0f4f1b02f..e255a080c 100644 --- a/assets/components/tags/tags.vue +++ b/assets/components/tags/tags.vue @@ -147,7 +147,19 @@ export default { .tiles { display: grid; - grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); + grid-template-columns: repeat(auto-fit, minmax(20rem, .25fr)); grid-gap: .5rem; } + +@media(max-width: $breakpoint3) { + .tiles { + grid-template-columns: repeat(auto-fit, minmax(20rem, .5fr)); + } +} + +@media(max-width: $breakpoint) { + .tiles { + grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); + } +} diff --git a/assets/components/tile/release.vue b/assets/components/tile/release.vue index 205d8849f..0468284cc 100644 --- a/assets/components/tile/release.vue +++ b/assets/components/tile/release.vue @@ -48,8 +48,10 @@ >{{ `(${formatDate(release.dateAdded, 'MMM D, YYYY')})` }} - No thumbnail available - +
-

{{ release.title }}

-
+