fix

resources/js/Global/components/Inputs/Check-List.vue

@@ -0,0 +1,75 @@
+<template>
+    <v-row :class="`ma-0 mt-2 checklist`">
+        <v-col xl="12" class="pt-4 pb-0 pr-0"> <section-title theme="sm" title-fa="چک لیست" title-en="check list" /></v-col>
+        <v-col xl="12" class="task-item row ma-0 mt-1 pt-1 pb-1 section-bordered flex-justified-space-between" :class="(task_status) ? 'done' : ''">
+            <div class="flex-justified-right">
+                <div class="En Bold text--24 counter">1</div>
+                <v-switch :color="$_color('task')" inset class="mr-2" v-model="task_status"  />
+                <div class="Fa pr-2 text"> چک کردن سئو وبسایت وردک </div>
+            </div>
+            <div class="flex-justified-left">
+                <v-btn fab x-small :color="$_color('task')" dark>
+                    <v-icon dark>WMi-pencil</v-icon>
+                </v-btn>
+                <v-btn fab x-small color="red" dark>
+                    <v-icon dark>WMi-minus</v-icon>
+                </v-btn>
+            </div>
+        </v-col>
+        <v-col xl="12" class="row ma-0 mt-1 pt-1 pb-1 section-bordered flex-justified-right">
+            <v-text-field
+                v-validate="'min:4'"
+                label=" متن آیتم را وارد کنید "
+                color="cyan"
+                prepend-icon="WMi-text"
+            ></v-text-field>
+            <v-btn
+                fab
+                small
+                color="cyan"
+                dark
+                class="mr-3"
+            >
+                <v-icon dark>WMi-plus</v-icon>
+            </v-btn>
+        </v-col>
+        <!--                        <div class="add-button-row flex-justified-center">-->
+        <!--                            <v-icon>WMi-plus</v-icon>-->
+        <!--                        </div>-->
+    </v-row>
+</template>
+
+<script>
+    export default {
+        props: {
+
+        },
+        data: function () {
+            return {
+                task_status: false,
+            };
+        },
+
+    };
+</script>
+<style lang="scss" scoped>
+    .checklist .counter {
+        width: 30px;
+        border-left: 1px solid #eeeeec;
+    }
+    .checklist .task-item {
+        transition: 0.2s;
+        border-radius: 5px;
+    }
+    .task-item.done {
+        border: 1px solid var(--color-purple);
+        background-color: var(--color-bg-purple);
+    }
+    .task-item .text {
+        transition: 2.0s;
+    }
+    .task-item.done .text {
+        text-decoration: line-through;
+        text-decoration-color: var(--color-purple);
+    }
+</style>