1. Home
  2. Forum
  3. Angular - EJ 2
  4. sidebar starts half hidden

sidebar starts half hidden

I’m using the menu sidebar within components such as:

<html>
<div class="control-section">
    <app-menu-sidebar></app-menu-sidebar>
    <!-- main-content declaration -->
    <div class="main-content" id="maintext">
    <div class="container">  


I’m wondering if you’ve ever seen the following behavior:
When I put a new build into production, the first time it sees a component, the main content is offset, hiding behind the sidebar. (See attachment 1)
Upon refreshing, it loads properly. (See attachment 2)
No errors in the console.
From the html
 <ejs-sidebar id="sidebar-menu" class="dock-menu" #sidebarMenuInstance [enableDock]='enableDock' [width]='width'
             [dockSize]='dockSize' [mediaQuery]='mediaQuery' [target]='target' [closeOnDocumentClick] = 'closeOnClick' [enableGestures]="enableGestures">

 
From the ts
export class MenuSidebarComponent implements OnInit{
    public enableGestures: boolean = false; 
    @ViewChild('sidebarMenuInstance')
    public sidebarMenuInstance: SidebarComponent;
    public width: string = '220px';
    public mediaQuery: string = ('(min-width: 600px)');
    public target: string = '.main-content';
    public dockSize: string = '50px';
     public enableDock: boolean = true;
     public accesstype: any;
     public menutype: string = 'Push';


Any ideas?

Thanks

Attachment: Sidebar_a1109079.zip

3 Replies
IL Indhumathy Loganathan Syncfusion Team January 6, 2021 04:47 PM UTC

Hi Walter, 
 
Thank you for contacting Syncfusion support. 
 
We have analysed your query and prepared a sample based on your scenario. Unfortunately, we were unable to reproduce the reported issue in production mode too. We have attached our sample for reference in the below link. 
 
 
We would like to request the following details for validating the reported issue in our end.  
 
1.      Please share the steps to replicate your reported issue. 
2.      Share us complete code snippets and style sheets used in your application.  
3.      If possible, please modify the attached sample to replicate your issue. 
 
Regards, 
Indhumathy L 


WC Walter Cook January 7, 2021 02:54 PM UTC

Thanks, I'll have a look. 
Only happens in prod, so there will likely be a delay in my response.

Is it possible I'm missing a property set to true (or false)?

IL Indhumathy Loganathan Syncfusion Team January 8, 2021 06:54 AM UTC

Hi Walter, 
 
We have prepared a sample with the exact code snippets provided in your update.  We run the sample by using ng serve --prod command. 
 
But we were unable to reproduce the reported issue. Please find our validation sample from the below link. 
 
 
Please ensure the sample in your end and if issue persists, kindly provide us the exact replication steps to provide a prompt solution. 
 
Please let us know, if you need any further assistance.  
  
Regards,   
Indhumathy L 


Loader.
Up arrow icon