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

replace primary color 2, primary color 3 with link + draft color. Fix respective colors in views, remove unused styles

This commit is contained in:
mchouliara 2024-09-26 17:30:09 +03:00
parent 9653a0cb04
commit da597131db
48 changed files with 276 additions and 309 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/app/core/services/tenant/tenant-handling.service.ts
View File

@ -84,8 +84,8 @@ export class TenantHandlingService extends BaseService {
if (cssColors) { if (cssColors) {
if (cssColors.primaryColor) document.documentElement.style.setProperty(`--primary-color`, cssColors.primaryColor); if (cssColors.primaryColor) document.documentElement.style.setProperty(`--primary-color`, cssColors.primaryColor);
if (cssColors.primaryColor2) document.documentElement.style.setProperty(`--primary-color-2`, cssColors.primaryColor2); if (cssColors.primaryColor2) document.documentElement.style.setProperty(`--link-color`, cssColors.primaryColor2);
if (cssColors.primaryColor3) document.documentElement.style.setProperty(`--primary-color-3`, cssColors.primaryColor3); if (cssColors.primaryColor3) document.documentElement.style.setProperty(`--draft-color`, cssColors.primaryColor3);
if (cssColors.secondaryColor) document.documentElement.style.setProperty(`--secondary-color`, cssColors.secondaryColor); if (cssColors.secondaryColor) document.documentElement.style.setProperty(`--secondary-color`, cssColors.secondaryColor);
if (localStorage.getItem('primaryText')) document.documentElement.style.setProperty(`--primary-text`, localStorage.getItem('primaryText')); if (localStorage.getItem('primaryText')) document.documentElement.style.setProperty(`--primary-text`, localStorage.getItem('primaryText'));
if (localStorage.getItem('secondaryText')) document.documentElement.style.setProperty(`--secondary-text`, localStorage.getItem('secondaryText')); if (localStorage.getItem('secondaryText')) document.documentElement.style.setProperty(`--secondary-text`, localStorage.getItem('secondaryText'));

2
frontend/src/app/ui/admin/language/editor/language-editor.component.scss
View File

@ -12,7 +12,7 @@
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background { ::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
background-color: var(--primary-color-3); background-color: var(--primary-color);
} }
::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 {

2
frontend/src/app/ui/admin/plan-blueprint/editor/plan-blueprint-editor.component.scss
View File

@ -26,7 +26,7 @@
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background { ::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
background-color: var(--primary-color-3); background-color: var(--primary-color);
} }
::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 {

8
frontend/src/app/ui/admin/prefilling-source/editor/prefilling-source-editor.component.scss
View File

@ -11,14 +11,6 @@
} }
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
background-color: var(--primary-color-3);
}
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0;
}
::ng-deep .mdc-form-field { ::ng-deep .mdc-form-field {
label { label {
margin: 0; margin: 0;

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

@ -7,18 +7,10 @@
.add { .add {
background-color: white; background-color: white;
color: #009700; color: #009700; //todo mchouliara
} }
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
background-color: var(--primary-color-3);
}
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0;
}
.dlt-section-btn { .dlt-section-btn {
margin: 0; margin: 0;

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

@ -10,11 +10,3 @@
color: #009700; color: #009700;
} }
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
background-color: var(--primary-color-3);
}
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0;
}

72
frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.html
View File

