init git

2024-06-16 00:22:14 +04:30
commit ec84dfd222
322 changed files with 77942 additions and 0 deletions
@@ -0,0 +1,120 @@
+<template>
+    <div class="seller-add-spec">
+        <div>
+            <div>
+                <h2>{{ $t("addSpec") }}</h2>
+                <Button icon="isax isax-close-circle" severity="secondary" rounded link @click="dialog.close()" />
+            </div>
+            <p>{{ dialog.data.title }}</p>
+        </div>
+        <ul>
+            <li>
+                <InputText v-model="form.key" placeholder id="key" />
+                <label for="key">{{ $t('title') }}</label>
+            </li>
+            <li>
+                <Textarea v-model="form.value" placeholder id="value" />
+                <label for="value">{{ $t("description") }}</label>
+            </li>
+        </ul>
+        <Button :label="$t('submitSpec')" @click="add()" />
+    </div>
+</template>
+
+<script setup>
+const dialog = inject('dialogRef')
+const form = reactive({})
+
+const add = () => {
+    dialog.value.data.specs[form.key] = form.value
+    dialog.value.close();
+}
+</script>
+
+<style lang="scss">
+.seller-add-spec {
+    @apply w-full lg:w-[40.1rem] lg:h-[38.6rem] bg-white rounded-t-[0.6rem] lg:rounded-[0.6rem] flex flex-col relative;
+
+    &::after {
+        @apply content-['_'] absolute inset-x-0 bottom-[4.5rem] h-3 shadow-[0px_-2px_5px_#0000000a] lg:shadow-none;
+    }
+
+    &>div {
+        @apply flex flex-col gap-1.5 lg:h-[7.8rem] lg:gap-3 border-b lg:border-b-2 border-[#E5E5E5] p-6 lg:px-10 lg:pt-8 pb-6;
+
+        &>div {
+            @apply flex justify-between items-center;
+
+            h2 {
+                @apply text-[#333333] text-sm lg:text-xl font-bold font-vazir;
+            }
+
+            button {
+                @apply -mx-4 -my-3;
+
+                .p-button-icon {
+                    @apply text-[1.4em] lg:text-3xl text-[#191919];
+                }
+            }
+        }
+
+        p {
+            @apply text-[#7F7F7F] text-[0.7em] lg:text-lg font-normal font-vazir;
+        }
+    }
+
+    &>ul {
+        @apply flex flex-col h-full items-center gap-[1.1rem] px-6 pt-9 lg:gap-5 lg:pt-6 lg:px-10;
+
+        li {
+            @apply flex items-center gap-4 cursor-pointer w-max select-none relative;
+            @apply w-[21.4rem] lg:w-[27.1rem];
+
+            label {
+                @apply w-max absolute right-3 top-4 lg:top-3.5 px-1 bg-white transition-['top'];
+                @apply text-neutral-400 text-sm lg:text-base font-medium font-vazir cursor-text;
+                @apply pointer-events-none;
+            }
+
+            input, textarea {
+                @apply h-[3.4rem] pl-10 rtl w-full rounded-[0.6rem] border shadow-none;
+                @apply text-[#4C4C4C] font-vazir grow;
+            }
+
+            &:has(input:focus),
+            &:has(textarea:focus),
+            &:has(input:not(:placeholder-shown)),
+            &:has(textarea:not(:placeholder-shown)) {
+                label {
+                    @apply -top-2 h-4;
+                    @apply text-[#4C4C4C] text-xs font-normal font-vazir;
+                }
+            }
+        }
+
+        li:last-child {
+            @apply w-full lg:w-[27.1rem] h-full flex flex-col items-start gap-4 mt-3 lg:mt-4;
+
+            // label {
+            //     @apply text-[#7F7F7F] text-xs lg:text-xl font-medium font-vazir max-lg:mr-2.5;
+            // }
+
+            textarea {
+                @apply w-full h-[9.6rem] lg:h-full p-4 rounded-[0.6rem] border border-[#E5E5E5];
+
+                // &::placeholder {
+                //     @apply text-[#999999] text-[0.7em] lg:text-lg font-normal font-vazir;
+                // }
+            }
+        }
+    }
+
+    &>button {
+        @apply h-[2.9rem] m-6 mt-8 lg:h-14 lg:m-10 lg:mt-9 shrink-0 #{!important};
+
+        .p-button-label {
+            @apply font-bold font-iran-sans text-sm lg:text-base;
+        }
+    }
+}
+</style>