fix(core): update
This commit is contained in:
61
ts_web/elements/dees-stepper.ts
Normal file
61
ts_web/elements/dees-stepper.ts
Normal file
@ -0,0 +1,61 @@
|
||||
import { DeesElement, customElement, html, css, unsafeCSS, cssManager, property } from '@designestate/dees-element';
|
||||
|
||||
import * as domtools from '@designestate/dees-domtools';
|
||||
|
||||
@customElement('dees-stepper')
|
||||
export class DeesStepper extends DeesElement {
|
||||
public static demo = () => html`
|
||||
<dees-stepper></dees-stepper>
|
||||
`;
|
||||
|
||||
constructor() {
|
||||
super();
|
||||
}
|
||||
|
||||
@property({
|
||||
type: Array
|
||||
})
|
||||
public steps = [{
|
||||
title: 'Who are you?'
|
||||
}, {
|
||||
title: 'Verification:'
|
||||
}]
|
||||
|
||||
public static styles = [
|
||||
cssManager.defaultStyles,
|
||||
css`
|
||||
:host {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.stepperContainer {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #111;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.step {
|
||||
max-width: 600px;
|
||||
min-height: 300px;
|
||||
border-radius: 10px;
|
||||
background: #222;
|
||||
margin: auto;
|
||||
margin-bottom: 20px;
|
||||
|
||||
}
|
||||
`
|
||||
]
|
||||
|
||||
public render () {
|
||||
return html`
|
||||
<div class="stepperContainer">
|
||||
${this.steps.map(stepArg => html`
|
||||
<div class="step"></div>
|
||||
`)}
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user