mirror of
https://github.com/andwati/zitadel.git
synced 2026-10-31 03:22:15 +00:00
feat(console): MDC components (#6482)
mdc components --------- Co-authored-by: Elio Bischof <[email protected]>
This commit is contained in:
co-authored by
Elio Bischof
parent
cb7b50b513
commit
b099a26a16
@@ -5,12 +5,12 @@
|
||||
<button
|
||||
(click)="$event.stopPropagation()"
|
||||
*ngIf="hasActions"
|
||||
class="table-actions-trigger"
|
||||
mat-icon-button
|
||||
class="more-button"
|
||||
[matMenuTriggerFor]="actions"
|
||||
data-e2e="table-actions-button"
|
||||
>
|
||||
<mat-icon>more_horiz</mat-icon>
|
||||
<mat-icon>more_vert</mat-icon>
|
||||
</button>
|
||||
|
||||
<mat-menu #actions="matMenu" xPosition="before" class="table-actions-menu">
|
||||
|
||||
@@ -1,19 +1,14 @@
|
||||
@use '@angular/material' as mat;
|
||||
|
||||
@mixin table-actions-theme($theme) {
|
||||
$background: map-get($theme, background);
|
||||
$foreground: map-get($theme, foreground);
|
||||
$is-dark-theme: map-get($theme, is-dark);
|
||||
$card-background-color: mat.get-color-from-palette($background, cards);
|
||||
$card-background-color: map-get($background, cards);
|
||||
$border-color: if($is-dark-theme, rgba(#8795a1, 0.2), rgba(#8795a1, 0.2));
|
||||
|
||||
.cnsl-table-action-wrapper {
|
||||
position: relative;
|
||||
height: 36px;
|
||||
|
||||
.cnsl-table-action {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
display: flex;
|
||||
background-color: $card-background-color;
|
||||
transition: background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
||||
@@ -25,6 +20,9 @@
|
||||
box-shadow: 0 0 3px #0000001a;
|
||||
height: 36px;
|
||||
align-items: center;
|
||||
width: fit-content;
|
||||
float: right;
|
||||
overflow: hidden;
|
||||
|
||||
button {
|
||||
height: 36px;
|
||||
@@ -32,6 +30,12 @@
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&.more-button {
|
||||
font-size: 1rem;
|
||||
line-height: 1.5rem;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
button:only-of-type {
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { NgModule } from '@angular/core';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { MatIconModule } from '@angular/material/icon';
|
||||
import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
|
||||
import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
|
||||
import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
|
||||
import { MatMenuModule } from '@angular/material/menu';
|
||||
import { MatTooltipModule } from '@angular/material/tooltip';
|
||||
import { TranslateModule } from '@ngx-translate/core';
|
||||
|
||||
import { TableActionsComponent } from './table-actions.component';
|
||||
|
||||
Reference in New Issue
Block a user