create single page of courses

components/product-page/attended-courses/Chats.vue

@@ -0,0 +1,51 @@
+<template>
+          
+    <div class="flex items-center gap-[3vw] md:gap-[0.7vw] mt-[15vw] md:mt-[7vw]">
+        <svg
+        class="w-[1.538vw] md:w-[0.521vw] h-[8.462vw] md:h-[2.76vw]"
+          viewBox="0 0 10 53"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <path
+            d="M0 5C0 2.23858 2.23858 0 5 0H10V53H5C2.23858 53 0 50.7614 0 48V5Z"
+            fill="#0D3F40"
+          />
+        </svg>
+        <span class="text-[4.544vw] md:text-[1.481vw] font-semibold">پرسش و پاسخ</span>
+      </div>
+      <div class="bg-[#F8F8F8] p-[4vw] md:p-[1vw] rounded-[3.846vw] md:rounded-[0.781vw] mt-[6vw] md:mt-[2vw]">
+        <div class="space-y-[5vw] md:space-y-[1vw]">
+          <div class="flex gap-[1vw]">
+            <img
+              src="/public/images/client1.png"
+              alt=""
+              class="h-[10.256vw0] md:h-[3.385vw] w-[10.256vw] md:w-[3.385vw] rounded-[50%]"
+            />
+            <div class="space-y-[4vw] mt-[1vw] md:mt-0 ms-[1vw] md:ms-0 md:space-y-0">
+              <p class="text-[3.59vw] md:text-[0.938vw]">علی مصلحی</p>
+              <p class="text-[2.836vw] md:text-[0.741vw] text-[#878787]">پرسش جدید</p>
+            </div>
+          </div>
+          <textarea
+            class="h-[50vw] md:h-[18vw] w-full rounded-[3.846vw] md:rounded-[0.781vw] p-[1vw]"
+            name=""
+            id=""
+            cols="30"
+            rows="10"
+          ></textarea>
+          <div class="flex justify-end gap-[1vw] text-[3.19vw] md:text-[0.833vw] text-white">
+            <button
+              class="h-[8.974vw] md:h-[2.292vw] w-[20.769vw] md:w-[5.573vw] rounded-[2.051vw] md:rounded-[0.521vw] bg-[#5A6268]"
+            >
+              حذف
+            </button>
+            <button
+              class="h-[8.974vw] md:h-[2.292vw] w-[20.769vw] md:w-[5.573vw] rounded-[2.051vw] md:rounded-[0.521vw] bg-primaryGreen"
+            >
+              ثبت
+            </button>
+          </div>
+        </div>
+      </div>
+</template>