bitwarden/browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser synced 2025-12-12 22:33:35 +00:00
Code Issues Releases Wiki Activity

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

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/web/src/app/components/environment-selector/environment-selector.component.html
View File

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

12
libs/angular/src/auth/components/environment-selector.component.html
View File

@@ -3,7 +3,7 @@
selectedRegion: selectedRegion$ | async, selectedRegion: selectedRegion$ | async,
} as data" } 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 }}: {{ "accessing" | i18n }}:
<button <button
type="button" type="button"
@@ -13,7 +13,7 @@
aria-haspopup="dialog" aria-haspopup="dialog"
aria-controls="cdk-overlay-container" 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"> <ng-container *ngIf="data.selectedRegion; else fallback">
{{ data.selectedRegion.domain }} {{ data.selectedRegion.domain }}
</ng-container> </ng-container>
@@ -35,9 +35,9 @@
(backdropClick)="isOpen = false" (backdropClick)="isOpen = false"
(detach)="close()" (detach)="close()"
> >
<div class="box-content"> <div class="tw-box-content">
<div <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" data-testid="environment-selector-dialog"
[@transformPanel]="'open'" [@transformPanel]="'open'"
cdkTrapFocus cdkTrapFocus
@@ -48,7 +48,7 @@
<ng-container *ngFor="let region of availableRegions; let i = index"> <ng-container *ngFor="let region of availableRegions; let i = index">
<button <button
type="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)" (click)="toggle(region.key)"
[attr.aria-pressed]="data.selectedRegion === region ? 'true' : 'false'" [attr.aria-pressed]="data.selectedRegion === region ? 'true' : 'false'"
[attr.data-testid]="'environment-selector-dialog-item-' + i" [attr.data-testid]="'environment-selector-dialog-item-' + i"
@@ -65,7 +65,7 @@
</ng-container> </ng-container>
<button <button
type="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)" (click)="toggle(ServerEnvironmentType.SelfHosted)"
[attr.aria-pressed]="data.selectedRegion ? 'false' : 'true'" [attr.aria-pressed]="data.selectedRegion ? 'false' : 'true'"
data-testid="environment-selector-dialog-item-self-hosted" data-testid="environment-selector-dialog-item-self-hosted"