From b939d1c582be303a4dea3f005232af6e4ee8ce97 Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Tue, 14 Mar 2023 04:16:36 -0400 Subject: [PATCH] [ACS-4792] provide support for style linting (#3055) * [ACS-4792] provide support for style linting * style fixes * style fixes * style fixes * disable yarn licenses until the issue is fixed * fix package lock * fix after rebase --- .github/workflows/pull-request.yml | 1 + .stylelintrc.json | 14 + .vscode/extensions.json | 4 +- .vscode/settings.json | 9 +- Dockerfile | 6 +- cspell.json | 6 +- package-lock.json | 684 ++++++++++++++++++ package.json | 5 +- .../create-menu/create-menu.component.scss | 50 +- .../components/header/header.component.scss | 2 +- .../node-version-form.component.scss | 5 +- .../search-input-control.component.scss | 32 +- .../search-input/search-input.component.scss | 16 +- .../search-libraries-results.component.scss | 5 +- .../search-results-row.component.scss | 1 - .../search-results.component.scss | 7 +- .../components/sidenav/sidenav.component.scss | 51 +- .../view-profile/view-profile.component.scss | 9 +- .../aca-content/src/lib/ui/application.scss | 4 + projects/aca-content/src/lib/ui/colors.scss | 2 - .../aca-content/src/lib/ui/custom-theme.scss | 11 +- .../custom-background-color.scss | 4 +- .../dynamic-theme/custom-palette-creator.scss | 104 ++- .../ui/dynamic-theme/custom-text-color.scss | 2 +- .../dynamic-theme/custom-theme-palettes.scss | 10 +- .../src/lib/ui/dynamic-theme/index.scss | 2 +- .../src/lib/ui/dynamic-theme/typography.scss | 5 +- projects/aca-content/src/lib/ui/mixins.scss | 6 +- .../src/lib/ui/overrides/adf-about.theme.scss | 5 +- .../ui/overrides/adf-pagination.theme.scss | 1 - .../src/lib/ui/overrides/ay11.scss | 122 ++-- projects/aca-content/src/lib/ui/theme.scss | 2 - .../src/lib/ui/variables/variables.scss | 18 +- .../rule-action-list.ui-component.scss | 2 +- ...rule-composite-condition.ui-component.scss | 4 +- .../rule-details.ui-component.scss | 8 +- .../rule-list-item.ui-component.scss | 2 +- .../generic-error.component.scss | 1 - .../page-layout/page-layout.component.scss | 2 +- 39 files changed, 969 insertions(+), 255 deletions(-) create mode 100644 .stylelintrc.json diff --git a/.github/workflows/pull-request.yml b/.github/workflows/pull-request.yml index eee1db471b..8b03e9e1dd 100644 --- a/.github/workflows/pull-request.yml +++ b/.github/workflows/pull-request.yml @@ -48,6 +48,7 @@ jobs: cache: 'npm' - run: npm ci - run: npm run lint + - run: npm run stylelint build: name: 'build' diff --git a/.stylelintrc.json b/.stylelintrc.json new file mode 100644 index 0000000000..da4eddef0b --- /dev/null +++ b/.stylelintrc.json @@ -0,0 +1,14 @@ +{ + "extends": "stylelint-config-standard-scss", + "rules": { + "color-function-notation": "legacy", + "alpha-value-notation": "number", + "function-name-case": "lower", + "selector-class-pattern": [ + "^_?(adf|adf-|aca-|app|app-|cdk-||mat-|material-)", + { + "resolveNestedSelectors": true + } + ] + } +} diff --git a/.vscode/extensions.json b/.vscode/extensions.json index 74500bc23d..e82ffa857b 100644 --- a/.vscode/extensions.json +++ b/.vscode/extensions.json @@ -2,10 +2,10 @@ "recommendations": [ "angular.ng-template", "streetsidesoftware.code-spell-checker", - "ms-azuretools.vscode-docker", "editorconfig.editorconfig", "davidanson.vscode-markdownlint", "esbenp.prettier-vscode", - "eamodio.gitlens" + "eamodio.gitlens", + "stylelint.vscode-stylelint" ] } diff --git a/.vscode/settings.json b/.vscode/settings.json index e1bb8415a5..37bc12b954 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -9,5 +9,12 @@ }, "markdownlint.config": { "MD033": false - } + }, + "css.validate": false, + "less.validate": false, + "scss.validate": false, + "stylelint.validate": [ + "css", + "scss" + ] } diff --git a/Dockerfile b/Dockerfile index b42fad0ab4..725fed455f 100644 --- a/Dockerfile +++ b/Dockerfile @@ -4,9 +4,9 @@ FROM node:16.13-alpine3.14 AS builder WORKDIR /usr/src/alfresco COPY package.json package.json -RUN mkdir -p ./licenses && \ - yarn licenses list > ./licenses/licenses.txt && \ - yarn licenses generate-disclaimer > ./licenses/disclaimer.txt +# RUN mkdir -p ./licenses && \ +# yarn licenses list --production > ./licenses/licenses.txt && \ +# yarn licenses generate-disclaimer --production > ./licenses/disclaimer.txt # 2. Generate image diff --git a/cspell.json b/cspell.json index 59e7d65834..898ad31109 100644 --- a/cspell.json +++ b/cspell.json @@ -1,6 +1,10 @@ { - "version": "0.1", + "version": "0.2", "language": "en", + "ignorePaths": [ + ".*", + "package.json" + ], "words": [ "ADDFEATURES", "afts", diff --git a/package-lock.json b/package-lock.json index e9233ebe9e..7323092e1a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4016,6 +4016,24 @@ } } }, + "@csstools/css-parser-algorithms": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-2.0.1.tgz", + "integrity": "sha512-B9/8PmOtU6nBiibJg0glnNktQDZ3rZnGn/7UmDfrm2vMtrdlXO3p7ErE95N0up80IRk9YEtB5jyj/TmQ1WH3dw==", + "dev": true + }, + "@csstools/css-tokenizer": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-2.1.0.tgz", + "integrity": "sha512-dtqFyoJBHUxGi9zPZdpCKP1xk8tq6KPHJ/NY4qWXiYo6IcSGwzk3L8x2XzZbbyOyBs9xQARoGveU2AsgLj6D2A==", + "dev": true + }, + "@csstools/media-query-list-parser": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/@csstools/media-query-list-parser/-/media-query-list-parser-2.0.1.tgz", + "integrity": "sha512-X2/OuzEbjaxhzm97UJ+95GrMeT29d1Ib+Pu+paGLuRWZnWRK9sI9r3ikmKXPWGA1C4y4JEdBEFpp9jEqCvLeRA==", + "dev": true + }, "@csstools/postcss-cascade-layers": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/@csstools/postcss-cascade-layers/-/postcss-cascade-layers-1.0.5.tgz", @@ -5229,6 +5247,12 @@ "integrity": "sha512-Y4XFY5VJAuw0FgAqPNd6NNoV44jbq9Bz2L7Rh/J6jLTiHBSBJa9fxqQIvkIld4GsoDOcCbvzOUAbLPsSKKg+uA==", "dev": true }, + "@types/minimist": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/@types/minimist/-/minimist-1.2.2.tgz", + "integrity": "sha512-jhuKLIRrhvCPLqwPcx6INqmKeiA5EWrsCOPhrlFSrbrmU4ZMPjj5Ul/oLCMDO98XRUIwVm78xICz4EPCektzeQ==", + "dev": true + }, "@types/node": { "version": "14.18.36", "resolved": "https://registry.npmjs.org/@types/node/-/node-14.18.36.tgz", @@ -7321,6 +7345,17 @@ "integrity": "sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==", "dev": true }, + "camelcase-keys": { + "version": "6.2.2", + "resolved": "https://registry.npmjs.org/camelcase-keys/-/camelcase-keys-6.2.2.tgz", + "integrity": "sha512-YrwaA0vEKazPBkn0ipTiMpSajYDSe+KjQfrjhcBMxJt/znbvlHd8Pw/Vamaz5EB4Wfhs3SUR3Z9mwRu/P3s3Yg==", + "dev": true, + "requires": { + "camelcase": "^5.3.1", + "map-obj": "^4.0.0", + "quick-lru": "^4.0.1" + } + }, "caniuse-lite": { "version": "1.0.30001377", "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001377.tgz", @@ -7632,6 +7667,12 @@ "resolved": "https://registry.npmjs.org/color-support/-/color-support-1.1.3.tgz", "integrity": "sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==" }, + "colord": { + "version": "2.9.3", + "resolved": "https://registry.npmjs.org/colord/-/colord-2.9.3.tgz", + "integrity": "sha512-jeC1axXpnb0/2nn/Y1LPuLdgXBLH7aDcHu4KEKfqw3CUhX7ZpfBSlPKyqXE6btIgEzfWtrX3/tyBCaCvXvMkOw==", + "dev": true + }, "colorette": { "version": "2.0.19", "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.19.tgz", @@ -8562,6 +8603,12 @@ "postcss-selector-parser": "^6.0.9" } }, + "css-functions-list": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/css-functions-list/-/css-functions-list-3.1.0.tgz", + "integrity": "sha512-/9lCvYZaUbBGvYUgYGFJ4dcYiyqdhSjG7IPVluoV8A1ILjkF7ilmhp1OGUz8n+nmBcu0RNrQAzgD8B6FJbrt2w==", + "dev": true + }, "css-has-pseudo": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/css-has-pseudo/-/css-has-pseudo-3.0.4.tgz", @@ -8617,6 +8664,16 @@ "nth-check": "^2.0.1" } }, + "css-tree": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-2.3.1.tgz", + "integrity": "sha512-6Fv1DV/TYw//QF5IzQdqsNDjx/wc8TrMBZsqjL9eW01tWb7R7k/mq+/VXfJCl7SoD5emsJop9cOByJZfs8hYIw==", + "dev": true, + "requires": { + "mdn-data": "2.0.30", + "source-map-js": "^1.0.1" + } + }, "css-what": { "version": "6.1.0", "resolved": "https://registry.npmjs.org/css-what/-/css-what-6.1.0.tgz", @@ -8963,6 +9020,24 @@ "integrity": "sha1-9lNNFRSCabIDUue+4m9QH5oZEpA=", "dev": true }, + "decamelize-keys": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/decamelize-keys/-/decamelize-keys-1.1.1.tgz", + "integrity": "sha512-WiPxgEirIV0/eIOMcnFBA3/IJZAZqKnwAwWyvvdi4lsr1WCN22nhdf/3db3DoZcUjTV2SqfzIwNyp6y2xs3nmg==", + "dev": true, + "requires": { + "decamelize": "^1.1.0", + "map-obj": "^1.0.0" + }, + "dependencies": { + "map-obj": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-1.0.1.tgz", + "integrity": "sha512-7N/q3lyZ+LVCp7PzuxrJr4KMbBE2hW7BT7YNia330OFxIf4d3r5zVpicP2650l7CPN6RM9zOJRl3NGpqSiw3Eg==", + "dev": true + } + } + }, "decode-uri-component": { "version": "0.2.2", "resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.2.tgz", @@ -11303,6 +11378,12 @@ "resolved": "https://registry.npmjs.org/fast-sha256/-/fast-sha256-1.3.0.tgz", "integrity": "sha512-n11RGP/lrWEFI/bWdygLxhI+pVeo1ZYIVwvvPkW7azl/rOy+F3HYRZ2K5zeE9mmkhQppyv9sQFx0JM9UabnpPQ==" }, + "fastest-levenshtein": { + "version": "1.0.16", + "resolved": "https://registry.npmjs.org/fastest-levenshtein/-/fastest-levenshtein-1.0.16.tgz", + "integrity": "sha512-eRnCtTTtGZFpQCwhJiUOuxPQWRXVKYDn0b2PeHfXL6/Zi53SLAzAHfVhVWK2AryC/WH05kGfxhFIPvTF0SXQzg==", + "dev": true + }, "fastq": { "version": "1.10.1", "resolved": "https://registry.npmjs.org/fastq/-/fastq-1.10.1.tgz", @@ -11931,6 +12012,26 @@ "ini": "^1.3.4" } }, + "global-modules": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/global-modules/-/global-modules-2.0.0.tgz", + "integrity": "sha512-NGbfmJBp9x8IxyJSd1P+otYK8vonoJactOogrVfFRIAEY1ukil8RSKDz2Yo7wh1oihl51l/r6W4epkeKJHqL8A==", + "dev": true, + "requires": { + "global-prefix": "^3.0.0" + } + }, + "global-prefix": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/global-prefix/-/global-prefix-3.0.0.tgz", + "integrity": "sha512-awConJSVCHVGND6x3tmMaKcQvwXLhjdkmomy2W+Goaui8YPgYgXJZewhg3fWC+DlfqqQuWg8AwqjGTD2nAPVWg==", + "dev": true, + "requires": { + "ini": "^1.3.5", + "kind-of": "^6.0.2", + "which": "^1.3.1" + } + }, "globals": { "version": "11.12.0", "resolved": "https://registry.npmjs.org/globals/-/globals-11.12.0.tgz", @@ -11958,6 +12059,12 @@ } } }, + "globjoin": { + "version": "0.1.4", + "resolved": "https://registry.npmjs.org/globjoin/-/globjoin-0.1.4.tgz", + "integrity": "sha512-xYfnw62CKG8nLkZBfWbhWwDw02CHty86jfPcc2cr3ZfeuK9ysoVPPEUxf21bAD/rWAgk52SuBrLJlefNy8mvFg==", + "dev": true + }, "gopd": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz", @@ -12041,6 +12148,12 @@ "har-schema": "^2.0.0" } }, + "hard-rejection": { + "version": "2.1.0", + "resolved": "https://registry.npmjs.org/hard-rejection/-/hard-rejection-2.1.0.tgz", + "integrity": "sha512-VIZB+ibDhx7ObhAe7OVtoEbuP4h/MuOTHJ+J8h/eBXotJYl0fBgR72xDFCKgIh22OJZIOVNxBMWuhAr10r8HdA==", + "dev": true + }, "has": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz", @@ -12203,6 +12316,12 @@ "resolved": "https://registry.npmjs.org/html-janitor/-/html-janitor-2.0.4.tgz", "integrity": "sha512-92J5h9jNZRk30PMHapjHEJfkrBWKCOy0bq3oW2pBungky6lzYSoboBGPMvxl1XRKB2q+kniQmsLsPbdpY7RM2g==" }, + "html-tags": { + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/html-tags/-/html-tags-3.2.0.tgz", + "integrity": "sha512-vy7ClnArOZwCnqZgvv+ddgHgJiAFXe3Ge9ML5/mBctVJoUoYPCdxVucOywjDARn6CVoh3dRSFdPHy2sX80L0Wg==", + "dev": true + }, "http-cache-semantics": { "version": "3.8.1", "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-3.8.1.tgz", @@ -12518,6 +12637,12 @@ } } }, + "import-lazy": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/import-lazy/-/import-lazy-4.0.0.tgz", + "integrity": "sha512-rKtvo6a868b5Hu3heneU+L4yEQ4jYKLtjpnPeUdK7h0yzXGmyBTypknlkCvHFBqfX9YlorEiMM6Dnq/5atfHkw==", + "dev": true + }, "import-meta-resolve": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-2.2.1.tgz", @@ -13835,6 +13960,12 @@ "integrity": "sha512-pJiBpiXMbt7dkzXe8Ghj/u4FfXOOa98fPW+bihOJ4SjnoijweJrNThJfd3ifXpXhREjpoF2mZVH1GfS9LV3kHQ==", "dev": true }, + "known-css-properties": { + "version": "0.26.0", + "resolved": "https://registry.npmjs.org/known-css-properties/-/known-css-properties-0.26.0.tgz", + "integrity": "sha512-5FZRzrZzNTBruuurWpvZnvP9pum+fe0HcK8z/ooo+U+Hmp4vtbyp1/QDsqmufirXy4egGzbaH/y2uCZf+6W5Kg==", + "dev": true + }, "kuler": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/kuler/-/kuler-2.0.0.tgz", @@ -14296,6 +14427,12 @@ "integrity": "sha512-Sb487aTOCr9drQVL8pIxOzVhafOjZN9UU54hiN8PU3uAiSV7lx1yYNpbNmex2PK6dSJoNTSJUUswT651yww3Mg==", "dev": true }, + "lodash.truncate": { + "version": "4.4.2", + "resolved": "https://registry.npmjs.org/lodash.truncate/-/lodash.truncate-4.4.2.tgz", + "integrity": "sha512-jttmRe7bRse52OsWIMDLaXxWqRAmtIUccAQ3garviCqJjafXOfNMO0yMfNpdD6zbGaTU0P5Nz7e7gAT6cKmJRw==", + "dev": true + }, "log-symbols": { "version": "4.1.0", "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-4.1.0.tgz", @@ -14561,6 +14698,24 @@ } } }, + "map-obj": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/map-obj/-/map-obj-4.3.0.tgz", + "integrity": "sha512-hdN1wVrZbb29eBGiGjJbeP8JbKjq1urkHJ/LIP/NY48MZ1QVXUsQBV1G1zvYFHn1XE06cwjBsOI2K3Ulnj1YXQ==", + "dev": true + }, + "mathml-tag-names": { + "version": "2.1.3", + "resolved": "https://registry.npmjs.org/mathml-tag-names/-/mathml-tag-names-2.1.3.tgz", + "integrity": "sha512-APMBEanjybaPzUrfqU0IMU5I0AswKMH7k8OTLs0vvV4KZpExkTkY87nR/zpbuTPj+gARop7aGUbl11pnDfW6xg==", + "dev": true + }, + "mdn-data": { + "version": "2.0.30", + "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.30.tgz", + "integrity": "sha512-GaqWWShW4kv/G9IEucWScBx9G1/vsFZZJUO+tD26M8J8z3Kw5RDQjaoZe03YAClgeS/SWPOcb4nkFBTEi5DUEA==", + "dev": true + }, "media-typer": { "version": "0.3.0", "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-0.3.0.tgz", @@ -14576,6 +14731,64 @@ "fs-monkey": "^1.0.3" } }, + "meow": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/meow/-/meow-9.0.0.tgz", + "integrity": "sha512-+obSblOQmRhcyBt62furQqRAQpNyWXo8BuQ5bN7dG8wmwQ+vwHKp/rCFD4CrTP8CsDQD1sjoZ94K417XEUk8IQ==", + "dev": true, + "requires": { + "@types/minimist": "^1.2.0", + "camelcase-keys": "^6.2.2", + "decamelize": "^1.2.0", + "decamelize-keys": "^1.1.0", + "hard-rejection": "^2.1.0", + "minimist-options": "4.1.0", + "normalize-package-data": "^3.0.0", + "read-pkg-up": "^7.0.1", + "redent": "^3.0.0", + "trim-newlines": "^3.0.0", + "type-fest": "^0.18.0", + "yargs-parser": "^20.2.3" + }, + "dependencies": { + "hosted-git-info": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-4.1.0.tgz", + "integrity": "sha512-kyCuEOWjJqZuDbRHzL8V93NzQhwIB71oFWSyzVo+KPZI+pnQPPxucdkrOZvkLRnrf5URsQM+IJ09Dw29cRALIA==", + "dev": true, + "requires": { + "lru-cache": "^6.0.0" + } + }, + "is-core-module": { + "version": "2.11.0", + "resolved": "https://registry.npmjs.org/is-core-module/-/is-core-module-2.11.0.tgz", + "integrity": "sha512-RRjxlvLDkD1YJwDbroBHMb+cukurkDWNyHx7D3oNB5x9rb5ogcksMC5wHCadcXoo67gVr/+3GFySh3134zi6rw==", + "dev": true, + "requires": { + "has": "^1.0.3" + } + }, + "normalize-package-data": { + "version": "3.0.3", + "resolved": "https://registry.npmjs.org/normalize-package-data/-/normalize-package-data-3.0.3.tgz", + "integrity": "sha512-p2W1sgqij3zMMyRC067Dg16bfzVH+w7hyegmpIvZ4JNjqtGOVAIvLmjBx3yP7YTe9vKJgkoNOPjwQGogDoMXFA==", + "dev": true, + "requires": { + "hosted-git-info": "^4.0.1", + "is-core-module": "^2.5.0", + "semver": "^7.3.4", + "validate-npm-package-license": "^3.0.1" + } + }, + "type-fest": { + "version": "0.18.1", + "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.18.1.tgz", + "integrity": "sha512-OIAYXk8+ISY+qTOwkHtKqzAuxchoMiD9Udx+FSGQDuiRR+PJKJHc2NJAXlbhkGwTt/4/nKZxELY1w3ReWOL8mw==", + "dev": true + } + } + }, "merge-descriptors": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-1.0.1.tgz", @@ -14735,6 +14948,25 @@ "integrity": "sha512-Jsjnk4bw3YJqYzbdyBiNsPWHPfO++UGG749Cxs6peCu5Xg4nrena6OVxOYxrQTqww0Jmwt+Ref8rggumkTLz9Q==", "dev": true }, + "minimist-options": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/minimist-options/-/minimist-options-4.1.0.tgz", + "integrity": "sha512-Q4r8ghd80yhO/0j1O3B2BjweX3fiHg9cdOwjJd2J76Q135c+NDxGCqdYKQ1SKBuFfgWbAUzBfvYjPUEeNgqN1A==", + "dev": true, + "requires": { + "arrify": "^1.0.1", + "is-plain-obj": "^1.1.0", + "kind-of": "^6.0.3" + }, + "dependencies": { + "is-plain-obj": { + "version": "1.1.0", + "resolved": "https://registry.npmjs.org/is-plain-obj/-/is-plain-obj-1.1.0.tgz", + "integrity": "sha512-yvkRyxmFKEOQ4pNXCmJG5AEQNlXJS5LaONXo5/cLdTZdWvsZ1ioJEonLGAosKlMWE8lwUy/bJzMjcw8az73+Fg==", + "dev": true + } + } + }, "minipass": { "version": "3.3.4", "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.3.4.tgz", @@ -17259,6 +17491,12 @@ "integrity": "sha512-yDUvFf9QdFZTuCUg0g0uNSHVlJ5X1lSzDZjPSFaiCWvjgsvu8vEVxtahPrLMinIDEEGnx6cBe6iqdx5YWz08wQ==", "dev": true }, + "postcss-media-query-parser": { + "version": "0.2.3", + "resolved": "https://registry.npmjs.org/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz", + "integrity": "sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==", + "dev": true + }, "postcss-modules-extract-imports": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/postcss-modules-extract-imports/-/postcss-modules-extract-imports-3.0.0.tgz", @@ -17404,6 +17642,24 @@ "integrity": "sha512-KmF7SBPphT4gPPcKZc7aDkweHiKEEO8cla/GjcBK+ckKxiZslIu3C4GCRW3DNfL0o7yW7kMQu9xlZ1kXRXLXtw==", "dev": true }, + "postcss-resolve-nested-selector": { + "version": "0.1.1", + "resolved": "https://registry.npmjs.org/postcss-resolve-nested-selector/-/postcss-resolve-nested-selector-0.1.1.tgz", + "integrity": "sha512-HvExULSwLqHLgUy1rl3ANIqCsvMS0WHss2UOsXhXnQaZ9VCc2oBvIpXrl00IUFT5ZDITME0o6oiXeiHr2SAIfw==", + "dev": true + }, + "postcss-safe-parser": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-6.0.0.tgz", + "integrity": "sha512-FARHN8pwH+WiS2OPCxJI8FuRJpTVnn6ZNFiqAM2aeW2LwTHWWmWgIyKC6cUo0L8aeKiF/14MNvnpls6R2PBeMQ==", + "dev": true + }, + "postcss-scss": { + "version": "4.0.6", + "resolved": "https://registry.npmjs.org/postcss-scss/-/postcss-scss-4.0.6.tgz", + "integrity": "sha512-rLDPhJY4z/i4nVFZ27j9GqLxj1pwxE80eAzUNRMXtcpipFYIeowerzBgG3yJhMtObGEXidtIgbUpQ3eLDsf5OQ==", + "dev": true + }, "postcss-selector-not": { "version": "6.0.1", "resolved": "https://registry.npmjs.org/postcss-selector-not/-/postcss-selector-not-6.0.1.tgz", @@ -17897,6 +18153,12 @@ "side-channel": "^1.0.4" } }, + "quick-lru": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/quick-lru/-/quick-lru-4.0.1.tgz", + "integrity": "sha512-ARhCpm70fzdcvNQfPoy49IaanKkTlRWF2JMzqhcJbhSFRZv7nPTvZJdcY7301IPmvW+/p0RgIWnQDLJxifsQ7g==", + "dev": true + }, "randombytes": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/randombytes/-/randombytes-2.1.0.tgz", @@ -18076,6 +18338,16 @@ "resolve": "^1.1.6" } }, + "redent": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/redent/-/redent-3.0.0.tgz", + "integrity": "sha512-6tDA8g98We0zd0GvVeMT9arEOnTw9qM03L9cJXaCjrip1OO764RDBLBfrB4cwzNGDj5OA5ioymC9GkizgWJDUg==", + "dev": true, + "requires": { + "indent-string": "^4.0.0", + "strip-indent": "^3.0.0" + } + }, "reflect-metadata": { "version": "0.1.13", "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.1.13.tgz", @@ -19590,6 +19862,279 @@ "escape-string-regexp": "^1.0.2" } }, + "style-search": { + "version": "0.1.0", + "resolved": "https://registry.npmjs.org/style-search/-/style-search-0.1.0.tgz", + "integrity": "sha512-Dj1Okke1C3uKKwQcetra4jSuk0DqbzbYtXipzFlFMZtowbF1x7BKJwB9AayVMyFARvU8EDrZdcax4At/452cAg==", + "dev": true + }, + "stylelint": { + "version": "15.2.0", + "resolved": "https://registry.npmjs.org/stylelint/-/stylelint-15.2.0.tgz", + "integrity": "sha512-wjg5OLn8zQwjlj5cYUgyQpMWKzct42AG5dYlqkHRJQJqsystFFn3onqEc263KH4xfEI0W3lZCnlIhFfS64uwSA==", + "dev": true, + "requires": { + "@csstools/css-parser-algorithms": "^2.0.1", + "@csstools/css-tokenizer": "^2.0.1", + "@csstools/media-query-list-parser": "^2.0.1", + "@csstools/selector-specificity": "^2.1.1", + "balanced-match": "^2.0.0", + "colord": "^2.9.3", + "cosmiconfig": "^8.0.0", + "css-functions-list": "^3.1.0", + "css-tree": "^2.3.1", + "debug": "^4.3.4", + "fast-glob": "^3.2.12", + "fastest-levenshtein": "^1.0.16", + "file-entry-cache": "^6.0.1", + "global-modules": "^2.0.0", + "globby": "^11.1.0", + "globjoin": "^0.1.4", + "html-tags": "^3.2.0", + "ignore": "^5.2.4", + "import-lazy": "^4.0.0", + "imurmurhash": "^0.1.4", + "is-plain-object": "^5.0.0", + "known-css-properties": "^0.26.0", + "mathml-tag-names": "^2.1.3", + "meow": "^9.0.0", + "micromatch": "^4.0.5", + "normalize-path": "^3.0.0", + "picocolors": "^1.0.0", + "postcss": "^8.4.21", + "postcss-media-query-parser": "^0.2.3", + "postcss-resolve-nested-selector": "^0.1.1", + "postcss-safe-parser": "^6.0.0", + "postcss-selector-parser": "^6.0.11", + "postcss-value-parser": "^4.2.0", + "resolve-from": "^5.0.0", + "string-width": "^4.2.3", + "strip-ansi": "^6.0.1", + "style-search": "^0.1.0", + "supports-hyperlinks": "^2.3.0", + "svg-tags": "^1.0.0", + "table": "^6.8.1", + "v8-compile-cache": "^2.3.0", + "write-file-atomic": "^5.0.0" + }, + "dependencies": { + "@csstools/selector-specificity": { + "version": "2.1.1", + "resolved": "https://registry.npmjs.org/@csstools/selector-specificity/-/selector-specificity-2.1.1.tgz", + "integrity": "sha512-jwx+WCqszn53YHOfvFMJJRd/B2GqkCBt+1MJSG6o5/s8+ytHMvDZXsJgUEWLk12UnLd7HYKac4BYU5i/Ron1Cw==", + "dev": true + }, + "ansi-regex": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", + "dev": true + }, + "argparse": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/argparse/-/argparse-2.0.1.tgz", + "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", + "dev": true + }, + "balanced-match": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-2.0.0.tgz", + "integrity": "sha512-1ugUSr8BHXRnK23KfuYS+gVMC3LB8QGH9W1iGtDPsNWoQbgtXSExkBu2aDR4epiGWZOjZsj6lDl/N/AqqTC3UA==", + "dev": true + }, + "cosmiconfig": { + "version": "8.1.0", + "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.1.0.tgz", + "integrity": "sha512-0tLZ9URlPGU7JsKq0DQOQ3FoRsYX8xDZ7xMiATQfaiGMz7EHowNkbU9u1coAOmnh9p/1ySpm0RB3JNWRXM5GCg==", + "dev": true, + "requires": { + "import-fresh": "^3.2.1", + "js-yaml": "^4.1.0", + "parse-json": "^5.0.0", + "path-type": "^4.0.0" + } + }, + "debug": { + "version": "4.3.4", + "resolved": "https://registry.npmjs.org/debug/-/debug-4.3.4.tgz", + "integrity": "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==", + "dev": true, + "requires": { + "ms": "2.1.2" + } + }, + "fast-glob": { + "version": "3.2.12", + "resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-3.2.12.tgz", + "integrity": "sha512-DVj4CQIYYow0BlaelwK1pHl5n5cRSJfM60UA0zK891sVInoPri2Ekj7+e1CT3/3qxXenpI+nBBmQAcJPJgaj4w==", + "dev": true, + "requires": { + "@nodelib/fs.stat": "^2.0.2", + "@nodelib/fs.walk": "^1.2.3", + "glob-parent": "^5.1.2", + "merge2": "^1.3.0", + "micromatch": "^4.0.4" + } + }, + "globby": { + "version": "11.1.0", + "resolved": "https://registry.npmjs.org/globby/-/globby-11.1.0.tgz", + "integrity": "sha512-jhIXaOzy1sb8IyocaruWSn1TjmnBVs8Ayhcy83rmxNJ8q2uWKCAj3CnJY+KpGSXCueAPc0i05kVvVKtP1t9S3g==", + "dev": true, + "requires": { + "array-union": "^2.1.0", + "dir-glob": "^3.0.1", + "fast-glob": "^3.2.9", + "ignore": "^5.2.0", + "merge2": "^1.4.1", + "slash": "^3.0.0" + } + }, + "ignore": { + "version": "5.2.4", + "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.2.4.tgz", + "integrity": "sha512-MAb38BcSbH0eHNBxn7ql2NH/kX33OkB3lZ1BNdh7ENeRChHTYsTvWrMubiIAMNS2llXEEgZ1MUOBtXChP3kaFQ==", + "dev": true + }, + "is-plain-object": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/is-plain-object/-/is-plain-object-5.0.0.tgz", + "integrity": "sha512-VRSzKkbMm5jMDoKLbltAkFQ5Qr7VDiTFGXxYFXXowVj387GeGNOCsOH6Msy00SGZ3Fp84b1Naa1psqgcCIEP5Q==", + "dev": true + }, + "js-yaml": { + "version": "4.1.0", + "resolved": "https://registry.npmjs.org/js-yaml/-/js-yaml-4.1.0.tgz", + "integrity": "sha512-wpxZs9NoxZaJESJGIZTyDEaYpl0FKSA+FB9aJiyemKhMwkxQg63h4T1KJgUGHpTqPDNRcmmYLugrRjJlBtWvRA==", + "dev": true, + "requires": { + "argparse": "^2.0.1" + } + }, + "micromatch": { + "version": "4.0.5", + "resolved": "https://registry.npmjs.org/micromatch/-/micromatch-4.0.5.tgz", + "integrity": "sha512-DMy+ERcEW2q8Z2Po+WNXuw3c5YaUSFjAO5GsJqfEl7UjvtIuFKO6ZrKvcItdy98dwFI2N1tg3zNIdKaQT+aNdA==", + "dev": true, + "requires": { + "braces": "^3.0.2", + "picomatch": "^2.3.1" + } + }, + "picomatch": { + "version": "2.3.1", + "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.1.tgz", + "integrity": "sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==", + "dev": true + }, + "postcss": { + "version": "8.4.21", + "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.21.tgz", + "integrity": "sha512-tP7u/Sn/dVxK2NnruI4H9BG+x+Wxz6oeZ1cJ8P6G/PZY0IKk4k/63TDsQf2kQq3+qoJeLm2kIBUNlZe3zgb4Zg==", + "dev": true, + "requires": { + "nanoid": "^3.3.4", + "picocolors": "^1.0.0", + "source-map-js": "^1.0.2" + } + }, + "postcss-selector-parser": { + "version": "6.0.11", + "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.0.11.tgz", + "integrity": "sha512-zbARubNdogI9j7WY4nQJBiNqQf3sLS3wCP4WfOidu+p28LofJqDH1tcXypGrcmMHhDk2t9wGhCsYe/+szLTy1g==", + "dev": true, + "requires": { + "cssesc": "^3.0.0", + "util-deprecate": "^1.0.2" + } + }, + "signal-exit": { + "version": "3.0.7", + "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.7.tgz", + "integrity": "sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==", + "dev": true + }, + "string-width": { + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", + "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", + "dev": true, + "requires": { + "emoji-regex": "^8.0.0", + "is-fullwidth-code-point": "^3.0.0", + "strip-ansi": "^6.0.1" + } + }, + "strip-ansi": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "dev": true, + "requires": { + "ansi-regex": "^5.0.1" + } + }, + "write-file-atomic": { + "version": "5.0.0", + "resolved": "https://registry.npmjs.org/write-file-atomic/-/write-file-atomic-5.0.0.tgz", + "integrity": "sha512-R7NYMnHSlV42K54lwY9lvW6MnSm1HSJqZL3xiSgi9E7//FYaI74r2G0rd+/X6VAMkHEdzxQaU5HUOXWUz5kA/w==", + "dev": true, + "requires": { + "imurmurhash": "^0.1.4", + "signal-exit": "^3.0.7" + } + } + } + }, + "stylelint-config-recommended": { + "version": "10.0.1", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended/-/stylelint-config-recommended-10.0.1.tgz", + "integrity": "sha512-TQ4xQ48tW4QSlODcti7pgSRqBZcUaBzuh0jPpfiMhwJKBPkqzTIAU+IrSWL/7BgXlOM90DjB7YaNgFpx8QWhuA==", + "dev": true + }, + "stylelint-config-recommended-scss": { + "version": "9.0.1", + "resolved": "https://registry.npmjs.org/stylelint-config-recommended-scss/-/stylelint-config-recommended-scss-9.0.1.tgz", + "integrity": "sha512-qAmz/TdrqslwiMTuLM3QXeISUkfEDUXGMfRBCHm/xrkCJNnQefv+mzG2mWTsWkqcVk8HAyUkug10dwAcYp2fCQ==", + "dev": true, + "requires": { + "postcss-scss": "^4.0.2", + "stylelint-config-recommended": "^10.0.1", + "stylelint-scss": "^4.4.0" + } + }, + "stylelint-config-standard": { + "version": "30.0.1", + "resolved": "https://registry.npmjs.org/stylelint-config-standard/-/stylelint-config-standard-30.0.1.tgz", + "integrity": "sha512-NbeHOmpRQhjZh5XB1B/S4MLRWvz4xxAxeDBjzl0tY2xEcayNhLbaRGF0ZQzq+DQZLCcPpOHeS2Ru1ydbkhkmLg==", + "dev": true, + "requires": { + "stylelint-config-recommended": "^10.0.1" + } + }, + "stylelint-config-standard-scss": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/stylelint-config-standard-scss/-/stylelint-config-standard-scss-7.0.1.tgz", + "integrity": "sha512-m5sRdtsB1F5fnC1Ozla7ryftU47wVpO+HWd+JQTqeoG0g/oPh5EfbWfcVHbNCEtuoHfALIySiUWS20pz2hX6jA==", + "dev": true, + "requires": { + "stylelint-config-recommended-scss": "^9.0.0", + "stylelint-config-standard": "^30.0.1" + } + }, + "stylelint-scss": { + "version": "4.4.0", + "resolved": "https://registry.npmjs.org/stylelint-scss/-/stylelint-scss-4.4.0.tgz", + "integrity": "sha512-Qy66a+/30aylFhPmUArHhVsHOun1qrO93LGT15uzLuLjWS7hKDfpFm34mYo1ndR4MCo8W4bEZM1+AlJRJORaaw==", + "dev": true, + "requires": { + "lodash": "^4.17.21", + "postcss-media-query-parser": "^0.2.3", + "postcss-resolve-nested-selector": "^0.1.1", + "postcss-selector-parser": "^6.0.6", + "postcss-value-parser": "^4.1.0" + } + }, "stylus": { "version": "0.58.1", "resolved": "https://registry.npmjs.org/stylus/-/stylus-0.58.1.tgz", @@ -19652,18 +20197,145 @@ "has-flag": "^3.0.0" } }, + "supports-hyperlinks": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/supports-hyperlinks/-/supports-hyperlinks-2.3.0.tgz", + "integrity": "sha512-RpsAZlpWcDwOPQA22aCH4J0t7L8JmAvsCxfOSEwm7cQs3LshN36QaTkwd70DnBOXDWGssw2eUoc8CaRWT0XunA==", + "dev": true, + "requires": { + "has-flag": "^4.0.0", + "supports-color": "^7.0.0" + }, + "dependencies": { + "has-flag": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", + "integrity": "sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==", + "dev": true + }, + "supports-color": { + "version": "7.2.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", + "integrity": "sha512-qpCAvRl9stuOHveKsn7HncJRvv501qIacKzQlO/+Lwxc9+0q2wLyv4Dfvt80/DPn2pqOBsJdDiogXGR9+OvwRw==", + "dev": true, + "requires": { + "has-flag": "^4.0.0" + } + } + } + }, "supports-preserve-symlinks-flag": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz", "integrity": "sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==", "dev": true }, + "svg-tags": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/svg-tags/-/svg-tags-1.0.0.tgz", + "integrity": "sha512-ovssysQTa+luh7A5Weu3Rta6FJlFBBbInjOh722LIt6klpU2/HtdUbszju/G4devcvk8PGt7FCLv5wftu3THUA==", + "dev": true + }, "symbol-observable": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/symbol-observable/-/symbol-observable-1.0.1.tgz", "integrity": "sha512-Kb3PrPYz4HanVF1LVGuAdW6LoVgIwjUYJGzFe7NDrBLCN4lsV/5J0MFurV+ygS4bRVwrCEt2c7MQ1R2a72oJDw==", "dev": true }, + "table": { + "version": "6.8.1", + "resolved": "https://registry.npmjs.org/table/-/table-6.8.1.tgz", + "integrity": "sha512-Y4X9zqrCftUhMeH2EptSSERdVKt/nEdijTOacGD/97EKjhQ/Qs8RTlEGABSJNNN8lac9kheH+af7yAkEWlgneA==", + "dev": true, + "requires": { + "ajv": "^8.0.1", + "lodash.truncate": "^4.4.2", + "slice-ansi": "^4.0.0", + "string-width": "^4.2.3", + "strip-ansi": "^6.0.1" + }, + "dependencies": { + "ajv": { + "version": "8.12.0", + "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.12.0.tgz", + "integrity": "sha512-sRu1kpcO9yLtYxBKvqfTeh9KzZEwO3STyX1HT+4CaDzC6HpTGYhIhPIzj9XuKU7KYDwnaeh5hcOwjy1QuJzBPA==", + "dev": true, + "requires": { + "fast-deep-equal": "^3.1.1", + "json-schema-traverse": "^1.0.0", + "require-from-string": "^2.0.2", + "uri-js": "^4.2.2" + } + }, + "ansi-regex": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz", + "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==", + "dev": true + }, + "ansi-styles": { + "version": "4.3.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", + "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==", + "dev": true, + "requires": { + "color-convert": "^2.0.1" + } + }, + "color-convert": { + "version": "2.0.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz", + "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==", + "dev": true, + "requires": { + "color-name": "~1.1.4" + } + }, + "color-name": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz", + "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==", + "dev": true + }, + "json-schema-traverse": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz", + "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==", + "dev": true + }, + "slice-ansi": { + "version": "4.0.0", + "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-4.0.0.tgz", + "integrity": "sha512-qMCMfhY040cVHT43K9BFygqYbUPFZKHOg7K73mtTWJRb8pyP3fzf4Ixd5SzdEJQ6MRUg/WBnOLxghZtKKurENQ==", + "dev": true, + "requires": { + "ansi-styles": "^4.0.0", + "astral-regex": "^2.0.0", + "is-fullwidth-code-point": "^3.0.0" + } + }, + "string-width": { + "version": "4.2.3", + "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz", + "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==", + "dev": true, + "requires": { + "emoji-regex": "^8.0.0", + "is-fullwidth-code-point": "^3.0.0", + "strip-ansi": "^6.0.1" + } + }, + "strip-ansi": { + "version": "6.0.1", + "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz", + "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==", + "dev": true, + "requires": { + "ansi-regex": "^5.0.1" + } + } + } + }, "tapable": { "version": "2.2.1", "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.2.1.tgz", @@ -19929,6 +20601,12 @@ "integrity": "sha512-1m4RA7xVAJrSGrrXGs0L3YTwyvBs2S8PbRHaLZAkFw7JR8oIFwYtysxlBZhYIa7xSyiYJKZ3iGrrk55cGA3i9A==", "dev": true }, + "trim-newlines": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/trim-newlines/-/trim-newlines-3.0.1.tgz", + "integrity": "sha512-c1PTsA3tYrIsLGkJkzHF+w9F2EyxfXGo4UyJc4pFL++FMjnq0HJS69T3M7d//gKrFKwy429bouPescbjecU+Zw==", + "dev": true + }, "trim-repeated": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/trim-repeated/-/trim-repeated-1.0.0.tgz", @@ -20239,6 +20917,12 @@ "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==", "dev": true }, + "v8-compile-cache": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz", + "integrity": "sha512-l8lCEmLcLYZh4nbunNZvQCJc5pv7+RCwa8q/LdUx8u7lsWvPDKmpodJAJNwkAhJC//dFY48KuIEmjtd4RViDrA==", + "dev": true + }, "v8-compile-cache-lib": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz", diff --git a/package.json b/package.json index 77494d250d..c74b53a306 100644 --- a/package.json +++ b/package.json @@ -23,7 +23,8 @@ "e2e": "npm run update-webdriver && protractor $SUITE", "spellcheck": "cspell '{src,e2e,projects}/**/*.ts'", "inspect.bundle": "ng build content-ce --configuration production --stats-json && npx webpack-bundle-analyzer dist/content-ce/stats.json", - "prepare": "husky install" + "prepare": "husky install", + "stylelint": "stylelint \"{app,projects}/**/*.scss\"" }, "repository": { "type": "git", @@ -123,6 +124,8 @@ "protractor-screenshoter-plugin": "0.10.3", "protractor-smartrunner": "^2.0.0-beta6", "selenium-webdriver": "^4.1.1", + "stylelint": "^15.2.0", + "stylelint-config-standard-scss": "^7.0.1", "ts-node": "^10.9.1", "tsconfig-paths": "4.1.1", "typescript": "4.7.4", diff --git a/projects/aca-content/src/lib/components/create-menu/create-menu.component.scss b/projects/aca-content/src/lib/components/create-menu/create-menu.component.scss index a2b1f9c71f..3ec6aea158 100644 --- a/projects/aca-content/src/lib/components/create-menu/create-menu.component.scss +++ b/projects/aca-content/src/lib/components/create-menu/create-menu.component.scss @@ -1,7 +1,3 @@ -.app-create-menu:focus { - outline: none; -} - .app-create-menu { .mat-stroked-button { width: 100%; @@ -26,7 +22,7 @@ &:not(.app-create-menu-secondary-button) { background-color: var(--theme-accent-color); color: var(--theme-accent-color-default-contrast); - margin-top: 0px; + margin-top: 0; .mat-icon { color: var(--theme-accent-color-default-contrast); @@ -46,25 +42,6 @@ } } - &--collapsed { - outline: none; - color: var(--theme-secondary-text-color); - cursor: pointer; - margin: 0; - border: none; - background: none; - - &:not(.app-create-menu-secondary-button) { - .app-create-menu--icon { - color: var(--theme-accent-color); - } - - &:hover { - color: var(--theme-accent-color); - } - } - } - .app-create-menu--icon { &__sub-menu { .mat-menu-item { @@ -94,4 +71,27 @@ } } } -} \ No newline at end of file + + &--collapsed { + outline: none; + color: var(--theme-secondary-text-color); + cursor: pointer; + margin: 0; + border: none; + background: none; + + &:not(.app-create-menu-secondary-button) { + .app-create-menu--icon { + color: var(--theme-accent-color); + } + + &:hover { + color: var(--theme-accent-color); + } + } + } +} + +.app-create-menu:focus { + outline: none; +} diff --git a/projects/aca-content/src/lib/components/header/header.component.scss b/projects/aca-content/src/lib/components/header/header.component.scss index 9f7036af81..4e28945dbc 100644 --- a/projects/aca-content/src/lib/components/header/header.component.scss +++ b/projects/aca-content/src/lib/components/header/header.component.scss @@ -1,5 +1,5 @@ .app-header { - box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.02), 0px 6px 10px 0px rgba(0, 0, 0, 0.014), 0px 1px 18px 0px rgba(0, 0, 0, 0.012); + box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.02), 0 6px 10px 0 rgba(0, 0, 0, 0.014), 0 1px 18px 0 rgba(0, 0, 0, 0.012); z-index: 2; .mat-toolbar { diff --git a/projects/aca-content/src/lib/components/node-version/node-version-form.component.scss b/projects/aca-content/src/lib/components/node-version/node-version-form.component.scss index 1eba72091e..27ef9ec9cf 100644 --- a/projects/aca-content/src/lib/components/node-version/node-version-form.component.scss +++ b/projects/aca-content/src/lib/components/node-version/node-version-form.component.scss @@ -2,10 +2,6 @@ display: flex; max-width: 400px; - .form { - width: 100%; - } - .form__version { display: flex; flex-direction: column; @@ -17,6 +13,7 @@ } .form { + width: 100%; padding: 0 10px; display: flex; flex-direction: column; diff --git a/projects/aca-content/src/lib/components/search/search-input-control/search-input-control.component.scss b/projects/aca-content/src/lib/components/search/search-input-control/search-input-control.component.scss index 1182703f94..46fa1ca03c 100644 --- a/projects/aca-content/src/lib/components/search/search-input-control/search-input-control.component.scss +++ b/projects/aca-content/src/lib/components/search/search-input-control/search-input-control.component.scss @@ -1,5 +1,21 @@ $top-margin: 12px; +.app-suffix-search-icon-wrapper { + height: 6px; + margin: 14px 1px; + float: left; + + .mat-icon { + font-size: 24px; + cursor: pointer; + } + + .app-clear-icon { + font-size: 18px; + margin: 3px; + } +} + .app-search-container { margin-top: -$top-margin; padding-top: 2px; @@ -43,19 +59,3 @@ $top-margin: 12px; } } } - -.app-suffix-search-icon-wrapper { - height: 6px; - margin: 14px 1px; - float: left; - - .mat-icon { - font-size: 24px; - cursor: pointer; - } - - .app-clear-icon { - font-size: 18px; - margin: 3px; - } -} diff --git a/projects/aca-content/src/lib/components/search/search-input/search-input.component.scss b/projects/aca-content/src/lib/components/search/search-input/search-input.component.scss index 0c81517789..3aaad8e99d 100644 --- a/projects/aca-content/src/lib/components/search/search-input/search-input.component.scss +++ b/projects/aca-content/src/lib/components/search/search-input/search-input.component.scss @@ -6,6 +6,9 @@ $top-margin: 12px; .app-search-container { color: var(--theme-foreground-text-color); + width: 100%; + max-width: $search-width; + height: $search-height + $top-margin; .app-input-form-field { .mat-input-element { @@ -37,11 +40,6 @@ $top-margin: 12px; } } -#search-options { - color: var(--theme-text-color); - border-top: 1px solid var(--theme-divider-color); -} - mat-checkbox { .mat-checkbox-frame { border-color: var(--theme-text-color); @@ -56,17 +54,13 @@ mat-checkbox { height: $search-height; } -.app-search-container { - width: 100%; - max-width: $search-width; - height: $search-height + $top-margin; -} - .app-search-control { margin-top: -$top-margin; } #search-options { + color: var(--theme-text-color); + border-top: 1px solid var(--theme-divider-color); padding: 20px 0; font-size: 16px; letter-spacing: -0.7px; diff --git a/projects/aca-content/src/lib/components/search/search-libraries-results/search-libraries-results.component.scss b/projects/aca-content/src/lib/components/search/search-libraries-results/search-libraries-results.component.scss index 7fff474f13..d9a615d682 100644 --- a/projects/aca-content/src/lib/components/search/search-libraries-results/search-libraries-results.component.scss +++ b/projects/aca-content/src/lib/components/search/search-libraries-results/search-libraries-results.component.scss @@ -5,12 +5,13 @@ &__content { @include flex-column; + border-left: 1px solid #eee; } &__content-header { display: flex; - padding: 0 25px 0 25px; + padding: 0 25px; flex-direction: row; align-items: center; border-bottom: 1px solid #eee; @@ -28,6 +29,7 @@ .content { @include flex-row; + flex: unset; height: unset; padding-top: 8px; @@ -36,6 +38,7 @@ &__side--left { @include flex-column; + height: unset; } } diff --git a/projects/aca-content/src/lib/components/search/search-results-row/search-results-row.component.scss b/projects/aca-content/src/lib/components/search/search-results-row/search-results-row.component.scss index 7f99f36d5b..4da61887bd 100644 --- a/projects/aca-content/src/lib/components/search/search-results-row/search-results-row.component.scss +++ b/projects/aca-content/src/lib/components/search/search-results-row/search-results-row.component.scss @@ -1,5 +1,4 @@ .aca-search-results-row { - .result-location { height: 15px; padding-top: 3px; diff --git a/projects/aca-content/src/lib/components/search/search-results/search-results.component.scss b/projects/aca-content/src/lib/components/search/search-results/search-results.component.scss index 9a851b73a2..e10f63ead9 100644 --- a/projects/aca-content/src/lib/components/search/search-results/search-results.component.scss +++ b/projects/aca-content/src/lib/components/search/search-results/search-results.component.scss @@ -15,12 +15,13 @@ $contrast-gray: #646569; &__content { @include flex-column; + border-left: 1px solid #eee; } &__content-header { display: flex; - padding: 0 25px 0 25px; + padding: 0 25px; flex-direction: row; align-items: center; border-bottom: 1px solid #eee; @@ -30,6 +31,7 @@ $contrast-gray: #646569; background-color: $adf-chip-background; color: $contrast-gray; } + .adf-search-filter-placeholder { color: $contrast-gray; } @@ -63,7 +65,7 @@ $contrast-gray: #646569; display: flex; align-items: flex-end; justify-content: space-between; - margin: 5px 5px; + margin: 5px; padding-right: 24px; } @@ -113,7 +115,6 @@ $contrast-gray: #646569; } .adf-datatable { - aca-search-action-menu button { width: 0; } diff --git a/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss b/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss index 03cd9fa714..98a801dff8 100644 --- a/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss +++ b/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss @@ -6,20 +6,6 @@ overflow-y: hidden; } -.aca-menu-panel { - .action-button--active { - color: var(--theme-accent-color) !important; - } - - .action-button { - color: var(--theme-primary-color); - } - - .action-button:hover { - color: var(--theme-accent-color); - } -} - .sidenav { display: flex; flex: 1; @@ -27,10 +13,6 @@ height: 100%; background-color: var(--theme-background-color); - .section:last-child { - border-bottom: 0; - } - .action-menu { display: flex; flex-direction: column; @@ -52,6 +34,10 @@ border-bottom: 1px solid var(--theme-divider-color); } + .section:last-child { + border-bottom: 0; + } + .section--collapsed { display: flex; flex-direction: column; @@ -88,13 +74,6 @@ margin: 0 8px !important; } - .app-item, - .app-item .item { - display: flex; - flex: 1; - flex-direction: row; - } - .item { padding: 12px 0; flex-direction: row; @@ -106,6 +85,13 @@ user-select: none; } + .app-item, + .app-item .item { + display: flex; + flex: 1; + flex-direction: row; + } + .item:hover .action-button__label { color: var(--theme-primary-color); } @@ -143,7 +129,22 @@ } } +.aca-menu-panel { + .action-button--active { + color: var(--theme-accent-color) !important; + } + + .action-button { + color: var(--theme-primary-color); + } + + .action-button:hover { + color: var(--theme-accent-color); + } +} + [dir='rtl'] .sidenav { + /* stylelint-disable-next-line no-descending-specificity */ .mat-expansion-panel-header { padding: 0 0 0 8px !important; } diff --git a/projects/aca-content/src/lib/components/view-profile/view-profile.component.scss b/projects/aca-content/src/lib/components/view-profile/view-profile.component.scss index 5b40d38087..5abffab1b2 100644 --- a/projects/aca-content/src/lib/components/view-profile/view-profile.component.scss +++ b/projects/aca-content/src/lib/components/view-profile/view-profile.component.scss @@ -10,6 +10,7 @@ app-view-profile { .app-profile-row { width: 100%; + margin: 2rem 0 0; } .app-profile-title { @@ -84,13 +85,7 @@ app-view-profile { box-shadow: 0 0 2px (--theme-blue-button-color); } - .app-profile-row { - width: 100%; - margin: 2rem 0 0 0; - } - .app-general-edit { - margin: 0.7rem; background: var(--theme-grey-text-background-color); height: 30px; margin: 1rem; @@ -122,7 +117,7 @@ app-view-profile { } .app-general-dropdown { - padding: 0rem 1rem; + padding: 0 1rem; } .app-general-dropdown-details { diff --git a/projects/aca-content/src/lib/ui/application.scss b/projects/aca-content/src/lib/ui/application.scss index d30f7fa7b4..1b2e6162b1 100644 --- a/projects/aca-content/src/lib/ui/application.scss +++ b/projects/aca-content/src/lib/ui/application.scss @@ -1,3 +1,4 @@ +/* stylelint-disable scss/no-global-function-names */ @use '@angular/material' as mat; @import 'mixins'; @import 'theme'; @@ -8,6 +9,7 @@ $foreground: map-get($custom-theme, foreground); html, body { @include flex-column; + font-size: 14px; font-family: $default-font-family; color: mat.get-color-from-palette($foreground, text, 0.87); @@ -30,6 +32,7 @@ body { .adf-container-full-width { overflow: hidden; } + app-root, app-shell, app-about, @@ -38,6 +41,7 @@ aca-search-results, ng-component { @include flex-column; } + @media screen and (max-width: 600px) { app-root, app-about, diff --git a/projects/aca-content/src/lib/ui/colors.scss b/projects/aca-content/src/lib/ui/colors.scss index 8784ff49cc..23588049da 100644 --- a/projects/aca-content/src/lib/ui/colors.scss +++ b/projects/aca-content/src/lib/ui/colors.scss @@ -30,7 +30,6 @@ $aca-primary-blue: ( A700: white, ) ); - $aca-accent-green: ( 50: #e7f3e7, 100: #c2e1c2, @@ -63,7 +62,6 @@ $aca-accent-green: ( A700: white, ) ); - $aca-warn: ( 50: #f6e1e5, 100: #eab5bf, diff --git a/projects/aca-content/src/lib/ui/custom-theme.scss b/projects/aca-content/src/lib/ui/custom-theme.scss index 077cea5977..5031aa1d1a 100644 --- a/projects/aca-content/src/lib/ui/custom-theme.scss +++ b/projects/aca-content/src/lib/ui/custom-theme.scss @@ -1,18 +1,17 @@ +/* stylelint-disable value-keyword-case */ @use '@angular/material' as mat; @import './overrides/adf-style-fixes.theme'; @import './overrides/adf-pagination.theme'; @import './overrides/ay11'; -@import './overrides/adf-about.theme.scss'; +@import './overrides/adf-about.theme'; @import './colors'; $mat-primary-palette: mat.define-palette($aca-primary-blue, A100); $mat-accent-palette: mat.define-palette($aca-accent-green, A200); $mat-warn-palette: mat.define-palette($aca-warn, A100); +$app-typography: mat.define-typography-config($font-family: 'Open Sans'); -$app-typography: mat.define-typography-config($font-family: 'Open Sans' - ); - -@include mat.core(); +@include mat.core($app-typography); $custom-theme: mat.define-light-theme( ( @@ -30,6 +29,6 @@ $custom-theme: mat.define-light-theme( @include adf-core-theme($theme); @include adf-style-fixes($theme); @include adf-pagination-theme($theme); - @include ay11-theme(); + @include ay11-theme; @include adf-about-theme($theme); } diff --git a/projects/aca-content/src/lib/ui/dynamic-theme/custom-background-color.scss b/projects/aca-content/src/lib/ui/dynamic-theme/custom-background-color.scss index 10699780fb..3913f02100 100644 --- a/projects/aca-content/src/lib/ui/dynamic-theme/custom-background-color.scss +++ b/projects/aca-content/src/lib/ui/dynamic-theme/custom-background-color.scss @@ -1,11 +1,9 @@ +/* stylelint-disable scss/no-global-function-names */ @function get-custom-background-color($background-color, $theme) { $background: map-get($theme, background); - $card: map-get($background, card); - $new-card-color: lighten($background-color, 10%); $new-selected-button: lighten($background-color, 5%); - $background: map_merge($background, (background: $background-color)); $background: map_merge($background, (card: $new-card-color)); $background: map_merge($background, (modal: $new-card-color)); diff --git a/projects/aca-content/src/lib/ui/dynamic-theme/custom-palette-creator.scss b/projects/aca-content/src/lib/ui/dynamic-theme/custom-palette-creator.scss index 6e2e60112a..656d10afcb 100644 --- a/projects/aca-content/src/lib/ui/dynamic-theme/custom-palette-creator.scss +++ b/projects/aca-content/src/lib/ui/dynamic-theme/custom-palette-creator.scss @@ -1,3 +1,6 @@ +/* stylelint-disable scss/dollar-variable-pattern */ +/* stylelint-disable scss/no-global-function-names */ +/* stylelint-disable value-keyword-case */ @use "sass:math"; @function multiply($fore, $back) { @@ -8,7 +11,7 @@ @return rgb($red, $green, $blue); } -@function getColorLuminance($color) { +@function get-color-luminance($color) { $colors: ( 'red': red($color), 'green': green($color), @@ -19,7 +22,7 @@ $adjusted: 0; $value: $value / 255; - @if $value < 0.03928 { + @if $value < 0.0393 { $value: $value / 12.92; } @else { $value: ($value + .055) / 1.055; @@ -32,75 +35,66 @@ @return (map-get($colors, 'red') * .2126) + (map-get($colors, 'green') * .7152) + (map-get($colors, 'blue') * .0722); } -@function createTextColor($color, $colorType: 'primary') { +@function create-text-color($color, $color-type: 'primary') { $red: red($color); $green: green($color); $blue: blue($color); + $light-text: $light-primary-text; + $dark-text: $dark-primary-text; - $lightText: $light-primary-text; - $darkText: $dark-primary-text; - - @if ($colorType == 'accent') { - $lightText: $light-secondary-text; - $darkText: $dark-secondary-text; + @if $color-type == 'accent' { + $light-text: $light-secondary-text; + $dark-text: $dark-secondary-text; } - $lightTextLuminance: getColorLuminance($lightText); - $darkTextLuminance: getColorLuminance($darkText); - $backgroundColorLuminance: getColorLuminance($color); - - $lightTextLuminance: $lightTextLuminance + 0.5; - $darkTextLuminance: $darkTextLuminance + 0.5; - $backgroundColorLuminance: $backgroundColorLuminance + 0.5; - - $luminanceContrastForLightText: $lightTextLuminance / $backgroundColorLuminance; - $luminanceContrastForDarkText: $backgroundColorLuminance / $darkTextLuminance; - - $textColour: $lightText; - - @if ($luminanceContrastForDarkText > $luminanceContrastForLightText) { - $textColour: $darkText; + $light-text-luminance: get-color-luminance($light-text); + $dark-text-luminance: get-color-luminance($dark-text); + $background-color-luminance: get-color-luminance($color); + $light-text-luminance: $light-text-luminance + 0.5; + $dark-text-luminance: $dark-text-luminance + 0.5; + $background-color-luminance: $background-color-luminance + 0.5; + $luminance-contrast-for-light-text: $light-text-luminance / $background-color-luminance; + $luminance-contrast-for-dark-text: $background-color-luminance / $dark-text-luminance; + $text-colour: $light-text; + + @if $luminance-contrast-for-dark-text > $luminance-contrast-for-light-text { + $text-colour: $dark-text; } - @return $textColour; + @return $text-colour; } -@function createColorPalette($color, $colorType: 'primary') { +@function create-color-palette($color, $color-type: 'primary') { $light: #fff; $dark: multiply($color, $color); - - $color50: mix($light, $color, 88%); - $color100: mix($light, $color, 70%); - $color200: mix($light, $color, 50%); - $color300: mix($light, $color, 30%); - $color400: mix($light, $color, 15%); - $color500: mix($light, $color, 0%); - $color600: mix($dark, $color, 13%); - $color700: mix($dark, $color, 30%); - $color800: mix($dark, $color, 46%); - $color900: mix($dark, $color, 75%); - + $color50: mix($light, $color, 88%); + $color100: mix($light, $color, 70%); + $color200: mix($light, $color, 50%); + $color300: mix($light, $color, 30%); + $color400: mix($light, $color, 15%); + $color500: mix($light, $color, 0%); + $color600: mix($dark, $color, 13%); + $color700: mix($dark, $color, 30%); + $color800: mix($dark, $color, 46%); + $color900: mix($dark, $color, 75%); $colorA100: lighten(saturate(mix($dark, $color, 15%), 80%), 45.6%); $colorA200: lighten(saturate(mix($dark, $color, 15%), 80%), 35.6%); $colorA400: lighten(saturate(mix($dark, $color, 15%), 100%), 25.6%); $colorA700: lighten(saturate(mix($dark, $color, 15%), 100%), 20.5%); - - $contrast50: createTextColor($color50, $colorType); - $contrast100: createTextColor($color100, $colorType); - $contrast200: createTextColor($color200, $colorType); - $contrast300: createTextColor($color300, $colorType); - $contrast400: createTextColor($color400, $colorType); - $contrast500: createTextColor($color500, $colorType); - $contrast600: createTextColor($color600, $colorType); - $contrast700: createTextColor($color700, $colorType); - $contrast800: createTextColor($color800, $colorType); - $contrast900: createTextColor($color900, $colorType); - - $contrastA100: createTextColor($colorA100, $colorType); - $contrastA200: createTextColor($colorA200, $colorType); - $contrastA400: createTextColor($colorA400, $colorType); - $contrastA700: createTextColor($colorA700, $colorType); - + $contrast50: create-text-color($color50, $color-type); + $contrast100: create-text-color($color100, $color-type); + $contrast200: create-text-color($color200, $color-type); + $contrast300: create-text-color($color300, $color-type); + $contrast400: create-text-color($color400, $color-type); + $contrast500: create-text-color($color500, $color-type); + $contrast600: create-text-color($color600, $color-type); + $contrast700: create-text-color($color700, $color-type); + $contrast800: create-text-color($color800, $color-type); + $contrast900: create-text-color($color900, $color-type); + $contrastA100: create-text-color($colorA100, $color-type); + $contrastA200: create-text-color($colorA200, $color-type); + $contrastA400: create-text-color($colorA400, $color-type); + $contrastA700: create-text-color($colorA700, $color-type); $palette: ( 50: $color50, 100: $color50, diff --git a/projects/aca-content/src/lib/ui/dynamic-theme/custom-text-color.scss b/projects/aca-content/src/lib/ui/dynamic-theme/custom-text-color.scss index 297f72af5b..ad5060c7a5 100644 --- a/projects/aca-content/src/lib/ui/dynamic-theme/custom-text-color.scss +++ b/projects/aca-content/src/lib/ui/dynamic-theme/custom-text-color.scss @@ -1,6 +1,6 @@ +/* stylelint-disable scss/no-global-function-names */ @function get-custom-text-color($text-color, $theme) { $foreground: map-get($custom-theme, foreground); - $foreground: map_merge($foreground, (text: $text-color)); $foreground: map_merge($foreground, (secondary-text: $text-color)); diff --git a/projects/aca-content/src/lib/ui/dynamic-theme/custom-theme-palettes.scss b/projects/aca-content/src/lib/ui/dynamic-theme/custom-theme-palettes.scss index f2206e4487..d9bd5b6f92 100644 --- a/projects/aca-content/src/lib/ui/dynamic-theme/custom-theme-palettes.scss +++ b/projects/aca-content/src/lib/ui/dynamic-theme/custom-theme-palettes.scss @@ -1,19 +1,23 @@ +/* stylelint-disable value-keyword-case */ + @use '@angular/material' as mat; @import '../colors'; -@import './custom-palette-creator.scss'; +@import './custom-palette-creator'; @function get-mat-palettes($primary-color, $accent-color) { $mat-primary-palette: null; + @if $primary-color { - $custom-theme-primary-palette: createColorPalette($primary-color, 'primary'); + $custom-theme-primary-palette: create-color-palette($primary-color, 'primary'); $mat-primary-palette: mat.define-palette($custom-theme-primary-palette, 500); } @else { $mat-primary-palette: mat.define-palette($aca-primary-blue, A100); } $mat-accent-palette: null; + @if $accent-color { - $custom-theme-accent-palette: createColorPalette($accent-color, 'accent'); + $custom-theme-accent-palette: create-color-palette($accent-color, 'accent'); $mat-accent-palette: mat.define-palette($custom-theme-accent-palette, 500); } @else { $mat-accent-palette: mat.define-palette($aca-accent-green, A200); diff --git a/projects/aca-content/src/lib/ui/dynamic-theme/index.scss b/projects/aca-content/src/lib/ui/dynamic-theme/index.scss index 369aa5c708..71ef87a326 100644 --- a/projects/aca-content/src/lib/ui/dynamic-theme/index.scss +++ b/projects/aca-content/src/lib/ui/dynamic-theme/index.scss @@ -1 +1 @@ -@import '../theme.scss'; +@import '../theme'; diff --git a/projects/aca-content/src/lib/ui/dynamic-theme/typography.scss b/projects/aca-content/src/lib/ui/dynamic-theme/typography.scss index 3c5487fe5a..eeb2399be1 100644 --- a/projects/aca-content/src/lib/ui/dynamic-theme/typography.scss +++ b/projects/aca-content/src/lib/ui/dynamic-theme/typography.scss @@ -1,5 +1,6 @@ +/* stylelint-disable scss/no-global-function-names */ @use '@angular/material' as mat; -@import '../variables/font-family.scss'; +@import '../variables/font-family'; @function get-mat-typography( $base-font-size, @@ -44,7 +45,7 @@ @if $font-family { @each $key, $level in $custom-typography { - @if (type-of($level) == 'map') { + @if type-of($level) == 'map' { $new-level: map-merge($level, (font-family: $font-family)); $custom-typography: map-merge($custom-typography, ($key: $new-level)); } diff --git a/projects/aca-content/src/lib/ui/mixins.scss b/projects/aca-content/src/lib/ui/mixins.scss index 1099b142d0..432c5583ff 100644 --- a/projects/aca-content/src/lib/ui/mixins.scss +++ b/projects/aca-content/src/lib/ui/mixins.scss @@ -15,9 +15,9 @@ overflow: hidden; } -@mixin rounded-outline($border-color: var(--theme-blue-button-color), $thickness: 2px, $radius: 4px) { - outline: $thickness solid $border-color; - border-radius: $radius; +@mixin rounded-outline() { + outline: 2px solid var(--theme-blue-button-color); + border-radius: 4px; } @mixin rounded-border($border-color: var(--theme-blue-button-color), $thickness: 2px, $radius: 4px) { diff --git a/projects/aca-content/src/lib/ui/overrides/adf-about.theme.scss b/projects/aca-content/src/lib/ui/overrides/adf-about.theme.scss index 0970d2c41a..dd4be04a4f 100644 --- a/projects/aca-content/src/lib/ui/overrides/adf-about.theme.scss +++ b/projects/aca-content/src/lib/ui/overrides/adf-about.theme.scss @@ -17,13 +17,12 @@ width: 95%; border: 1px solid var(--theme-about-panel-border-color); background-color: var(--theme-about-panel-background-color); - border-radius: 12px; } mat-expansion-panel-header { display: flex; height: 80px !important; - padding: 24px 24px; + padding: 24px; line-height: 32px; } @@ -36,4 +35,4 @@ } } -} \ No newline at end of file +} diff --git a/projects/aca-content/src/lib/ui/overrides/adf-pagination.theme.scss b/projects/aca-content/src/lib/ui/overrides/adf-pagination.theme.scss index 54123ac44f..04db7a883a 100644 --- a/projects/aca-content/src/lib/ui/overrides/adf-pagination.theme.scss +++ b/projects/aca-content/src/lib/ui/overrides/adf-pagination.theme.scss @@ -1,5 +1,4 @@ @mixin adf-pagination-theme($theme) { - .adf-pagination__block { flex: none !important; padding: 0 !important; diff --git a/projects/aca-content/src/lib/ui/overrides/ay11.scss b/projects/aca-content/src/lib/ui/overrides/ay11.scss index 17ba333949..3c2cadb4c2 100644 --- a/projects/aca-content/src/lib/ui/overrides/ay11.scss +++ b/projects/aca-content/src/lib/ui/overrides/ay11.scss @@ -1,36 +1,21 @@ @mixin ay11-theme() { - .adf-pagination { - &__perpage-block, - &__actualinfo-block { - - .mat-icon-button { - left: 3px; - &:focus-visible { - outline: none; - } - - &.cdk-keyboard-focused { - .mat-icon { - @include rounded-outline(); - } - } - } - } - } - .mat-icon-button, .mat-button, .mat-checkbox, .mat-raised-button { &:focus-visible { - @include rounded-outline(); + @include rounded-outline; } + .mat-ripple-element { display: none; } + &.cdk-keyboard-focused { .mat-button-focus-overlay { display: none; } + .mat-checkbox-ripple { - @include rounded-outline(); + @include rounded-outline; + height: 22px; width: 22px; left: calc(50% - 11px); @@ -44,34 +29,41 @@ } .mat-list-base .mat-list-option { + .mat-list-item-content { + @include rounded-border(transparent); + } + &:focus-visible { background-color: white; + .mat-list-item-content { - @include rounded-border(); + @include rounded-border; } } - .mat-list-item-content { - @include rounded-border(transparent); - } } .acs-close-members-container { .mat-icon-button { outline: none; line-height: 36px !important; + @include rounded-border(transparent); + &:focus-visible { - @include rounded-border(); + @include rounded-border; } } } .adf-search-user-button, .app-search-button { line-height: 36px !important; + @include rounded-border(transparent); + &:focus-visible { outline: none; - @include rounded-border(); + + @include rounded-border; } } @@ -79,11 +71,15 @@ .mat-menu-ripple { display: none; } + @include rounded-border(transparent); + &:focus-visible { - @include rounded-border(); + @include rounded-border; + background-color: white; } + &.cdk-keyboard-focused:not([disabled]) { background-color: white; } @@ -96,21 +92,12 @@ .mat-option { &.cdk-keyboard-focused { .mat-option-ripple { - @include rounded-outline(); + @include rounded-outline; } } } .mat-slide-toggle { - &.mat-primary.mat-checked:not(.mat-disabled) { - .mat-slide-toggle-bar { - background-color: var(--theme-blue-button-color); - } - .mat-slide-toggle-thumb { - background-color: white; - } - } - .mat-slide-toggle-thumb { width: 15px; height: 15px; @@ -130,11 +117,22 @@ .mat-slide-toggle-ripple { display: none; } + &.cdk-keyboard-focused { .mat-slide-toggle-bar { outline: 2px solid var(--theme-blue-button-color); } } + + &.mat-primary.mat-checked:not(.mat-disabled) { + .mat-slide-toggle-bar { + background-color: var(--theme-blue-button-color); + } + + .mat-slide-toggle-thumb { + background-color: white; + } + } } .mat-stroked-button, .mat-flat-button { @@ -149,14 +147,6 @@ } } - .mat-option { - &.cdk-keyboard-focused { - .mat-option-ripple { - @include rounded-outline(); - } - } - } - .mat-datetimepicker-calendar-body-active .mat-datetimepicker-calendar-body-cell-content { outline: 2px solid var(--theme-datetimepicker-cell-focus-border); } @@ -165,28 +155,34 @@ background-color: var(--theme-datetimepicker-cell-background) !important; } + .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected { + background-color: var(--theme-datetimepicker-selected-date-background); + } + .mat-datetimepicker-calendar-body-active .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected { background-color: var(--theme-datetimepicker-cell-focus-background); color: var(--theme-datetimepicker-font-color); } - .mat-datetimepicker-calendar-body-cell-content.mat-datetimepicker-calendar-body-selected { - background-color: var(--theme-datetimepicker-selected-date-background); - } - .mat-expansion-panel .mat-expansion-panel-header { border: 2px solid transparent; + .mat-button { outline: none; + @include rounded-border(transparent); + &:focus-visible { - @include rounded-border(); + @include rounded-border; + background-color: white; } } - &.cdk-keyboard-focused:not([aria-disabled=true]) { + + &.cdk-keyboard-focused:not([aria-disabled="true"]) { background-color: white; - @include rounded-border(); + + @include rounded-border; } } @@ -209,4 +205,24 @@ .adf-filter-button { margin-left: -2px !important; } + + .adf-pagination { + &__perpage-block, + &__actualinfo-block { + /* stylelint-disable-next-line no-descending-specificity */ + .mat-icon-button { + left: 3px; + + &:focus-visible { + outline: none; + } + + &.cdk-keyboard-focused { + .mat-icon { + @include rounded-outline; + } + } + } + } + } } diff --git a/projects/aca-content/src/lib/ui/theme.scss b/projects/aca-content/src/lib/ui/theme.scss index e4e999e857..d9698f4bac 100644 --- a/projects/aca-content/src/lib/ui/theme.scss +++ b/projects/aca-content/src/lib/ui/theme.scss @@ -1,9 +1,7 @@ @use '@angular/material' as mat; @import '@alfresco/adf-core/theming'; - @import 'custom-theme'; @import 'variables/variables'; - @include custom-theme($custom-theme); $contrast-gray: #646569; diff --git a/projects/aca-content/src/lib/ui/variables/variables.scss b/projects/aca-content/src/lib/ui/variables/variables.scss index 3acf71c614..ace887705b 100644 --- a/projects/aca-content/src/lib/ui/variables/variables.scss +++ b/projects/aca-content/src/lib/ui/variables/variables.scss @@ -1,23 +1,24 @@ +/* stylelint-disable scss/no-global-function-names */ @use '@angular/material' as mat; + $warn: map-get($custom-theme, warn); $accent: map-get($custom-theme, accent); $primary: map-get($custom-theme, primary); - $foreground: map-get($custom-theme, foreground); $background: map-get($custom-theme, background); -//Custom variables - ACA specific styling: +// Custom variables - ACA specific styling: $data-table-thumbnail-width: 35px; $data-table-cell-min-width: 150px; -$data-table-cell-min-width--no-grow: 120px; -$data-table-cell-min-width--file-size: 110px !important; +$data-table-cell-min-width-no-grow: 120px; +$data-table-cell-min-width-file-size: 110px !important; +// Upload drag $adf-upload-dragging-color: unset; $adf-upload-dragging-border: 1px solid #00bcd4; $adf-upload-dragging-background: #e0f7fa; $adf-upload-dragging-level1-color: unset; $adf-upload-dragging-level1-border: none; - $grey-background: rgba(33, 33, 33, 0.12); $grey-text-background: rgba(33, 33, 33, 0.05); $grey-hover-background: rgba(33, 33, 33, 0.24); @@ -25,13 +26,14 @@ $blue-save-button-background: #1F74DB; $black-heading: #4e4c4c; $grey-dropdown-background: #eee; $grey-divider: rgba(0,0,0,.22); -$pagination-background-color: #ffffff; +$pagination-background-color: #fff; $datetimepicker-font-color: rgba(black, 0.87); $datetimepicker-selected-date-background: #2254b2; -$datetimepicker-cell-background-color: #ffffff; +$datetimepicker-cell-background-color: #fff; $datetimepicker-cell-focus-border-color: #1F74DB; $datetimepicker-cell-focus-background-color: rgba(33, 33, 33, 0.12); +// CSS Variables $defaults: ( --theme-primary-color: mat.get-color-from-palette($primary), --theme-primary-color-default-contrast: mat.get-color-from-palette($primary, default-contrast), @@ -61,7 +63,7 @@ $defaults: ( --theme-grey-divider-color: $grey-divider, --theme-pagination-background-color: $pagination-background-color, --theme-about-panel-border-color: $grey-background, - --theme-about-panel-background-color: #ffffff, + --theme-about-panel-background-color: #fff, --theme-about-panel-title-color: #212121, --theme-datetimepicker-font-color: $datetimepicker-font-color, --theme-datetimepicker-selected-date-background: $datetimepicker-selected-date-background, diff --git a/projects/aca-folder-rules/src/lib/rule-details/actions/rule-action-list.ui-component.scss b/projects/aca-folder-rules/src/lib/rule-details/actions/rule-action-list.ui-component.scss index 88bfc1c5ab..4f66706f8a 100644 --- a/projects/aca-folder-rules/src/lib/rule-details/actions/rule-action-list.ui-component.scss +++ b/projects/aca-folder-rules/src/lib/rule-details/actions/rule-action-list.ui-component.scss @@ -9,7 +9,7 @@ } &:nth-child(2n) { - background-color: hsl(0,0%,95%); + background-color: hsl(0deg, 0%, 95%); } } } diff --git a/projects/aca-folder-rules/src/lib/rule-details/conditions/rule-composite-condition.ui-component.scss b/projects/aca-folder-rules/src/lib/rule-details/conditions/rule-composite-condition.ui-component.scss index 74ae44a5bb..c16258477b 100644 --- a/projects/aca-folder-rules/src/lib/rule-details/conditions/rule-composite-condition.ui-component.scss +++ b/projects/aca-folder-rules/src/lib/rule-details/conditions/rule-composite-condition.ui-component.scss @@ -4,10 +4,10 @@ &.childCompositeCondition { padding: 8px 16px; - background-color: hsl(0,0%,100%); + background-color: hsl(0deg, 0%, 100%); &.secondaryBackground { - background-color: hsl(0,0%,95%); + background-color: hsl(0deg, 0%, 95%); } } diff --git a/projects/aca-folder-rules/src/lib/rule-details/rule-details.ui-component.scss b/projects/aca-folder-rules/src/lib/rule-details/rule-details.ui-component.scss index 3a120fc989..752a92aeab 100644 --- a/projects/aca-folder-rules/src/lib/rule-details/rule-details.ui-component.scss +++ b/projects/aca-folder-rules/src/lib/rule-details/rule-details.ui-component.scss @@ -8,10 +8,6 @@ box-sizing: border-box; overflow-x: auto; - &:not(:nth-child(1)) { - border-top: 1px solid var(--theme-border-color); - } - &.aca-rule-details__form__name { padding-bottom: 0; } @@ -51,6 +47,10 @@ } } + &:not(:nth-child(1)) { + border-top: 1px solid var(--theme-border-color); + } + &__conditions { width: 100%; diff --git a/projects/aca-folder-rules/src/lib/rule-list/rule-list-item/rule-list-item.ui-component.scss b/projects/aca-folder-rules/src/lib/rule-list/rule-list-item/rule-list-item.ui-component.scss index f0b2f5cc05..4f04be4719 100644 --- a/projects/aca-folder-rules/src/lib/rule-list/rule-list-item/rule-list-item.ui-component.scss +++ b/projects/aca-folder-rules/src/lib/rule-list/rule-list-item/rule-list-item.ui-component.scss @@ -6,7 +6,7 @@ cursor: pointer; p { - margin: 6px 0 0 0; + margin: 6px 0 0; color: rgba(33, 35, 40, 0.7); font-style: normal; font-weight: 400; diff --git a/projects/aca-shared/src/lib/components/generic-error/generic-error.component.scss b/projects/aca-shared/src/lib/components/generic-error/generic-error.component.scss index 4081d9b737..14a020a05c 100644 --- a/projects/aca-shared/src/lib/components/generic-error/generic-error.component.scss +++ b/projects/aca-shared/src/lib/components/generic-error/generic-error.component.scss @@ -1,6 +1,5 @@ .aca-generic-error { color: var(--theme-text-color, rgba(0, 0, 0, 0.54)); - display: flex; align-items: center; justify-content: center; diff --git a/projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss b/projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss index 2d0dddb59a..c537aed39f 100644 --- a/projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss +++ b/projects/aca-shared/src/lib/components/page-layout/page-layout.component.scss @@ -1,4 +1,4 @@ -@import '../../styles/mixins.scss'; +@import '../../styles/mixins'; .aca-page-layout { @include flex-column;