@diagrammo/dgmo 0.56.0 → 0.58.0

package/dist/auto.css

@@ -414,6 +414,66 @@ pre.dgmo, code.language-dgmo, pre > code.language-dgmo,
   font-style: italic;
 }
 
+/* === Live links ===
+ * A withdrawn pointer's placeholder, and the "this moved" affordance a host's
+ * client script falls back to when it can see a diagram has changed but cannot
+ * safely swap it in. Both are deliberately quiet: a page peppered with badges
+ * is worse than one that is a few days behind. */
+.dgmo--tombstone {
+  border: 1px dashed currentColor;
+  border-radius: 6px;
+  opacity: 0.6;
+  padding: 1.5rem;
+  text-align: center;
+}
+.dgmo-tombstone-text {
+  font-size: 0.9em;
+  margin: 0;
+}
+.dgmo-updated {
+  display: block;
+  font-size: 0.8em;
+  margin-top: 0.4rem;
+  opacity: 0.7;
+  text-align: right;
+}
+/* The card a docs site shows when live links are switched OFF, plus its
+ * hover-revealed way to turn them on. Hover-only on purpose: a READER never
+ * meets it, and anyone mousing over a diagram-shaped thing on their own docs
+ * site is almost certainly its author — which makes this the fix for a build
+ * warning nobody reads. The markup is the WRAPPER's (only it knows the feature
+ * is off); the styling is here because there is one stylesheet. */
+.dgmo-live-link-off {
+  position: relative;
+}
+.dgmo-live-link-view {
+  display: block;
+  text-decoration: none;
+}
+/* pointer-events: none alongside the fade, or an invisible link sits over the
+ * card's bottom-right corner and navigates a reader who clicks near it. Focus
+ * still reveals it (:focus-within on the wrapper), so a keyboard user is not
+ * shut out of something a mouse user can reach. */
+.dgmo-live-link-enable {
+  bottom: 0.5rem;
+  font-size: 0.8em;
+  opacity: 0;
+  pointer-events: none;
+  position: absolute;
+  right: 0.5rem;
+  transition: opacity 0.15s ease-in-out;
+}
+.dgmo-live-link-off:hover .dgmo-live-link-enable,
+.dgmo-live-link-off:focus-within .dgmo-live-link-enable {
+  opacity: 1;
+  pointer-events: auto;
+}
+@media (prefers-reduced-motion: reduce) {
+  .dgmo-live-link-enable {
+    transition: none;
+  }
+}
+
 .dgmo-theme-dark selectors if your site uses .dark or
  * another color-mode convention. */