ng-sidebar to create a sidebar that pushes content to the right - css

Question

I am using ng-sidebar to animate and implement the collapsable sidebar on smaller mobile screens.
This is my first time using Angular so I apologize if the question is simple for everyone else.
I have installed using npm install ng-sidebar and tried the working demo, but I have difficulty adjusting it to my needs.
In my app.component.html I have this code taken from the demo :
<ng-sidebar-container>
<ng-sidebar
[(opened)]="_opened"
[mode]="_MODES[_modeNum]"
[closeOnClickOutside]="_closeOnClickOutside"
[closeOnClickBackdrop]="_closeOnClickBackdrop"
[showBackdrop]="_showBackdrop"
[animate]="_animate">
<button (click)="_toggleOpened()">Close sidebar</button>
<p><a closeSidebar>This will close the sidebar too</a></p>
<hr>
<ul class="nav nav-pills flex-column">
<li class="nav-item collapsed side" data-toggle="collapse" data-target="#home">
<a class="nav-link" routerLinkActive="active" routerLink="/home" [routerLinkActiveOptions]="{exact: true}">Home</a>
</li>
<ul class="sub-menu collapse" id="home">
<li class="nav-item list-unstyled"> <a class="nav-link" routerLinkActive="active" routerLink="/home/submenu">Submenu</a>
</li>
<li class="nav-item list-unstyled">
<a class="nav-link" routerLinkActive="active" routerLink="/home/submenu2">Submenu2</a>
</li>
<li class="nav-item side">
<a class="nav-link" routerLinkActive="active" routerLink="/secondMenu"MenuItem>/a>
</li>
</ul>
</ng-sidebar>
<div ng-sidebar-content>
<header class="demo-header">
<button class="navbar-toggler " type="button" (click)="_toggleOpened()" data-toggle="collapse" data-target="#sidebar" aria-controls="navbarsExampleDefault"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
<span>ng-sidebar</span>
</header>
<section class="demo-contents">
<router-outlet></router-outlet>
</section>
</div>
What I do not understand is, how to put a :
<button class="navbar-toggler " type="button" data-toggle="collapse" data-target="#sidebar" aria-controls="navbarsExampleDefault"
aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
That when clicked, called
_toggleOpened() and [mode]="_MODES[_modeNum]"
mode should be push
Example link
And have it on the top bar as in the example. Because no css style is applied on my document when trying the demo.
How do I make that button and sidebar to only push the content as in the link when clicking mode-push, and also add transparent background ?
So the button should push the content, add background and when clicking anywhere outside on the screen to be closed. ?
I'm very sorry again, I just need a simple layout to help me get started :| To understand it
Thank you in advance!