Set the standalone search bar height in the SearchBar component (#1521)

* Set the standalone search bar height in the SearchBar component

* Update the .pot file

* Add missing snapshots

* Update the pot file

* Add snapshots in the correct dir

src/components/VHeader/VSearchBar/VSearchBar.vue

@@ -1,6 +1,7 @@
 <template>
   <form
     class="search-bar group flex flex-row items-center bg-white rounded-sm"
+    :class="{ 'h-[57px] md:h-[69px]': size === 'standalone' }"
     @submit.prevent="handleSearch"
   >
     <VInputField

src/locales/po-files/openverse.pot

@@ -4,7 +4,7 @@ msgid ""
 msgstr ""
 "Project-Id-Version: Openverse \n"
 "Report-Msgid-Bugs-To: https://github.com/wordpress/openverse/issues \n"
-"POT-Creation-Date: 2022-06-15T20:45:14+00:00\n"
+"POT-Creation-Date: 2022-06-16T13:55:29+00:00\n"
 "MIME-Version: 1.0\n"
 "Content-Type: text/plain; charset=UTF-8\n"
 "Content-Transfer-Encoding: 8bit\n"
@@ -236,7 +236,7 @@ msgid "Search"
 msgstr ""
 
 #. Do not translate words between ### ###.
-#: src/components/VHeader/VSearchBar/VSearchBar.vue:12
+#: src/components/VHeader/VSearchBar/VSearchBar.vue:13
 msgctxt "search.search-bar-label"
 msgid "Search for content in ###openverse###"
 msgstr ""
@@ -2012,7 +2012,7 @@ msgctxt "hero.disclaimer.license"
 msgid "Creative Commons license"
 msgstr ""
 
-#: src/components/VHeader/VSearchBar/VSearchBar.vue:7
+#: src/components/VHeader/VSearchBar/VSearchBar.vue:8
 msgctxt "hero.search.placeholder"
 msgid "Search for content"
 msgstr ""

src/pages/index.vue

@@ -43,7 +43,7 @@
         </div>
         <VSearchBar
           v-model.trim="searchTerm"
-          class="max-w-[40rem] mt-4 lg:mt-8 group h-[57px] md:h-[69px]"
+          class="max-w-[40rem] mt-4 lg:mt-8 group"
           size="standalone"
           @submit="handleSearch"
         >

test/playwright/visual-regression/pages/pages.spec.ts

@@ -4,7 +4,13 @@ import breakpoints from '~~/test/playwright/utils/breakpoints'
 import { removeHiddenOverflow } from '~~/test/playwright/utils/page'
 import { dismissTranslationBanner } from '~~/test/playwright/utils/navigation'
 
-const contentPages = ['extension', 'about', 'meta-search', 'search-help']
+const contentPages = [
+  'extension',
+  'about',
+  'meta-search',
+  'search-help',
+  'non-existent',
+]
 for (const contentPage of contentPages) {
   test.describe(`${contentPage} page snapshots`, () => {
     test.describe('ltr', () => {