Add graph type error diagnostics to the UI (#1535)

* Fontend input types

* Fix index of errors / types

* Bug fixes, styling improvements, and code review

* Improvements to the error box

---------

Co-authored-by: Keavon Chambers <keavon@keavon.com>
This commit is contained in:
0HyperCube
2023-12-29 08:38:45 +00:00
committed by GitHub
co-authored by Keavon Chambers
parent 96b5d7b520
commit 947a131a4b
20 changed files with 566 additions and 170 deletions
@@ -9,7 +9,7 @@
</script>
<LayoutRow class="parameter-expose-button">
<button class:exposed style:--data-type-color={`var(--color-data-${dataType})`} on:click={action} title={tooltip} tabindex="-1">
<button class:exposed style:--data-type-color={`var(--color-data-${dataType})`} style:--data-type-color-dim={`var(--color-data-${dataType}-dim)`} on:click={action} title={tooltip} tabindex="-1">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10 10">
<path class="interior" d="M0,7.882c0,1.832,1.325,2.63,2.945,1.772L8.785,6.56c1.62-.858,1.62-2.262,0-3.12L2.945.345C1.325-.512,0,.285,0,2.118Z" />
<path
@@ -53,25 +53,33 @@
}
&:not(.exposed) {
.outline {
fill: var(--data-type-color);
&:not(:hover) {
.outline {
fill: var(--data-type-color-dim);
}
}
&:hover {
.interior {
fill: var(--color-6-lowergray);
.outline {
fill: var(--data-type-color);
}
}
}
&.exposed {
.interior {
fill: var(--data-type-color);
&:not(:hover) {
.interior {
fill: var(--data-type-color);
}
}
&:hover {
.outline {
fill: var(--color-f-white);
fill: var(--data-type-color);
}
.interior {
fill: var(--data-type-color-dim);
}
}
}