search

mattrosno / carbon-platform

carbon-platform-git-main.mattrosno.vercel.app
0 stars 0 forks source link

Carbon UI shell with side nav is not built to work with Carbon's grid #4

Open mattrosno opened 3 years ago

mattrosno commented 3 years ago

I'm using Carbon's HeaderContainer, Header, and SideNav. Because the SideNav is fixed positioned, the Carbon component Content by default renders full viewport width and under the SideNav.

I had to use my own .content class with:

@import "carbon-components/scss/globals/scss/layout";

.content {
  margin: 3rem 0 0 16rem;
  background: var(--cds-ui-background);

  @include carbon--breakpoint-down(lg) {
    margin-left: 0;
  }
}

Also, Carbon guidance talks about grid influencer when there's a left rail, but does not specify if there should be a 256px left influencer when using Carbon's default UI shell.