MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

more css button styling changse

This commit is contained in:
mchouliara 2024-09-03 13:39:53 +03:00
parent 69588f6c68
commit 71a7d4506c
10 changed files with 17 additions and 130 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
frontend/src/app/ui/admin/reference-type/editor/reference-type-editor.component.html
View File

@ -7,16 +7,16 @@
</div> </div>
<div class="col-auto"> <div class="col-auto">
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'REFERENCE-TYPE-EDITOR.ACTIONS.CANCEL' | translate}}</button> <button mat-button class="rounded-btn neutral" (click)="cancel()" type="button">{{'REFERENCE-TYPE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
</div> </div>
<div class="col-auto" *ngIf="canDelete"> <div class="col-auto" *ngIf="canDelete">
<button mat-button (click)="delete()" class="action-btn" type="button"> <button mat-button (click)="delete()" class="rounded-btn delete-inverted" type="button">
<mat-icon>delete</mat-icon> <mat-icon>delete</mat-icon>
{{'REFERENCE-TYPE-EDITOR.ACTIONS.DELETE' | translate}} {{'REFERENCE-TYPE-EDITOR.ACTIONS.DELETE' | translate}}
</button> </button>
</div> </div>
<div class="col-auto" *ngIf="canSave"> <div class="col-auto" *ngIf="canSave">
<button mat-button class="action-btn" (click)="formSubmit()"> <button mat-button class="rounded-btn primary" (click)="formSubmit()">
<mat-icon>save</mat-icon> <mat-icon>save</mat-icon>
{{'REFERENCE-TYPE-EDITOR.ACTIONS.SAVE' | translate}} {{'REFERENCE-TYPE-EDITOR.ACTIONS.SAVE' | translate}}
</button> </button>
@ -60,7 +60,7 @@
<h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELDS' | translate}}</h3> <h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.FIELDS' | translate}}</h3>
</div> </div>
<div class="col-auto"> <div class="col-auto">
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button> <button mat-button class="rounded-btn secondary" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
</div> </div>
</div> </div>
</div> </div>
@ -124,7 +124,7 @@
</div> </div>
</div> </div>
</div> </div>
<button mat-button class="action-btn" *ngIf="formGroup.get('definition').get('fields').value != ''" type="button" (click)="submitFields()" [disabled]="!formGroup.get('definition').get('fields').valid">{{'REFERENCE-TYPE-EDITOR.ACTIONS.SUBMIT-FIELDS' | translate}}</button> <button mat-button class="rounded-btn secondary" *ngIf="formGroup.get('definition').get('fields').value != ''" type="button" (click)="submitFields()" [disabled]="!formGroup.get('definition').get('fields').valid">{{'REFERENCE-TYPE-EDITOR.ACTIONS.SUBMIT-FIELDS' | translate}}</button>
</div> </div>
<div class="col-12 mt-3 mb-3"> <div class="col-12 mt-3 mb-3">
<div class="row d-flex align-items-center"> <div class="row d-flex align-items-center">
@ -132,7 +132,7 @@
<h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCES' | translate}}</h3> <h3 class="m-0">{{'REFERENCE-TYPE-EDITOR.FIELDS.SOURCES' | translate}}</h3>
</div> </div>
<div class="col-auto"> <div class="col-auto">
<button mat-button class="action-btn" type="button" (click)="addSource()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-SOURCE' | translate}}</button> <button mat-button class="rounded-btn secondary" type="button" (click)="addSource()" [disabled]="formGroup.disabled">{{'REFERENCE-TYPE-EDITOR.ACTIONS.ADD-SOURCE' | translate}}</button>
</div> </div>
</div> </div>
</div> </div>

33
frontend/src/app/ui/admin/reference-type/editor/reference-type-editor.component.scss
View File

