devol
/
bitwarden-estensione-browser
mirror of https://github.com/bitwarden/browser
1
0
Fork 0
Code Issues 1 Releases Wiki Activity

[SM-110] Add prettier-plugin-tailwindcss (#3215)

This commit is contained in:
Oscar Hinton 2022-08-02 08:45:59 +02:00 committed by GitHub
parent 59ce41aabb
commit 379036123f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
26 changed files with 97 additions and 76 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
apps/web/src/app/components/organization-switcher.component.html
View File

@ -1,6 +1,6 @@
<div *ngIf="loaded && activeOrganization != null" class="tw-flex">
<button
class="tw-flex tw-items-center tw-bg-background-alt tw-border-none"
class="tw-flex tw-items-center tw-border-none tw-bg-background-alt"
type="button"
id="pickerButton"
[appA11yTitle]="'organizationPicker' | i18n"
@ -24,7 +24,7 @@
</button>
<div>
<div
class="tw-ml-3 tw-border tw-border-solid tw-rounded tw-border-danger-500 tw-text-danger"
class="tw-ml-3 tw-rounded tw-border tw-border-solid tw-border-danger-500 tw-text-danger"
*ngIf="!activeOrganization.enabled"
>
<div class="tw-py-2 tw-px-5">
@ -33,7 +33,7 @@
</div>
</div>
<div
class="tw-ml-3 tw-border tw-border-solid tw-rounded tw-border-info-500 tw-text-info"
class="tw-ml-3 tw-rounded tw-border tw-border-solid tw-border-info-500 tw-text-info"
*ngIf="activeOrganization.isProviderUser"
>
<div class="tw-py-2 tw-px-5">
@ -44,8 +44,8 @@
</div>
<bit-menu #orgPickerMenu>
<ul aria-labelledby="pickerButton" class="tw-p-0 tw-m-0">
<li *ngFor="let org of organizations" class="tw-list-none tw-flex tw-flex-col" role="none">
<ul aria-labelledby="pickerButton" class="tw-m-0 tw-p-0">
<li *ngFor="let org of organizations" class="tw-flex tw-list-none tw-flex-col" role="none">
<a bitMenuItem [routerLink]="['/organizations', org.id]">
<i
class="bwi bwi-check mr-2"

6
apps/web/src/app/layouts/navbar.component.html
View File

@ -44,9 +44,9 @@
<i class="bwi bwi-caret-down bwi-sm" aria-hidden="true"></i>
</button>
<bit-menu class="dropdown-menu" #accountMenu>
<div class="tw-max-w-[300px] tw-min-w-[200px] tw-flex tw-flex-col">
<div class="tw-flex tw-min-w-[200px] tw-max-w-[300px] tw-flex-col">
<div
class="tw-flex tw-items-center tw-leading-tight tw-text-info tw-py-1 tw-px-4"
class="tw-flex tw-items-center tw-py-1 tw-px-4 tw-leading-tight tw-text-info"
*ngIf="name"
appStopProp
>
@ -59,7 +59,7 @@
></app-avatar>
<div class="tw-ml-2 tw-block tw-overflow-hidden tw-whitespace-nowrap">
<span>{{ "loggedInAs" | i18n }}</span>
<small class="tw-text-muted tw-block tw-overflow-hidden tw-whitespace-nowrap">{{
<small class="tw-block tw-overflow-hidden tw-whitespace-nowrap tw-text-muted">{{
name
}}</small>
</div>

10
apps/web/src/app/modules/register-form/register-form.component.html
View File

@ -90,11 +90,11 @@
<iframe id="hcaptcha_iframe" height="80"></iframe>
</div>
<div class="tw-flex tw-items-start tw-mb-3" *ngIf="showTerms">
<div class="tw-flex tw-items-center tw-h-6">
<div class="tw-mb-3 tw-flex tw-items-start" *ngIf="showTerms">
<div class="tw-flex tw-h-6 tw-items-center">
<input
id="register-form_input_accept-policies"
class="tw-w-4 tw-rounded tw-border tw-border-gray-300"
class="tw-border-gray-300 tw-w-4 tw-rounded tw-border"
bitInput
type="checkbox"
formControlName="acceptPolicies"
@ -112,13 +112,13 @@
</bit-label>
</div>
<div class="tw-flex tw-mb-3">
<div class="tw-mb-3 tw-flex">
<bit-submit-button [loading]="form.loading">{{ "createAccount" | i18n }}</bit-submit-button>
<a
bitButton
buttonType="secondary"
routerLink="/login"
class="tw-inline-flex tw-items-center tw-ml-3 tw-px-3"
class="tw-ml-3 tw-inline-flex tw-items-center tw-px-3"
>
<i class="bwi bwi-sign-in tw-mr-2"></i>
{{ "logIn" | i18n }}

10
apps/web/src/app/modules/trial-initiation/billing.component.html
View File

@ -1,12 +1,12 @@
<form #form [formGroup]="formGroup" [appApiAction]="formPromise" (ngSubmit)="submit()">
<div class="tw-container tw-mb-3">
<div class="tw-mb-6">
<h2 class="tw-text-base tw-font-semibold tw-mb-3">{{ "billingPlanLabel" | i18n }}</h2>
<div class="tw-items-center tw-mb-1" *ngFor="let selectablePlan of selectablePlans">
<label class="tw-block tw- tw-text-main" for="interval{{ selectablePlan.type }}">
<h2 class="tw-mb-3 tw-text-base tw-font-semibold">{{ "billingPlanLabel" | i18n }}</h2>
<div class="tw-mb-1 tw-items-center" *ngFor="let selectablePlan of selectablePlans">
<label class="tw- tw-block tw-text-main" for="interval{{ selectablePlan.type }}">
<input
checked
class="tw-w-4 tw-h-4 tw-align-middle"
class="tw-h-4 tw-w-4 tw-align-middle"
id="interval{{ selectablePlan.type }}"
name="plan"
type="radio"
@ -34,7 +34,7 @@
</div>
<div class="tw-mb-4">
<h2 class="tw-text-base tw-mb-3 tw-font-semibold">{{ "paymentType" | i18n }}</h2>
<h2 class="tw-mb-3 tw-text-base tw-font-semibold">{{ "paymentType" | i18n }}</h2>
<app-payment [hideCredit]="true" [trialFlow]="true"></app-payment>
<app-tax-info [trialFlow]="true" (onCountryChanged)="changedCountry()"></app-tax-info>
</div>

2
apps/web/src/app/modules/trial-initiation/enterprise-content.component.html
View File

@ -3,7 +3,7 @@
<h2>What you can do with Bitwarden for Enterprise</h2>
</div>
<div class="tw-text-3xl tw-text-main tw-mt-12">
<div class="tw-mt-12 tw-text-3xl tw-text-main">
<p class="tw-mt-2.5 tw-mb-20">Collaborate and share securely</p>
<p class="tw-mt-2.5 tw-mb-20">Deploy and manage quickly and easily</p>
<p class="tw-mt-2.5 tw-mb-20">Access anywhere on any device</p>

2
apps/web/src/app/modules/trial-initiation/families-content.component.html
View File

@ -5,7 +5,7 @@
storage and sharing.
</h2>
</div>
<div class="tw-text-3xl tw-text-main tw-mt-12">
<div class="tw-mt-12 tw-text-3xl tw-text-main">
<p class="tw-mt-2.5 tw-mb-20">Collaborate and share securely</p>
<p class="tw-mt-2.5 tw-mb-20">Deploy and manage quickly and easily</p>
<p class="tw-mt-2.5 tw-mb-20">Access anywhere on any device</p>

2
apps/web/src/app/modules/trial-initiation/teams-content.component.html
View File

@ -2,7 +2,7 @@
<div class="tw-pt-24">
<h2>What you can do with Btiwarden for Teams</h2>
</div>
<div class="tw-text-3xl tw-text-main tw-mt-12">
<div class="tw-mt-12 tw-text-3xl tw-text-main">
<p class="tw-mt-2.5 tw-mb-20">Collaborate and share securely</p>
<p class="tw-mt-2.5 tw-mb-20">Deploy and manage quickly and easily</p>
<p class="tw-mt-2.5 tw-mb-20">Access anywhere on any device</p>

18
apps/web/src/app/modules/trial-initiation/trial-initiation.component.html
View File

@ -1,7 +1,7 @@
<div *ngIf="accountCreateOnly" class="">
<h1 class="tw-text-xl tw-text-center tw-mt-12" *ngIf="!layout">{{ "createAccount" | i18n }}</h1>
<h1 class="tw-mt-12 tw-text-center tw-text-xl" *ngIf="!layout">{{ "createAccount" | i18n }}</h1>
<div
class="tw-m-auto tw-rounded tw-border tw-border-solid tw-bg-background tw-border-secondary-300 tw-min-w-xl tw-max-w-xl tw-p-8"
class="tw-min-w-xl tw-m-auto tw-max-w-xl tw-rounded tw-border tw-border-solid tw-border-secondary-300 tw-bg-background tw-p-8"
>
<app-register-form
[queryParamEmail]="email"
@ -11,9 +11,9 @@
</div>
<div *ngIf="!accountCreateOnly">
<div
class="tw-bg-background-alt2 tw-h-96 tw--mt-48 tw-absolute tw--skew-y-3 tw-w-full tw--z-10"
class="tw-absolute tw--z-10 tw--mt-48 tw-h-96 tw-w-full tw--skew-y-3 tw-bg-background-alt2"
></div>
<div class="tw-flex tw-max-w-screen-xl tw-min-w-4xl tw-mx-auto tw-px-4">
<div class="tw-min-w-4xl tw-mx-auto tw-flex tw-max-w-screen-xl tw-px-4">
<div class="tw-w-1/2">
<img
alt="Bitwarden"
@ -33,9 +33,9 @@
</div>
<div class="tw-w-1/2">
<div class="tw-pt-56">
<div class="tw-rounded tw-border tw-border-solid tw-bg-background tw-border-secondary-300">
<div class="tw-h-12 tw-flex tw-items-center tw-rounded-t tw-bg-secondary-100 tw-w-full">
<h2 class="tw-uppercase tw-pl-4 tw-text-base tw-mb-0 tw-font-bold">
<div class="tw-rounded tw-border tw-border-solid tw-border-secondary-300 tw-bg-background">
<div class="tw-flex tw-h-12 tw-w-full tw-items-center tw-rounded-t tw-bg-secondary-100">
<h2 class="tw-mb-0 tw-pl-4 tw-text-base tw-font-bold tw-uppercase">
Start your 7-Day free trial of Bitwarden for {{ org }}
</h2>
</div>
@ -72,7 +72,7 @@
[email]="email"
[orgLabel]="orgLabel"
></app-trial-confirmation-details>
<div class="tw-flex tw-mb-3">
<div class="tw-mb-3 tw-flex">
<button bitButton buttonType="primary" (click)="navigateToOrgVault()">
Get Started
</button>
@ -80,7 +80,7 @@
bitButton
buttonType="secondary"
(click)="navigateToOrgInvite()"
class="tw-inline-flex tw-items-center tw-ml-3 tw-px-3"
class="tw-ml-3 tw-inline-flex tw-items-center tw-px-3"
>
Invite Users
</button>

10
apps/web/src/app/modules/vault-filter/components/organization-options.component.html
View File

@ -8,12 +8,12 @@
</ng-container>
<div
*ngIf="loaded"
class="tw-max-w-[300px] tw-min-w-[200px] tw-flex tw-flex-col"
class="tw-flex tw-min-w-[200px] tw-max-w-[300px] tw-flex-col"
[appApiAction]="actionPromise"
>
<button
*ngIf="allowEnrollmentChanges(organization) && !organization.resetPasswordEnrolled"
class="!tw-text-main active:!tw-ring-0 active:!tw-ring-offset-0 focus:tw-bg-secondary-100 focus:tw-outline-none focus:tw-ring focus:tw-ring-offset-2 focus:tw-ring-primary-700 focus:tw-z-50 hover:tw-bg-secondary-100 tw-bg-background tw-block tw-border-none tw-cursor-pointer tw-px-4 tw-py-2 tw-text-left"
class="tw-block tw-cursor-pointer tw-border-none tw-bg-background tw-px-4 tw-py-2 tw-text-left !tw-text-main hover:tw-bg-secondary-100 focus:tw-z-50 focus:tw-bg-secondary-100 focus:tw-outline-none focus:tw-ring focus:tw-ring-primary-700 focus:tw-ring-offset-2 active:!tw-ring-0 active:!tw-ring-offset-0"
(click)="toggleResetPasswordEnrollment(organization)"
>
<i class="bwi bwi-fw bwi-key" aria-hidden="true"></i>
@ -21,7 +21,7 @@
</button>
<button
*ngIf="allowEnrollmentChanges(organization) && organization.resetPasswordEnrolled"
class="!tw-text-main active:!tw-ring-0 active:!tw-ring-offset-0 focus:tw-bg-secondary-100 focus:tw-outline-none focus:tw-ring focus:tw-ring-offset-2 focus:tw-ring-primary-700 focus:tw-z-50 hover:tw-bg-secondary-100 tw-bg-background tw-block tw-border-none tw-cursor-pointer tw-px-4 tw-py-2 tw-text-left"
class="tw-block tw-cursor-pointer tw-border-none tw-bg-background tw-px-4 tw-py-2 tw-text-left !tw-text-main hover:tw-bg-secondary-100 focus:tw-z-50 focus:tw-bg-secondary-100 focus:tw-outline-none focus:tw-ring focus:tw-ring-primary-700 focus:tw-ring-offset-2 active:!tw-ring-0 active:!tw-ring-offset-0"
(click)="toggleResetPasswordEnrollment(organization)"
>
<i class="bwi bwi-fw bwi-undo" aria-hidden="true"></i>
@ -30,7 +30,7 @@
<ng-container *ngIf="organization.useSso && organization.identifier">
<button
*ngIf="organization.ssoBound; else linkSso"
class="!tw-text-main active:!tw-ring-0 active:!tw-ring-offset-0 focus:tw-bg-secondary-100 focus:tw-outline-none focus:tw-ring focus:tw-ring-offset-2 focus:tw-ring-primary-700 focus:tw-z-50 hover:tw-bg-secondary-100 tw-bg-background tw-block tw-border-none tw-cursor-pointer tw-px-4 tw-py-2 tw-text-left"
class="tw-block tw-cursor-pointer tw-border-none tw-bg-background tw-px-4 tw-py-2 tw-text-left !tw-text-main hover:tw-bg-secondary-100 focus:tw-z-50 focus:tw-bg-secondary-100 focus:tw-outline-none focus:tw-ring focus:tw-ring-primary-700 focus:tw-ring-offset-2 active:!tw-ring-0 active:!tw-ring-offset-0"
(click)="unlinkSso(organization)"
>
<i class="bwi bwi-fw bwi-chain-broken" aria-hidden="true"></i>
@ -41,7 +41,7 @@
</ng-template>
</ng-container>
<button
class="text-danger active:!tw-ring-0 active:!tw-ring-offset-0 focus:tw-bg-secondary-100 focus:tw-outline-none focus:tw-ring focus:tw-ring-offset-2 focus:tw-ring-primary-700 focus:tw-z-50 hover:tw-bg-secondary-100 tw-bg-background tw-block tw-border-none tw-cursor-pointer tw-px-4 tw-py-2 tw-text-left"
class="text-danger tw-block tw-cursor-pointer tw-border-none tw-bg-background tw-px-4 tw-py-2 tw-text-left hover:tw-bg-secondary-100 focus:tw-z-50 focus:tw-bg-secondary-100 focus:tw-outline-none focus:tw-ring focus:tw-ring-primary-700 focus:tw-ring-offset-2 active:!tw-ring-0 active:!tw-ring-offset-0"
(click)="leave(organization)"
>
<i class="bwi bwi-fw bwi-sign-out" aria-hidden="true"></i>

18
apps/web/src/app/modules/vertical-stepper/vertical-step-content.component.html
View File

@ -1,38 +1,38 @@
<div class="tw-m-2.5 tw-text-center tw-h-16">
<div class="tw-m-2.5 tw-h-16 tw-text-center">
<button
(click)="selectStep()"
[disabled]="disabled"
class="tw-w-full tw-flex tw-border-none tw-bg-transparent tw-items-center"
class="tw-flex tw-w-full tw-items-center tw-border-none tw-bg-transparent"
[ngClass]="{
'hover:tw-bg-secondary-100': !disabled && step.editable
}"
[attr.aria-expanded]="selected"
>
<span
class="tw-rounded-full tw-font-bold tw-leading-9 tw-mr-3.5 tw-w-9"
class="tw-mr-3.5 tw-w-9 tw-rounded-full tw-font-bold tw-leading-9"
*ngIf="!step.completed"
[ngClass]="{
'tw-text-contrast tw-bg-primary-500': selected,
'tw-text-main tw-bg-secondary-300': !selected && !disabled && step.editable,
'tw-text-muted tw-bg-transparent': disabled
'tw-bg-primary-500 tw-text-contrast': selected,
'tw-bg-secondary-300 tw-text-main': !selected && !disabled && step.editable,
'tw-bg-transparent tw-text-muted': disabled
}"
>
{{ stepNumber }}
</span>
<span
class="tw-text-contrast tw-bg-primary-500 tw-rounded-full tw-font-bold tw-leading-9 tw-mr-3.5 tw-w-9"
class="tw-mr-3.5 tw-w-9 tw-rounded-full tw-bg-primary-500 tw-font-bold tw-leading-9 tw-text-contrast"
*ngIf="step.completed"
>
<i class="bwi bwi-fw bwi-check tw-p-1" aria-hidden="true"></i>
</span>
<div
class="tw-text-left tw-txt-main tw-leading-snug tw-h-12 tw-mt-3.5"
class="tw-txt-main tw-mt-3.5 tw-h-12 tw-text-left tw-leading-snug"
[ngClass]="{
'tw-font-bold': selected
}"
>
<p
class="main-label text tw-text-main tw-mb-1"
class="main-label text tw-mb-1 tw-text-main"
[ngClass]="{
'tw-mt-1': !step.subLabel
}"

