@diagrammo/dgmo-standalone 0.80.0 → 0.82.0

package/README.md

@@ -55,7 +55,7 @@ unpkg works the same way — swap the host for `unpkg.com/`.
 
 ## What you get
 
-40+ chart types from one text format: flowcharts, sequence diagrams,
+50+ chart types from one text format: flowcharts, sequence diagrams,
 timelines, org charts, gantt, maps, and the usual bar/line/pie family. The
 renderer infers the chart type from what you wrote, so there is one syntax to
 learn rather than one per chart.

package/dist/auto.css

@@ -48,9 +48,16 @@ pre.dgmo, code.language-dgmo, pre > code.language-dgmo,
  * swallowed into a rule they then emit as garbage. */
 
 /* === Color-mode visibility (dual-render) ===
- * The dark wrapper also carries the "hidden" ATTRIBUTE, so a page that never
+ * The dark wrapper also carries an inline display:none, so a page that never
  * loaded this stylesheet shows the light diagram rather than both of them.
- * Every rule below is author-origin and therefore still overrides it.
+ * The two reveal rules are !important because of it: an inline declaration
+ * outranks every normal author rule, and only an important one beats it.
+ *
+ * That inline style replaced the "hidden" ATTRIBUTE in issue 647. Tailwind v4
+ * hides [hidden] with !important from inside a cascade layer, and a layered
+ * important declaration outranks an unlayered one at ANY specificity — so no
+ * rule here could reveal the dark wrapper, and every diagram on a Tailwind v4
+ * host was a zero-height empty box in dark mode.
  * Keep the two host conventions in separate rule blocks — the adapters
  * rewrite by literal replace and a folded rule would half-rewrite. */
 .dgmo-dark {
@@ -60,13 +67,13 @@ pre.dgmo, code.language-dgmo, pre > code.language-dgmo,
   display: none;
 }
 [data-theme="dark"] .dgmo-dark {
-  display: block;
+  display: block !important;
 }
 html.dark .dgmo-light {
   display: none;
 }
 html.dark .dgmo-dark {
-  display: block;
+  display: block !important;
 }
 
 /* === Diagram sizing ===
@@ -506,7 +513,7 @@ html.dark .dgmo-dark {
   display: none;
 }
 .dgmo-theme-dark .dgmo-dark {
-  display: block;
+  display: block !important;
 }
 .dgmo-theme-dark .dgmo-lightbox-svg {
   background: #1e1e1e;