mirror of
https://github.com/docmost/docmost.git
synced 2025-11-12 08:32:38 +10:00
8aa604637e
* feat: nested toggle block * fix: md export * fix detailsButton icon alignment --------- Co-authored-by: Philipinho <16838612+Philipinho@users.noreply.github.com>
74 lines
1.6 KiB
CSS
74 lines
1.6 KiB
CSS
.ProseMirror {
|
|
[data-type="details"] {
|
|
display: flex;
|
|
padding: 0.5em;
|
|
border-radius: 4px;
|
|
border: 1px solid transparent;
|
|
transition: border 0.3s;
|
|
width: 100%;
|
|
|
|
&:hover {
|
|
border: 1px solid
|
|
light-dark(var(--mantine-color-gray-3), var(--mantine-color-gray-7));
|
|
|
|
[data-type="detailsSummary"] {}
|
|
}
|
|
|
|
[data-type="detailsButton"] {
|
|
display: flex;
|
|
cursor: pointer;
|
|
border: none;
|
|
padding: 0;
|
|
background: transparent;
|
|
|
|
.ProseMirror-icon {
|
|
width: 2em;
|
|
height: 2em;
|
|
transform: rotateZ(0deg);
|
|
transition: transform 0.3s;
|
|
}
|
|
|
|
> div {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 4px;
|
|
|
|
&:hover,
|
|
&.active {
|
|
color: light-dark(
|
|
var(--mantine-color-gray-8),
|
|
var(--mantine-color-gray-0)
|
|
);
|
|
background: light-dark(
|
|
var(--mantine-color-gray-1),
|
|
var(--mantine-color-gray-8)
|
|
);
|
|
}
|
|
}
|
|
}
|
|
|
|
[data-type="detailsContainer"] {
|
|
flex: 1;
|
|
padding: 4px;
|
|
word-break: break-word;
|
|
overflow-wrap: break-word;
|
|
}
|
|
}
|
|
|
|
[data-type="details"] > [data-type="detailsContainer"] > [data-type="detailsContent"]{
|
|
display: none;
|
|
}
|
|
|
|
[data-type="details"][open] > [data-type="detailsContainer"] > [data-type="detailsContent"]{
|
|
display: block;
|
|
}
|
|
|
|
[data-type="details"][open] > [data-type="detailsButton"] {
|
|
align-items: start;
|
|
}
|
|
|
|
[data-type="details"][open] > [data-type="detailsButton"] .ProseMirror-icon{
|
|
transform: rotateZ(90deg);
|
|
}
|
|
} |