304 lines
5.2 KiB
CSS
304 lines
5.2 KiB
CSS
/* THIS FILE IS NOT EXPORTED WITH THE HTML FILE! */
|
|
|
|
body.html-export-running .workspace-tabs:has(.html-progress-wrapper) .workspace-tab-header-container
|
|
{
|
|
display: none !important;
|
|
}
|
|
|
|
body.html-export-running :is(.nav-files-container, .side-dock-actions, .workspace-tab-header-container, .workspace-drawer-vault-actions, .nav-buttons-container)
|
|
{
|
|
opacity: 0.2 !important;
|
|
pointer-events: none !important;
|
|
}
|
|
|
|
/* Flow list used on the settings page */
|
|
.flow-list {
|
|
contain: inline-size;
|
|
gap: 0.2em;
|
|
display: flex;
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
width: -webkit-fill-available;
|
|
background-color: var(--background-secondary);
|
|
border: 1px solid var(--divider-color);
|
|
border-radius: 5px;
|
|
padding: 6px;
|
|
}
|
|
|
|
.flow-item {
|
|
display: flex;
|
|
flex-direction: row;
|
|
border-radius: 100px;
|
|
border: 1px solid var(--divider-color);
|
|
font-size: 0.9em;
|
|
height: min-content;
|
|
width: max-content;
|
|
padding: 3px 8px 3px 8px;
|
|
margin: 0.1em 0em 0.1em 0.0em;
|
|
background-color: var(--background-primary);
|
|
align-items: center;
|
|
}
|
|
|
|
.flow-item:has(input:checked) {
|
|
background-color: hsla(var(--color-accent-hsl), 0.3);
|
|
}
|
|
|
|
.flow-item input[type="checkbox"] {
|
|
padding: 0;
|
|
margin: 0.1em;
|
|
margin-right: 0.5em;
|
|
}
|
|
|
|
.webpage-html-settings .setting-item.is-disabled
|
|
{
|
|
opacity: 0.5;
|
|
}
|
|
|
|
/* Progressbar used in the render progress */
|
|
|
|
.html-progress-bar
|
|
{
|
|
width: 300px;
|
|
height: 15px;
|
|
background-color: transparent;
|
|
color: var(--interactive-accent);
|
|
}
|
|
|
|
.html-progress-bar::-webkit-progress-bar {
|
|
background-color: var(--background-secondary);
|
|
border-radius: 500px;
|
|
}
|
|
|
|
.html-progress-bar::-webkit-progress-value {
|
|
background-color: currentColor;
|
|
border-radius: 500px;
|
|
}
|
|
|
|
button.html-progress-cancel
|
|
{
|
|
background-color: var(--color-red);
|
|
color: white;
|
|
border: none;
|
|
padding: 0.5em 1em;
|
|
border-radius: 5px;
|
|
margin-top: 1em;
|
|
}
|
|
|
|
|
|
.file-list-wrapper
|
|
{
|
|
display: flex;
|
|
flex-direction: column;
|
|
overflow: hidden;
|
|
height: -webkit-fill-available;
|
|
margin-left: 1em;
|
|
}
|
|
|
|
.file-list
|
|
{
|
|
display: flex;
|
|
flex-direction: column;
|
|
overflow: auto;
|
|
height: 100%;
|
|
width: 100%;
|
|
font-size: 12px;
|
|
line-height: 1.6em;
|
|
border-right: 1px solid var(--divider-color);
|
|
padding-bottom: 4em;
|
|
}
|
|
|
|
.file-list-title
|
|
{
|
|
font-size: 20px;
|
|
padding: 0.2em 0 0.5em 0;
|
|
margin-right: 2em;
|
|
text-align: center;
|
|
width: 100%;
|
|
}
|
|
|
|
.file-list-item {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.file-list-item-icon
|
|
{
|
|
margin-right: 0.5em;
|
|
width: 1.1em !important;
|
|
height: 1.1em !important;
|
|
}
|
|
|
|
.html-progress-wrapper
|
|
{
|
|
position: absolute;
|
|
height: 100%;
|
|
min-width: 100%;
|
|
display:flex;
|
|
flex-direction:column;
|
|
background-color: var(--background-primary);
|
|
z-index: 1000;
|
|
}
|
|
|
|
.workspace-tab-container:has(.html-progress-wrapper)
|
|
{
|
|
position: relative;
|
|
}
|
|
|
|
.html-progress-content
|
|
{
|
|
display: flex;
|
|
height: 100%;
|
|
}
|
|
|
|
.html-progress-inner
|
|
{
|
|
flex-grow: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.html-progress-sub
|
|
{
|
|
margin-block-start: 2em;
|
|
}
|
|
|
|
.html-progress-log
|
|
{
|
|
display:none;
|
|
flex-direction: column;
|
|
border-left: 1px solid var(--divider-color);
|
|
overflow-y: auto;
|
|
width: 300px;
|
|
max-width: 300px;
|
|
min-width: 300px;
|
|
}
|
|
|
|
.html-progress-log > h1
|
|
{
|
|
color: var(--color-yellow);
|
|
padding: 0.3em;
|
|
background-color: rgba(100, 70, 20, 0.1);
|
|
margin: 0;
|
|
}
|
|
|
|
/* File picker */
|
|
|
|
.file-picker .tree-icon {
|
|
border: 1px solid transparent;
|
|
margin: 0px 4px 0px 0px;
|
|
display: flex;
|
|
align-self: center;
|
|
}
|
|
|
|
.file-picker .tree-icon :is(svg, img)
|
|
{
|
|
width: 16px !important;
|
|
height: 16px !important;
|
|
}
|
|
|
|
.file-picker .tree-icon *:has(svg, img) {
|
|
display: contents !important;
|
|
}
|
|
|
|
.file-picker a.tree-item-self.is-clickable
|
|
{
|
|
text-decoration: none !important;
|
|
text-decoration-line: none !important;
|
|
outline: none !important;
|
|
border: none !important;
|
|
}
|
|
|
|
.file-picker .tree-item-inner > p
|
|
{
|
|
display: contents !important;
|
|
}
|
|
|
|
.feature-title
|
|
{
|
|
margin: 0 0 1em 0;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.06em;
|
|
}
|
|
|
|
.select-all
|
|
{
|
|
border-bottom: 1px solid var(--divider-color);
|
|
margin-bottom: 0.5em;
|
|
}
|
|
|
|
|
|
.file-picker *:before
|
|
{
|
|
display: none !important;
|
|
}
|
|
|
|
.file-picker .tree-item > .tree-item-self,
|
|
.file-picker .tree-item .tree-item-self:has(> .tree-item-icon)
|
|
{
|
|
padding-left: 5px !important;
|
|
display: flex !important;
|
|
align-items: center !important;
|
|
}
|
|
|
|
.file-picker .tree-item-self > *:not(.nav-file-tag, .file-checkbox)
|
|
{
|
|
position: relative !important;
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
translate: none !important;
|
|
}
|
|
|
|
.file-picker .tree-item-self > .file-checkbox
|
|
{
|
|
margin-right: 1em;
|
|
}
|
|
|
|
.file-picker .tree-item-self > .tree-item-inner
|
|
{
|
|
padding: 0 0.3em !important;
|
|
}
|
|
|
|
.file-picker .tree-item-children > *
|
|
{
|
|
margin: 0 !important;
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.file-picker .collapse-icon,
|
|
.file-picker .collapse-icon *
|
|
{
|
|
display: block !important;
|
|
}
|
|
|
|
|
|
/* Settings sections */
|
|
details.settings-section
|
|
{
|
|
padding-left: 2em;
|
|
border-left: 1px solid var(--interactive-accent);
|
|
}
|
|
|
|
details.settings-section > summary
|
|
{
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 1em;
|
|
margin-left: -1em;
|
|
}
|
|
|
|
details.settings-section > summary > svg
|
|
{
|
|
min-width: 18px;
|
|
min-height: 18px;
|
|
rotate: 0deg;
|
|
transition: rotate 0.2s;
|
|
}
|
|
|
|
details.settings-section[open] > summary > svg
|
|
{
|
|
rotate: 90deg;
|
|
}
|