@paperless/core 1.26.0 → 1.26.1
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.
- package/CHANGELOG.md +8 -0
- package/dist/build/p-21e5da04.entry.js +2 -0
- package/dist/build/p-21e5da04.entry.js.map +1 -0
- package/dist/build/p-de4ae1ca.entry.js +2 -0
- package/dist/build/p-de4ae1ca.entry.js.map +1 -0
- package/dist/build/paperless.esm.js +1 -1
- package/dist/cjs/p-layout.cjs.entry.js +1 -1
- package/dist/cjs/p-layout.cjs.entry.js.map +1 -1
- package/dist/cjs/p-navbar.cjs.entry.js +1 -1
- package/dist/cjs/p-navbar.cjs.entry.js.map +1 -1
- package/dist/collection/components/atoms/layout/layout.component.css +1 -1
- package/dist/collection/components/atoms/layout/layout.component.js +2 -2
- package/dist/collection/components/atoms/layout/layout.component.js.map +1 -1
- package/dist/collection/components/organisms/navbar/navbar.component.css +1 -1
- package/dist/collection/tailwind/screens.js +14 -6
- package/dist/collection/tailwind/width.js +14 -19
- package/dist/components/p-layout.js +1 -1
- package/dist/components/p-layout.js.map +1 -1
- package/dist/components/p-navbar.js +1 -1
- package/dist/components/p-navbar.js.map +1 -1
- package/dist/esm/p-layout.entry.js +1 -1
- package/dist/esm/p-layout.entry.js.map +1 -1
- package/dist/esm/p-navbar.entry.js +1 -1
- package/dist/esm/p-navbar.entry.js.map +1 -1
- package/dist/index.html +1 -1
- package/dist/paperless/p-21e5da04.entry.js +2 -0
- package/dist/paperless/p-21e5da04.entry.js.map +1 -0
- package/dist/paperless/p-de4ae1ca.entry.js +2 -0
- package/dist/paperless/p-de4ae1ca.entry.js.map +1 -0
- package/dist/paperless/paperless.esm.js +1 -1
- package/dist/sw.js +1 -1
- package/dist/sw.js.map +1 -1
- package/dist/tailwind/screens.js +14 -6
- package/dist/tailwind/width.js +14 -19
- package/dist/types/components/atoms/layout/layout.component.d.ts +1 -1
- package/dist/types/components.d.ts +2 -2
- package/hydrate/index.js +2 -2
- package/package.json +1 -1
- package/dist/build/p-03090f03.entry.js +0 -2
- package/dist/build/p-03090f03.entry.js.map +0 -1
- package/dist/build/p-46a939e2.entry.js +0 -2
- package/dist/build/p-46a939e2.entry.js.map +0 -1
- package/dist/paperless/p-03090f03.entry.js +0 -2
- package/dist/paperless/p-03090f03.entry.js.map +0 -1
- package/dist/paperless/p-46a939e2.entry.js +0 -2
- package/dist/paperless/p-46a939e2.entry.js.map +0 -1
package/dist/tailwind/screens.js
CHANGED
|
@@ -1,8 +1,16 @@
|
|
|
1
1
|
module.exports = {
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
2
|
+
tablet: '40rem', // 640 px
|
|
3
|
+
'desktop-xs': '64rem', // 1024 px
|
|
4
|
+
'desktop-sm': '80rem', // 1360 px
|
|
5
|
+
desktop: '85.375rem', // 1366
|
|
6
|
+
'desktop-lg': '90rem', // 1440
|
|
7
|
+
'desktop-xl': '120rem', // 1920
|
|
8
|
+
|
|
9
|
+
// layout sizes
|
|
10
|
+
'layout-1280': '80rem',
|
|
11
|
+
'layout-1440': '90rem',
|
|
12
|
+
'layout-1536': '96rem',
|
|
13
|
+
'layout-1680': '105rem',
|
|
14
|
+
'layout-1920': '120rem',
|
|
15
|
+
'layout-2560': '160rem',
|
|
8
16
|
};
|
package/dist/tailwind/width.js
CHANGED
|
@@ -1,23 +1,18 @@
|
|
|
1
1
|
module.exports = {
|
|
2
|
-
|
|
3
|
-
|
|
2
|
+
width: {
|
|
3
|
+
unset: 'unset',
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
// default variant
|
|
6
|
+
'content-mobile': '100%',
|
|
7
|
+
'content-1280': '65rem',
|
|
8
|
+
'content-1440': '75rem',
|
|
9
|
+
'content-1536': '81rem',
|
|
10
|
+
'content-1680': '87rem',
|
|
11
|
+
'content-1920': '90rem',
|
|
12
|
+
'content-2560': '92.5rem',
|
|
8
13
|
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
'content-desktop-lg': '69rem',
|
|
14
|
-
'content-desktop-xl': '69rem',
|
|
15
|
-
|
|
16
|
-
// login variant
|
|
17
|
-
'sidebar-desktop-login': '100%',
|
|
18
|
-
'content-desktop-login': '30rem',
|
|
19
|
-
|
|
20
|
-
// office variant
|
|
21
|
-
'sidebar-office-desktop': '19.5rem'
|
|
22
|
-
},
|
|
14
|
+
// login variant
|
|
15
|
+
'sidebar-desktop-login': '100%',
|
|
16
|
+
'content-desktop-login': '30rem',
|
|
17
|
+
},
|
|
23
18
|
};
|
|
@@ -661,7 +661,7 @@ export namespace Components {
|
|
|
661
661
|
/**
|
|
662
662
|
* Variant of the layout
|
|
663
663
|
*/
|
|
664
|
-
"variant": 'default' | 'login'
|
|
664
|
+
"variant": 'default' | 'login';
|
|
665
665
|
}
|
|
666
666
|
interface PLoader {
|
|
667
667
|
/**
|
|
@@ -2722,7 +2722,7 @@ declare namespace LocalJSX {
|
|
|
2722
2722
|
/**
|
|
2723
2723
|
* Variant of the layout
|
|
2724
2724
|
*/
|
|
2725
|
-
"variant"?: 'default' | 'login'
|
|
2725
|
+
"variant"?: 'default' | 'login';
|
|
2726
2726
|
}
|
|
2727
2727
|
interface PLoader {
|
|
2728
2728
|
/**
|
package/hydrate/index.js
CHANGED
|
@@ -20088,7 +20088,7 @@ class Label {
|
|
|
20088
20088
|
}; }
|
|
20089
20089
|
}
|
|
20090
20090
|
|
|
20091
|
-
const layoutComponentCss = "/*!@.relative*/.relative.sc-p-layout{position:relative!important}/*!@.sticky*/.sticky.sc-p-layout{position:sticky!important}/*!@.order-1*/.order-1.sc-p-layout{order:1!important}/*!@.order-2*/.order-2.sc-p-layout{order:2!important}/*!@.order-3*/.order-3.sc-p-layout{order:3!important}/*!@.box-border*/.box-border.sc-p-layout{box-sizing:border-box!important}/*!@.flex*/.flex.sc-p-layout{display:flex!important}/*!@.grid*/.grid.sc-p-layout{display:grid!important}/*!@.hidden*/.hidden.sc-p-layout{display:none!important}/*!@.h-full*/.h-full.sc-p-layout{height:100%!important}/*!@.h-screen*/.h-screen.sc-p-layout{height:100vh!important}/*!@.w-full*/.w-full.sc-p-layout{width:100%!important}/*!@.w-screen*/.w-screen.sc-p-layout{width:100vw!important}/*!@.w-
|
|
20091
|
+
const layoutComponentCss = "/*!@.relative*/.relative.sc-p-layout{position:relative!important}/*!@.sticky*/.sticky.sc-p-layout{position:sticky!important}/*!@.order-1*/.order-1.sc-p-layout{order:1!important}/*!@.order-2*/.order-2.sc-p-layout{order:2!important}/*!@.order-3*/.order-3.sc-p-layout{order:3!important}/*!@.box-border*/.box-border.sc-p-layout{box-sizing:border-box!important}/*!@.flex*/.flex.sc-p-layout{display:flex!important}/*!@.grid*/.grid.sc-p-layout{display:grid!important}/*!@.hidden*/.hidden.sc-p-layout{display:none!important}/*!@.h-full*/.h-full.sc-p-layout{height:100%!important}/*!@.h-screen*/.h-screen.sc-p-layout{height:100vh!important}/*!@.w-full*/.w-full.sc-p-layout{width:100%!important}/*!@.w-screen*/.w-screen.sc-p-layout{width:100vw!important}/*!@.w-unset*/.w-unset.sc-p-layout{width:unset!important}/*!@.flex-1*/.flex-1.sc-p-layout{flex:1 1 0%!important}/*!@.flex-col*/.flex-col.sc-p-layout{flex-direction:column!important}/*!@.content-start*/.content-start.sc-p-layout{align-content:flex-start!important}/*!@.items-center*/.items-center.sc-p-layout{align-items:center!important}/*!@.overflow-y-auto*/.overflow-y-auto.sc-p-layout{overflow-y:auto!important}/*!@.px-content-mobile-x*/.px-content-mobile-x.sc-p-layout{padding-left:1rem!important;padding-right:1rem!important}/*!@**/*.sc-p-layout{box-sizing:border-box}/*!@:host*/.sc-p-layout-h{align-content:flex-start;display:grid;gap:0;grid-template-areas:\"sidebar\" \"topbar\" \"content\";grid-template-columns:1fr;grid-template-rows:repeat(1fr,3);height:100vh;overflow:hidden;width:100vw}@media (min-width:80rem){/*!@:host*/.sc-p-layout-h{grid-template-areas:\"topbar topbar\" \"sidebar content\";grid-template-columns:auto 1fr;grid-template-rows:auto 1fr}}/*!@:host .content,:host .sidebar,:host .topbar*/.sc-p-layout-h .content.sc-p-layout,.sc-p-layout-h .sidebar.sc-p-layout,.sc-p-layout-h .topbar.sc-p-layout{align-self:flex-start}/*!@:host .topbar*/.sc-p-layout-h .topbar.sc-p-layout{grid-area:topbar;order:2;position:sticky;width:100%}@media (min-width:80rem){/*!@:host .topbar*/.sc-p-layout-h .topbar.sc-p-layout{order:1}}/*!@:host .sidebar*/.sc-p-layout-h .sidebar.sc-p-layout{box-sizing:border-box;display:flex;grid-area:sidebar;height:100%;order:1;width:100%}@media (min-width:80rem){/*!@:host .sidebar*/.sc-p-layout-h .sidebar.sc-p-layout{order:2;width:15rem}}@media (min-width:105rem){/*!@:host .sidebar*/.sc-p-layout-h .sidebar.sc-p-layout{width:18rem}}/*!@:host .content*/.sc-p-layout-h .content.sc-p-layout{display:flex;flex-direction:column;grid-area:content;height:100%;order:3;overflow-x:hidden;overflow-y:auto;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:relative}/*!@:host .content .inner-content*/.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{padding:1.5rem 1rem;position:relative}@media (min-width:40rem){/*!@:host .content .inner-content*/.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{padding:2rem}}@media (min-width:80rem){/*!@:host .content .inner-content*/.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{padding:2rem 1.5rem 1.5rem;width:65rem}}@media (min-width:90rem){/*!@:host .content .inner-content*/.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{padding:2rem;width:75rem}}@media (min-width:96rem){/*!@:host .content .inner-content*/.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{width:81rem}}@media (min-width:105rem){/*!@:host .content .inner-content*/.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{width:87rem}}@media (min-width:120rem){/*!@:host .content .inner-content*/.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{padding-bottom:5rem;padding-left:5rem;padding-right:2rem;width:90rem}}@media (min-width:160rem){/*!@:host .content .inner-content*/.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{padding-bottom:7.5rem;padding-left:7.5rem;padding-top:4rem;width:92.5rem}}/*!@:host(.variant-default) .content*/.variant-default.sc-p-layout-h .content.sc-p-layout{flex:1 1 0%}/*!@:host(.variant-login)*/.variant-login.sc-p-layout-h{grid-template-areas:\"topbar topbar\" \"content content\"}@media (min-width:80rem){/*!@:host(.variant-login)*/.variant-login.sc-p-layout-h{grid-template-areas:\"topbar topbar\" \"content sidebar\"}}/*!@:host(.variant-login) .sidebar*/.variant-login.sc-p-layout-h .sidebar.sc-p-layout{display:none;flex:1 1 0%;order:3;overflow:hidden;padding:.5rem;width:unset}@media (min-width:80rem){/*!@:host(.variant-login) .sidebar*/.variant-login.sc-p-layout-h .sidebar.sc-p-layout{display:flex}}/*!@:host(.variant-login) .sidebar .inner-content*/.variant-login.sc-p-layout-h .sidebar.sc-p-layout .inner-content.sc-p-layout{padding:.5rem}/*!@:host(.variant-login) .content*/.variant-login.sc-p-layout-h .content.sc-p-layout{align-items:center;order:3}@media (min-width:80rem){/*!@:host(.variant-login) .content*/.variant-login.sc-p-layout-h .content.sc-p-layout{justify-content:center;order:2}}/*!@:host(.variant-login) .content .inner-content*/.variant-login.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{box-sizing:border-box;padding:calc(env(safe-area-inset-top) + 3.5rem) 1rem 1.5rem;width:100%}@media (min-width:64rem){/*!@:host(.variant-login) .content .inner-content*/.variant-login.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{padding-bottom:0;padding-top:0}}@media (min-width:80rem){/*!@:host(.variant-login) .content .inner-content*/.variant-login.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{padding-left:4.5rem;padding-right:4.5rem;padding-top:1.5rem}}@media (min-width:40rem){/*!@:host(.variant-login) .content .inner-content*/.variant-login.sc-p-layout-h .content.sc-p-layout .inner-content.sc-p-layout{width:30rem}}@media (min-width:80rem){/*!@.layout-1280\\:flex*/.layout-1280\\:flex.sc-p-layout{display:flex!important}/*!@.layout-1280\\:w-60*/.layout-1280\\:w-60.sc-p-layout{width:15rem!important}/*!@.layout-1280\\:w-content-1280*/.layout-1280\\:w-content-1280.sc-p-layout{width:65rem!important}/*!@.layout-1280\\:p-6*/.layout-1280\\:p-6.sc-p-layout{padding:1.5rem!important}/*!@.layout-1280\\:px-18*/.layout-1280\\:px-18.sc-p-layout{padding-left:4.5rem!important;padding-right:4.5rem!important}}@media (min-width:90rem){/*!@.layout-1440\\:w-content-1440*/.layout-1440\\:w-content-1440.sc-p-layout{width:75rem!important}}@media (min-width:120rem){/*!@.layout-1920\\:w-content-1920*/.layout-1920\\:w-content-1920.sc-p-layout{width:90rem!important}/*!@.layout-1920\\:pl-20*/.layout-1920\\:pl-20.sc-p-layout{padding-left:5rem!important}/*!@.layout-1920\\:pr-8*/.layout-1920\\:pr-8.sc-p-layout{padding-right:2rem!important}}@media (min-width:160rem){/*!@.layout-2560\\:w-content-2560*/.layout-2560\\:w-content-2560.sc-p-layout{width:92.5rem!important}/*!@.layout-2560\\:pb-\\[7\\.5rem\\]*/.layout-2560\\:pb-\\[7\\.5rem\\].sc-p-layout{padding-bottom:7.5rem!important}/*!@.layout-2560\\:pl-\\[7\\.5rem\\]*/.layout-2560\\:pl-\\[7\\.5rem\\].sc-p-layout{padding-left:7.5rem!important}/*!@.layout-2560\\:pt-16*/.layout-2560\\:pt-16.sc-p-layout{padding-top:4rem!important}}/*!@.static*/.static.sc-p-layout{position:static!important}";
|
|
20092
20092
|
|
|
20093
20093
|
class Layout {
|
|
20094
20094
|
constructor(hostRef) {
|
|
@@ -20432,7 +20432,7 @@ class ModalHeader {
|
|
|
20432
20432
|
}; }
|
|
20433
20433
|
}
|
|
20434
20434
|
|
|
20435
|
-
const navbarComponentCss = "/*!@.fixed*/.fixed.sc-p-navbar{position:fixed!important}/*!@.left-0*/.left-0.sc-p-navbar{left:0!important}/*!@.top-0*/.top-0.sc-p-navbar{top:0!important}/*!@.z-navbar*/.z-navbar.sc-p-navbar{z-index:300!important}/*!@.mt-auto*/.mt-auto.sc-p-navbar{margin-top:auto!important}/*!@.block*/.block.sc-p-navbar{display:block!important}/*!@.flex*/.flex.sc-p-navbar{display:flex!important}/*!@.hidden*/.hidden.sc-p-navbar{display:none!important}/*!@.h-screen*/.h-screen.sc-p-navbar{height:100vh!important}/*!@.w-60*/.w-60.sc-p-navbar{width:15rem!important}/*!@.w-full*/.w-full.sc-p-navbar{width:100%!important}/*!@.-translate-x-full*/.-translate-x-full.sc-p-navbar{--tw-translate-x:-100%!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}/*!@.transform-gpu*/.transform-gpu.sc-p-navbar{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}/*!@.items-center*/.items-center.sc-p-navbar{align-items:center!important}/*!@.justify-between*/.justify-between.sc-p-navbar{justify-content:space-between!important}/*!@.border-0*/.border-0.sc-p-navbar{border-width:0!important}/*!@.border-b*/.border-b.sc-p-navbar{border-bottom-width:1px!important}/*!@.border-r*/.border-r.sc-p-navbar{border-right-width:1px!important}/*!@.border-solid*/.border-solid.sc-p-navbar{border-style:solid!important}/*!@.border-mystic-dark*/.border-mystic-dark.sc-p-navbar{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}/*!@.px-4*/.px-4.sc-p-navbar{padding-left:1rem!important;padding-right:1rem!important}/*!@**/*.sc-p-navbar{box-sizing:border-box}/*!@:host*/.sc-p-navbar-h{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:
|
|
20435
|
+
const navbarComponentCss = "/*!@.fixed*/.fixed.sc-p-navbar{position:fixed!important}/*!@.left-0*/.left-0.sc-p-navbar{left:0!important}/*!@.top-0*/.top-0.sc-p-navbar{top:0!important}/*!@.z-navbar*/.z-navbar.sc-p-navbar{z-index:300!important}/*!@.mt-auto*/.mt-auto.sc-p-navbar{margin-top:auto!important}/*!@.block*/.block.sc-p-navbar{display:block!important}/*!@.flex*/.flex.sc-p-navbar{display:flex!important}/*!@.hidden*/.hidden.sc-p-navbar{display:none!important}/*!@.h-screen*/.h-screen.sc-p-navbar{height:100vh!important}/*!@.w-60*/.w-60.sc-p-navbar{width:15rem!important}/*!@.w-full*/.w-full.sc-p-navbar{width:100%!important}/*!@.-translate-x-full*/.-translate-x-full.sc-p-navbar{--tw-translate-x:-100%!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}/*!@.transform-gpu*/.transform-gpu.sc-p-navbar{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}/*!@.items-center*/.items-center.sc-p-navbar{align-items:center!important}/*!@.justify-between*/.justify-between.sc-p-navbar{justify-content:space-between!important}/*!@.border-0*/.border-0.sc-p-navbar{border-width:0!important}/*!@.border-b*/.border-b.sc-p-navbar{border-bottom-width:1px!important}/*!@.border-r*/.border-r.sc-p-navbar{border-right-width:1px!important}/*!@.border-solid*/.border-solid.sc-p-navbar{border-style:solid!important}/*!@.border-mystic-dark*/.border-mystic-dark.sc-p-navbar{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}/*!@.px-4*/.px-4.sc-p-navbar{padding-left:1rem!important;padding-right:1rem!important}/*!@**/*.sc-p-navbar{box-sizing:border-box}/*!@:host*/.sc-p-navbar-h{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:80rem){/*!@:host*/.sc-p-navbar-h{width:15rem}}@media (min-width:105rem){/*!@:host*/.sc-p-navbar-h{width:18rem}}/*!@:host .sidebar,:host .sidebar .company,:host .sidebar .content,:host .sidebar .user,:host .userbar*/.sc-p-navbar-h .sidebar.sc-p-navbar,.sc-p-navbar-h .sidebar.sc-p-navbar .company.sc-p-navbar,.sc-p-navbar-h .sidebar.sc-p-navbar .content.sc-p-navbar,.sc-p-navbar-h .sidebar.sc-p-navbar .user.sc-p-navbar,.sc-p-navbar-h .userbar.sc-p-navbar{display:flex;flex-direction:column;width:100%}/*!@:host .sidebar,:host .top-bar*/.sc-p-navbar-h .sidebar.sc-p-navbar,.sc-p-navbar-h .top-bar.sc-p-navbar{--tw-bg-opacity:1;--tw-border-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-style:solid!important;border-width:0!important}/*!@:host .sidebar*/.sc-p-navbar-h .sidebar.sc-p-navbar{--tw-bg-opacity:1;--tw-translate-x:-100%;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-right-width:1px!important;gap:1.5rem;height:100vh;left:0;padding-bottom:1rem;padding-top:calc(env(safe-area-inset-top, 0) + 1rem);position:fixed;top:0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:15rem;will-change:transform;z-index:300}@media (min-width:80rem){/*!@:host .sidebar*/.sc-p-navbar-h .sidebar.sc-p-navbar{--tw-translate-x:0px;height:100%;position:relative;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));width:100%}}/*!@:host .sidebar .company,:host .sidebar .content,:host .sidebar .header,:host .sidebar .user*/.sc-p-navbar-h .sidebar.sc-p-navbar .company.sc-p-navbar,.sc-p-navbar-h .sidebar.sc-p-navbar .content.sc-p-navbar,.sc-p-navbar-h .sidebar.sc-p-navbar .header.sc-p-navbar,.sc-p-navbar-h .sidebar.sc-p-navbar .user.sc-p-navbar{padding-left:1rem;padding-right:1rem}/*!@:host .sidebar .header*/.sc-p-navbar-h .sidebar.sc-p-navbar .header.sc-p-navbar{align-items:center;display:flex;justify-content:space-between;width:100%}@media (min-width:80rem){/*!@:host .sidebar .header*/.sc-p-navbar-h .sidebar.sc-p-navbar .header.sc-p-navbar{display:none}}/*!@:host .sidebar .content*/.sc-p-navbar-h .sidebar.sc-p-navbar .content.sc-p-navbar{overflow-y:auto;scrollbar-color:#528afa #dae6f0;scrollbar-width:thin}/*!@:host .sidebar .content::-webkit-scrollbar*/.sc-p-navbar-h .sidebar.sc-p-navbar .content.sc-p-navbar::-webkit-scrollbar{width:.25rem}/*!@:host .sidebar .content::-webkit-scrollbar-track*/.sc-p-navbar-h .sidebar.sc-p-navbar .content.sc-p-navbar::-webkit-scrollbar-track{background:#dae6f0}/*!@:host .sidebar .content::-webkit-scrollbar-thumb*/.sc-p-navbar-h .sidebar.sc-p-navbar .content.sc-p-navbar::-webkit-scrollbar-thumb{background:#528afa}/*!@:host .sidebar .content::-webkit-scrollbar-thumb:hover*/.sc-p-navbar-h .sidebar.sc-p-navbar .content.sc-p-navbar::-webkit-scrollbar-thumb:hover{background:#528afa}/*!@:host .sidebar .user*/.sc-p-navbar-h .sidebar.sc-p-navbar .user.sc-p-navbar{display:none;margin-top:auto}@media (min-width:80rem){/*!@:host .sidebar .user*/.sc-p-navbar-h .sidebar.sc-p-navbar .user.sc-p-navbar{display:flex}}/*!@:host .sidebar.show*/.sc-p-navbar-h .sidebar.show.sc-p-navbar{--tw-translate-x:env(safe-area-inset-left,0)}/*!@:host .top-bar*/.sc-p-navbar-h .top-bar.sc-p-navbar{border-bottom-width:1px!important;display:flex;height:calc(env(safe-area-inset-top, 0) + 3rem);justify-content:space-between;padding:calc(env(safe-area-inset-top, 0) + .5rem) 1rem .5rem;width:100%}@media (min-width:80rem){/*!@:host .top-bar*/.sc-p-navbar-h .top-bar.sc-p-navbar{display:none}}/*!@:host p-backdrop*/.sc-p-navbar-h p-backdrop.sc-p-navbar{display:none}/*!@:host p-backdrop.show*/.sc-p-navbar-h p-backdrop.show.sc-p-navbar{display:block}@media (min-width:80rem){/*!@.layout-1280\\:relative*/.layout-1280\\:relative.sc-p-navbar{position:relative!important}/*!@.layout-1280\\:flex*/.layout-1280\\:flex.sc-p-navbar{display:flex!important}/*!@.layout-1280\\:hidden*/.layout-1280\\:hidden.sc-p-navbar{display:none!important}/*!@.layout-1280\\:h-full*/.layout-1280\\:h-full.sc-p-navbar{height:100%!important}/*!@.layout-1280\\:w-60*/.layout-1280\\:w-60.sc-p-navbar{width:15rem!important}}/*!@.static*/.static.sc-p-navbar{position:static!important}/*!@.z-navbar-backdrop*/.z-navbar-backdrop.sc-p-navbar{z-index:290!important}/*!@.m-0*/.m-0.sc-p-navbar{margin:0!important}/*!@.text-xl*/.text-xl.sc-p-navbar{font-size:1.25rem!important;line-height:1.75rem!important}/*!@.font-semibold*/.font-semibold.sc-p-navbar{font-weight:600!important}/*!@.text-storm-dark*/.text-storm-dark.sc-p-navbar{--tw-text-opacity:1!important;color:rgb(39 40 56/var(--tw-text-opacity))!important}@media (min-width:64rem){/*!@.desktop-xs\\:hidden*/.desktop-xs\\:hidden.sc-p-navbar{display:none!important}}";
|
|
20436
20436
|
|
|
20437
20437
|
class Navbar {
|
|
20438
20438
|
constructor(hostRef) {
|
package/package.json
CHANGED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,h as a,H as e}from"./p-e4d5e7a7.js";const r=".fixed{position:fixed!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.mt-auto{margin-top:auto!important}.block{display:block!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!important}.-translate-x-full{--tw-translate-x:-100%!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.items-center{align-items:center!important}.justify-between{justify-content:space-between!important}.border-0{border-width:0!important}.border-b{border-bottom-width:1px!important}.border-r{border-right-width:1px!important}.border-solid{border-style:solid!important}.border-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:64rem){:host{width:15rem}}:host .sidebar,:host .sidebar .company,:host .sidebar .content,:host .sidebar .user,:host .userbar{display:flex;flex-direction:column;width:100%}:host .sidebar,:host .top-bar{--tw-bg-opacity:1;--tw-border-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-style:solid!important;border-width:0!important}:host .sidebar{--tw-bg-opacity:1;--tw-translate-x:-100%;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-right-width:1px!important;gap:1.5rem;height:100vh;left:0;padding-bottom:1rem;padding-top:calc(env(safe-area-inset-top, 0) + 1rem);position:fixed;top:0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:15rem;will-change:transform;z-index:300}@media (min-width:64rem){:host .sidebar{--tw-translate-x:0px;height:100%;position:relative;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));width:100%}}:host .sidebar .company,:host .sidebar .content,:host .sidebar .header,:host .sidebar .user{padding-left:1rem;padding-right:1rem}:host .sidebar .header{align-items:center;display:flex;justify-content:space-between;width:100%}@media (min-width:64rem){:host .sidebar .header{display:none}}:host .sidebar .content{overflow-y:auto;scrollbar-color:#528afa #dae6f0;scrollbar-width:thin}:host .sidebar .content::-webkit-scrollbar{width:.25rem}:host .sidebar .content::-webkit-scrollbar-track{background:#dae6f0}:host .sidebar .content::-webkit-scrollbar-thumb{background:#528afa}:host .sidebar .content::-webkit-scrollbar-thumb:hover{background:#528afa}:host .sidebar .user{display:none;margin-top:auto}@media (min-width:64rem){:host .sidebar .user{display:flex}}:host .sidebar.show{--tw-translate-x:env(safe-area-inset-left,0)}:host .top-bar{border-bottom-width:1px!important;display:flex;height:calc(env(safe-area-inset-top, 0) + 3rem);justify-content:space-between;padding:calc(env(safe-area-inset-top, 0) + .5rem) 1rem .5rem;width:100%}@media (min-width:64rem){:host .top-bar{display:none}}:host p-backdrop{display:none}:host p-backdrop.show{display:block}@media (min-width:64rem){.desktop-xs\\:relative{position:relative!important}.desktop-xs\\:flex{display:flex!important}.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:h-full{height:100%!important}}.static{position:static!important}.z-navbar-backdrop{z-index:290!important}.m-0{margin:0!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.font-semibold{font-weight:600!important}.text-storm-dark{--tw-text-opacity:1!important;color:rgb(39 40 56/var(--tw-text-opacity))!important}";const o=class{constructor(a){t(this,a);this.closeText="Close";this.menuText="Menu";this._showMenu=false}render(){return a(e,{class:"p-navbar"},a("p-backdrop",{applyBlur:true,class:`z-navbar-backdrop desktop-xs:hidden ${this._showMenu&&"show"}`,onClicked:()=>this._showMenu=false}),a("div",{class:`sidebar ${this._showMenu&&"show"}`},a("div",{class:"header"},a("p",{class:"text-xl m-0 font-semibold text-storm-dark"},this.menuText),a("p-button",{variant:"secondary",icon:"negative",iconPosition:"end",size:"small",onClick:()=>this._showMenu=false},this.closeText)),a("div",{class:"company"},a("slot",{name:"company"})),a("div",{class:"content"},a("slot",{name:"content"})),a("div",{class:"user"},a("slot",{name:"user"}))),a("div",{class:"top-bar"},a("p-button",{variant:"secondary",icon:"menu",size:"small",onClick:()=>this._showMenu=true},this.menuText),a("slot",{name:"topbar"})))}handleCloseNavbar(){this._showMenu=false}handleOpenNavbar(){this._showMenu=true}};o.style=r;export{o as p_navbar};
|
|
2
|
-
//# sourceMappingURL=p-03090f03.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["navbarComponentCss","Navbar","render","h","Host","class","applyBlur","this","_showMenu","onClicked","menuText","variant","icon","iconPosition","size","onClick","closeText","name","handleCloseNavbar","handleOpenNavbar"],"sources":["src/components/organisms/navbar/navbar.component.scss?tag=p-navbar&encapsulation=shadow","src/components/organisms/navbar/navbar.component.tsx"],"sourcesContent":["@import '../../../style/mixins';\n\n:host {\n\t@apply w-full max-h-screen-safe;\n\t@apply desktop-xs:w-60;\n\n\t.sidebar,\n\t.sidebar .company,\n\t.sidebar .content,\n\t.sidebar .user,\n\t.userbar {\n\t\t@apply flex w-full flex-col;\n\t}\n\n\t.sidebar,\n\t.top-bar {\n\t\t@apply bg-white;\n\t\t@apply border-0 border-solid border-mystic-dark #{!important};\n\t}\n\n\t.sidebar {\n\t\t@apply fixed top-0 left-0 z-navbar h-screen w-60 bg-white;\n\t\t@apply desktop-xs:relative desktop-xs:h-full desktop-xs:w-full;\n\t\t@apply gap-6;\n\n\t\t@apply will-change-transform;\n\t\t@apply -translate-x-full transform-gpu desktop-xs:translate-x-0;\n\n\t\t@apply py-4;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem);\n\n\t\t@apply border-r #{!important};\n\n\t\t@apply transition-all;\n\n\t\t.company,\n\t\t.content,\n\t\t.user,\n\t\t.header {\n\t\t\t@apply px-4;\n\t\t}\n\n\t\t.header {\n\t\t\t@apply flex w-full items-center justify-between;\n\t\t\t@apply desktop-xs:hidden;\n\t\t}\n\n\t\t.content {\n\t\t\t@apply overflow-y-auto;\n\n\t\t\t@include scrollbarY();\n\t\t}\n\n\t\t.user {\n\t\t\t@apply mt-auto hidden;\n\t\t\t@apply desktop-xs:flex;\n\t\t}\n\n\t\t&.show {\n\t\t\t--tw-translate-x: env(safe-area-inset-left, 0);\n\t\t}\n\t}\n\n\t.top-bar {\n\t\t@apply flex w-full justify-between px-4 py-2;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 0.5rem);\n\t\theight: calc(env(safe-area-inset-top, 0) + 3rem);\n\n\t\t@apply border-b #{!important};\n\n\t\t@apply desktop-xs:hidden;\n\t}\n\n\tp-backdrop {\n\t\t@apply hidden;\n\n\t\t&.show {\n\t\t\t@apply block;\n\t\t}\n\t}\n}\n","import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\n\n@Component({\n\ttag: 'p-navbar',\n\tstyleUrl: 'navbar.component.scss',\n\tshadow: true,\n})\nexport class Navbar {\n\t/**\n\t * The text to display for the close button\n\t */\n\t@Prop() closeText = 'Close';\n\n\t/**\n\t * The text to display for the menu button & sidebar title\n\t */\n\t@Prop() menuText = 'Menu';\n\n\t@State() private _showMenu = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-navbar\">\n\t\t\t\t<p-backdrop\n\t\t\t\t\tapplyBlur={true}\n\t\t\t\t\tclass={`z-navbar-backdrop desktop-xs:hidden ${\n\t\t\t\t\t\tthis._showMenu && 'show'\n\t\t\t\t\t}`}\n\t\t\t\t\tonClicked={() => (this._showMenu = false)}\n\t\t\t\t></p-backdrop>\n\t\t\t\t<div class={`sidebar ${this._showMenu && 'show'}`}>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<p class=\"text-xl m-0 font-semibold text-storm-dark\">\n\t\t\t\t\t\t\t{this.menuText}\n\t\t\t\t\t\t</p>\n\n\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\ticon=\"negative\"\n\t\t\t\t\t\t\ticonPosition=\"end\"\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tonClick={() => (this._showMenu = false)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this.closeText}\n\t\t\t\t\t\t</p-button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"company\">\n\t\t\t\t\t\t<slot name=\"company\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class=\"user\">\n\t\t\t\t\t\t<slot name=\"user\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"top-bar\">\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\ticon=\"menu\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={() => (this._showMenu = true)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this.menuText}\n\t\t\t\t\t</p-button>\n\n\t\t\t\t\t<slot name=\"topbar\" />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('closeNavbar', { target: 'window' })\n\thandleCloseNavbar() {\n\t\tthis._showMenu = false;\n\t}\n\n\t@Listen('openNavbar', { target: 'window' })\n\thandleOpenNavbar() {\n\t\tthis._showMenu = true;\n\t}\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,y9I,MCOdC,EAAM,M,wCAIE,Q,cAKD,O,eAEU,K,CAE7B,MAAAC,GACC,OACCC,EAACC,EAAI,CAACC,MAAM,YACXF,EAAA,cACCG,UAAW,KACXD,MAAO,uCACNE,KAAKC,WAAa,SAEnBC,UAAW,IAAOF,KAAKC,UAAY,QAEpCL,EAAA,OAAKE,MAAO,WAAWE,KAAKC,WAAa,UACxCL,EAAA,OAAKE,MAAM,UACVF,EAAA,KAAGE,MAAM,6CACPE,KAAKG,UAGPP,EAAA,YACCQ,QAAQ,YACRC,KAAK,WACLC,aAAa,MACbC,KAAK,QACLC,QAAS,IAAOR,KAAKC,UAAY,OAEhCD,KAAKS,YAGRb,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMc,KAAK,aAEZd,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMc,KAAK,aAGZd,EAAA,OAAKE,MAAM,QACVF,EAAA,QAAMc,KAAK,WAIbd,EAAA,OAAKE,MAAM,WACVF,EAAA,YACCQ,QAAQ,YACRC,KAAK,OACLE,KAAK,QACLC,QAAS,IAAOR,KAAKC,UAAY,MAEhCD,KAAKG,UAGPP,EAAA,QAAMc,KAAK,Y,CAOf,iBAAAC,GACCX,KAAKC,UAAY,K,CAIlB,gBAAAW,GACCZ,KAAKC,UAAY,I"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,h as e,H as i}from"./p-e4d5e7a7.js";const n='.relative{position:relative!important}.sticky{position:sticky!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.box-border{box-sizing:border-box!important}.flex{display:flex!important}.grid{display:grid!important}.hidden{display:none!important}.h-full{height:100%!important}.h-screen{height:100vh!important}.w-full{width:100%!important}.w-screen{width:100vw!important}.w-sidebar-mobile{width:100%!important}.w-unset{width:unset!important}.flex-1{flex:1 1 0%!important}.flex-col{flex-direction:column!important}.content-start{align-content:flex-start!important}.items-center{align-items:center!important}.overflow-y-auto{overflow-y:auto!important}.px-content-mobile-x{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{align-content:flex-start;display:grid;gap:0;grid-template-areas:"sidebar" "topbar" "content";grid-template-columns:1fr;grid-template-rows:repeat(1fr,3);height:100vh;overflow:hidden;width:100vw}@media (min-width:64rem){:host{grid-template-areas:"topbar topbar" "sidebar content";grid-template-columns:auto 1fr;grid-template-rows:auto 1fr}}:host .content,:host .sidebar,:host .topbar{align-self:flex-start}:host .topbar{grid-area:topbar;order:2;position:sticky;width:100%}@media (min-width:80rem){:host .topbar{order:1}}:host .sidebar{box-sizing:border-box;display:flex;grid-area:sidebar;height:100%;order:1;width:100%}@media (min-width:80rem){:host .sidebar{order:2;width:15rem}}:host .content{display:flex;flex-direction:column;grid-area:content;height:100%;order:3;overflow-x:hidden;overflow-y:auto;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:relative}:host .content .inner-content{padding:1.5rem 1rem;position:relative}@media (min-width:64rem){:host .content .inner-content{padding:2rem;width:100%}}@media (min-width:80rem){:host .content .inner-content{width:100%}}@media (min-width:85.375rem){:host .content .inner-content{width:69rem}}@media (min-width:90rem){:host .content .inner-content{width:69rem}}@media (min-width:120rem){:host .content .inner-content{width:69rem}}:host(.variant-default) .content{flex:1 1 0%}:host(.variant-login){grid-template-areas:"topbar topbar" "content content"}@media (min-width:64rem){:host(.variant-login){grid-template-areas:"topbar topbar" "content sidebar"}}:host(.variant-login) .sidebar{display:none;flex:1 1 0%;order:3;overflow:hidden;padding:.5rem;width:unset}@media (min-width:64rem){:host(.variant-login) .sidebar{display:flex}}:host(.variant-login) .sidebar .inner-content{padding:.5rem}:host(.variant-login) .content{align-items:center;order:3}@media (min-width:64rem){:host(.variant-login) .content{justify-content:center;order:2}}:host(.variant-login) .content .inner-content{box-sizing:border-box;padding:calc(env(safe-area-inset-top) + 3.5rem) 1rem 1.5rem;width:100%}@media (min-width:64rem){:host(.variant-login) .content .inner-content{padding:1.5rem 4.5rem 0}}@media (min-width:40rem){:host(.variant-login) .content .inner-content{width:30rem}}@media (min-width:80rem){:host(.variant-office) .sidebar{width:19.5rem}}@media (min-width:64rem){.desktop-xs\\:flex{display:flex!important}.desktop-xs\\:w-content-desktop-xs{width:100%!important}.desktop-xs\\:px-18{padding-left:4.5rem!important;padding-right:4.5rem!important}.desktop-xs\\:px-content-desktop-x{padding-left:2rem!important;padding-right:2rem!important}}@media (min-width:80rem){.desktop-sm\\:w-content-desktop-sm{width:100%!important}}@media (min-width:85.375rem){.desktop\\:w-content-desktop{width:69rem!important}}@media (min-width:90rem){.desktop-lg\\:w-content-desktop-lg{width:69rem!important}}.static{position:static!important}';const r=class{constructor(e){t(this,e);this.variant="default"}render(){return e(i,{class:`p-layout variant-${this.variant}`},e("div",{class:"topbar"},e("slot",{name:"topbar"})),e("div",{class:"sidebar"},e("slot",{name:"sidebar"})),e("div",{class:"content"},e("div",{class:"inner-content"},e("slot",{name:"content"}))))}};r.style=n;export{r as p_layout};
|
|
2
|
-
//# sourceMappingURL=p-46a939e2.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["layoutComponentCss","Layout","render","h","Host","class","this","variant","name"],"sources":["src/components/atoms/layout/layout.component.scss?tag=p-layout&encapsulation=shadow","src/components/atoms/layout/layout.component.tsx"],"sourcesContent":[":host {\n\t@apply grid h-screen w-screen content-start overflow-hidden;\n\n\tgrid-template-columns: 1fr;\n\tgrid-template-rows: repeat(1fr, 3);\n\tgap: 0;\n\tgrid-template-areas:\n\t\t'sidebar'\n\t\t'topbar'\n\t\t'content';\n\n\t@screen desktop-xs {\n\t\tgrid-template-columns: auto 1fr;\n\t\tgrid-template-rows: auto 1fr;\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'sidebar content';\n\t}\n\n\t.topbar,\n\t.sidebar,\n\t.content {\n\t\t@apply self-start;\n\t}\n\n\t.topbar {\n\t\tgrid-area: topbar;\n\n\t\t@apply sticky w-full;\n\t\t@apply order-2 desktop-sm:order-1;\n\t}\n\n\t.sidebar {\n\t\tgrid-area: sidebar;\n\n\t\t@apply box-border flex h-full;\n\t\t@apply w-sidebar-mobile desktop-sm:w-sidebar-desktop;\n\t\t@apply order-1 desktop-sm:order-2;\n\t}\n\n\t.content {\n\t\tgrid-area: content;\n\n\t\t@apply relative flex h-full flex-col overflow-y-auto overflow-x-hidden;\n\t\t@apply order-3;\n\n\t\tpadding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom)\n\t\t\tenv(safe-area-inset-left);\n\n\t\t.inner-content {\n\t\t\t@apply relative pb-24;\n\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\t@apply desktop-xs:px-content-desktop-x desktop-xs:py-content-desktop-y;\n\n\t\t\t@apply desktop-xs:w-content-desktop-xs desktop-sm:w-content-desktop-sm desktop:w-content-desktop desktop-lg:w-content-desktop-lg desktop-xl:w-content-desktop-xl;\n\t\t}\n\t}\n}\n\n:host(.variant-default) {\n\t.content {\n\t\t@apply flex-1;\n\t}\n}\n\n:host(.variant-login) {\n\tgrid-template-areas:\n\t\t'topbar topbar'\n\t\t'content content';\n\n\t@screen desktop-xs {\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'content sidebar';\n\t}\n\n\t.sidebar {\n\t\t@apply hidden w-unset desktop-xs:flex;\n\t\t@apply order-3 p-2;\n\t\t@apply flex-1 overflow-hidden;\n\n\t\t.inner-content {\n\t\t\t@apply p-2;\n\t\t}\n\t}\n\n\t.content {\n\t\t@apply order-3 desktop-xs:order-2;\n\t\t@apply items-center desktop-xs:justify-center;\n\n\t\t.inner-content {\n\t\t\t@apply box-border;\n\t\t\t@apply desktop-xs:px-18 desktop-xs:py-0;\n\t\t\t@apply w-full tablet:w-content-desktop-login;\n\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\tpadding-top: calc(env(safe-area-inset-top) + 3.5rem);\n\n\t\t\t@screen desktop-xs {\n\t\t\t\t@apply pt-content-mobile-y;\n\t\t\t}\n\t\t}\n\t}\n}\n\n:host(.variant-office) {\n\t.sidebar {\n\t\t@apply desktop-sm:w-sidebar-office-desktop;\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-layout',\n\tstyleUrl: 'layout.component.scss',\n\tshadow: true,\n})\nexport class Layout {\n\t/**\n\t * Variant of the layout\n\t */\n\t@Prop() variant: 'default' | 'login' | 'office' = 'default';\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-layout variant-${this.variant}`}>\n\t\t\t\t<div class=\"topbar\">\n\t\t\t\t\t<slot name=\"topbar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"sidebar\">\n\t\t\t\t\t<slot name=\"sidebar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t<div class=\"inner-content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,ynH,MCOdC,EAAM,M,sCAIgC,S,CAElD,MAAAC,GACC,OACCC,EAACC,EAAI,CAACC,MAAO,oBAAoBC,KAAKC,WACrCJ,EAAA,OAAKE,MAAM,UACVF,EAAA,QAAMK,KAAK,YAEZL,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMK,KAAK,aAEZL,EAAA,OAAKE,MAAM,WACVF,EAAA,OAAKE,MAAM,iBACVF,EAAA,QAAMK,KAAK,c"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,h as a,H as e}from"./p-e4d5e7a7.js";const r=".fixed{position:fixed!important}.left-0{left:0!important}.top-0{top:0!important}.z-navbar{z-index:300!important}.mt-auto{margin-top:auto!important}.block{display:block!important}.flex{display:flex!important}.hidden{display:none!important}.h-screen{height:100vh!important}.w-60{width:15rem!important}.w-full{width:100%!important}.-translate-x-full{--tw-translate-x:-100%!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.transform-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.items-center{align-items:center!important}.justify-between{justify-content:space-between!important}.border-0{border-width:0!important}.border-b{border-bottom-width:1px!important}.border-r{border-right-width:1px!important}.border-solid{border-style:solid!important}.border-mystic-dark{--tw-border-opacity:1!important;border-color:rgb(218 230 240/var(--tw-border-opacity))!important}.px-4{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{max-height:calc(100vh - env(safe-area-inset-top) - env(safe-area-inset-bottom));width:100%}@media (min-width:64rem){:host{width:15rem}}:host .sidebar,:host .sidebar .company,:host .sidebar .content,:host .sidebar .user,:host .userbar{display:flex;flex-direction:column;width:100%}:host .sidebar,:host .top-bar{--tw-bg-opacity:1;--tw-border-opacity:1!important;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-color:rgb(218 230 240/var(--tw-border-opacity))!important;border-style:solid!important;border-width:0!important}:host .sidebar{--tw-bg-opacity:1;--tw-translate-x:-100%;background-color:rgb(255 255 255/var(--tw-bg-opacity));border-right-width:1px!important;gap:1.5rem;height:100vh;left:0;padding-bottom:1rem;padding-top:calc(env(safe-area-inset-top, 0) + 1rem);position:fixed;top:0;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);width:15rem;will-change:transform;z-index:300}@media (min-width:64rem){:host .sidebar{--tw-translate-x:0px;height:100%;position:relative;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));width:100%}}:host .sidebar .company,:host .sidebar .content,:host .sidebar .header,:host .sidebar .user{padding-left:1rem;padding-right:1rem}:host .sidebar .header{align-items:center;display:flex;justify-content:space-between;width:100%}@media (min-width:64rem){:host .sidebar .header{display:none}}:host .sidebar .content{overflow-y:auto;scrollbar-color:#528afa #dae6f0;scrollbar-width:thin}:host .sidebar .content::-webkit-scrollbar{width:.25rem}:host .sidebar .content::-webkit-scrollbar-track{background:#dae6f0}:host .sidebar .content::-webkit-scrollbar-thumb{background:#528afa}:host .sidebar .content::-webkit-scrollbar-thumb:hover{background:#528afa}:host .sidebar .user{display:none;margin-top:auto}@media (min-width:64rem){:host .sidebar .user{display:flex}}:host .sidebar.show{--tw-translate-x:env(safe-area-inset-left,0)}:host .top-bar{border-bottom-width:1px!important;display:flex;height:calc(env(safe-area-inset-top, 0) + 3rem);justify-content:space-between;padding:calc(env(safe-area-inset-top, 0) + .5rem) 1rem .5rem;width:100%}@media (min-width:64rem){:host .top-bar{display:none}}:host p-backdrop{display:none}:host p-backdrop.show{display:block}@media (min-width:64rem){.desktop-xs\\:relative{position:relative!important}.desktop-xs\\:flex{display:flex!important}.desktop-xs\\:hidden{display:none!important}.desktop-xs\\:h-full{height:100%!important}}.static{position:static!important}.z-navbar-backdrop{z-index:290!important}.m-0{margin:0!important}.text-xl{font-size:1.25rem!important;line-height:1.75rem!important}.font-semibold{font-weight:600!important}.text-storm-dark{--tw-text-opacity:1!important;color:rgb(39 40 56/var(--tw-text-opacity))!important}";const o=class{constructor(a){t(this,a);this.closeText="Close";this.menuText="Menu";this._showMenu=false}render(){return a(e,{class:"p-navbar"},a("p-backdrop",{applyBlur:true,class:`z-navbar-backdrop desktop-xs:hidden ${this._showMenu&&"show"}`,onClicked:()=>this._showMenu=false}),a("div",{class:`sidebar ${this._showMenu&&"show"}`},a("div",{class:"header"},a("p",{class:"text-xl m-0 font-semibold text-storm-dark"},this.menuText),a("p-button",{variant:"secondary",icon:"negative",iconPosition:"end",size:"small",onClick:()=>this._showMenu=false},this.closeText)),a("div",{class:"company"},a("slot",{name:"company"})),a("div",{class:"content"},a("slot",{name:"content"})),a("div",{class:"user"},a("slot",{name:"user"}))),a("div",{class:"top-bar"},a("p-button",{variant:"secondary",icon:"menu",size:"small",onClick:()=>this._showMenu=true},this.menuText),a("slot",{name:"topbar"})))}handleCloseNavbar(){this._showMenu=false}handleOpenNavbar(){this._showMenu=true}};o.style=r;export{o as p_navbar};
|
|
2
|
-
//# sourceMappingURL=p-03090f03.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["navbarComponentCss","Navbar","render","h","Host","class","applyBlur","this","_showMenu","onClicked","menuText","variant","icon","iconPosition","size","onClick","closeText","name","handleCloseNavbar","handleOpenNavbar"],"sources":["src/components/organisms/navbar/navbar.component.scss?tag=p-navbar&encapsulation=shadow","src/components/organisms/navbar/navbar.component.tsx"],"sourcesContent":["@import '../../../style/mixins';\n\n:host {\n\t@apply w-full max-h-screen-safe;\n\t@apply desktop-xs:w-60;\n\n\t.sidebar,\n\t.sidebar .company,\n\t.sidebar .content,\n\t.sidebar .user,\n\t.userbar {\n\t\t@apply flex w-full flex-col;\n\t}\n\n\t.sidebar,\n\t.top-bar {\n\t\t@apply bg-white;\n\t\t@apply border-0 border-solid border-mystic-dark #{!important};\n\t}\n\n\t.sidebar {\n\t\t@apply fixed top-0 left-0 z-navbar h-screen w-60 bg-white;\n\t\t@apply desktop-xs:relative desktop-xs:h-full desktop-xs:w-full;\n\t\t@apply gap-6;\n\n\t\t@apply will-change-transform;\n\t\t@apply -translate-x-full transform-gpu desktop-xs:translate-x-0;\n\n\t\t@apply py-4;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 1rem);\n\n\t\t@apply border-r #{!important};\n\n\t\t@apply transition-all;\n\n\t\t.company,\n\t\t.content,\n\t\t.user,\n\t\t.header {\n\t\t\t@apply px-4;\n\t\t}\n\n\t\t.header {\n\t\t\t@apply flex w-full items-center justify-between;\n\t\t\t@apply desktop-xs:hidden;\n\t\t}\n\n\t\t.content {\n\t\t\t@apply overflow-y-auto;\n\n\t\t\t@include scrollbarY();\n\t\t}\n\n\t\t.user {\n\t\t\t@apply mt-auto hidden;\n\t\t\t@apply desktop-xs:flex;\n\t\t}\n\n\t\t&.show {\n\t\t\t--tw-translate-x: env(safe-area-inset-left, 0);\n\t\t}\n\t}\n\n\t.top-bar {\n\t\t@apply flex w-full justify-between px-4 py-2;\n\n\t\tpadding-top: calc(env(safe-area-inset-top, 0) + 0.5rem);\n\t\theight: calc(env(safe-area-inset-top, 0) + 3rem);\n\n\t\t@apply border-b #{!important};\n\n\t\t@apply desktop-xs:hidden;\n\t}\n\n\tp-backdrop {\n\t\t@apply hidden;\n\n\t\t&.show {\n\t\t\t@apply block;\n\t\t}\n\t}\n}\n","import { Component, h, Host, Listen, Prop, State } from '@stencil/core';\n\n@Component({\n\ttag: 'p-navbar',\n\tstyleUrl: 'navbar.component.scss',\n\tshadow: true,\n})\nexport class Navbar {\n\t/**\n\t * The text to display for the close button\n\t */\n\t@Prop() closeText = 'Close';\n\n\t/**\n\t * The text to display for the menu button & sidebar title\n\t */\n\t@Prop() menuText = 'Menu';\n\n\t@State() private _showMenu = false;\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class=\"p-navbar\">\n\t\t\t\t<p-backdrop\n\t\t\t\t\tapplyBlur={true}\n\t\t\t\t\tclass={`z-navbar-backdrop desktop-xs:hidden ${\n\t\t\t\t\t\tthis._showMenu && 'show'\n\t\t\t\t\t}`}\n\t\t\t\t\tonClicked={() => (this._showMenu = false)}\n\t\t\t\t></p-backdrop>\n\t\t\t\t<div class={`sidebar ${this._showMenu && 'show'}`}>\n\t\t\t\t\t<div class=\"header\">\n\t\t\t\t\t\t<p class=\"text-xl m-0 font-semibold text-storm-dark\">\n\t\t\t\t\t\t\t{this.menuText}\n\t\t\t\t\t\t</p>\n\n\t\t\t\t\t\t<p-button\n\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\ticon=\"negative\"\n\t\t\t\t\t\t\ticonPosition=\"end\"\n\t\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\t\tonClick={() => (this._showMenu = false)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{this.closeText}\n\t\t\t\t\t\t</p-button>\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"company\">\n\t\t\t\t\t\t<slot name=\"company\" />\n\t\t\t\t\t</div>\n\t\t\t\t\t<div class=\"content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<div class=\"user\">\n\t\t\t\t\t\t<slot name=\"user\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\n\t\t\t\t<div class=\"top-bar\">\n\t\t\t\t\t<p-button\n\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\ticon=\"menu\"\n\t\t\t\t\t\tsize=\"small\"\n\t\t\t\t\t\tonClick={() => (this._showMenu = true)}\n\t\t\t\t\t>\n\t\t\t\t\t\t{this.menuText}\n\t\t\t\t\t</p-button>\n\n\t\t\t\t\t<slot name=\"topbar\" />\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n\n\t@Listen('closeNavbar', { target: 'window' })\n\thandleCloseNavbar() {\n\t\tthis._showMenu = false;\n\t}\n\n\t@Listen('openNavbar', { target: 'window' })\n\thandleOpenNavbar() {\n\t\tthis._showMenu = true;\n\t}\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,y9I,MCOdC,EAAM,M,wCAIE,Q,cAKD,O,eAEU,K,CAE7B,MAAAC,GACC,OACCC,EAACC,EAAI,CAACC,MAAM,YACXF,EAAA,cACCG,UAAW,KACXD,MAAO,uCACNE,KAAKC,WAAa,SAEnBC,UAAW,IAAOF,KAAKC,UAAY,QAEpCL,EAAA,OAAKE,MAAO,WAAWE,KAAKC,WAAa,UACxCL,EAAA,OAAKE,MAAM,UACVF,EAAA,KAAGE,MAAM,6CACPE,KAAKG,UAGPP,EAAA,YACCQ,QAAQ,YACRC,KAAK,WACLC,aAAa,MACbC,KAAK,QACLC,QAAS,IAAOR,KAAKC,UAAY,OAEhCD,KAAKS,YAGRb,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMc,KAAK,aAEZd,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMc,KAAK,aAGZd,EAAA,OAAKE,MAAM,QACVF,EAAA,QAAMc,KAAK,WAIbd,EAAA,OAAKE,MAAM,WACVF,EAAA,YACCQ,QAAQ,YACRC,KAAK,OACLE,KAAK,QACLC,QAAS,IAAOR,KAAKC,UAAY,MAEhCD,KAAKG,UAGPP,EAAA,QAAMc,KAAK,Y,CAOf,iBAAAC,GACCX,KAAKC,UAAY,K,CAIlB,gBAAAW,GACCZ,KAAKC,UAAY,I"}
|
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
import{r as t,h as e,H as i}from"./p-e4d5e7a7.js";const n='.relative{position:relative!important}.sticky{position:sticky!important}.order-1{order:1!important}.order-2{order:2!important}.order-3{order:3!important}.box-border{box-sizing:border-box!important}.flex{display:flex!important}.grid{display:grid!important}.hidden{display:none!important}.h-full{height:100%!important}.h-screen{height:100vh!important}.w-full{width:100%!important}.w-screen{width:100vw!important}.w-sidebar-mobile{width:100%!important}.w-unset{width:unset!important}.flex-1{flex:1 1 0%!important}.flex-col{flex-direction:column!important}.content-start{align-content:flex-start!important}.items-center{align-items:center!important}.overflow-y-auto{overflow-y:auto!important}.px-content-mobile-x{padding-left:1rem!important;padding-right:1rem!important}*{box-sizing:border-box}:host{align-content:flex-start;display:grid;gap:0;grid-template-areas:"sidebar" "topbar" "content";grid-template-columns:1fr;grid-template-rows:repeat(1fr,3);height:100vh;overflow:hidden;width:100vw}@media (min-width:64rem){:host{grid-template-areas:"topbar topbar" "sidebar content";grid-template-columns:auto 1fr;grid-template-rows:auto 1fr}}:host .content,:host .sidebar,:host .topbar{align-self:flex-start}:host .topbar{grid-area:topbar;order:2;position:sticky;width:100%}@media (min-width:80rem){:host .topbar{order:1}}:host .sidebar{box-sizing:border-box;display:flex;grid-area:sidebar;height:100%;order:1;width:100%}@media (min-width:80rem){:host .sidebar{order:2;width:15rem}}:host .content{display:flex;flex-direction:column;grid-area:content;height:100%;order:3;overflow-x:hidden;overflow-y:auto;padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);position:relative}:host .content .inner-content{padding:1.5rem 1rem;position:relative}@media (min-width:64rem){:host .content .inner-content{padding:2rem;width:100%}}@media (min-width:80rem){:host .content .inner-content{width:100%}}@media (min-width:85.375rem){:host .content .inner-content{width:69rem}}@media (min-width:90rem){:host .content .inner-content{width:69rem}}@media (min-width:120rem){:host .content .inner-content{width:69rem}}:host(.variant-default) .content{flex:1 1 0%}:host(.variant-login){grid-template-areas:"topbar topbar" "content content"}@media (min-width:64rem){:host(.variant-login){grid-template-areas:"topbar topbar" "content sidebar"}}:host(.variant-login) .sidebar{display:none;flex:1 1 0%;order:3;overflow:hidden;padding:.5rem;width:unset}@media (min-width:64rem){:host(.variant-login) .sidebar{display:flex}}:host(.variant-login) .sidebar .inner-content{padding:.5rem}:host(.variant-login) .content{align-items:center;order:3}@media (min-width:64rem){:host(.variant-login) .content{justify-content:center;order:2}}:host(.variant-login) .content .inner-content{box-sizing:border-box;padding:calc(env(safe-area-inset-top) + 3.5rem) 1rem 1.5rem;width:100%}@media (min-width:64rem){:host(.variant-login) .content .inner-content{padding:1.5rem 4.5rem 0}}@media (min-width:40rem){:host(.variant-login) .content .inner-content{width:30rem}}@media (min-width:80rem){:host(.variant-office) .sidebar{width:19.5rem}}@media (min-width:64rem){.desktop-xs\\:flex{display:flex!important}.desktop-xs\\:w-content-desktop-xs{width:100%!important}.desktop-xs\\:px-18{padding-left:4.5rem!important;padding-right:4.5rem!important}.desktop-xs\\:px-content-desktop-x{padding-left:2rem!important;padding-right:2rem!important}}@media (min-width:80rem){.desktop-sm\\:w-content-desktop-sm{width:100%!important}}@media (min-width:85.375rem){.desktop\\:w-content-desktop{width:69rem!important}}@media (min-width:90rem){.desktop-lg\\:w-content-desktop-lg{width:69rem!important}}.static{position:static!important}';const r=class{constructor(e){t(this,e);this.variant="default"}render(){return e(i,{class:`p-layout variant-${this.variant}`},e("div",{class:"topbar"},e("slot",{name:"topbar"})),e("div",{class:"sidebar"},e("slot",{name:"sidebar"})),e("div",{class:"content"},e("div",{class:"inner-content"},e("slot",{name:"content"}))))}};r.style=n;export{r as p_layout};
|
|
2
|
-
//# sourceMappingURL=p-46a939e2.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"names":["layoutComponentCss","Layout","render","h","Host","class","this","variant","name"],"sources":["src/components/atoms/layout/layout.component.scss?tag=p-layout&encapsulation=shadow","src/components/atoms/layout/layout.component.tsx"],"sourcesContent":[":host {\n\t@apply grid h-screen w-screen content-start overflow-hidden;\n\n\tgrid-template-columns: 1fr;\n\tgrid-template-rows: repeat(1fr, 3);\n\tgap: 0;\n\tgrid-template-areas:\n\t\t'sidebar'\n\t\t'topbar'\n\t\t'content';\n\n\t@screen desktop-xs {\n\t\tgrid-template-columns: auto 1fr;\n\t\tgrid-template-rows: auto 1fr;\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'sidebar content';\n\t}\n\n\t.topbar,\n\t.sidebar,\n\t.content {\n\t\t@apply self-start;\n\t}\n\n\t.topbar {\n\t\tgrid-area: topbar;\n\n\t\t@apply sticky w-full;\n\t\t@apply order-2 desktop-sm:order-1;\n\t}\n\n\t.sidebar {\n\t\tgrid-area: sidebar;\n\n\t\t@apply box-border flex h-full;\n\t\t@apply w-sidebar-mobile desktop-sm:w-sidebar-desktop;\n\t\t@apply order-1 desktop-sm:order-2;\n\t}\n\n\t.content {\n\t\tgrid-area: content;\n\n\t\t@apply relative flex h-full flex-col overflow-y-auto overflow-x-hidden;\n\t\t@apply order-3;\n\n\t\tpadding: 0 env(safe-area-inset-right) env(safe-area-inset-bottom)\n\t\t\tenv(safe-area-inset-left);\n\n\t\t.inner-content {\n\t\t\t@apply relative pb-24;\n\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\t@apply desktop-xs:px-content-desktop-x desktop-xs:py-content-desktop-y;\n\n\t\t\t@apply desktop-xs:w-content-desktop-xs desktop-sm:w-content-desktop-sm desktop:w-content-desktop desktop-lg:w-content-desktop-lg desktop-xl:w-content-desktop-xl;\n\t\t}\n\t}\n}\n\n:host(.variant-default) {\n\t.content {\n\t\t@apply flex-1;\n\t}\n}\n\n:host(.variant-login) {\n\tgrid-template-areas:\n\t\t'topbar topbar'\n\t\t'content content';\n\n\t@screen desktop-xs {\n\t\tgrid-template-areas:\n\t\t\t'topbar topbar'\n\t\t\t'content sidebar';\n\t}\n\n\t.sidebar {\n\t\t@apply hidden w-unset desktop-xs:flex;\n\t\t@apply order-3 p-2;\n\t\t@apply flex-1 overflow-hidden;\n\n\t\t.inner-content {\n\t\t\t@apply p-2;\n\t\t}\n\t}\n\n\t.content {\n\t\t@apply order-3 desktop-xs:order-2;\n\t\t@apply items-center desktop-xs:justify-center;\n\n\t\t.inner-content {\n\t\t\t@apply box-border;\n\t\t\t@apply desktop-xs:px-18 desktop-xs:py-0;\n\t\t\t@apply w-full tablet:w-content-desktop-login;\n\n\t\t\t@apply px-content-mobile-x py-content-mobile-y;\n\t\t\tpadding-top: calc(env(safe-area-inset-top) + 3.5rem);\n\n\t\t\t@screen desktop-xs {\n\t\t\t\t@apply pt-content-mobile-y;\n\t\t\t}\n\t\t}\n\t}\n}\n\n:host(.variant-office) {\n\t.sidebar {\n\t\t@apply desktop-sm:w-sidebar-office-desktop;\n\t}\n}\n","import { Component, h, Host, Prop } from '@stencil/core';\n\n@Component({\n\ttag: 'p-layout',\n\tstyleUrl: 'layout.component.scss',\n\tshadow: true,\n})\nexport class Layout {\n\t/**\n\t * Variant of the layout\n\t */\n\t@Prop() variant: 'default' | 'login' | 'office' = 'default';\n\n\trender() {\n\t\treturn (\n\t\t\t<Host class={`p-layout variant-${this.variant}`}>\n\t\t\t\t<div class=\"topbar\">\n\t\t\t\t\t<slot name=\"topbar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"sidebar\">\n\t\t\t\t\t<slot name=\"sidebar\" />\n\t\t\t\t</div>\n\t\t\t\t<div class=\"content\">\n\t\t\t\t\t<div class=\"inner-content\">\n\t\t\t\t\t\t<slot name=\"content\" />\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</Host>\n\t\t);\n\t}\n}\n"],"mappings":"kDAAA,MAAMA,EAAqB,ynH,MCOdC,EAAM,M,sCAIgC,S,CAElD,MAAAC,GACC,OACCC,EAACC,EAAI,CAACC,MAAO,oBAAoBC,KAAKC,WACrCJ,EAAA,OAAKE,MAAM,UACVF,EAAA,QAAMK,KAAK,YAEZL,EAAA,OAAKE,MAAM,WACVF,EAAA,QAAMK,KAAK,aAEZL,EAAA,OAAKE,MAAM,WACVF,EAAA,OAAKE,MAAM,iBACVF,EAAA,QAAMK,KAAK,c"}
|