Updated snapshot

tests/unit/component-tests/community-component-tests/__snapshots__/item-card.spec.js.snap

@@ -2,13 +2,13 @@
 
 exports[`ItemCard component renders correctly 1`] = `
 <div
-  class="mt-5"
+  class="mt-5 px-5"
 >
   <div
-    class="w-[80%] h-full rounded bg-gray-200 overflow-hidden display:inline-block correct-size"
+    class="w-full h-full rounded bg-gray-200 overflow-hidden display:inline-block correct-size"
   >
     <div
-      class="relative h-0 pb-[66%]"
+      class="relative h-0 pb-[66.7%]"
     >
       <img
         alt="Item image"
@@ -19,12 +19,6 @@ exports[`ItemCard component renders correctly 1`] = `
     <div
       class="p-1 m-1 bottom-0"
     >
-      <p
-        class="text-gray-700 text-xs font-bold"
-        id="adress"
-      >
-        String
-      </p>
       <p
         class="font-bold text-sm"
         id="title"
@@ -37,6 +31,12 @@ exports[`ItemCard component renders correctly 1`] = `
       >
         0 kr 
       </p>
+      <p
+        class="text-gray-700 text-xs font-bold"
+        id="adress"
+      >
+        String
+      </p>
     </div>
   </div>
 </div>

tests/unit/component-tests/user-component-tests/__snapshots__/login-form.spec.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`LoginForm component renders correctly 1`] = `
+<div
+  class="md:ring-1 ring-gray-300 rounded-xl overflow-hidden mx-auto mb-auto max-w-md w-full"
+>
+  <div
+    class="px-6 py-4 mt-4"
+  >
+    <div
+      class="text-xl md:text-2xl font-medium text-center text-primary-light mt-4 mb-8"
+    >
+       Logg på 
+    </div>
+    <div>
+      <div
+        class="w-full mt-6"
+      >
+        <input
+          class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-primary-light dark:focus:border-primary-light focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-primary-light"
+          placeholder="Skriv inn din e-postadresse *"
+          required=""
+          type="email"
+        />
+        <!-- error message -->
+        
+        
+      </div>
+      <div
+        class="w-full mt-6"
+      >
+        <input
+          class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-primary-light dark:focus:border-primary-light focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-primary-light"
+          placeholder="Vennligst oppgi passordet ditt *"
+          required=""
+          type="password"
+        />
+        <!-- error message -->
+        
+        
+      </div>
+      <div
+        class="flex items-center justify-between mt-8"
+      >
+        <router-link
+          class="text-primary-medium"
+          to="/resetPassword"
+        >
+          Glemt passord?
+        </router-link>
+        <button
+          class="block text-white bg-primary-medium hover:bg-primary-dark focus:ring-4 focus:outline-none focus:ring-primary-light font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-medium dark:hover:bg-primary-dark dark:focus:ring-primary-light"
+        >
+          Logg på
+        </button>
+      </div>
+    </div>
+  </div>
+  <div
+    class="flex items-center justify-center py-4 text-center bg-gray-50 dark:bg-gray-700"
+  >
+    <router-link
+      class="mx-2 text-sm font-bold text-primary-medium dark:text-primary-light hover:underline"
+      to="/register"
+    >
+      Opprette ny konto
+    </router-link>
+  </div>
+  <div
+    class="flex items-center justify-center text-center bg-gray-50"
+  >
+    <label
+      class="mx-2 text-sm font-bold text-error-medium dark:text-primary-light hover:underline"
+    />
+  </div>
+</div>
+`;

tests/unit/component-tests/user-component-tests/__snapshots__/new-password-form.spec.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`NewPasswordForm component renders correctly 1`] = `
+<div
+  class="md:ring-1 ring-gray-300 rounded-xl overflow-hidden mx-auto mb-auto max-w-md w-full p-4"
+>
+  <h3
+    class="text-xl font-medium text-center text-gray-600 dark:text-gray-200 mt-4 mb-8"
+  >
+     Endre passord 
+  </h3>
+  <div
+    class=""
+    id="oldPasswordField"
+  >
+    <label
+      class="block text-sm text-gray-800 dark:text-gray-200"
+      for="oldPassword"
+    >
+      Gammelt passord
+    </label>
+    <input
+      class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+      type="password"
+    />
+    <!-- error message -->
+    
+    
+  </div>
+  <div
+    class="mt-4"
+    id="firstPasswordField"
+  >
+    <label
+      class="block text-sm text-gray-800 dark:text-gray-200"
+      for="password"
+    >
+      Nytt passord
+    </label>
+    <input
+      class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+      type="password"
+    />
+    <!-- error message -->
+    
+    
+  </div>
+  <div
+    class="mt-4"
+    id="secondPasswordField"
+  >
+    <div
+      class="flex items-center justify-between"
+    >
+      <label
+        class="block text-sm text-gray-800 dark:text-gray-200"
+        for="rePassword"
+      >
+        Gjenta nytt passord
+      </label>
+    </div>
+    <input
+      class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+      type="password"
+    />
+    <!-- error message -->
+    
+    
+  </div>
+  <div
+    class="mt-6"
+    id="buttonsField"
+  >
+    <button
+      class="block text-white bg-primary-medium hover:bg-primary-dark focus:ring-4 focus:outline-none focus:ring-primary-light font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-medium dark:hover:bg-primary-dark dark:focus:ring-primary-light float-right"
+    >
+      Sett ny passord
+    </button>
+  </div>
+  <div
+    class="flex items-center justify-center text-center bg-gray-50"
+  >
+    <label
+      class="mx-2 text-sm font-bold text-error-medium dark:text-primary-light hover:underline"
+    />
+  </div>
+</div>
+`;

tests/unit/component-tests/user-component-tests/__snapshots__/rating.spec.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Rating component renders correctly 1`] = `
+<ul
+  class="flex justify-center"
+>
+  <li>
+    <p
+      class="ml-2 text-sm font-medium text-gray-500 dark:text-gray-400"
+    >
+      :  
+    </p>
+  </li>
+  <li>
+    <p
+      class="ml-2 text-sm font-medium text-gray-500 dark:text-gray-400"
+    >
+       Ingen vurderinger 
+    </p>
+  </li>
+</ul>
+`;