2
apps/web/src/app/modules/vertical-stepper/vertical-step.component.html
View File

@ -1,6 +1,6 @@
<ng-template>
<div
class="tw-pl-7 tw-inline-block tw-w-11/12"
class="tw-inline-block tw-w-11/12 tw-pl-7"
[ngClass]="{ 'tw-border-0 tw-border-l tw-border-solid tw-border-secondary-300': applyBorder }"
>
<ng-content></ng-content>

4
apps/web/src/app/modules/vertical-stepper/vertical-stepper.component.html
View File

@ -9,12 +9,12 @@
(onSelectStep)="selectStepByIndex(i)"
></app-vertical-step-content>
<div
class="tw-pl-7 tw-inline-block"
class="tw-inline-block tw-pl-7"
*ngIf="selectedIndex === i"
[ngTemplateOutlet]="selected ? selected.content : null"
></div>
<div
class="tw-h-6 tw-ml-8 tw-border-0 tw-border-l tw-border-solid tw-border-secondary-300"
class="tw-ml-8 tw-h-6 tw-border-0 tw-border-l tw-border-solid tw-border-secondary-300"
*ngIf="!isLast && !(selectedIndex === i)"
></div>
</li>

6
apps/web/src/app/reports/report-card.component.html
View File

@ -1,17 +1,17 @@
<a
class="tw-border tw-border-solid tw-border-secondary-300 tw-rounded tw-overflow-hidden tw-h-full tw-w-72 tw-block !tw-text-main hover:tw-no-underline hover:tw-scale-105 tw-transition-all focus:tw-outline-none focus:tw-ring focus:tw-ring-offset-2 focus:tw-ring-primary-700"
class="tw-block tw-h-full tw-w-72 tw-overflow-hidden tw-rounded tw-border tw-border-solid tw-border-secondary-300 !tw-text-main tw-transition-all hover:tw-scale-105 hover:tw-no-underline focus:tw-outline-none focus:tw-ring focus:tw-ring-primary-700 focus:tw-ring-offset-2"
[routerLink]="route"
(click)="click()"
>
<div class="tw-relative">
<div
class="tw-text-center tw-h-28 tw-flex tw-bg-background-alt2 tw-text-primary-300"
class="tw-flex tw-h-28 tw-bg-background-alt2 tw-text-center tw-text-primary-300"
[ngClass]="{ 'tw-grayscale': premium }"
>
<div class="tw-m-auto" [innerHtml]="icon"></div>
</div>
<div class="tw-p-5" [ngClass]="{ 'tw-grayscale': report.requiresPremium }">
<h3 class="tw-text-xl tw-font-bold tw-mb-4">{{ report.title | i18n }}</h3>
<h3 class="tw-mb-4 tw-text-xl tw-font-bold">{{ report.title | i18n }}</h3>
<p class="tw-mb-0">{{ report.description | i18n }}</p>
</div>
<span

