bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-16 08:13:42 +00:00
Code Issues Releases Wiki Activity

[CL-703] Use logical css properties in CL components (#14951)

Browse Source 
* update usage of margin-right with margin-inline-end

* update usage of margin-left with margin-inline-start

* update usage of paddiing-right with padding-inline-end

* update usage of paddiing-left with padding-inline-start

* update usage of radius to use logical properties
This commit is contained in:
Bryan Cunningham
2025-06-02 12:05:30 -04:00
committed by GitHub
parent 37e13050a5
commit c215fac818
33 changed files with 67 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -20,7 +20,7 @@
<div class="tw-absolute tw-size-full tw-top-0 tw-pointer-events-none tw-z-20">
<div class="tw-size-full tw-flex">
<div
class="tw-min-w-3 tw-border-r-0 group-focus-within/bit-form-field:tw-border-r-0 !tw-rounded-l-lg"
class="tw-min-w-3 tw-border-r-0 group-focus-within/bit-form-field:tw-border-r-0 !tw-rounded-s-lg"
[ngClass]="inputBorderClasses"
></div>
<div
@@ -40,7 +40,7 @@
</label>
</div>
<div
class="tw-min-w-3 tw-grow tw-border-l-0 group-focus-within/bit-form-field:tw-border-l-0 !tw-rounded-r-lg"
class="tw-min-w-3 tw-grow tw-border-l-0 group-focus-within/bit-form-field:tw-border-l-0 !tw-rounded-e-lg"
[ngClass]="inputBorderClasses"
></div>
</div>
@@ -50,7 +50,7 @@
>
<div
#prefixContainer
class="tw-flex tw-items-center tw-gap-1 tw-pl-3 tw-py-2"
class="tw-flex tw-items-center tw-gap-1 tw-ps-3 tw-py-2"
[hidden]="!prefixHasChildren()"
>
<ng-container *ngTemplateOutlet="prefixContent"></ng-container>
@@ -59,15 +59,15 @@
class="tw-w-full tw-relative tw-py-2 has-[bit-select]:tw-p-0 has-[bit-multi-select]:tw-p-0 has-[input:read-only:not([hidden])]:tw-bg-secondary-100 has-[textarea:read-only:not([hidden])]:tw-bg-secondary-100"
data-default-content
[ngClass]="[
prefixHasChildren() ? '' : 'tw-rounded-l-lg tw-pl-3',
suffixHasChildren() ? '' : 'tw-rounded-r-lg tw-pr-3',
prefixHasChildren() ? '' : 'tw-rounded-s-lg tw-ps-3',
suffixHasChildren() ? '' : 'tw-rounded-e-lg tw-pe-3',
]"
>
<ng-container *ngTemplateOutlet="defaultContent"></ng-container>
</div>
<div
#suffixContainer
class="tw-flex tw-items-center tw-gap-1 tw-pr-3 tw-py-2"
class="tw-flex tw-items-center tw-gap-1 tw-pe-3 tw-py-2"
[hidden]="!suffixHasChildren()"
>
<ng-container *ngTemplateOutlet="suffixContent"></ng-container>
@@ -92,7 +92,7 @@
<div
#prefixContainer
[hidden]="!prefixHasChildren()"
class="tw-flex tw-items-center tw-gap-1 tw-pl-1"
class="tw-flex tw-items-center tw-gap-1 tw-ps-1"
>
<ng-container *ngTemplateOutlet="prefixContent"></ng-container>
</div>
@@ -105,7 +105,7 @@
<div
#suffixContainer
[hidden]="!suffixHasChildren()"
class="tw-flex tw-items-center tw-gap-1 tw-pr-1"
class="tw-flex tw-items-center tw-gap-1 tw-pe-1"
>
<ng-container *ngTemplateOutlet="suffixContent"></ng-container>
</div>