1
0
mirror of https://github.com/bitwarden/browser synced 2025-12-10 05:13:29 +00:00

refactor: [PM-17182] Remove Bootstrap style from EnvironmentSelectorComponent

Replace Bootstrap styles with Tailwind equivalents in the EnvironmentSelectorComponent to modernize the UI.
This commit is contained in:
Alec Rippberger
2025-02-11 10:25:14 -06:00
committed by GitHub
parent ed0b8d1451
commit 9f22a2fa87
2 changed files with 9 additions and 9 deletions

View File

@@ -15,11 +15,11 @@
{{ region.domain }}
</a>
</bit-menu>
<div>
<div bitTypography="body2">
{{ "accessing" | i18n }}:
<a [routerLink]="[]" [bitMenuTriggerFor]="environmentOptions">
<b>{{ currentRegion?.domain }}</b
><i class="bwi bwi-fw bwi-sm bwi-angle-down" aria-hidden="true"></i>
<b class="tw-text-primary-600 tw-font-semibold">{{ currentRegion?.domain }}</b>
<i class="bwi bwi-fw bwi-sm bwi-angle-down" aria-hidden="true"></i>
</a>
</div>
</div>

View File

@@ -3,7 +3,7 @@
selectedRegion: selectedRegion$ | async,
} as data"
>
<div class="environment-selector-btn">
<div class="tw-text-sm tw-text-muted tw-leading-7 tw-font-normal tw-pl-4">
{{ "accessing" | i18n }}:
<button
type="button"
@@ -13,7 +13,7 @@
aria-haspopup="dialog"
aria-controls="cdk-overlay-container"
>
<span class="text-primary">
<span class="tw-text-primary-600 tw-text-sm tw-font-semibold">
<ng-container *ngIf="data.selectedRegion; else fallback">
{{ data.selectedRegion.domain }}
</ng-container>
@@ -35,9 +35,9 @@
(backdropClick)="isOpen = false"
(detach)="close()"
>
<div class="box-content">
<div class="tw-box-content">
<div
class="environment-selector-dialog"
class="tw-bg-background tw-w-full tw-shadow-md tw-p-2 tw-rounded-md"
data-testid="environment-selector-dialog"
[@transformPanel]="'open'"
cdkTrapFocus
@@ -48,7 +48,7 @@
<ng-container *ngFor="let region of availableRegions; let i = index">
<button
type="button"
class="environment-selector-dialog-item"
class="tw-text-main tw-w-full tw-text-left tw-py-0 tw-border tw-border-transparent tw-transition-all tw-duration-200 tw-ease-in-out tw-pr-2 tw-rounded-md"
(click)="toggle(region.key)"
[attr.aria-pressed]="data.selectedRegion === region ? 'true' : 'false'"
[attr.data-testid]="'environment-selector-dialog-item-' + i"
@@ -65,7 +65,7 @@
</ng-container>
<button
type="button"
class="environment-selector-dialog-item"
class="tw-text-main tw-w-full tw-text-left tw-py-0 tw-pr-2 tw-border tw-border-transparent tw-transition-all tw-duration-200 tw-ease-in-out tw-rounded-md"
(click)="toggle(ServerEnvironmentType.SelfHosted)"
[attr.aria-pressed]="data.selectedRegion ? 'false' : 'true'"
data-testid="environment-selector-dialog-item-self-hosted"