mirror of
https://github.com/carbon-design-system/carbon-components-svelte.git
synced 2025-09-18 19:46:36 +00:00
Fix persistentHamburgerMenu
offset behavior.
This commit is contained in:
parent
d0ead2e74d
commit
bd570780db
3 changed files with 14 additions and 3 deletions
|
@ -3,7 +3,10 @@
|
||||||
export let id = "main-content";
|
export let id = "main-content";
|
||||||
|
|
||||||
import { Grid, Row, Column } from "../Grid";
|
import { Grid, Row, Column } from "../Grid";
|
||||||
import { shouldRenderHamburgerMenu } from "./navStore";
|
import {
|
||||||
|
shouldRenderHamburgerMenu,
|
||||||
|
isPersistentHamburgerMenu,
|
||||||
|
} from "./navStore";
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
|
@ -19,7 +22,9 @@
|
||||||
<Grid>
|
<Grid>
|
||||||
<Row>
|
<Row>
|
||||||
<Column
|
<Column
|
||||||
lg="{$shouldRenderHamburgerMenu ? { span: 13, offset: 3 } : {}}"
|
lg="{$shouldRenderHamburgerMenu && !$isPersistentHamburgerMenu
|
||||||
|
? { span: 13, offset: 3 }
|
||||||
|
: {}}"
|
||||||
>
|
>
|
||||||
<slot />
|
<slot />
|
||||||
</Column>
|
</Column>
|
||||||
|
|
|
@ -62,11 +62,15 @@
|
||||||
|
|
||||||
import Close from "../icons/Close.svelte";
|
import Close from "../icons/Close.svelte";
|
||||||
import Menu from "../icons/Menu.svelte";
|
import Menu from "../icons/Menu.svelte";
|
||||||
import { shouldRenderHamburgerMenu } from "./navStore";
|
import {
|
||||||
|
shouldRenderHamburgerMenu,
|
||||||
|
isPersistentHamburgerMenu,
|
||||||
|
} from "./navStore";
|
||||||
import HamburgerMenu from "./HamburgerMenu.svelte";
|
import HamburgerMenu from "./HamburgerMenu.svelte";
|
||||||
|
|
||||||
let winWidth = undefined;
|
let winWidth = undefined;
|
||||||
|
|
||||||
|
$: $isPersistentHamburgerMenu = persistentHamburgerMenu;
|
||||||
$: isSideNavOpen =
|
$: isSideNavOpen =
|
||||||
expandedByDefault &&
|
expandedByDefault &&
|
||||||
winWidth >= expansionBreakpoint &&
|
winWidth >= expansionBreakpoint &&
|
||||||
|
|
|
@ -1,3 +1,5 @@
|
||||||
import { writable } from "svelte/store";
|
import { writable } from "svelte/store";
|
||||||
|
|
||||||
export const shouldRenderHamburgerMenu = writable(false);
|
export const shouldRenderHamburgerMenu = writable(false);
|
||||||
|
|
||||||
|
export const isPersistentHamburgerMenu = writable(false);
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue