fix(console): text color shades, ui fixes, state handle restore (#3698)

* common project grant dialog, info box, label policy

* text styles, statehandler fix

* dialog, btn alignment, i18n

* search-user theme colors

* filter formfield sizing

* redirect uris

* shortcut layout

* settings grid type rest, shortcuts linking

* login policy, reset button consistency, metadata

* permission checks
This commit is contained in:
Max Peintner
2022-05-25 09:33:18 +02:00
committed by GitHub
parent 09b021b257
commit b6deed3e34
90 changed files with 1055 additions and 883 deletions
@@ -1,5 +1,4 @@
<div class="found" *ngIf="users.length > 0">
<!-- <span class="found-label cnsl-secondary-text">{{'USER.SEARCH.FOUND' | translate}}:</span> -->
<div class="user-autocomplete-found" *ngIf="users.length > 0">
<div class="found-user-row" *ngFor="let user of users; index as i">
<div class="circle">
<cnsl-avatar
@@ -109,9 +108,11 @@
</mat-option>
</mat-autocomplete>
<span class="target-desc">
<span class="user-autocomplete-target-desc">
{{ 'USER.TARGET.SELF' | translate }}
<a (click)="changeTarget()">{{ 'USER.TARGET.CLICKHERE' | translate }}</a>
<a (click)="changeTarget()"
><strong>{{ 'USER.TARGET.CLICKHERE' | translate }}</strong></a
>
</span>
</cnsl-form-field>
</div>
@@ -122,9 +123,11 @@
<cnsl-form-field class="user-create-form-field more-space">
<cnsl-label>{{ 'USER.SEARCH.ADDITIONAL-EXTERNAL' | translate }}</cnsl-label>
<input cnslInput type="text" [formControl]="globalLoginNameControl" placeholder="[email protected]" />
<span class="target-desc">
<span class="user-autocomplete-target-desc">
{{ (target === UserTarget.SELF ? 'USER.TARGET.SELF' : 'USER.TARGET.EXTERNAL') | translate }}
<a (click)="changeTarget()">{{ 'USER.TARGET.CLICKHERE' | translate }}</a>
<a (click)="changeTarget()"
><strong>{{ 'USER.TARGET.CLICKHERE' | translate }}</strong></a
>
</span>
</cnsl-form-field>
@@ -1,15 +1,79 @@
.target-desc {
font-size: 14px;
display: block;
margin-top: 0.5rem;
@use '@angular/material' as mat;
a {
color: #4072b4;
@mixin search-user-autocomplete-theme($theme) {
$primary: map-get($theme, primary);
$primary-color: mat.get-color-from-palette($primary, 500);
$background: map-get($theme, background);
$foreground: map-get($theme, foreground);
$secondary-text: map-get($foreground, secondary-text);
&:hover {
cursor: pointer;
color: #6992c9;
text-decoration: underline;
.user-autocomplete-found {
margin: 0.5rem 0;
border-radius: 0.5rem;
padding: 0.5rem 0;
max-width: 500px;
box-sizing: border-box;
.add-user-row {
margin-left: -4px;
}
.found-user-row {
display: flex;
align-items: center;
padding: 0.25rem 0;
button {
visibility: hidden;
}
&:hover {
button {
visibility: visible;
}
}
}
.found-label {
font-size: 14px;
}
.user-name-column {
display: flex;
flex-direction: column;
justify-content: center;
.smaller {
font-size: 13px;
}
}
.fill-space {
flex: 1;
}
.search-user-dl-btn {
transition: color 0.2s ease;
&:not(:hover) {
color: $secondary-text;
}
}
}
.user-autocomplete-target-desc {
font-size: 14px;
display: block;
margin-top: 0.5rem;
a {
color: $primary-color;
&:hover {
cursor: pointer;
color: mat.get-color-from-palette($primary, 400);
text-decoration: underline;
}
}
}
}
@@ -36,60 +100,6 @@
font-size: 0.8rem;
}
.found {
margin: 0.5rem 0;
border-radius: 0.5rem;
padding: 0.5rem 0;
max-width: 500px;
box-sizing: border-box;
.add-user-row {
margin-left: -4px;
}
.found-user-row {
display: flex;
align-items: center;
padding: 0.25rem 0;
button {
visibility: hidden;
}
&:hover {
button {
visibility: visible;
}
}
}
.found-label {
font-size: 14px;
}
.user-name-column {
display: flex;
flex-direction: column;
justify-content: center;
.smaller {
font-size: 13px;
}
}
.fill-space {
flex: 1;
}
.search-user-dl-btn {
transition: color 0.2s ease;
&:not(:hover) {
color: var(--grey);
}
}
}
.circle {
margin-right: 0.5rem;
}