@ -19,39 +19,6 @@
background-color: #b0b0b0; background-color: #b0b0b0;
} }
.finalize-btn {
border-radius: 30px;
border: 1px solid var(--primary-color);
background: transparent;
padding-left: 2em;
padding-right: 2em;
box-shadow: 0px 3px 6px #1E202029;
color: var(--primary-color);
&:disabled{
background-color: #CBCBCB;
color: #FFF;
border: 0px;
}
}
.action-btn {
border-radius: 30px;
background-color: var(--secondary-color);
border: 1px solid transparent;
padding-left: 2em;
padding-right: 2em;
box-shadow: 0px 3px 6px #1E202029;
transition-property: background-color, color;
transition-duration: 200ms;
transition-delay: 50ms;
transition-timing-function: ease-in-out;
&:disabled{
background-color: #CBCBCB;
color: #FFF;
border: 0px;
}
}
.dlt-section-btn { .dlt-section-btn {
margin: 0; margin: 0;

8
frontend/src/app/ui/admin/reference/editor/reference-editor.component.html
View File

@ -6,16 +6,16 @@
<app-navigation-breadcrumb /> <app-navigation-breadcrumb />
</div> </div>
<div class="col-auto"> <div class="col-auto">
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'REFERENCE-EDITOR.ACTIONS.CANCEL' | translate}}</button> <button mat-button class="rounded-btn neutral" (click)="cancel()" type="button">{{'REFERENCE-EDITOR.ACTIONS.CANCEL' | translate}}</button>
</div> </div>
<div class="col-auto" *ngIf="canDelete"> <div class="col-auto" *ngIf="canDelete">
<button mat-button class="action-btn" type="button" (click)="delete()"> <button mat-button class="rounded-btn delete-inverted" type="button" (click)="delete()">
<mat-icon>delete</mat-icon> <mat-icon>delete</mat-icon>
{{'REFERENCE-EDITOR.ACTIONS.DELETE' | translate}} {{'REFERENCE-EDITOR.ACTIONS.DELETE' | translate}}
</button> </button>
</div> </div>
<div class="col-auto" *ngIf="canSave"> <div class="col-auto" *ngIf="canSave">
<button mat-button class="action-btn" (click)="formSubmit()"> <button mat-button class="rounded-btn primary" (click)="formSubmit()">
<mat-icon>save</mat-icon> <mat-icon>save</mat-icon>
{{'REFERENCE-EDITOR.ACTIONS.SAVE' | translate}} {{'REFERENCE-EDITOR.ACTIONS.SAVE' | translate}}
</button> </button>
@ -92,7 +92,7 @@
<div class="col-12"> <div class="col-12">
<h3 class="mb-4"> <h3 class="mb-4">
{{'REFERENCE-EDITOR.FIELDS.FIELDS' | translate}} {{'REFERENCE-EDITOR.FIELDS.FIELDS' | translate}}
<button mat-button class="action-btn" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button> <button mat-button class="rounded-btn secondary" type="button" (click)="addField()" [disabled]="formGroup.disabled">{{'REFERENCE-EDITOR.ACTIONS.ADD-FIELD' | translate}}</button>
</h3> </h3>
<div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3"> <div *ngFor="let field of formGroup.get('definition').get('fields').controls; let fieldIndex=index;" class="row mb-3">
<div class="col-12"> <div class="col-12">

19
frontend/src/app/ui/admin/reference/editor/reference-editor.component.scss
View File

@ -18,22 +18,3 @@
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background { ::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0; background-color: #b0b0b0;
} }
.action-btn {
border-radius: 30px;
background-color: var(--secondary-color);
border: 1px solid transparent;
padding-left: 2em;
padding-right: 2em;
box-shadow: 0px 3px 6px #1E202029;
transition-property: background-color, color;
transition-duration: 200ms;
transition-delay: 50ms;
transition-timing-function: ease-in-out;
&:disabled{
background-color: #CBCBCB;
color: #FFF;
border: 0px;
}
}

6
frontend/src/app/ui/admin/tenant/editor/tenant-editor.component.html
View File

