MoeRayo

<template>
	<div class="flex flex-column flex-row-ns pa3 calisto bg-black-05">
		<div class="w-100 ph3">
			<form enctype="multipart/form-data" v-if="isInitial || isSaving">
				<h2>Upload File</h2>
				<div
					class="b--dashed bw1 b--light-purple pa3 hover-bg-black-10 bg-animate pointer relative h4">
					<input
						type="file"
						accept="image/*,application/pdf"

MoeRayo

<template>
  <div class="flex flex-column flex-row-ns pa3 calisto bg-black-05">
    <div class="w-50-ns w-100 ph3">
      <!-- upload image -->
    </div>
    <section class="w-40-l w-50-m w-100 ph3 tl" v-if="imageURL">
      <h2>Transform Image</h2>
      <form class="ba b--black bw2 bg-white br2 mw6 center pv2 ph4 shadow-5 f6">
        <div>

MoeRayo

<template>
  <div class="flex flex-column flex-row-ns pa3 calisto bg-black-05">
    <div class="w-50-ns w-100 ph3">
      <!-- upload image -->
      <form enctype="multipart/form-data" v-if="isInitial || isSaving">
        <h2>Add Image</h2>
        <div
          class="b--dashed bw1 b--light-purple pa3 hover-bg-black-10 bg-animate pointer relative h4">
          <input

MoeRayo

<template>
  <div class="flex flex-column flex-row-ns pa3 calisto bg-black-05">
    <div class="w-50-ns w-100 ph3">
      <!-- upload image -->
      ...
    </div>
    <section class="w-40-l w-50-m w-100 ph3 tl">
      <h2>Transform Image</h2>
      <form class="ba b--black bw2 bg-white br2 mw6 center pv2 ph4 shadow-5 f6">

MoeRayo

<template>
  <div class="flex absolute vh-auto top-4 left-2 right-2 w-90 center mw9">
   <div class="mr3 bg-white w-70 br3 pa3">
    <form @submit.prevent="generateInvoice" class="flex justify-between flex-wrap">
      <div v-for="basicinfo in basicData" :key="basicinfo.id" class="w-50-l w-100">
        <TheDashboardInput v-model="basicinfo.inputdata" :formData="basicinfo.formdata" :type="basicinfo.type" :otherData="basicinfo.otherdata"/>
      </div>
      
      <h3 class="dark-blue w-100 f3 underline">ITEMS</h3>
      <div v-for="item in itemsData" :key="item.id" class="w-50-l w-100">

MoeRayo

<template>
  <div>
   <cld-image publicId="cv_gen.pdf" ref="ref" >
    <cld-transformation flags="rasterize" />
      <cld-transformation :overlay="{fontFamily: 'Open Sans', fontSize: 75, text: `${userData.firstname} ${userData.lastname}`}" color="#58697B" gravity="west" x="100" y="-670"/>

      <cld-transformation :overlay="{fontFamily: 'Open Sans', fontSize: 18, text: userData.phoneNumber}" color="#58697B" gravity="west" x="180" y="-577"/>

      <cld-transformation :overlay="{fontFamily: 'Open Sans', fontSize: 18, text: userData.email}" color="#58697B" gravity="west" x="550" y="-577"/>

MoeRayo

<template>
 <div class="flex absolute vh-auto top-4 left-2 right-2 w-90 center mw9">
  <div class="mr3 bg-white w-70 br3 pa3">
    <form @submit.prevent="createResume" class="flex justify-between flex-wrap">
      <div class="w-50-l w-100">
        <label for="email" class="db mb3 black-70 ttu fw7">Firstname</label>
        <input
          id="firstname"
          v-model="userData.firstname"
          name="firstname"

MoeRayo

<template>
  <div class="ba b--light-blue bw3 vh-100 pv5 ph2 athelas">
    <div class="bg-lightest-blue br3 mw6 w-40-m w-70 w-20-l center pt3 shadow-5 ">

      <h2 class="near-black tc f3">Chat</h2>

      <div class="bg-white mt4 br-top pa3 vh-50 relative">

        <section v-for="databaseMessage in databaseMessages" :key="JSON.stringify(databaseMessage)">
          <p :class="databaseMessage ? ['bg-lightest-blue', 'pa2', 'mv2', 'br3', 'w-60', 'f7'] : ''">

MoeRayo

<template>
  <div class="ba b--light-blue bw3 vh-100 pv5 ph2 athelas">
    <form @submit.prevent="signUp" class="bg-lightest-blue br2 mw6 w-40-m w-70 w-20-l center pa3 shadow-5">

      <h2 class="ttc tc">Sign up</h2>

      <label for="name" class="db mb1 black-70">Name</label>
      <input name="name" id="name" type="text" class="db mb3 w-100 br3 pa2 ba bw2" placeholder="John Doe" v-model="name">

      <label for="email" class="db mb1 black-70">Email</label>

MoeRayo

<script>
export default {
 data(){
    return {
      jobId: '',
      formData: null,
    }
  },
  methods: {
    async enhanceVideo(){