Make sure that the Tailwind CSS classes we use don't get overridden

biome.json

@@ -9,11 +9,15 @@
   "formatter": {
     "includes": ["**"],
     "indentStyle": "space",
-    "lineWidth": 120
+    "lineWidth": 120,
+    "formatWithErrors": true
   },
   "css": {
     "formatter": {
       "enabled": true
+    },
+    "parser": {
+      "tailwindDirectives": true
     }
   },
   "html": {

electron.vite.config.ts

@@ -27,10 +27,6 @@ export default electronVite.defineConfig({
     build: {
       target: 'esnext'
     },
-    define: {
-      __OPENCOR_DEV__:
-        ((process as unknown as { env?: { NODE_ENV?: string } }).env?.NODE_ENV ?? 'development') !== 'production'
-    },
     envDir: path.join(import.meta.dirname, 'src/renderer'),
     optimizeDeps: {
       esbuildOptions: {

package.json

@@ -23,7 +23,7 @@
     "url": "git+https://github.com/opencor/webapp.git"
   },
   "type": "module",
-  "version": "0.20260317.1",
+  "version": "0.20260318.0",
   "engines": {
     "bun": ">=1.2.0"
   },
@@ -92,6 +92,6 @@
     "typescript": "^5.9.3",
     "unplugin-vue-components": "^31.0.0",
     "vite": "^7.3.1",
-    "vue-tsc": "^3.2.5"
+    "vue-tsc": "^3.2.6"
   }
 }

src/renderer/biome.json

@@ -10,11 +10,15 @@
   "formatter": {
     "includes": ["**"],
     "indentStyle": "space",
-    "lineWidth": 120
+    "lineWidth": 120,
+    "formatWithErrors": true
   },
   "css": {
     "formatter": {
       "enabled": true
+    },
+    "parser": {
+      "tailwindDirectives": true
     }
   },
   "html": {

src/renderer/package.json

@@ -42,7 +42,7 @@
     },
     "./style.css": "./dist/opencor.css"
   },
-  "version": "0.20260317.1",
+  "version": "0.20260318.0",
   "scripts": {
     "build": "vite build && bun scripts/generate.version.js",
     "build:lib": "vite build --config vite.lib.config.ts && bun scripts/copy.indexdts.js",
@@ -92,6 +92,6 @@
     "typescript": "^5.9.3",
     "unplugin-vue-components": "^31.0.0",
     "vite": "^7.3.1",
-    "vue-tsc": "^3.2.5"
+    "vue-tsc": "^3.2.6"
   }
 }

src/renderer/src/AppWithMultipleInstances.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="h-screen overflow-hidden">
+  <div class="opencor" style="height: 100vh; height: 100dvh; overflow: hidden;">
     <Splitter class="h-full" layout="vertical">
       <SplitterPanel :size="15">
         <OpenCOR />

src/renderer/src/AppWithSimulationData.vue

@@ -1,17 +1,19 @@
 <template>