4
bitwarden_license/bit-web/src/app/sm/layout/layout.component.html
View File

@ -1,8 +1,8 @@
<div class="tw-flex tw-w-full">
<aside class="tw-w-60 tw-bg-background tw-min-h-screen">
<aside class="tw-min-h-screen tw-w-60 tw-bg-background">
<router-outlet name="sidebar"></router-outlet>
</aside>
<main class="tw-flex-1 tw-bg-background-alt tw-min-h-screen tw-px-6 tw-pt-3">
<main class="tw-min-h-screen tw-flex-1 tw-bg-background-alt tw-px-6 tw-pt-3">
<router-outlet></router-outlet>
</main>
</div>

6
libs/components/src/banner/banner.component.html
View File

@ -1,14 +1,14 @@
<div
class="tw-py-2.5 tw-px-4 tw-text-contrast tw-flex tw-gap-2 tw-items-center"
class="tw-flex tw-items-center tw-gap-2 tw-py-2.5 tw-px-4 tw-text-contrast"
[ngClass]="bannerClass"
[attr.role]="useAlertRole ? 'status' : null"
[attr.aria-live]="useAlertRole ? 'polite' : null"
>
<i class="bwi tw-align-middle" [ngClass]="icon" *ngIf="icon" aria-hidden="true"></i>
<span class="tw-text-base tw-grow">
<span class="tw-grow tw-text-base">
<ng-content></ng-content>
</span>
<button class="tw-border-0 tw-bg-transparent tw-text-contrast tw-p-0" (click)="onClose.emit()">
<button class="tw-border-0 tw-bg-transparent tw-p-0 tw-text-contrast" (click)="onClose.emit()">
<i class="bwi bwi-close tw-text-sm" *ngIf="icon" aria-hidden="true"></i>
</button>
</div>

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

