fix: race condition on custom styles loading + misc cleanup

Guard watcher-triggered renders in usePreviewRenderer until first
explicit render completes, preventing premature renders with default
styles. Also: disable Contenu tab, update content/blueprints, add
global disabled button styles, minor formatting.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

src/App.vue

@@ -61,10 +61,7 @@ const activeFrame = computed(() => {
 const { printPreview } = usePrintPreview(activeFrame);
 
 // Setup keyboard shortcuts (depends on printPreview)
-const {
-  handleKeyboardShortcut,
-  isMac
-} = useKeyboardShortcuts({
+const { handleKeyboardShortcut, isMac } = useKeyboardShortcuts({
   stylesheetStore,
   elementPopup,
   // pagePopup, // DISABLED: page template styling feature
@@ -125,7 +122,11 @@ onMounted(async () => {
   />
   -->
 
-  <button class="print-btn" @click="printPreview" :title="`Imprimer (${isMac ? '⌘' : 'Ctrl'}+P)`">
+  <button
+    class="print-btn"
+    @click="printPreview"
+    :title="`Imprimer (${isMac ? '⌘' : 'Ctrl'}+P)`"
+  >
     <svg
       xmlns="http://www.w3.org/2000/svg"
       viewBox="0 0 24 24"

src/components/editor/EditorPanel.vue

@@ -24,7 +24,8 @@
         class="tab"
         :class="{ active: activeTab === 'contenu' }"
         @click="activeTab = 'contenu'"
-        title="Ouvrir l'onglet Contenu"
+        title="fonctionnalité à venir"
+        disabled
       >
         Contenu
       </button>
@@ -131,11 +132,9 @@ nav {
   position: relative;
   left: calc(var(--panel-w) * -1);
 
-
   background-color: var(--color-panel-bg);
   box-shadow: -5px 0px 12px;
 
-
   transition: left 0.3s var(--curve);
   pointer-events: all;
 }
@@ -145,7 +144,7 @@ nav {
 }
 
 .tab-panel {
-  height: calc(100% - var(--panel-nav-h)*2);
+  height: calc(100% - var(--panel-nav-h) * 2);
   overflow-y: auto;
   overflow-x: hidden;
   padding: 0 2em;

src/composables/usePreviewRenderer.js

@@ -16,6 +16,7 @@ export function usePreviewRenderer({
   let savedScrollPercentage = 0;
   const currentFrameIndex = ref(1); // 1 or 2, which iframe is currently visible
   const isTransitioning = ref(false);
+  const initialized = ref(false);
   let keyboardShortcutHandler = null;
 
   /**
@@ -117,6 +118,9 @@ export function usePreviewRenderer({
             // Swap current frame
             currentFrameIndex.value = currentFrameIndex.value === 1 ? 2 : 1;
             isTransitioning.value = false;
+            if (!initialized.value) {
+              initialized.value = true;
+            }
           }, 200); // Match CSS transition duration
         }, 50); // Small delay to ensure scroll is set
       }, 200); // Wait for PagedJS
@@ -127,6 +131,7 @@ export function usePreviewRenderer({
   watch(
     () => stylesheetStore.content,
     () => {
+      if (!initialized.value) return;
       renderPreview();
     }
   );
@@ -135,6 +140,7 @@ export function usePreviewRenderer({
   watch(
     () => narrativeStore.data,
     () => {
+      if (!initialized.value) return;
       if (narrativeStore.data) {
         renderPreview();
       }
@@ -152,6 +158,7 @@ export function usePreviewRenderer({
     renderPreview,
     currentFrameIndex,
     isTransitioning,
+    initialized,
     setKeyboardShortcutHandler,
   };
 }

src/style.css

@@ -1 +1 @@
-@import '../public/assets/css/style.scss';
+/* @import '../public/assets/css/style.scss'; */