akanealw/misode.github.io
1
0
Fork 0
mirror of https://github.com/misode/misode.github.io.git synced 2026-04-25 08:06:51 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Add dialog button tooltips

Browse Source
This commit is contained in:
Misode
2025-05-18 01:45:27 +02:00
parent 2655ab9740
commit f3d9c7d2eb
2 changed files with 103 additions and 37 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
src/styles/global.css
View File

@@ -1895,7 +1895,8 @@ hr {
.dialog-edit-box,
.dialog-checkbox,
.dialog-slider-track,
.dialog-slider-handle {
.dialog-slider-handle,
.dialog-tooltip {
image-rendering: -moz-crisp-edges;
image-rendering: -webkit-crisp-edges;
image-rendering: crisp-edges;
@@ -1986,6 +1987,38 @@ hr {
padding-bottom: var(--dialog-px);
}
.tooltip-container {
position: relative;
}
.tooltip-container > * > * {
pointer-events: none;
}
.dialog-tooltip {
padding: var(--dialog-px);
border: solid calc(var(--dialog-px) * 2) #220044;
border-image-source: url(/images/tooltip.png);
border-image-slice: 2 fill;
border-image-outset: calc(var(--dialog-px) * 1);
width: max-content;
max-width: calc(var(--dialog-px) * 150);
display: none;
position: absolute;
pointer-events: none;
z-index: 5;
padding: calc(var(--dialog-px) * 2);
}
.tooltip-container:hover > .dialog-tooltip {
display: block;
}
.tooltip-container > .dialog-tooltip .text-component {
white-space: pre-wrap;
text-align: initial;
}
.project-files {
background-color: var(--background-2);
color: var(--text-2);