@cyber-dash-tech/revela 0.6.0 → 0.6.1

package/designs/monet/DESIGN.md

@@ -171,8 +171,8 @@ Recommended reusable primitives:
 - Every slide uses `.slide-canvas` sized to `1920px x 1080px`, scaled by JS.
 - Every `<section class="slide">` must include `slide-qa="true"` or `slide-qa="false"`.
 - Use `slide-qa="true"` for dense content layouts and `slide-qa="false"` for structural or intentionally sparse layouts.
-- Default canvas padding: `10px` (minimal frame; the page nearly fills the canvas).
-- The paper page should usually sit inside the canvas with `padding: 56px 64px 64px`.
+- `.slide-canvas` is the export surface and must keep `padding: 0`.
+- Put safe-area spacing on `.page` or inner layout containers, not on `.slide-canvas`.
 - Target strong fill on content-heavy slides while preserving editorial whitespace.
 
 ### HTML Structure
@@ -240,7 +240,7 @@ body {
     transform-origin: center center;
     position: relative;
     overflow: hidden;
-    padding: 10px;
+    padding: 0;
 }
 
 .page {

package/designs/monet/preview.html

@@ -65,7 +65,7 @@
       transform-origin: center center;
       position: relative;
       overflow: hidden;
-      padding: 10px;
+      padding: 0;
     }
 
     .page {

package/designs/starter/DESIGN.md

@@ -89,7 +89,7 @@ For photography, UI screenshots, webpages, and product surfaces, do not convert
 
 - The browser viewport is a neutral dark frame.
 - The slide page is a light neutral surface.
-- Default canvas padding is compact: `10px`, so preview and generated decks have a large usable page.
+- `.slide-canvas` is the export surface and must keep `padding: 0`; put safe-area spacing on `.page` or inner layout containers.
 - Use page edge, rules, cards, panels, and quiet geometry as neutral structure. Avoid built-in industry-specific imagery.
 
 ### Grid System
@@ -132,7 +132,7 @@ Every generated presentation must use this exact HTML skeleton:
 html { scroll-snap-type: y mandatory; overflow-y: scroll; height: 100%; }
 body { background: var(--bg-frame); color: var(--text-primary); font-family: var(--font-body); -webkit-font-smoothing: antialiased; height: 100%; }
 .slide { min-height: 100dvh; scroll-snap-align: start; display: flex; align-items: center; justify-content: center; overflow: hidden; background: var(--bg-frame); }
-.slide-canvas { width: 1920px; height: 1080px; flex-shrink: 0; transform-origin: center center; position: relative; overflow: hidden; padding: 10px; }
+.slide-canvas { width: 1920px; height: 1080px; flex-shrink: 0; transform-origin: center center; position: relative; overflow: hidden; padding: 0; }
 .page { position: relative; width: 100%; height: 100%; background: var(--bg-page); color: var(--text-primary); padding: 56px 64px 64px; box-shadow: 0 24px 80px var(--shadow-soft); display: flex; flex-direction: column; overflow: hidden; }
 .page.alt { background: var(--bg-page-alt); }
 .eyebrow, .caption, .meta-label { font-size: var(--font-size-meta); line-height: 1.4; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-muted); }

package/designs/starter/preview.html

@@ -35,7 +35,7 @@
     html { scroll-snap-type: y mandatory; overflow-y: scroll; height: 100%; }
     body { background: var(--bg-frame); color: var(--text-primary); font-family: var(--font-body); -webkit-font-smoothing: antialiased; height: 100%; }
     .slide { min-height: 100dvh; scroll-snap-align: start; display: flex; align-items: center; justify-content: center; overflow: hidden; background: var(--bg-frame); }
-    .slide-canvas { width: 1920px; height: 1080px; flex-shrink: 0; transform-origin: center center; position: relative; overflow: hidden; padding: 10px; }
+    .slide-canvas { width: 1920px; height: 1080px; flex-shrink: 0; transform-origin: center center; position: relative; overflow: hidden; padding: 0; }
     .page { position: relative; width: 100%; height: 100%; background: var(--bg-page); color: var(--text-primary); padding: 56px 64px 64px; box-shadow: 0 24px 80px var(--shadow-soft); display: flex; flex-direction: column; overflow: hidden; }
     .page.alt { background: var(--bg-page-alt); }
     .eyebrow, .caption, .meta-label { font-size: var(--font-size-meta); line-height: 1.4; letter-spacing: 0.12em; text-transform: uppercase; color: var(--text-muted); }

package/designs/summit/DESIGN.md

@@ -109,8 +109,8 @@ All sizes are fixed `px` for the 1920x1080 canvas. JS `transform: scale()` handl
 - Every slide uses `.slide-canvas` sized to `1920px x 1080px`, scaled by JS.
 - Every `<section class="slide">` must include `slide-qa="true"` or `slide-qa="false"`.
 - Use `slide-qa="true"` for dense content layouts and `slide-qa="false"` for structural or intentionally sparse layouts.
-- Default canvas padding: `72px 80px`.
-- The paper page should usually sit inside the canvas with `padding: 56px 64px 64px`.
+- `.slide-canvas` is the export surface and must keep `padding: 0`.
+- Put safe-area spacing on `.page` or inner layout containers, not on `.slide-canvas`.
 - Target strong fill on content-heavy slides while preserving editorial whitespace.
 
 ### HTML Structure
@@ -178,7 +178,7 @@ body {
     transform-origin: center center;
     position: relative;
     overflow: hidden;
-    padding: 72px 80px;
+    padding: 0;
 }
 
 .page {

package/designs/summit/preview.html

@@ -59,7 +59,7 @@
       transform-origin: center center;
       position: relative;
       overflow: hidden;
-      padding: 72px 80px;
+      padding: 0;
     }
 
     .page {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cyber-dash-tech/revela",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "description": "OpenCode plugin that turns AI into an HTML slide deck generator",
   "type": "module",
   "main": "./index.ts",