@ -17,33 +17,7 @@
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="col-12 col-md-6"> <mat-form-field class="col-12 col-md-6">
<mat-label>{{'TENANT-CONFIGURATION-EDITOR.FIELDS.PRIMARY-COLOR-2' | translate}}</mat-label>
<input matInput [formControl]="formGroup.get('cssColors')?.get('primaryColor2Input')" required />
<ngx-colors
class="suffix"
matSuffix
ngx-colors-trigger
[formControl]="formGroup.get('cssColors')?.get('primaryColor2')"
></ngx-colors>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor2')?.hasError('backendError')">{{formGroup.get('cssColors')?.get('primaryColor2')?.getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor2')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor2')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-12 col-md-6">
<mat-label>{{'TENANT-CONFIGURATION-EDITOR.FIELDS.PRIMARY-COLOR-3' | translate}}</mat-label>
<input matInput [formControl]="formGroup.get('cssColors')?.get('primaryColor3Input')" required />
<ngx-colors
class="suffix"
matSuffix
ngx-colors-trigger
[formControl]="formGroup.get('cssColors')?.get('primaryColor3')"
></ngx-colors>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor3')?.hasError('backendError')">{{formGroup.get('cssColors')?.get('primaryColor3')?.getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor3')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor3')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-12 col-md-6">
<mat-label>{{'TENANT-CONFIGURATION-EDITOR.FIELDS.SECONDARY-COLOR' | translate}}</mat-label> <mat-label>{{'TENANT-CONFIGURATION-EDITOR.FIELDS.SECONDARY-COLOR' | translate}}</mat-label>
<input matInput [formControl]="formGroup.get('cssColors')?.get('secondaryColorInput')" required /> <input matInput [formControl]="formGroup.get('cssColors')?.get('secondaryColorInput')" required />
<ngx-colors <ngx-colors
@ -82,8 +56,50 @@
<mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryText')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryText')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryText')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error> <mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryText')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
</mat-form-field> </mat-form-field>
<mat-form-field class="col-12 col-md-6">
<mat-label>
<mat-icon aria-hidden [matTooltip]="'TENANT-CONFIGURATION-EDITOR.FIELDS.LINK-COLOR-HINT' | translate">
info
</mat-icon>
{{'TENANT-CONFIGURATION-EDITOR.FIELDS.LINK-COLOR' | translate}}
</mat-label>
<input matInput [formControl]="formGroup.get('cssColors')?.get('primaryColor2Input')" required />
<ngx-colors
class="suffix"
matSuffix
ngx-colors-trigger
[formControl]="formGroup.get('cssColors')?.get('primaryColor2')"
></ngx-colors>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor2')?.hasError('backendError')">{{formGroup.get('cssColors')?.get('primaryColor2')?.getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor2')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor2')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-12 col-md-6">
<mat-label>
<mat-icon aria-hidden [matTooltip]="'TENANT-CONFIGURATION-EDITOR.FIELDS.DRAFT-STATUS-COLOR-HINT' | translate">
info
</mat-icon>
{{'TENANT-CONFIGURATION-EDITOR.FIELDS.DRAFT-STATUS-COLOR' | translate}}
</mat-label>
<input matInput [formControl]="formGroup.get('cssColors')?.get('primaryColor3Input')" required />
<ngx-colors
class="suffix"
matSuffix
ngx-colors-trigger
[formControl]="formGroup.get('cssColors')?.get('primaryColor3')"
></ngx-colors>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor3')?.hasError('backendError')">{{formGroup.get('cssColors')?.get('primaryColor3')?.getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor3')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryColor3')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-12 col-md-6"> <mat-form-field class="col-12 col-md-6">
<mat-label [matTooltip]="'TENANT-CONFIGURATION-EDITOR.FIELDS.INVERTED-BUTTON-HINT' | translate">{{'TENANT-CONFIGURATION-EDITOR.FIELDS.INVERTED-BUTTON-COLOR' | translate}}</mat-label> <mat-label >
<mat-icon aria-hidden [matTooltip]="'TENANT-CONFIGURATION-EDITOR.FIELDS.INVERTED-BUTTON-HINT' | translate">
info
</mat-icon>
{{'TENANT-CONFIGURATION-EDITOR.FIELDS.INVERTED-BUTTON-COLOR' | translate}}
</mat-label>
<input matInput [formControl]="formGroup.get('cssColors')?.get('invertedBtnColorInput')" required /> <input matInput [formControl]="formGroup.get('cssColors')?.get('invertedBtnColorInput')" required />
<ngx-colors <ngx-colors
class="suffix" class="suffix"

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

@ -10,11 +10,3 @@
color: #009700; color: #009700;
} }
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
background-color: var(--primary-color-3);
}
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0;
}

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

@ -7,14 +7,6 @@
.add { .add {
background-color: white; background-color: white;
color: #009700; color: #009700; //todo mchouliara
} }
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
background-color: var(--primary-color-3);
}
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0;
}

2
frontend/src/app/ui/annotations/annotation-dialog-component/annotation-dialog.component.scss
View File

