CBSNexora/cbsnexora
4
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

fix: Hide language icon button on large screens, show only on small screens (#2910)

Browse Source 
Add accessibility attributes to the language button
This commit is contained in:
Shubham Kumar
2025-12-17 14:39:06 -06:00
committed by GitHub
parent 1b668c58e6
commit e65d392db7
2 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/core/shell/toolbar/toolbar.component.html
+9 -2
View File
@@ -90,8 +90,15 @@
<mifosx-language-selector class="ml-1 language hide-lt-md" tabindex="0"></mifosx-language-selector> <mifosx-language-selector class="ml-1 language hide-lt-md" tabindex="0"></mifosx-language-selector>
</div> </div>
<button mat-icon-button [matMenuTriggerFor]="languageMenu" tabindex="0"> <button
<mat-icon class="lg-icon">language</mat-icon> mat-icon-button
[matMenuTriggerFor]="languageMenu"
class="show-lt-md"
tabindex="0"
[attr.aria-label]="'labels.menus.Language Selector' | translate"
matTooltip="{{ 'labels.menus.Language Selector' | translate }}"
>
<mat-icon>language</mat-icon>
</button> </button>
<div #notifications> <div #notifications>
src/app/core/shell/toolbar/toolbar.component.scss
+5 -6
View File
@@ -58,15 +58,14 @@
} }
} }
// Show icon on small screens // Show language icon button only on small screens (when full selector is hidden)
.lg-icon { .show-lt-md {
display: none; display: none;
} }
@media (width <= 959px) { @media (width <= 768px) {
.lg-icon { .show-lt-md {
display: block; display: inline-flex;
margin-left: 5px;
} }
} }