design fixes

writer · Sep 19, 2024 · ff2db00 · ff2db00
1 parent 8d2b5ee
commit ff2db00
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 12 deletions.
diff --git a/src/ui/src/components/core/content/CoreDataframe.vue b/src/ui/src/components/core/content/CoreDataframe.vue
@@ -88,14 +88,15 @@
 					@action="handleActionRow"
 					@change="handleUpdateCell"
 				/>
-				<button
-					v-if="enableRecordAdd"
-					aria-label="Create a new row at the end"
-					class="CoreDataframe__newRow cell"
-					@click="handleAddRow"
-				>
-					<i class="material-symbols-outlined">add</i>
-				</button>
+				<div v-if="enableRecordAdd" class="CoreDataframe__newRow cell">
+					<button
+						class="CoreDataframe__newRow__btn"
+						aria-label="Create a new row at the end"
+						@click="handleAddRow"
+					>
+						<i class="material-symbols-outlined">add</i>
+					</button>
+				</div>
 			</div>
 			<div
 				v-if="isRowCountMassive"
@@ -650,12 +651,20 @@ onUnmounted(() => {
 .CoreDataframe__newRow {
 	display: flex;
 	align-self: center;
-	justify-content: center;
-
+	justify-content: flex-start;
+	padding-left: 0;
+}
+.CoreDataframe__newRow__btn {
 	cursor: pointer;
 
-	background: transparent;
-	border: none;
+	background-color: var(--separatorColor);
+	border: 1px solid var(--emptinessColor);
+	height: 16px;
+	width: 16px;
+	border-radius: 4px;
+	display: flex;
+	align-items: center;
+	justify-content: center;
 }
 
 .tools {

diff --git a/src/ui/src/components/core/content/CoreDataframe/CoreDataframeCellBoolean.vue b/src/ui/src/components/core/content/CoreDataframe/CoreDataframeCellBoolean.vue
@@ -40,6 +40,9 @@ function onChange(event: InputEvent) {
 	gap: 8px;
 	align-items: center;
 }
+.CoreDataframeCellBoolean input {
+	cursor: pointer;
+}
 .CoreDataframeCellBoolean--disabled input {
 	cursor: not-allowed;
 	pointer-events: none;