buttons on cut links functional except for when dragged from link menu

1 files changed, 76 insertions, 0 deletions

diff --git a/src/client/views/nodes/LinkMenuItem.scss b/src/client/views/nodes/LinkMenuItem.scss
new file mode 100644
index 000000000..77462f611
--- /dev/null
+++ b/src/client/views/nodes/LinkMenuItem.scss
@@ -0,0 +1,76 @@
+@import "../globalCssVariables";
+.linkMenu-item {
+    border-top: 0.5px solid $main-accent; 
+    padding: 6px;
+    position: relative;
+    display: flex;
+    font-size: 12px;
+
+    .linkMenu-item-content {
+        width: 100%;
+    }
+    
+    .link-metadata {
+        margin-top: 6px;
+        padding: 3px;
+        border-top: 0.5px solid $light-color-secondary;
+        .link-metadata-row {
+            margin-left: 6px;
+        }
+    }
+
+    &:last-child {
+        border-bottom: 0.5px solid $main-accent;
+    }
+    &:hover {
+        .linkMenu-item-buttons {
+            display: flex;
+        }
+        .linkMenu-item-content {
+            &.expand-two {
+                width: calc(100% - 46px);
+            }
+            &.expand-three {
+                width: calc(100% - 78px);
+            }
+        }
+    }
+}
+
+.linkMenu-item-buttons {
+    display: none;
+    position: absolute;
+    top: 50%;
+    right: 0;
+    transform: translateY(-50%);
+
+    .button {
+        width: 20px;
+        height: 20px;
+        margin: 0;
+        margin-right: 6px;
+        border-radius: 50%;
+        cursor: pointer;
+        pointer-events: auto;
+        background-color: $dark-color;
+        color: $light-color;
+        font-size: 65%;
+        transition: transform 0.2s;
+        text-align: center;
+        position: relative;
+
+        .fa-icon {
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            transform: translate(-50%, -50%);
+        }
+
+        &:last-child {
+            margin-right: 0;
+        }
+        &:hover {
+            background: $main-accent;
+        }
+    }
+}
\ No newline at end of file