-  <div class="h-full flex flex-col">
-    <div class="flex p-2 space-x-2 justify-center">
-      <button :class="['flex-1 px-4 py-2 rounded text-center cursor-pointer', areModelParametersTracked(voi) ? 'bg-red-600' : 'bg-green-600']" @click="trackOrUntrackModelParameters(voi)">VOI</button>
-      <button :class="['flex-1 px-4 py-2 rounded text-center cursor-pointer', areModelParametersTracked(mainT) ? 'bg-red-600' : 'bg-green-600']" @click="trackOrUntrackModelParameters(mainT)">main/t</button>
-      <button :class="['flex-1 px-4 py-2 rounded text-center cursor-pointer', areModelParametersTracked(mainXYZ) ? 'bg-red-600' : 'bg-green-600']" @click="trackOrUntrackModelParameters(mainXYZ)">main/xyz</button>
-      <button :class="['flex-1 px-4 py-2 rounded text-center cursor-pointer', areModelParametersTracked(unknown) ? 'bg-red-600' : 'bg-green-600']" @click="trackOrUntrackModelParameters(unknown)">unknown</button>
-      <button class="flex-1 px-4 py-2 rounded bg-red-600 disabled:opacity-50 text-center cursor-pointer disabled:cursor-default" :disabled="!simulationDataTracked.length" @click="untrackAllModelParameters">All</button>
-    </div>
-    <div class="flex flex-1">
-      <OpenCOR class="flex-1" ref="opencorRef"
-        omex="https://raw.githubusercontent.com/opencor/webapp/refs/heads/main/tests/models/ui/lorenz.omex"
-        @simulationData="onSimulationData"
-      />
+  <div class="opencor" style="height: 100vh; height: 100dvh;">
+    <div class="h-full flex flex-col">
+      <div class="flex p-2 space-x-2 justify-center">
+        <button :class="['flex-1 px-4 py-2 rounded text-center cursor-pointer', areModelParametersTracked(voi) ? 'bg-red-600' : 'bg-green-600']" @click="trackOrUntrackModelParameters(voi)">VOI</button>
+        <button :class="['flex-1 px-4 py-2 rounded text-center cursor-pointer', areModelParametersTracked(mainT) ? 'bg-red-600' : 'bg-green-600']" @click="trackOrUntrackModelParameters(mainT)">main/t</button>
+        <button :class="['flex-1 px-4 py-2 rounded text-center cursor-pointer', areModelParametersTracked(mainXYZ) ? 'bg-red-600' : 'bg-green-600']" @click="trackOrUntrackModelParameters(mainXYZ)">main/xyz</button>
+        <button :class="['flex-1 px-4 py-2 rounded text-center cursor-pointer', areModelParametersTracked(unknown) ? 'bg-red-600' : 'bg-green-600']" @click="trackOrUntrackModelParameters(unknown)">unknown</button>
+        <button class="flex-1 px-4 py-2 rounded bg-red-600 disabled:opacity-50 text-center cursor-pointer disabled:cursor-default" :disabled="!simulationDataTracked.length" @click="untrackAllModelParameters">All</button>
+      </div>
+      <div class="flex flex-1">
+        <OpenCOR class="flex-1" ref="opencorRef"
+          omex="https://raw.githubusercontent.com/opencor/webapp/refs/heads/main/tests/models/ui/lorenz.omex"
+          @simulationData="onSimulationData"
+        />
+      </div>
     </div>
   </div>
 </template>

src/renderer/src/AppWithinContainers.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="h-screen">
+  <div class="opencor" style="height: 100vh; height: 100dvh;">
     <Splitter class="h-full" layout="vertical">
       <SplitterPanel class="flex items-center justify-center bg-blue-500" :size="15">Top panel...</SplitterPanel>
       <SplitterPanel :size="50">

src/renderer/src/assets/app.css

@@ -1,8 +1,18 @@
+/* stylelint-disable at-rule-no-unknown, no-invalid-position-at-import-rule */
+@config "../../tailwind.config.ts";
+
 @layer theme, base, components, utilities;
 
+/* biome-ignore lint/correctness/noInvalidPositionAtImportRule: ignored using `--suppress` */
 @import "tailwindcss/theme.css" layer(theme);
+
+/* biome-ignore lint/correctness/noInvalidPositionAtImportRule: ignored using `--suppress` */
 @import "tailwindcss/utilities.css" layer(utilities);
+
+/* biome-ignore lint/correctness/noInvalidPositionAtImportRule: ignored using `--suppress` */
 @import "tailwindcss-primeui";
+
+/* biome-ignore lint/correctness/noInvalidPositionAtImportRule: ignored using `--suppress` */
 @import "primeicons/primeicons.css";
 
 body {

src/renderer/src/components/OpenCOR.vue

@@ -1,5 +1,5 @@
 <template>
-  <SafeBlockUI ref="safeBlockUiRef" class="opencor overflow-hidden h-full" :class="isFullWebApp ? 'with-main-menu' : ''"
+  <SafeBlockUI ref="safeBlockUiRef" class="opencor" :class="isFullWebApp ? 'with-main-menu' : ''"
     :blocked="compBlockUiEnabled"
     @click="activateInstance"
     @focus="activateInstance"
@@ -1256,6 +1256,11 @@ const onGitHubButtonClick = async (): Promise<void> => {
   }
 }
 
+.opencor {
+  height: 100%;
+  overflow: hidden;
+}
+
 :deep(.p-overlay-mask) {
   border-radius: 0;
 }