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

[CL-754] Fix shift when closing sidenav (#15849)

Browse Source 
* update shield logo and container padding

* Fix horizontal icon shift

* use absolutel position to fix shield shifting

* add new shield and admin console logo

* add new logos

* add business unit portal logo

* delete redundant logos

* add missing fill color class
This commit is contained in:
Bryan Cunningham
2025-08-05 11:06:23 -04:00
committed by GitHub
parent 26c0176e2e
commit 5f5f771adb
14 changed files with 44 additions and 104 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
libs/components/src/navigation/nav-item.component.html
View File

@@ -17,8 +17,8 @@
<ng-template #anchorAndButtonContent>
<div
[title]="text()"
class="tw-gap-2 tw-items-center tw-font-bold tw-h-full tw-content-center"
[ngClass]="{ 'tw-text-center': !open, 'tw-flex': open }"
class="tw-gap-2 tw-flex tw-items-center tw-font-bold tw-h-full"
[ngClass]="{ 'tw-justify-center': !open }"
>
<i
class="!tw-m-0 tw-w-4 tw-shrink-0 bwi bwi-fw tw-text-alt2 {{ icon() }}"
@@ -36,7 +36,7 @@
<!-- The `data-fvw` attribute passes focus to `this.focusVisibleWithin$` -->
<!-- The following `class` field should match the `#isButton` class field below -->
<a
class="tw-size-full tw-px-3 tw-block tw-truncate tw-border-none tw-bg-transparent tw-text-start !tw-text-alt2 hover:tw-text-alt2 hover:tw-no-underline focus:tw-outline-none"
class="tw-size-full tw-px-4 tw-block tw-truncate tw-border-none tw-bg-transparent tw-text-start !tw-text-alt2 hover:tw-text-alt2 hover:tw-no-underline focus:tw-outline-none [&_i]:tw-leading-[1.5rem]"
data-fvw
[routerLink]="route()"
[relativeTo]="relativeTo()"
@@ -56,7 +56,7 @@
<!-- Class field should match `#isAnchor` class field above -->
<button
type="button"
class="tw-size-full tw-px-3 tw-truncate tw-border-none tw-bg-transparent tw-text-start !tw-text-alt2 hover:tw-text-alt2 hover:tw-no-underline focus:tw-outline-none"
class="tw-size-full tw-px-4 tw-pe-3 tw-truncate tw-border-none tw-bg-transparent tw-text-start !tw-text-alt2 hover:tw-text-alt2 hover:tw-no-underline focus:tw-outline-none [&_i]:tw-leading-[1.5rem]"
data-fvw
(click)="mainContentClicked.emit()"
>

10
libs/components/src/navigation/nav-logo.component.html
View File

@@ -1,14 +1,18 @@
<div
[ngClass]="{
'tw-sticky tw-top-0 tw-z-50 tw-pb-2': sideNavService.open,
'tw-pb-5': !sideNavService.open,
'tw-pb-[calc(theme(spacing.6)_+_2px)]': !sideNavService.open,
}"
class="tw-px-2 tw-pt-5"
>
<!-- absolutely position the link svg to avoid shifting layout when sidenav is closed -->
<a
[routerLink]="route()"
class="tw-p-3 tw-block tw-rounded-md tw-bg-background-alt3 tw-outline-none focus-visible:tw-ring focus-visible:tw-ring-inset focus-visible:tw-ring-text-alt2 hover:tw-bg-hover-contrast [&_path]:tw-fill-text-alt2"
[ngClass]="{ '[&_svg]:tw-w-[1.687rem]': !sideNavService.open }"
class="tw-relative tw-p-3 tw-block tw-rounded-md tw-bg-background-alt3 tw-outline-none focus-visible:tw-ring focus-visible:tw-ring-inset focus-visible:tw-ring-text-alt2 hover:tw-bg-hover-contrast tw-h-[73px] [&_svg]:tw-absolute [&_svg]:tw-inset-[theme(spacing.3)] [&_svg]:tw-w-[calc(100%_-_theme(spacing.6))] [&_svg]:tw-transition-[inline-start-inset]"
[ngClass]="{
'!tw-h-[55px] [&_svg]:!tw-w-[26px] [&_svg]:tw-inset-y-[theme(spacing.3)]':
!sideNavService.open,
}"
[attr.aria-label]="label()"
[title]="label()"
routerLinkActive