context menu rendering wip

2025-08-03 12:12:13 -04:00
parent 7b2ed32043
commit 364b23e62a
4 changed files with 109 additions and 16 deletions
--- a/AobaClient/assets/style/main.scss
+++ b/AobaClient/assets/style/main.scss
@@ -157,3 +157,35 @@ form {
 	padding: 5px;
 	user-select: all;
 }
+
+.contextMenu {
+	backdrop-filter: blur(10px) brightness(0.5) grayscale(1);
+	position: absolute;
+
+	.itemList {
+		display: flex;
+		flex-direction: column;
+		max-width: 300px;
+	}
+
+	.contextItem {
+		border-left: 4px solid $featureColor;
+		$size: 30px;
+		display: grid;
+		grid-template-columns: $size 1fr auto;
+		height: $size;
+		transition: border 0.1s ease-out;
+
+		.label {
+			display: flex;
+			align-items: center;
+			padding: 5px 10px;
+		}
+
+		&:hover {
+			background-color: $accentColor;
+			color: $invertTextColor;
+			border-left: 10px solid $focusColor;
+		}
+	}
+}