mirror of
https://github.com/zitadel/zitadel.git
synced 2024-12-29 19:17:49 +00:00
0a2e6dcfb3
* chore(deps-dev): bump eslint from 8.46.0 to 8.50.0 in /console (#6618) Bumps [eslint](https://github.com/eslint/eslint) from 8.46.0 to 8.50.0. - [Release notes](https://github.com/eslint/eslint/releases) - [Changelog](https://github.com/eslint/eslint/blob/main/CHANGELOG.md) - [Commits](https://github.com/eslint/eslint/compare/v8.46.0...v8.50.0) --- updated-dependencies: - dependency-name: eslint dependency-type: direct:development update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps-dev): bump @types/node from 18.16.10 to 20.6.5 in /console (#6617) Bumps [@types/node](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/node) from 18.16.10 to 20.6.5. - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/node) --- updated-dependencies: - dependency-name: "@types/node" dependency-type: direct:development update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps): bump protobufjs from 7.2.3 to 7.2.5 in /console (#6584) Bumps [protobufjs](https://github.com/protobufjs/protobuf.js) from 7.2.3 to 7.2.5. - [Release notes](https://github.com/protobufjs/protobuf.js/releases) - [Changelog](https://github.com/protobufjs/protobuf.js/blob/master/CHANGELOG.md) - [Commits](https://github.com/protobufjs/protobuf.js/compare/protobufjs-v7.2.3...protobufjs-v7.2.5) --- updated-dependencies: - dependency-name: protobufjs dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: Max Peintner <max@caos.ch> * chore(deps-dev): bump @types/jasmine from 4.3.5 to 4.3.6 in /console (#6581) Bumps [@types/jasmine](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/jasmine) from 4.3.5 to 4.3.6. - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/jasmine) --- updated-dependencies: - dependency-name: "@types/jasmine" dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps): bump @grpc/grpc-js from 1.8.14 to 1.9.3 in /console (#6578) Bumps [@grpc/grpc-js](https://github.com/grpc/grpc-node) from 1.8.14 to 1.9.3. - [Release notes](https://github.com/grpc/grpc-node/releases) - [Commits](https://github.com/grpc/grpc-node/compare/@grpc/grpc-js@1.8.14...@grpc/grpc-js@1.9.3) --- updated-dependencies: - dependency-name: "@grpc/grpc-js" dependency-type: direct:production update-type: version-update:semver-minor ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps-dev): bump @types/qrcode from 1.5.0 to 1.5.2 in /console (#6477) Bumps [@types/qrcode](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/HEAD/types/qrcode) from 1.5.0 to 1.5.2. - [Release notes](https://github.com/DefinitelyTyped/DefinitelyTyped/releases) - [Commits](https://github.com/DefinitelyTyped/DefinitelyTyped/commits/HEAD/types/qrcode) --- updated-dependencies: - dependency-name: "@types/qrcode" dependency-type: direct:development update-type: version-update:semver-patch ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps-dev): bump prettier from 2.8.8 to 3.0.3 in /console (#6476) Bumps [prettier](https://github.com/prettier/prettier) from 2.8.8 to 3.0.3. - [Release notes](https://github.com/prettier/prettier/releases) - [Changelog](https://github.com/prettier/prettier/blob/main/CHANGELOG.md) - [Commits](https://github.com/prettier/prettier/compare/2.8.8...3.0.3) --- updated-dependencies: - dependency-name: prettier dependency-type: direct:development update-type: version-update:semver-major ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps): bump socket.io-parser from 4.2.2 to 4.2.4 in /console (#6376) Bumps [socket.io-parser](https://github.com/socketio/socket.io-parser) from 4.2.2 to 4.2.4. - [Release notes](https://github.com/socketio/socket.io-parser/releases) - [Changelog](https://github.com/socketio/socket.io-parser/blob/main/CHANGELOG.md) - [Commits](https://github.com/socketio/socket.io-parser/compare/4.2.2...4.2.4) --- updated-dependencies: - dependency-name: socket.io-parser dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * chore(deps): bump semver from 5.7.1 to 5.7.2 in /console (#6375) Bumps [semver](https://github.com/npm/node-semver) from 5.7.1 to 5.7.2. - [Release notes](https://github.com/npm/node-semver/releases) - [Changelog](https://github.com/npm/node-semver/blob/v5.7.2/CHANGELOG.md) - [Commits](https://github.com/npm/node-semver/compare/v5.7.1...v5.7.2) --- updated-dependencies: - dependency-name: semver dependency-type: indirect ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> * lint * node types * use node 20 --------- Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
637 lines
19 KiB
SCSS
637 lines
19 KiB
SCSS
@use '@angular/material' as mat;
|
|
|
|
@import 'codemirror/lib/codemirror.css';
|
|
@import './component-themes';
|
|
@import './styles/lato-font.scss';
|
|
@import '@angular/material/theming';
|
|
@import '/node_modules/flag-icons/css/flag-icons.min.css';
|
|
|
|
$material-design-icons-font-directory-path: '~material-design-icons-iconfont/dist/fonts/';
|
|
|
|
@import 'material-design-icons-iconfont/src/material-design-icons.scss';
|
|
|
|
@font-face {
|
|
font-family: ailerons;
|
|
font-display: auto;
|
|
src: url(./assets/ailerons.otf) format('opentype');
|
|
}
|
|
|
|
:root {
|
|
--grey: #8795a1;
|
|
--warn: #ff3b5b;
|
|
--success: #10b981;
|
|
--table-row-back: #363738;
|
|
}
|
|
|
|
$caos-dark-primary: (
|
|
50: var(--theme-dark-primary-50),
|
|
100: var(--theme-dark-primary-100),
|
|
200: var(--theme-dark-primary-200),
|
|
300: var(--theme-dark-primary-300),
|
|
400: var(--theme-dark-primary-400),
|
|
500: var(--theme-dark-primary-500),
|
|
600: var(--theme-dark-primary-600),
|
|
700: var(--theme-dark-primary-700),
|
|
800: var(--theme-dark-primary-800),
|
|
900: var(--theme-dark-primary-900),
|
|
A100: var(--theme-dark-primary-A100),
|
|
A200: var(--theme-dark-primary-A200),
|
|
A400: var(--theme-dark-primary-A400),
|
|
A700: var(--theme-dark-primary-A700),
|
|
contrast: (
|
|
50: var(--theme-dark-primary-contrast-50),
|
|
100: var(--theme-dark-primary-contrast-100),
|
|
200: var(--theme-dark-primary-contrast-200),
|
|
300: var(--theme-dark-primary-contrast-300),
|
|
400: var(--theme-dark-primary-contrast-400),
|
|
500: var(--theme-dark-primary-contrast-500),
|
|
600: var(--theme-dark-primary-contrast-600),
|
|
700: var(--theme-dark-primary-contrast-700),
|
|
800: var(--theme-dark-primary-contrast-800),
|
|
900: var(--theme-dark-primary-contrast-900),
|
|
A100: var(--theme-dark-primary-contrast-A100),
|
|
A200: var(--theme-dark-primary-contrast-A200),
|
|
A400: var(--theme-dark-primary-contrast-A400),
|
|
A700: var(--theme-dark-primary-contrast-A700),
|
|
),
|
|
);
|
|
|
|
$caos-light-primary: (
|
|
50: var(--theme-light-primary-50),
|
|
100: var(--theme-light-primary-100),
|
|
200: var(--theme-light-primary-200),
|
|
300: var(--theme-light-primary-300),
|
|
400: var(--theme-light-primary-400),
|
|
500: var(--theme-light-primary-500),
|
|
600: var(--theme-light-primary-600),
|
|
700: var(--theme-light-primary-700),
|
|
800: var(--theme-light-primary-800),
|
|
900: var(--theme-light-primary-900),
|
|
A100: var(--theme-light-primary-A100),
|
|
A200: var(--theme-light-primary-A200),
|
|
A400: var(--theme-light-primary-A400),
|
|
A700: var(--theme-light-primary-A700),
|
|
contrast: (
|
|
50: var(--theme-light-primary-contrast-50),
|
|
100: var(--theme-light-primary-contrast-100),
|
|
200: var(--theme-light-primary-contrast-200),
|
|
300: var(--theme-light-primary-contrast-300),
|
|
400: var(--theme-light-primary-contrast-400),
|
|
500: var(--theme-light-primary-contrast-500),
|
|
600: var(--theme-light-primary-contrast-600),
|
|
700: var(--theme-light-primary-contrast-700),
|
|
800: var(--theme-light-primary-contrast-800),
|
|
900: var(--theme-light-primary-contrast-900),
|
|
A100: var(--theme-light-primary-contrast-A100),
|
|
A200: var(--theme-light-primary-contrast-A200),
|
|
A400: var(--theme-light-primary-contrast-A400),
|
|
A700: var(--theme-light-primary-contrast-A700),
|
|
),
|
|
);
|
|
|
|
$caos-dark-background: (
|
|
50: var(--theme-dark-background-50),
|
|
100: var(--theme-dark-background-100),
|
|
200: var(--theme-dark-background-200),
|
|
300: var(--theme-dark-background-300),
|
|
400: var(--theme-dark-background-400),
|
|
500: var(--theme-dark-background-500),
|
|
600: var(--theme-dark-background-600),
|
|
700: var(--theme-dark-background-700),
|
|
800: var(--theme-dark-background-800),
|
|
900: var(--theme-dark-background-900),
|
|
A100: var(--theme-dark-background-A100),
|
|
A200: var(--theme-dark-background-A200),
|
|
A400: var(--theme-dark-background-A400),
|
|
A700: var(--theme-dark-background-A700),
|
|
contrast: (
|
|
50: var(--theme-dark-background-contrast-50),
|
|
100: var(--theme-dark-background-contrast-100),
|
|
200: var(--theme-dark-background-contrast-200),
|
|
300: var(--theme-dark-background-contrast-300),
|
|
400: var(--theme-dark-background-contrast-400),
|
|
500: var(--theme-dark-background-contrast-500),
|
|
600: var(--theme-dark-background-contrast-600),
|
|
700: var(--theme-dark-background-contrast-700),
|
|
800: var(--theme-dark-background-contrast-800),
|
|
900: var(--theme-dark-background-contrast-900),
|
|
A100: var(--theme-dark-background-contrast-A100),
|
|
A200: var(--theme-dark-background-contrast-A200),
|
|
A400: var(--theme-dark-background-contrast-A400),
|
|
A700: var(--theme-dark-background-contrast-A700),
|
|
),
|
|
);
|
|
|
|
$caos-light-background: (
|
|
50: var(--theme-light-background-50),
|
|
100: var(--theme-light-background-100),
|
|
200: var(--theme-light-background-200),
|
|
300: var(--theme-light-background-300),
|
|
400: var(--theme-light-background-400),
|
|
500: var(--theme-light-background-500),
|
|
600: var(--theme-light-background-600),
|
|
700: var(--theme-light-background-700),
|
|
800: var(--theme-light-background-800),
|
|
900: var(--theme-light-background-900),
|
|
A100: var(--theme-light-background-A100),
|
|
A200: var(--theme-light-background-A200),
|
|
A400: var(--theme-light-background-A400),
|
|
A700: var(--theme-light-background-A700),
|
|
contrast: (
|
|
50: var(--theme-light-background-contrast-50),
|
|
100: var(--theme-light-background-contrast-100),
|
|
200: var(--theme-light-background-contrast-200),
|
|
300: var(--theme-light-background-contrast-300),
|
|
400: var(--theme-light-background-contrast-400),
|
|
500: var(--theme-light-background-contrast-500),
|
|
600: var(--theme-light-background-contrast-600),
|
|
700: var(--theme-light-background-contrast-700),
|
|
800: var(--theme-light-background-contrast-800),
|
|
900: var(--theme-light-background-contrast-900),
|
|
A100: var(--theme-light-background-contrast-A100),
|
|
A200: var(--theme-light-background-contrast-A200),
|
|
A400: var(--theme-light-background-contrast-A400),
|
|
A700: var(--theme-light-background-contrast-A700),
|
|
),
|
|
);
|
|
|
|
$caos-dark-warn: (
|
|
50: var(--theme-dark-warn-50),
|
|
100: var(--theme-dark-warn-100),
|
|
200: var(--theme-dark-warn-200),
|
|
300: var(--theme-dark-warn-300),
|
|
400: var(--theme-dark-warn-400),
|
|
500: var(--theme-dark-warn-500),
|
|
600: var(--theme-dark-warn-600),
|
|
700: var(--theme-dark-warn-700),
|
|
800: var(--theme-dark-warn-800),
|
|
900: var(--theme-dark-warn-900),
|
|
A100: var(--theme-dark-warn-A100),
|
|
A200: var(--theme-dark-warn-A200),
|
|
A400: var(--theme-dark-warn-A400),
|
|
A700: var(--theme-dark-warn-A700),
|
|
contrast: (
|
|
50: var(--theme-dark-warn-contrast-50),
|
|
100: var(--theme-dark-warn-contrast-100),
|
|
200: var(--theme-dark-warn-contrast-200),
|
|
300: var(--theme-dark-warn-contrast-300),
|
|
400: var(--theme-dark-warn-contrast-400),
|
|
500: var(--theme-dark-warn-contrast-500),
|
|
600: var(--theme-dark-warn-contrast-600),
|
|
700: var(--theme-dark-warn-contrast-700),
|
|
800: var(--theme-dark-warn-contrast-800),
|
|
900: var(--theme-dark-warn-contrast-900),
|
|
A100: var(--theme-dark-warn-contrast-A100),
|
|
A200: var(--theme-dark-warn-contrast-A200),
|
|
A400: var(--theme-dark-warn-contrast-A400),
|
|
A700: var(--theme-dark-warn-contrast-A700),
|
|
),
|
|
);
|
|
|
|
$caos-light-warn: (
|
|
50: var(--theme-light-warn-50),
|
|
100: var(--theme-light-warn-100),
|
|
200: var(--theme-light-warn-200),
|
|
300: var(--theme-light-warn-300),
|
|
400: var(--theme-light-warn-400),
|
|
500: var(--theme-light-warn-500),
|
|
600: var(--theme-light-warn-600),
|
|
700: var(--theme-light-warn-700),
|
|
800: var(--theme-light-warn-800),
|
|
900: var(--theme-light-warn-900),
|
|
A100: var(--theme-light-warn-A100),
|
|
A200: var(--theme-light-warn-A200),
|
|
A400: var(--theme-light-warn-A400),
|
|
A700: var(--theme-light-warn-A700),
|
|
contrast: (
|
|
50: var(--theme-light-warn-contrast-50),
|
|
100: var(--theme-light-warn-contrast-100),
|
|
200: var(--theme-light-warn-contrast-200),
|
|
300: var(--theme-light-warn-contrast-300),
|
|
400: var(--theme-light-warn-contrast-400),
|
|
500: var(--theme-light-warn-contrast-500),
|
|
600: var(--theme-light-warn-contrast-600),
|
|
700: var(--theme-light-warn-contrast-700),
|
|
800: var(--theme-light-warn-contrast-800),
|
|
900: var(--theme-light-warn-contrast-900),
|
|
A100: var(--theme-light-warn-contrast-A100),
|
|
A200: var(--theme-light-warn-contrast-A200),
|
|
A400: var(--theme-light-warn-contrast-A400),
|
|
A700: var(--theme-light-warn-contrast-A700),
|
|
),
|
|
);
|
|
|
|
$caos-dark-theme-text: var(--theme-dark-text);
|
|
$caos-light-theme-text: var(--theme-light-text);
|
|
|
|
$caos-dark-theme-secondary-text: var(--theme-dark-secondary-text);
|
|
$caos-light-theme-secondary-text: var(--theme-light-secondary-text);
|
|
|
|
$caos-dark-theme-background: (
|
|
status-bar: map_get($caos-dark-background, 300),
|
|
app-bar: map_get($caos-dark-background, 500),
|
|
background: map_get($caos-dark-background, 500),
|
|
hover: rgba(black, 0.04),
|
|
card: #222,
|
|
// set fixed color due to https://github.com/angular/components/pull/14253
|
|
// change where a scss mix function can't use a css var
|
|
cards: map_get($caos-dark-background, 400),
|
|
cardhovered: map_get($caos-dark-background, 300),
|
|
contributor: map_get($caos-dark-background, 400),
|
|
contributor-avatar: map_get($caos-dark-background, 300),
|
|
dialog: map_get($caos-dark-background, 500),
|
|
disabled-button: rgba(black, 0.12),
|
|
raised-button: white,
|
|
focused-button: $dark-focused,
|
|
selected-button: map_get($caos-dark-background, 300),
|
|
selected-disabled-button: map_get($caos-dark-background, 400),
|
|
disabled-button-toggle: map_get($caos-dark-background, 200),
|
|
unselected-chip: map_get($caos-dark-background, 300),
|
|
disabled-list-option: map_get($caos-dark-background, 200),
|
|
tooltip: map_get($mat-gray, 700),
|
|
infosection: map_get($caos-dark-background, 300),
|
|
warninfosection: #741f2c4a,
|
|
alertinfosection: #92400e50,
|
|
successinfosection: map_get($caos-dark-background, 300),
|
|
state: map_get($caos-dark-background, 300),
|
|
state-active: #68cf8340,
|
|
state-inactive: #af455359,
|
|
toolbar: rgba(map_get($caos-dark-background, 500), 0.9),
|
|
moz-toolbar: map_get($caos-dark-background, 500),
|
|
footer: #00000020,
|
|
metadata-section: #00000020,
|
|
alert: #fbbf24,
|
|
);
|
|
|
|
$caos-light-theme-background: (
|
|
status-bar: map_get($caos-light-background, 300),
|
|
app-bar: map_get($caos-light-background, 100),
|
|
background: map_get($caos-light-background, 500),
|
|
hover: rgba(black, 0.04),
|
|
contributor: #00000010,
|
|
contributor-avatar: map_get($caos-light-primary, 300),
|
|
card: #fff,
|
|
// set fixed color due to https://github.com/angular/components/pull/14253
|
|
// change where a scss mix function can't use a css var
|
|
cards: map_get($caos-light-background, 400),
|
|
cardhovered: map_get($caos-light-background, 300),
|
|
dialog: map_get($caos-light-background, 500),
|
|
disabled-button: rgba(black, 0.12),
|
|
raised-button: white,
|
|
focused-button: $light-focused,
|
|
selected-button: map_get($caos-light-background, 300),
|
|
selected-disabled-button: map_get($caos-light-background, 400),
|
|
disabled-button-toggle: map_get($caos-light-background, 200),
|
|
unselected-chip: map_get($caos-light-background, 300),
|
|
disabled-list-option: map_get($caos-light-background, 200),
|
|
tooltip: map_get($mat-gray, 700),
|
|
infosection: map_get($caos-light-background, 600),
|
|
warninfosection: #ffc1c1,
|
|
alertinfosection: rgb(251, 191, 36),
|
|
successinfosection: #cbf4c9,
|
|
toolbar: rgba(map_get($caos-light-background, 500), 0.9),
|
|
moz-toolbar: map_get($caos-light-background, 500),
|
|
footer: #00000008,
|
|
metadata-section: #605f5f08,
|
|
alert: rgb(251, 191, 36),
|
|
);
|
|
|
|
$caos-dark-theme-foreground: (
|
|
base: white,
|
|
divider: $light-dividers,
|
|
dividers: $light-dividers,
|
|
disabled: $light-disabled-text,
|
|
disabled-button: rgba(white, 0.26),
|
|
disabled-text: $light-disabled-text,
|
|
elevation: black,
|
|
hint-text: $light-disabled-text,
|
|
secondary-text: $caos-dark-theme-secondary-text,
|
|
placeholder-text: rgba(white, 0.4),
|
|
icon: rgba(white, 0.54),
|
|
icons: rgba(white, 0.54),
|
|
text: $caos-dark-theme-text,
|
|
slider-min: rgba(white, 0.87),
|
|
slider-off: rgba(white, 0.26),
|
|
slider-off-active: rgba(white, 0.38),
|
|
infosection: #f0f0f0,
|
|
warninfosection: #ffc1c1,
|
|
alertinfosection: rgb(251, 191, 36),
|
|
successinfosection: #cbf4c9,
|
|
toolbar-items: map-get(map-get($caos-dark-primary, contrast), 500),
|
|
slash: #ffffff6e,
|
|
);
|
|
|
|
$caos-light-theme-foreground: (
|
|
base: black,
|
|
divider: $dark-dividers,
|
|
dividers: $dark-dividers,
|
|
disabled: $dark-disabled-text,
|
|
disabled-button: rgba(black, 0.26),
|
|
disabled-text: $dark-disabled-text,
|
|
elevation: black,
|
|
hint-text: $dark-disabled-text,
|
|
secondary-text: $caos-light-theme-secondary-text,
|
|
placeholder-text: rgba(black, 0.3),
|
|
icon: rgba(black, 0.54),
|
|
icons: rgba(black, 0.54),
|
|
text: $caos-light-theme-text,
|
|
slider-min: rgba(black, 0.87),
|
|
slider-off: rgba(black, 0.26),
|
|
slider-off-active: rgba(black, 0.38),
|
|
infosection: map-get(map-get($caos-light-background, contrast), 600),
|
|
warninfosection: #620e0e,
|
|
alertinfosection: rgb(146, 64, 14),
|
|
successinfosection: #0e6245,
|
|
toolbar-items: map-get(map-get($caos-light-primary, contrast), 500),
|
|
slash: #0000006e,
|
|
);
|
|
|
|
$caos-dark-app-theme: (
|
|
primary: mat-palette($caos-dark-primary),
|
|
accent: mat-palette($caos-dark-primary),
|
|
warn: mat-palette($caos-dark-warn),
|
|
is-dark: true,
|
|
foreground: $caos-dark-theme-foreground,
|
|
background: $caos-dark-theme-background,
|
|
);
|
|
|
|
$caos-light-app-theme: (
|
|
primary: mat-palette($caos-light-primary),
|
|
accent: mat-palette($caos-light-primary),
|
|
warn: mat-palette($caos-light-warn),
|
|
is-dark: false,
|
|
foreground: $caos-light-theme-foreground,
|
|
background: $caos-light-theme-background,
|
|
);
|
|
|
|
$custom-typography: mat.define-legacy-typography-config(
|
|
$font-family: 'Lato',
|
|
);
|
|
|
|
@include mat.all-legacy-component-typographies($custom-typography);
|
|
@include mat.legacy-core();
|
|
|
|
.mat-dialog-container,
|
|
.mat-raised-button,
|
|
.mat-stroked-button {
|
|
border-radius: 6px !important;
|
|
}
|
|
|
|
.mat-menu-item {
|
|
line-height: 35px !important;
|
|
height: 35px !important;
|
|
}
|
|
|
|
.cnsl-action-button {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
&.mat-raised-button,
|
|
&.mat-stroked-button {
|
|
padding-left: 0.5rem;
|
|
height: 36px;
|
|
|
|
.mat-button-wrapper {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
i:not(.no-margin) {
|
|
margin-right: 0.25rem;
|
|
font-size: 1.3rem;
|
|
}
|
|
|
|
.mat-icon {
|
|
margin-right: 0.25rem;
|
|
}
|
|
}
|
|
}
|
|
|
|
.mat-calendar-table {
|
|
height: 280px;
|
|
}
|
|
|
|
@include component-themes($caos-dark-app-theme);
|
|
@include mat.all-legacy-component-themes($caos-dark-app-theme);
|
|
|
|
.light-theme {
|
|
@include component-themes($caos-light-app-theme);
|
|
@include mat.all-legacy-component-themes($caos-light-app-theme);
|
|
|
|
$background: map-get($caos-light-app-theme, background);
|
|
$foreground: map-get($caos-light-app-theme, foreground);
|
|
|
|
--warn: #cd3d56;
|
|
--success: #10b981;
|
|
$border-color: map-get($foreground, divider);
|
|
|
|
.mat-menu-panel {
|
|
background-color: map-get($background, cards);
|
|
transition: background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
border-radius: 6px;
|
|
min-height: fit-content;
|
|
}
|
|
|
|
.mat-option {
|
|
background-color: map-get($background, cards);
|
|
|
|
&:hover {
|
|
background-color: map-get($background, cardhovered);
|
|
}
|
|
}
|
|
|
|
.mat-button-toggle-group-appearance-standard {
|
|
border-color: map-get($foreground, divider);
|
|
}
|
|
|
|
.mat-button-toggle {
|
|
background-color: mat.get-color-from-palette($background, cards);
|
|
transition: background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
transition: border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
|
|
&.mat-button-toggle-checked {
|
|
background-color: #00000010;
|
|
}
|
|
}
|
|
|
|
.main-container,
|
|
.mat-dialog-container,
|
|
.mat-calendar {
|
|
background-color: map-get($background, background);
|
|
transition: background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
|
box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
|
|
background-color: map-get($background, background);
|
|
border-radius: 8px;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
background-color: map-get($background, background);
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: #737c8850;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.root-header {
|
|
box-shadow: inset 0 -1px map-get($caos-light-theme-foreground, divider);
|
|
}
|
|
}
|
|
|
|
.dark-theme {
|
|
$background: map-get($caos-dark-app-theme, background);
|
|
$foreground: map-get($caos-dark-app-theme, foreground);
|
|
|
|
--warn: #ff3b5b;
|
|
--success: #10b981;
|
|
$border-color: map-get($foreground, divider);
|
|
|
|
.main-container {
|
|
color: map-get($foreground, text);
|
|
}
|
|
|
|
.mat-menu-panel {
|
|
background-color: map-get($background, cards);
|
|
transition: background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
border-radius: 6px;
|
|
min-height: fit-content;
|
|
}
|
|
|
|
.mat-option {
|
|
background-color: map-get($background, cards);
|
|
|
|
&:hover {
|
|
background-color: map-get($background, cardhovered);
|
|
}
|
|
}
|
|
|
|
.mat-button-toggle-group-appearance-standard {
|
|
border-color: map-get($foreground, divider);
|
|
}
|
|
|
|
.mat-button-toggle {
|
|
background-color: mat.get-color-from-palette($background, cards);
|
|
transition: background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
transition: border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
|
|
&.mat-button-toggle-checked {
|
|
background-color: mat.get-color-from-palette($background, background);
|
|
}
|
|
}
|
|
|
|
.main-container,
|
|
.mat-dialog-container,
|
|
.mat-calendar {
|
|
background-color: map-get($background, background);
|
|
transition: background-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
|
|
}
|
|
|
|
::-webkit-scrollbar-track {
|
|
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
|
|
box-shadow: 0 0 6px rgba(0, 0, 0, 0.3);
|
|
background-color: map-get($background, background);
|
|
border-radius: 8px;
|
|
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
|
|
}
|
|
|
|
::-webkit-scrollbar {
|
|
width: 6px;
|
|
height: 6px;
|
|
background-color: map-get($background, background);
|
|
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
|
|
}
|
|
|
|
::-webkit-scrollbar-thumb {
|
|
background-color: #737c8870;
|
|
border-radius: 8px;
|
|
cursor: pointer;
|
|
transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
|
|
}
|
|
|
|
.root-header {
|
|
box-shadow: inset 0 -1px map-get($caos-dark-theme-foreground, divider);
|
|
}
|
|
}
|
|
|
|
/* You can add global styles to this file, and also import other style files */
|
|
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
font-family:
|
|
'Lato',
|
|
-apple-system,
|
|
BlinkMacSystemFont,
|
|
'Segoe UI',
|
|
'Roboto',
|
|
'Oxygen',
|
|
'Ubuntu',
|
|
'Cantarell',
|
|
'Fira Sans',
|
|
'Droid Sans',
|
|
'Helvetica Neue',
|
|
sans-serif;
|
|
}
|
|
|
|
h1 {
|
|
font-weight: 400;
|
|
}
|
|
|
|
h2 {
|
|
font-size: 1.3rem;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.transparent-backdrop {
|
|
background: transparent !important;
|
|
opacity: 0;
|
|
}
|
|
|
|
.mat-paginator .mat-select {
|
|
border: none;
|
|
}
|
|
|
|
.max-width-container {
|
|
max-width: 80rem;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.max-width-description {
|
|
max-width: 50rem;
|
|
}
|
|
|
|
.enlarged-container {
|
|
padding: 2rem 0 0 0;
|
|
}
|
|
|
|
i {
|
|
font-size: 1.5rem;
|
|
}
|
|
|
|
.mat-checkbox-inner-container.mat-checkbox-inner-container-no-side-margin {
|
|
margin-right: 0.5rem !important;
|
|
}
|
|
|
|
.mat-button-toggle-button {
|
|
display: flex;
|
|
height: 36px;
|
|
line-height: 36px !important;
|
|
align-items: center;
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
.mat-button-toggle-label-content {
|
|
line-height: 36px;
|
|
}
|