Skip to content
Snippets Groups Projects
Commit 7027df53 authored by OZGCloud's avatar OZGCloud
Browse files

Merge remote-tracking branch 'origin/master'

parents 30129d45 90a02d29
Branches 5-senden-von-nachrichten
Tags
No related merge requests found
Showing
with 78 additions and 100 deletions
......@@ -27,7 +27,7 @@
<ozgcloud-spinner [stateResource]="apiRoot">
<alfa-header-container [apiRootStateResource]="apiRoot"></alfa-header-container>
<div class="relative ml-4 mt-16 flex flex-grow items-start justify-between">
<div class="relative ml-4 flex flex-grow items-start justify-between sm:mt-16">
<div class="mat-app-background relative grow"><router-outlet></router-outlet></div>
<section class="mat-app-background right-nav">
......
......@@ -30,7 +30,7 @@ import { CheckIconComponent } from '../../icons/check-icon/check-icon.component'
standalone: true,
imports: [CommonModule, CheckIconComponent],
template: `<button
class="flex cursor-pointer items-center gap-1 px-3 py-1.5 outline-none hover:bg-neutral-300 focus-visible:bg-neutral-300 dark:hover:bg-neutral-600 dark:focus-visible:bg-neutral-600"
class="flex h-full cursor-pointer items-center gap-1 px-3 py-1.5 outline-none hover:bg-neutral-300 focus-visible:bg-neutral-300 dark:hover:bg-neutral-600 dark:focus-visible:bg-neutral-600"
[ngClass]="{
'bg-neutral-200 font-bold hover:bg-neutral-200 focus-visible:bg-neutral-200 dark:bg-neutral-900 dark:hover:bg-neutral-800 dark:focus-visible:bg-neutral-800':
isChecked,
......
......@@ -24,13 +24,13 @@
-->
<header data-test-id="header">
<div class="left">
<div class="flex self-center sm:ml-3 lg:min-w-60">
<alfa-header-logo></alfa-header-logo>
</div>
<div class="middle">
<div class="grow sm:order-2 sm:mr-4 lg:w-full">
<alfa-vorgang-search-container></alfa-vorgang-search-container>
</div>
<div class="flex items-center text-ozggray-800 dark:text-ozggray-300">
<div class="flex flex-1 items-center justify-end self-end text-ozggray-800 dark:text-ozggray-300 sm:order-3 sm:self-center">
<common-accessibility-button
*ngIf="apiRootStateResource?.resource.barrierefreiheitUrl"
[url]="apiRootStateResource.resource.barrierefreiheitUrl"
......
......@@ -26,30 +26,13 @@
@import 'variables';
header {
height: $header-height;
@apply flex flex-row flex-wrap content-between items-center gap-2 pb-2 pl-4 pr-4 pt-2 sm:fixed sm:flex-nowrap sm:content-between sm:gap-0 sm:pr-8;
min-height: $header-height;
box-shadow: $shadow-bottom;
padding: 0.5rem 2rem 0.5rem 1rem;
left: 0;
top: 0;
right: 0;
width: 100%;
z-index: 3;
display: flex;
align-items: center;
justify-content: space-between;
position: fixed;
}
.middle {
flex-grow: 1;
margin-right: 1rem;
}
.left {
display: flex;
align-items: inherit;
margin-left: 0.75rem;
@include media('>desktop') {
min-width: 240px;
}
}
......@@ -27,22 +27,20 @@
[attr.aria-label]="ariaLabel"
routerLink="/vorgang/{{ vorgang | toResourceUri: vorgangLinkRel.VORGANG_WITH_EINGANG }}"
[attr.data-test-id]="'vorgang-list-item-' + vorgang.name | convertForDataTest"
class="flex flex-row gap-4 border-b-2 border-gray-200 p-4 hover:shadow-[inset_1px_-1px_0_0_rgba(0,0,0,0.16)] dark:border-b dark:border-gray-300 dark:hover:shadow-[inset_1px_-1px_0_0_rgba(255,255,255,0.60)]"
class="flex flex-col gap-2 border-b-2 border-gray-200 p-4 hover:shadow-[inset_1px_-1px_0_0_rgba(0,0,0,0.16)] dark:border-b dark:border-gray-300 dark:hover:shadow-[inset_1px_-1px_0_0_rgba(255,255,255,0.60)] lg:flex-row lg:gap-4"
>
<div class="flex w-32 flex-none flex-col">
<div class="flex grow flex-row gap-4">
<div class="flex flex-1 flex-col gap-4 lg:flex-row">
<div class="flex flex-none flex-row lg:w-32 lg:flex-col">
<div class="flex items-center gap-3">
<alfa-vorgang-status-dot
[status]="vorgang.status"
diameter="12"
data-test-class="status-dot"
></alfa-vorgang-status-dot>
<alfa-vorgang-status-dot [status]="vorgang.status" diameter="12" data-test-class="status-dot"></alfa-vorgang-status-dot>
<alfa-vorgang-status-text
[status]="vorgang.status"
data-test-class="status-text"
class="status-text"
></alfa-vorgang-status-text>
</div>
<div class="ml-6 mt-3 flex text-sm">
<div class="ml-6 flex text-sm lg:mt-3">
<alfa-vorgang-bescheid-status
*ngIf="vorgang.antragBewilligt !== null"
[vorgang]="vorgang"
......@@ -50,7 +48,7 @@
></alfa-vorgang-bescheid-status>
</div>
</div>
<div class="flex flex-1 flex-col gap-1">
<div class="ml-6 flex flex-1 flex-col gap-1 lg:ml-0">
<div data-test-id="name" class="break-all text-base font-medium">
{{ vorgang.name }}
</div>
......@@ -66,6 +64,7 @@
</div>
</div>
</div>
<div class="ml-6 flex w-48 gap-4 lg:ml-0">
<div class="flex w-36 flex-none flex-col gap-2">
<div>
<alfa-vorgang-created-at class="eingang" [vorgang]="vorgang"></alfa-vorgang-created-at>
......@@ -88,7 +87,9 @@
</ozgcloud-postfach-icon>
</div>
</div>
<div class="w-10 flex-none">
</div>
</div>
<div class="flex-none">
<alfa-user-profile-in-vorgang-list-item-container
*ngIf="vorgang | hasLink: vorgangLinkRel.ASSIGN"
data-test-id="vorgang-user-icon"
......@@ -96,4 +97,5 @@
class="user-icon"
></alfa-user-profile-in-vorgang-list-item-container>
</div>
</div>
</a>
......@@ -24,13 +24,10 @@
@import 'variables';
:host {
position: sticky;
@apply flex items-center justify-end sm:sticky;
top: $header-height;
height: 3rem;
min-height: 3rem;
width: 100%;
z-index: 2;
display: flex;
justify-content: flex-end;
align-items: center;
padding: 0.25rem 0 0.25rem 1rem;
}
......@@ -26,18 +26,15 @@
<h1 class="sr-only">Vorgangsliste</h1>
<alfa-vorgang-filter-menu-container class="mat-app-background"></alfa-vorgang-filter-menu-container>
<div class="flex flex-row">
<div class="flex flex-col sm:flex-row">
<alfa-vorgang-views-menu-container
*ngIf="apiRootStateResource.resource"
[apiRootResource]="apiRootStateResource.resource"
class="w-[15.5rem] flex-none"
class="w-full sm:w-[15.5rem] sm:flex-none"
></alfa-vorgang-views-menu-container>
<main
*ngIf="
apiRootStateResource?.resource | hasLink: apiRootLinkRel.ALLE_VORGAENGE;
else showNoRoleMessage
"
*ngIf="apiRootStateResource?.resource | hasLink: apiRootLinkRel.ALLE_VORGAENGE; else showNoRoleMessage"
data-test-id="vorgaenge-list"
class="flex flex-1 flex-col overflow-hidden border border-gray-200 dark:border-black"
>
......
......@@ -24,10 +24,9 @@
@import 'variables';
:host {
@apply self-start md:sticky;
background-color: $background;
padding: 0 1rem 0 0;
position: sticky;
align-self: flex-start;
top: $header-height + $navigation-height;
}
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment