Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-21 11:35:34 +01:00
Code Issues Projects Releases Wiki Activity

[EC-1051] Add TailwindCSS linting rules (#4605)

Browse Source
This commit is contained in:
Thomas Rittson 2023-02-03 07:27:08 +10:00 committed by GitHub
parent d3539a4a44
commit cc5c753e30
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
15 changed files with 68 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
.eslintrc.json
View File

@ -111,9 +111,20 @@
{
"files": ["*.html"],
"parser": "@angular-eslint/template-parser",
"plugins": ["@angular-eslint/template"],
"plugins": ["@angular-eslint/template", "tailwindcss"],
"rules": {
"@angular-eslint/template/button-has-type": "error"
"@angular-eslint/template/button-has-type": "error",
"tailwindcss/no-custom-classname": [
"error",
{
// uses negative lookahead to whitelist any class that doesn't start with "tw-"
// in other words: classnames that start with tw- must be valid TailwindCSS classes
"whitelist": ["(?!(tw)\\-).*"]
}
],
"tailwindcss/enforces-negative-arbitrary-values": "error",
"tailwindcss/enforces-shorthand": "error",
"tailwindcss/no-contradicting-classname": "error"
}
},
{

2
apps/web/src/app/accounts/login/login-with-device.component.html
View File

@ -1,3 +1,5 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<div
class="tw-mx-auto tw-mt-5 tw-flex tw-max-w-lg tw-flex-col tw-items-center tw-justify-center tw-p-8"
>

2
apps/web/src/app/accounts/register-form/register-form.component.html
View File

@ -1,3 +1,5 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<form
#form
(ngSubmit)="submit()"

1
apps/web/src/app/accounts/trial-initiation/trial-initiation.component.html
View File

@ -1,5 +1,6 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable @angular-eslint/template/button-has-type -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<div *ngIf="accountCreateOnly" class="">
<h1 class="tw-mt-12 tw-text-center tw-text-xl">{{ "createAccount" | i18n }}</h1>
<div

1
apps/web/src/app/accounts/trial-initiation/vertical-stepper/vertical-step-content.component.html
View File

@ -1,5 +1,6 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable @angular-eslint/template/button-has-type -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<div class="tw-m-2.5 tw-h-16 tw-text-center">
<button
(click)="selectStep()"

2
apps/web/src/app/components/user-verification-prompt.component.html
View File

@ -3,7 +3,7 @@
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="confirmUserTitle">
<div class="modal-dialog modal-dialog-scrollable" role="document">
<form class="modal-content" #form (ngSubmit)="submit()">
<h2 class="tw-mt-6 tw-mb-6 tw-pl-3.5 tw-pr-3.5 tw-font-semibold" id="modalTitle | i18n ">
<h2 class="tw-my-6 tw-px-3.5 tw-font-semibold" id="modalTitle | i18n ">
{{ modalTitle | i18n | uppercase }}
</h2>
<div class="tw-border-0 tw-border-t tw-border-solid tw-border-secondary-300 tw-p-3.5">

4
apps/web/src/app/organizations/shared/components/access-selector/access-selector.component.html
View File

@ -1,3 +1,5 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<div class="tw-flex">
<bit-form-field *ngIf="permissionMode == 'edit'" class="tw-mr-3">
<bit-label>{{ "permission" | i18n }}</bit-label>
@ -100,7 +102,7 @@
</select>
<label
[for]="'permission' + i"
class="tw-absolute tw-inset-y-0 tw-right-4 tw-mb-0 tw-block tw-flex tw-items-center"
class="tw-absolute tw-inset-y-0 tw-right-4 tw-mb-0 tw-flex tw-items-center"
>
<i class="bwi bwi-sm bwi-angle-down tw-leading-[0]"></i>
</label>

6
apps/web/src/app/settings/change-avatar.component.html
View File

@ -1,3 +1,5 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<div class="modal fade" role="dialog" aria-modal="true" aria-labelledby="customizeTitle">
<div class="modal-dialog modal-dialog-scrollable tw-w-[600px] tw-max-w-none" role="document">
<div class="modal-content">
@ -21,7 +23,7 @@
{{ error }}
</app-callout>
<p class="tw-text-lg">{{ "pickAnAvatarColor" | i18n }}</p>
<div class="tw-flex tw-flex-wrap tw-justify-center tw-gap-8 tw-gap-y-8">
<div class="tw-flex tw-flex-wrap tw-justify-center tw-gap-8">
<ng-container *ngFor="let c of defaultColorPalette">
<selectable-avatar
appStopClick
@ -44,7 +46,7 @@
'!tw-outline-[3px] tw-outline-primary-500 hover:tw-outline-[3px] hover:tw-outline-primary-500':
customColorSelected
}"
class="tw-outline-solid tw-bg-white tw-relative tw-inline-block tw-flex tw-h-24 tw-w-24 tw-cursor-pointer tw-place-content-center tw-content-center tw-justify-center tw-rounded-full tw-border tw-border-solid tw-border-secondary-500 tw-outline tw-outline-0 tw-outline-offset-1 hover:tw-outline-1 hover:tw-outline-primary-300 focus:tw-outline-2 focus:tw-outline-primary-500"
class="tw-outline-solid tw-bg-white tw-relative tw-flex tw-h-24 tw-w-24 tw-cursor-pointer tw-place-content-center tw-content-center tw-justify-center tw-rounded-full tw-border tw-border-solid tw-border-secondary-500 tw-outline tw-outline-0 tw-outline-offset-1 hover:tw-outline-1 hover:tw-outline-primary-300 focus:tw-outline-2 focus:tw-outline-primary-500"
[style.background-color]="customColor$ | async"
>
<i

6
apps/web/src/app/tools/import-export/export.component.html
View File

@ -1,3 +1,5 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<form
#form
(ngSubmit)="submit()"
@ -48,7 +50,7 @@
/>
</div>
<div>
<label class="tw-semi-bold tw-text-md tw-ml-1 tw-mt-1 tw-mb-1" for="AccountEncrypted">
<label class="tw-semi-bold tw-text-md tw-my-1 tw-ml-1" for="AccountEncrypted">
{{ "accountRestricted" | i18n }}
</label>
</div>
@ -71,7 +73,7 @@
/>
</div>
<div>
<label class="tw-semi-bold tw-text-md tw-ml-1 tw-mt-1 tw-mb-1" for="FileEncrypted">{{
<label class="tw-semi-bold tw-text-md tw-my-1 tw-ml-1" for="FileEncrypted">{{
"passwordProtected" | i18n
}}</label>
</div>

8
apps/web/src/app/tools/import-export/file-password-prompt.component.html
View File

@ -1,3 +1,5 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<div
class="modal fade"
role="dialog"
@ -7,11 +9,11 @@
<div class="modal-dialog modal-dialog-scrollable" role="document">
<form #form (ngSubmit)="submit()">
<div class="form-group modal-content">
<h2 class="tw-mt-6 tw-mb-6 tw-ml-3.5 tw-font-semibold" id="confirmVaultImport">
<h2 class="tw-my-6 tw-ml-3.5 tw-font-semibold" id="confirmVaultImport">
{{ "confirmVaultImport" | i18n | uppercase }}
</h2>
<div
class="tw-border-0 tw-border-t tw-border-solid tw-border-secondary-300 tw-pr-3.5 tw-pt-3.5 tw-pl-3.5"
class="tw-border-0 tw-border-t tw-border-solid tw-border-secondary-300 tw-px-3.5 tw-pt-3.5"
>
{{ "confirmVaultImportDesc" | i18n }}
<bit-form-field class="tw-pt-3.5">
@ -28,7 +30,7 @@
</bit-form-field>
</div>
<div
class="tw-flex tw-w-full tw-flex-wrap tw-items-center tw-border-0 tw-border-t tw-border-solid tw-border-secondary-300 tw-bg-background-alt tw-pl-3.5 tw-pr-3.5 tw-pb-3.5 tw-pt-4 tw-pl-4 tw-pr-4"
class="tw-flex tw-w-full tw-flex-wrap tw-items-center tw-border-0 tw-border-t tw-border-solid tw-border-secondary-300 tw-bg-background-alt tw-px-3.5 tw-pb-3.5 tw-pt-4"
>
<button bitButton buttonType="primary" class="tw-mr-2" type="submit" appBlurClick>
<span>{{ "importData" | i18n }}</span>

2
apps/web/src/vault/app/vault/add-edit.component.html
View File

@ -282,7 +282,7 @@
</svg>
</span>
<span
class="totp-code tw-mr-2 tw-ml-2 tw-mt-1"
class="totp-code tw-mx-2 tw-mt-1"
title="{{ 'verificationCodeTotp' | i18n }}"
>{{ totpCodeFormatted }}</span
>

1
bitwarden_license/bit-web/src/app/secrets-manager/secrets/dialog/secret-dialog.component.html
View File

@ -1,5 +1,6 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable @angular-eslint/template/button-has-type -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<form [formGroup]="formGroup" [bitSubmit]="submit">
<bit-dialog dialogSize="default" disablePadding>
<ng-container bitDialogTitle>{{ title | i18n }}</ng-container>

2
libs/components/src/table/table.component.html
View File

@ -1,3 +1,5 @@
<!-- Please remove this disable statement when editing this file! -->
<!-- eslint-disable tailwindcss/no-custom-classname -->
<table class="tw-w-full tw-table-auto tw-leading-normal tw-text-main">
<thead
class="tw-text-bold tw-border-0 tw-border-b-2 tw-border-solid tw-border-secondary-300 tw-text-muted"

27
package-lock.json generated
View File

@ -135,6 +135,7 @@
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-rxjs": "^5.0.2",
"eslint-plugin-rxjs-angular": "^2.0.0",
"eslint-plugin-tailwindcss": "^3.8.3",
"gulp": "^4.0.2",
"gulp-filter": "^7.0.0",
"gulp-if": "^3.0.0",
@ -22395,6 +22396,22 @@
"url": "https://github.com/sponsors/sindresorhus"
}
},
"node_modules/eslint-plugin-tailwindcss": {
"version": "3.8.3",
"resolved": "https://registry.npmjs.org/eslint-plugin-tailwindcss/-/eslint-plugin-tailwindcss-3.8.3.tgz",
"integrity": "sha512-wfzfCmc9yONNW+TqfR+QWZ+syFPQ8zMOrIGx500lS4XITEm0HJYGyKh1sC1tQ9+Wmt58bnHzW3Yc31vy5RlJww==",
"dev": true,
"dependencies": {
"fast-glob": "^3.2.5",
"postcss": "^8.4.4"
},
"engines": {
"node": ">=12.13.0"
},
"peerDependencies": {
"tailwindcss": "^3.2.2"
}
},
"node_modules/eslint-scope": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",
@ -60933,6 +60950,16 @@
"tslib": "^2.0.0"
}
},
"eslint-plugin-tailwindcss": {
"version": "3.8.3",
"resolved": "https://registry.npmjs.org/eslint-plugin-tailwindcss/-/eslint-plugin-tailwindcss-3.8.3.tgz",
"integrity": "sha512-wfzfCmc9yONNW+TqfR+QWZ+syFPQ8zMOrIGx500lS4XITEm0HJYGyKh1sC1tQ9+Wmt58bnHzW3Yc31vy5RlJww==",
"dev": true,
"requires": {
"fast-glob": "^3.2.5",
"postcss": "^8.4.4"
}
},
"eslint-scope": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-5.1.1.tgz",

1
package.json
View File

@ -98,6 +98,7 @@
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-rxjs": "^5.0.2",
"eslint-plugin-rxjs-angular": "^2.0.0",
"eslint-plugin-tailwindcss": "^3.8.3",
"gulp": "^4.0.2",
"gulp-filter": "^7.0.0",
"gulp-if": "^3.0.0",