@ -6,16 +6,16 @@
<app-navigation-breadcrumb /> <app-navigation-breadcrumb />
</div> </div>
<div class="col-auto"> <div class="col-auto">
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'TENANT-EDITOR.ACTIONS.CANCEL' | translate}}</button> <button mat-button class="rounded-btn neutral" (click)="cancel()" type="button">{{'TENANT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
</div> </div>
<div class="col-auto" *ngIf="!isNew"> <div class="col-auto" *ngIf="!isNew">
<button mat-button class="action-btn" type="button" (click)="delete()"> <button mat-button class="rounded-btn delete-inverted" type="button" (click)="delete()">
<mat-icon>delete</mat-icon> <mat-icon>delete</mat-icon>
{{'TENANT-EDITOR.ACTIONS.DELETE' | translate}} {{'TENANT-EDITOR.ACTIONS.DELETE' | translate}}
</button> </button>
</div> </div>
<div class="col-auto" *ngIf="canSave"> <div class="col-auto" *ngIf="canSave">
<button mat-button class="action-btn" (click)="formSubmit()"> <button mat-button class="rounded-btn primary" (click)="formSubmit()">
<mat-icon>save</mat-icon> <mat-icon>save</mat-icon>
{{'TENANT-EDITOR.ACTIONS.SAVE' | translate}} {{'TENANT-EDITOR.ACTIONS.SAVE' | translate}}
</button> </button>

19
frontend/src/app/ui/admin/tenant/editor/tenant-editor.component.scss
View File

@ -18,22 +18,3 @@
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background { ::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0; background-color: #b0b0b0;
} }
.action-btn {
border-radius: 30px;
background-color: var(--secondary-color);
border: 1px solid transparent;
padding-left: 2em;
padding-right: 2em;
box-shadow: 0px 3px 6px #1E202029;
transition-property: background-color, color;
transition-duration: 200ms;
transition-delay: 50ms;
transition-timing-function: ease-in-out;
&:disabled{
background-color: #CBCBCB;
color: #FFF;
border: 0px;
}
}

6
frontend/src/app/ui/admin/usage-limit/editor/usage-limit-editor.component.html
View File

@ -6,16 +6,16 @@
<app-navigation-breadcrumb /> <app-navigation-breadcrumb />
</div> </div>
<div class="col-auto"> <div class="col-auto">
<button mat-button class="action-btn" (click)="cancel()" type="button">{{'USAGE-LIMIT-EDITOR.ACTIONS.CANCEL' | translate}}</button> <button mat-button class="rounded-btn neutral" (click)="cancel()" type="button">{{'USAGE-LIMIT-EDITOR.ACTIONS.CANCEL' | translate}}</button>
</div> </div>
<div class="col-auto" *ngIf="canDelete"> <div class="col-auto" *ngIf="canDelete">
<button mat-button class="action-btn" type="button" (click)="delete()"> <button mat-button class="rounded-btn delete-inverted" type="button" (click)="delete()">
<mat-icon>delete</mat-icon> <mat-icon>delete</mat-icon>
{{'USAGE-LIMIT-EDITOR.ACTIONS.DELETE' | translate}} {{'USAGE-LIMIT-EDITOR.ACTIONS.DELETE' | translate}}
</button> </button>
</div> </div>
<div class="col-auto" *ngIf="canSave"> <div class="col-auto" *ngIf="canSave">
<button mat-button class="action-btn" (click)="formSubmit()"> <button mat-button class="rounded-btn primary" (click)="formSubmit()">
<mat-icon>save</mat-icon> <mat-icon>save</mat-icon>
{{'USAGE-LIMIT-EDITOR.ACTIONS.SAVE' | translate}} {{'USAGE-LIMIT-EDITOR.ACTIONS.SAVE' | translate}}
</button> </button>

19
frontend/src/app/ui/admin/usage-limit/editor/usage-limit-editor.component.scss
View File

@ -18,22 +18,3 @@
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background { ::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0; background-color: #b0b0b0;
} }
.action-btn {
border-radius: 30px;
background-color: var(--secondary-color);
border: 1px solid transparent;
padding-left: 2em;
padding-right: 2em;
box-shadow: 0px 3px 6px #1E202029;
transition-property: background-color, color;
transition-duration: 200ms;
transition-delay: 50ms;
transition-timing-function: ease-in-out;
&:disabled{
background-color: #CBCBCB;
color: #FFF;
border: 0px;
}
}

2
frontend/src/app/ui/admin/user/listing/user-invite-to-tenant-dialog/user-invite-to-tenant-dialog.component.html
View File

@ -50,7 +50,7 @@
</div> </div>
</div> </div>
<div class="col mt-2"> <div class="col mt-2">
<button mat-raised-button [disabled]="inProgressSendButton" (click)="send()" type="button" class="invite-btn">{{'USER-INVITE-TO-TENANT-DIALOG.ACTIONS.INVITE' | translate}}</button> <button mat-button [disabled]="inProgressSendButton" (click)="send()" type="button" class="rounded-btn primary-inverted invite-btn">{{'USER-INVITE-TO-TENANT-DIALOG.ACTIONS.INVITE' | translate}}</button>
<mat-error *ngIf="formGroup.get('users').hasError('backendError')">{{formGroup.get('users').getError('backendError').message}}</mat-error> <mat-error *ngIf="formGroup.get('users').hasError('backendError')">{{formGroup.get('users').getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('users').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('users').hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
</div> </div>

23
frontend/src/app/ui/admin/user/listing/user-invite-to-tenant-dialog/user-invite-to-tenant-dialog.component.scss
View File

@ -81,29 +81,6 @@
padding-bottom: 0 !important; padding-bottom: 0 !important;
} }
.invite-btn {
background: #ffffff 0% 0% no-repeat padding-box;
border: 1px solid var(--primary-color);
border-radius: 30px;
opacity: 1;
min-width: 101px;
height: 43px;
color: var(--primary-color);
font-weight: 500;
}
.invite-btn-disabled {
min-width: 6.64em;
height: 2.93em;
background: #ffffff;
border: 1px solid #b5b5b5;
border-radius: 30px;
font-weight: bold;
letter-spacing: -0.35px;
color: #b5b5b5;
margin-bottom: 0.25em;
cursor: default;
}
.invite-btn:hover { .invite-btn:hover {
background: var(--primary-color); background: var(--primary-color);