diff --git a/AMW_angular/io/src/app/resources/resource-edit-page/resource-edit-page.component.html b/AMW_angular/io/src/app/resources/resource-edit-page/resource-edit-page.component.html index 122a1fd8f..d145dbcb5 100644 --- a/AMW_angular/io/src/app/resources/resource-edit-page/resource-edit-page.component.html +++ b/AMW_angular/io/src/app/resources/resource-edit-page/resource-edit-page.component.html @@ -17,20 +17,22 @@ Loaded resource: {{ this.resource()?.name || this.resourceType()?.name }} +
+ - - - + +
} diff --git a/AMW_angular/io/src/app/shared/tile/tile.component.scss b/AMW_angular/io/src/app/shared/tile/tile.component.scss index 725968b02..0cbb4ade7 100644 --- a/AMW_angular/io/src/app/shared/tile/tile.component.scss +++ b/AMW_angular/io/src/app/shared/tile/tile.component.scss @@ -1,12 +1,20 @@ .tile { border: 1px solid #ddd; padding: 1em; - margin: 0.5em; + margin: 0.5em 0.5em 1.5em; .tile-header { display: flex; flex-direction: row; justify-content: space-between; + align-items: center; + cursor: pointer; + line-height: 18px; + } + + .opened { + border-bottom: 1px solid #ddd; + padding-bottom: 0.5em; } .tile-title { diff --git a/AMW_angular/io/src/app/shared/tile/tile.component.ts b/AMW_angular/io/src/app/shared/tile/tile.component.ts index b91804c62..0209bd57c 100644 --- a/AMW_angular/io/src/app/shared/tile/tile.component.ts +++ b/AMW_angular/io/src/app/shared/tile/tile.component.ts @@ -10,8 +10,14 @@ import { TileListComponent, TileListEntry, TileListEntryOutput } from './tile-li selector: 'app-tile-component', template: `
-
-
{{ title() }}
+
+
+ @if (showBody()) { + } @else { + + } + {{ title() }} +
@if (canAction()) {
@@ -21,7 +27,7 @@ import { TileListComponent, TileListEntry, TileListEntryOutput } from './tile-li
}
- + @if (showBody()) {
@if (!lists()) {
@@ -46,6 +52,7 @@ import { TileListComponent, TileListEntry, TileListEntryOutput } from './tile-li > }
+ }
`, styleUrls: ['./tile.component.scss'], @@ -67,6 +74,7 @@ export class TileComponent { title = input.required(); actionName = input.required(); canAction = input(false); + isVisible = input(false); lists = input.required< { title: string; @@ -78,4 +86,9 @@ export class TileComponent { >(); tileAction = output(); listAction = output(); + + showBody = signal(this.isVisible()); + toggleBody() { + this.showBody.set(!this.showBody()); + } }