MediaWiki:Common.css: Difference between revisions

← Older edit Newer edit →

@@ Line 364: / Line 364: @@
    }
 }
-/* ── Verse menu ─────────────────────────────────────────────────── */
+.icon {
-.verse-menu-wrap {
    display: inline-block;
-   position: relative;
+   width: 14px;
-vertical-align: middle;
+  height: 14px;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: contain;
+  vertical-align: middle;
 }
-.verse-dots {
+/* Your icons */
-   cursor: pointer;
+.icon-copy {
-  font-size: 0.85em;
+   background-image: url('/images/copy.svg');
-  color: #ccc;
-  padding: 1px 5px;
-  border-radius: 4px;
-  font-family: system-ui, sans-serif;
-  user-select: none;
-  transition: background 0.15s, color 0.15s;
-  line-height: 1;
-  vertical-align: middle;
-  position: relative;
-  top: -0.25em;
-  left: 0.2em;
 }
-.verse-dots:hover,
+.icon-commentary {
-.verse-dots.open {
+   background-image: url('/images/commentary.svg');
-   background: #f1f3f4;
-  color: #444;
 }
-.verse-menu {
+/* Optional polish */
-   display: none;
+.verse-action-btn {
-  position: absolute;
+   cursor: pointer;
-  top: 1.4em;
+   opacity: 0.7;
-   left: 0;
+   transition: opacity 0.2s ease;
-  background: #fff;
-  border: 0.5px solid #e0e0e0;
-   border-radius: 8px;
-  padding: 4px 0;
-  min-width: 148px;
-  z-index: 100;
-  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
 }
-.verse-menu.open {
+.verse-action-btn:hover {
-   display: block;
+  opacity: 1;
+}
+/* Hide actions by default */
+.verse-actions {
+   opacity: 0;
+  transition: opacity 0.2s ease;
 }
-.verse-menu-item {
+/* Show on hover of verse */
+.verse-block:hover .verse-actions {
+  opacity: 1;
+}
+.shloka-line {
    display: flex;
-   align-items: center;
+   align-items: baseline;
-   gap: 8px;
+   justify-content: space-between;
-  padding: 7px 14px;
+}
-  font-size: 13px;
-  font-family: system-ui, sans-serif;
+/* Keep text natural */
-  color: #333;
+.shloka-line > *:first-child {
-  cursor: pointer;
+   flex: 1;
-   white-space: nowrap;
 }
-.verse-menu-item:hover {
+/* Actions aligned nicely */
-   background: #f5f5f5;
+.verse-actions {
+  display: inline-flex;
+  align-items: center;
+  gap: 6px;
+   margin-left: 8px;
 }
-.verse-menu-icon {
+/* Icon tuning */
-   font-size: 13px;
+.icon {
-   width: 16px;
+   width: 14px;
-   text-align: center;
+   height: 14px;
+   transform: translateY(1px); /* subtle baseline fix */
 }