@@ -287,12 +287,12 @@ <h3 id="constructor">Constructor</h3>
287287 < tbody >
288288 < tr >
289289 < td class ="col-md-4 ">
290- < code > constructor(sectionService: < a href ="../injectables/SectionService.html " target ="_self "> SectionService</ a > , platformId: < a href ="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object " target ="_blank "> Object</ a > )</ code >
290+ < code > constructor(sectionService: < a href ="../injectables/SectionService.html " target ="_self "> SectionService</ a > , screenTypeService: < a href =" ../injectables/ScreenTypeService.html " target =" _self " > ScreenTypeService </ a > , platformId: < a href ="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object " target ="_blank "> Object</ a > )</ code >
291291 </ td >
292292 </ tr >
293293 < tr >
294294 < td class ="col-md-4 ">
295- < div class ="io-line "> Defined in < a href ="" data-line ="44 " class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:44 </ a > </ div >
295+ < div class ="io-line "> Defined in < a href ="" data-line ="45 " class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:45 </ a > </ div >
296296 </ td >
297297 </ tr >
298298
@@ -329,6 +329,22 @@ <h3 id="constructor">Constructor</h3>
329329
330330 </ td >
331331 </ tr >
332+ < tr >
333+ < td > screenTypeService</ td >
334+
335+ < td >
336+ < code > < a href ="../injectables/ScreenTypeService.html " target ="_self " > ScreenTypeService</ a > </ code >
337+ </ td >
338+
339+ < td >
340+ No
341+ </ td >
342+
343+ < td >
344+ < p > Service to track the screentype is mobile, tablet, and laptop</ p >
345+
346+ </ td >
347+ </ tr >
332348 < tr >
333349 < td > platformId</ td >
334350
@@ -383,8 +399,8 @@ <h3>HostListeners</h3> <table class="table table-sm table-bordered">
383399
384400 < tr >
385401 < td class ="col-md-4 ">
386- < div class ="io-line "> Defined in < a href ="" data-line ="75 "
387- class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:75 </ a > </ div >
402+ < div class ="io-line "> Defined in < a href ="" data-line ="78 "
403+ class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:78 </ a > </ div >
388404 </ td >
389405 </ tr >
390406
@@ -452,8 +468,8 @@ <h3 id="methods">
452468
453469 < tr >
454470 < td class ="col-md-4 ">
455- < div class ="io-line "> Defined in < a href ="" data-line ="65 "
456- class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:65 </ a > </ div >
471+ < div class ="io-line "> Defined in < a href ="" data-line ="68 "
472+ class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:68 </ a > </ div >
457473 </ td >
458474 </ tr >
459475
@@ -500,8 +516,8 @@ <h3 id="methods">
500516
501517 < tr >
502518 < td class ="col-md-4 ">
503- < div class ="io-line "> Defined in < a href ="" data-line ="75 "
504- class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:75 </ a > </ div >
519+ < div class ="io-line "> Defined in < a href ="" data-line ="78 "
520+ class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:78 </ a > </ div >
505521 </ td >
506522 </ tr >
507523
@@ -584,7 +600,7 @@ <h3 id="inputs">
584600 </ tr >
585601 < tr >
586602 < td class ="col-md-4 ">
587- < div class ="io-line "> Defined in < a href ="" data-line ="39 " class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:39 </ a > </ div >
603+ < div class ="io-line "> Defined in < a href ="" data-line ="40 " class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:40 </ a > </ div >
588604 </ td >
589605 </ tr >
590606
@@ -621,7 +637,7 @@ <h3 id="inputs">
621637 </ tr >
622638 < tr >
623639 < td class ="col-md-4 ">
624- < div class ="io-line "> Defined in < a href ="" data-line ="44 " class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:44 </ a > </ div >
640+ < div class ="io-line "> Defined in < a href ="" data-line ="45 " class ="link-to-prism "> src/app/features/expense-wise/expense-wise.component.ts:45 </ a > </ div >
625641 </ td >
626642 </ tr >
627643
@@ -657,6 +673,7 @@ <h3 id="inputs">
657673import { AiComponent } from '../../features/ai/ai.component';
658674
659675import { SectionService } from '../../service/section/section.service';
676+ import { ScreenTypeService } from '../../service/screen-type/screen-type.service';
660677
661678/**
662679 * Root component of the application.
@@ -689,10 +706,12 @@ <h3 id="inputs">
689706 * Initializes route tracking, section updates, PWA update listener, and services.
690707 *
691708 * @param sectionService Service to track current section changes
709+ * @param screenTypeService Service to track the screentype is mobile, tablet, and laptop
692710 * @param platformId Angular platform ID to check if running in browser
693711 */
694712 constructor(
695713 private sectionService: SectionService,
714+ private screenTypeService: ScreenTypeService,
696715 @Inject(PLATFORM_ID) private platformId: Object
697716
698717 ) {
@@ -706,7 +725,7 @@ <h3 id="inputs">
706725 */
707726 ngOnInit() {
708727 if (isPlatformBrowser(this.platformId)) {
709- this.isMobile = window.innerWidth <= 768 ;
728+ this.isMobile = this.screenTypeService.isMobile() ;
710729 }
711730 }
712731 /**
@@ -716,16 +735,16 @@ <h3 id="inputs">
716735 @HostListener('window:resize', ['$event'])
717736 onResize(event: any) {
718737 if (isPlatformBrowser(this.platformId)) {
719- this.isMobile = event.target.innerWidth <= 768 ;
738+ this.isMobile = this.screenTypeService.isMobile() ;
720739 }
721740 }
722741}</ code > </ pre >
723742 </ div >
724743
725744 < div class ="tab-pane fade " id ="templateData ">
726745 < pre class ="line-numbers "> < code class ="language-html "> <div class="expense">
727- <app-navbar></app-navbar>
728- <div class="flex pt-14 pb-9 h-screen overflow-hidden">
746+ <app-navbar class="hidden md:block" ></app-navbar>
747+ <div class="flex md: pt-14 pb-9 h-screen overflow-hidden">
729748 <app-sidebar></app-sidebar>
730749 <main class="flex-1 overflow-y-auto w-full h-full">
731750 <ng-container [ngSwitch]="currentSection">
@@ -773,7 +792,7 @@ <h3 id="inputs">
773792< script src ="../js/libs/htmlparser.js "> </ script >
774793< script src ="../js/libs/deep-iterator.js "> </ script >
775794< script >
776- var COMPONENT_TEMPLATE = '<div><div class="expense"> <app-navbar></app-navbar> <div class="flex pt-14 pb-9 h-screen overflow-hidden"> <app-sidebar></app-sidebar> <main class="flex-1 overflow-y-auto w-full h-full"> <ng-container [ngSwitch]="currentSection"> <app-home *ngSwitchCase="\'home\'"></app-home> <div *ngSwitchCase="\'add\'" [class.mobile-slide-up]="isMobile"> <app-add-expense></app-add-expense> </div> <app-list-expenses *ngSwitchCase="\'list\'"></app-list-expenses> <app-calendar *ngSwitchCase="\'calendar\'"></app-calendar> <app-settings *ngSwitchCase="\'settings\'"></app-settings> <app-budget *ngSwitchCase="\'budget\'"></app-budget> <app-ai *ngSwitchCase="\'ai\'"></app-ai> <app-home *ngSwitchDefault></app-home> </ng-container> </main> </div> <app-footer></app-footer> <app-toast></app-toast></div></div>'
795+ var COMPONENT_TEMPLATE = '<div><div class="expense"> <app-navbar class="hidden md:block"></app-navbar> <div class="flex md:pt-14 pb-9 h-screen overflow-hidden"> <app-sidebar></app-sidebar> <main class="flex-1 overflow-y-auto w-full h-full"> <ng-container [ngSwitch]="currentSection"> <app-home *ngSwitchCase="\'home\'"></app-home> <div *ngSwitchCase="\'add\'" [class.mobile-slide-up]="isMobile"> <app-add-expense></app-add-expense> </div> <app-list-expenses *ngSwitchCase="\'list\'"></app-list-expenses> <app-calendar *ngSwitchCase="\'calendar\'"></app-calendar> <app-settings *ngSwitchCase="\'settings\'"></app-settings> <app-budget *ngSwitchCase="\'budget\'"></app-budget> <app-ai *ngSwitchCase="\'ai\'"></app-ai> <app-home *ngSwitchDefault></app-home> </ng-container> </main> </div> <app-footer></app-footer> <app-toast></app-toast></div></div>'
777796 var COMPONENTS = [ { 'name' : 'AddExpenseComponent' , 'selector' : 'app-add-expense' } , { 'name' : 'AiComponent' , 'selector' : 'app-ai' } , { 'name' : 'AppComponent' , 'selector' : 'app-root' } , { 'name' : 'BudgetComponent' , 'selector' : 'app-budget' } , { 'name' : 'CalendarComponent' , 'selector' : 'app-calendar' } , { 'name' : 'CategoryDropdownComponent' , 'selector' : 'app-category-dropdown' } , { 'name' : 'DownloadComponentComponent' , 'selector' : 'app-download-component' } , { 'name' : 'ExpenseDetailsModalComponent' , 'selector' : 'app-expense-details-modal' } , { 'name' : 'ExpenseListComponent' , 'selector' : 'app-expense-list' } , { 'name' : 'ExpenseWiseComponent' , 'selector' : 'app-expense-wise' } , { 'name' : 'FooterComponent' , 'selector' : 'app-footer' } , { 'name' : 'FormModelComponent' , 'selector' : 'app-form-model' } , { 'name' : 'GlobalLoaderComponent' , 'selector' : 'app-global-loader' } , { 'name' : 'GraphsComponent' , 'selector' : 'app-graphs' } , { 'name' : 'HamburgerMenuComponent' , 'selector' : 'app-hamburger-menu' } , { 'name' : 'HomeComponent' , 'selector' : 'app-home' } , { 'name' : 'InstallAppPopupComponentComponent' , 'selector' : 'app-install-app-popup-component' } , { 'name' : 'ListExpensesComponent' , 'selector' : 'app-list-expenses' } , { 'name' : 'MusicComponent' , 'selector' : 'app-music' } , { 'name' : 'NavbarComponent' , 'selector' : 'app-navbar' } , { 'name' : 'PieChartComponent' , 'selector' : 'app-pie-chart' } , { 'name' : 'PlaylistMusicComponent' , 'selector' : 'app-playlist-music' } , { 'name' : 'SearchButtonComponent' , 'selector' : 'app-search-button' } , { 'name' : 'SearchMusicComponent' , 'selector' : 'app-search-music' } , { 'name' : 'SettingItemComponent' , 'selector' : 'app-setting-item' } , { 'name' : 'SettingsComponent' , 'selector' : 'app-settings' } , { 'name' : 'SidebarComponent' , 'selector' : 'app-sidebar' } , { 'name' : 'TemplatePlaygroundComponent' , 'selector' : 'template-playground-root' } , { 'name' : 'ToastComponent' , 'selector' : 'app-toast' } ] ;
778797 var DIRECTIVES = [ ] ;
779798 var ACTUAL_COMPONENT = { 'name' : 'ExpenseWiseComponent' } ;
0 commit comments