tests/unit/component-tests/user-component-tests/__snapshots__/register-user-component.spec.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`RegisterFormComponent renders correctly 1`] = `
+<div
+  class="w-full max-w-md mx-auto mb-auto md:ring-1 ring-gray-300 overflow-hidden rounded-xl p-4"
+>
+  <div
+    class="text-xl md:text-2xl font-medium text-center text-primary-light mt-4 mb-8"
+    id="registerLabel"
+  >
+     Opprett ny konto 
+  </div>
+  <form>
+    <div
+      class="grid grid-cols-1 gap-6 mt-4"
+    >
+      <div>
+        <input
+          class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-primary-light dark:focus:border-primary-light focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-primary-light"
+          id="email"
+          placeholder="E-post adresse"
+          type="email"
+        />
+        <!-- error message -->
+        
+        
+      </div>
+      <div>
+        <input
+          class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-primary-light dark:focus:border-primary-light focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-primary-light"
+          id="password"
+          placeholder="Passord"
+          type="password"
+        />
+        <!-- error message -->
+        
+        
+      </div>
+      <div>
+        <input
+          class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-primary-light dark:focus:border-primary-light focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-primary-light"
+          id="confirmPassword"
+          placeholder="Bekreft passord"
+          type="password"
+        />
+        <!-- error message -->
+        
+        
+      </div>
+      <div>
+        <input
+          class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-primary-light dark:focus:border-primary-light focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-primary-light"
+          data-test="firstNameTest"
+          id="firstName"
+          placeholder="Fornavn"
+          type="text"
+        />
+        <!-- error message -->
+        
+        
+      </div>
+      <div>
+        <input
+          class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-primary-light dark:focus:border-primary-light focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-primary-light"
+          id="lastName"
+          placeholder="Etternavn"
+          type="text"
+        />
+        <!-- error message -->
+        
+        
+      </div>
+      <div>
+        <input
+          class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-primary-light dark:focus:border-primary-light focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-primary-light"
+          id="address"
+          placeholder="Adresse"
+          type="text"
+        />
+        <!-- error message -->
+        
+        
+      </div>
+    </div>
+    <div
+      class="flex justify-end mt-6"
+    >
+      <button
+        class="block text-white bg-primary-medium hover:bg-primary-dark focus:ring-4 focus:outline-none focus:ring-primary-light font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-medium dark:hover:bg-primary-dark dark:focus:ring-primary-light"
+      >
+        Opprett
+      </button>
+    </div>
+  </form>
+</div>
+`;

