P12 Flow-Editor Neuausrichtung + alle 30 Baustein-Konfig-Modale
- Flow-Editor auf n8n-Stil umgestellt: V1 Vollbild minimal als Basis (Vollbild-Canvas, Umschalter Bauen/Aktivität/Auswertung, Probelauf unten Mitte, Aktiv-Toggle + History im Header) - Baustein-Konfig als Modal entschieden (Dialog-Komponente); S05a Vorplanung mit allen 31 Panels, 30 v1-Panels in Subframe gebaut (K-Seiten, Nacht-Build 2026-07-12) - Subframe-Links + Abgleich-Notizen in P12-Screens und Tracker nachgetragen - D-FORM Form Builder: Review-Stand, Simple-Builder-Neuausrichtung, aufgeräumte Varianten - P15 Kommunikation + P16 Termine Pakete, Map/Canvas-Pflege Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
1 parent
ef07e3d005
commit
04220c1431
100 files changed
+10937
-2185
No files matched your search
+7770
File diff suppressed because it is too large.
Load diff
+11
@@ -0,0 +1,11 @@
|
||||
{
|
||||
"id": "advanced-canvas",
|
||||
"name": "Advanced Canvas",
|
||||
"version": "6.4.0",
|
||||
"minAppVersion": "1.7.2",
|
||||
"description": "Supercharge your canvas experience! Create presentations, flowcharts and more!",
|
||||
"author": "Developer-Mike",
|
||||
"authorUrl": "https://github.com/Developer-Mike",
|
||||
"fundingUrl": "https://ko-fi.com/X8X27IA08",
|
||||
"isDesktopOnly": false
|
||||
}
|
||||
+536
@@ -0,0 +1,536 @@
|
||||
/* src/styles.scss */
|
||||
.ac-settings .properties-field > .setting-item-info {
|
||||
flex: 0;
|
||||
margin: 0;
|
||||
padding: var(--size-4-1) var(--size-4-2);
|
||||
border: var(--input-border-width) solid var(--background-modifier-border);
|
||||
border-radius: var(--input-radius) 0 0 var(--input-radius);
|
||||
}
|
||||
.ac-settings .properties-field > .setting-item-control > input {
|
||||
width: 100%;
|
||||
border-radius: 0 var(--input-radius) var(--input-radius) 0;
|
||||
}
|
||||
.ac-settings .ac-settings-heading:not(:first-child) {
|
||||
margin-top: var(--size-4-10) !important;
|
||||
}
|
||||
.ac-settings .ac-settings-heading:has(.checkbox-container:not(.is-enabled)) {
|
||||
border-bottom-color: var(--background-modifier-border-hover);
|
||||
}
|
||||
.ac-settings .ac-settings-heading .setting-item-description {
|
||||
margin-inline-end: 20px;
|
||||
}
|
||||
.ac-settings .settings-header-children {
|
||||
transform-origin: top center;
|
||||
transform: scaleY(1);
|
||||
transition: transform 0.2s ease-in-out;
|
||||
}
|
||||
.ac-settings .ac-settings-heading:has(.checkbox-container:not(.is-enabled)) + .settings-header-children {
|
||||
opacity: 0.5;
|
||||
pointer-events: none;
|
||||
height: 0;
|
||||
transform: scaleY(0);
|
||||
}
|
||||
.ac-settings .setting-item > .setting-item-control input[type=text] {
|
||||
width: 75px;
|
||||
}
|
||||
.ac-settings details.setting-item {
|
||||
flex-direction: column;
|
||||
align-items: initial;
|
||||
}
|
||||
.ac-settings details.setting-item:not([open]) {
|
||||
row-gap: 0;
|
||||
}
|
||||
.ac-settings details.setting-item[open] {
|
||||
padding-bottom: var(--size-4-2);
|
||||
}
|
||||
.ac-settings details.setting-item[open] > summary {
|
||||
margin-bottom: var(--size-4-2);
|
||||
}
|
||||
.ac-settings details.setting-item > *:not(summary) {
|
||||
border: 1px solid var(--background-primary);
|
||||
}
|
||||
.ac-settings .kofi-banner {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: var(--size-4-3);
|
||||
background-color: var(--background-primary-alt);
|
||||
border-radius: var(--radius-m);
|
||||
}
|
||||
.ac-settings .kofi-banner .ac-kofi-banner-title {
|
||||
margin: 0;
|
||||
font-size: var(--font-ui-small);
|
||||
font-weight: 600;
|
||||
}
|
||||
.ac-settings .kofi-banner .ac-kofi-button {
|
||||
width: min-content;
|
||||
height: min-content;
|
||||
line-height: 0;
|
||||
}
|
||||
.ac-settings .kofi-banner .ac-kofi-button img {
|
||||
min-width: 75px;
|
||||
width: 25%;
|
||||
max-width: 100px;
|
||||
}
|
||||
.canvas-wrapper > .document-search-container {
|
||||
transform: translateZ(0);
|
||||
margin: 0;
|
||||
}
|
||||
.canvas-wrapper:not(.mod-readonly) .show-while-readonly {
|
||||
display: none;
|
||||
}
|
||||
.canvas-control-item[data-toggled=true] {
|
||||
background-color: var(--color-accent);
|
||||
}
|
||||
.canvas-control-item[data-toggled=true] svg {
|
||||
stroke: var(--text-on-accent);
|
||||
}
|
||||
.reactive-node,
|
||||
.canvas-node[data-shape=database],
|
||||
.canvas-node[data-shape=document],
|
||||
.canvas-node[data-shape=predefined-process],
|
||||
.canvas-node[data-shape=diamond] {
|
||||
--border-color: rgb(var(--canvas-color));
|
||||
--border-width: 3px;
|
||||
--box-shadow: none;
|
||||
}
|
||||
.reactive-node.is-focused,
|
||||
.is-focused.canvas-node[data-shape=database],
|
||||
.is-focused.canvas-node[data-shape=document],
|
||||
.is-focused.canvas-node[data-shape=predefined-process],
|
||||
.is-focused.canvas-node[data-shape=diamond],
|
||||
.reactive-node.is-selected,
|
||||
.is-selected.canvas-node[data-shape=database],
|
||||
.is-selected.canvas-node[data-shape=document],
|
||||
.is-selected.canvas-node[data-shape=predefined-process],
|
||||
.is-selected.canvas-node[data-shape=diamond] {
|
||||
--border-color: var(--color-accent);
|
||||
--border-width: 5px;
|
||||
--box-shadow: var(--shadow-border-accent);
|
||||
}
|
||||
.reactive-node.is-themed,
|
||||
.is-themed.canvas-node[data-shape=database],
|
||||
.is-themed.canvas-node[data-shape=document],
|
||||
.is-themed.canvas-node[data-shape=predefined-process],
|
||||
.is-themed.canvas-node[data-shape=diamond] {
|
||||
--border-color: rgba(var(--canvas-color), 0.7);
|
||||
}
|
||||
.reactive-node.is-themed.is-focused,
|
||||
.is-themed.is-focused.canvas-node[data-shape=database],
|
||||
.is-themed.is-focused.canvas-node[data-shape=document],
|
||||
.is-themed.is-focused.canvas-node[data-shape=predefined-process],
|
||||
.is-themed.is-focused.canvas-node[data-shape=diamond],
|
||||
.reactive-node.is-themed.is-selected,
|
||||
.is-themed.is-selected.canvas-node[data-shape=database],
|
||||
.is-themed.is-selected.canvas-node[data-shape=document],
|
||||
.is-themed.is-selected.canvas-node[data-shape=predefined-process],
|
||||
.is-themed.is-selected.canvas-node[data-shape=diamond] {
|
||||
--border-color: rgb(var(--canvas-color));
|
||||
--box-shadow: var(--shadow-border-themed);
|
||||
}
|
||||
.canvas-node[data-text-align=center] .markdown-preview-view {
|
||||
scrollbar-gutter: auto;
|
||||
}
|
||||
.canvas-node[data-text-align=center] .markdown-preview-view .markdown-preview-section {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
}
|
||||
.canvas-node[data-text-align=right] {
|
||||
text-align: right;
|
||||
}
|
||||
.canvas-node[data-shape] .canvas-node-container .markdown-preview-view.markdown-rendered {
|
||||
transform: unset;
|
||||
}
|
||||
.canvas-node[data-shape=pill] .canvas-node-container {
|
||||
border-radius: 5000px;
|
||||
}
|
||||
.canvas-node[data-shape=diamond] {
|
||||
}
|
||||
.canvas-node[data-shape=diamond].is-focused,
|
||||
.canvas-node[data-shape=diamond].is-selected {
|
||||
border-radius: var(--radius-m);
|
||||
outline: 2px solid var(--color-accent);
|
||||
outline-offset: 5px;
|
||||
}
|
||||
.canvas-node[data-shape=diamond] .canvas-node-container {
|
||||
border: none;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.canvas-node[data-shape=diamond] .canvas-node-container:not(:has(.embed-iframe)) {
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
|
||||
mask-repeat: no-repeat;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-size: 100%;
|
||||
-webkit-mask-size: 100%;
|
||||
}
|
||||
.canvas-node[data-shape=diamond] .canvas-node-container .canvas-node-placeholder::after {
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
|
||||
mask-repeat: no-repeat;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-size: 100%;
|
||||
-webkit-mask-size: 100%;
|
||||
}
|
||||
.canvas-node[data-shape=diamond]::before {
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 141.42135624 141.42135624' preserveAspectRatio='none'%3E%3Cstyle%3E rect %7B transform-origin: center; transform: rotate(45deg) scale(1.05); %7D %3C/style%3E%3Crect rx='8' x='20.71067812' y='20.71067812' width='100' height='100' /%3E%3C/svg%3E");
|
||||
mask-repeat: no-repeat;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-size: 100%;
|
||||
-webkit-mask-size: 100%;
|
||||
content: "";
|
||||
position: absolute;
|
||||
top: calc(var(--border-width) * -1);
|
||||
left: calc(var(--border-width) * -1);
|
||||
width: calc(100% + var(--border-width) * 2);
|
||||
height: calc(100% + var(--border-width) * 2);
|
||||
background-color: var(--border-color);
|
||||
}
|
||||
.canvas-node[data-shape=parallelogram] .canvas-node-container {
|
||||
transform: skewX(-20deg);
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
.canvas-node[data-shape=parallelogram] .canvas-node-container .canvas-node-content > .markdown-embed-content {
|
||||
transform: skewX(20deg);
|
||||
}
|
||||
.canvas-node[data-shape=circle] .canvas-node-container {
|
||||
border-radius: 50%;
|
||||
}
|
||||
.canvas-node[data-shape=circle] .canvas-node-container .markdown-preview-view {
|
||||
overflow-y: initial;
|
||||
}
|
||||
.canvas-node[data-shape=predefined-process] .canvas-node-container .canvas-node-content {
|
||||
padding: 0 10px;
|
||||
}
|
||||
.canvas-node[data-shape=predefined-process] .canvas-node-container::before,
|
||||
.canvas-node[data-shape=predefined-process] .canvas-node-container::after {
|
||||
content: "";
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 0;
|
||||
height: 100%;
|
||||
border-left: var(--border-width) solid var(--border-color);
|
||||
}
|
||||
.canvas-node[data-shape=predefined-process] .canvas-node-container::before {
|
||||
left: calc(10px - var(--border-width));
|
||||
}
|
||||
.canvas-node[data-shape=predefined-process] .canvas-node-container::after {
|
||||
right: calc(10px - var(--border-width));
|
||||
}
|
||||
.canvas-node[data-shape=document] {
|
||||
--border-width: 2.5px;
|
||||
filter: drop-shadow(0 var(--border-width) 0 var(--border-color)) drop-shadow(0 calc(var(--border-width) * -1) 0 var(--border-color));
|
||||
}
|
||||
.canvas-node[data-shape=document] .canvas-node-container {
|
||||
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 75 45' preserveAspectRatio='none'%3E%3Cpath d='M75 0 75 39.375Q56.25 29.25 37.5 39.375 18.75 49.5 0 39.375L0 0Z' /%3E%3C/svg%3E");
|
||||
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 75 45' preserveAspectRatio='none'%3E%3Cpath d='M75 0 75 39.375Q56.25 29.25 37.5 39.375 18.75 49.5 0 39.375L0 0Z' /%3E%3C/svg%3E");
|
||||
mask-repeat: no-repeat;
|
||||
-webkit-mask-repeat: no-repeat;
|
||||
mask-size: 100%;
|
||||
-webkit-mask-size: 100%;
|
||||
border: var(--border-width) solid var(--border-color);
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
}
|
||||
.canvas-node[data-shape=document].is-focused,
|
||||
.canvas-node[data-shape=document].is-selected {
|
||||
--border-width: 4px;
|
||||
}
|
||||
.canvas-node[data-shape=database] {
|
||||
}
|
||||
.canvas-node[data-shape=database] .canvas-node-container {
|
||||
border: var(--border-width) solid var(--border-color);
|
||||
border-bottom: 0;
|
||||
border-top: 0;
|
||||
border-radius: 0;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
.canvas-node[data-shape=database] .canvas-node-container .canvas-node-placeholder {
|
||||
transform: translateY(25px);
|
||||
}
|
||||
.canvas-node[data-shape=database]::before,
|
||||
.canvas-node[data-shape=database]::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
border: var(--border-width) solid var(--border-color);
|
||||
background-color: var(--background-primary);
|
||||
}
|
||||
.canvas-node[data-shape=database]::after {
|
||||
top: -25px;
|
||||
}
|
||||
.canvas-node[data-shape=database]::before {
|
||||
bottom: -25px;
|
||||
}
|
||||
.canvas-node[data-shape=database].is-themed .canvas-node-content {
|
||||
background-color: transparent;
|
||||
}
|
||||
.canvas-node[data-shape=database].is-themed:not(:has(.embed-iframe)) .canvas-node-container,
|
||||
.canvas-node[data-shape=database].is-themed:not(:has(.embed-iframe))::after,
|
||||
.canvas-node[data-shape=database].is-themed:not(:has(.embed-iframe))::before {
|
||||
box-shadow: inset 0 0 0 1000px rgba(var(--canvas-color), 0.07) !important;
|
||||
}
|
||||
.canvas-node[data-shape=database] .canvas-node-content:not(:has(.embed-iframe)) {
|
||||
transform: translateY(20px);
|
||||
}
|
||||
.canvas-node[data-shape=database]:has(.embed-iframe)::after {
|
||||
z-index: -1;
|
||||
}
|
||||
.canvas-node[data-border=dashed] .canvas-node-container {
|
||||
box-shadow: none;
|
||||
border-style: dashed;
|
||||
}
|
||||
.canvas-node[data-border=dotted] .canvas-node-container {
|
||||
box-shadow: none;
|
||||
border-style: dotted;
|
||||
}
|
||||
.canvas-node[data-border=invisible] {
|
||||
box-shadow: none;
|
||||
}
|
||||
.canvas-node[data-border=invisible]:not(.is-focused):not(.is-selected) .canvas-node-container {
|
||||
border-color: transparent !important;
|
||||
}
|
||||
.canvas-node[data-border=invisible] .canvas-node-label {
|
||||
display: none;
|
||||
}
|
||||
.canvas-node[data-border=invisible] .canvas-node-container {
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
}
|
||||
.canvas-node[data-border][data-shape=predefined-process] {
|
||||
--border-width: 2px;
|
||||
}
|
||||
.canvas-node[data-border][data-shape=predefined-process] .is-focused,
|
||||
.canvas-node[data-border][data-shape=predefined-process] .is-selected {
|
||||
--border-width: 2px;
|
||||
}
|
||||
.canvas-node[data-border=dashed][data-shape=predefined-process] .canvas-node-container::before,
|
||||
.canvas-node[data-border=dashed][data-shape=predefined-process] .canvas-node-container::after {
|
||||
border-left: var(--border-width) dashed var(--border-color);
|
||||
}
|
||||
.canvas-node[data-border=dotted][data-shape=predefined-process] .canvas-node-container::before,
|
||||
.canvas-node[data-border=dotted][data-shape=predefined-process] .canvas-node-container::after {
|
||||
border-left: var(--border-width) dotted var(--border-color);
|
||||
}
|
||||
.canvas-node[data-border][data-shape=document] .canvas-node-container {
|
||||
border-top: none;
|
||||
border-bottom: none;
|
||||
}
|
||||
.canvas-edges path[data-path=dotted] {
|
||||
stroke-dasharray: calc(3px * var(--zoom-multiplier));
|
||||
}
|
||||
.canvas-edges path[data-path=short-dashed] {
|
||||
stroke-dasharray: 9px;
|
||||
}
|
||||
.canvas-edges path[data-path=long-dashed] {
|
||||
stroke-dasharray: 18px;
|
||||
}
|
||||
.canvas-edges [data-arrow=triangle-outline] polygon,
|
||||
.canvas-edges [data-arrow=diamond-outline] polygon,
|
||||
.canvas-edges [data-arrow=circle-outline] polygon {
|
||||
fill: var(--canvas-background);
|
||||
stroke: rgb(var(--canvas-color));
|
||||
stroke-width: calc(3px * var(--zoom-multiplier));
|
||||
}
|
||||
.canvas-edges [data-arrow=thin-triangle] polygon {
|
||||
fill: transparent;
|
||||
stroke: rgb(var(--canvas-color));
|
||||
stroke-width: calc(4px * var(--zoom-multiplier));
|
||||
}
|
||||
.icon-modal-suggestion {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: var(--size-4-4);
|
||||
}
|
||||
.icon-modal-suggestion .icon-modal-suggestion-icon {
|
||||
line-height: 0;
|
||||
}
|
||||
.icon-modal-suggestion .icon-modal-suggestion-id {
|
||||
font-size: var(--font-ui-smaller);
|
||||
color: var(--text-muted);
|
||||
}
|
||||
.canvas.is-exporting {
|
||||
--zoom-multiplier: 1;
|
||||
}
|
||||
.canvas.is-exporting * {
|
||||
pointer-events: none !important;
|
||||
transition: none !important;
|
||||
}
|
||||
.canvas.is-exporting .collapse-button {
|
||||
display: none;
|
||||
}
|
||||
.canvas.is-exporting #watermark-ac {
|
||||
z-index: 9999999;
|
||||
position: absolute;
|
||||
}
|
||||
.canvas-wrapper[data-collapsible-groups-feature-enabled=true] .canvas.is-exporting .canvas-node .canvas-group-label {
|
||||
left: 0;
|
||||
}
|
||||
.progress-bar-modal-ac {
|
||||
margin-top: 0.75em;
|
||||
}
|
||||
.progress-bar-modal-ac.error .setting-progress-bar {
|
||||
color: var(--color-error);
|
||||
}
|
||||
.canvas-wrapper[data-disable-font-size-relative-to-zoom=true] {
|
||||
--zoom-multiplier: 1 !important;
|
||||
}
|
||||
.canvas-wrapper.mod-readonly .canvas-controls .canvas-control-group:nth-child(3),
|
||||
.canvas-wrapper.mod-readonly .canvas-card-menu {
|
||||
display: none;
|
||||
}
|
||||
.canvas-wrapper.mod-readonly[data-hide-background-grid-when-in-readonly=true] .canvas-background {
|
||||
visibility: hidden;
|
||||
}
|
||||
.collapse-button {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: calc(-1 * var(--size-4-1) * var(--zoom-multiplier));
|
||||
padding: var(--size-4-1) var(--size-4-2);
|
||||
transform-origin: bottom left;
|
||||
transform: translate(0, -100%) scale(var(--zoom-multiplier));
|
||||
border-radius: var(--radius-s);
|
||||
color: var(--text-muted);
|
||||
background-color: rgba(var(--canvas-color), 0.1);
|
||||
font-size: 1.5em;
|
||||
line-height: 1;
|
||||
pointer-events: initial;
|
||||
cursor: pointer;
|
||||
transition: transform 500ms cubic-bezier(0.16, 1, 0.3, 1);
|
||||
}
|
||||
.canvas-wrapper[data-collapsible-groups-feature-enabled=true] .canvas-node .canvas-group-label {
|
||||
left: calc(40px * var(--zoom-multiplier));
|
||||
}
|
||||
.canvas-node[data-collapsed] .canvas-node-container {
|
||||
display: none;
|
||||
}
|
||||
.canvas-node[data-collapsed] .canvas-group-label {
|
||||
max-width: initial;
|
||||
}
|
||||
.canvas-wrapper[data-collapsed-group-preview-on-drag=true][data-is-dragging] .canvas-node[data-collapsed] .canvas-node-container {
|
||||
display: block;
|
||||
opacity: 0.5;
|
||||
border-style: dashed;
|
||||
}
|
||||
.canvas-wrapper[data-collapsed-group-preview-on-drag=true][data-is-dragging] .canvas-node[data-collapsed] .canvas-node-container .canvas-node-content {
|
||||
background-color: transparent;
|
||||
}
|
||||
.canvas-node-interaction-layer[data-target-collapsed] .canvas-node-resizer {
|
||||
pointer-events: none;
|
||||
cursor: inherit;
|
||||
}
|
||||
.canvas-node-interaction-layer[data-target-collapsed] .canvas-node-resizer .canvas-node-connection-point {
|
||||
display: none;
|
||||
pointer-events: none;
|
||||
}
|
||||
.canvas-wrapper[data-allow-floating-edge-creation=true] .canvas.is-connecting .canvas-node:not(.canvas-node-group)::after {
|
||||
all: unset;
|
||||
content: "";
|
||||
z-index: 100;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
width: max(10px, 100% - 50px * var(--zoom-multiplier) * 2);
|
||||
height: max(10px, 100% - 50px * var(--zoom-multiplier) * 2);
|
||||
transform: translate(-50%, -50%);
|
||||
border-radius: var(--radius-m);
|
||||
outline: calc(4px * var(--zoom-multiplier)) dashed hsla(var(--color-accent-hsl), 0.5);
|
||||
}
|
||||
.canvas-wrapper[data-allow-floating-edge-creation=true] .canvas.is-connecting .canvas-node:not(.canvas-node-group).hovering-floating-edge-zone::after {
|
||||
outline-color: var(--color-accent);
|
||||
outline-style: solid;
|
||||
background-color: hsla(var(--color-accent-hsl), 0.1);
|
||||
}
|
||||
.canvas-wrapper[data-focus-mode-enabled=true] .canvas:has(.canvas-node.is-focused) .canvas-node:not(.is-focused) {
|
||||
filter: blur(5px);
|
||||
}
|
||||
.canvas-wrapper[data-focus-mode-enabled=true] .canvas:has(.canvas-node.is-focused) .canvas-edges > g:not(.is-focused) {
|
||||
filter: blur(5px);
|
||||
}
|
||||
.canvas-wrapper[data-focus-mode-enabled=true] .canvas:has(.canvas-node.is-focused) .canvas-path-label-wrapper > .canvas-path-label:not(.is-focused) {
|
||||
filter: blur(5px);
|
||||
}
|
||||
.canvas-wrapper.presentation-mode .canvas-controls {
|
||||
visibility: hidden;
|
||||
}
|
||||
.canvas-wrapper.presentation-mode .canvas-card-menu {
|
||||
visibility: hidden;
|
||||
}
|
||||
.canvas-wrapper:not(.presentation-mode) .canvas-node[data-is-start-node=true]::before {
|
||||
content: "Start";
|
||||
position: absolute;
|
||||
top: calc(-1 * var(--size-4-1) * var(--zoom-multiplier));
|
||||
right: 0;
|
||||
transform: translate(0, -100%) scale(var(--zoom-multiplier));
|
||||
transform-origin: bottom right;
|
||||
max-width: calc(100% / var(--zoom-multiplier));
|
||||
padding: var(--size-4-1) var(--size-4-2);
|
||||
font-size: 1em;
|
||||
border-radius: var(--radius-s);
|
||||
color: var(--color-green);
|
||||
background-color: rgba(var(--color-green-rgb), 0.1);
|
||||
}
|
||||
.canvas-node[data-is-portal-loaded=true] {
|
||||
pointer-events: all;
|
||||
}
|
||||
.canvas-node[data-is-portal-loaded=true]:not(.is-focused) {
|
||||
pointer-events: none;
|
||||
}
|
||||
.canvas-node[data-is-portal-loaded=true]:not(.is-focused) .canvas-node-label {
|
||||
pointer-events: all;
|
||||
}
|
||||
.canvas-node[data-is-portal-loaded=true] .canvas-node-container {
|
||||
background-color: transparent;
|
||||
border-style: dashed;
|
||||
}
|
||||
.canvas-node[data-is-portal-loaded=true] .canvas-node-container .canvas-node-content {
|
||||
display: none;
|
||||
}
|
||||
.canvas-node-interaction-layer[data-is-from-portal=true] .canvas-node-resizer {
|
||||
pointer-events: none;
|
||||
cursor: inherit;
|
||||
}
|
||||
.canvas-node-interaction-layer[data-is-from-portal=true] .canvas-node-resizer .canvas-node-connection-point {
|
||||
pointer-events: all;
|
||||
}
|
||||
.ac-card-embed {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
background-color: var(--background-primary);
|
||||
border: 1px solid rgb(var(--canvas-color));
|
||||
border-radius: var(--radius-m);
|
||||
box-shadow: var(--shadow-stationary);
|
||||
}
|
||||
.ac-card-embed.is-themed {
|
||||
background-color: rgba(var(--canvas-color), 0.07);
|
||||
border-color: rgba(var(--canvas-color), 0.7);
|
||||
box-shadow: inset 0 0 0 1px rgba(var(--canvas-color), 0.7), var(--shadow-stationary);
|
||||
}
|
||||
.ac-card-embed > .markdown-content {
|
||||
position: relative;
|
||||
overflow-y: auto;
|
||||
overflow-wrap: break-word;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0 var(--size-4-4);
|
||||
font-size: var(--font-text-size);
|
||||
font-family: var(--font-text);
|
||||
line-height: var(--line-height-normal);
|
||||
color: var(--text-normal);
|
||||
user-select: text;
|
||||
-webkit-user-select: text;
|
||||
scrollbar-gutter: stable;
|
||||
}
|
||||
@@ -0,0 +1,9 @@
|
||||
/*
|
||||
THIS IS A GENERATED/BUNDLED FILE BY ESBUILD
|
||||
if you want to view the source, please visit the github repository of this plugin:
|
||||
https://github.com/kotaindah55/better-embedded-canvas
|
||||
*/
|
||||
|
||||
var P=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var q=Object.getOwnPropertyNames;var G=Object.prototype.hasOwnProperty;var j=(n,e)=>{for(var t in e)P(n,t,{get:e[t],enumerable:!0})},w=(n,e,t,i)=>{if(e&&typeof e=="object"||typeof e=="function")for(let s of q(e))!G.call(n,s)&&s!==t&&P(n,s,{get:()=>e[s],enumerable:!(i=_(e,s))||i.enumerable});return n},k=(n,e,t)=>(w(n,e,"default"),t&&w(t,e,"default"));var Q=n=>w(P({},"__esModule",{value:!0}),n);var te={};j(te,{BetterEmbeddedCanvasPlugin:()=>C,default:()=>ee});module.exports=Q(te);var a={};k(a,require("obsidian"));function U(n){return{app:n,containerEl:createDiv(),history:{backHistory:[],forwardHistory:[]}}}function D(n){let e=n.internalPlugins.getPluginById("canvas").views.canvas;u=e(U(n)).canvas.constructor}var u;function O(n){let e=new u(n);return e.quickSettingsButton.parentElement?.detach(),e.undoBtnEl.parentElement?.detach(),a.Platform.isMobile||e.canvasControlsEl.lastElementChild?.detach(),e.cardMenuEl.detach(),e.setReadonly(!0),e.wrapperEl.addEventListener("drop",t=>t.preventDefault(),!0),e}function I(n,e,t){let i=n.embedRegistry,s=i.embedByExtension[e]??null;return i.unregisterExtension(e),i.registerExtension(e,t),s}function g(n,e){return n.internalPlugins.getPluginById(e)}function x(n){return n.matches("body > div.print *")}var S={A3:{width:1123,height:1587},A4:{width:794,height:1123},A5:{width:559,height:794},Legal:{width:816,height:1344},Letter:{width:816,height:1054},Tabloid:{width:1056,height:1632}},A=37;var L={tooltipOpenCanvas:"Open canvas",tooltipEnableInteraction:"Enable interaction",tooltipDisableInteraction:"Disable interaction",reloadNotesPrompt:{title:"Reload notes",desc:"Select \u201CReload\u201D to reload all open notes and revert embedded canvases to their default (your data is preserved).",buttonReload:"Reload"},settings:{showCanvasName:{name:"Show canvas name",desc:"Show canvas name as embed title."}}};var M={tooltipOpenCanvas:"Buka kanvas",tooltipEnableInteraction:"Nyalakan interaksi",tooltipDisableInteraction:"Matikan interaksi",reloadNotesPrompt:{title:"Muat ulang catatan",desc:"Pilih \u201CMuat ulang\u201D untuk memuat ulang catatan yang terbuka dan mengembalikan kanvas yang disematkan pada tampilan bawaan (data Anda tetap terjaga).",buttonReload:"Muat ulang"},settings:{showCanvasName:{name:"Tampilkan nama kanvas",desc:"Tampilkan nama kanvas sebagai judul sematan."}}};var T=i18next.createInstance({lng:(0,a.getLanguage)(),fallbackLng:"en",resources:{en:{translation:L},id:{translation:M}}});T.init();var l=T.t.bind(T);var c=new Map,p=new Map;function X(n){let{wrapperEl:e}=n,t=e.getBoundingClientRect(),i=t.left+e.clientLeft,s=t.top+e.clientTop,r=e.clientWidth,o=e.clientHeight;n.canvasRect={left:i,top:s,width:r,height:o,cx:i+r/2,cy:s+o/2,minX:-r/2,minY:-o/2,maxX:r/2,maxY:r/2}}function B(){p.has(this)||p.set(this,(0,a.debounce)(()=>{c.get(this)?.forEach(n=>X(n.canvas)),p.delete(this)},20)())}function R(n){c.forEach(e=>e.forEach(n))}function N(n){let e=n.contentEl.win,t=c.get(e);t?t.add(n):(c.set(e,new Set([n])),e.addEventListener("scroll",B,{capture:!0,passive:!0}))}function z(n){let e=n.contentEl.win,t=c.get(e);t?.delete(n),t&&!t.size&&(p.get(e)?.cancel(),p.delete(e),c.delete(e),e.removeEventListener("scroll",B,!0))}function H(){p.forEach(n=>n.cancel()),p.clear(),c.forEach((n,e)=>{e.removeEventListener("scroll",B,!0),n.forEach(t=>t.unload())}),c.clear()}var K=300;function $(n){return n.matches(".canvas-node *")}var h=class n extends a.Component{app;canvas;contentEl;plugin;file;ctx;subpath;becPlugin;containerEl;headerEl;mainControlsEl;zoomControlsEl;openCanvasBtnEl;toggleInteractionBtnEl;resizeObserver;mutationObserver;constructor(e,t,i,s){super(),this.app=t.app,this.plugin=g(this.app,"canvas").instance,this.becPlugin=e,this.ctx=t,this.file=i,this.subpath=s,this.containerEl=t.containerEl,this.containerEl.addClass("canvas-embed","better-canvas-embed"),this.containerEl.toggleClass("inline-embed",t.showInline??!1),this.headerEl=this.containerEl.createDiv("embed-title",r=>{r.createSpan("file-embed-icon",o=>(0,a.setIcon)(o,"lucide-layout-dashboard")),r.appendText(" "+i.basename),r.addEventListener("click",o=>this.openOnClick(o)),r.toggle(e.settings.get("showCanvasName"))}),this.contentEl=this.containerEl.createDiv("canvas-content"),this.resizeObserver=new ResizeObserver(()=>this.canvas.onResize()),this.mutationObserver=new MutationObserver(()=>this.updateHeight()),this.canvas=O(this),this.zoomControlsEl=this.canvas.canvasControlsEl.firstElementChild,this.mainControlsEl=this.canvas.canvasControlsEl.createDiv({cls:["canvas-control-group","mod-raised"],prepend:!0}),this.openCanvasBtnEl=this.mainControlsEl.createDiv("canvas-control-item",r=>{(0,a.setIcon)(r,"lucide-maximize-2"),(0,a.setTooltip)(r,l("tooltipOpenCanvas"),{placement:"left"}),r.addEventListener("click",o=>this.openOnClick(o))}),this.toggleInteractionBtnEl=this.mainControlsEl.createDiv("canvas-control-item",r=>{(0,a.setIcon)(r,"pointer"),(0,a.setTooltip)(r,l("tooltipLine truncated
|
||||
|
||||
/* nosourcemap */
|
||||
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"id": "better-embedded-canvas",
|
||||
"name": "Better Embedded Canvas",
|
||||
"version": "0.2.4",
|
||||
"minAppVersion": "1.10.0",
|
||||
"description": "Give your embedded canvas better display and interactivity.",
|
||||
"author": "Kotaindah55",
|
||||
"authorUrl": "https://github.com/kotaindah55",
|
||||
"isDesktopOnly": false
|
||||
}
|
||||
@@ -0,0 +1 @@
|
||||
body{--embedded-canvas-min-height: 300px;--embedded-canvas-border-width: 1px;--embedded-canvas-border-color: var(--background-modifier-border)}.canvas-embed.better-canvas-embed.internal-embed>.canvas-content>.canvas-wrapper{position:relative}.canvas-embed.better-canvas-embed>.embed-title{width:fit-content;cursor:pointer}.canvas-embed.better-canvas-embed>.canvas-content{height:var(--embedded-canvas-min-height);border:var(--embedded-canvas-border-width) solid var(--embedded-canvas-border-color);border-radius:var(--radius-m);overflow:hidden}.canvas-embed.better-canvas-embed>.canvas-content>.canvas-wrapper>.canvas-controls{visibility:hidden}.canvas-embed.better-canvas-embed>.canvas-content:hover>.canvas-wrapper>.canvas-controls{visibility:visible}.canvas-embed.better-canvas-embed .canvas-wrapper.mod-readonly[data-hide-background-grid-when-in-readonly=true] .canvas-background{visibility:visible}.canvas-embed.better-canvas-embed .canvas-node-content.markdown-embed>.markdown-embed-content>.markdown-preview-view>.markdown-preview-sizer{margin-left:unset;margin-right:unset}.canvas-embed.better-canvas-embed .inline-title{display:block}
|
||||
Reference in new issue
Block a user