@sierra-95/svelte-scaffold 1.0.17 → 1.0.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/components/Modules/Layout/Header/gridIcon.svelte +13 -0
  2. package/dist/components/Modules/Layout/Header/gridIcon.svelte.d.ts +11 -0
  3. package/dist/components/Modules/Layout/Header/header.svelte +9 -4
  4. package/dist/components/Modules/Layout/Header/header.svelte.d.ts +2 -0
  5. package/dist/components/Modules/Layout/collapse.svelte +1 -1
  6. package/dist/components/Modules/Layout/main.svelte +2 -0
  7. package/dist/components/Modules/Layout/main.svelte.d.ts +2 -0
  8. package/package.json +1 -1
package/dist/components/Modules/Layout/Header/gridIcon.svelte ADDED
@@ -0,0 +1,13 @@
1
+ <script>
2
+ let { dashboardMenuColor} = $props();
3
+ </script>
4
+ <svg width="35px" height="35px" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" fill="#000000" stroke="#000000">
5
+ <g id="SVGRepo_bgCarrier" stroke-width="0"/>
6
+
7
+ <g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
8
+
9
+ <g id="SVGRepo_iconCarrier">
10
+
11
+ <path fill={dashboardMenuColor} d="M640 384v256H384V384h256zm64 0h192v256H704V384zm-64 512H384V704h256v192zm64 0V704h192v192H704zm-64-768v192H384V128h256zm64 0h192v192H704V128zM320 384v256H128V384h192zm0 512H128V704h192v192zm0-768v192H128V128h192z"/>
12
+ </g>
13
+ </svg>
package/dist/components/Modules/Layout/Header/gridIcon.svelte.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ export default GridIcon;
2
+ type GridIcon = {
3
+ $on?(type: string, callback: (e: any) => void): () => void;
4
+ $set?(props: Partial<$$ComponentProps>): void;
5
+ };
6
+ declare const GridIcon: import("svelte").Component<{
7
+ dashboardMenuColor: any;
8
+ }, {}, "">;
9
+ type $$ComponentProps = {
10
+ dashboardMenuColor: any;
11
+ };
package/dist/components/Modules/Layout/Header/header.svelte CHANGED
@@ -1,5 +1,6 @@
1
1
  <script>
2
2
  import {isMobile} from '../../../../index.js';
3
+ import GridIcon from './gridIcon.svelte';
3
4
  import './header.css';
4
5
  const {
5
6
  headerTitle,
@@ -9,16 +10,17 @@
9
10
  toggleMenu = (() => {}),
10
11
  headerCenterContent,
11
12
  headerRightContent,
13
+ dashboardMenuColor,
12
14
  } = $props();
13
15
  </script>
14
16
  <header id='sierra-header'>
15
17
  <div style="display: flex; align-items: center; gap: 1rem;">
16
- <button aria-label="Toggle menu" style="cursor: pointer; margin-left: 0.5rem; {$isMobile ? '':'display:none;'}" onclick={toggleMenu}>
18
+ <!-- <button aria-label="Toggle menu" style="cursor: pointer; margin-left: 0.5rem; {$isMobile ? '':'display:none;'}" onclick={toggleMenu}>
17
19
  <div class="bar"></div>
18
20
  <div class="bar"></div>
19
21
  <div class="bar"></div>
20
- </button>
21
- <a href={headerLink} style="display: flex; align-items: center; gap: 0.5rem; color: inherit; {$isMobile ? '':'margin-left: 1rem;'}">
22
+ </button> -->
23
+ <a href={headerLink} style="display: flex; align-items: center; gap: 0.5rem; color: inherit; margin-left: 1rem;'}">
22
24
  {#if headerImage}
23
25
  <img style="--header-image-size : {headerImageSize}" src={headerImage} alt="Logo"/>
24
26
  {/if}
@@ -28,5 +30,8 @@
28
30
  </a>
29
31
  </div>
30
32
  <div>{@render headerCenterContent?.()}</div>
31
- <div>{@render headerRightContent?.()}</div>
33
+ <div style="display: flex; gap: 1rem; align-items: center;">
34
+ {@render headerRightContent?.()}
35
+ <button onclick={toggleMenu} title="Menu" style="margin-right: 1rem;"><GridIcon {dashboardMenuColor} /></button>
36
+ </div>
32
37
  </header>
package/dist/components/Modules/Layout/Header/header.svelte.d.ts CHANGED
@@ -11,6 +11,7 @@ declare const Header: import("svelte").Component<{
11
11
  toggleMenu?: any;
12
12
  headerCenterContent: any;
13
13
  headerRightContent: any;
14
+ dashboardMenuColor: any;
14
15
  }, {}, "">;
15
16
  type $$ComponentProps = {
16
17
  headerTitle: any;
@@ -20,4 +21,5 @@ type $$ComponentProps = {
20
21
  toggleMenu?: any;
21
22
  headerCenterContent: any;
22
23
  headerRightContent: any;
24
+ dashboardMenuColor: any;
23
25
  };
package/dist/components/Modules/Layout/collapse.svelte CHANGED
@@ -13,9 +13,9 @@
13
13
  stroke-width="1"
14
14
  stroke-linecap="round"
15
15
  stroke-linejoin="round"
16
- class="shrink-0 {isMenuOpen ? '' : '-scale-x-100'}"
17
16
  aria-hidden="true"
18
17
  focusable="false"
18
+ style="transform: {isMenuOpen? 'scaleX(1)': 'scaleX(-1)'}; flexShrink: 0"
19
19
  >
20
20
  <path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z" />
21
21
  <path d="M9 4v16" />
package/dist/components/Modules/Layout/main.svelte CHANGED
@@ -18,6 +18,7 @@
18
18
  headerCenterContent = null,
19
19
  headerRightContent = null,
20
20
  paddingOff = false,
21
+ dashboardMenuColor = 'var(--primary-bg)',
21
22
  } = $props();
22
23
 
23
24
 
@@ -77,6 +78,7 @@
77
78
  {toggleMenu}
78
79
  {headerCenterContent}
79
80
  {headerRightContent}
81
+ {dashboardMenuColor}
80
82
  />
81
83
  {#if $isLoading}<LinearProgress />{/if}
82
84
  <div id="sierra-layout">
package/dist/components/Modules/Layout/main.svelte.d.ts CHANGED
@@ -14,6 +14,7 @@ declare const Main: import("svelte").Component<{
14
14
  headerCenterContent?: any;
15
15
  headerRightContent?: any;
16
16
  paddingOff?: boolean;
17
+ dashboardMenuColor?: string;
17
18
  }, {}, "">;
18
19
  type $$ComponentProps = {
19
20
  children: any;
@@ -26,4 +27,5 @@ type $$ComponentProps = {
26
27
  headerCenterContent?: any;
27
28
  headerRightContent?: any;
28
29
  paddingOff?: boolean;
30
+ dashboardMenuColor?: string;
29
31
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sierra-95/svelte-scaffold",
3
- "version": "1.0.17",
3
+ "version": "1.0.18",
4
4
  "scripts": {
5
5
  "dev": "vite dev",
6
6
  "build": "vite build && npm run prepack",