diff --git a/CHANGELOG.md b/CHANGELOG.md index 737affe4a..3d468bbf6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed +- Improved the style of the assistant - Migrated the `HtmlTemplateMiddleware` to use `@Injectable()` - Renamed `User` to `user` in the database schema - Improved the language localization for French (`fr`) diff --git a/libs/ui/src/lib/assistant/assistant-list-item/assistant-list-item.html b/libs/ui/src/lib/assistant/assistant-list-item/assistant-list-item.html index 09465b669..9c55dac54 100644 --- a/libs/ui/src/lib/assistant/assistant-list-item/assistant-list-item.html +++ b/libs/ui/src/lib/assistant/assistant-list-item/assistant-list-item.html @@ -1,12 +1,10 @@ {{ item?.name }} + >{{ item?.name }} @if (item && isAsset(item)) {
-
Quick Links
- +
+ Quick Links +
+ @for ( + searchResultItem of searchResults?.quickLinks; + track searchResultItem + ) { + + } @if (isLoading.quickLinks) { Holdings
- +
Holdings
+ @for ( + searchResultItem of searchResults?.holdings; + track searchResultItem + ) { + + } @if (isLoading.holdings) { } @else { -
No entries...
+
No entries...
}
-
-
Asset Profiles
- +
+
+ Asset Profiles +
+ @for ( + searchResultItem of searchResults?.assetProfiles; + track searchResultItem + ) { + + } @if (isLoading.assetProfiles) { } @else { -
No entries...
+
No entries...
}
diff --git a/libs/ui/src/lib/assistant/assistant.scss b/libs/ui/src/lib/assistant/assistant.scss index 2de06824a..3630978c1 100644 --- a/libs/ui/src/lib/assistant/assistant.scss +++ b/libs/ui/src/lib/assistant/assistant.scss @@ -7,6 +7,24 @@ .result-container { max-height: 15rem; + + .title { + align-items: center; + display: flex; + font-size: 0.75rem; + display: flex; + margin: 0; + position: relative; + white-space: nowrap; + + &::after { + content: ''; + flex-grow: 1; + height: 1px; + background: rgba(var(--dark-dividers)); + margin-left: 0.25rem; + } + } } .search-container { @@ -31,6 +49,14 @@ border-color: rgba(var(--light-dividers)); } + .result-container { + .title { + &::after { + background: rgba(var(--light-dividers)); + } + } + } + .search-container { border-color: rgba(var(--light-dividers));