trilium/apps/client/src/widgets/layout/InlineTitle.css
2025-12-15 16:50:26 +02:00

114 lines
2.0 KiB
CSS

:root {
--title-transition: opacity 200ms ease-in;
}
.component.inline-title {
contain: none;
}
.inline-title {
max-width: var(--max-content-width);
padding-inline-start: 24px;
& > .inline-title-row {
display: flex;
align-items: center;
transition: var(--title-transition);
&.hidden {
opacity: 0;
pointer-events: none;
}
}
&.hidden {
display: none;
}
.note-icon-widget {
padding: 0;
}
.inline-title-row {
border-bottom: 2px solid gray;
}
}
.title-row {
&.note-icon-widget,
&.note-title-widget {
transition: var(--title-transition);
}
&.hide-title .note-icon-widget,
&.hide-title .note-title-widget {
opacity: 0;
pointer-events: none;
}
}
.note-split.type-code:not(.mime-text-x-sqlite) .inline-title {
background-color: var(--main-background-color);
}
body.prefers-centered-content .inline-title {
margin-inline: auto;
}
.title-details {
display: flex;
gap: 0.25em;
margin: 0;
margin-top: 4px;
list-style-type: none;
opacity: .5;
flex-wrap: wrap;
span.value {
font-weight: 500;
}
}
.note-type-switcher {
padding: .25em 0;
display: flex;
align-items: center;
overflow-x: auto;
min-width: 0;
gap: 5px;
min-height: 40px;
--badge-radius: 12px;
>* {
flex-shrink: 0;
}
.ext-badge {
--color: var(--input-background-color);
color: var(--main-text-color);
font-size: 0.9rem;
flex-shrink: 0;
}
}
.edited-notes {
padding: 1.5em 0;
.collapsible-inner-body {
display: flex;
flex-wrap: wrap;
gap: 0.3em;
.badge {
margin: 0;
a.tn-link {
color: inherit;
text-transform: none;
text-decoration: none;
display: inline-block;
}
}
}
}