mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-18 11:36:36 +00:00
parent
8d55752a18
commit
e9501be58a
2 changed files with 3 additions and 20 deletions
|
@ -1,24 +1,8 @@
|
|||
<script>
|
||||
/** Specify the id for the main element */
|
||||
export let id = "main-content";
|
||||
|
||||
import { isSideNavCollapsed, isSideNavRail } from "./navStore";
|
||||
|
||||
/**
|
||||
* By default, the `SideNav` applies a left margin of `3rem` to `Content`
|
||||
* if it's a sibling component (e.g., .bx--side-nav ~ .bx--content).
|
||||
*
|
||||
* We manually unset the left margin if the `SideNav`
|
||||
* is collapsed and if it's not the `rail` variant.
|
||||
*/
|
||||
$: unsetLeftMargin = $isSideNavCollapsed && !$isSideNavRail;
|
||||
</script>
|
||||
|
||||
<main
|
||||
id="{id}"
|
||||
class:bx--content="{true}"
|
||||
{...$$restProps}
|
||||
style="{unsetLeftMargin ? 'margin-left: 0;' : ''} {$$restProps.style}"
|
||||
>
|
||||
<main id="{id}" class:bx--content="{true}" {...$$restProps}>
|
||||
<slot />
|
||||
</main>
|
||||
|
|
|
@ -72,9 +72,8 @@
|
|||
class:bx--side-nav__navigation="{true}"
|
||||
class:bx--side-nav="{true}"
|
||||
class:bx--side-nav--ux="{true}"
|
||||
class:bx--side-nav--expanded="{rail && winWidth >= expansionBreakpoint
|
||||
? false
|
||||
: isOpen}"
|
||||
class:bx--side-nav--fixed="{isOpen && !rail}"
|
||||
class:bx--side-nav--expanded="{!rail && winWidth >= expansionBreakpoint}"
|
||||
class:bx--side-nav--collapsed="{!isOpen && !rail}"
|
||||
class:bx--side-nav--rail="{rail}"
|
||||
{...$$restProps}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue