-
Notifications
You must be signed in to change notification settings - Fork 10
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Fixes: https://github.com/aquarist-labs/s3gw/issues/552 Signed-off-by: Volker Theile <vtheile@suse.com>
- Loading branch information
Showing
27 changed files
with
1,008 additions
and
786 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
22 changes: 12 additions & 10 deletions
22
...p/shared/components/navigation-bar/navigation-bar-item/navigation-bar-item.component.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,23 +1,25 @@ | ||
| @use 'src/scss/defaults/colors' as dc; | ||
| @use 'theme/colors' as tc; | ||
|
|
||
| li { | ||
| background-color: var(--s3gw-navbar-item-bg); | ||
| color: var(--s3gw-navbar-item-color); | ||
| cursor: pointer; | ||
|
|
||
| a, | ||
| a:hover { | ||
| color: dc.$s3gw-color-menu-item-text; | ||
| a { | ||
| color: unset; | ||
| } | ||
|
|
||
| &:hover { | ||
| background-color: dc.$s3gw-color-menu-item-hover-background; | ||
| background-color: var(--s3gw-navbar-item-hover-bg); | ||
| color: var(--s3gw-navbar-item-hover-color); | ||
| } | ||
|
|
||
| &.selected { | ||
| background-color: dc.$s3gw-color-menu-item-selected-background; | ||
| background-color: var(--s3gw-navbar-item-selected-bg); | ||
| color: var(--s3gw-navbar-item-selected-color); | ||
| } | ||
|
|
||
| a, | ||
| a:hover { | ||
| color: dc.$s3gw-color-menu-item-selected-text; | ||
| } | ||
| &:hover, &.selected { | ||
| border-right: 4px solid var(--s3gw-navbar-item-border-color); | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,4 @@ | ||
| :host { | ||
| background-color: var(--s3gw-navbar-bg); | ||
| color: var(--s3gw-navbar-color); | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
154 changes: 79 additions & 75 deletions
154
src/frontend/src/app/shared/components/top-bar/top-bar.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,85 +1,89 @@ | ||
| <div class="wrapper h-100 d-flex flex-row justify-content-start align-items-center"> | ||
| <button class="btn btn-simple rounded-0 toggle" | ||
| title="{{ 'Toggle navigation' | transloco }}" | ||
| (click)="onToggleNavigation($event)"> | ||
| <i class="mdi mdi-menu"></i> | ||
| </button> | ||
| <div> | ||
| <img class="mx-2 logo" | ||
| src="./assets/images/logo.svg" | ||
| alt="logo"> | ||
| </div> | ||
| <div class="flex-fill"></div> | ||
| <ng-container *ngIf="isAdmin"> | ||
| <div class="form-check form-switch me-2"> | ||
| <input class="form-check-input" | ||
| type="checkbox" | ||
| role="switch" | ||
| id="viewMode" | ||
| ngbTooltip="{{ viewMode === viewModes.admin ? 'Turn off administration view' : 'Turn on administration view' | transloco }}" | ||
| [checked]="viewMode === viewModes.admin" | ||
| (change)="onToggleViewMode($event)"> | ||
| <label class="form-check-label" | ||
| for="viewMode"> | ||
| {{ 'Administration' | transloco }} | ||
| </label> | ||
| </div> | ||
| <div class="ms-3 vr"></div> | ||
| </ng-container> | ||
| <button class="btn btn-simple mx-2" | ||
| title="{{ 'Notifications' | transloco }}" | ||
| (click)="onToggleNotifications($event)"> | ||
| <i [class]="icons.bell"></i> | ||
| </button> | ||
| <div ngbDropdown> | ||
| <button class="btn btn-simple ms-2" | ||
| title="{{ 'Help' | transloco }}" | ||
| ngbDropdownToggle> | ||
| <i [class]="icons.help"></i> | ||
| <div class="wrapper d-flex h-100"> | ||
| <div class="navigation-actions d-flex justify-content-start align-items-center"> | ||
| <button class="btn btn-simple rounded-0 toggle" | ||
| title="{{ 'Toggle navigation' | transloco }}" | ||
| (click)="onToggleNavigation($event)"> | ||
| <i class="mdi mdi-menu"></i> | ||
| </button> | ||
| <div ngbDropdownMenu> | ||
| <a ngbDropdownItem | ||
| href="https://s3gw.io/" | ||
| target="_blank"> | ||
| <div> | ||
| <i class="mdi mdi-web mr-1"></i> | ||
| <span>{{ "Website" | transloco }}</span> | ||
| </div> | ||
| </a> | ||
| <a ngbDropdownItem | ||
| href="https://github.com/aquarist-labs/s3gw" | ||
| target="_blank"> | ||
| <div> | ||
| <i class="mdi mdi-github mr-1"></i> | ||
| <span>{{ "GitHub" | transloco }}</span> | ||
| </div> | ||
| </a> | ||
| <div class="logo h-100"> | ||
| <img class="m-2" | ||
| src="./assets/images/logo.svg" | ||
| alt="logo"> | ||
| </div> | ||
| </div> | ||
| <div ngbDropdown | ||
| display="dynamic" | ||
| placement="bottom-right"> | ||
| <div class="flex-fill"></div> | ||
| <div class="actions d-flex align-items-center ps-3"> | ||
| <ng-container *ngIf="isAdmin"> | ||
| <div class="form-check form-switch switch-danger me-2"> | ||
| <input class="form-check-input" | ||
| type="checkbox" | ||
| role="switch" | ||
| id="viewMode" | ||
| ngbTooltip="{{ viewMode === viewModes.admin ? 'Turn off administration view' : 'Turn on administration view' | transloco }}" | ||
| [checked]="viewMode === viewModes.admin" | ||
| (change)="onToggleViewMode($event)"> | ||
| <label class="form-check-label" | ||
| for="viewMode"> | ||
| {{ 'Administration' | transloco }} | ||
| </label> | ||
| </div> | ||
| <div class="ms-3 vr"></div> | ||
| </ng-container> | ||
| <button class="btn btn-simple mx-2" | ||
| title="{{ 'Profile' | transloco }}" | ||
| ngbDropdownToggle> | ||
| <i [class]="icons.user"></i> | ||
| title="{{ 'Notifications' | transloco }}" | ||
| (click)="onToggleNotifications($event)"> | ||
| <i [class]="icons.bell"></i> | ||
| </button> | ||
| <div ngbDropdownMenu> | ||
| <div ngbDropdownItem | ||
| disabled> | ||
| <i class="mr-1" | ||
| [class]="icons.user"> | ||
| </i> | ||
| <span> | ||
| {{ 'Logged in as' | transloco }} {{ userId }} | ||
| </span> | ||
| <div ngbDropdown> | ||
| <button class="btn btn-simple ms-2" | ||
| title="{{ 'Help' | transloco }}" | ||
| ngbDropdownToggle> | ||
| <i [class]="icons.help"></i> | ||
| </button> | ||
| <div ngbDropdownMenu> | ||
| <a ngbDropdownItem | ||
| href="https://s3gw.io/" | ||
| target="_blank"> | ||
| <div> | ||
| <i class="mdi mdi-web mr-1"></i> | ||
| <span>{{ "Website" | transloco }}</span> | ||
| </div> | ||
| </a> | ||
| <a ngbDropdownItem | ||
| href="https://github.com/aquarist-labs/s3gw" | ||
| target="_blank"> | ||
| <div> | ||
| <i class="mdi mdi-github mr-1"></i> | ||
| <span>{{ "GitHub" | transloco }}</span> | ||
| </div> | ||
| </a> | ||
| </div> | ||
| <div class="dropdown-divider"></div> | ||
| <button ngbDropdownItem | ||
| (click)="onLogout()"> | ||
| <i class="mdi mdi-logout mr-1"></i> | ||
| <span>{{ "Log out" | transloco }}</span> | ||
| </div> | ||
| <div ngbDropdown | ||
| display="dynamic" | ||
| placement="bottom-right"> | ||
| <button class="btn btn-simple mx-2" | ||
| title="{{ 'Profile' | transloco }}" | ||
| ngbDropdownToggle> | ||
| <i [class]="icons.user"></i> | ||
| </button> | ||
| <div ngbDropdownMenu> | ||
| <div ngbDropdownItem | ||
| disabled> | ||
| <i class="mr-1" | ||
| [class]="icons.user"> | ||
| </i> | ||
| <span> | ||
| {{ 'Logged in as' | transloco }} {{ userId }} | ||
| </span> | ||
| </div> | ||
| <div class="dropdown-divider"></div> | ||
| <button ngbDropdownItem | ||
| (click)="onLogout()"> | ||
| <i class="mdi mdi-logout mr-1"></i> | ||
| <span>{{ "Log out" | transloco }}</span> | ||
| </button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> |
Oops, something went wrong.