@troshab/slidev-theme-troshab 0.1.8 → 0.1.12

package/CLAUDE.md

@@ -535,3 +535,21 @@ Phosphor Icons via Iconify (`@iconify-json/ph`). Use via `<Icon>` component:
 ```
 
 Weight suffixes: (none) = regular, `-bold`, `-fill`, `-duotone`, `-thin`, `-light`.
+
+
+## Related Projects (Cyber Academy)
+
+This project is part of the Cyber Academy content factory. See `~/cyber-academy/README.md` for the full map.
+
+| Path | Role |
+|------|------|
+| `~/colo_cyberrange` | LMS platform (delivery) |
+| `~/soc-tier-2` | SOC Tier 1+2 program (course-gen DB pipeline) |
+| `~/was26` | Web App Security 2026 (Slidev course) |
+| `~/ll26` | Binary Exploitation 2026 (Slidev course, planned) |
+| `~/avis26` | NaUKMA F5 bachelor program (curriculum admin) |
+| `~/slidev-theme-troshab` | Slidev theme used by all course presentations |
+
+Authoring tools: `~/.claude/plugins/marketplaces/troshab-own-claude-code` (skills `course-*`, `slidev-*`, `ukrainize-text`).
+
+Cross-project navigation: `/troshab-own:cyber-academy` slash command.

package/components/Stepper.vue

@@ -240,7 +240,7 @@ function isUpcoming(index: number) {
   display: flex;
   flex-direction: column;
   width: 100%;
-  padding: 0.25rem;
+  padding: 0.25rem 0.25rem 0;
 }
 
 /* ===== Track ===== */
@@ -267,12 +267,12 @@ function isUpcoming(index: number) {
 .stepper-step {
   display: flex;
   align-items: center;
-  /* Reserve horizontal space for .stepper-marker's transform: scale(1.15) on
-   * active state. Scaled marker's visible box extends ~6px past its layout
-   * box; without padding, step.scrollWidth exceeds clientWidth by 1-3px on
-   * short labels. Per CSS spec, transformed descendants count toward parent
-   * scrollable overflow. */
-  padding: 0 var(--transform-scale-comp);
+  /* Reserve horizontal AND vertical space for .stepper-marker's transform:
+   * scale(1.15) on active state. Scaled marker's visible box extends ~6px past
+   * its layout box; without padding, step.scrollWidth/scrollHeight exceeds
+   * clientWidth/clientHeight by 1-5px. Per CSS spec, transformed descendants
+   * count toward parent scrollable overflow. */
+  padding: var(--transform-scale-comp);
 }
 
 .stepper-horizontal .stepper-step {
@@ -459,7 +459,7 @@ function isUpcoming(index: number) {
 .stepper-arrow-char {
   color: var(--color-text-tertiary);
   font-size: 2rem;
-  line-height: 1;
+  line-height: 1.25;
 }
 
 .stepper-connector.is-completed .stepper-arrow-char {
@@ -479,10 +479,15 @@ function isUpcoming(index: number) {
 }
 
 .stepper-vertical.stepper-arrows .stepper-connector {
+  width: auto;
+  min-width: 2rem;
+  min-height: 2.5rem;
   background: none;
   display: flex;
   align-items: center;
-  margin-left: calc(var(--stepper-marker-size) / 2 - 0.5rem);
+  justify-content: center;
+  margin-left: calc(var(--stepper-marker-size) / 2 - 1rem);
+  line-height: 1;
 }
 
 .stepper-vertical .stepper-connector.is-completed {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@troshab/slidev-theme-troshab",
-  "version": "0.1.8",
+  "version": "0.1.12",
   "description": "A minimal, universal Slidev theme with flexible layouts and ready-to-use slide templates",
   "author": "troshab",
   "license": "PolyForm-Noncommercial-1.0.0",

package/setup/vite-plugins.ts

@@ -0,0 +1,27 @@
+/**
+ * slidev-theme-troshab — Vite Plugins Setup
+ *
+ * Fix: `lz-string` 1.5.0 is CJS-only (no `exports`/`module` fields).
+ * `@slidev/client/modules/mermaid.ts` does `import lz from 'lz-string'`
+ * which fails at runtime unless Vite pre-bundles the dep through esbuild
+ * (which fabricates a `default` export). Forcing `optimizeDeps.include`
+ * makes the pre-bundle deterministic across modules and CI environments.
+ *
+ * NOTE: this file runs through jiti BEFORE Vite starts, so it must avoid
+ * importing from ESM-only packages like `@slidev/types` (jiti's CJS interop
+ * crashes on them). `defineVitePluginsSetup` is just an identity helper
+ * for type inference; we drop it and export the raw setup function.
+ */
+
+export default () => [
+  {
+    name: 'troshab:dep-optimization',
+    config() {
+      return {
+        optimizeDeps: {
+          include: ['lz-string'],
+        },
+      }
+    },
+  },
+]

package/styles/base.css

@@ -11,12 +11,8 @@
 /* Import color system */
 @import './colors.css';
 
-/* ============================================
-   1. @font-face — IBM Plex via @fontsource
-   Provides proper unicode-range subsetting
-   (latin, cyrillic, cyrillic-ext, etc.)
-   ============================================ */
-
+/* @font-face via @fontsource — must come BEFORE any other CSS rules per
+ * CSS spec (all @import / @charset / @layer at top of file). */
 @import '@fontsource/ibm-plex-sans/400.css';
 @import '@fontsource/ibm-plex-sans/500.css';
 @import '@fontsource/ibm-plex-sans/600.css';
@@ -24,6 +20,15 @@
 @import '@fontsource/ibm-plex-mono/400.css';
 @import '@fontsource/ibm-plex-mono/500.css';
 
+/* Slidev fix: #slidev-goto-dialog уse `-top-20` (-5rem) для closed state, але
+ * з 100+ слайдів список autocomplete стає вищим за 5rem і видно нижню
+ * частину з-під верху екрану. Перекриваємо: коли dialog має `-top-20` клас,
+ * примусово ховаємо через translateY(-100%). */
+#slidev-goto-dialog.\-top-20 {
+  transform: translateY(-100%);
+  pointer-events: none;
+}
+
 /* ============================================
    2. CSS Custom Properties (Typography & Layout)
    Note: Colors are defined in colors.css
@@ -56,7 +61,7 @@
      Chung (2004, Vision Research): optimal 1.25-1.5 for body.
      Bringhurst "Elements of Typographic Style": headings 1.1-1.25, body 1.3-1.5.
      Kolers et al. (1981): reading speed U-curve — extremes reduce speed. */
-  --line-height-heading: 1.3;     /* IBM Plex Sans glyph box (1.275) + safety margin */
+  --line-height-heading: 1.4;     /* IBM Plex Sans + Cyrillic descender (у, р, ф, ц, щ) need extra room - 1.3 caused 1-8px h1 overflow */
   --line-height-body: 1.4;        /* Chung mid — comfortable for slides */
   --line-height-reading: 1.5;     /* Chung upper — BDA recommended for paragraphs */
   --line-height-list: 1.4;        /* matches body for consistency */
@@ -159,7 +164,7 @@
   letter-spacing: var(--letter-spacing-body);
   word-spacing: var(--word-spacing-body);
   color: var(--color-text);
-  padding: var(--safe-inset-y) var(--safe-inset-x);
+  padding: var(--safe-inset-y) var(--safe-inset-x) calc(var(--safe-inset-y) - 16px);
   height: 100%;
   width: 100%;
 }
@@ -182,6 +187,7 @@
   line-height: 1.45;
 }
 
+
 /* --- Headings --- */
 .slidev-layout h1,
 .slidev-layout h2,
@@ -763,6 +769,19 @@
   padding-bottom: 1%;
 }
 
+/* Split + footer: explicit grid rows so panels share remaining height with
+ * footer (auto). Without this, panel height defaults stretch and footer adds
+ * a 3rd auto-row, causing total > viewport (~80-200px overflow). */
+.slide-split:has(.slide-footer) {
+  grid-template-rows: 1fr auto;
+}
+.slide-split:has(.slide-footer) .slide-panel {
+  min-height: 0;
+}
+.slide-split:has(.slide-footer) .slide-panel-content {
+  overflow: hidden;
+}
+
 /* ============================================
    8. Component Styles
    ============================================ */