aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/DiagramBox.scss
diff options
context:
space:
mode:
authorbobzel <zzzman@gmail.com>2024-05-19 00:05:18 -0400
committerbobzel <zzzman@gmail.com>2024-05-19 00:05:18 -0400
commit38742d5f491ed5232a381da63e126b609cf14aad (patch)
treea723b0c9dfffa717b70df383d21fb3b14567308f /src/client/views/nodes/DiagramBox.scss
parenta3784cd3ab990d8016b1168eb0cbf7e9a2f22301 (diff)
parent0b451af28e5aef6b749da61e8a9fcd0a840789ac (diff)
Merge branch 'restoringEslint' into aisosa-starter
Diffstat (limited to 'src/client/views/nodes/DiagramBox.scss')
-rw-r--r--src/client/views/nodes/DiagramBox.scss88
1 files changed, 88 insertions, 0 deletions
diff --git a/src/client/views/nodes/DiagramBox.scss b/src/client/views/nodes/DiagramBox.scss
new file mode 100644
index 000000000..d2749f1ad
--- /dev/null
+++ b/src/client/views/nodes/DiagramBox.scss
@@ -0,0 +1,88 @@
+.DIYNodeBox {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+
+ .DIYNodeBox-wrapper {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ .DIYNodeBox {
+ /* existing code */
+
+ .DIYNodeBox-iframe {
+ height: 100%;
+ width: 100%;
+ border: none;
+
+ }
+ }
+
+ .search-bar {
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ padding: 10px;
+
+ input[type="text"] {
+ flex: 1;
+ margin-right: 10px;
+ }
+
+ button {
+ padding: 5px 10px;
+ }
+ }
+
+ .content {
+ flex: 1;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width:100%;
+ height:100%;
+ .diagramBox{
+ flex: 1;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width:100%;
+ height:100%;
+ svg{
+ flex: 1;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ width:100%;
+ height:100%;
+ }
+ }
+ }
+
+ .loading-circle {
+ position: relative;
+ width: 50px;
+ height: 50px;
+ border-radius: 50%;
+ border: 3px solid #ccc;
+ border-top-color: #333;
+ animation: spin 1s infinite linear;
+ }
+
+ @keyframes spin {
+ 0% {
+ transform: rotate(0deg);
+ }
+ 100% {
+ transform: rotate(360deg);
+ }
+ }
+ }
+} \ No newline at end of file