script#macros-template(type="text/x-template")
  #macros
    h1 Macros Configuration
    .macros-form
        p.title Enter Macros Name
        .input-container
                input.input-color(type="color",id="macros-color",value="#ffffff") 
                input.input-name(type="text",id="macros-name")
        p.title Select/Upload G-Code
        select(title="Select previously uploaded GCode programs.",
                v-model="state.selected", @change="load", :disabled="!is_ready",
                style="max-width:100%;height:40px;border-radius:5px")
                option(v-for="file in state.files", :value="file") {{file}}
        button.pure-button(title="Upload a new GCode program.", @click="open",
                :disabled="!is_ready",style="height:40px;width:130px;font-weight:normal;border-radius:5px") Upload
        br
        button.submit-macros(title="Save Macros",@click="saveMacros",
                style="height:50px;width:140px;font-weight:normal;background-color:#add1ad;color:#fff;border-color:#add1ad;padding-top:5px") Save Macros
        button.pure-button(title="Print config.", @click="printConfig",
                style="height:50px;width:120px;font-weight:normal;padding-top:5px") print Config

    gcode-viewer
