feat(console): integrate frontend (#95)

* feat: console frontend

* chore(dependabot): cycle and npm

* chore: rename citadel to zitadel, remove generated files

* chore: delete go files

* chore(frontend): ci steps

* chore: remove docker and envoy files

* chore: remove docker file

* chore: working dir

* chore: run proto build

* add console start

* chore: restructure folders

* chore: remove gui build

* statikFs

* generate proto for console

* add statik import

* import

* chore: try statik

* chore: path

* chore: path

* chore: script in root

* chore: order build steps

* chore: go get

* chore: folder traversal

* chore: non empty test file

* chore: gitignore

* chore: gitignore

* chore: statik path

* chore: switch to failing FE build

* fix: build

* fix: project-grant-test

* fix: rm test

* add statik.go

* go mod tidy

* chore: place test, seperate test from build

* chore: lint all the world

* chore: ci the world instead

* chore: tune docker

* chore: undo container test

* chore: fix run

* chore: docker build

* chore: test docker build

* chore: go build flags

* finaly

* fix caos_local

* go mod

Co-authored-by: Livio Amstutz <livio.a@gmail.com>
Co-authored-by: Max Peintner <max@caos.ch>
This commit is contained in:
Florian Forster
2020-05-13 14:41:43 +02:00
committed by GitHub
parent 9e32740eb8
commit 92a294f5c8
375 changed files with 97826 additions and 52 deletions

View File

@@ -0,0 +1,41 @@
@import '~@angular/material/theming';
@mixin card-theme($theme) {
$accent: map-get($theme, accent);
$background: map-get($theme, background);
$background-color: mat-color($background, card);
$primary: map-get($theme, primary);
$primary-dark: mat-color($primary, A800);
$border-color: mat-color($primary, A700);
$border-selected-color: mat-color($primary, A600);
.card {
background-color: $primary-dark;
border: 1px solid $border-color;
box-sizing: border-box;
border-radius: .5rem;
.selection-icon {
opacity: 0;
position: absolute;
top: -12px;
left: -12px;
color: $border-color;
}
&.selected {
background-color: #ffffff25;
border: 1px solid $border-selected-color;
.text-part {
.icons {
opacity: 1;
}
}
.selection-icon {
color: $border-selected-color;
opacity: 1;
}
}
}
}

View File

@@ -0,0 +1,10 @@
@import '~@angular/material/theming';
@mixin changes-theme($theme) {
$primary: map-get($theme, primary);
$secondary-dark: mat-color($primary, A800);
.change-item-back {
background-color: $secondary-dark;
}
}

View File

@@ -0,0 +1,32 @@
@import '~@angular/material/theming';
@mixin morph-card-theme($theme) {
$accent: map-get($theme, accent);
$background: map-get($theme, background);
$background-color: mat-color($background, card);
$primary: map-get($theme, primary);
$primary-dark: mat-color($primary, A900);
$secondary-dark: mat-color($primary, A800);
$accent: map-get($theme, accent);
$accent-color: mat-color($accent, 500);
.morph-card {
cursor: pointer;
animation: all .2s;
height: 80px;
width: 80px;
margin: 1rem;
border-radius: 16px;
background: $primary-dark;
box-shadow: 5px 5px 20px rgba($color: black, $alpha: 0.5), -5px -5px 20px rgba($color: $secondary-dark, $alpha: 1);
&.add {
background: $accent-color;
box-shadow: 5px 5px 20px rgba($color: black, $alpha: 0.5), -5px -5px 20px rgba($color: $secondary-dark, $alpha: 1);
}
// &:hover {
// @include mat-elevation(5);
// }
}
}

View File

@@ -0,0 +1,50 @@
@import '~@angular/material/theming';
@mixin sidenav-list-theme($theme) {
$primary: map-get($theme, primary);
$primary-color: mat-color($primary, 500);
$primary-dark: mat-color($primary, A800);
.mat-menu-item {
&.show-all {
height: 2rem;
line-height: 2rem;
color: mat-color($primary, A700);
}
}
.nav-item {
color: inherit;
&:hover {
background-color: #00000020;
border-top-right-radius: 1.5rem;
border-bottom-right-radius: 1.5rem;
}
&.active {
color: $primary-color !important;
background-color: rgba($color: $primary-color, $alpha: 0.1) !important;
}
}
.mat-menu-content, .mat-menu-panel {
background-color: $primary-dark;
border-radius: .5rem;
@include mat-elevation(5);
.active {
color: $primary-color !important;
background-color: rgba($color: $primary-color, $alpha: 0.1) !important;
mat-icon {
color: $primary-color !important;
}
}
}
.root-header {
@include mat-elevation(3);
background: $primary-dark !important;
}
}

View File

@@ -0,0 +1,26 @@
@import '~@angular/material/theming';
@mixin table-theme($theme) {
$primary: map-get($theme, primary);
$primary-dark: mat-color($primary, A900);
$secondary-dark: mat-color($primary, A800);
$foreground: map-get($theme, foreground);
.mat-table,
mat-paginator {
background-color: $secondary-dark !important;
&.background-style {
background-color: $primary-dark !important;
}
}
.app-label {
font-size: 12px;
border-radius: 1rem;
color: mat-color($foreground, text);
white-space: nowrap;
background-color: #81868a;
padding: .5rem 1rem;
}
}