71 lines
1.6 KiB
CSS

/* Main preview container */
.hover-popup {
background-color: var(--background-primary);
border: 1px solid var(--background-modifier-border);
border-radius: var(--radius-m);
box-shadow: var(--shadow-s);
padding: var(--size-4-2);
display: flex;
flex-direction: column;
pointer-events: all;
position: fixed;
z-index: 1000;
min-height: 100px; /* Minimum height to prevent tiny windows */
}
/* Preview navigation controls */
.preview-nav-group {
display: flex;
gap: 4px;
}
.preview-nav-button-disabled {
opacity: 0.5;
cursor: default;
}
.preview-nav-button-disabled:hover {
background-color: transparent !important;
color: var(--text-muted) !important;
}
/* Only keep tooltip for external link button */
.preview-nav-button:not([data-tooltip]):hover::after {
display: none;
}
/* Preview content container */
.preview-iframe-wrapper {
flex: 1;
position: relative;
background-color: var(--background-secondary);
border-radius: var(--radius-s);
box-shadow: var(--shadow-xs);
overflow: hidden; /* Ensure content respects rounded corners */
height: 100%; /* Make sure wrapper takes full height */
min-height: 0; /* Allow wrapper to shrink */
width: 100%;
height: 100%;
}
/* Preview iframe */
.preview-iframe-wrapper iframe {
display: none;
width: 100%;
height: 100%;
border: none;
background-color: white;
pointer-events: all;
}
/* Loading state indicator */
.preview-loading {
padding: 20px;
text-align: center;
color: var(--text-muted);
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}