@ -1,5 +1,5 @@
<div
class="tw-py-3 tw-px-5 tw-mb-4 tw-leading-5 tw-rounded tw-bg-background-alt tw-border tw-border-secondary-300 tw-border-solid tw-box-border tw-border-l-8 tw-text-main"
class="tw-mb-4 tw-box-border tw-rounded tw-border tw-border-l-8 tw-border-solid tw-border-secondary-300 tw-bg-background-alt tw-py-3 tw-px-5 tw-leading-5 tw-text-main"
[ngClass]="calloutClass"
>
<h3

2
libs/components/src/form-field/form-field.component.html
View File

@ -1,4 +1,4 @@
<label class="tw-block tw-font-semibold tw-mb-1 tw-text-main" [attr.for]="input.id">
<label class="tw-mb-1 tw-block tw-font-semibold tw-text-main" [attr.for]="input.id">
<ng-content select="bit-label"></ng-content>
<span *ngIf="input.required" class="tw-text-xs tw-font-normal"> ({{ "required" | i18n }})</span>
</label>

2
libs/components/src/menu/menu-divider.component.html
View File

@ -1,4 +1,4 @@
<div
class="tw-border-solid tw-border-0 tw-border-t tw-border-t-secondary-500 tw-my-2"
class="tw-my-2 tw-border-0 tw-border-t tw-border-solid tw-border-t-secondary-500"
role="separator"
></div>

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