tests/unit/component-tests/user-component-tests/__snapshots__/reset-password-form.spec.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ResetPasswordForm component renders correctly 1`] = `
+<div
+  class="md:ring-1 ring-gray-300 rounded-xl overflow-hidden mx-auto mb-auto max-w-md w-full p-4"
+>
+  <h3
+    class="text-xl font-medium text-center text-primary-light mt-4 mb-8"
+  >
+     Glemt passordet ditt? 
+  </h3>
+  <div
+    class="m-6"
+    id="emailField"
+  >
+    <div
+      class="mb-6"
+    >
+      <label
+        class="block mb-2 text-sm font-medium text-gray-900 dark:text-gray-300"
+        for="email"
+      >
+        E-post
+      </label>
+      <input
+        class="block w-full px-4 py-2 mt-2 text-gray-700 placeholder-gray-500 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-400 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:outline-none focus:ring focus:ring-blue-300"
+        id="email"
+        placeholder="eksempel@eksempel.no"
+        required=""
+        type="email"
+      />
+      <!-- error message -->
+      
+      
+    </div>
+    <button
+      class="block text-white bg-primary-medium hover:bg-primary-dark focus:ring-4 focus:outline-none focus:ring-primary-light font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-medium dark:hover:bg-primary-dark dark:focus:ring-primary-light float-right"
+    >
+      Tilbakestill passord
+    </button>
+  </div>
+</div>
+`;

tests/unit/component-tests/user-component-tests/__snapshots__/user-items.spec.js.snap

+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`UserItems component renders correctly 1`] = `
+<div
+  data-v-app=""
+>
+  
+  <div
+    class="text-xl md:text-2xl text-primary-light font-medium"
+    id="headline"
+  >
+     Mine gjenstander 
+  </div>
+  <!-- Search field -->
+  <div
+    class="relative"
+    id="searchComponent"
+  >
+    <span
+      class="absolute inset-y-0 left-0 flex items-center pl-3"
+    >
+      <svg
+        class="w-5 h-5 text-gray-400"
+        fill="none"
+        viewBox="0 0 24 24"
+      >
+        <path
+          d="M21 21L15 15M17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z"
+          stroke="currentColor"
+          stroke-linecap="round"
+          stroke-linejoin="round"
+          stroke-width="2"
+        />
+      </svg>
+    </span>
+    <input
+      class="w-full py-3 pl-10 pr-4 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-primary-medium dark:focus:border-primary-medium focus:outline-none focus:ring"
+      id="searchInput"
+      placeholder="Search"
+      type="text"
+    />
+  </div>
+  <div
+    class="absolute inset-x-0 px-5 py-3"
+  >
+    <!-- ItemCards -->
+    <div
+      class="flex items-center justify-center w-screen"
+    >
+      <!-- Shows items based on pagination -->
+      <div
+        class="grid grid-flow-row-dense grid-cols-2 md:grid-cols-4 lg:grid-cols-5 w-full"
+      >
+        
+        
+        
+        <!-- Main modal -->
+        <!--v-if-->
+        
+      </div>
+      <!-- Shows items based on search field input -->
+      <!--v-if-->
+    </div>
+    <!-- pagination -->
+    <div
+      class="flex justify-center"
+    >
+      <div
+        class="mt-10"
+      >
+        <!--v-if-->
+        <label
+          class="mx-2 text-primary-light"
+        >
+          1 av 1
+        </label>
+        <!--v-if-->
+      </div>
+    </div>
+  </div>
+  
+</div>
+`;