Replace films page H2 by Studio Ghibli logo

pages/films/index.vue

@@ -1,8 +1,10 @@
 <template>
   <section class="py-4">
-    <h2 class="text-3xl font-normal mx-auto block text-center mb-4">
-      Ghibli films
-    </h2>
+    <img
+      class="w-full max-w-md mx-auto mb-8"
+      src="~/assets/images/logo.png"
+      alt="Studio Ghibli"
+    />
     <Grid :dataSource="films" />
   </section>
 </template>

test/index.spec.js

@@ -10,7 +10,7 @@ jest.mock("axios", () => ({
 describe("Films page", () => {
   it("should render Films page instance", () => {
     const wrapper = mount(FilmsView);
-    expect(wrapper.find("h2").text()).toBe("Ghibli films");
+    expect(wrapper.find("img").exists()).toBe(true);
   });
 
   it("should get films from Ghibli API", async () => {