├── .editorconfig ├── .github └── workflows │ └── ci.yml ├── .gitignore ├── .husky ├── commit-msg └── pre-commit ├── .node-version ├── .npmrc ├── .prettierignore ├── .prettierrc.js ├── LICENSE ├── README.md ├── codequality ├── eslint │ └── README.md ├── html-validate │ ├── .gitignore │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── index.js │ └── package.json ├── prettier │ ├── .gitignore │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── index.js │ └── package.json ├── stylelint │ ├── .gitignore │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── index.js │ ├── package.json │ ├── stylelint.config.js │ └── tests │ │ ├── invalid.test.js │ │ ├── invalid │ │ └── examples.scss │ │ ├── valid.test.js │ │ └── valid │ │ ├── accordion-item.scss │ │ ├── button.scss │ │ ├── cookie-layer.scss │ │ ├── examples.scss │ │ ├── filter.scss │ │ ├── gdpr-settings.scss │ │ ├── img.scss │ │ ├── loader.scss │ │ ├── overlay.scss │ │ ├── quote.scss │ │ ├── search.scss │ │ ├── slick.scss │ │ └── slider.scss └── ts-config │ ├── .gitignore │ ├── CHANGELOG.md │ ├── LICENSE │ ├── README.md │ ├── package.json │ └── tsconfig.json ├── doc └── README.md ├── editorconfig ├── .editorconfig └── README.md ├── lerna.json ├── package-lock.json ├── package.json └── repo ├── commitlint-conventional-changelog ├── .gitignore ├── CHANGELOG.md ├── LICENSE ├── README.md ├── index.js ├── index.spec.js └── package.json ├── cz-conventional-changelog ├── .gitignore ├── CHANGELOG.md ├── LICENSE ├── README.md ├── engine.js ├── index.js └── package.json ├── gitattributes ├── .gitattributes └── README.md └── gitignore ├── .gitignore └── README.md /.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig. Frontend. Default. 2 | # @see: http://EditorConfig.org 3 | # install a plugin to your editor: http://editorconfig.org/#download 4 | # mark: not all plugins supports the same EditorConfig properties 5 | 6 | # This is the top-most .editorconfig file (do not search in parent directories) 7 | root = true 8 | 9 | ### All files 10 | [*] 11 | # Force charset utf-8 12 | charset = utf-8 13 | # Force newline ending every file & trim trailing whitespace 14 | insert_final_newline = true 15 | trim_trailing_whitespace = true 16 | # Indentation 17 | indent_style = tab 18 | indent_size = 4 19 | 20 | ### Frontend files 21 | [*.{css,scss,less,js,json,jsx,ts,tsx,sass,php,hbs,mustache,phtml,html,twig}] 22 | 23 | ### Markdown 24 | [*.{md,mdx}] 25 | indent_style = space 26 | indent_size = 2 27 | trim_trailing_whitespace = false 28 | 29 | ### YAML 30 | [*.{yml,yaml}] 31 | indent_style = space 32 | indent_size = 2 33 | 34 | ### Storybook stories 35 | [*.stories.{ts,tsx}] 36 | indent_style = space 37 | indent_size = 2 38 | 39 | ### Specific files 40 | [{package,bower,lerna}.json] 41 | indent_style = space 42 | indent_size = 2 43 | -------------------------------------------------------------------------------- /.github/workflows/ci.yml: -------------------------------------------------------------------------------- 1 | # This workflow will do a clean install of node dependencies and run tests across different versions of node on different environments 2 | # For more information see: https://docs.github.com/de/actions/automating-builds-and-tests/building-and-testing-nodejs 3 | 4 | name: ci 5 | on: 6 | push: 7 | branches: 8 | - master 9 | pull_request: 10 | branches: 11 | - master 12 | jobs: 13 | test: 14 | name: Test - ${{ matrix.platform }} - Node v${{ matrix.node-version }} 15 | strategy: 16 | matrix: 17 | node-version: [18.x, 20.x, 22.x] 18 | platform: [ubuntu-latest] 19 | runs-on: ${{ matrix.platform }} 20 | steps: 21 | - uses: actions/checkout@v3 22 | 23 | - name: Use Node.js ${{ matrix.node-version }} 24 | uses: actions/setup-node@v3 25 | with: 26 | node-version: ${{ matrix.node-version }} 27 | 28 | - name: Install dependencies 29 | run: npm ci 30 | 31 | - name: Run tests 32 | run: npm test 33 | env: 34 | CI: true 35 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | Thumbs.db 4 | 5 | # IDE 6 | .idea 7 | .vscode 8 | 9 | # Node 10 | node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | lerna-debug.log 14 | 15 | todo.md 16 | coverage -------------------------------------------------------------------------------- /.husky/commit-msg: -------------------------------------------------------------------------------- 1 | npx --no-install commitlint --edit $1 2 | -------------------------------------------------------------------------------- /.husky/pre-commit: -------------------------------------------------------------------------------- 1 | npx lint-staged 2 | -------------------------------------------------------------------------------- /.node-version: -------------------------------------------------------------------------------- 1 | 22.14.0 2 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | save-exact=true 2 | -------------------------------------------------------------------------------- /.prettierignore: -------------------------------------------------------------------------------- 1 | # Node 2 | **/node_modules 3 | **/package.json 4 | **/package-lock.json 5 | 6 | # Config 7 | **/bower.json 8 | **/lerna.json 9 | 10 | # Build 11 | **/build 12 | **/dist 13 | **/public 14 | **/coverage 15 | **/storybook-static 16 | 17 | # Generated 18 | **/CHANGELOG.md 19 | 20 | # Project 21 | codequality/stylelint/tests/invalid 22 | /.nx/workspace-data 23 | -------------------------------------------------------------------------------- /.prettierrc.js: -------------------------------------------------------------------------------- 1 | module.exports = require('./codequality/prettier'); 2 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) 2015 Merkle Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Frontend Defaults 2 | 3 | Some defaults for frontend projects 4 | 5 | ## This Project 6 | 7 | ``` 8 | git clone https://github.com/merkle-open/frontend-defaults.git 9 | ``` 10 | 11 | - Branch - Master only (so long) 12 | 13 | ## Contents 14 | 15 | ### Documentation 16 | 17 | [Base documentation for a project](./doc/README.md) 18 | 19 | Reason: 20 | 21 | - Readme for your project root 22 | - Define & check some project specific basics (Setup, Specification, Usage, ...) 23 | - Link to other documentations 24 | 25 | ### Codequality 26 | 27 | - [editorconfig](./editorconfig/README.md) 28 | - [eslint](./codequality/eslint/README.md) 29 | - [html-validate](./codequality/html-validate/README.md) 30 | - [prettier-config](./codequality/prettier/README.md) 31 | - [stylelint-config](./codequality/stylelint/README.md) 32 | - [ts-config](./codequality/ts-config/README.md) 33 | 34 | ### Repo 35 | 36 | - [.gitattributes](./repo/gitattributes/README.md) 37 | - [.gitignore](./repo/gitignore/README.md) 38 | - [commitlint](./repo/commitlint-conventional-changelog/README.md) 39 | - [commitizen](./repo/cz-conventional-changelog/README.md) 40 | 41 | ## Published packages 42 | 43 | | Package | npm | 44 | | ------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- | 45 | | `@merkle-open/commitlint-conventional-changelog` | [![npm](https://img.shields.io/npm/v/@merkle-open/commitlint-conventional-changelog.svg)](https://www.npmjs.com/package/@merkle-open/commitlint-conventional-changelog) | 46 | | `@merkle-open/cz-conventional-changelog` | [![npm](https://img.shields.io/npm/v/@merkle-open/cz-conventional-changelog.svg)](https://www.npmjs.com/package/@merkle-open/cz-conventional-changelog) | 47 | | `@merkle-open/html-validate-config` | [![npm](https://img.shields.io/npm/v/@merkle-open/html-validate-config.svg)](https://www.npmjs.com/package/@merkle-open/html-validate-config) | 48 | | `@merkle-open/prettier-config` | [![npm](https://img.shields.io/npm/v/@merkle-open/prettier-config.svg)](https://www.npmjs.com/package/@merkle-open/prettier-config) | 49 | | `@merkle-open/stylelint-config` | [![npm](https://img.shields.io/npm/v/@merkle-open/stylelint-config.svg)](https://www.npmjs.com/package/@merkle-open/stylelint-config) | 50 | | `@merkle-open/ts-config` | [![npm](https://img.shields.io/npm/v/@merkle-open/ts-config.svg)](https://www.npmjs.com/package/@merkle-open/ts-config) | 51 | -------------------------------------------------------------------------------- /codequality/eslint/README.md: -------------------------------------------------------------------------------- 1 | # eslint 2 | 3 | Infos on [merkle-open eslint configuration](https://github.com/merkle-open/eslint-config) 4 | -------------------------------------------------------------------------------- /codequality/html-validate/.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | Thumbs.db 4 | 5 | # IDE 6 | .idea 7 | .vscode 8 | 9 | # Node 10 | /node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | lerna-debug.log 14 | .next 15 | -------------------------------------------------------------------------------- /codequality/html-validate/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | ## [1.0.2](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/html-validate-config@1.0.1...@merkle-open/html-validate-config@1.0.2) (2024-07-23) 7 | 8 | **Note:** Version bump only for package @merkle-open/html-validate-config 9 | 10 | 11 | 12 | 13 | 14 | ## [1.0.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/html-validate-config@1.0.0...@merkle-open/html-validate-config@1.0.1) (2023-02-18) 15 | 16 | **Note:** Version bump only for package @merkle-open/html-validate-config 17 | 18 | 19 | 20 | 21 | 22 | # 1.0.0 (2022-11-22) 23 | 24 | **Note:** Release 1 - version bump only 25 | 26 | ## [0.1.2](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/html-validate-config@0.1.1...@merkle-open/html-validate-config@0.1.2) (2022-11-18) 27 | 28 | **Note:** Version bump only for package @merkle-open/html-validate-config 29 | 30 | ## [0.1.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/html-validate-config@0.1.0...@merkle-open/html-validate-config@0.1.1) (2022-10-14) 31 | 32 | **Note:** Version bump only for package @merkle-open/html-validate-config 33 | -------------------------------------------------------------------------------- /codequality/html-validate/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2022 Merkle Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /codequality/html-validate/README.md: -------------------------------------------------------------------------------- 1 | # Shared html-validate config 2 | 3 | > reusable [html-validate](https://gitlab.com/html-validate/html-validate) config 4 | 5 | ## Usage 6 | 7 | `npm install --save-dev @merkle-open/html-validate-config html-validate` 8 | 9 | **.htmlvalidate.js** 10 | 11 | ```js 12 | module.exports = require('@merkle-open/html-validate-config'); 13 | ``` 14 | 15 | More infos about: [rules](https://html-validate.org/rules/index.html) 16 | 17 | **package.json** 18 | 19 | ```json 20 | { 21 | "scripts": { 22 | "lint:html": "html-validate --ext html,htm dist/**/" 23 | } 24 | } 25 | ``` 26 | 27 | More infos about: [OPTIONS](https://html-validate.org/usage/cli.html#options) 28 | 29 | ## License 30 | 31 | [MIT License](./LICENSE) 32 | -------------------------------------------------------------------------------- /codequality/html-validate/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | extends: ['html-validate:recommended'], 4 | rules: { 5 | 'element-required-attributes': 'warn', 6 | 'element-permitted-order': 'warn', 7 | 'no-inline-style': 'off', 8 | 'no-implicit-close': 'warn', 9 | 'no-raw-characters': ['warn', { relaxed: true }], 10 | 'prefer-native-element': 'warn', 11 | 'svg-focusable': 'off', 12 | 'tel-non-breaking': 'off', 13 | 14 | // disable style rules 15 | 'no-trailing-whitespace': 'off', 16 | }, 17 | }; 18 | -------------------------------------------------------------------------------- /codequality/html-validate/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@merkle-open/html-validate-config", 3 | "description": "Shared html-validate config", 4 | "version": "1.0.2", 5 | "repository": "https://github.com/merkle-open/frontend-defaults", 6 | "main": "./index.js", 7 | "license": "MIT", 8 | "author": "Merkle Inc.", 9 | "private": false, 10 | "engines": { 11 | "node": ">=14" 12 | }, 13 | "files": [ 14 | "README.md", 15 | "LICENSE", 16 | "index.js" 17 | ], 18 | "peerDependencies": { 19 | "html-validate": ">=7" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /codequality/prettier/.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | Thumbs.db 4 | 5 | # IDE 6 | .idea 7 | .vscode 8 | 9 | # Node 10 | /node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | lerna-debug.log -------------------------------------------------------------------------------- /codequality/prettier/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | ## [1.2.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/prettier-config@1.2.0...@merkle-open/prettier-config@1.2.1) (2024-07-23) 7 | 8 | **Note:** Version bump only for package @merkle-open/prettier-config 9 | 10 | 11 | 12 | 13 | 14 | # [1.2.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/prettier-config@1.1.0...@merkle-open/prettier-config@1.2.0) (2023-07-29) 15 | 16 | 17 | ### Features 18 | 19 | * **prettier:** add compatibility with prettier 3 ([436325e](https://github.com/merkle-open/frontend-defaults/commit/436325ebcf56d41069a9295f076862ec67fdd5bd)) 20 | 21 | 22 | 23 | 24 | 25 | # [1.1.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/prettier-config@1.0.1...@merkle-open/prettier-config@1.1.0) (2023-04-13) 26 | 27 | 28 | ### Features 29 | 30 | * **prettier-config:** add config for styles ([6ac72a9](https://github.com/merkle-open/frontend-defaults/commit/6ac72a9f99640f195d07d52872ca16d1ebbc8054)) 31 | 32 | 33 | 34 | 35 | 36 | ## [1.0.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/prettier-config@1.0.0...@merkle-open/prettier-config@1.0.1) (2023-02-18) 37 | 38 | **Note:** Version bump only for package @merkle-open/prettier-config 39 | 40 | 41 | 42 | 43 | 44 | 45 | # 1.0.0 (2022-11-22) 46 | 47 | **Note:** Inital release 48 | -------------------------------------------------------------------------------- /codequality/prettier/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Merkle Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /codequality/prettier/README.md: -------------------------------------------------------------------------------- 1 | # Shared prettier config [![npm](https://img.shields.io/npm/v/@merkle-open/prettier-config.svg)](https://www.npmjs.com/package/@merkle-open/prettier-config) 2 | 3 | > reusable prettier config 4 | 5 | ## Usage 6 | 7 | `npm install --save-dev prettier @merkle-open/prettier-config` 8 | 9 | **.prettierrc.js** 10 | 11 | ```js 12 | module.exports = require('@merkle-open/prettier-config'); 13 | ``` 14 | 15 | **.prettierignore** 16 | 17 | ``` 18 | # Node 19 | **/node_modules 20 | **/package.json 21 | **/package-lock.json 22 | 23 | # Generated 24 | **/bower.json 25 | **/lerna.json 26 | 27 | # Build 28 | **/build 29 | **/dist 30 | **/public 31 | **/coverage 32 | **/storybook-static 33 | 34 | # Nitro 35 | **/project/blueprints 36 | **/.yo-rc.json 37 | ``` 38 | 39 | **package.json** 40 | 41 | ```json 42 | ... 43 | "scripts": { 44 | "prettier": "prettier --write \"**/*.*(gql|graphql|js|jsx|json|md|mdx|ts|tsx|yml|yaml)\"", 45 | ... 46 | }, 47 | ... 48 | ``` 49 | 50 | ## We recommend to use prettier together with lint-staged and husky 51 | 52 | `npm install --save-dev husky lint-staged` 53 | 54 | **package.json** 55 | 56 | ```json 57 | ... 58 | "lint-staged": { 59 | "*.{gql,graphql,js,jsx,json,md,mdx,ts,tsx,yml,yaml}": [ 60 | "prettier --write" 61 | ] 62 | }, 63 | "scripts": { 64 | "prettier": "prettier --write \"**/*.*(gql|graphql|js|jsx|json|md|mdx|ts|tsx|yml|yaml)\"", 65 | ... 66 | }, 67 | "husky": { 68 | "hooks": { 69 | "pre-commit": "lint-staged" 70 | } 71 | }, 72 | ... 73 | ``` 74 | 75 | ## License 76 | 77 | [MIT License](./LICENSE) 78 | -------------------------------------------------------------------------------- /codequality/prettier/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | printWidth: 120, 3 | tabWidth: 4, 4 | useTabs: true, 5 | endOfLine: 'auto', 6 | semi: true, 7 | singleQuote: true, 8 | trailingComma: 'all', 9 | bracketSpacing: true, 10 | bracketSameLine: true, 11 | arrowParens: 'always', 12 | embeddedLanguageFormatting: 'off', 13 | overrides: [ 14 | { 15 | files: ['*.gql', '*.graphql'], 16 | options: { 17 | parser: 'graphql', 18 | }, 19 | }, 20 | { 21 | files: ['*.js', '*.jsx'], 22 | options: { 23 | parser: 'babel', 24 | }, 25 | }, 26 | { 27 | files: '*.json', 28 | options: { 29 | parser: 'json', 30 | }, 31 | }, 32 | { 33 | files: '*.md', 34 | options: { 35 | parser: 'markdown', 36 | useTabs: false, 37 | tabWidth: 2, 38 | printWidth: 60, 39 | }, 40 | }, 41 | { 42 | files: '*.mdx', 43 | options: { 44 | parser: 'mdx', 45 | useTabs: false, 46 | tabWidth: 2, 47 | printWidth: 60, 48 | }, 49 | }, 50 | { 51 | files: ['*.css', '*.scss'], 52 | options: { 53 | parser: 'scss', 54 | }, 55 | }, 56 | { 57 | files: ['*.ts', '*.tsx'], 58 | options: { 59 | parser: 'typescript', 60 | }, 61 | }, 62 | { 63 | // use 2 spaces and 80 with because stories also used in documentation 64 | files: ['*.stories.ts', '*.stories.tsx'], 65 | options: { 66 | parser: 'typescript', 67 | useTabs: false, 68 | tabWidth: 2, 69 | printWidth: 60, 70 | }, 71 | }, 72 | { 73 | files: ['*.yml', '*.yaml'], 74 | options: { 75 | parser: 'yaml', 76 | singleQuote: false, 77 | useTabs: false, 78 | tabWidth: 2, 79 | }, 80 | }, 81 | ], 82 | }; 83 | -------------------------------------------------------------------------------- /codequality/prettier/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@merkle-open/prettier-config", 3 | "description": "Shared prettier config", 4 | "version": "1.2.1", 5 | "repository": "https://github.com/merkle-open/frontend-defaults", 6 | "license": "MIT", 7 | "author": "Merkle Inc.", 8 | "private": false, 9 | "engines": { 10 | "node": ">=14" 11 | }, 12 | "main": "./index.js", 13 | "files": [ 14 | "README.md", 15 | "LICENSE", 16 | "index.js" 17 | ], 18 | "peerDependencies": { 19 | "prettier": ">=2 <4" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /codequality/stylelint/.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | Thumbs.db 4 | 5 | # IDE 6 | .idea 7 | .vscode 8 | 9 | # Node 10 | /node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | lerna-debug.log -------------------------------------------------------------------------------- /codequality/stylelint/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | ## [4.0.2](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@4.0.1...@merkle-open/stylelint-config@4.0.2) (2024-10-21) 7 | 8 | 9 | ### Bug Fixes 10 | 11 | * **stylelint-config:** update stylelint-bem for compatibility with stylelint 16.10.0 ([ba3ffe5](https://github.com/merkle-open/frontend-defaults/commit/ba3ffe5adab489b8fdd585dfda5daa9f4abead12)) 12 | 13 | 14 | 15 | 16 | 17 | ## [4.0.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@4.0.0...@merkle-open/stylelint-config@4.0.1) (2024-07-23) 18 | 19 | 20 | ### Bug Fixes 21 | 22 | * **stylelint-config:** bump deps ([be41953](https://github.com/merkle-open/frontend-defaults/commit/be419532f6517b39f337af0af2a80efcd639724f)) 23 | * **stylelint-config:** use scss/load-partial-extension ([53f4302](https://github.com/merkle-open/frontend-defaults/commit/53f4302fd1e4911c105545403a45539701b6b567)) 24 | 25 | 26 | 27 | 28 | 29 | # [4.0.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@3.2.0...@merkle-open/stylelint-config@4.0.0) (2024-01-08) 30 | 31 | 32 | ### Features 33 | 34 | * **stylelint-config:** update stylelint-config-standard-scss ([90f514f](https://github.com/merkle-open/frontend-defaults/commit/90f514f58fe907cb57378ee71be1c27392c257af)) 35 | * **stylelint-config:** use stylelint 16, update stylelint-config-standard-scssand ([a183537](https://github.com/merkle-open/frontend-defaults/commit/a183537e21bd1e5dc69bfa0f9686c7ac704d1364)) 36 | 37 | 38 | ### BREAKING CHANGES 39 | 40 | * **stylelint-config:** remove node support < 18.12.0 and remove support for stylelint < 16.1.0 41 | 42 | 43 | 44 | 45 | 46 | # [3.2.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@3.1.0...@merkle-open/stylelint-config@3.2.0) (2023-09-01) 47 | 48 | 49 | ### Features 50 | 51 | * **stylelint-config:** update stylelint-bem ([6e2aaed](https://github.com/merkle-open/frontend-defaults/commit/6e2aaeda9eedac213fd0ed9e80ee5c618c61eb32)) 52 | 53 | 54 | 55 | 56 | 57 | # [3.1.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@3.0.0...@merkle-open/stylelint-config@3.1.0) (2023-07-29) 58 | 59 | 60 | ### Features 61 | 62 | * **stylelint-config:** update stylelint-config-standard-scss ([2c49c97](https://github.com/merkle-open/frontend-defaults/commit/2c49c97b1277c126258aaf6c386ee7164e05f0ca)) 63 | 64 | 65 | 66 | 67 | 68 | # [3.0.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@2.1.0...@merkle-open/stylelint-config@3.0.0) (2023-06-27) 69 | 70 | 71 | ### Features 72 | 73 | * **stylelint-config:** update stylelint-config-standard-scss ([2477f2b](https://github.com/merkle-open/frontend-defaults/commit/2477f2b2185ec6021a1e32b7389f08c0601d9886)) 74 | 75 | 76 | ### BREAKING CHANGES 77 | 78 | * **stylelint-config:** remove stylelint less than 15.5.0 from peer dependencies 79 | 80 | 81 | 82 | 83 | 84 | # [2.1.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@2.0.1...@merkle-open/stylelint-config@2.1.0) (2023-04-13) 85 | 86 | 87 | ### Features 88 | 89 | * **prettier-config:** add config for styles ([6ac72a9](https://github.com/merkle-open/frontend-defaults/commit/6ac72a9f99640f195d07d52872ca16d1ebbc8054)) 90 | * **stylelint-config:** update standard config ([a8bf968](https://github.com/merkle-open/frontend-defaults/commit/a8bf968ca960cf301f16bc33fc0587182090d51c)) 91 | 92 | 93 | 94 | 95 | 96 | ## [2.0.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@2.0.0...@merkle-open/stylelint-config@2.0.1) (2023-04-08) 97 | 98 | **Note:** Version bump only for package @merkle-open/stylelint-config 99 | 100 | 101 | 102 | 103 | 104 | # [2.0.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/stylelint-config@1.0.0...@merkle-open/stylelint-config@2.0.0) (2023-02-18) 105 | 106 | 107 | ### Features 108 | 109 | * **stylelint-config:** use stylelint 15 ([f93687c](https://github.com/merkle-open/frontend-defaults/commit/f93687c185c252935c2c054c8c8b120f467d6cd7)) 110 | 111 | 112 | ### BREAKING CHANGES 113 | 114 | * **stylelint-config:** new configuration set for stylelint 15 only 115 | 116 | 117 | 118 | 119 | 120 | 121 | # 1.0.0 (2022-11-22) 122 | 123 | **Note:** Inital release 124 | -------------------------------------------------------------------------------- /codequality/stylelint/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Merkle Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /codequality/stylelint/README.md: -------------------------------------------------------------------------------- 1 | # Shared stylelint config [![npm](https://img.shields.io/npm/v/@merkle-open/stylelint-config.svg)](https://www.npmjs.com/package/@merkle-open/stylelint-config) 2 | 3 | > reusable stylelint config for stylelint 15 4 | 5 | ## Usage 6 | 7 | `npm install --save-dev stylelint@15 @merkle-open/stylelint-config` 8 | 9 | **stylelint.config.js** 10 | 11 | ```js 12 | module.exports = require('@merkle-open/stylelint-config'); 13 | ``` 14 | 15 | **.stylelintignore** 16 | 17 | ``` 18 | node_modules/ 19 | src/shared/base/reset/css/yui/reset.css 20 | ``` 21 | 22 | **package.json** 23 | 24 | ```json 25 | { 26 | "scripts": { 27 | "lint:css": "stylelint src/**/*.*ss" 28 | } 29 | } 30 | ``` 31 | 32 | ## We recommend to use stylelint together with lint-staged and husky 33 | 34 | `npm install --save-dev husky lint-staged` 35 | 36 | **package.json** 37 | 38 | ```json 39 | { 40 | "scripts": { 41 | "lint:css": "stylelint src/**/*.*ss" 42 | }, 43 | "husky": { 44 | "hooks": { 45 | "pre-commit": "lint-staged" 46 | } 47 | }, 48 | "lint-staged": { 49 | "src/**/*.*ss": ["stylelint"] 50 | } 51 | } 52 | ``` 53 | 54 | ## License 55 | 56 | [MIT License](./LICENSE) 57 | -------------------------------------------------------------------------------- /codequality/stylelint/index.js: -------------------------------------------------------------------------------- 1 | /* 2 | stylelint rules: https://github.com/stylelint/stylelint/blob/main/docs/user-guide/rules.md 3 | standard config: https://github.com/stylelint/stylelint-config-standard/blob/main/index.js 4 | recommended config: https://github.com/stylelint/stylelint-config-recommended/blob/main/index.js 5 | 6 | scss rules: https://github.com/stylelint-scss/stylelint-scss 7 | standard scss config: https://github.com/stylelint-scss/stylelint-config-standard-scss/blob/HEAD/index.js 8 | recommended scss config: https://github.com/stylelint-scss/stylelint-config-recommended-scss/blob/HEAD/index.js 9 | */ 10 | 11 | module.exports = { 12 | extends: 'stylelint-config-standard-scss', 13 | plugins: ['@namics/stylelint-bem'], 14 | rules: { 15 | 'plugin/stylelint-bem-namics': true, 16 | 'alpha-value-notation': ['number', { severity: 'warning' }], 17 | 'at-rule-no-unknown': null, 18 | 'at-rule-no-vendor-prefix': true, 19 | 'at-rule-empty-line-before': null, 20 | 'block-no-empty': null, 21 | 'color-function-notation': ['modern', { severity: 'warning' }], 22 | 'color-named': 'never', 23 | 'color-no-invalid-hex': [true, { severity: 'warning' }], 24 | 'comment-word-disallowed-list': ['todo', { severity: 'warning' }], 25 | 'custom-media-pattern': null, 26 | 'custom-property-pattern': null, 27 | 'declaration-block-no-duplicate-properties': [ 28 | true, 29 | { ignore: ['consecutive-duplicates-with-different-values'], severity: 'warning' }, 30 | ], 31 | 'declaration-block-no-shorthand-property-overrides': true, 32 | 'declaration-no-important': true, 33 | 'declaration-empty-line-before': null, 34 | 'declaration-block-no-redundant-longhand-properties': true, 35 | 'function-linear-gradient-no-nonstandard-direction': [true, { severity: 'warning' }], 36 | 'function-name-case': 'lower', 37 | 'keyframes-name-pattern': null, 38 | 'length-zero-no-unit': true, 39 | 'max-nesting-depth': [2, { severity: 'warning' }], 40 | 'no-descending-specificity': null, 41 | 'no-duplicate-selectors': [true, { severity: 'warning' }], 42 | 'no-empty-source': null, 43 | 'no-unknown-animations': [true, { severity: 'warning' }], 44 | 'number-max-precision': 4, 45 | 'property-no-unknown': [true, { ignoreProperties: 'font-icon' }], 46 | 'property-no-vendor-prefix': [true, { severity: 'warning' }], 47 | 'rule-empty-line-before': null, 48 | 'scss/at-else-closing-brace-newline-after': null, 49 | 'scss/at-else-closing-brace-space-after': null, 50 | 'scss/at-function-pattern': null, 51 | 'scss/at-if-closing-brace-newline-after': null, 52 | 'scss/at-if-closing-brace-space-after': null, 53 | 'scss/at-if-no-null': null, 54 | 'scss/at-import-no-partial-leading-underscore': null, 55 | 'scss/at-mixin-argumentless-call-parentheses': 'always', 56 | 'scss/at-mixin-pattern': null, 57 | 'scss/at-rule-conditional-no-parentheses': null, 58 | 'scss/at-rule-no-unknown': true, 59 | 'scss/comment-no-empty': null, 60 | 'scss/declaration-nested-properties': 'never', 61 | 'scss/declaration-nested-properties-no-divided-groups': null, 62 | 'scss/dollar-variable-pattern': null, 63 | 'scss/dollar-variable-empty-line-before': null, 64 | 'scss/double-slash-comment-empty-line-before': null, 65 | 'scss/double-slash-comment-whitespace-inside': null, 66 | 'scss/load-partial-extension': ['never', { severity: 'warning' }], 67 | 'scss/no-global-function-names': null, 68 | 'scss/operator-no-newline-after': true, 69 | 'scss/operator-no-newline-before': true, 70 | 'scss/selector-no-redundant-nesting-selector': true, 71 | 'scss/selector-no-union-class-name': true, 72 | 'selector-class-pattern': null, 73 | 'selector-id-pattern': null, 74 | 'selector-max-id': 0, 75 | 'selector-not-notation': 'complex', 76 | 'selector-pseudo-element-colon-notation': 'double', 77 | 'selector-type-case': 'lower', 78 | 'shorthand-property-no-redundant-values': true, 79 | 'value-keyword-case': ['lower', { camelCaseSvgKeywords: true }], 80 | 'value-no-vendor-prefix': [true, { severity: 'warning' }], 81 | }, 82 | }; 83 | -------------------------------------------------------------------------------- /codequality/stylelint/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@merkle-open/stylelint-config", 3 | "description": "Shared stylelint config", 4 | "version": "4.0.2", 5 | "repository": "https://github.com/merkle-open/frontend-defaults", 6 | "main": "./index.js", 7 | "license": "MIT", 8 | "author": "Merkle Inc.", 9 | "private": false, 10 | "engines": { 11 | "node": ">=18.12.0" 12 | }, 13 | "files": [ 14 | "README.md", 15 | "LICENSE", 16 | "index.js" 17 | ], 18 | "peerDependencies": { 19 | "stylelint": ">=16.1.0" 20 | }, 21 | "devDependencies": { 22 | "jest": "29.7.0", 23 | "jest-light-runner": "0.6.0", 24 | "stylelint": "16.17.0" 25 | }, 26 | "dependencies": { 27 | "@namics/stylelint-bem": "10.1.0", 28 | "stylelint-config-standard-scss": "13.1.0" 29 | }, 30 | "scripts": { 31 | "lint:css": "stylelint tests/**/*.*ss --allow-empty-input", 32 | "prepublishOnly": "npm test", 33 | "test": "jest", 34 | "watch-test": "jest --watchAll" 35 | }, 36 | "jest": { 37 | "runner": "jest-light-runner" 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /codequality/stylelint/stylelint.config.js: -------------------------------------------------------------------------------- 1 | const lintConfig = require('./'); 2 | 3 | lintConfig.rules['plugin/stylelint-bem-namics'] = { 4 | patternPrefixes: ['a', 'm', 'o', 'h'], 5 | helperPrefixes: ['state'], 6 | }; 7 | 8 | module.exports = lintConfig; 9 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/invalid.test.js: -------------------------------------------------------------------------------- 1 | const stylelint = require('stylelint'); 2 | const config = require('../'); 3 | 4 | describe('flags errors with invalid css', () => { 5 | const files = 'tests/invalid/examples.scss'; 6 | let result; 7 | 8 | beforeEach(async () => { 9 | result = await stylelint.lint({ 10 | files, 11 | config, 12 | }); 13 | }); 14 | 15 | it('did error', () => { 16 | expect(result.errored).toBe(true); 17 | }); 18 | 19 | it('flags warnings', () => { 20 | expect(result.results[0].warnings).toHaveLength(6); 21 | }); 22 | 23 | it('correct warning text', () => { 24 | expect(result.results[0].warnings.map((w) => w.text)).toEqual([ 25 | 'Expected class name "selector" to start with a valid prefix: "a-", "m-", "o-", "l-", "g-", "h-", "state-". (plugin/stylelint-bem-namics)', 26 | 'Expected class name "z-selector" to start with a valid prefix: "a-", "m-", "o-", "l-", "g-", "h-", "state-". (plugin/stylelint-bem-namics)', 27 | 'Expected modern color-function notation (color-function-notation)', 28 | 'Unexpected named color "darkgray" (color-named)', 29 | 'Unexpected !important (declaration-no-important)', 30 | 'Expected "#FOO" to have no more than 0 ID selectors (selector-max-id)', 31 | ]); 32 | }); 33 | 34 | it('correct rule flagged', () => { 35 | expect(result.results[0].warnings.map((w) => w.rule)).toEqual([ 36 | 'plugin/stylelint-bem-namics', 37 | 'plugin/stylelint-bem-namics', 38 | 'color-function-notation', 39 | 'color-named', 40 | 'declaration-no-important', 41 | 'selector-max-id', 42 | ]); 43 | }); 44 | 45 | it('correct severity flagged', () => { 46 | expect(result.results[0].warnings[0].severity).toBe('error'); 47 | expect(result.results[0].warnings[1].severity).toBe('error'); 48 | expect(result.results[0].warnings[2].severity).toBe('warning'); 49 | }); 50 | 51 | it('correct line number', () => { 52 | expect(result.results[0].warnings[0].line).toBe(12); 53 | expect(result.results[0].warnings[1].line).toBe(14); 54 | expect(result.results[0].warnings[2].line).toBe(7); 55 | expect(result.results[0].warnings[3].line).toBe(4); 56 | }); 57 | 58 | it('correct column number', () => { 59 | expect(result.results[0].warnings[0].column).toBe(1); 60 | expect(result.results[0].warnings[1].column).toBe(1); 61 | expect(result.results[0].warnings[2].column).toBe(22); 62 | expect(result.results[0].warnings[3].column).toBe(9); 63 | }); 64 | }); 65 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/invalid/examples.scss: -------------------------------------------------------------------------------- 1 | a { 2 | top: .2em; 3 | padding: 10px !important; 4 | color: darkgray; 5 | background-color: #CCC; 6 | background-image: url("x.svg"); 7 | box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1); 8 | } 9 | 10 | #FOO { /* ... */ } 11 | 12 | .selector { /* ... */ } 13 | 14 | .z-selector { /* ... */ } 15 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid.test.js: -------------------------------------------------------------------------------- 1 | const stylelint = require('stylelint'); 2 | const config = require('../'); 3 | 4 | describe('flags no errors with valid css', () => { 5 | const files = 'tests/valid/*.scss'; 6 | let result; 7 | 8 | beforeEach(async () => { 9 | result = await stylelint.lint({ 10 | files, 11 | config, 12 | }); 13 | }); 14 | 15 | it('did not error', () => { 16 | expect(result.errored).toBe(false); 17 | }); 18 | 19 | it('flags a todo warning in slick.scss', () => { 20 | expect(result.results[0].warnings).toHaveLength(0); 21 | expect(result.results[1].warnings).toHaveLength(0); 22 | expect(result.results[2].warnings).toHaveLength(0); 23 | expect(result.results[3].warnings).toHaveLength(0); 24 | expect(result.results[4].warnings).toHaveLength(0); 25 | expect(result.results[5].warnings).toHaveLength(0); 26 | expect(result.results[6].warnings).toHaveLength(0); 27 | expect(result.results[7].warnings).toHaveLength(0); 28 | expect(result.results[8].warnings).toHaveLength(0); 29 | expect(result.results[9].warnings).toHaveLength(0); 30 | expect(result.results[10].warnings).toHaveLength(0); 31 | expect(result.results[11].warnings).toHaveLength(1); 32 | expect(result.results[12].warnings).toHaveLength(0); 33 | }); 34 | }); 35 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/accordion-item.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../../../shared/utils/colors/css/colors'; 2 | @import '../../../../../../shared/utils/component-spacing/css/component-spacing'; 3 | @import '../../../../../../shared/utils/media-queries/css/media-queries'; 4 | @import '../../../../../../shared/utils/typo/css/typo'; 5 | @import '../../../../../../shared/utils/transitions/css/transitions'; 6 | 7 | @mixin hover-focus-active-styles($interaction, $color, $border-color, $background-color: null) { 8 | /* stylelint-disable plugin/stylelint-bem-namics */ 9 | #{$interaction} { 10 | .o-accordion-item__button { 11 | color: $color; 12 | 13 | @if $background-color { 14 | background-color: $background-color; 15 | } 16 | } 17 | .o-accordion-item__icon { 18 | color: $color; 19 | } 20 | } 21 | /* stylelint-enable plugin/stylelint-bem-namics */ 22 | } 23 | 24 | .o-accordion-item { 25 | border-bottom: 1px solid $color-accordion-border-default; 26 | margin-bottom: -1px; // to prevent double borders 27 | position: relative; 28 | z-index: 0; 29 | 30 | @include media-query(xs) { 31 | /* stylelint-disable plugin/stylelint-bem-namics */ 32 | .col-12 + .col-12 { 33 | margin-top: 3rem; 34 | } 35 | /* stylelint-enable plugin/stylelint-bem-namics */ 36 | } 37 | 38 | [data-whatintent='mouse'] & { 39 | @include transitions(z-index, border-color); 40 | @include hover-focus-active-styles('&:hover', $color-accordion-font-hover, $color-accordion-border-hover); 41 | } 42 | 43 | [data-whatintent='keyboard'] & { 44 | @include hover-focus-active-styles( 45 | '&:focus-within', 46 | $color-accordion-font-focus, 47 | $color-accordion-border-focus, 48 | $color-accordion-background-focus 49 | ); 50 | @include hover-focus-active-styles( 51 | '&[focus-within]', 52 | $color-accordion-font-focus, 53 | $color-accordion-border-focus, 54 | $color-accordion-background-focus 55 | ); 56 | } 57 | } 58 | 59 | .state-o-accordion-item--open { 60 | @include hover-focus-active-styles('&', $color-accordion-font-default, $color-accordion-border-default); 61 | 62 | .o-accordion-item__icon { 63 | color: $color-accordion-icon-default; 64 | } 65 | } 66 | 67 | .o-accordion-item__content { 68 | padding-top: 1.2rem; 69 | @include vertical-spacing(s7, padding-bottom); 70 | } 71 | 72 | .o-accordion-item__button { 73 | @include typography(default, 'base'); // needed as button font otherwise does not get reset via reset.css 74 | @include typography('body'); 75 | background: $color-accordion-background-default; 76 | border: none; 77 | color: $color-accordion-font-default; 78 | font-size: 3.6rem; 79 | line-height: 1; 80 | cursor: pointer; 81 | display: flex; 82 | flex-direction: row; 83 | align-items: center; 84 | width: 100%; 85 | padding: 1.6rem 0; 86 | 87 | @include media-query(md, xl) { 88 | padding: 2.4rem 0; 89 | } 90 | 91 | [data-whatintent='mouse'] & { 92 | @include transitions(color, padding-left); 93 | } 94 | 95 | &:focus { 96 | outline: none; 97 | } 98 | } 99 | 100 | .o-accordion-item__text { 101 | padding-right: 2rem; 102 | text-align: left; 103 | } 104 | 105 | .o-accordion-item__icon { 106 | @include transitions(transform); 107 | margin-left: auto; 108 | line-height: 1; 109 | color: $color-accordion-icon-default; 110 | font-size: 1.38em; 111 | transform: rotate(0); 112 | 113 | /* stylelint-disable plugin/stylelint-bem-namics */ 114 | .collapsed & { 115 | transform: rotate(180deg); 116 | } 117 | /* stylelint-enable plugin/stylelint-bem-namics */ 118 | 119 | [data-whatintent='mouse'] & { 120 | @include transitions(transform, color); 121 | } 122 | } 123 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/button.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/colors/css/colors'; 2 | @import '../../../../shared/utils/elements/css/elements'; 3 | @import '../../../../shared/utils/ellipsis/css/ellipsis'; 4 | @import '../../../../shared/utils/media-queries/css/media-queries'; 5 | @import '../../../../shared/utils/transitions/css/transitions'; 6 | @import '../../../../shared/utils/typo/css/typo'; 7 | 8 | .a-button { 9 | @include typography('button'); 10 | display: inline-flex; 11 | justify-content: center; 12 | align-items: center; 13 | max-width: 100%; 14 | color: $color-button-primary-font-default; 15 | background-color: $color-button-primary-background-default; 16 | border: 2px solid $color-button-primary-border-default; 17 | border-radius: $button-border-radius; 18 | outline: none; 19 | cursor: pointer; // to have a pointer for button tag which does not have it per default 20 | text-decoration: none; 21 | 22 | [data-whatintent='mouse'] & { 23 | @include transitions(background-color, border-color, color); 24 | } 25 | 26 | &:hover { 27 | color: $color-button-primary-font-hover; 28 | background-color: $color-button-primary-background-hover; 29 | border-color: $color-button-primary-border-hover; 30 | 31 | .a-button__number { 32 | color: $color-button-number-font-hover; 33 | } 34 | } 35 | &:focus { 36 | background-color: $color-button-primary-background-focus; 37 | border-color: $color-button-primary-border-focus; 38 | color: $color-button-primary-font-focus; 39 | [data-whatintent='keyboard'] & { 40 | box-shadow: $button-keyboard-focus-box-shadow; 41 | } 42 | } 43 | &:active { 44 | color: $color-button-primary-font-active; 45 | background-color: $color-button-primary-background-active; 46 | border-color: $color-button-primary-border-active; 47 | } 48 | 49 | @include media-query(xs, sm) { 50 | width: 100%; 51 | padding: 0.6rem 1.8rem; 52 | } 53 | 54 | @include media-query(md) { 55 | padding: 1rem 2.2rem; 56 | } 57 | 58 | @include media-query(lg, xl) { 59 | padding: 1.4rem 2.2rem; 60 | } 61 | } 62 | 63 | .a-button__text, 64 | .a-button__icon, 65 | .a-button__number { 66 | pointer-events: none; 67 | } 68 | 69 | .a-button__text { 70 | @include ellipsis(); 71 | width: auto; 72 | } 73 | 74 | .a-button__icon { 75 | margin-right: 0.5rem; 76 | font-size: 2rem; 77 | line-height: 1; 78 | 79 | @include media-query(md, xl) { 80 | font-size: 2.4rem; 81 | } 82 | } 83 | 84 | .a-button__number { 85 | white-space: nowrap; 86 | color: $color-button-number-font-default; 87 | background-color: $color-button-number-background-default; 88 | padding: 0 0.8rem; 89 | border-radius: $button-border-radius; 90 | margin-left: 0.8rem; 91 | margin-right: -1.2rem; 92 | 93 | @include media-query(lg, xl) { 94 | margin-right: -0.8rem; 95 | } 96 | } 97 | 98 | .a-button__loader { 99 | display: none; 100 | position: absolute; 101 | margin-top: 0.1em; 102 | font-size: 1.4em; 103 | opacity: 0; 104 | animation: a-button-pulse 2s linear infinite normal forwards; 105 | } 106 | 107 | // states 108 | .state-a-button--disabled, 109 | .state-a-button--disabled:hover, 110 | .state-a-button--disabled:focus { 111 | color: $color-button-primary-font-disabled; 112 | background-color: $color-button-primary-background-disabled; 113 | border-color: $color-button-primary-border-disabled; 114 | cursor: not-allowed; 115 | 116 | .a-button__number { 117 | color: $color-button-number-font-disabled; 118 | } 119 | } 120 | 121 | .state-a-button--loading { 122 | overflow: hidden; 123 | cursor: wait; 124 | 125 | background-color: $color-button-primary-background-focus; 126 | border-color: $color-button-primary-border-focus; 127 | 128 | .a-button__text { 129 | transform: scale(2.5); 130 | opacity: 0; 131 | @include transitions(transform 0.5s, opacity 0.3s); 132 | } 133 | 134 | .a-button__loader { 135 | display: block; 136 | opacity: 1; 137 | @include transitions(opacity 0.5s); 138 | } 139 | } 140 | 141 | @keyframes a-button-pulse { 142 | 0%, 143 | 25% { 144 | transform: scale(1, 1); 145 | animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); 146 | } 147 | 12.5%, 148 | 37.5% { 149 | transform: scale(1.2, 1.2); 150 | animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1); 151 | } 152 | 50%, 153 | 100% { 154 | transform: scale(1, 1); 155 | } 156 | } 157 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/cookie-layer.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/helper/css/helper'; 2 | @import '../../../../shared/utils/link/css/link'; 3 | @import '../../../../shared/utils/media-queries/css/media-queries'; 4 | @import '../../../../shared/utils/transitions/css/transitions'; 5 | @import '../../../../shared/utils/z-index/css/z-index'; 6 | 7 | @import './utils/variables'; 8 | 9 | .m-cookie-layer { 10 | @include z-index('cookie-layer'); // needed to cover the nav-main appearing below the header 11 | @include h-hide(); 12 | position: relative; 13 | background-color: $color-background; 14 | 15 | &.state-m-cookie-layer--visible { 16 | @include h-show(); 17 | @media print { 18 | display: none; 19 | } 20 | } 21 | } 22 | 23 | .m-cookie-layer__inner { 24 | display: flex; 25 | flex-direction: row; 26 | align-items: flex-start; 27 | } 28 | 29 | .m-cookie-layer__text { 30 | margin-right: 1.8rem; 31 | @include media-query(lg) { 32 | margin-right: 3.8rem; 33 | } 34 | @include media-query(xl) { 35 | margin-right: 5.4rem; 36 | } 37 | 38 | .a-text { 39 | a { 40 | @include link-styles(); 41 | } 42 | } 43 | } 44 | 45 | .m-cookie-layer__close { 46 | margin-left: auto; 47 | } 48 | 49 | .m-cookie-layer__close-button { 50 | background: none; 51 | border: none; 52 | padding: 0; 53 | color: $color-close-font-default; 54 | font-size: 3.6rem; 55 | line-height: 1; 56 | cursor: pointer; 57 | 58 | &:focus { 59 | outline: none; 60 | 61 | [data-whatintent='keyboard'] & { 62 | background-color: $color-close-background-focus; 63 | color: $color-close-font-focus; 64 | } 65 | } 66 | 67 | [data-whatintent='mouse'] & { 68 | @include transitions(color); 69 | 70 | &:hover { 71 | color: $color-close-font-hover; 72 | } 73 | } 74 | } 75 | 76 | .m-cookie-layer__close-button-text { 77 | @include h-visually-hide(); 78 | } 79 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/examples.scss: -------------------------------------------------------------------------------- 1 | @forward 'something'; 2 | @use 'base'; 3 | @use 'sass:map'; 4 | @use 'sass:math'; 5 | @use 'sass:meta'; 6 | @use 'sass:string'; 7 | @import 'something-else'; 8 | 9 | @function -private-function() { 10 | @return true; 11 | } 12 | 13 | // single line comment 14 | 15 | @mixin corner-icon($name, $top-or-bottom, $left-or-right) { 16 | /* stylelint-disable-next-line plugin/stylelint-bem-namics */ 17 | .a-icon-#{$name} { 18 | background-image: url('/icons/#{$name}.svg'); 19 | position: absolute; 20 | #{$top-or-bottom}: 0; 21 | #{$left-or-right}: 0; 22 | } 23 | } 24 | 25 | @mixin triangle($size, $color, $direction) { 26 | border-color: transparent; 27 | border-style: solid; 28 | border-width: math.div($size, 2); 29 | 30 | @if $direction == up { 31 | border-bottom-color: $color; 32 | } @else if $direction == right { 33 | border-left-color: $color; 34 | } @else if $direction == down { 35 | border-top-color: $color; 36 | } @else if $direction == left { 37 | border-right-color: $color; 38 | } @else { 39 | @error 'Unknown direction #{$direction}.'; 40 | } 41 | } 42 | 43 | @mixin theme($theme: DarkGray) { 44 | background: $theme; 45 | box-shadow: 0 0 1px rgb($theme / 0.25); 46 | } 47 | 48 | @mixin -private-mixin() { 49 | border: 1px; 50 | } 51 | 52 | %message-shared { 53 | border: 1px solid #ccc; 54 | color: #333; 55 | } 56 | 57 | %-private-placeholder { 58 | border: 1px; 59 | } 60 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/filter.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/base/grid/css/variables/grid'; 2 | @import '../../../../shared/utils/colors/css/colors'; 3 | @import '../../../../shared/utils/component-spacing/css/component-spacing'; 4 | @import '../../../../shared/utils/transitions/css/transitions'; 5 | @import '../../../../shared/utils/vertical-spacing/css/vertical-spacing'; 6 | 7 | @import './utils/variables'; 8 | 9 | .o-filter { 10 | @include component-spacing(); 11 | background-color: $color-filter-background; 12 | } 13 | 14 | .o-filter__container { 15 | background-color: $color-filter-background; 16 | } 17 | 18 | .o-filter__bar { 19 | @include vertical-spacing(s2, padding-y); 20 | position: sticky; 21 | top: 0; 22 | z-index: 1; 23 | display: flex; 24 | justify-content: space-between; 25 | align-items: center; 26 | background-color: $color-filter-background; 27 | box-shadow: 0 1px 0 rgba(0 0 0 / 0.1); 28 | } 29 | 30 | .o-filter__bar-buttons { 31 | // initially hidden 32 | .a-button__number { 33 | display: none; 34 | } 35 | } 36 | 37 | .o-filter__results { 38 | position: relative; // anchor for .o-filter__results-loader 39 | } 40 | 41 | .o-filter__results-content { 42 | display: grid; 43 | gap: $grid-gutter-width; 44 | @include media-query(sm) { 45 | grid-template-columns: repeat(2, 1fr); 46 | } 47 | @include media-query(md) { 48 | grid-template-columns: repeat(3, 1fr); 49 | } 50 | 51 | opacity: 1; 52 | transform: translateY(0); 53 | @include transitions(opacity 0.3s ease, transform 0.3s ease); 54 | .state-o-filter__results--loading & { 55 | opacity: 0; 56 | transform: translateY(100px); 57 | @include transitions(opacity 0.6s ease, transform 0.6s ease 0.2s); 58 | } 59 | } 60 | 61 | .o-filter__results-loader { 62 | position: absolute; 63 | left: 0; 64 | right: 0; 65 | pointer-events: none; 66 | opacity: 0; 67 | @include transitions(opacity 0.6s ease); 68 | .state-o-filter__results--loading & { 69 | display: block; 70 | opacity: 1; 71 | @include transitions(opacity 0.3s ease); 72 | } 73 | } 74 | 75 | .o-filter__no-results { 76 | display: none; 77 | } 78 | 79 | .state-o-filter__no-results--visible { 80 | display: block; 81 | } 82 | 83 | .o-filter__more { 84 | display: flex; 85 | justify-content: center; 86 | @include vertical-spacing(s4, padding-top); 87 | } 88 | 89 | .state-o-filter__more--hidden { 90 | display: none; 91 | } 92 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/gdpr-settings.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/ellipsis/css/ellipsis'; 2 | @import '../../../../shared/utils/helper/css/helper'; 3 | @import '../../../../shared/utils/link/css/link'; 4 | @import '../../../../shared/utils/typo/css/typo'; 5 | @import '../../../../shared/utils/vertical-spacing/css/vertical-spacing'; 6 | 7 | .m-gdpr-settings__title { 8 | @include typography(t6); 9 | @include vertical-spacing(s2, margin-bottom); 10 | } 11 | 12 | .m-gdpr-settings__text { 13 | @include vertical-spacing(s3, margin-bottom); 14 | 15 | .state-m-gdpr-settings--read-more & { 16 | /* stylelint-disable max-nesting-depth */ 17 | @include media-query(xs, sm) { 18 | p { 19 | @include ellipsis(4); 20 | } 21 | } 22 | /* stylelint-enable max-nesting-depth */ 23 | } 24 | } 25 | 26 | .m-gdpr-settings__read-more { 27 | @include link-styles(); 28 | @include typography(body-small); 29 | @include h-hide(); 30 | margin-top: 0.4rem; 31 | 32 | .state-m-gdpr-settings--read-more & { 33 | display: inline-block; 34 | visibility: visible; 35 | 36 | @include media-query(md) { 37 | @include h-hide(); 38 | } 39 | } 40 | 41 | @include media-query(md) { 42 | @include h-hide(); 43 | } 44 | } 45 | 46 | .m-gdpr-settings__categories { 47 | @include vertical-spacing(s3, margin-bottom); 48 | display: flex; 49 | flex-flow: row wrap; 50 | } 51 | 52 | .m-gdpr-settings__category { 53 | @include vertical-spacing(s3, margin-bottom); 54 | margin-right: 4rem; 55 | &::after { 56 | font-icon: url('../img/arrow.svg'); 57 | } 58 | } 59 | 60 | .m-gdpr-settings__buttons { 61 | display: flex; 62 | flex-direction: column; 63 | 64 | @include media-query(sm) { 65 | flex-direction: row; 66 | justify-content: flex-end; 67 | } 68 | } 69 | 70 | .m-gdpr-settings__button + .m-gdpr-settings__button { 71 | margin-top: 2rem; 72 | 73 | @include media-query(sm) { 74 | margin-top: 0; 75 | margin-left: 2rem; 76 | } 77 | } 78 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/img.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/media-queries/css/media-queries'; 2 | @import '../../../../shared/utils/transitions/css/transitions'; 3 | 4 | .a-img { 5 | position: relative; 6 | height: 0; 7 | } 8 | 9 | .a-img__image { 10 | z-index: 1; 11 | display: block; 12 | position: absolute; 13 | top: 0; 14 | bottom: 0; 15 | width: 100%; 16 | opacity: 0; 17 | @include transitions(opacity 0.5s linear); 18 | 19 | &.state-h-lazy-load--loaded { 20 | opacity: 1; 21 | 22 | + .a-img__loader { 23 | display: none; 24 | } 25 | } 26 | } 27 | 28 | .a-img__image--no-lazy-load { 29 | opacity: 1; 30 | } 31 | 32 | .a-img__preview { 33 | display: block; 34 | position: absolute; 35 | top: 0; 36 | bottom: 0; 37 | width: 100%; 38 | height: 100%; // for cases where the preview images is not exactly in the ratio because of rounding 39 | filter: url('#blur50'); // DO NOT use in combination with css transitions on the same element 40 | } 41 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/loader.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/z-index/css/z-index'; 2 | 3 | @import './utils/variables'; 4 | 5 | @keyframes a-loader-loading { 6 | 0% { 7 | opacity: 0; 8 | transform: translateX(-300px); 9 | } 10 | 33% { 11 | opacity: 1; 12 | transform: translateX(0); 13 | } 14 | 66% { 15 | opacity: 1; 16 | transform: translateX(0); 17 | } 18 | 100% { 19 | opacity: 0; 20 | transform: translateX(300px); 21 | } 22 | } 23 | 24 | .a-loader { 25 | @include z-index('loader'); 26 | position: absolute; 27 | top: 0; 28 | left: 0; 29 | height: 100%; 30 | width: 100%; 31 | } 32 | 33 | .a-loader__wrap { 34 | width: 100%; 35 | transform: translateY(-50%); 36 | top: 50%; 37 | position: absolute; 38 | text-align: center; 39 | overflow: hidden; 40 | } 41 | 42 | .a-loader__dot { 43 | width: 10px; 44 | height: 10px; 45 | border-radius: 50%; 46 | display: inline-block; 47 | background-color: $color-loader-dark; 48 | opacity: 0; 49 | margin-right: 3px; 50 | 51 | animation: a-loader-loading 3s infinite ease-in-out; 52 | 53 | &:nth-child(5) { 54 | animation-delay: 100ms; 55 | } 56 | &:nth-child(4) { 57 | animation-delay: 200ms; 58 | } 59 | &:nth-child(3) { 60 | animation-delay: 300ms; 61 | } 62 | &:nth-child(2) { 63 | animation-delay: 400ms; 64 | } 65 | &:nth-child(1) { 66 | animation-delay: 500ms; 67 | } 68 | } 69 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/overlay.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/colors/css/colors'; 2 | @import '../../../../shared/utils/helper/css/helper'; 3 | @import '../../../../shared/utils/link/css/link'; 4 | @import '../../../../shared/utils/media-queries/css/media-queries'; 5 | @import '../../../../shared/utils/transitions/css/transitions'; 6 | @import '../../../../shared/utils/z-index/css/z-index'; 7 | 8 | @import './utils/overlay'; 9 | @import './utils/variables'; 10 | 11 | .o-overlay { 12 | @include transitions(transform 0.3s ease-in-out); 13 | @include h-hide(); 14 | pointer-events: none; // needed to be able to close overlay on outer top/bottom click 15 | position: fixed; 16 | inset: 0; 17 | z-index: -1; 18 | transform: translateY(-100%); 19 | 20 | @include media-query(xs, sm) { 21 | transform: translateX(100%); 22 | } 23 | } 24 | 25 | .state-o-overlay--visible { 26 | @include z-index('overlay'); 27 | display: flex; 28 | visibility: visible; 29 | transform: translateY(-100%); 30 | 31 | @include media-query(xs, sm) { 32 | transform: translateX(100%); 33 | } 34 | } 35 | 36 | .state-o-overlay--transition { 37 | transform: translateY(0); 38 | 39 | @include media-query(xs, sm) { 40 | transform: translateX(0); 41 | } 42 | } 43 | 44 | .state-o-overlay--back-button-visible { 45 | .o-overlay__back { 46 | @include media-query(xs, sm) { 47 | @include h-show(); 48 | } 49 | } 50 | } 51 | 52 | .o-overlay__vertical-alignment { 53 | // needed to make content display flex work inside 54 | height: 100%; 55 | width: 100%; 56 | 57 | @include media-query(md) { 58 | display: flex; 59 | flex-direction: column; 60 | justify-content: flex-start; 61 | } 62 | } 63 | 64 | .o-overlay__horizontal-alignment { 65 | // needed to make content display flex work inside 66 | height: 100%; 67 | width: 100%; 68 | 69 | @include media-query(sm) { 70 | display: flex; 71 | flex-direction: row; 72 | justify-content: flex-end; 73 | } 74 | } 75 | 76 | .o-overlay__wrapper { 77 | background: $color-overlay-background; 78 | position: relative; 79 | pointer-events: auto; // reset pointer events 80 | width: 100%; 81 | height: 100%; 82 | max-height: 100%; 83 | display: flex; 84 | flex-direction: column; 85 | 86 | @include media-query(sm) { 87 | max-width: 66vw; 88 | } 89 | 90 | @include media-query(md) { 91 | height: auto; 92 | 93 | .h-browser-device--ie & { 94 | height: 100%; // needed because of IE11 flex max-height bug 95 | } 96 | } 97 | } 98 | 99 | .o-overlay__header { 100 | @include header-min-height(base, 3rem, 3rem); 101 | display: flex; 102 | flex-direction: row; 103 | align-items: center; 104 | position: relative; 105 | 106 | @include media-query(md) { 107 | @include header-min-height(md, 3rem, 3rem); 108 | } 109 | } 110 | 111 | .o-overlay__logo { 112 | justify-self: flex-start; 113 | } 114 | 115 | .o-overlay__title { 116 | color: $color-overlay-title; 117 | } 118 | 119 | .o-overlay__back, 120 | .o-overlay__close { 121 | background: none; 122 | border: none; 123 | padding: 0; 124 | cursor: pointer; 125 | right: 0; 126 | display: flex; 127 | align-items: center; 128 | 129 | @include media-query(xs, sm) { 130 | position: absolute; 131 | top: 50%; 132 | transform: translateY(-50%); 133 | } 134 | } 135 | 136 | .o-overlay__back { 137 | @include link-styles('.o-overlay__back-text'); 138 | @include h-hide(); 139 | left: 0; 140 | } 141 | 142 | .o-overlay__close { 143 | @include link-styles('.o-overlay__close-text'); 144 | right: 0; 145 | 146 | @include media-query(md) { 147 | margin-left: auto; 148 | } 149 | } 150 | 151 | .o-overlay__close-text { 152 | margin-right: 0.5rem; 153 | 154 | @include media-query(xs, sm) { 155 | @include h-visually-hide(); 156 | } 157 | } 158 | 159 | .o-overlay__close-icon { 160 | font-size: 1.8em; 161 | line-height: 1; 162 | 163 | @include media-query(md) { 164 | font-size: 1.3em; 165 | } 166 | } 167 | 168 | .o-overlay__content { 169 | overflow: hidden auto; 170 | } 171 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/quote.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/component-spacing/css/component-spacing'; 2 | @import '../../../../shared/utils/typo/css/typo'; 3 | 4 | @import './utils/variables'; 5 | 6 | .o-quote { 7 | @include component-spacing(); 8 | background: $color-quote-background; 9 | } 10 | 11 | .o-quote__blockquote { 12 | text-align: center; 13 | } 14 | 15 | .o-quote__text { 16 | quotes: '“' '”' '‘' '’'; 17 | padding-top: 0.3em; // to compensate quote char offset 18 | padding-bottom: 0.3em; // to compensate quote char offset 19 | 20 | &::before, 21 | &::after { 22 | color: $color-quote-signs; 23 | font-size: 4em; 24 | line-height: 0; 25 | display: inline-block; 26 | } 27 | 28 | &::before { 29 | content: open-quote; 30 | margin-right: 0.25em; 31 | vertical-align: -0.4em; 32 | } 33 | 34 | &::after { 35 | content: close-quote; 36 | margin-left: 0.25em; 37 | vertical-align: -0.7em; 38 | margin-bottom: -1em; // to compensate quote char offset 39 | } 40 | } 41 | 42 | .o-quote__name { 43 | @include typography(font-weight, bold); 44 | } 45 | 46 | .o-quote__date, 47 | .o-quote__additional-text { 48 | @include typography(font-style, italic); 49 | } 50 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/search.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/helper/css/helper'; 2 | @import '../../../../shared/utils/media-queries/css/media-queries'; 3 | @import '../../../../shared/utils/transitions/css/transitions'; 4 | 5 | @import './utils/variables'; 6 | 7 | .m-search { 8 | padding: 2px; 9 | } 10 | 11 | .m-search__form { 12 | position: relative; 13 | } 14 | 15 | .m-search__label { 16 | @include h-visually-hide(); 17 | } 18 | 19 | .m-search__input { 20 | background-color: $color-input-background-default; 21 | border: none; 22 | border-radius: 0; 23 | box-shadow: 0 1px 0 0 $color-input-border-default; 24 | color: $color-input-font-default; 25 | width: 100%; 26 | // make search field work on safari 27 | /* stylelint-disable property-no-vendor-prefix */ 28 | -webkit-appearance: none; 29 | /* stylelint-enable property-no-vendor-prefix */ 30 | padding: 1.3rem ($input-height-xs + 1rem) 1.5rem 1rem; 31 | 32 | [data-whatintent='mouse'] & { 33 | @include transitions(box-shadow, background-color); 34 | } 35 | 36 | @include media-query(sm) { 37 | padding-right: ($input-height-sm + 1rem); 38 | } 39 | 40 | @include media-query(md) { 41 | padding-right: ($input-height-md + 1rem); 42 | } 43 | 44 | @include media-query(lg) { 45 | padding-right: ($input-height-lg + 1rem); 46 | } 47 | 48 | @include media-query(xl) { 49 | padding-right: ($input-height-xl + 1rem); 50 | } 51 | 52 | &:hover { 53 | box-shadow: 0 1px 0 0 $color-input-border-hover; 54 | background-color: $color-input-background-hover; 55 | } 56 | 57 | &:focus { 58 | outline: none; 59 | box-shadow: 0 0 0 2px $color-input-border-focus; 60 | background-color: $color-input-background-focus; 61 | } 62 | 63 | &::placeholder { 64 | color: $color-input-font-placeholder; 65 | } 66 | 67 | &::-ms-clear { 68 | display: none; 69 | } 70 | 71 | &::-webkit-search-cancel-button { 72 | display: none; 73 | } 74 | } 75 | 76 | .m-search__submit { 77 | position: absolute; 78 | right: 0; 79 | top: 0; 80 | bottom: 0; 81 | border: none; 82 | background: $color-button-background-default; 83 | color: $color-button-font-default; 84 | width: $input-height-xs; 85 | padding: 0; 86 | margin: 0; 87 | cursor: pointer; 88 | 89 | [data-whatintent='mouse'] & { 90 | @include transitions(color, background-color); 91 | } 92 | 93 | @include media-query(sm) { 94 | width: $input-height-sm; 95 | } 96 | 97 | @include media-query(md) { 98 | width: $input-height-md; 99 | } 100 | 101 | @include media-query(lg) { 102 | width: $input-height-lg; 103 | } 104 | 105 | @include media-query(xl) { 106 | width: $input-height-xl; 107 | } 108 | 109 | &:hover { 110 | background-color: $color-button-background-hover; 111 | color: $color-button-font-hover; 112 | } 113 | 114 | &:focus { 115 | outline: none; 116 | background-color: $color-button-background-focus; 117 | color: $color-button-font-focus; 118 | } 119 | } 120 | 121 | .m-search__submit-text { 122 | @include h-visually-hide(); 123 | } 124 | 125 | .m-search__submit-icon { 126 | font-size: 1.73em; 127 | display: block; 128 | line-height: 0; 129 | } 130 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/slick.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/colors2/css/colors2'; 2 | @import '../../../../shared/utils/breakpoints/css/breakpoints'; 3 | 4 | $slick-font-path: '~slick-carousel/slick/fonts/'; 5 | $slick-font-family: 'slick'; 6 | $slick-loader-path: '~slick-carousel/slick/'; 7 | $slick-arrow-color: $color-brand-1; 8 | 9 | @import '~slick-carousel/slick/slick'; 10 | @import '~slick-carousel/slick/slick-theme'; 11 | 12 | /* stylelint-disable-next-line plugin/stylelint-bem-namics */ 13 | .slick { 14 | position: relative; 15 | margin: 30px 0; 16 | 17 | // todo: try to find another solution 18 | @media (max-width: $size-sm-max) { 19 | /* stylelint-disable plugin/stylelint-bem-namics */ 20 | .slick-prev { 21 | left: 10px; 22 | z-index: 1; 23 | } 24 | .slick-next { 25 | right: 10px; 26 | z-index: 1; 27 | } 28 | /* stylelint-enable plugin/stylelint-bem-namics */ 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /codequality/stylelint/tests/valid/slider.scss: -------------------------------------------------------------------------------- 1 | @import '../../../../shared/utils/colors/css/colors'; 2 | @import '../../../../shared/utils/helper/css/helper'; 3 | @import '../../../../shared/utils/component-spacing/css/component-spacing'; 4 | @import '../../../../shared/utils/ellipsis/css/ellipsis'; 5 | @import '../../../../shared/utils/media-queries/css/media-queries'; 6 | @import '../../../../shared/utils/typo/css/typo'; 7 | @import '../../../../shared/utils/transitions/css/transitions'; 8 | @import '../../../../shared/utils/vertical-spacing/css/vertical-spacing'; 9 | 10 | @import './utils/variables'; 11 | 12 | .state-m-slider--pre-init { 13 | .m-slider__button-prev, 14 | .m-slider__button-next { 15 | @include h-hide(); 16 | } 17 | } 18 | 19 | .m-slider__slider { 20 | // DO NOT use filter in combination with css transitions on the same element 21 | .a-img__preview { 22 | filter: none; 23 | } 24 | } 25 | 26 | .m-slider__content { 27 | @include vertical-spacing(s3, padding-top); 28 | padding-left: 15px; // container padding on mobile 29 | padding-right: 15px; // container padding on mobile 30 | 31 | @include media-query(md) { 32 | z-index: 1; // z-index without the mixin to make clear, it has no dependencies with other page elements 33 | padding: 0; 34 | position: absolute; 35 | top: 25%; 36 | left: 0; 37 | right: 0; 38 | } 39 | } 40 | 41 | .m-slider__title { 42 | color: $color-slider-title; 43 | 44 | @include media-query(md) { 45 | .a-heading { 46 | @include ellipsis(); 47 | } 48 | } 49 | } 50 | 51 | .m-slider__text { 52 | @include media-query(md) { 53 | p { 54 | @include ellipsis(3); 55 | } 56 | } 57 | } 58 | 59 | .m-slider__button-prev, 60 | .m-slider__button-next { 61 | @include transitions(color); 62 | color: $color-slider-navigation-buttons; 63 | top: 0; 64 | margin-top: calc(37.5% / 2); // 8:3 image height / 2 to center 65 | transform: translateY(-50%); 66 | 67 | &:hover { 68 | color: $color-slider-navigation-buttons-hover; 69 | } 70 | &:focus { 71 | color: $color-slider-navigation-buttons-focus; 72 | } 73 | } 74 | 75 | .m-slider__pagination { 76 | top: 0; 77 | margin-top: calc(37.5%); // at the bottom of the image (8:3) 78 | 79 | @include media-query(md) { 80 | top: auto; 81 | margin-top: 0; 82 | } 83 | 84 | /* stylelint-disable plugin/stylelint-bem-namics */ 85 | .swiper-pagination-bullet { 86 | @include transitions(background-color); 87 | background-color: $color-slider-pagination-bullet; 88 | opacity: 1; 89 | 90 | &:hover { 91 | background-color: $color-slider-pagination-bullet-hover; 92 | } 93 | } 94 | 95 | .swiper-pagination-bullet-active { 96 | @include transitions(background-color); 97 | background-color: $color-slider-pagination-bullet-active; 98 | 99 | &:hover { 100 | background-color: $color-slider-pagination-bullet-active-hover; 101 | } 102 | &:focus { 103 | background-color: $color-slider-pagination-bullet-active-focus; 104 | } 105 | } 106 | /* stylelint-enable plugin/stylelint-bem-namics */ 107 | } 108 | -------------------------------------------------------------------------------- /codequality/ts-config/.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | Thumbs.db 4 | 5 | # IDE 6 | .idea 7 | .vscode 8 | 9 | # Node 10 | /node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | lerna-debug.log 14 | .next 15 | -------------------------------------------------------------------------------- /codequality/ts-config/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | ## [1.1.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/ts-config@1.1.0...@merkle-open/ts-config@1.1.1) (2024-07-23) 7 | 8 | **Note:** Version bump only for package @merkle-open/ts-config 9 | 10 | 11 | 12 | 13 | 14 | # [1.1.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/ts-config@1.0.1...@merkle-open/ts-config@1.1.0) (2023-04-08) 15 | 16 | 17 | ### Features 18 | 19 | * **ts-config:** add support for TypeScript 5 ([74047b6](https://github.com/merkle-open/frontend-defaults/commit/74047b68d2239594d42317b5d6894577ed734476)) 20 | 21 | 22 | 23 | 24 | 25 | ## [1.0.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/ts-config@1.0.0...@merkle-open/ts-config@1.0.1) (2023-02-18) 26 | 27 | **Note:** Version bump only for package @merkle-open/ts-config 28 | 29 | 30 | 31 | 32 | 33 | 34 | # 1.0.0 (2022-11-22) 35 | 36 | **Note:** Inital release 37 | -------------------------------------------------------------------------------- /codequality/ts-config/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Merkle Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /codequality/ts-config/README.md: -------------------------------------------------------------------------------- 1 | # Shared typescript config [![npm](https://img.shields.io/npm/v/@merkle-open/ts-config.svg)](https://www.npmjs.com/package/@merkle-open/ts-config) 2 | 3 | > Shared configuration for Typescript 4 | 5 | ## Usage 6 | 7 | `npm install --save-dev typescript @merkle-open/ts-config` 8 | 9 | **tsconfig.json** 10 | 11 | ```json 12 | { 13 | "extends": "@merkle-open/ts-config" 14 | } 15 | ``` 16 | 17 | ## License 18 | 19 | [MIT License](./LICENSE) 20 | -------------------------------------------------------------------------------- /codequality/ts-config/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@merkle-open/ts-config", 3 | "description": "Shared configuration for Typescript", 4 | "version": "1.1.1", 5 | "repository": "https://github.com/merkle-open/frontend-defaults", 6 | "main": "./tsconfig.json", 7 | "license": "MIT", 8 | "author": "Merkle Inc.", 9 | "private": false, 10 | "engines": { 11 | "node": ">=14" 12 | }, 13 | "files": [ 14 | "README.md", 15 | "LICENSE", 16 | "tsconfig.json" 17 | ], 18 | "peerDependencies": { 19 | "typescript": ">= 3 < 6" 20 | } 21 | } 22 | -------------------------------------------------------------------------------- /codequality/ts-config/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "allowSyntheticDefaultImports": true, 4 | "allowUnreachableCode": false, 5 | "jsx": "react", 6 | "sourceMap": true, 7 | "target": "es5", 8 | "module": "esnext", 9 | "moduleResolution": "node", 10 | "emitDecoratorMetadata": true, 11 | "experimentalDecorators": true, 12 | "declaration": true, 13 | "noImplicitAny": false, 14 | "noImplicitReturns": true, 15 | "strictNullChecks": true, 16 | "importHelpers": true, 17 | "skipLibCheck": true, 18 | "lib": ["es2015", "es2016", "es2017", "es2018", "dom"] 19 | }, 20 | "exclude": ["dist", "build", "node_modules"] 21 | } 22 | -------------------------------------------------------------------------------- /doc/README.md: -------------------------------------------------------------------------------- 1 | # Readme - Frontend 2 | 3 | Introduction ... 4 | 5 | ## Overview 6 | 7 | ### Customer-Objectives 8 | 9 | - ... 10 | - ... 11 | 12 | ### Concepts 13 | 14 | - Layout/Grid: ... 15 | - Languages: ... 16 | - Accessibility: ... 17 | - SEO: ... 18 | - Tracking: ... 19 | - Security: ... 20 | - Sharing ... 21 | - Screen Resolutions/Images: ... 22 | - Print: ... 23 | 24 | ### Testing 25 | 26 | - Browser Test Matrix: ... 27 | - Linting: ... 28 | - Unit testing (pattern, visual, snapshot ...): ... 29 | - Browser testing (e2e, ...): ... 30 | - Automated testing: ... 31 | 32 | ## Development 33 | 34 | ### URL 35 | 36 | - Specification: ... 37 | - Wireframes: ... 38 | - Styleguide: ... 39 | - CVS: ... 40 | - Jira: ... 41 | - Prototype: ... 42 | - Build: ... 43 | 44 | ### Guidelines 45 | 46 | - [Code Guidelines](./project/docs/___.md) 47 | - Folder structure: ... 48 | - Patterns: ... 49 | - Dependencies: ... 50 | - Progressive enhancement: ... 51 | - Commit messages: ... 52 | 53 | ### Knowledge 54 | 55 | 56 | 57 | - ... 58 | 59 | ### Tech 60 | 61 | - HTML Head: ... 62 | - Libraries: ... 63 | - Clientside Storage: ... 64 | - Licences: ... 65 | - Performance-Budget: ... 66 | - Interfaces/API: ... 67 | - Documentation: ... 68 | 69 | ### Design 70 | 71 | - Sources: ... 72 | - Webfonts: ... 73 | - Icons: ... 74 | - Touch Icons: ... 75 | 76 | ## Setup 77 | 78 | - [Setup Info](./project/docs/___.md) 79 | - Development in branch develop 80 | 81 | ## Integration/Deployment 82 | 83 | - Protocols: ... 84 | - Minification & Compression: ... 85 | 86 | ... 87 | -------------------------------------------------------------------------------- /editorconfig/.editorconfig: -------------------------------------------------------------------------------- 1 | # EditorConfig. Frontend. Default. 2 | # @see: http://EditorConfig.org 3 | # install a plugin to your editor: http://editorconfig.org/#download 4 | # mark: not all plugins supports the same EditorConfig properties 5 | 6 | # This is the top-most .editorconfig file (do not search in parent directories) 7 | root = true 8 | 9 | ### All files 10 | [*] 11 | # Force charset utf-8 12 | charset = utf-8 13 | # Force newline ending every file & trim trailing whitespace 14 | insert_final_newline = true 15 | trim_trailing_whitespace = true 16 | # Indentation 17 | indent_style = tab 18 | indent_size = 4 19 | 20 | ### Frontend files 21 | [*.{css,scss,less,js,json,jsx,ts,tsx,sass,php,hbs,mustache,phtml,html,twig}] 22 | 23 | ### Markdown 24 | [*.{md,mdx}] 25 | indent_style = space 26 | indent_size = 2 27 | trim_trailing_whitespace = false 28 | 29 | ### YAML 30 | [*.{yml,yaml}] 31 | indent_style = space 32 | indent_size = 2 33 | 34 | ### Storybook stories 35 | [*.stories.{ts,tsx}] 36 | indent_style = space 37 | indent_size = 2 38 | 39 | ### Specific files 40 | [{package,bower,lerna}.json] 41 | indent_style = space 42 | indent_size = 2 43 | -------------------------------------------------------------------------------- /editorconfig/README.md: -------------------------------------------------------------------------------- 1 | # editorconfig 2 | 3 | [Infos](http://editorconfig.org/) 4 | 5 | Reason: Configures the editor 6 | 7 | - force charset & newline styles 8 | - set defaults 9 | 10 | Place file [.editorconfig](./.editorconfig) in root of every project, customize it to your needs and add it to the git repository. 11 | -------------------------------------------------------------------------------- /lerna.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "node_modules/lerna/schemas/lerna-schema.json", 3 | "packages": ["codequality/*", "repo/*"], 4 | "version": "independent" 5 | } 6 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "frontend-defaults", 3 | "version": "1.0.0", 4 | "license": "MIT", 5 | "repository": "https://github.com/merkle-open/frontend-defaults", 6 | "private": true, 7 | "author": "Merkle Inc.", 8 | "workspaces": [ 9 | "codequality/*", 10 | "repo/*" 11 | ], 12 | "scripts": { 13 | "update-dependencies": "npm-run-all --parallel update-dependencies:*", 14 | "update-dependencies:packages": "lerna exec -- npm-check-updates -u --deprecated", 15 | "update-dependencies:root": "npm-check-updates -u --deprecated", 16 | "clean": "npx -y npm-run-all --npm-path npm clean:*", 17 | "clean:lock": "npx -y rimraf --glob **/package-lock.json", 18 | "clean:modules": "npm exec --workspaces -- npx -y rimraf node_modules && npx -y rimraf node_modules", 19 | "cz": "git-cz", 20 | "prepare": "husky", 21 | "prettier": "prettier --write \"**/*.*(js|jsx|ts|tsx|json|css|scss|md|mdx|graphql|gql|yml|yaml)\"", 22 | "test": "lerna run test", 23 | "lint": "lerna run lint", 24 | "prerelease": "npm-run-all test lint", 25 | "release": "lerna publish --conventional-commits --no-commit-hooks --allow-branch master", 26 | "start": "npm run test" 27 | }, 28 | "lint-staged": { 29 | "codequality/*.*{js,jsx,ts,tsx,json,md,mdx,graphql,gql,yml,yaml}": [ 30 | "prettier --write" 31 | ], 32 | "doc/*.*{js,jsx,ts,tsx,json,md,mdx,graphql,gql,yml,yaml}": [ 33 | "prettier --write" 34 | ], 35 | "editorconfig/*.*{js,jsx,ts,tsx,json,md,mdx,graphql,gql,yml,yaml}": [ 36 | "prettier --write" 37 | ], 38 | "repo/*.*{js,jsx,ts,tsx,json,md,mdx,graphql,gql,yml,yaml}": [ 39 | "prettier --write" 40 | ] 41 | }, 42 | "commitlint": { 43 | "extends": [ 44 | "./repo/commitlint-conventional-changelog" 45 | ] 46 | }, 47 | "config": { 48 | "commitizen": { 49 | "path": "./repo/cz-conventional-changelog" 50 | } 51 | }, 52 | "devDependencies": { 53 | "@commitlint/cli": "18.6.1", 54 | "commitizen": "4.3.1", 55 | "conventional-changelog": "5.1.0", 56 | "husky": "9.1.7", 57 | "lerna": "8.2.1", 58 | "lint-staged": "15.5.0", 59 | "npm-run-all": "4.1.5", 60 | "npm-check-updates": "17.1.16", 61 | "prettier": "3.5.3", 62 | "rimraf": "5.0.10" 63 | } 64 | } 65 | -------------------------------------------------------------------------------- /repo/commitlint-conventional-changelog/.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | Thumbs.db 4 | 5 | # IDE 6 | .idea 7 | .vscode 8 | 9 | # Node 10 | /node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | lerna-debug.log 14 | 15 | coverage -------------------------------------------------------------------------------- /repo/commitlint-conventional-changelog/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | ## [1.0.8](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/commitlint-conventional-changelog@1.0.7...@merkle-open/commitlint-conventional-changelog@1.0.8) (2024-07-23) 7 | 8 | **Note:** Version bump only for package @merkle-open/commitlint-conventional-changelog 9 | 10 | 11 | 12 | 13 | 14 | ## [1.0.7](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/commitlint-conventional-changelog@1.0.6...@merkle-open/commitlint-conventional-changelog@1.0.7) (2024-01-08) 15 | 16 | **Note:** Version bump only for package @merkle-open/commitlint-conventional-changelog 17 | 18 | 19 | 20 | 21 | 22 | ## [1.0.6](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/commitlint-conventional-changelog@1.0.5...@merkle-open/commitlint-conventional-changelog@1.0.6) (2023-09-01) 23 | 24 | **Note:** Version bump only for package @merkle-open/commitlint-conventional-changelog 25 | 26 | 27 | 28 | 29 | 30 | ## [1.0.5](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/commitlint-conventional-changelog@1.0.4...@merkle-open/commitlint-conventional-changelog@1.0.5) (2023-07-29) 31 | 32 | **Note:** Version bump only for package @merkle-open/commitlint-conventional-changelog 33 | 34 | 35 | 36 | 37 | 38 | ## [1.0.4](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/commitlint-conventional-changelog@1.0.3...@merkle-open/commitlint-conventional-changelog@1.0.4) (2023-06-27) 39 | 40 | **Note:** Version bump only for package @merkle-open/commitlint-conventional-changelog 41 | 42 | 43 | 44 | 45 | 46 | ## [1.0.3](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/commitlint-conventional-changelog@1.0.2...@merkle-open/commitlint-conventional-changelog@1.0.3) (2023-04-13) 47 | 48 | **Note:** Version bump only for package @merkle-open/commitlint-conventional-changelog 49 | 50 | 51 | 52 | 53 | 54 | ## [1.0.2](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/commitlint-conventional-changelog@1.0.1...@merkle-open/commitlint-conventional-changelog@1.0.2) (2023-04-08) 55 | 56 | **Note:** Version bump only for package @merkle-open/commitlint-conventional-changelog 57 | 58 | 59 | 60 | 61 | 62 | ## [1.0.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/commitlint-conventional-changelog@1.0.0...@merkle-open/commitlint-conventional-changelog@1.0.1) (2023-02-18) 63 | 64 | **Note:** Version bump only for package @merkle-open/commitlint-conventional-changelog 65 | 66 | 67 | 68 | 69 | 70 | 71 | # 1.0.0 (2022-11-22) 72 | 73 | **Note:** Inital release 74 | -------------------------------------------------------------------------------- /repo/commitlint-conventional-changelog/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Merkle Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /repo/commitlint-conventional-changelog/README.md: -------------------------------------------------------------------------------- 1 | # Shared commitlint config [![npm version](https://img.shields.io/npm/v/@merkle-open/commitlint-conventional-changelog.svg)](https://www.npmjs.org/package/@merkle-open/commitlint-conventional-changelog) 2 | 3 | > Shareable `commitlint` config enforcing [conventional commits](https://conventionalcommits.org/). 4 | 5 | ## Usage 6 | 7 | `npm install --save-dev husky @commitlint/cli @merkle-open/commitlint-conventional-changelog` 8 | 9 | **package.json** 10 | 11 | ```json 12 | ... 13 | "husky": { 14 | "hooks": { 15 | "commit-msg": "commitlint -E HUSKY_GIT_PARAMS" 16 | }, 17 | ... 18 | }, 19 | "commitlint": { 20 | "extends": [ 21 | "@merkle-open/commitlint-conventional-changelog" 22 | ] 23 | }, 24 | ... 25 | ``` 26 | 27 | ## License 28 | 29 | [MIT License](./LICENSE) 30 | -------------------------------------------------------------------------------- /repo/commitlint-conventional-changelog/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | rules: { 3 | 'body-leading-blank': [1, 'always'], 4 | 'footer-leading-blank': [1, 'always'], 5 | 'header-max-length': [2, 'always', 120], 6 | 'scope-case': [2, 'always', 'lower-case'], 7 | 'subject-case': [2, 'never', ['sentence-case', 'start-case', 'pascal-case', 'upper-case']], 8 | 'subject-empty': [2, 'never'], 9 | 'subject-full-stop': [2, 'never', '.'], 10 | 'type-case': [2, 'always', 'lower-case'], 11 | 'type-empty': [2, 'never'], 12 | 'type-enum': [ 13 | 2, 14 | 'always', 15 | ['build', 'chore', 'ci', 'docs', 'feat', 'fix', 'perf', 'refactor', 'revert', 'style', 'test'], 16 | ], 17 | }, 18 | }; 19 | -------------------------------------------------------------------------------- /repo/commitlint-conventional-changelog/index.spec.js: -------------------------------------------------------------------------------- 1 | const lint = require('@commitlint/lint').default; 2 | const rules = require('./index').rules; 3 | 4 | describe('commitlint', () => { 5 | test('chore(test): message => valid'.replace(/\n/g, ' '), async () => { 6 | const { valid } = await lint('chore(test): message', rules); 7 | expect(valid).toBe(true); 8 | }); 9 | test('chore: message => valid'.replace(/\n/g, ' '), async () => { 10 | const { valid } = await lint('chore: message', rules); 11 | expect(valid).toBe(true); 12 | }); 13 | test('chore(scope): message\n\ndetails\n\nBREAKING CHANGE: something => valid'.replace(/\n/g, ' '), async () => { 14 | const { valid } = await lint('chore(scope): message\n\ndetails\n\nBREAKING CHANGE: something', rules); 15 | expect(valid).toBe(true); 16 | }); 17 | test('chore(scope): message\n\nBREAKING CHANGE: something => valid'.replace(/\n/g, ' '), async () => { 18 | const { valid } = await lint('chore(scope): message\n\nBREAKING CHANGE: something', rules); 19 | expect(valid).toBe(true); 20 | }); 21 | test('chore(scope): message [ISSUE-1234] => valid'.replace(/\n/g, ' '), async () => { 22 | const { valid } = await lint('chore(scope): message [ISSUE-1234]', rules); 23 | expect(valid).toBe(true); 24 | }); 25 | test(' : message => invalid'.replace(/\n/g, ' '), async () => { 26 | const { errors, valid } = await lint(' : message', rules); 27 | expect(valid).toBe(false); 28 | expect(errors.map(({ name }) => name)).toEqual(['subject-empty', 'type-empty']); 29 | }); 30 | test('bugfix: message => invalid'.replace(/\n/g, ' '), async () => { 31 | const { errors, valid } = await lint('bugfix: message', rules); 32 | expect(valid).toBe(false); 33 | expect(errors.map(({ name }) => name)).toEqual(['type-enum']); 34 | }); 35 | test('chore: Message => invalid'.replace(/\n/g, ' '), async () => { 36 | const { errors, valid } = await lint('chore: Message', rules); 37 | expect(valid).toBe(false); 38 | expect(errors.map(({ name }) => name)).toEqual(['subject-case']); 39 | }); 40 | }); 41 | -------------------------------------------------------------------------------- /repo/commitlint-conventional-changelog/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@merkle-open/commitlint-conventional-changelog", 3 | "version": "1.0.8", 4 | "repository": "https://github.com/merkle-open/frontend-defaults", 5 | "author": "Merkle Inc.", 6 | "description": "Shareable commitlint config enforcing conventional commits", 7 | "main": "index.js", 8 | "license": "MIT", 9 | "private": false, 10 | "files": [ 11 | "README.md", 12 | "LICENSE", 13 | "index.js" 14 | ], 15 | "peerDependencies": { 16 | "@commitlint/cli": ">= 8.0.0", 17 | "husky": ">=4.0.0" 18 | }, 19 | "devDependencies": { 20 | "@commitlint/lint": "18.6.1", 21 | "jest": "29.7.0" 22 | }, 23 | "commitlint": { 24 | "extends": [ 25 | "./index.js" 26 | ] 27 | }, 28 | "scripts": { 29 | "prepublishOnly": "npm test", 30 | "test": "jest --forceExit --detectOpenHandles", 31 | "watch-test": "jest --watchAll" 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /repo/cz-conventional-changelog/.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | Thumbs.db 4 | 5 | # IDE 6 | .idea 7 | .vscode 8 | 9 | # Node 10 | /node_modules 11 | npm-debug.log 12 | yarn-error.log 13 | lerna-debug.log -------------------------------------------------------------------------------- /repo/cz-conventional-changelog/CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Change Log 2 | 3 | All notable changes to this project will be documented in this file. 4 | See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. 5 | 6 | ## [1.1.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/cz-conventional-changelog@1.1.0...@merkle-open/cz-conventional-changelog@1.1.1) (2024-07-23) 7 | 8 | **Note:** Version bump only for package @merkle-open/cz-conventional-changelog 9 | 10 | 11 | 12 | 13 | 14 | # [1.1.0](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/cz-conventional-changelog@1.0.4...@merkle-open/cz-conventional-changelog@1.1.0) (2023-07-29) 15 | 16 | 17 | ### Bug Fixes 18 | 19 | * **cz-conventional-changelog:** update word-wrap ([7782c16](https://github.com/merkle-open/frontend-defaults/commit/7782c161144216c6dc27da60f292a28cd9c0efaa)) 20 | 21 | 22 | ### Features 23 | 24 | * **prettier:** add compatibility with prettier 3 ([436325e](https://github.com/merkle-open/frontend-defaults/commit/436325ebcf56d41069a9295f076862ec67fdd5bd)) 25 | 26 | 27 | 28 | 29 | 30 | ## [1.0.4](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/cz-conventional-changelog@1.0.3...@merkle-open/cz-conventional-changelog@1.0.4) (2023-06-27) 31 | 32 | **Note:** Version bump only for package @merkle-open/cz-conventional-changelog 33 | 34 | 35 | 36 | 37 | 38 | ## [1.0.3](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/cz-conventional-changelog@1.0.2...@merkle-open/cz-conventional-changelog@1.0.3) (2023-04-13) 39 | 40 | **Note:** Version bump only for package @merkle-open/cz-conventional-changelog 41 | 42 | 43 | 44 | 45 | 46 | ## [1.0.2](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/cz-conventional-changelog@1.0.1...@merkle-open/cz-conventional-changelog@1.0.2) (2023-04-08) 47 | 48 | **Note:** Version bump only for package @merkle-open/cz-conventional-changelog 49 | 50 | 51 | 52 | 53 | 54 | ## [1.0.1](https://github.com/merkle-open/frontend-defaults/compare/@merkle-open/cz-conventional-changelog@1.0.0...@merkle-open/cz-conventional-changelog@1.0.1) (2023-02-18) 55 | 56 | **Note:** Version bump only for package @merkle-open/cz-conventional-changelog 57 | 58 | 59 | 60 | 61 | 62 | 63 | # 1.0.0 (2022-11-22) 64 | 65 | **Note:** Inital release 66 | -------------------------------------------------------------------------------- /repo/cz-conventional-changelog/LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2018 Merkle Inc. 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /repo/cz-conventional-changelog/README.md: -------------------------------------------------------------------------------- 1 | # Shared commitizen conventional changelog config [![npm version](https://img.shields.io/npm/v/@merkle-open/cz-conventional-changelog.svg)](https://www.npmjs.org/package/@merkle-open/cz-conventional-changelog) 2 | 3 | > reusable commitizen conventional changelog config 4 | 5 | ## Usage 6 | 7 | `npm install --save-dev commitizen @merkle-open/cz-conventional-changelog` 8 | 9 | **package.json** 10 | 11 | ```json 12 | ... 13 | "scripts": { 14 | "cz": "git-cz", 15 | ... 16 | }, 17 | "config": { 18 | "commitizen": { 19 | "path": "@merkle-open/cz-conventional-changelog" 20 | } 21 | }, 22 | ... 23 | ``` 24 | 25 | Part of the [commitizen](https://github.com/commitizen/cz-cli) family. Prompts for [conventional changelog](https://github.com/conventional-changelog/conventional-changelog) standard. 26 | 27 | ## License 28 | 29 | [MIT License](./LICENSE) 30 | -------------------------------------------------------------------------------- /repo/cz-conventional-changelog/engine.js: -------------------------------------------------------------------------------- 1 | 'format cjs'; 2 | 3 | const wrap = require('word-wrap'); 4 | const map = require('lodash.map'); 5 | const longest = require('longest'); 6 | const rightPad = require('right-pad'); 7 | 8 | const filter = function (array) { 9 | return array.filter(function (x) { 10 | return x; 11 | }); 12 | }; 13 | 14 | const requiredInput = (value) => Boolean(typeof value === 'string' && value !== ''); 15 | const addTicket = (ticket) => (ticket && ticket !== '' ? ` [${ticket.trim()}]` : ''); 16 | 17 | // This can be any kind of SystemJS compatible module. 18 | // We use Commonjs here, but ES6 or AMD would do just 19 | // fine. 20 | module.exports = function (options) { 21 | const types = options.types; 22 | 23 | const length = longest(Object.keys(types)).length + 1; 24 | const choices = map(types, function (type, key) { 25 | return { 26 | name: rightPad(key + ':', length) + ' ' + type.description, 27 | value: key, 28 | }; 29 | }); 30 | 31 | return { 32 | // When a user runs `git cz`, prompter will 33 | // be executed. We pass you cz, which currently 34 | // is just an instance of inquirer.js. Using 35 | // this you can ask questions and get answers. 36 | // 37 | // The commit callback should be executed when 38 | // you're ready to send back a commit template 39 | // to git. 40 | // 41 | // By default, we'll de-indent your commit 42 | // template and will keep empty lines. 43 | prompter: function (cz, commit) { 44 | console.log( 45 | '\nLine 1 will be cropped at 120 characters. All other lines will be wrapped after 120 characters.\n', 46 | ); 47 | 48 | // Let's ask some questions of the user 49 | // so that we can populate our commit 50 | // template. 51 | // 52 | // See inquirer.js docs for specifics. 53 | // You can also opt to use another input 54 | // collection library if you prefer. 55 | cz.prompt([ 56 | { 57 | type: 'list', 58 | name: 'type', 59 | message: "Select the type of change that you're committing:", 60 | choices: choices, 61 | }, 62 | { 63 | type: 'input', 64 | name: 'scope', 65 | message: 'What is the scope of this change (e.g. component or file name)? (press enter to skip)\n', 66 | }, 67 | { 68 | type: 'input', 69 | name: 'ticket', 70 | message: 'Add ticket number (e.g. "PROJECT-1234".):\n', 71 | }, 72 | { 73 | type: 'input', 74 | name: 'subject', 75 | message: 'Write a short, imperative tense description of the change:\n', 76 | validate: requiredInput, 77 | }, 78 | { 79 | type: 'input', 80 | name: 'body', 81 | message: 'Provide a longer description of the change: (press enter to skip)\n', 82 | }, 83 | { 84 | type: 'confirm', 85 | name: 'isBreaking', 86 | message: 'Are there any breaking changes?', 87 | default: false, 88 | }, 89 | { 90 | type: 'input', 91 | name: 'breaking', 92 | message: 'Describe the breaking changes:\n', 93 | validate: requiredInput, 94 | when: function (answers) { 95 | return answers.isBreaking; 96 | }, 97 | }, 98 | ]).then(function (answers) { 99 | const maxLineWidth = 120; 100 | 101 | const wrapOptions = { 102 | trim: true, 103 | newline: '\n', 104 | indent: '', 105 | width: maxLineWidth, 106 | }; 107 | 108 | // parentheses are only needed when a scope is present 109 | let scope = answers.scope.trim(); 110 | scope = scope ? '(' + answers.scope.trim() + ')' : ''; 111 | 112 | // Apply breaking change prefix, removing it if already present 113 | let breaking = answers.breaking ? answers.breaking.trim() : ''; 114 | breaking = breaking ? 'BREAKING CHANGE: ' + breaking.replace(/^BREAKING CHANGE: /, '') : ''; 115 | breaking = wrap(breaking, wrapOptions); 116 | 117 | const head = `${answers.type}${scope}: ${answers.subject.trim()}${addTicket(answers.ticket)}`.slice( 118 | 0, 119 | maxLineWidth, 120 | ); 121 | const body = wrap(answers.body, wrapOptions); 122 | const footer = filter([breaking]).join('\n\n'); 123 | 124 | commit(head + '\n\n' + body + '\n\n' + footer); 125 | }); 126 | }, 127 | }; 128 | }; 129 | -------------------------------------------------------------------------------- /repo/cz-conventional-changelog/index.js: -------------------------------------------------------------------------------- 1 | 'format cjs'; 2 | 3 | const engine = require('./engine'); 4 | const conventionalCommitTypes = require('conventional-commit-types'); 5 | 6 | module.exports = engine({ 7 | types: conventionalCommitTypes.types, 8 | }); 9 | -------------------------------------------------------------------------------- /repo/cz-conventional-changelog/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@merkle-open/cz-conventional-changelog", 3 | "version": "1.1.1", 4 | "repository": "https://github.com/merkle-open/frontend-defaults", 5 | "author": "Merkle Inc.", 6 | "description": "Commitizen adapter following the conventional-changelog format.", 7 | "main": "index.js", 8 | "license": "MIT", 9 | "private": false, 10 | "engines": { 11 | "node": ">=14" 12 | }, 13 | "files": [ 14 | "README.md", 15 | "LICENSE", 16 | "index.js", 17 | "engine.js" 18 | ], 19 | "dependencies": { 20 | "conventional-commit-types": "3.0.0", 21 | "lodash.map": "4.6.0", 22 | "longest": "2.0.1", 23 | "right-pad": "1.0.1", 24 | "word-wrap": "1.2.5" 25 | }, 26 | "peerDependencies": { 27 | "commitizen": "4.x" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /repo/gitattributes/.gitattributes: -------------------------------------------------------------------------------- 1 | # Set default behaviour, in case users don't have core.autocrlf set. 2 | * text=auto 3 | 4 | # Explicitly declare text files we want to always be normalized and converted 5 | # to native line endings on checkout. 6 | *.sh text eol=lf 7 | *.pp text eol=lf 8 | *.rb text eol=lf 9 | *.yaml text eol=lf 10 | *.bash_aliases text eol=lf 11 | 12 | # Denote all files that are truly binary and should not be modified. 13 | *.eot binary 14 | *.ttf binary 15 | *.woff binary 16 | *.woff2 binary 17 | 18 | # Windows-specific files get windows endings 19 | *.bat eol=crlf 20 | *.cmd eol=crlf 21 | *-windows.tmpl eol=crlf 22 | -------------------------------------------------------------------------------- /repo/gitattributes/README.md: -------------------------------------------------------------------------------- 1 | # gitattributes 2 | 3 | [Infos](http://git-scm.com/book/en/Customizing-Git-Git-Attributes) 4 | 5 | Reason: 6 | 7 | - Force line ending normalization 8 | - Language specific diffs 9 | - Normalize tabs vs spaces 10 | - Set Defaults 11 | 12 | Place file '[.gitattributes](./.gitattributes)' in root of every project and add it to git. 13 | Optional: Place file in user home (\$HOME/.gitconfig) for global defaults. 14 | -------------------------------------------------------------------------------- /repo/gitignore/.gitignore: -------------------------------------------------------------------------------- 1 | # OS 2 | .DS_Store 3 | Thumbs.db 4 | 5 | # IDE 6 | _.* 7 | .project 8 | .idea 9 | /*.iml 10 | .vscode 11 | .cache 12 | !*.cache 13 | .settings 14 | !*.settings 15 | .config 16 | !*.config 17 | .buildpath 18 | .metadata 19 | .tmp* 20 | *.prefs 21 | .deployables 22 | atlassian-ide-plugin.xml 23 | 24 | # Node 25 | node_modules 26 | npm-debug.log 27 | yarn-error.log 28 | lerna-debug.log 29 | 30 | # allow 31 | !.gitkeep 32 | 33 | # build 34 | dist 35 | build 36 | .next 37 | -------------------------------------------------------------------------------- /repo/gitignore/README.md: -------------------------------------------------------------------------------- 1 | # gitignore 2 | 3 | [Infos](http://git-scm.com/book/en/Customizing-Git-Git-Attributes) 4 | 5 | Reason: 6 | 7 | - Ignore files and folder 8 | 9 | Place file '[.gitignore](./.gitignore)' in root of every project, customize it to your needs and add it to the git repository. 10 | --------------------------------------------------------------------------------