@ -60,7 +60,7 @@ $mat-card-header-size: 40px !default;
} }
.warn { .warn {
color: #f16868; color: var(--warning-color);
} }
.comments-count { .comments-count {

6
frontend/src/app/ui/dashboard/dashboard.component.scss
View File

@ -89,9 +89,9 @@
font-weight: 300; font-weight: 300;
font-size: 1rem; font-size: 1rem;
letter-spacing: 0px; letter-spacing: 0px;
color: var(--primary-color-2); color: var(--link-color);
&:hover { &:hover {
color: var(--secondary-color) color: var(--primary-color)
} }
opacity: 1; opacity: 1;
} }
@ -213,7 +213,7 @@ input[type="text"] {
} }
.draft { .draft {
color: #f16868; color: var(--draft-color);
} }
.stats { .stats {

2
frontend/src/app/ui/dashboard/recent-edited-activity/recent-edited-activity.component.scss
View File

@ -79,7 +79,7 @@ input[type="text"] {
} }
.draft { .draft {
color: #f16868; color: var(--draft-color);
} }
.pointer { .pointer {

2
frontend/src/app/ui/description/editor/description-base-fields-editor/description-base-fields-editor.component.scss
View File

@ -50,7 +50,7 @@
} }
.input-btn :hover { .input-btn :hover {
color: var(--primary-color-3) !important; color: var(--primary-color) !important;
} }
.plan-link { .plan-link {

2
frontend/src/app/ui/description/editor/description-editor.component.scss
View File

@ -79,7 +79,7 @@
} }
.more-icon :hover { .more-icon :hover {
color: var(--primary-color-3); color: var(--primary-color);
} }
.new-description { .new-description {

9
frontend/src/app/ui/description/listing/description-listing.component.scss
View File

@ -96,7 +96,7 @@
.filter-btn button { .filter-btn button {
color: white; color: white;
background-color: var(--primary-color-2); background-color: var(--primary-color);
width: 37px; width: 37px;
height: 45px; height: 45px;
} }
@ -105,8 +105,11 @@
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 600; font-weight: 600;
letter-spacing: 0.02rem; letter-spacing: 0.02rem;
color: #2d72d6; color: var(--link-color);
cursor: pointer; cursor: pointer;
&:hover{
color: var(--primary-color);
}
} }
.search-form { .search-form {
@ -128,7 +131,7 @@
} }
.pointer:hover { .pointer:hover {
color: var(--primary-color-3); color: var(--primary-color);
} }
::ng-deep .search-form .mat-form-field-wrapper { ::ng-deep .search-form .mat-form-field-wrapper {

2
frontend/src/app/ui/description/listing/filtering/description-filter.component.scss
View File

@ -27,7 +27,7 @@
.filters-title { .filters-title {
width: 93px; width: 93px;
color: var(--primary-color-2); color: var(--primary-color);
background-color: white; background-color: white;
padding: 0px 20px; padding: 0px 20px;
margin-top: -10px; margin-top: -10px;

45
frontend/src/app/ui/description/listing/listing-item/description-listing-item.component.scss
View File

@ -3,24 +3,6 @@
color: var(--gray); color: var(--gray);
} }
.container-header {
display: flex;
align-items: baseline;
margin-top: 0px;
text-transform: uppercase;
}
.container-header p {
letter-spacing: 5px;
color: var(--gray);
padding-top: 10px;
margin-bottom: 0px;
}
.container-header :hover {
color: var(--primary-color-3);
}
h4 { h4 {
display: inline; display: inline;
padding-left: 1em; padding-left: 1em;
@ -36,37 +18,16 @@ h4 > span {
line-height: 2em; line-height: 2em;
} }
.about-item {
display: flex;
flex-wrap: wrap;
}
.links :hover { .links :hover {
color: var(--primary-color-3); color: var(--primary-color);
} }
.about-item .length {
color: var(--primary-color-3);
}
.about-item .title {
margin: 2px 10px;
}
.about-item p {
margin-left: auto;
margin-bottom: 0px;
padding-top: 7px;
color: var(--gray);
}
p { p {
color: #333333; color: #333333;
} }
.storage :hover {
color: var(--primary-color-3);
}
.draft-bookmark { .draft-bookmark {
color: #e7e6e6; color: #e7e6e6;
@ -160,7 +121,7 @@ input[type="text"] {
font-size: 1rem; font-size: 1rem;
padding-top: 0.75rem; padding-top: 0.75rem;
padding-bottom: 0.55rem; padding-bottom: 0.55rem;
color: #f16868; color: var(--draft-color);
} }
.icon-align { .icon-align {
@ -222,7 +183,7 @@ input[type="text"] {
.draft { .draft {
color: #f16868; color: var(--draft-color);
} }
.pointer { .pointer {

1
frontend/src/app/ui/description/overview/description-overview.component.scss
View File

@ -183,7 +183,6 @@
.plan-btn-label { .plan-btn-label {
margin-right: 1em; margin-right: 1em;
color: var(--primary-text); color: var(--primary-text);
opacity: 0.8;
text-align: left; text-align: left;
min-width: 0; min-width: 0;
text-wrap: nowrap; text-wrap: nowrap;

2
frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.html
View File

@ -7,7 +7,7 @@
</div> </div>
<div class="col-auto p-0" [ngClass]="{'mb-1': item.title == HOME_SYMBOL}"> <div class="col-auto p-0" [ngClass]="{'mb-1': item.title == HOME_SYMBOL}">
<a *ngIf="(!item?.skipNavigation && !isLast) else skipNavigation" [routerLink]="computePath(index)" [attr.aria-label]="item.title !== HOME_SYMBOL ? item.title : ('ALT-TEXT.GO-TO-MAIN' | translate)" class=" text-black" disabled> <a *ngIf="(!item?.skipNavigation && !isLast) else skipNavigation" [routerLink]="computePath(index)" [attr.aria-label]="item.title !== HOME_SYMBOL ? item.title : ('ALT-TEXT.GO-TO-MAIN' | translate)" class=" color-unset" disabled>
<ng-container *ngIf="item.title !== HOME_SYMBOL else homeIcon"> <ng-container *ngIf="item.title !== HOME_SYMBOL else homeIcon">
<span class="breadcrumb-item p-2"> <span class="breadcrumb-item p-2">
{{ item.title | translate:item.translateParams }} {{ item.title | translate:item.translateParams }}

2
frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.scss
View File

@ -4,7 +4,7 @@
} }
.text-black{ .text-black{
color: #000; color: #000000;
} }
.mat-icon{ .mat-icon{

4
frontend/src/app/ui/navbar/navbar.component.scss
View File

@ -45,6 +45,8 @@ $mat-card-header-size: 40px !default;
top: 0; top: 0;
left: 0; left: 0;
right: 0; right: 0;
padding: 0.625rem 0;
} }
.logo { .logo {
@ -72,7 +74,7 @@ $mat-card-header-size: 40px !default;
.faq-title:hover, .faq-title:hover,
.lang:hover { .lang:hover {
color: var(--primary-color-2) !important; color: var(--primary-color) !important;
} }
.lang { .lang {

13
frontend/src/app/ui/plan/listing/filtering/plan-filter.component.scss
View File

@ -39,12 +39,11 @@
font-weight: 400; font-weight: 400;
} }
.filters {
}
.filters-title { .filters-title {
width: 93px; width: 93px;
color: var(--primary-color-2); color: var(--primary-color);
background-color: white; background-color: white;
padding: 0px 20px; padding: 0px 20px;
margin-top: -10px; margin-top: -10px;
@ -60,14 +59,6 @@
border: 1px solid var(--light-gray); border: 1px solid var(--light-gray);
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background,
.mat-checkbox-indeterminate.mat-accent .mat-checkbox-background,
.mat-accent .mat-pseudo-checkbox-checked,
.mat-accent .mat-pseudo-checkbox-indeterminate,
.mat-pseudo-checkbox-checked,
.mat-pseudo-checkbox-indeterminate {
background-color: var(--primary-color-3);
}
::ng-deep .mat-ripple-element { ::ng-deep .mat-ripple-element {
background-color: #2e74b649 !important; background-color: #2e74b649 !important;

29
frontend/src/app/ui/plan/listing/listing-item/plan-listing-item.component.scss
View File

@ -3,23 +3,6 @@
color: var(--gray); color: var(--gray);
} }
.container-header {
display: flex;
align-items: baseline;
margin-top: 0px;
text-transform: uppercase;
}
.container-header p {
letter-spacing: 5px;
color: var(--gray);
margin-bottom: 0px;
}
.container-header :hover {
color: var(--primary-color-3);
}
h4 { h4 {
display: inline; display: inline;
padding-left: 1em; padding-left: 1em;
@ -36,14 +19,6 @@ h4 > span {
flex-wrap: wrap; flex-wrap: wrap;
} }
.descriptions-counter {
display: flex;
}
.descriptions-counter :hover {
color: var(--primary-color-3) !important;
}
.about-item .title { .about-item .title {
margin: 2px 10px; margin: 2px 10px;
text-transform: uppercase; text-transform: uppercase;
@ -180,7 +155,7 @@ input[type="text"] {
font-size: 1rem; font-size: 1rem;
padding-top: 0.75rem; padding-top: 0.75rem;
padding-bottom: 0.55rem; padding-bottom: 0.55rem;
color: #f16868; color: var(--draft-color);
} }
.icon-align { .icon-align {
@ -242,7 +217,7 @@ input[type="text"] {
.draft { .draft {
color: #f16868; color: var(--draft-color);
} }
.pointer { .pointer {

16
frontend/src/app/ui/plan/listing/plan-listing.component.scss
View File

@ -57,7 +57,7 @@
} }
.more-icon :hover { .more-icon :hover {
color: var(--primary-color-3); color: var(--primary-color);
} }
.header-title { .header-title {
@ -160,7 +160,7 @@
.filter-btn button { .filter-btn button {
color: white; color: white;
background-color: var(--primary-color-2); background-color: var(--primary-color);
width: 37px; width: 37px;
height: 45px; height: 45px;
} }
@ -190,7 +190,7 @@
.pointer:hover, .pointer:hover,
.zenodo-link:hover { .zenodo-link:hover {
color: var(--primary-color-3); color: var(--primary-color);
} }
::ng-deep .search-form .mat-form-field-wrapper { ::ng-deep .search-form .mat-form-field-wrapper {
@ -211,7 +211,10 @@
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 600; font-weight: 600;
letter-spacing: 0.02rem; letter-spacing: 0.02rem;
color: #2d72d6; color: var(--link-color);
&:hover {
color: var(--primary-color)
}
cursor: pointer; cursor: pointer;
} }
@ -224,6 +227,9 @@
font-size: 0.875rem; font-size: 0.875rem;
font-weight: 600; font-weight: 600;
letter-spacing: 0.02rem; letter-spacing: 0.02rem;
color: #2d72d6; color: var(--link-color);
&:hover {
color: var(--primary-color)
}
cursor: pointer; cursor: pointer;
} }

2
frontend/src/app/ui/plan/new/start-new-plan-dialogue/start-new-plan-dialog.component.scss
View File

@ -58,5 +58,5 @@
} }
.warn { .warn {
color: #f16868; color: var(--warning-color);
} }

8
frontend/src/app/ui/plan/plan-editor-blueprint/plan-editor.component.scss
View File

@ -139,11 +139,11 @@ mat-icon.size-16 {
} }
.remove-description { .remove-description {
color: #f16868; color: var(--draft-color);
} }
.remove-description:hover { .remove-description:hover {
color: #f16868; color: var(--draft-color);
} }
.stepper-actions { .stepper-actions {
@ -238,7 +238,7 @@ a {
} }
a:hover { a:hover {
color: var(--primary-color-3); color: var(--primary-color);
} }
.main-content { .main-content {
@ -331,7 +331,7 @@ a:hover {
} }
.input-btn :hover { .input-btn :hover {
color: var(--primary-color-3) !important; color: var(--primary-color) !important;
} }
} }

2
frontend/src/app/ui/plan/plan-finalize-dialog/plan-finalize-dialog.component.scss
View File

@ -64,7 +64,7 @@
} }
.descriptions span { .descriptions span {
color: var(--primary-color-3); color: var(--primary-color);
} }
.emptyList { .emptyList {

2
frontend/src/app/ui/reference/reference-field/reference-field.component.scss
View File

@ -1,6 +1,6 @@
.insert-manually { .insert-manually {
text-decoration: underline; text-decoration: underline;
color: var(--primary-color-3); color: var(--primary-color);
cursor: pointer; cursor: pointer;
font-weight: 400; font-weight: 400;
} }

8
frontend/src/app/ui/sidebar/sidebar-footer/sidebar-footer.component.css
View File

@ -16,11 +16,13 @@
} }
.sidebar-footer .option:hover { .sidebar-footer .option:hover {
color: var(--primary-color-3); background-color: #ececec;
border-radius: 6px;
} }
.sidebar-footer .option:focus { .sidebar-footer .option:focus {
color: var(--primary-color-3); background-color: #ececec;
border-radius: 6px;
} }
.sidebar-footer .vl { .sidebar-footer .vl {
@ -29,5 +31,5 @@
} }
.option-active { .option-active {
color: var(--primary-color-3) !important; color: var(--primary-color);
} }

6
frontend/src/app/ui/sidebar/sidebar-footer/sidebar-footer.component.html
View File

@ -2,8 +2,10 @@
@for(footerItems of nestedFooterItems; track footerItems){ @for(footerItems of nestedFooterItems; track footerItems){
<ul class="row horizontal-list"> <ul class="row horizontal-list">
@for(item of footerItems; track item; let index=$index){ @for(item of footerItems; track item; let index=$index){
<li class="col-auto option" [routerLink]="routerUtils.generateUrl(item.routerPath)" [ngClass]="{'option-active': this.router.url === item.routerPath}" tabindex="0"> <li>
{{ item.title | translate}} <a class="col-auto option" [routerLink]="routerUtils.generateUrl(item.routerPath)" [ngClass]="{'option-active': this.router.url === item.routerPath}" tabindex="0">
{{ item.title | translate}}
</a>
</li> </li>
} }
</ul> </ul>

2
frontend/src/app/ui/sidebar/sidebar.component.scss
View File

@ -117,7 +117,7 @@ $mat-card-header-size: 30px !default;
} }
.active a i { .active a i {
color: var(--primary-color-2); color: var(--primary-color);
} }
.inner-line { .inner-line {

6
frontend/src/app/ui/user-profile/user-profile.component.scss
View File

@ -4,12 +4,6 @@
background-color: #ffffff; background-color: #ffffff;
} }
.clickable {
cursor: pointer;
}
.clickable:hover {
color: var(--primary-color-3) !important;
}
.user-profile { .user-profile {
.profile-card-center-row { .profile-card-center-row {
justify-content: center; justify-content: center;

4
frontend/src/assets/i18n/baq.json
View File

@ -470,6 +470,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/de.json
View File

@ -473,6 +473,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/en.json
View File

@ -479,6 +479,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/es.json
View File

@ -473,6 +473,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/gr.json
View File

@ -473,6 +473,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/hr.json
View File

@ -473,6 +473,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color", "INVERTED-BUTTON-COLOR": "Inverted Button Color",

4
frontend/src/assets/i18n/pl.json
View File

@ -473,6 +473,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/pt.json
View File

@ -472,6 +472,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/sk.json
View File

@ -473,6 +473,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/sr.json
View File

@ -473,6 +473,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

4
frontend/src/assets/i18n/tr.json
View File

@ -473,6 +473,10 @@
"PRIMARY-COLOR": "Primary Color", "PRIMARY-COLOR": "Primary Color",
"PRIMARY-COLOR-2": "Primary Color 2", "PRIMARY-COLOR-2": "Primary Color 2",
"PRIMARY-COLOR-3": "Primary Color 3", "PRIMARY-COLOR-3": "Primary Color 3",
"DRAFT-STATUS-COLOR": "Draft Status Color",
"DRAFT-STATUS-COLOR-HINT": "Font color for plans and descriptions that are in drafted status",
"LINK-COLOR": "Link Color",
"LINK-COLOR-HINT": "Font color for the links in the application",
"SECONDARY-COLOR": "Secondary Color", "SECONDARY-COLOR": "Secondary Color",
"PRIMARY-COLOR-TEXT": "Primary Color Text", "PRIMARY-COLOR-TEXT": "Primary Color Text",
"SECONDARY-COLOR-TEXT": "Secondary Color Text", "SECONDARY-COLOR-TEXT": "Secondary Color Text",

12
frontend/src/assets/scss/core/_misc.scss
View File

@ -22,12 +22,12 @@ legend {
} }
a{ a{
color: $link-color; // color: $link-color;
&:hover, // &:hover,
&:focus{ // &:focus{
color: darken($link-color, 5%); // color: darken($link-color, 5%);
text-decoration: none; // text-decoration: none;
} // }
&.text-info{ &.text-info{
&:hover, &:focus{ &:hover, &:focus{

2
frontend/src/assets/scss/core/_variables.scss
View File

@ -1,4 +1,4 @@
@import "variables/colors"; @import "variables/colors"; //mchouliara todo check if we can remove
@import "variables/shadow"; @import "variables/shadow";
@import "variables/bootstrap-material-design-base"; @import "variables/bootstrap-material-design-base";

2
frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.scss
View File

@ -36,7 +36,7 @@
font-weight: 500; font-weight: 500;
font-size: 1.25rem; font-size: 1.25rem;
letter-spacing: 0px; letter-spacing: 0px;
color: #f16868; color: var(--warning-color);
opacity: 1; opacity: 1;
} }

9
frontend/src/notification-service/ui/admin/notification-template/editor/notification-template-editor.component.scss
View File

@ -7,15 +7,8 @@
.add { .add {
background-color: white; background-color: white;
color: #009700; color: #009700; //todo mchouliara
} }
} }
::ng-deep .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
background-color: var(--primary-color-3);
}
::ng-deep .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
background-color: #b0b0b0;
}

217
frontend/src/styles.scss
View File

@ -1,17 +1,38 @@
@use '@angular/material'as mat; @use '@angular/material'as mat;
// @import "../node_modules/bootstrap/dist/css/bootstrap.min.css";
// @import "src/assets/scss/material-dashboard.scss";
//Material-Bootstrap configuration
@import "assets/scss/bootstrap-material";
@import "/node_modules/bootstrap/scss/bootstrap";
// @import "@covalent/core/theming/all-theme";
// @import "@angular/material/theming"; // @import '../node_modules/@angular/material/theming';
@import '../node_modules/@swimlane/ngx-datatable/index.css';
@import '../node_modules/@swimlane/ngx-datatable/themes/material.scss';
@import '../node_modules/@swimlane/ngx-datatable/assets/icons.css';
// Guided Tour style
@import '../node_modules/ngx-guided-tour/scss/guided-tour-base-theme.scss';
// Be sure that you only ever include this mixin once! // Be sure that you only ever include this mixin once!
@include mat.core(); @include mat.core();
:root { :root {
--primary-color: #18488F; --primary-color: #18488F;
--primary-color-2: #1E59B1; --link-color: #1E59B1;
--primary-color-3: #246AD3; --draft-color: #f16868;
--secondary-color: #36900B; --secondary-color: #36900B;
--warning-color: #f44336;
--primary-text: #ffffff; --primary-text: #ffffff;
--secondary-text: #000000; --secondary-text: #000000;
--inverted-btn-color: #ffffff; --inverted-btn-color: #ffffff;
--warning-color: #f44336;
--gray: #707070; //previously #848484 --gray: #707070; //previously #848484
--light-gray: #aaaaaa; --light-gray: #aaaaaa;
--dark-gray: #212121; --dark-gray: #212121;
@ -78,9 +99,9 @@ $mat-typography: mat.m2-define-typography-config($font-family: 'Roboto, sans-ser
// $input: mat.m2-define-typography-level($font-size: inherit, $line-height: 1.125, $font-weight: 500, $font-family: 'Roboto, sans-serif;'), // $input: mat.m2-define-typography-level($font-size: inherit, $line-height: 1.125, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
); );
$mat-accessibility-typography: mat.m2-define-typography-config($font-family: 'Roboto, sans-serif;', $mat-accessibility-typography: mat.m2-define-typography-config($font-family: 'Roboto, sans-serif;',
$subtitle-1: mat.m2-define-typography-level($font-size: 22px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
$subtitle-2: mat.m2-define-typography-level($font-size: 22px, $font-weight: 500, $font-family: 'Roboto, sans-serif;'),
$body-1: mat.m2-define-typography-level($font-size: 18px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'), $body-1: mat.m2-define-typography-level($font-size: 18px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
$body-2: mat.m2-define-typography-level($font-size: 18px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'), $body-2: mat.m2-define-typography-level($font-size: 18px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
$button: mat.m2-define-typography-level($font-size: 16px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'), $button: mat.m2-define-typography-level($font-size: 16px, $font-weight: 400, $font-family: 'Roboto, sans-serif;'),
@ -133,18 +154,16 @@ $mat-accessibility-theme: mat.m2-define-light-theme((color: (primary: $mat-theme
} }
// @import "@covalent/core/theming/all-theme"; a {
// @import "@angular/material/theming"; // @import '../node_modules/@angular/material/theming'; color: var(--link-color);
@import '../node_modules/@swimlane/ngx-datatable/index.css'; &:hover {
@import '../node_modules/@swimlane/ngx-datatable/themes/material.scss'; color: var(--primary-color);
@import '../node_modules/@swimlane/ngx-datatable/assets/icons.css'; text-decoration: unset;
}
//Material-Bootstrap configuration &.color-unset {
@import "assets/scss/bootstrap-material"; color: #000000;
}
// Guided Tour style }
@import '../node_modules/ngx-guided-tour/scss/guided-tour-base-theme.scss';
.required-text { .required-text {
font-size: 13px; font-size: 13px;
@ -183,7 +202,7 @@ $mat-accessibility-theme: mat.m2-define-light-theme((color: (primary: $mat-theme
} }
.cc-btn { .cc-btn {
background-color: var(--primary-color-3) !important; background-color: var(--primary-color) !important;
} }
.snackbar-warning { .snackbar-warning {
@ -201,93 +220,93 @@ $mat-accessibility-theme: mat.m2-define-light-theme((color: (primary: $mat-theme
color: #111010; color: #111010;
} }
.listing-item { // .listing-item {
margin-top: 0.5em; // margin-top: 0.5em;
padding: 0.5em; // padding: 0.5em;
cursor: pointer; // cursor: pointer;
border: 3px solid #f2f2f2; // border: 3px solid #f2f2f2;
.title { // .title {
color: black; // color: black;
} // }
.grant-title { // .grant-title {
color: rgb(93, 125, 173); // color: rgb(93, 125, 173);
} // }
.gray-icon { // .gray-icon {
color: rgb(191, 191, 191); // color: rgb(191, 191, 191);
} // }
.chip { // .chip {
padding: 0.1em 1em; // padding: 0.1em 1em;
border-radius: 10em; // border-radius: 10em;
background-color: #0d7489; // background-color: #0d7489;
color: #fff; // color: #fff;
text-transform: uppercase; // text-transform: uppercase;
font-weight: 500; // font-weight: 500;
max-width: 160px; // max-width: 160px;
white-space: nowrap; // white-space: nowrap;
overflow: hidden; // overflow: hidden;
text-overflow: ellipsis; // text-overflow: ellipsis;
} // }
.bordered-chip { // .bordered-chip {
padding: 0.1em 1em; // padding: 0.1em 1em;
border: 0.1em solid rgb(218, 227, 243); // border: 0.1em solid rgb(218, 227, 243);
border-radius: 10em; // border-radius: 10em;
background-color: rgb(236, 241, 249); // background-color: rgb(236, 241, 249);
color: var(--primary-color); // color: var(--primary-color);
text-transform: uppercase; // text-transform: uppercase;
font-weight: 500; // font-weight: 500;
max-width: 160px; // max-width: 160px;
white-space: nowrap; // white-space: nowrap;
overflow: hidden; // overflow: hidden;
text-overflow: ellipsis; // text-overflow: ellipsis;
} // }
.squared-chip { // .squared-chip {
padding: 0.1em 1em; // padding: 0.1em 1em;
border: 0.1em solid rgb(236, 241, 249); // border: 0.1em solid rgb(236, 241, 249);
border-radius: 0.5em; // border-radius: 0.5em;
background-color: rgb(246, 246, 246); // background-color: rgb(246, 246, 246);
color: rgb(127, 127, 127); // color: rgb(127, 127, 127);
max-width: 160px; // max-width: 160px;
white-space: nowrap; // white-space: nowrap;
overflow: hidden; // overflow: hidden;
text-overflow: ellipsis; // text-overflow: ellipsis;
} // }
mat-icon { // mat-icon {
width: auto; // width: auto;
height: auto; // height: auto;
} // }
.mr-5 { // .mr-5 {
margin-right: 2rem !important; // margin-right: 2rem !important;
} // }
.info { // .info {
background-color: #f6f6f6; // background-color: #f6f6f6;
padding: 8px 15px; // padding: 8px 15px;
margin-bottom: 15px; // margin-bottom: 15px;
} // }
.info p { // .info p {
margin-bottom: 0px; // margin-bottom: 0px;
color: rgb(37, 35, 140); // color: rgb(37, 35, 140);
font-weight: 600; // font-weight: 600;
} // }
.chip p { // .chip p {
margin-bottom: 0px; // margin-bottom: 0px;
} // }
h4 span { // h4 span {
color: #089dbb; // color: #089dbb;
font-weight: 600; // font-weight: 600;
} // }
} // }
.listing { .listing {
.mat-card { .mat-card {
@ -300,10 +319,10 @@ $mat-accessibility-theme: mat.m2-define-light-theme((color: (primary: $mat-theme
} }
} }
.gray-container { // .gray-container {
background: linear-gradient(180deg, #f6f6f6, #fff); // background: linear-gradient(180deg, #f6f6f6, #fff);
margin: 5px 0px; // margin: 5px 0px;
} // }
.main-content { .main-content {
background-color: #f5f5f5; background-color: #f5f5f5;
@ -488,7 +507,7 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
background: var(--inverted-btn-color); background: var(--inverted-btn-color);
&:disabled, &.mat-mdc-button.mat-mdc-button-disabled{ &:disabled, &.mat-mdc-button.mat-mdc-button-disabled{
color: var(--primary-color); color: var(--primary-color);
opacity: 0.7; opacity: 0.5;
} }
&.primary-inverted-hover:hover { &.primary-inverted-hover:hover {
background-color: var(--primary-color); background-color: var(--primary-color);
@ -686,4 +705,4 @@ ul.unstyled-list {
// } // }
// .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background { // .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
// background-color: #b0b0b0; // background-color: #b0b0b0;
// } // } //make them work