MediaWiki:Common.css: Difference between revisions

← Older edit

@@ Line 2,888: / Line 2,888: @@
    color: #b5451b; opacity: 0.85; margin-bottom: 2px;
 }
+/* The annotation count badge was removed (it was clipped by the round
+   toggle's own overflow). This keeps it hidden for anyone still served a
+   cached copy of the old gadget. */
+#gra-toggle-badge { display: none !important; }
+/* ── LINK LANDING ───────────────────────────────────────────────────
+   Where a copied id or a bookmark citation link lands. The flash used to
+   be injected by copyId.js; it lives here so the landing still reads when
+   only common.js is loaded. */
+.gid-target {
+  animation: gid-target-flash 2.4s ease-out 1;
+  border-radius: 4px;
+}
+@keyframes gid-target-flash {
+%, 55% { background: rgba(181,69,27,0.14); box-shadow: 0 0 0 4px rgba(181,69,27,0.10); }
+%    { background: transparent; box-shadow: none; }
+}
+@media (prefers-reduced-motion: reduce) {
+  .gid-target { animation: none; background: rgba(181,69,27,0.14); }
+}
+/* ── BOOKMARK CITATION ──────────────────────────────────────────────
+   The reference a bookmark produces, shown on its card and copyable in
+   one click. Set small and in the UI face deliberately: it is apparatus
+   for the reader to take away, not part of the text. */
+.gra-bookmark-cite {
+  margin-top: 6px;
+  /* --font-translit, not --font-indic. The reference is romanised - IAST
+     author, IAST title, Latin site name and URL - and Gentium Book Plus
+     is the only family here with a REAL italic face (Adishila, which
+     --font-indic leads with, has none at this weight, so the italic title
+     fell back to a synthetic slant or to nothing at all). Gentium's
+     unicode-range covers Latin only, so a Devanagari fallback title still
+     lands on Adishila further down the stack. */
+  font-family: var(--font-translit);
+  font-synthesis: style;            /* allow a slant for the Devanagari case */
+  font-size: clamp(11px, calc(var(--gr-font-size, 22px) * 0.54), 15px);
+  line-height: 1.5; color: #6b5b52;
+  /* Ragged right and flush left. The hanging indent that was here reads
+     correctly in a printed reference LIST, where it separates one entry
+     from the next; on a single card it just looked like the lines had
+     slipped. Justification came in from the panel and stretched the word
+     gaps, which is what made the spacing look broken. */
+  text-align: left;
+  text-indent: 0;
+  padding-left: 0;
+  overflow-wrap: break-word;
+  word-break: normal;
+  hyphens: none;
+}
+.gra-bookmark-cite a {
+  color: inherit; text-decoration: none; border-bottom: 1px dotted #c3b3a9;
+  overflow-wrap: anywhere;          /* only the URL may break mid-token */
+}
+.gra-bookmark-cite a:hover { color: #b5451b; border-bottom-color: #b5451b; }
+.gra-bookmark-cite i,
+.gra-bookmark-cite em { font-style: italic; font-synthesis: style; }
+/* Where the bookmark sits in the text. A caption, not part of the
+   citation - so it is set in the UI face and kept visually apart from
+   the reference below it. */
+.gra-bookmark-locator {
+  margin-top: 5px;
+  font-family: var(--font-ui);
+  font-size: clamp(10px, calc(var(--gr-font-size, 22px) * 0.48), 13px);
+  font-weight: 600;
+  letter-spacing: .02em;
+  color: #8a7a70;
+}
+.gra-cite-actions { display: flex; flex-wrap: wrap; gap: 6px; }
+.gra-cite-copy {
+  margin-top: 6px; padding: 3px 10px;
+  font-family: var(--font-ui);
+  font-size: clamp(11px, calc(var(--gr-font-size, 22px) * 0.5), 14px);
+  font-weight: 600; color: #b5451b;
+  background: #fff5f2; border: 1px solid #f0cfc4; border-radius: 20px;
+  cursor: pointer; transition: background .15s, color .15s, border-color .15s;
+}
+.gra-cite-copy:hover { background: #b5451b; color: #fff; border-color: #b5451b; }
+.gra-cite-copy--done { background: #2e6e40; color: #fff; border-color: #2e6e40; }