From eae632d0da7be78dc563b4e2a528da97279d67dd Mon Sep 17 00:00:00 2001
From: Kevin Midboe <kevin.midboe@gmail.com>
Date: Tue, 26 Jul 2022 00:31:16 +0200
Subject: [PATCH] Some border radius, increased font size & bold title

---
 src/components/MoviesListItem.vue | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/components/MoviesListItem.vue b/src/components/MoviesListItem.vue
index c7817cd..d7cb9b2 100644
--- a/src/components/MoviesListItem.vue
+++ b/src/components/MoviesListItem.vue
@@ -1,6 +1,6 @@
 <template>
   <li class="movie-item" ref="list-item">
-    <figure class="movie-item__poster" ref="poster" @click="openMoviePopup">
+    <figure ref="poster" class="movie-item__poster" @click="openMoviePopup">
       <img
         class="movie-item__img"
         :alt="posterAltText"
@@ -15,7 +15,9 @@
     </figure>
 
     <div class="movie-item__info">
-      <p v-if="movie.title || movie.name">{{ movie.title || movie.name }}</p>
+      <p v-if="movie.title || movie.name" class="movie-item__title">
+        {{ movie.title || movie.name }}
+      </p>
       <p v-if="movie.year">{{ movie.year }}</p>
       <p v-if="movie.type == 'person'">
         Known for: {{ movie.known_for_department }}
@@ -40,7 +42,7 @@ export default {
   },
   data() {
     return {
-      poster: undefined,
+      poster: null,
       observed: false,
       posterSizes: [
         {
@@ -150,17 +152,18 @@ export default {
 
     img {
       width: 100%;
+      border-radius: 10px;
     }
   }
 
   &__info {
-    padding-top: 15px;
+    padding-top: 10px;
     font-weight: 300;
 
     > p {
       color: $text-color-70;
       margin: 0;
-      font-size: 11px;
+      font-size: 14px;
       letter-spacing: 0.5px;
       transition: color 0.5s ease;
       cursor: pointer;
@@ -172,6 +175,10 @@ export default {
       }
     }
   }
+
+  &__title {
+    font-weight: 400;
+  }
 }
 
 .no-image {