mirror of
https://github.com/zitadel/zitadel.git
synced 2025-08-12 07:57:32 +00:00
docs: console guide (#4468)
* console guide * org * orgs, projects * applications * project, roles, authz * users, roles * app config, imgs * policy imgs * users, metadata, imgs * actions, projects, structure * css * rm overview component * rm manager from sidebar * fix some broken links, update 🦖 * fix broken links * fix img shadow * Update docs/docs/concepts/structure/applications.md Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * policy link * link to projects guide * Update docs/docs/guides/integrate/application/review-config.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * add external org authz guide * Update docs/docs/guides/manage/console/users.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * link to example * readd manager structure * punto * docs: domain settings email as username * docs: links * project, application settings, screenshots * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/instance-settings.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/organizations.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * iam role * Update docs/docs/guides/manage/console/managers.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * Update docs/docs/guides/manage/console/managers.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * change username text * Update docs/docs/guides/manage/console/roles.mdx Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * link example * branding changes * Update docs/docs/guides/manage/console/organizations.mdx good point 👍 Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> * docs: loginnames Co-authored-by: Fabi <38692350+hifabienne@users.noreply.github.com> Co-authored-by: Fabienne <fabienne.gerschwiler@gmail.com>
This commit is contained in:
Max Peintner
@@ -1,12 +1,12 @@
|
||||
.apicard {
|
||||
border-radius: .5rem;
|
||||
border-radius: 0.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 200px;
|
||||
background: var(--card-background);
|
||||
padding: 1rem;
|
||||
text-decoration: none;
|
||||
transition: all .2 ease-in-out;
|
||||
transition: all 0.2 ease-in-out;
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
@@ -32,7 +32,8 @@
|
||||
|
||||
.apicard:hover {
|
||||
text-decoration: none;
|
||||
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
||||
0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
/* .apicard h2 {
|
||||
@@ -43,7 +44,9 @@
|
||||
color: #bfc1cc;
|
||||
} */
|
||||
|
||||
.apicard h3, h4, h5 {
|
||||
.apicard h3,
|
||||
h4,
|
||||
h5 {
|
||||
/* color: white; */
|
||||
margin: 0.5rem 0 0 0;
|
||||
}
|
||||
@@ -64,7 +67,7 @@
|
||||
|
||||
.bottomicon {
|
||||
width: 24px;
|
||||
margin-right: .5rem;
|
||||
margin-right: 0.5rem;
|
||||
color: var(--ifm-font-color-base);
|
||||
}
|
||||
|
||||
|
||||
@@ -1,17 +1,19 @@
|
||||
.card {
|
||||
border-radius: .5rem;
|
||||
border-radius: 0.5rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 200px;
|
||||
background: var(--card-background);
|
||||
padding: 1rem;
|
||||
text-decoration: none;
|
||||
transition: all .2 ease-in-out;
|
||||
transition: all 0.2 ease-in-out;
|
||||
border: 1px solid var(--card-border);
|
||||
}
|
||||
|
||||
.card:hover {
|
||||
text-decoration: none;
|
||||
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
||||
0 2px 4px -1px rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
.card p {
|
||||
@@ -25,7 +27,7 @@
|
||||
background-size: cover;
|
||||
object-fit: contain;
|
||||
background-position: center;
|
||||
padding: .5rem 0;
|
||||
padding: 0.5rem 0;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
@@ -40,7 +42,7 @@
|
||||
|
||||
.bottomicon {
|
||||
width: 24px;
|
||||
margin-right: .5rem;
|
||||
margin-right: 0.5rem;
|
||||
color: var(--ifm-font-color-base);
|
||||
}
|
||||
|
||||
@@ -68,4 +70,4 @@
|
||||
.cardWrapper {
|
||||
grid-template-columns: 1fr 1fr 1fr;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,6 +4,19 @@
|
||||
grid-gap: 1rem;
|
||||
}
|
||||
|
||||
.item {
|
||||
border-radius: 1rem;
|
||||
transition: all 0.2s ease;
|
||||
padding: 1rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.item:hover {
|
||||
border-radius: 1rem;
|
||||
box-shadow: 0 30px 60px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
@media (min-width: 1180px) {
|
||||
.column {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
|
||||
@@ -70,16 +70,17 @@
|
||||
/* You can override the default Infima variables here. */
|
||||
|
||||
:root {
|
||||
--ifm-background-color: #fafafa;
|
||||
--ifm-navbar-background-color: #ffffff;
|
||||
--ifm-footer-background-color: #f4f4f4;
|
||||
--ifm-menu-color-background-active: #7e21ce10;
|
||||
--ifm-menu-color-active: #7e21ce;
|
||||
--ifm-menu-color-background-active: #00000010;
|
||||
--ifm-menu-color-active: #000000;
|
||||
--ifm-menu-color-background-hover: #f7fafc;
|
||||
--ifm-font-color-base: #6b7280;
|
||||
--ifm-link-color: #5469d4;
|
||||
--ifm-menu-color: #697386;
|
||||
--ifm-footer-link-color: #000000;
|
||||
--ifm-color-primary: #7e21ce;
|
||||
--ifm-color-primary: #5469d4;
|
||||
--ifm-color-primary-dark: #4d61cf;
|
||||
--ifm-color-primary-darker: #4356c9;
|
||||
--ifm-color-primary-darkest: #3a4cc3; /* 293bb9 */
|
||||
@@ -88,7 +89,7 @@
|
||||
--ifm-color-primary-lightest: #aab4ea;
|
||||
--ifm-code-font-size: 95%;
|
||||
--ifm-font-family-base: "Lato", sans-serif;
|
||||
--ifm-hero-background-color: var(--ifm-color-primary);
|
||||
--ifm-hero-background-color: #7e21ce;
|
||||
--ifm-hero-text-color: var(--ifm-font-color-base-inverse);
|
||||
--get-started: #ff2069;
|
||||
--get-started-bg-hover: var(--ifm-hero-background-color);
|
||||
@@ -99,7 +100,8 @@
|
||||
--ifm-footer-padding-vertical: 50px;
|
||||
--ifm-heading-font-weight: 500;
|
||||
--ifm-heading-color: #000000;
|
||||
--ifm-font-color-base: #6b7280;
|
||||
--ifm-font-color-base: #000000dd; /*#6b7280;*/
|
||||
--font-color-strong: #000000;
|
||||
--ifm-navbar-link-hover-color: #000000;
|
||||
--ifm-heading-color: #000000;
|
||||
--ifm-color-success-contrast-foreground: #0e6245;
|
||||
@@ -113,7 +115,7 @@
|
||||
--ifm-color-warning-contrast-background: #ffc1c1;
|
||||
--ifm-color-warning-contrast-foreground: #620e0e;
|
||||
--card-background: #fafafa;
|
||||
--list-background: #f7fafc;
|
||||
--list-background: #ffffff;
|
||||
--ifm-spacing-horizontal: 1.5rem;
|
||||
--apiauthbackground: linear-gradient(40deg, #a9d9ca 30%, #b4d5cb);
|
||||
--apimgmtbackground: linear-gradient(40deg, #c6d7f3 30%, #c7c6e3);
|
||||
@@ -124,6 +126,9 @@
|
||||
--ifm-hero-text-color: #ffffff;
|
||||
--gigibannerbackground: white;
|
||||
--gigibannerforeground: black;
|
||||
--footer-border: rgba(0, 0, 0, 0.12);
|
||||
--card-border: rgba(135, 149, 161, 0.2);
|
||||
--ifm-pagination-nav-color-hover: #000000;
|
||||
}
|
||||
|
||||
.get-started {
|
||||
@@ -163,7 +168,7 @@
|
||||
}
|
||||
|
||||
:root[data-theme="dark"] .navbar:not(.navbar-sidebar--show) {
|
||||
background-color: #15173580;
|
||||
background-color: rgba(var(--ifm-background-color, 0.2));
|
||||
backdrop-filter: saturate(110%) blur(5px);
|
||||
}
|
||||
|
||||
@@ -233,22 +238,20 @@ h2 {
|
||||
}
|
||||
|
||||
:root[data-theme="dark"] {
|
||||
/* --ifm-menu-color-active: #ffd0df; */
|
||||
/* 6e80da */
|
||||
--ifm-navbar-background-color: #1b2036;
|
||||
--ifm-footer-background-color: #121430;
|
||||
--ifm-navbar-background-color: #1b2036; /*#141c2d;*/
|
||||
--ifm-footer-background-color: #00000020; /* #121430; */
|
||||
--ifm-menu-color-background-active: #ffffff10;
|
||||
--ifm-menu-color-active: #ffffff;
|
||||
--ifm-menu-color-background-hover: #3c405850;
|
||||
--ifm-font-color-base: #dddddd;
|
||||
--ifm-menu-color: #dddddd;
|
||||
--ifm-menu-color: #c1c9d2;
|
||||
--ifm-link-color: #ff2069;
|
||||
--docsearch-searchbox-background: #454a66;
|
||||
--docsearch-searchbox-focus-background: #454a66;
|
||||
--docsearch-searchbox-shadow: inset 0 0 0 1px var(--docsearch-primary-color);
|
||||
--docsearch-hit-background: #454a66;
|
||||
--docsearch-highlight-color: #5469d4;
|
||||
--ifm-navbar-shadow: inset 0 -1px #303031;
|
||||
--ifm-navbar-shadow: inset 0 -1px rgba(255, 255, 255, 0.12);
|
||||
--ifm-footer-link-color: #ffffff;
|
||||
--ifm-color-emphasis-300: #ffffff20;
|
||||
--ifm-color-primary: #ff2069;
|
||||
@@ -258,29 +261,33 @@ h2 {
|
||||
--ifm-color-primary-light: #ff4180;
|
||||
--ifm-color-primary-lighter: #ff6396;
|
||||
--ifm-color-primary-lightest: #ff90b4;
|
||||
--ifm-background-color: #141735;
|
||||
--ifm-background-color: #141735; /* #141c2d; */
|
||||
--ifm-hero-background-color: #0f1022;
|
||||
--ifm-hero-text-color: #ffffff;
|
||||
--get-started-bg: var(--ifm-font-color-base);
|
||||
--get-started: #ff1f69;
|
||||
--ifm-footer-color: #ffffff50;
|
||||
--ifm-heading-color: #ffffff;
|
||||
--ifm-font-color-base: #c1c9d2;
|
||||
--ifm-font-color-base: #ffffffdd; /* #c1c9d2; */
|
||||
--font-color-strong: #ffffff;
|
||||
--ifm-navbar-link-hover-color: #ffffff;
|
||||
--ifm-color-success-contrast-foreground: #cbf4c9;
|
||||
--ifm-color-success-contrast-background: #4f566b;
|
||||
--ifm-color-success-dark: #cbf4c9;
|
||||
--ifm-color-info-dark: #6c8eef;
|
||||
--ifm-color-info-contrast-background: #3c4257;
|
||||
--ifm-table-stripe-background: #3c4257;
|
||||
--ifm-table-stripe-background: #1a253c; /* #1a1d46; */
|
||||
--ifm-color-secondary-contrast-background: #3c4257;
|
||||
--ifm-code-background: #3c4257;
|
||||
--ifm-alert-background-color-highlight: #ffc1c1;
|
||||
--ifm-alert-background-color: #92400e50;
|
||||
--ifm-alert-background-color-highlight: #fbbf24;
|
||||
--ifm-color-warning-contrast-background: #92400e50;
|
||||
--ifm-color-warning-contrast-foreground: #fbbf24;
|
||||
--ifm-color-warning-dark: #4f566b;
|
||||
--ifm-color-warning-contrast-background: #4f566b;
|
||||
--ifm-color-warning-contrast-foreground: #ffc1c1;
|
||||
--card-background: #454a66;
|
||||
--list-background: #3c405850;
|
||||
--ifm-toc-border-color: rgba(135, 149, 161, 0.2);
|
||||
--ifm-table-border-color: rgba(135, 149, 161, 0.2);
|
||||
--card-background: #1a253c; /* #1a1d46; */
|
||||
--list-background: #1a253c; /* #1a1d46; */
|
||||
--apiauthbackground: linear-gradient(40deg, #506e6e90 30%, #506e6e90);
|
||||
--apimgmtbackground: linear-gradient(40deg, #595d8090 30%, #595d8090);
|
||||
--apiadminbackground: linear-gradient(40deg, #6a506e90, #6a506e90);
|
||||
@@ -289,6 +296,9 @@ h2 {
|
||||
--overlaycolor: #ffffff15;
|
||||
--gigibannerbackground: #7e21ce;
|
||||
--gigibannerforeground: white;
|
||||
--footer-border: rgba(255, 255, 255, 0.12);
|
||||
--card-border: rgba(135, 149, 161, 0.2);
|
||||
--ifm-pagination-nav-color-hover: #ffffff;
|
||||
}
|
||||
|
||||
.get-started:hover {
|
||||
@@ -307,6 +317,8 @@ i {
|
||||
|
||||
main .container img {
|
||||
border-radius: 0.5rem;
|
||||
margin: 1.5rem 0;
|
||||
box-shadow: 0 30px 60px rgba(0, 0, 0, 0.12);
|
||||
}
|
||||
|
||||
.rounded {
|
||||
@@ -453,3 +465,29 @@ main .container img {
|
||||
.footer__link-item svg {
|
||||
margin-left: 0.5rem;
|
||||
}
|
||||
|
||||
.footer {
|
||||
border-top: 1px solid var(--footer-border);
|
||||
}
|
||||
|
||||
table th {
|
||||
padding: 0.5rem 1rem;
|
||||
text-transform: uppercase;
|
||||
font-size: 12px;
|
||||
letter-spacing: 0.05em;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
a {
|
||||
transition: all 1s ease;
|
||||
}
|
||||
|
||||
.alert {
|
||||
font-size: 14px;
|
||||
border: none;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
p strong {
|
||||
color: var(--font-color-strong);
|
||||
}
|
||||
|
||||
@@ -2,10 +2,10 @@
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
padding: .5rem 0;
|
||||
padding: 0.5rem 0;
|
||||
text-decoration: none;
|
||||
transition: all .2 ease-in-out;
|
||||
margin: .5rem 0;
|
||||
transition: all 0.2 ease-in-out;
|
||||
margin: 0.5rem 0;
|
||||
}
|
||||
|
||||
.listelement:hover {
|
||||
@@ -28,7 +28,7 @@
|
||||
}
|
||||
|
||||
.icon {
|
||||
padding: .5rem 1rem .5rem .5rem;
|
||||
padding: 0.5rem 1rem 0.5rem 0.5rem;
|
||||
}
|
||||
|
||||
.listlabel {
|
||||
@@ -41,12 +41,13 @@
|
||||
background: var(--list-background);
|
||||
border-radius: 1rem;
|
||||
padding: 1rem;
|
||||
border: 1px solid var(--card-border);
|
||||
}
|
||||
|
||||
.listWrapperTitle {
|
||||
color: var(--ifm-heading-color);
|
||||
font-size: 16px;
|
||||
margin-bottom: .5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
display: block;
|
||||
}
|
||||
|
||||
@@ -62,4 +63,4 @@
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -74,6 +74,7 @@
|
||||
height: 70px;
|
||||
width: 70px;
|
||||
margin: 1rem 1rem 1rem 0 !important;
|
||||
border-radius: 50% !important;
|
||||
}
|
||||
|
||||
.homelink:hover,
|
||||
@@ -103,6 +104,7 @@
|
||||
align-items: center;
|
||||
background: var(--list-background);
|
||||
border-radius: 1rem;
|
||||
border: 1px solid var(--card-border);
|
||||
}
|
||||
|
||||
.quickstart p {
|
||||
|
||||
Reference in New Issue
Block a user