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

OZG-6302 OZG-6409 Add styling

parent 665c4b75
Branches
Tags
No related merge requests found
ICON_PLATZHALTER <div class="flex items-center gap-3">
<ods-search-icon />
<ods-button <ods-button
variant="outline" variant="outline"
text="Zuständige Stelle auswählen" text="Zuständige Stelle auswählen"
dataTestId="zustaendige-stelle-search-button" dataTestId="zustaendige-stelle-search-button"
> >
<ods-save-icon icon class="fill-text"></ods-save-icon> <ods-search-icon icon />
</ods-button> </ods-button>
</div>
<div class="my-6">
<alfa-collaboration-request-form></alfa-collaboration-request-form> <alfa-collaboration-request-form></alfa-collaboration-request-form>
</div>
<div class="flex items-center gap-6">
<ods-button text="Zuarbeit anfragen" data-test-id="zuarbeit-anfragen-button"></ods-button> <ods-button text="Zuarbeit anfragen" data-test-id="zuarbeit-anfragen-button"></ods-button>
<ods-button <ods-button
variant="outline" variant="outline"
...@@ -16,5 +21,6 @@ ICON_PLATZHALTER ...@@ -16,5 +21,6 @@ ICON_PLATZHALTER
data-test-id="collaboration-request-abbrechen-button" data-test-id="collaboration-request-abbrechen-button"
(clickEmitter)="hideFormular.emit()" (clickEmitter)="hideFormular.emit()"
> >
<ods-close-icon icon class="fill-text"></ods-close-icon> <ods-close-icon icon class="fill-primary"></ods-close-icon>
</ods-button> </ods-button>
</div>
import { dispatchEventFromFixture } from '@alfa-client/test-utils'; import { dispatchEventFromFixture } from '@alfa-client/test-utils';
import { ComponentFixture, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ButtonComponent, CloseIconComponent, SaveIconComponent } from '@ods/system'; import { ButtonComponent, CloseIconComponent } from '@ods/system';
import { SearchIconComponent } from 'libs/design-system/src/lib/icons/search-icon/search-icon.component';
import { getDataTestIdOf } from 'libs/tech-shared/test/data-test'; import { getDataTestIdOf } from 'libs/tech-shared/test/data-test';
import { MockComponent } from 'ng-mocks'; import { MockComponent } from 'ng-mocks';
import { CollaborationRequestContainerComponent } from './collaboration-request-container.component'; import { CollaborationRequestContainerComponent } from './collaboration-request-container.component';
...@@ -17,7 +18,7 @@ describe('CollaborationRequestContainerComponent', () => { ...@@ -17,7 +18,7 @@ describe('CollaborationRequestContainerComponent', () => {
imports: [ButtonComponent], imports: [ButtonComponent],
declarations: [ declarations: [
CollaborationRequestContainerComponent, CollaborationRequestContainerComponent,
MockComponent(SaveIconComponent), MockComponent(SearchIconComponent),
MockComponent(CloseIconComponent), MockComponent(CloseIconComponent),
MockComponent(CollaborationRequestFormComponent), MockComponent(CollaborationRequestFormComponent),
], ],
......
<form [formGroup]="formService.form"> <form [formGroup]="formService.form" class="flex flex-col gap-2">
<ods-text-editor <ods-text-editor
label="Titel" label="Titel"
[formControlName]="formServiceClass.FIELD_TITLE" [formControlName]="formServiceClass.FIELD_TITLE"
......
...@@ -9,6 +9,7 @@ import { ...@@ -9,6 +9,7 @@ import {
CollaborationIconComponent, CollaborationIconComponent,
SaveIconComponent, SaveIconComponent,
} from '@ods/system'; } from '@ods/system';
import { SearchIconComponent } from 'libs/design-system/src/lib/icons/search-icon/search-icon.component';
import { CollaborationInVorgangContainerComponent } from './collaboration-in-vorgang-container/collaboration-in-vorgang-container.component'; import { CollaborationInVorgangContainerComponent } from './collaboration-in-vorgang-container/collaboration-in-vorgang-container.component';
import { CollaborationRequestContainerComponent } from './collaboration-in-vorgang-container/collaboration-request-container/collaboration-request-container.component'; import { CollaborationRequestContainerComponent } from './collaboration-in-vorgang-container/collaboration-request-container/collaboration-request-container.component';
import { CollaborationRequestFormComponent } from './collaboration-in-vorgang-container/collaboration-request-container/collaboration-request-form/collaboration-request-form.component'; import { CollaborationRequestFormComponent } from './collaboration-in-vorgang-container/collaboration-request-container/collaboration-request-form/collaboration-request-form.component';
...@@ -19,6 +20,7 @@ import { CollaborationRequestFormComponent } from './collaboration-in-vorgang-co ...@@ -19,6 +20,7 @@ import { CollaborationRequestFormComponent } from './collaboration-in-vorgang-co
ButtonComponent, ButtonComponent,
SaveIconComponent, SaveIconComponent,
CloseIconComponent, CloseIconComponent,
SearchIconComponent,
CollaborationSharedModule, CollaborationSharedModule,
CollaborationIconComponent, CollaborationIconComponent,
TextEditorComponent, TextEditorComponent,
......
...@@ -6,7 +6,10 @@ import { cva, VariantProps } from 'class-variance-authority'; ...@@ -6,7 +6,10 @@ import { cva, VariantProps } from 'class-variance-authority';
import { ErrorMessageComponent } from '../error-message/error-message.component'; import { ErrorMessageComponent } from '../error-message/error-message.component';
const textInputVariants = cva( const textInputVariants = cva(
'w-full h-10 rounded-lg border bg-background-50 px-3 py-2 text-base leading-5 text-text focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2', [
'w-full box-border rounded-lg border bg-background-50 px-3 py-2 text-base text-text leading-5',
'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2',
],
{ {
variants: { variants: {
variant: { variant: {
......
...@@ -5,7 +5,10 @@ import { FormControl, ReactiveFormsModule } from '@angular/forms'; ...@@ -5,7 +5,10 @@ import { FormControl, ReactiveFormsModule } from '@angular/forms';
import { VariantProps, cva } from 'class-variance-authority'; import { VariantProps, cva } from 'class-variance-authority';
const textareaVariants = cva( const textareaVariants = cva(
'block w-full rounded-lg border bg-background-50 px-3 py-2 text-base text-text leading-5 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2', [
'w-full box-border rounded-lg border bg-background-50 px-3 py-2 text-base text-text leading-5',
'focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2',
],
{ {
variants: { variants: {
variant: { variant: {
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment