[SM-110] Add prettier-plugin-tailwindcss (#3215)
This commit is contained in:
parent
59ce41aabb
commit
379036123f
|
@ -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"
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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 }}
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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,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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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
|
||||
}"
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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>
|
||||
|
|
|
@ -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",
|
||||
|
|
|
@ -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",
|
||||
|
|
Loading…
Reference in New Issue