FJurmanovic/wallet-web
1
0
Fork 0
mirror of https://github.com/FJurmanovic/wallet-web.git synced 2026-02-06 06:08:10 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

layout structure

Browse Source
This commit is contained in:
Fran Jurmanović
2021-08-03 15:47:24 +02:00
parent 6b152d320c
commit 5ee2ccc076
7 changed files with 31 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/layouts/index.ts
View File

@@ -1,2 +1,2 @@
export * from './menu-layout/MenuLayoutElement';
export * from './initial-layout/InitialLayoutElement';
export * from './menu-layout';
export * from './initial-layout';

15
src/layouts/initial-layout/InitialLayoutElement.ts
View File

@@ -1,10 +1,9 @@
import { controller, target } from '@github/catalyst';
import { closest } from 'core/utils';
import { html, TemplateResult } from 'core/utils';
import { html, TemplateResult, controller, target, closest } from 'core/utils';
import { BaseLayoutElement } from 'common/layouts';
import { AppMainElement } from 'components/';
import { InitialLayoutElementTemplate } from 'layouts/initial-layout';
@controller
@controller('initial-layout')
class InitialLayoutElement extends BaseLayoutElement {
@closest appMain: AppMainElement;
@target appPage: HTMLDivElement;
@@ -19,13 +18,7 @@ class InitialLayoutElement extends BaseLayoutElement {
elementDisconnected = (appMain: AppMainElement): void => {};
render = (): TemplateResult => {
return html`
<div data-target="initial-layout.appPage">
<app-slot data-target="initial-layout.appSlot"></app-slot>
</div>
`;
};
render = (): TemplateResult => InitialLayoutElementTemplate();
}
export type { InitialLayoutElement };

7
src/layouts/initial-layout/InitialLayoutElementTemplate.ts Normal file
View File

@@ -0,0 +1,7 @@
import { html, TemplateResult } from 'core/utils';
export default (): TemplateResult => html`
<div data-target="initial-layout.appPage">
<app-slot data-target="initial-layout.appSlot"></app-slot>
</div>
`;

2
src/layouts/initial-layout/index.ts Normal file
View File

@@ -0,0 +1,2 @@
export { default as InitialLayoutElementTemplate } from './InitialLayoutElementTemplate';
export * from './InitialLayoutElement';

21
src/layouts/menu-layout/MenuLayoutElement.ts
View File

@@ -1,10 +1,9 @@
import { controller, target } from '@github/catalyst';
import { closest } from 'core/utils';
import { html, TemplateResult } from 'core/utils';
import { TemplateResult, controller, target, closest } from 'core/utils';
import { BaseLayoutElement } from 'common/layouts';
import { AppMainElement } from 'components/';
import { MenuLayoutElementTemplate } from 'layouts/menu-layout';
@controller
@controller('menu-layout')
class MenuLayoutElement extends BaseLayoutElement {
@closest appMain: AppMainElement;
@target appPage: HTMLDivElement;
@@ -41,19 +40,7 @@ class MenuLayoutElement extends BaseLayoutElement {
this.appPage.classList.toggle('--retracted');
};
render = (): TemplateResult => {
const _isAuth = this.isAuth;
return html`
<div class="app-layout" data-target="menu-layout.appPage">
${_isAuth
? html`<div class="app-sidebar" data-target="menu-layout.appSidebar"><app-menu></app-menu></div>`
: html``}
<div class="app-content">
<app-slot data-target="menu-layout.appSlot"></app-slot>
</div>
</div>
`;
};
render = (): TemplateResult => MenuLayoutElementTemplate({ isAuth: this.isAuth });
}
export type { MenuLayoutElement };

10
src/layouts/menu-layout/MenuLayoutElementTemplate.ts Normal file
View File

@@ -0,0 +1,10 @@
import { html, TemplateResult } from 'core/utils';
export default ({ isAuth }): TemplateResult => html`
<div class="app-layout" data-target="menu-layout.appPage">
${isAuth ? html`<div class="app-sidebar" data-target="menu-layout.appSidebar"><app-menu></app-menu></div>` : html``}
<div class="app-content">
<app-slot data-target="menu-layout.appSlot"></app-slot>
</div>
</div>
`;

2
src/layouts/menu-layout/index.ts Normal file
View File

@@ -0,0 +1,2 @@
export { default as MenuLayoutElementTemplate } from './MenuLayoutElementTemplate';
export * from './MenuLayoutElement';