MediaWiki:Common.css: Difference between revisions

Jump to navigation Jump to search
no edit summary
No edit summary
No edit summary
Tag: Reverted
Line 1: Line 1:
  .tooltip-box {
  . -box {
     position: absolute;
     position: absolute;
     background-color: #333;
     background-color: #333;
Line 10: Line 10:
}
}


.tooltip {
. {
     cursor: pointer;
     cursor: pointer;
     border-bottom: 1px dotted;
     border-bottom: 1px dotted;
Line 744: Line 744:
.custom-table .cell-photo-caption { background-color: trasparent; text-align:center; border:hidden; font-size:100%; }
.custom-table .cell-photo-caption { background-color: trasparent; text-align:center; border:hidden; font-size:100%; }


tooltip-wrapper {
-wrapper {
     position: relative;
     position: relative;
     display: inline-block; /* Ensure it fits the content */
     display: inline-block; /* Ensure it fits the content */
Line 762: Line 762:
}
}


/* Tooltip container */
/*   container */
.tooltip-text {
. -text {
     visibility: hidden;
     visibility: hidden;
     background-color: #918f8f;
     background-color: #918f8f;
Line 776: Line 776:
     top: 70%; /* Center vertically relative to the text */
     top: 70%; /* Center vertically relative to the text */
     left: 50%; /* Center horizontally relative to the text */
     left: 50%; /* Center horizontally relative to the text */
     transform: translate(-50%, 25%); /* Center the tooltip */
     transform: translate(-50%, 25%); /* Center the   */
     opacity: 0;
     opacity: 0;
     transition: opacity 0.3s ease-in-out;
     transition: opacity 0.3s ease-in-out;
     width: 200px; /* Allow width to adjust based on content */
     width: 200px; /* Allow width to adjust based on content */
     word-wrap: break-word; /* Break long words to fit within the width */
     word-wrap: break-word; /* Break long words to fit within the width */
     white-space: normal; /* Allow text to wrap within the tooltip */
     white-space: normal; /* Allow text to wrap within the   */
}
}


/* Show the tooltip text when the wrapper is focused */
/* Show the   text when the wrapper is focused */
.tooltip-wrapper:focus-within .tooltip-text {
. -wrapper:focus-within . -text {
     visibility: visible;
     visibility: visible;
     opacity: 1;
     opacity: 1;
}
}


/* Hide the tooltip text when the wrapper loses focus */
/* Hide the   text when the wrapper loses focus */
.tooltip-wrapper:focus:not(:focus-visible) .tooltip-text {
. -wrapper:focus:not(:focus-visible) . -text {
     visibility: hidden;
     visibility: hidden;
     opacity: 0;
     opacity: 0;

Navigation menu