diff --git a/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.html b/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.html index 6e6cf7b..ac097c4 100644 --- a/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.html +++ b/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.html @@ -19,11 +19,10 @@ {{ item.name }} @if (item.description) { - | - {{ item.description }} + {{ item.description }} } - + diff --git a/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.scss b/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.scss index 78175eb..317db60 100644 --- a/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.scss +++ b/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.scss @@ -1,14 +1,32 @@ :host { .authority-item { - display: flex; + display: inline-grid; + gap: 1rem; align-items: center; - .description, .spacer { + .span-2 { + grid-column: span 2; + } + + .description { color: var(--neutral-40); + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; } .actions { margin-left: auto; + display: flex; + flex-direction: row; + align-items: center; + } + + > .description:before { + color: var(--neutral-40); + content: '>'; + margin-right: 1rem; + } } } diff --git a/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.ts b/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.ts index 1b3933d..bb4bba4 100644 --- a/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.ts +++ b/src/angular/frontend/src/app/components/app/app-detail/app-detail.component.ts @@ -1,25 +1,24 @@ import {Component, inject, signal} from '@angular/core'; import {TabGroup, TabGroupComponent} from '../../tab-group/tab-group.component'; -import {SubjectListComponent} from '../../subject/subject-list/subject-list.component'; import {ListComponent} from '../../list/list.component'; import {GroupDto} from '../../../clients/gandalf/mithrandir/dtos/group-dto'; import {RoleDto} from '../../../clients/gandalf/mithrandir/dtos/role-dto'; import {AuthorityDto} from '../../../clients/gandalf/mithrandir/dtos/authority-dto'; import {ActivatedRoute, Router, RouterLink} from '@angular/router'; -import {TenantService} from '../../../clients/gandalf/mithrandir/tenant/tenant.service'; import {PanelComponent} from '../../panel/panel.component'; import {AppService} from '../../../clients/gandalf/mithrandir/app/app.service'; import {ActiveTabDirective} from '../../tab-group/active-tab.directive'; +import {NgClass} from '@angular/common'; @Component({ selector: 'app-app-detail', imports: [ TabGroupComponent, - SubjectListComponent, ListComponent, PanelComponent, RouterLink, - ActiveTabDirective + ActiveTabDirective, + NgClass ], templateUrl: './app-detail.component.html', styleUrl: './app-detail.component.scss', diff --git a/src/angular/frontend/src/app/components/list/list.component.scss b/src/angular/frontend/src/app/components/list/list.component.scss index 1556b2c..a515714 100644 --- a/src/angular/frontend/src/app/components/list/list.component.scss +++ b/src/angular/frontend/src/app/components/list/list.component.scss @@ -1,5 +1,12 @@ :host { - display: flex; + display: grid; flex-direction: column; - gap: 1rem; + gap: 0.5rem; + + grid-template-columns: min-content auto min-content; + + & > ::ng-deep * { + grid-column: span 3; + grid-template-columns: subgrid; + } } diff --git a/src/dotnet/.idea/.idea.Suspectus.Gandalf/.idea/watcherTasks.xml b/src/dotnet/.idea/.idea.Suspectus.Gandalf/.idea/watcherTasks.xml new file mode 100644 index 0000000..fb0d65a --- /dev/null +++ b/src/dotnet/.idea/.idea.Suspectus.Gandalf/.idea/watcherTasks.xml @@ -0,0 +1,4 @@ + + + + \ No newline at end of file