mirror of
https://github.com/yu-i-i/overleaf-cep.git
synced 2026-11-14 22:23:42 +01:00
Malik Glossop
8ef463f8b0
Add combined floating menu for comment, tracked changes, writefull GitOrigin-RevId: 4de5b9d3b1717fc76394f7c0edfe4d7230394c8d
65 lines
1.6 KiB
SCSS
65 lines
1.6 KiB
SCSS
.editor-floating-menu {
|
|
display: flex;
|
|
flex-direction: column;
|
|
box-shadow: 0 2px 4px 0 #1e253029;
|
|
background-color: var(--dropdown-background);
|
|
color: var(--dropdown-text-color);
|
|
border: 1px solid var(--border-divider);
|
|
border-radius: var(--border-radius-base);
|
|
padding: var(--spacing-02);
|
|
gap: var(--spacing-02);
|
|
transition: opacity 0.05s ease-in;
|
|
opacity: 0;
|
|
}
|
|
|
|
.editor-floating-menu-visible {
|
|
opacity: 1;
|
|
}
|
|
|
|
// Module actions self-gate and may render nothing, so hide the pill when it
|
|
// has no buttons rather than showing an empty box.
|
|
.editor-floating-menu:not(:has(button)) {
|
|
display: none;
|
|
}
|
|
|
|
.editor-floating-menu-button {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background-color: inherit;
|
|
color: inherit;
|
|
border: none;
|
|
padding: var(--spacing-01);
|
|
border-radius: var(--border-radius-base);
|
|
cursor: pointer;
|
|
|
|
&:hover {
|
|
background-color: var(--dropdown-background-hover);
|
|
}
|
|
}
|
|
|
|
.editor-floating-menu-divider {
|
|
height: 1px;
|
|
background-color: var(--dropdown-border-divider);
|
|
|
|
// Hide dividers at the menu edges, or with no following button (e.g. a module
|
|
// action rendered nothing). `~ * button` keeps it wrapper-agnostic.
|
|
&:first-child,
|
|
&:last-child,
|
|
&:not(:has(~ button, ~ * button)) {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
// Flatten AppWritefullContainer's `<div class="writefull">` wrapper so the button
|
|
// is a direct flex item of the menu.
|
|
.editor-floating-menu .writefull {
|
|
display: contents;
|
|
}
|
|
|
|
@include theme('default') {
|
|
.cm-tooltip .editor-floating-menu {
|
|
border-color: var(--border-primary);
|
|
}
|
|
}
|