Jamie home page style updates (#5916)

DARPA-ASKEM · Dec 20, 2024 · ce01d4d · ce01d4d
1 parent a542039
commit ce01d4d
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 17 deletions.
diff --git a/packages/client/hmi-client/src/components/home/tera-project-card.vue b/packages/client/hmi-client/src/components/home/tera-project-card.vue
@@ -50,8 +50,7 @@
 				<ProgressBar v-if="isCopying" mode="indeterminate" />
 				<section class="details">
 					<div>
-						<div class="author">{{ project?.userName ?? '——' }}</div>
-						<div>{{ formatDdMmmYyyy(project.updatedOn) }}</div>
+						<div>{{ project?.userName ?? '——' }}</div>
 					</div>
 					<div class="description">
 						{{ project.description }}
@@ -230,18 +229,22 @@ section {
 
 .details:not(.skeleton) {
 	overflow: hidden;
-	opacity: 0;
-	height: 0;
-	transition:
-		opacity 0.5s ease,
-		height 0.3s ease;
-	color: var(--text-color-secondary);
-	font-size: var(--font-caption);
+	& .description {
+		opacity: 0;
+		height: 0;
+		transition:
+			opacity 0.5s ease,
+			height 0.3s ease;
+		color: var(--text-color-secondary);
+		font-size: var(--font-caption);
+	}
 }
 
 .p-card:hover .details:not(.skeleton) {
-	opacity: 100;
-	height: auto;
+	& .description {
+		opacity: 100;
+		height: auto;
+	}
 }
 
 .author {

diff --git a/packages/client/hmi-client/src/components/home/tera-project-table.vue b/packages/client/hmi-client/src/components/home/tera-project-table.vue
@@ -37,8 +37,6 @@
 							<i class="pi pi-user" />
 							{{ data.metadata?.['contributor-count'] ?? 1 }}
 						</span>
-					</div>
-					<div class="stats mt-3">
 						<span
 							v-for="metadataField in Object.keys(metadataCountToAssetNameMap)"
 							:key="metadataField"
@@ -63,7 +61,8 @@
 			</template>
 		</Column>
 		<template #expansion="{ data }">
-			<div v-for="asset in data.assets" :key="asset.assetId" class="flex align-items-center gap-4">
+			<div v-for="asset in data.assets" :key="asset.assetId" class="flex align-items-center gap-1">
+				<span class="ml-4 pi pi-minus secondary-text"></span>
 				<tera-asset-button
 					v-if="asset.assetType != AssetType.Project"
 					:asset="asset"
@@ -170,7 +169,7 @@ watch(
 
 :deep(.p-datatable-tbody > tr > td),
 :deep(.p-datatable-thead > tr > th) {
-	vertical-align: top;
+	vertical-align: center;
 	padding: var(--gap-3) var(--gap-5);
 }
 
@@ -199,7 +198,9 @@ watch(
 
 /* Adjust padding for non-empty expansion rows */
 :deep(.p-datatable-tbody > tr.p-datatable-row-expansion > :not(td:empty)) {
-	padding: var(--gap-2) var(--gap-1);
+	padding: var(--gap-0) var(--gap-1);
+	padding-bottom: var(--gap-4);
+	background: var(--surface-50);
 }
 
 /* Remove padding for empty expansion rows */
@@ -253,5 +254,11 @@ watch(
 :deep(.p-paginator) {
 	border-radius: 0;
 	padding: var(--gap-2) var(--gap-4);
+	background: var(--surface-glass);
+	backdrop-filter: blur(4px);
+}
+
+.secondary-text {
+	color: var(--text-color-secondary);
 }
 </style>
diff --git a/packages/client/hmi-client/src/components/widgets/tera-input-text.vue b/packages/client/hmi-client/src/components/widgets/tera-input-text.vue
@@ -17,6 +17,7 @@
 				@blur="onBlur"
 				@input="updateValue"
 				@keydown.space.stop
+				autocomplete="off"
 			/>
 		</main>
 		<aside v-if="getErrorMessage"><i class="pi pi-exclamation-circle" /> {{ getErrorMessage }}</aside>

diff --git a/packages/client/hmi-client/src/page/tera-home.vue b/packages/client/hmi-client/src/page/tera-home.vue
@@ -40,7 +40,7 @@
 									class="search-input"
 									@keydown.enter="searchedProjects"
 								/>
-								<Button label="Search" @click="searchedProjects" />
+								<Button label="Search" :disabled="searchProjectsQuery.length === 0" @click="searchedProjects" />
 							</span>
 							<Dropdown
 								v-if="view === ProjectsView.Cards"