mirror of
https://github.com/zitadel/zitadel.git
synced 2025-01-06 14:37:41 +00:00
fix(console): refine onboarding styles and behavior, i18n (#5616)
* fix: console onboarding styles and behavior, i18n * action-row classes * fix: only consider real user events in the onboarding view (#5617) * fix(onboarding): only human events * explicitly exclude system api events --------- Co-authored-by: Max Peintner <max@caos.ch> --------- Co-authored-by: Elio Bischof <eliobischof@gmail.com> Co-authored-by: Elio Bischof <elio@zitadel.com>
This commit is contained in:
Max Peintner
GitHub
parent
698f46fe6a
commit
2ee7b9c381
@ -189,6 +189,7 @@
|
||||
border: none;
|
||||
padding: 2px;
|
||||
border-radius: 50vw;
|
||||
cursor: pointer;
|
||||
|
||||
&:hover {
|
||||
background: if($is-dark-theme, #ffffff, $primary-color);
|
||||
|
||||
@ -72,6 +72,7 @@
|
||||
margin-right: 1rem;
|
||||
background-color: if($is-dark-theme, map-get($background, state), #e4e7e4);
|
||||
box-shadow: 0 0 3px #0000001a;
|
||||
border: 1px solid rgba(#8795a1, 0.2);
|
||||
|
||||
i {
|
||||
font-size: 1rem;
|
||||
|
||||
@ -1,7 +1,5 @@
|
||||
<div class="onboarding-header">
|
||||
<h1 class="title" data-e2e="authenticated-welcome">{{ 'HOME.WELCOME' | translate }}</h1>
|
||||
|
||||
<p class="desc cnsl-secondary-text">{{ 'ONBOARDING.DESCRIPTION' | translate }}</p>
|
||||
<h2 class="desc">{{ 'ONBOARDING.DESCRIPTION' | translate }}</h2>
|
||||
|
||||
<ng-container *ngIf="!adminService.hideOnboarding && (adminService.progressAllDone | async) === false">
|
||||
<div class="onboarding-progress-bar-wrapper">
|
||||
@ -38,16 +36,34 @@
|
||||
</div>
|
||||
|
||||
<div class="action-content">
|
||||
<div class="text-block">
|
||||
<span class="name">{{ 'ONBOARDING.EVENTS.' + action[0] + '.title' | translate }}</span>
|
||||
<span class="cnsl-secondary-text description">{{
|
||||
'ONBOARDING.EVENTS.' + action[0] + '.description' | translate
|
||||
}}</span>
|
||||
<div class="action-content-row">
|
||||
<div
|
||||
class="icon-wrapper"
|
||||
[ngStyle]="{
|
||||
background: (themeService.isDarkTheme | async) ? action[1].darkcolor + 50 : action[1].lightcolor + 50
|
||||
}"
|
||||
>
|
||||
<div
|
||||
class="inner"
|
||||
[ngStyle]="{
|
||||
background: (themeService.isDarkTheme | async) ? action[1].darkcolor : action[1].lightcolor,
|
||||
color: (themeService.isDarkTheme | async) ? action[1].lightcolor : action[1].darkcolor
|
||||
}"
|
||||
>
|
||||
<i class="{{ action[1].iconClasses }}"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="text-block">
|
||||
<span class="name">{{ 'ONBOARDING.EVENTS.' + action[0] + '.title' | translate }}</span>
|
||||
<span class="cnsl-secondary-text description">{{
|
||||
'ONBOARDING.EVENTS.' + action[0] + '.description' | translate
|
||||
}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span class="fill-space"></span>
|
||||
<div class="action-row">
|
||||
<span>{{ 'ACTIONS.SETUP' | translate }}</span>
|
||||
<span>{{ 'ONBOARDING.EVENTS.' + action[0] + '.action' | translate }}</span>
|
||||
<mat-icon class="icon">keyboard_arrow_right</mat-icon>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -23,14 +23,10 @@
|
||||
flex-direction: column;
|
||||
margin-bottom: 2rem;
|
||||
|
||||
.title {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-size: 14px;
|
||||
font-size: 1.2rem;
|
||||
margin-top: 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.onboarding-progress-bar-wrapper {
|
||||
@ -71,7 +67,6 @@
|
||||
|
||||
.action-card {
|
||||
position: relative;
|
||||
z-index: 100;
|
||||
margin: 1rem;
|
||||
flex-basis: 270px;
|
||||
text-decoration: none;
|
||||
@ -91,18 +86,46 @@
|
||||
height: 100%;
|
||||
padding-right: 0.5rem;
|
||||
|
||||
.text-block {
|
||||
.action-content-row {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: map-get($foreground, text);
|
||||
padding-top: 1rem;
|
||||
flex-direction: row;
|
||||
align-items: flex-start;
|
||||
|
||||
.name {
|
||||
margin-bottom: 1rem;
|
||||
.icon-wrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.5rem;
|
||||
border-radius: 50vw;
|
||||
flex-shrink: 0;
|
||||
margin-right: 1rem;
|
||||
margin-top: 1rem;
|
||||
|
||||
.inner {
|
||||
border-radius: 50vw;
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 1.75rem;
|
||||
}
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 14px;
|
||||
.text-block {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: map-get($foreground, text);
|
||||
padding-top: 1rem;
|
||||
flex: 1;
|
||||
|
||||
.name {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -111,6 +134,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
&.done {
|
||||
.action-content {
|
||||
opacity: 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
.state-circle {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
@ -126,6 +155,7 @@
|
||||
margin-right: 1rem;
|
||||
background-color: if($is-dark-theme, map-get($background, state), #e4e7e4);
|
||||
box-shadow: 0 0 3px #0000001a;
|
||||
border: 1px solid rgba(#8795a1, 0.2);
|
||||
|
||||
i {
|
||||
font-size: 1rem;
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { Component } from '@angular/core';
|
||||
import { AdminService } from 'src/app/services/admin.service';
|
||||
import { ThemeService } from 'src/app/services/theme.service';
|
||||
import { ONBOARDING_EVENTS } from 'src/app/utils/onboarding';
|
||||
|
||||
@Component({
|
||||
@ -10,7 +11,7 @@ import { ONBOARDING_EVENTS } from 'src/app/utils/onboarding';
|
||||
export class OnboardingComponent {
|
||||
public actions = this.adminService.progressEvents;
|
||||
|
||||
constructor(public adminService: AdminService) {
|
||||
constructor(public adminService: AdminService, public themeService: ThemeService) {
|
||||
this.adminService.loadEvents.next(ONBOARDING_EVENTS);
|
||||
}
|
||||
}
|
||||
|
||||
@ -28,6 +28,11 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
h2 {
|
||||
text-transform: uppercase;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.shortcut-btn {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
@ -1,4 +1,6 @@
|
||||
<div class="max-width-container">
|
||||
<h1 class="home-title" data-e2e="authenticated-welcome">{{ 'HOME.WELCOME' | translate }}</h1>
|
||||
|
||||
<div class="home-wrapper enlarged-container">
|
||||
<ng-container *ngIf="['iam.read$'] | hasRole | async; else defaultHome">
|
||||
<cnsl-onboarding></cnsl-onboarding>
|
||||
@ -10,24 +12,66 @@
|
||||
<p class="disclaimer cnsl-secondary-text">{{ 'HOME.DISCLAIMER' | translate }}</p>
|
||||
|
||||
<span class="fill-space"></span>
|
||||
<h2 class="desc">{{ 'ONBOARDING.MOREDESCRIPTION' | translate }}</h2>
|
||||
|
||||
<div class="home-grid-container">
|
||||
<a href="https://zitadel.com/docs" target="_blank" rel="noreferrer" class="grid-item blue">
|
||||
<div class="grid-item-avatar blue">
|
||||
<i class="icon las la-file-alt"></i>
|
||||
<a href="https://zitadel.com/docs" target="_blank" rel="noreferrer" class="grid-item">
|
||||
<div
|
||||
class="icon-wrapper"
|
||||
[ngStyle]="{
|
||||
background: (themeService.isDarkTheme | async) ? bluedark + 50 : bluelight + 50
|
||||
}"
|
||||
>
|
||||
<div
|
||||
class="inner"
|
||||
[ngStyle]="{
|
||||
background: (themeService.isDarkTheme | async) ? bluedark : bluelight,
|
||||
color: (themeService.isDarkTheme | async) ? bluelight : bluedark
|
||||
}"
|
||||
>
|
||||
<i class="las la-file-alt"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span>{{ 'HOME.DOCUMENTATION.TITLE' | translate }}</span>
|
||||
</a>
|
||||
|
||||
<a href="https://zitadel.com/docs/guides/start/quickstart" target="_blank" rel="noreferrer" class="grid-item green">
|
||||
<div class="grid-item-avatar green">
|
||||
<i class="icon las la-play"></i>
|
||||
<a href="https://zitadel.com/docs/guides/start/quickstart" target="_blank" rel="noreferrer" class="grid-item">
|
||||
<div
|
||||
class="icon-wrapper"
|
||||
[ngStyle]="{
|
||||
background: (themeService.isDarkTheme | async) ? greendark + 50 : greenlight + 50
|
||||
}"
|
||||
>
|
||||
<div
|
||||
class="inner"
|
||||
[ngStyle]="{
|
||||
background: (themeService.isDarkTheme | async) ? greendark : greenlight,
|
||||
color: (themeService.isDarkTheme | async) ? greenlight : greendark
|
||||
}"
|
||||
>
|
||||
<i class="las la-play"></i>
|
||||
</div>
|
||||
</div>
|
||||
<span>{{ 'HOME.GETSTARTED.TITLE' | translate }}</span>
|
||||
</a>
|
||||
|
||||
<a href="https://zitadel.com/docs/examples/introduction" target="_blank" rel="noreferrer" class="grid-item green">
|
||||
<div class="grid-item-avatar green">
|
||||
<i class="icon las la-play"></i>
|
||||
<a href="https://zitadel.com/docs/examples/introduction" target="_blank" rel="noreferrer" class="grid-item">
|
||||
<div
|
||||
class="icon-wrapper"
|
||||
[ngStyle]="{
|
||||
background: (themeService.isDarkTheme | async) ? cyandark + 50 : cyanlight + 50
|
||||
}"
|
||||
>
|
||||
<div
|
||||
class="inner"
|
||||
[ngStyle]="{
|
||||
background: (themeService.isDarkTheme | async) ? cyandark : cyanlight,
|
||||
color: (themeService.isDarkTheme | async) ? cyanlight : cyandark
|
||||
}"
|
||||
>
|
||||
<i class="las la-play"></i>
|
||||
</div>
|
||||
</div>
|
||||
<span>{{ 'HOME.QUICKSTARTS.TITLE' | translate }}</span>
|
||||
</a>
|
||||
|
||||
@ -18,6 +18,11 @@
|
||||
$border-color: if($is-dark-theme, rgba(#8795a1, 0.2), rgba(#8795a1, 0.2));
|
||||
$border-selected-color: if($is-dark-theme, #fff, #000);
|
||||
|
||||
.home-title {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.home-wrapper {
|
||||
position: relative;
|
||||
display: flex;
|
||||
@ -34,6 +39,12 @@
|
||||
}
|
||||
}
|
||||
|
||||
.desc {
|
||||
font-size: 1.2rem;
|
||||
margin-top: 0;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.home-grid-container {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
@ -58,24 +69,15 @@
|
||||
font-size: 14px;
|
||||
background-color: $card-background-color;
|
||||
border: 1px solid $border-color;
|
||||
border-radius: 1rem;
|
||||
border-radius: 0.5rem;
|
||||
margin: 0;
|
||||
text-decoration: none;
|
||||
color: white;
|
||||
box-shadow: 0 0 15px #0000001a;
|
||||
color: inherit;
|
||||
|
||||
&.edit-state {
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
&.green {
|
||||
background: linear-gradient(40deg, #059669 30%, #047857);
|
||||
}
|
||||
|
||||
&.blue {
|
||||
background: linear-gradient(40deg, #3b82f6 30%, #4f46e5);
|
||||
}
|
||||
|
||||
.grid-item-avatar {
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
@ -118,6 +120,26 @@
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-wrapper {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 0.5rem;
|
||||
border-radius: 50vw;
|
||||
flex-shrink: 0;
|
||||
margin-right: 1rem;
|
||||
|
||||
.inner {
|
||||
border-radius: 50vw;
|
||||
height: 40px;
|
||||
width: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-size: 1.75rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@ -1,6 +1,8 @@
|
||||
import { Component } from '@angular/core';
|
||||
import { Breadcrumb, BreadcrumbService, BreadcrumbType } from 'src/app/services/breadcrumb.service';
|
||||
import { GrpcAuthService } from 'src/app/services/grpc-auth.service';
|
||||
import { ThemeService } from 'src/app/services/theme.service';
|
||||
import { COLORS } from 'src/app/utils/color';
|
||||
|
||||
@Component({
|
||||
selector: 'cnsl-home',
|
||||
@ -8,9 +10,18 @@ import { GrpcAuthService } from 'src/app/services/grpc-auth.service';
|
||||
styleUrls: ['./home.component.scss'],
|
||||
})
|
||||
export class HomeComponent {
|
||||
public greendark: string = COLORS[6][700];
|
||||
public greenlight = COLORS[6][200];
|
||||
|
||||
public cyandark: string = COLORS[7][700];
|
||||
public cyanlight = COLORS[7][200];
|
||||
|
||||
public bluedark: string = COLORS[9][700];
|
||||
public bluelight = COLORS[9][200];
|
||||
|
||||
public dark: boolean = true;
|
||||
|
||||
constructor(public authService: GrpcAuthService, breadcrumbService: BreadcrumbService) {
|
||||
constructor(public authService: GrpcAuthService, breadcrumbService: BreadcrumbService, public themeService: ThemeService) {
|
||||
const bread: Breadcrumb = {
|
||||
type: BreadcrumbType.ORG,
|
||||
routerLink: ['/org'],
|
||||
|
||||
@ -267,9 +267,20 @@ export interface OnboardingActions {
|
||||
oneof: string[];
|
||||
link: string | string[];
|
||||
fragment?: string | undefined;
|
||||
iconClasses?: string;
|
||||
darkcolor: string;
|
||||
lightcolor: string;
|
||||
}
|
||||
|
||||
type OnboardingEvent = { order: number; link: string; fragment: string | undefined; event: Event.AsObject | undefined };
|
||||
type OnboardingEvent = {
|
||||
order: number;
|
||||
link: string;
|
||||
fragment: string | undefined;
|
||||
event: Event.AsObject | undefined;
|
||||
iconClasses?: string;
|
||||
darkcolor: string;
|
||||
lightcolor: string;
|
||||
};
|
||||
type OnboardingEventEntries = Array<[string, OnboardingEvent]> | [];
|
||||
|
||||
@Injectable({
|
||||
@ -286,14 +297,30 @@ export class AdminService {
|
||||
const eventsReq = new ListEventsRequest().setAsc(true).setEventTypesList(searchForTypes).setAsc(false);
|
||||
return from(this.listEvents(eventsReq)).pipe(
|
||||
map((events) => {
|
||||
const el = events.toObject().eventsList.filter((e) => e.editor?.service !== 'System-API');
|
||||
const el = events.toObject().eventsList.filter((e) => e.editor?.service !== 'System-API' && e.editor?.userId);
|
||||
|
||||
let obj: { [type: string]: OnboardingEvent } = {};
|
||||
actions.map((action) => {
|
||||
const filtered = el.filter((event) => event.type?.type && action.oneof.includes(event.type.type));
|
||||
(obj as any)[action.eventType] = filtered.length
|
||||
? { order: action.order, link: action.link, fragment: action.fragment, event: filtered[0] }
|
||||
: { order: action.order, link: action.link, fragment: action.fragment, event: undefined };
|
||||
? {
|
||||
order: action.order,
|
||||
link: action.link,
|
||||
fragment: action.fragment,
|
||||
event: filtered[0],
|
||||
iconClasses: action.iconClasses,
|
||||
darkcolor: action.darkcolor,
|
||||
lightcolor: action.lightcolor,
|
||||
}
|
||||
: {
|
||||
order: action.order,
|
||||
link: action.link,
|
||||
fragment: action.fragment,
|
||||
event: undefined,
|
||||
iconClasses: action.iconClasses,
|
||||
darkcolor: action.darkcolor,
|
||||
lightcolor: action.lightcolor,
|
||||
};
|
||||
});
|
||||
|
||||
const toArray = Object.entries(obj).sort(([key0, a], [key1, b]) => a.order - b.order);
|
||||
|
||||
@ -1,16 +1,70 @@
|
||||
import { OnboardingActions } from '../services/admin.service';
|
||||
import { COLORS } from './color';
|
||||
|
||||
const reddark: string = COLORS[0][700];
|
||||
const redlight = COLORS[0][200];
|
||||
|
||||
const yellowdark: string = COLORS[3][700];
|
||||
const yellowlight = COLORS[3][200];
|
||||
|
||||
const greendark: string = COLORS[6][700];
|
||||
const greenlight = COLORS[6][200];
|
||||
|
||||
const bluedark: string = COLORS[9][700];
|
||||
const bluelight = COLORS[9][200];
|
||||
|
||||
const purpledark: string = COLORS[12][700];
|
||||
const purplelight = COLORS[12][200];
|
||||
|
||||
const pinkdark: string = COLORS[15][700];
|
||||
const pinklight = COLORS[15][200];
|
||||
|
||||
export const ONBOARDING_EVENTS: OnboardingActions[] = [
|
||||
{ order: 0, eventType: 'project.added', oneof: ['project.added'], link: ['/projects/create'] },
|
||||
{ order: 1, eventType: 'project.application.added', oneof: ['project.application.added'], link: ['/projects/app-create'] },
|
||||
{ order: 2, eventType: 'user.human.added', oneof: ['user.human.added'], link: ['/users/create'] },
|
||||
{ order: 3, eventType: 'user.grant.added', oneof: ['user.grant.added'], link: ['/grant-create'] },
|
||||
{
|
||||
order: 0,
|
||||
eventType: 'project.added',
|
||||
oneof: ['project.added'],
|
||||
link: ['/projects/create'],
|
||||
iconClasses: 'las la-database',
|
||||
darkcolor: greendark,
|
||||
lightcolor: greenlight,
|
||||
},
|
||||
{
|
||||
order: 1,
|
||||
eventType: 'project.application.added',
|
||||
oneof: ['project.application.added'],
|
||||
link: ['/projects/app-create'],
|
||||
iconClasses: 'lab la-openid',
|
||||
darkcolor: purpledark,
|
||||
lightcolor: purplelight,
|
||||
},
|
||||
{
|
||||
order: 2,
|
||||
eventType: 'user.human.added',
|
||||
oneof: ['user.human.added'],
|
||||
link: ['/users/create'],
|
||||
iconClasses: 'las la-user',
|
||||
darkcolor: bluedark,
|
||||
lightcolor: bluelight,
|
||||
},
|
||||
{
|
||||
order: 3,
|
||||
eventType: 'user.grant.added',
|
||||
oneof: ['user.grant.added'],
|
||||
link: ['/grant-create'],
|
||||
iconClasses: 'las la-shield-alt',
|
||||
darkcolor: reddark,
|
||||
lightcolor: redlight,
|
||||
},
|
||||
{
|
||||
order: 4,
|
||||
eventType: 'instance.policy.label.added',
|
||||
oneof: ['instance.policy.label.added', 'instance.policy.label.changed'],
|
||||
link: ['/settings'],
|
||||
fragment: 'branding',
|
||||
iconClasses: 'las la-swatchbook',
|
||||
darkcolor: pinkdark,
|
||||
lightcolor: pinklight,
|
||||
},
|
||||
{
|
||||
order: 5,
|
||||
@ -18,5 +72,8 @@ export const ONBOARDING_EVENTS: OnboardingActions[] = [
|
||||
oneof: ['instance.smtp.config.added', 'instance.smtp.config.changed'],
|
||||
link: ['/settings'],
|
||||
fragment: 'notifications',
|
||||
iconClasses: 'las la-envelope',
|
||||
darkcolor: yellowdark,
|
||||
lightcolor: yellowlight,
|
||||
},
|
||||
];
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
},
|
||||
"ONBOARDING": {
|
||||
"DESCRIPTION": "Dein Onboarding-prozess",
|
||||
"MOREDESCRIPTION": "mehr Shortcuts",
|
||||
"COMPLETED": "abgeschlossen",
|
||||
"DISMISS": "schließen",
|
||||
"CARD": {
|
||||
@ -53,27 +54,33 @@
|
||||
"EVENTS": {
|
||||
"instance.policy.label.added": {
|
||||
"title": "Branding anpassen",
|
||||
"description": "Definiere Farben und Form des Login-UIs und uploade deine Logos und Icons."
|
||||
"description": "Definiere Farben und Form des Login-UIs und uploade deine Logos und Icons.",
|
||||
"action": "Branding anpassen"
|
||||
},
|
||||
"instance.smtp.config.added": {
|
||||
"title": "SMTP Benachrichtigungseinstellungen",
|
||||
"description": "Konfiguriere deinen Mailserver."
|
||||
"description": "Konfiguriere deinen Mailserver.",
|
||||
"action": "SMTP einrichten"
|
||||
},
|
||||
"project.added": {
|
||||
"title": "Erstelle ein Projekt",
|
||||
"description": "Erstelle dein erstes Projekt und definiere Rollen"
|
||||
"description": "Erstelle dein erstes Projekt und definiere Rollen",
|
||||
"action": "Projekt erstellen"
|
||||
},
|
||||
"project.application.added": {
|
||||
"title": "Erstelle eine App",
|
||||
"description": "Erstelle deine erste Web-, native, API oder SAML-applikation und konfiguriere den Authentification-flow."
|
||||
"description": "Erstelle deine erste Web-, native, API oder SAML-applikation und konfiguriere den Authentification-flow.",
|
||||
"action": "App erstellen"
|
||||
},
|
||||
"user.human.added": {
|
||||
"title": "Erfasse Benutzer",
|
||||
"description": "Erstelle Benutzer die später deine Apps nutzen können."
|
||||
"description": "Erstelle Benutzer die später deine Apps nutzen können.",
|
||||
"action": "Benutzer erfassen"
|
||||
},
|
||||
"user.grant.added": {
|
||||
"title": "Berechtige Benutzer",
|
||||
"description": "Erlaube es deinen Nutzern auf deine Apps zuzugreifen und gebe ihnen Rollen."
|
||||
"description": "Erlaube es deinen Nutzern auf deine Apps zuzugreifen und gebe ihnen Rollen.",
|
||||
"action": "Benutzer berechtigen"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
},
|
||||
"ONBOARDING": {
|
||||
"DESCRIPTION": "Your onboarding process",
|
||||
"MOREDESCRIPTION": "more shortcuts",
|
||||
"COMPLETED": "completed",
|
||||
"DISMISS": "No thanks, I'm a pro.",
|
||||
"CARD": {
|
||||
@ -53,27 +54,33 @@
|
||||
"EVENTS": {
|
||||
"instance.policy.label.added": {
|
||||
"title": "Setup your brand",
|
||||
"description": "Define coloring and shape of your login and upload your logo and icons."
|
||||
"description": "Define coloring and shape of your login and upload your logo and icons.",
|
||||
"action": "Setup branding"
|
||||
},
|
||||
"instance.smtp.config.added": {
|
||||
"title": "Setup your SMTP settings",
|
||||
"description": "Set your own mail server settings."
|
||||
"description": "Set your own mail server settings.",
|
||||
"action": "Setup SMTP"
|
||||
},
|
||||
"project.added": {
|
||||
"title": "Create your first project",
|
||||
"description": "Add your first project and define its roles and authorizations."
|
||||
"title": "Create a project",
|
||||
"description": "Add a project and define its roles and authorizations.",
|
||||
"action": "Create project"
|
||||
},
|
||||
"project.application.added": {
|
||||
"title": "Create your first application",
|
||||
"description": "Create a web, native, api or saml application and setup your authentication flow."
|
||||
"title": "Create an application",
|
||||
"description": "Create a web, native, api or saml application and setup your authentication flow.",
|
||||
"action": "Create app"
|
||||
},
|
||||
"user.human.added": {
|
||||
"title": "Add users",
|
||||
"description": "Add your application users"
|
||||
"description": "Add your application users",
|
||||
"action": "Add user"
|
||||
},
|
||||
"user.grant.added": {
|
||||
"title": "Grant users",
|
||||
"description": "Allow users to access your application and setup their role."
|
||||
"description": "Allow users to access your application and setup their role.",
|
||||
"action": "Grant user"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
},
|
||||
"ONBOARDING": {
|
||||
"DESCRIPTION": "Votre processus d'intégration",
|
||||
"MOREDESCRIPTION": "plus de raccourcis",
|
||||
"COMPLETED": "terminé",
|
||||
"DISMISS": "fermer",
|
||||
"CARD": {
|
||||
@ -53,27 +54,33 @@
|
||||
"EVENTS": {
|
||||
"instance.policy.label.added": {
|
||||
"title": "Créez votre marque",
|
||||
"description": "Définissez la couleur et la forme de votre connexion et téléchargez votre logo et vos icônes."
|
||||
"description": "Définissez la couleur et la forme de votre connexion et téléchargez votre logo et vos icônes.",
|
||||
"action": "Définissez"
|
||||
},
|
||||
"instance.smtp.config.added": {
|
||||
"title": "Configurez vos paramètres SMTP",
|
||||
"description": "Définissez vos propres paramètres de serveur de messagerie"
|
||||
"title": "Configurez paramètres SMTP",
|
||||
"description": "Définissez paramètres de serveur de messagerie",
|
||||
"action": "Configurez"
|
||||
},
|
||||
"project.added": {
|
||||
"title": "Créez votre premier projet",
|
||||
"description": "Ajoutez votre premier projet et définissez ses rôles et autorisations."
|
||||
"title": "Créez projet",
|
||||
"description": "Ajoutez projet et définissez ses rôles et autorisations.",
|
||||
"action": "Créez projet"
|
||||
},
|
||||
"project.application.added": {
|
||||
"title": "Créez votre première application",
|
||||
"description": "Créez une application web, native, api ou saml et configurez votre flux d'authentification."
|
||||
"description": "Créez une application web, native, api ou saml et configurez votre flux d'authentification.",
|
||||
"action": "Créez application"
|
||||
},
|
||||
"user.human.added": {
|
||||
"title": "Ajouter des utilisateurs",
|
||||
"description": "Ajouter les utilisateurs de votre application"
|
||||
"description": "Ajouter les utilisateurs de application",
|
||||
"action": "Ajuter utilisateur"
|
||||
},
|
||||
"user.grant.added": {
|
||||
"title": "Utilisateurs de subventions",
|
||||
"description": "Autorisez les utilisateurs à accéder à votre application et définissez leur rôle."
|
||||
"description": "Autorisez les utilisateurs à accéder à votre application et définissez leur rôle.",
|
||||
"action": "Autorisez"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
},
|
||||
"ONBOARDING": {
|
||||
"DESCRIPTION": "Il tuo processo di onboarding",
|
||||
"MOREDESCRIPTION": "più scorciatoie",
|
||||
"COMPLETED": "completato",
|
||||
"DISMISS": "chiudi",
|
||||
"CARD": {
|
||||
@ -53,27 +54,33 @@
|
||||
"EVENTS": {
|
||||
"instance.policy.label.added": {
|
||||
"title": "Imposta il tuo marchio",
|
||||
"description": "Definisci la colorazione e il design del vostro login e caricate il vostro logo e le vostre icone."
|
||||
"description": "Definisci la colorazione e il design del vostro login e caricate il vostro logo e le vostre icone.",
|
||||
"action": "Imposta marchio"
|
||||
},
|
||||
"instance.smtp.config.added": {
|
||||
"title": "Configura le impostazioni SMTP",
|
||||
"description": "Imposta il proprio server di posta"
|
||||
"description": "Imposta il proprio server di posta",
|
||||
"action": "Configura SMTP"
|
||||
},
|
||||
"project.added": {
|
||||
"title": "Crea il tuo primo progetto",
|
||||
"description": "Aggiungere il primo progetto e definire i ruoli e le autorizzazioni."
|
||||
"description": "Aggiungere il primo progetto e definire i ruoli e le autorizzazioni.",
|
||||
"action": "Crea progetto"
|
||||
},
|
||||
"project.application.added": {
|
||||
"title": "Crea la tua prima applicazione",
|
||||
"description": "Crea un'applicazione web, nativa, api o saml e imposta il flusso di autenticazione."
|
||||
"description": "Crea un'applicazione web, nativa, api o saml e imposta il flusso di autenticazione.",
|
||||
"action": "Crea applicazione"
|
||||
},
|
||||
"user.human.added": {
|
||||
"title": "Aggiungi utenti",
|
||||
"description": "Aggiungi gli utenti dell'applicazione"
|
||||
"description": "Aggiungi gli utenti dell'applicazione",
|
||||
"action": "Aggiungi utente"
|
||||
},
|
||||
"user.grant.added": {
|
||||
"title": "Crea autorizzazioni per gli utenti",
|
||||
"description": "Consenti agli utenti di accedere alla tua applicazione e imposta il loro ruolo."
|
||||
"description": "Consenti agli utenti di accedere alla tua applicazione e imposta il loro ruolo.",
|
||||
"action": "Crea autorizzazione"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
},
|
||||
"ONBOARDING": {
|
||||
"DESCRIPTION": "オンボーディングの手順",
|
||||
"MOREDESCRIPTION": "より多くのショートカット",
|
||||
"COMPLETED": "完了",
|
||||
"DISMISS": "いいえ、私はプロです。",
|
||||
"CARD": {
|
||||
@ -53,27 +54,33 @@
|
||||
"EVENTS": {
|
||||
"instance.policy.label.added": {
|
||||
"title": "ブランドをセットアップする",
|
||||
"description": "ログインの色と形状を定義し、ロゴとアイコンをアップロードします。"
|
||||
"description": "ログインの色と形状を定義し、ロゴとアイコンをアップロードします。",
|
||||
"action": "ブランディングの設定"
|
||||
},
|
||||
"instance.smtp.config.added": {
|
||||
"title": "SMTP設定をセットアップする",
|
||||
"description": "独自のメールサーバーを設定します。"
|
||||
"description": "独自のメールサーバーを設定します。",
|
||||
"action": "SMTP 設定を設定する"
|
||||
},
|
||||
"project.added": {
|
||||
"title": "最初のプロジェクトを作成する",
|
||||
"description": "最初のプロジェクトを追加し、ロールと認証を定義します。"
|
||||
"description": "最初のプロジェクトを追加し、ロールと認証を定義します。",
|
||||
"action": "プロジェクトを作成"
|
||||
},
|
||||
"project.application.added": {
|
||||
"title": "最初のアプリケーションを作成する",
|
||||
"description": "Web、ネイティブ、API、またはSAMLアプリケーションを作成し、認証フローをセットアップします。"
|
||||
"description": "Web、ネイティブ、API、またはSAMLアプリケーションを作成し、認証フローをセットアップします。",
|
||||
"action": "アプリケーションを作成"
|
||||
},
|
||||
"user.human.added": {
|
||||
"title": "ユーザーを追加する",
|
||||
"description": "アプリケーションユーザーを追加します。"
|
||||
"description": "アプリケーションユーザーを追加します。",
|
||||
"action": "ユーザーを作成"
|
||||
},
|
||||
"user.grant.added": {
|
||||
"title": "ユーザーにグラントする",
|
||||
"description": "ユーザーがアプリケーションにアクセスし、ロールをセットアップできるようにします。"
|
||||
"description": "ユーザーがアプリケーションにアクセスし、ロールをセットアップできるようにします。",
|
||||
"action": "承認の作成"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
},
|
||||
"ONBOARDING": {
|
||||
"DESCRIPTION": "Twój proces wprowadzania na rynek",
|
||||
"MOREDESCRIPTION": "więcej skrótów",
|
||||
"COMPLETED": "zakończone",
|
||||
"DISMISS": "zamknąć",
|
||||
"CARD": {
|
||||
@ -53,27 +54,33 @@
|
||||
"EVENTS": {
|
||||
"instance.policy.label.added": {
|
||||
"title": "Skonfiguruj swoją markę",
|
||||
"description": "Zdefiniuj kolorystykę i kształt swojego loginu oraz wgraj swoje logo i ikony."
|
||||
"description": "Zdefiniuj kolorystykę i kształt swojego loginu oraz wgraj swoje logo i ikony.",
|
||||
"action": "Skonfiguruj branding"
|
||||
},
|
||||
"instance.smtp.config.added": {
|
||||
"title": "Ustawienia SMTP",
|
||||
"description": "Ustawienie własnego serwera pocztowego"
|
||||
"description": "Ustawienie własnego serwera pocztowego",
|
||||
"action": "skonfiguruj ustawienia SMTP"
|
||||
},
|
||||
"project.added": {
|
||||
"title": "Stwórz swój pierwszy projekt",
|
||||
"description": "Dodaj swój pierwszy projekt i określ jego role i uprawnienia."
|
||||
"description": "Dodaj swój pierwszy projekt i określ jego role i uprawnienia.",
|
||||
"action": "Utwórz projekt"
|
||||
},
|
||||
"project.application.added": {
|
||||
"title": "Utwórz swoją pierwszą aplikację",
|
||||
"description": "Utwórz aplikację internetową, natywną, api lub saml i skonfiguruj swój przepływ uwierzytelniania."
|
||||
"description": "Utwórz aplikację internetową, natywną, api lub saml i skonfiguruj swój przepływ uwierzytelniania.",
|
||||
"action": "Utwórz aplikację"
|
||||
},
|
||||
"user.human.added": {
|
||||
"title": "Dodaj użytkowników",
|
||||
"description": "Dodaj użytkowników aplikacji"
|
||||
"description": "Dodaj użytkowników aplikacji",
|
||||
"action": "Stwórz użytkownika"
|
||||
},
|
||||
"user.grant.added": {
|
||||
"title": "Użytkownicy dotacji",
|
||||
"description": "Pozwól użytkownikom na dostęp do Twojej aplikacji i ustaw ich rolę."
|
||||
"description": "Pozwól użytkownikom na dostęp do Twojej aplikacji i ustaw ich rolę.",
|
||||
"action": "Utwórz autoryzację"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@ -44,6 +44,7 @@
|
||||
},
|
||||
"ONBOARDING": {
|
||||
"DESCRIPTION": "你的入职过程",
|
||||
"MOREDESCRIPTION": "更多捷径",
|
||||
"COMPLETED": "已完成",
|
||||
"DISMISS": "隐藏",
|
||||
"CARD": {
|
||||
@ -53,27 +54,33 @@
|
||||
"EVENTS": {
|
||||
"instance.policy.label.added": {
|
||||
"title": "设置你的品牌",
|
||||
"description": "定义你的登录的颜色和形状，上传你的标志和图标。"
|
||||
"description": "定义你的登录的颜色和形状，上传你的标志和图标。",
|
||||
"action": "设置品牌"
|
||||
},
|
||||
"instance.smtp.config.added": {
|
||||
"title": "SMTP设置",
|
||||
"description": "设置你自己的邮件服务器设置"
|
||||
"description": "设置你自己的邮件服务器设置",
|
||||
"action": "设置 SMTP 设置"
|
||||
},
|
||||
"project.added": {
|
||||
"title": "创建你的第一个项目",
|
||||
"description": "添加你的第一个项目并定义其角色和授权。"
|
||||
"description": "添加你的第一个项目并定义其角色和授权。",
|
||||
"action": "创建项目"
|
||||
},
|
||||
"project.application.added": {
|
||||
"title": "创建你的第一个应用程序",
|
||||
"description": "创建一个web、native、api或saml应用程序并设置你的认证流程。"
|
||||
"description": "创建一个web、native、api或saml应用程序并设置你的认证流程。",
|
||||
"action": "创建应用程序"
|
||||
},
|
||||
"user.human.added": {
|
||||
"title": "添加用户",
|
||||
"description": "添加你的应用程序用户"
|
||||
"description": "添加你的应用程序用户",
|
||||
"action": "创建用户"
|
||||
},
|
||||
"user.grant.added": {
|
||||
"title": "授予用户",
|
||||
"description": "允许用户访问你的应用程序并设置他们的角色。"
|
||||
"description": "允许用户访问你的应用程序并设置他们的角色。",
|
||||
"action": "创建授权"
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user