Merge pull request #112 from mStirner/dev

Working on issues
OpenHausIO · Dec 30, 2023 · 7e4bd6d · 7e4bd6d
2 parents cc02a15 + e8aaa38
commit 7e4bd6d
Showing 1 changed file with 22 additions and 7 deletions.
diff --git a/src/widgets/Todo.vue b/src/widgets/Todo.vue
@@ -65,7 +65,7 @@ export default defineComponent({
     this.title = config.title;
     this.jobs = config.jobs || [];
   },
-  created() {},
+  created() { },
   methods: {
     toggleDone(job) {
       if (job.edit) {
@@ -151,20 +151,35 @@ export default defineComponent({
     <h3>Todo's: {{ title }}</h3>
     <ul v-if="jobs.length > 0">
       <li v-bind:key="index" v-for="(job, index) in jobs">
-        <label @click="toggleDone(job)">
-          <i
-            class="fa-regular fa-circle-check text-success"
-            v-if="job.done"
-          ></i>
+        <label @click="toggleDone(job)" class="w-100">
+          <div class="d-flex">
+            <div>
+              <i class="fa-regular fa-circle-check text-success" v-if="job.done"></i>
+              <i class="fa-regular fa-circle text-primary" v-else></i>
+            </div>
+            &nbsp;
+            <div class="flex-fill">
+              <div class="d-inline flex-fill" v-if="job.edit">
+                <input type="text" class="w-100" v-model="job.desc" />
+              </div>
+              <div class="d-inline" v-else>
+                <del v-if="job.done">{{ job.desc }}</del>
+                <span v-else>{{ job.desc }}</span>
+              </div>
+            </div>
+          </div>
+          <!--
+          <i class="fa-regular fa-circle-check text-success" v-if="job.done"></i>
           <i class="fa-regular fa-circle text-primary" v-else></i>
           &nbsp;
-          <div class="d-inline" v-if="job.edit">
+          <div class="d-inline flex-fill" v-if="job.edit">
             <input type="text" v-model="job.desc" />
           </div>
           <div class="d-inline" v-else>
             <del v-if="job.done">{{ job.desc }}</del>
             <span v-else>{{ job.desc }}</span>
           </div>
+          -->
         </label>
       </li>
     </ul>