@ -1,7 +1,7 @@
<ng-template>
<div
(click)="closed.emit()"
class="tw-flex tw-flex-col tw-bg-background tw-border tw-border-solid tw-rounded tw-border-secondary-500 tw-bg-clip-padding tw-py-2 tw-shrink-0"
class="tw-flex tw-shrink-0 tw-flex-col tw-rounded tw-border tw-border-solid tw-border-secondary-500 tw-bg-background tw-bg-clip-padding tw-py-2"
role="menu"
>
<ng-content></ng-content>

10
libs/components/src/modal/modal-simple.component.html
View File

@ -1,19 +1,19 @@
<div
class="tw-max-w-sm tw-max-h-screen tw-my-4 tw-flex tw-flex-col tw-bg-text-contrast tw-border tw-border-solid tw-border-secondary-300 tw-rounded tw-text-main tw-overflow-hidden"
class="tw-my-4 tw-flex tw-max-h-screen tw-max-w-sm tw-flex-col tw-overflow-hidden tw-rounded tw-border tw-border-solid tw-border-secondary-300 tw-bg-text-contrast tw-text-main"
>
<div class="tw-text-center tw-flex tw-flex-col tw-items-center tw-px-4 tw-pt-4 tw-gap-2">
<div class="tw-flex tw-flex-col tw-items-center tw-gap-2 tw-px-4 tw-pt-4 tw-text-center">
<ng-content *ngIf="hasIcon; else elseBlock" select="[bit-modal-icon]"></ng-content>
<ng-template #elseBlock>
<i class="bwi bwi-exclamation-triangle tw-text-3xl tw-text-warning" aria-hidden="true"></i>
</ng-template>
<h2 class="tw-font-semibold tw-text-base tw-mb-0">
<h2 class="tw-mb-0 tw-text-base tw-font-semibold">
<ng-content select="[bit-modal-title]"></ng-content>
</h2>
</div>
<div class="tw-text-center tw-text-base tw-pt-2 tw-pb-4 tw-px-4 tw-overflow-y-auto">
<div class="tw-overflow-y-auto tw-px-4 tw-pt-2 tw-pb-4 tw-text-center tw-text-base">
<ng-content select="[bit-modal-content]"></ng-content>
</div>
<div class="tw-p-4 tw-border-solid tw-border-secondary-300 tw-border-0 tw-border-t">
<div class="tw-border-0 tw-border-t tw-border-solid tw-border-secondary-300 tw-p-4">
<ng-content select="[bit-modal-footer]"></ng-content>
</div>
</div>

