fix: better preview shot

README.md

@@ -4,6 +4,8 @@
 
 > A shareable task list with auto resetting items.
 
+![](./public/assets/preview.jpg)
+
 **[todo.klemek.fr](https://todo.klemek.fr)**
 
 ## Running your own

index.html

@@ -16,7 +16,7 @@
         <!-- card related -->
         <meta property="og:title" content="{{ title }}">
         <meta property="og:description" content="{{ lang('home') }}">
-        <meta property="og:image" content="{{ app_url }}/assets/favicon-96x96.jpg">
+        <meta property="og:image" content="{{ app_url }}/assets/preview.jpg">
         <meta property="og:url" content="{{ app_url }}/{{ path }}">
 
         <script

resources/css/style.css

@@ -23,7 +23,8 @@ body {
         var(--color-base-200) calc(2 * var(--size)),
         var(--color-base-200) calc(3 * var(--size)),
         var(--color-accent) calc(3 * var(--size)),
-        var(--color-accent) calc(4 * var(--size))
+        var(--color-accent) calc(4 * var(--size)),
+        var(--color-base-200) calc(4 * var(--size))
     );
     background-size: calc(4 * var(--size) / sin(var(--angle)))
         calc(4 * var(--size) / sin(var(--angle)));

resources/ts/views/ListView.vue

@@ -198,26 +198,6 @@ onBeforeRouteUpdate((to) => {
                 <span v-html="$t('all_completed_hint')"></span
             ></span>
         </li>
-        <li class="list-row">
-            <div class="list-col-grow">
-                <input
-                    v-model="taskInput"
-                    type="text"
-                    :placeholder="$t('new_task_hint')"
-                    class="input w-full"
-                    @keyup.enter="onNewTask"
-                />
-            </div>
-            <div>
-                <button
-                    class="btn btn-square"
-                    :disabled="loading || taskInput.trim().length === 0"
-                    @click="onNewTask"
-                >
-                    <circle-plus-icon />
-                </button>
-            </div>
-        </li>
     </ul>
     <div
         v-if="separateCompleted && hasCompleted"
@@ -247,6 +227,22 @@ onBeforeRouteUpdate((to) => {
             </ul>
         </div>
     </div>
+    <div class="flex gap-2 p-4">
+        <input
+            v-model="taskInput"
+            type="text"
+            :placeholder="$t('new_task_hint')"
+            class="input grow"
+            @keyup.enter="onNewTask"
+        />
+        <button
+            class="btn btn-square"
+            :disabled="loading || taskInput.trim().length === 0"
+            @click="onNewTask"
+        >
+            <circle-plus-icon />
+        </button>
+    </div>
     <div>
         <button class="btn btn-sm px-4" @click="onShare">
             <share-2-icon class="inline" :size="16" /> {{ $t('share_button') }}