import {
  cssManager,
  customElement,
  DeesElement,
  html,
  TemplateResult,
  css,
  state,
  property
} from '@designestate/dees-element';

@customElement('dees-button-exit')
export class DeesButtonExit extends DeesElement {
  // DEMO
  public static demo = () => html`
    <dees-button-exit></dees-button-exit>
  `;

  // INSTANCE
  @property({
    type: Number
  })
  public size: number = 20;

  public styles = [
    cssManager.defaultStyles,
    css`

    `
  ]

  public render (): TemplateResult {
    return html`
      <style>
        .maincontainer {
          position: relative;
          width: ${this.size}px;
          height: ${this.size}px;
        }
        .firstLine {
          position: absolute;
        }
        .secondLine {
          position: absolute;
        }
      </style>
      <div class="maincontainer">
        <div class="firstLine"></div>
        <div class="secondLine"></div>
      </div>
    `;
  }
}