title: How to customize NbLayoutComponent by extending it to a new class
body: <p>I would like to have the footer full screen width, rather than the width of the contents section (<a href="https://ibb.co/GvYgHmW" rel="nofollow noreferrer">screen width - sidebar width</a>). Is there any way to do this?</p>
  
  <p>I am using <a href="https://akveo.github.io/nebular/docs/getting-started/what-is-nebular#what-is-nebular" rel="nofollow noreferrer">Nebular</a> to build my app.</p>
  
  <p>I couldn't find any option in Nebular docs to do this. So I tried extending the nbLayoutComponent, named it customNgLayoutComponent, and customized it to my desired template layout and used it wherever nb-layout is used. I am not sure this is the right way of customizing a component from a library.</p>
  
  <p>I basically copied the original template of the nbLayoutComponent from the source <a href="https://github.com/akveo/nebular/blob/master/src/framework/theme/components/layout/layout.component.ts" rel="nofollow noreferrer">https://github.com/akveo/nebular/blob/master/src/framework/theme/components/layout/layout.component.ts</a> and tweaked it a little (placed <code>&lt;ng-content select="nb-layout-footer"&gt;&lt;/ng-content&gt;</code> in layout div instead of content div). </p>
  
  <p>I am expecting the component template to be overridden with my custom template. But it does not work. Is this how you override the template of a component from a library? Do I have to also copy all the functions in nbLayoutComponent to make my customNbLayout work?</p>