design.estate/dees-wcctools
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(core): update

Browse Source
This commit is contained in:
Philipp Kunz
2020-06-01 13:18:51 +00:00
parent f73df83768
commit 5f182ba435
4 changed files with 20 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
ts_web/elements/wcc-dashboard.ts
View File

@ -12,10 +12,7 @@ import './wcc-properties';
@customElement('wcc-dashboard')
export class WccDashboard extends LitElement {
@property()
public selectedItem: TemplateResult | LitElement = WccDefaultElement as any;
@property()
public selectedInstance;
public selectedItem: TemplateResult | LitElement;
@property()
public selectedViewport: deesDomtools.breakpoints.TViewport = 'desktop';
@ -57,7 +54,7 @@ export class WccDashboard extends LitElement {
<wcc-sidebar .pages=${this.pages} .elements=${this.elements} @selectedItem=${eventArg => {
this.selectedItem = eventArg.detail;
}}></wcc-sidebar>
<wcc-properties .warning="${this.warning}" .selectedItem=${this.selectedItem} .selectedInstance=${this.selectedInstance} @selectedViewport=${eventArg => {this.selectedViewport = eventArg.detail; this.updateSlot();}}></wcc-properties>
<wcc-properties .warning="${this.warning}" .selectedItem=${this.selectedItem} @selectedViewport=${eventArg => {this.selectedViewport = eventArg.detail; this.updateSlot();}}></wcc-properties>
<wcc-frame id="wccFrame" viewport=${this.selectedViewport}>
${(() => {
if (this.selectedItem instanceof TemplateResult) {
@ -77,6 +74,7 @@ export class WccDashboard extends LitElement {
return html`${anonItem.demo()}`;
} else {
this.selectedItem = WccDefaultElement as any;
this.updateSlot();
}
})()}
</wcc-frame>

19
ts_web/elements/wcc-frame.ts
View File

@ -1,11 +1,6 @@
import { LitElement, property, html, customElement, TemplateResult } from 'lit-element';
const breakpoints = {
desktop: 1240,
tablet: 700,
phablet: 500,
phone: 340,
};
import * as domtools from '@designestate/dees-domtools';
@customElement('wcc-frame')
export class WccFrame extends LitElement {
@ -33,15 +28,21 @@ export class WccFrame extends LitElement {
`;
case 'tablet':
return `
padding: 0px ${(document.body.clientWidth - 200 - breakpoints.tablet) / 2}px;
padding: 0px ${
(document.body.clientWidth - 200 - domtools.breakpoints.tablet) / 2
}px;
`;
case 'phablet':
return `
padding: 0px ${(document.body.clientWidth - 200 - breakpoints.phablet) / 2}px;
padding: 0px ${
(document.body.clientWidth - 200 - domtools.breakpoints.phablet) / 2
}px;
`;
case 'phone':
return `
padding: 0px ${(document.body.clientWidth - 200 - breakpoints.phone) / 2}px;
padding: 0px ${
(document.body.clientWidth - 200 - domtools.breakpoints.phone) / 2
}px;
`;
}
})()}