10
libs/components/src/modal/modal.component.html
View File

@ -1,11 +1,11 @@
<div
[ngClass]="width"
class="tw-max-h-screen tw-my-4 tw-flex tw-flex-col tw-bg-text-contrast tw-border tw-border-solid tw-border-secondary-300 tw-rounded tw-text-main tw-overflow-hidden"
class="tw-my-4 tw-flex tw-max-h-screen tw-flex-col tw-overflow-hidden tw-rounded tw-border tw-border-solid tw-border-secondary-300 tw-bg-text-contrast tw-text-main"
>
<div
class="tw-flex tw-gap-4 tw-p-4 tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300"
class="tw-flex tw-gap-4 tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300 tw-p-4"
>
<h2 class="tw-text-lg tw-uppercase tw-grow tw-mb-0">
<h2 class="tw-mb-0 tw-grow tw-text-lg tw-uppercase">
<ng-content select="[bit-modal-title]"></ng-content>
</h2>
<button class="tw-border-0 tw-bg-transparent tw-p-0">
@ -13,12 +13,12 @@
</button>
</div>
<div class="tw-pb-8 tw-p-4 tw-overflow-y-auto">
<div class="tw-overflow-y-auto tw-p-4 tw-pb-8">
<ng-content select="[bit-modal-content]"></ng-content>
</div>
<div
class="tw-p-4 tw-bg-background-alt tw-border-solid tw-border-secondary-300 tw-border-0 tw-border-t"
class="tw-border-0 tw-border-t tw-border-solid tw-border-secondary-300 tw-bg-background-alt tw-p-4"
>
<ng-content select="[bit-modal-footer]"></ng-content>
</div>

