<style scoped>
.layout {
  height: 100%;
  background: #dddddd;
}

.header {
  background: #dddddd;
}

.ivu-layout-header {
  line-height: normal;
  height: auto;
  padding: 0px;
}


.content {
  background: #dddddd;
}

.ivu-layout-content {
  padding: 0px;
}



.layout-footer-center {
  background: #dddddd;
  text-align: center;
}

.ivu-card-bordered {
  border: 0px solid #dcdee2;
  border-color: #e8eaec;
}
</style>

<style>
</style>
<template>
  <div class="layout" onkeydown="keydown">
    <Layout>



      <Header class="header">
        <div>
          <Row>
            <Col :xs="{ span: 24, offset: 0 }" :sm="{ span: 22, offset: 1 }" :md="{ span: 20, offset: 2 }"
              :lg="{ span: 18, offset: 3 }" :xl="{ span: 16, offset: 4 }" :xxl="{ span: 16, offset: 4 }">
            <Affix :offset-top="0">

              <div style="background: white;width:100%;height:40px;">
                <img style="height:40px;float:left;" src="/static/favicon.png">

                <div style="float:right;width:auto;">
                  <Button-group size="large">
                    <Button type="error" style="margin-left:0px; border-radius: 0px;font-size: 24px;"
                      @click="createNote()" icon="md-add"></Button>

                  </Button-group>
                </div>



              </div>




            </Affix>
            </Col>
          </Row>
        </div>
      </Header>

      <Content class="content">
        <div style="min-height: 650px;">
          <Row>
            <Col :xs="{ span: 24, offset: 0 }" :sm="{ span: 22, offset: 1 }" :md="{ span: 20, offset: 2 }"
              :lg="{ span: 18, offset: 3 }" :xl="{ span: 16, offset: 4 }" :xxl="{ span: 16, offset: 4 }">
            <Card :padding="0">
              <div id="wrapper" style="border-left: 0px solid #FF3366;">
                <div id="noteText" style="text-align: center;min-height: 650px;" class="monoFt">
                  <h1></h1>
                  {{ $t("content.blankTip") }}
                </div>
              </div>
            </Card>
            </Col>
          </Row>
        </div>
      </Content>


      <Footer class="layout-footer-center">2022 &copy; flagnote.com</Footer>

    </Layout>


  </div>
</template>

<script>
export default {
  name: 'BlankNote',
  components: {},
  props: {},
  data() {
    return {
      noteForm: {
        url: '',
        text: '',
        escapeText: '',
        key: '',
        md5: '',
        lock: 0,
      },
      secret: {
        storeKey: '',
        secretKey: '',
        cipher: '',
      },
      state: {
        lock: 0,
        locking: 0,
        commited: 0
      }
    }
  },
  created() {
    this.noteForm.key = this.$route.params.name;
  },
  mounted() {
    //this.bindCopyTextEvent();

    const myObserver = new ResizeObserver(entries => {
      // iterate over the entries, do something.
      entries.forEach(entry => {
        let affix = document.querySelector('.ivu-affix');
        if (affix) {
          affix.setAttribute("style", "top: 0px; width: " + entry.contentRect.width + "px;");
        }

      });
    });

    const someOtherEl = document.querySelector('#wrapper');
    myObserver.observe(someOtherEl);

  },
  methods: {
    refreshPage() {
      window.location.reload();
    },
    createNote() {
      window.open("/");
    }

  }
}
</script>

