@slidev/client 0.49.14 → 0.49.16

package/internals/ClicksSlider.vue

@@ -41,14 +41,20 @@ function onMousedown() {
     :title="`Clicks in this slide: ${length}`"
     :class="length && props.clicksContext.isMounted ? '' : 'op50'"
   >
-    <div class="flex gap-0.5 items-center min-w-16 font-mono mr1">
+    <div class="flex gap-0.2 items-center min-w-16 font-mono mr1">
       <carbon:cursor-1 text-sm op50 />
-      <div flex-auto />
       <template v-if="current >= 0 && current !== CLICKS_MAX && active">
+        <div flex-auto />
         <span text-primary>{{ current }}</span>
-        <span op25>/</span>
+        <span op25 text-sm>/</span>
+        <span op50 text-sm>{{ total }}</span>
       </template>
-      <span op50>{{ total }}</span>
+      <div
+        v-else
+        op50 flex-auto pl1
+      >
+        {{ total }}
+      </div>
     </div>
     <div
       relative flex-auto h5 font-mono flex="~"
@@ -62,10 +68,13 @@ function onMousedown() {
         ]"
         :style="{ width: length > 0 ? `${1 / length * 100}%` : '100%' }"
       >
-        <div absolute inset-0 :class="i <= current ? 'bg-primary op15' : ''" />
+        <div
+          absolute inset-0
+          :class="(i <= current && active) ? 'bg-primary op15' : ''"
+        />
         <div
           :class="[
-            +i === +current ? 'text-primary font-bold op100 border-primary' : 'op30 border-main',
+            (+i === +current && active) ? 'text-primary font-bold op100 border-primary' : 'op30 border-main',
             i === 0 ? 'rounded-l' : '',
             i === total ? 'rounded-r' : 'border-r-2',
           ]"

package/internals/NoteEditable.vue

@@ -94,6 +94,14 @@ function calculateEditorHeight() {
     inputEl.value.style.height = `${inputEl.value.scrollHeight}px`
 }
 
+function onKeyDown(e: KeyboardEvent) {
+  // Override save shortcut on editing mode
+  if (editing.value && e.metaKey && e.key === 's') {
+    e.preventDefault()
+    update({ note: note.value }, props.no)
+  }
+}
+
 watch(
   [note, editing],
   () => {
@@ -129,5 +137,6 @@ watch(
     :class="props.class"
     :placeholder="placeholder"
     @keydown.esc="editing = false"
+    @keydown="onKeyDown"
   />
 </template>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@slidev/client",
   "type": "module",
-  "version": "0.49.14",
+  "version": "0.49.16",
   "description": "Presentation slides for developers",
   "author": "antfu <anthonyfu117@hotmail.com>",
   "license": "MIT",
@@ -58,8 +58,8 @@
     "vue": "^3.4.31",
     "vue-router": "^4.4.0",
     "yaml": "^2.4.5",
-    "@slidev/parser": "0.49.14",
-    "@slidev/types": "0.49.14"
+    "@slidev/parser": "0.49.16",
+    "@slidev/types": "0.49.16"
   },
   "devDependencies": {
     "vite": "^5.3.2"

package/pages/overview.vue

@@ -139,6 +139,14 @@ onMounted(() => {
           <carbon-moon v-if="isDark" />
           <carbon-sun v-else />
         </IconButton>
+        <IconButton
+          v-else
+          :title="isDark ? 'Dark mode' : 'Light mode'"
+          pointer-events-none op50
+        >
+          <carbon-moon v-if="isDark" />
+          <carbon-sun v-else />
+        </IconButton>
       </div>
     </nav>
     <main
@@ -173,7 +181,7 @@ onMounted(() => {
             <carbon:cics-program />
           </IconButton>
         </div>
-        <div class="flex flex-col gap-2 my5">
+        <div class="flex flex-col gap-2 my5" :style="{ width: `${cardWidth}px` }">
           <div
             class="border rounded border-main overflow-hidden bg-main select-none h-max"
             @dblclick="openSlideInNewTab(getSlidePath(route, false))"