2
libs/components/src/stories/colors.stories.mdx
View File

@ -10,7 +10,7 @@ export const Row = (name) => (
);
export const Table = (args) => (
<table class={"tw-table-auto border !tw-text-main " + args.class}>
<table class={"border tw-table-auto !tw-text-main " + args.class}>
<thead>
<tr>
<th>General usage</th>

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

@ -1,6 +1,6 @@
<table class="tw-table-auto tw-w-full tw-text-main tw-leading-normal">
<table class="tw-w-full tw-table-auto tw-leading-normal tw-text-main">
<thead
class="tw-border-solid tw-border-0 tw-border-b-2 tw-border-secondary-300 tw-text-muted tw-text-bold"
class="tw-text-bold tw-border-0 tw-border-b-2 tw-border-solid tw-border-secondary-300 tw-text-muted"
>
<ng-content select="[header]"></ng-content>
</thead>

2
libs/components/src/tabs/tab-group.component.html
View File

@ -1,6 +1,6 @@
<div
role="tablist"
class="tw-inline-flex tw-flex-wrap tw-leading-5 tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300"
class="tw-inline-flex tw-flex-wrap tw-border-0 tw-border-b tw-border-solid tw-border-secondary-300 tw-leading-5"
>
<ng-content></ng-content>
</div>

24
package-lock.json generated
View File

@ -29,7 +29,7 @@
"@microsoft/signalr-protocol-msgpack": "^6.0.7",
"big-integer": "^1.6.51",
"bootstrap": "4.6.0",
"braintree-web-drop-in": "1.33.2",
"braintree-web-drop-in": "^1.33.1",
"browser-hrtime": "^1.1.8",
"bufferutil": "^4.0.6",
"chalk": "^4.1.0",
@ -152,7 +152,8 @@
"pkg": "5.7.0",
"postcss": "^8.4.14",
"postcss-loader": "^7.0.1",
"prettier": "^2.6.2",
"prettier": "^2.7.1",
"prettier-plugin-tailwindcss": "^0.1.13",
"process": "^0.11.10",
"regedit": "^3.0.3",
"rimraf": "^3.0.2",
@ -35013,6 +35014,18 @@
"url": "https://github.com/prettier/prettier?sponsor=1"
}
},
"node_modules/prettier-plugin-tailwindcss": {
"version": "0.1.13",
"resolved": "https://registry.npmjs.org/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.1.13.tgz",
"integrity": "sha512-/EKQURUrxLu66CMUg4+1LwGdxnz8of7IDvrSLqEtDqhLH61SAlNNUSr90UTvZaemujgl3OH/VHg+fyGltrNixw==",
"dev": true,
"engines": {
"node": ">=12.17.0"
},
"peerDependencies": {
"prettier": ">=2.2.0"
}
},
"node_modules/pretty-bytes": {
"version": "5.6.0",
"resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.6.0.tgz",
@ -69551,6 +69564,13 @@
"integrity": "sha512-ujppO+MkdPqoVINuDFDRLClm7D78qbDt0/NR+wp5FqEZOoTNAjPHWj17QRhu7geIHJfcNhRk1XVQmF8Bp3ye+g==",
"dev": true
},
"prettier-plugin-tailwindcss": {
"version": "0.1.13",
"resolved": "https://registry.npmjs.org/prettier-plugin-tailwindcss/-/prettier-plugin-tailwindcss-0.1.13.tgz",
"integrity": "sha512-/EKQURUrxLu66CMUg4+1LwGdxnz8of7IDvrSLqEtDqhLH61SAlNNUSr90UTvZaemujgl3OH/VHg+fyGltrNixw==",
"dev": true,
"requires": {}
},
"pretty-bytes": {
"version": "5.6.0",
"resolved": "https://registry.npmjs.org/pretty-bytes/-/pretty-bytes-5.6.0.tgz",

3
package.json
View File

@ -114,7 +114,8 @@
"pkg": "5.7.0",
"postcss": "^8.4.14",
"postcss-loader": "^7.0.1",
"prettier": "^2.6.2",
"prettier": "^2.7.1",
"prettier-plugin-tailwindcss": "^0.1.13",
"process": "^0.11.10",
"regedit": "^3.0.3",
"rimraf": "^3.0.2",