static form html classnames return to tailwind classname for .vue

This commit is contained in:
Burak Civan
2022-06-10 10:16:41 +03:00
parent dd9b492aee
commit df5f9e7dc7
13 changed files with 108 additions and 81 deletions

View File

@ -9,7 +9,7 @@
]" ]"
:error="formError"> :error="formError">
<div class="flex justify-between relative mt-1"> <div class="flex justify-between relative mt-1">
<input type="text" @change="change" :name="name" :id="name" v-model="color" @keyup="addColor" class="form-element"> <input type="text" @change="change" :name="name" :id="name" v-model="color" @keyup="addColor" class="full text-sm px-3 py-2.5 mt-1 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple">
<div class="absolute w-7 h-7 flex rounded-full my-auto bottom-2 right-2 cursor-pointer" <div class="absolute w-7 h-7 flex rounded-full my-auto bottom-2 right-2 cursor-pointer"
ref="dropdownMenu" ref="dropdownMenu"

View File

@ -22,7 +22,7 @@
<input <input
type="text" type="text"
data-input="true" data-input="true"
class="form-element px-10 border-t-0 border-l-0 border-r-0 border-gray-200 rounded-none" class="w-full text-sm py-2.5 mt-1 border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple px-10 border-t-0 border-l-0 border-r-0 border-gray-200 rounded-none"
autocapitalize="default" autocorrect="ON" autocapitalize="default" autocorrect="ON"
:placeholder="placeholder" :placeholder="placeholder"
:ref="'input-contact-field-' + _uid" :ref="'input-contact-field-' + _uid"
@ -32,7 +32,7 @@
/> />
</div> </div>
<ul class="form-element p-0 border-0 mt-0 cursor-pointer"> <ul class="w-full text-sm rounded-lg border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple p-0 border-0 mt-0 cursor-pointer">
<div class="hover:bg-gray-100 px-4 py-2" v-for="(contact, index) in sortContacts" :key="index" @click="onContactSeleted(index, contact.id)"> <div class="hover:bg-gray-100 px-4 py-2" v-for="(contact, index) in sortContacts" :key="index" @click="onContactSeleted(index, contact.id)">
<span>{{ contact.name }}</span> <span>{{ contact.name }}</span>
</div> </div>

View File

@ -10,7 +10,7 @@
masked: true masked: true
}" :value="price" disabled size="5" masked class="disabled-money text-right mr-1 js-conversion-input text-xs px-1"></money> }" :value="price" disabled size="5" masked class="disabled-money text-right mr-1 js-conversion-input text-xs px-1"></money>
<span class="mr-2">{{ texts[1] }}</span> <span class="mr-2">{{ texts[1] }}</span>
<input name="currency_rate" v-model="rate" @input="onChange" class="form-element w-16 h-10 text-right js-conversion-input" /> <input name="currency_rate" v-model="rate" @input="onChange" class="text-sm px-3 py-2.5 mt-1 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple w-16 h-10 text-right js-conversion-input" />
</div> </div>
</template> </template>

View File

@ -19,7 +19,7 @@
@on-open="focus" @on-open="focus"
@on-close="blur" @on-close="blur"
:config="dateConfig" :config="dateConfig"
class="form-element datepicker" class="datepicker w-full text-sm px-3 py-2.5 mt-1 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple"
v-model="real_model" v-model="real_model"
@input="change" @input="change"
:readonly="readonly" :readonly="readonly"

View File

@ -12,7 +12,7 @@
<input <input
type="text" type="text"
data-input="true" data-input="true"
class="form-element px-10 border-t-0 border-l-0 border-r-0 border-gray-200 rounded-none" class="w-full text-sm py-2.5 mt-1 border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple px-10 border-t-0 border-l-0 border-r-0 border-gray-200 rounded-none"
autocapitalize="default" autocapitalize="default"
autocorrect="ON" autocorrect="ON"
:placeholder="placeholder" :placeholder="placeholder"
@ -23,7 +23,7 @@
/> />
</div> </div>
<ul class="form-element p-0 mt-0 border-0 cursor-pointer"> <ul class="w-full text-sm rounded-lg border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple p-0 mt-0 border-0 cursor-pointer">
<div <div
class="hover:bg-gray-100 px-4" class="hover:bg-gray-100 px-4"
v-for="(item, index) in sortedItems" v-for="(item, index) in sortedItems"

View File

@ -1,7 +1,11 @@
<template> <template>
<div v-if="! rowInput" class="form-group" <div v-if="! rowInput" class="form-group"
:class="[{'has-error': error}, {'required': required}, {'readonly': readonly}, {'disabled': disabled}, col]"> :class="[{'has-error': error}, {'required': required}, {'readonly': readonly}, {'disabled': disabled}, col]">
<label v-if="title" :for="name" class="form-control-label">{{ title }}</label>
<label v-if="title" :for="name" class="text-black text-sm font-medium">
{{ title }}
</label>
<span v-if="required" class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div class="relative" :class="group_class"> <div class="relative" :class="group_class">
<!-- <div class="input-group-prepend absolute left-2 bottom-3 text-light-gray"> <!-- <div class="input-group-prepend absolute left-2 bottom-3 text-light-gray">
@ -10,7 +14,7 @@
</span> </span>
</div> --> </div> -->
<money :name="name" @input="input" :placeholder="placeholder" v-bind="money" :value="model" :disabled="disabled" :masked="masked" class="form-element" :class="moneyClass"></money> <money :name="name" @input="input" :placeholder="placeholder" v-bind="money" :value="model" :disabled="disabled" :masked="masked" class="input-money" :class="moneyClass"></money>
</div> </div>
<div class="text-red text-sm mt-1 block" v-if="error" v-html="error"></div> <div class="text-red text-sm mt-1 block" v-if="error" v-html="error"></div>
@ -18,7 +22,11 @@
<div v-else <div v-else
:class="[{'has-error': error}, {'required': required}, {'readonly': readonly}, {'disabled': disabled}, col]"> :class="[{'has-error': error}, {'required': required}, {'readonly': readonly}, {'disabled': disabled}, col]">
<label v-if="title" :for="name" class="form-control-label">{{ title }}</label>
<label v-if="title" :for="name" class="text-black text-sm font-medium">
{{ title }}
</label>
<span v-if="required" class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div v-if="icon" class="input-group input-group-merge" :class="group_class"> <div v-if="icon" class="input-group input-group-merge" :class="group_class">
<div v-if="icon" class="input-group-prepend"> <div v-if="icon" class="input-group-prepend">
@ -27,10 +35,10 @@
</span> </span>
</div> </div>
<money :name="name" @input="input" :placeholder="placeholder" v-bind="money" :value="model" :disabled="disabled" :masked="masked" class="form-element" :class="moneyClass"></money> <money :name="name" @input="input" :placeholder="placeholder" v-bind="money" :value="model" :disabled="disabled" :masked="masked" class="input-money" :class="moneyClass"></money>
</div> </div>
<money v-else :name="name" @input="input" :placeholder="placeholder" v-bind="money" :value="model" :disabled="disabled" :masked="masked" class="form-element" :class="moneyClass"></money> <money v-else :name="name" @input="input" :placeholder="placeholder" v-bind="money" :value="model" :disabled="disabled" :masked="masked" class="input-money" :class="moneyClass"></money>
<div class="text-red text-sm mt-1 block" v-if="error" v-html="error"></div> <div class="text-red text-sm mt-1 block" v-if="error" v-html="error"></div>
</div> </div>

View File

@ -1,6 +1,6 @@
<template> <template>
<div class="form-group" :class="col"> <div class="form-group" :class="col">
<label :for="name" class="form-control-label">{{ text }}</label> <label :for="name" class="text-black text-sm font-medium">{{ text }}</label>
<div class="tab-pane tab-example-result fade show active" role="tabpanel" aria-labelledby="-component-tab"> <div class="tab-pane tab-example-result fade show active" role="tabpanel" aria-labelledby="-component-tab">
<div class="btn-group btn-group-toggle radio-yes-no" data-toggle="buttons" v-on:click="onClick"> <div class="btn-group btn-group-toggle radio-yes-no" data-toggle="buttons" v-on:click="onClick">

View File

@ -18,7 +18,7 @@
{{ frequencyEveryText }} {{ frequencyEveryText }}
</div> </div>
<input type="text" class="w-20 form-element" v-model="interval" @input="change" v-if="frequency == 'custom'"> <input type="text" class="w-20 text-sm px-3 py-2.5 mt-1 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" v-model="interval" @input="change" v-if="frequency == 'custom'">
<el-select class="w-36 ml-2" v-model="customFrequency" @input="change" v-if="frequency == 'custom'"> <el-select class="w-36 ml-2" v-model="customFrequency" @input="change" v-if="frequency == 'custom'">
<el-option <el-option
@ -89,7 +89,7 @@
</el-option> </el-option>
</el-select> </el-select>
<input type="text" class="w-20 form-element ml-2" v-model="limitCount" v-if="limit == 'after'" @input="change"> <input type="text" class="w-20 text-sm px-3 py-2.5 mt-1 ml-2 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" v-model="limitCount" v-if="limit == 'after'" @input="change">
<div class="pl-2 text-sm" v-if="limit == 'after'"> <div class="pl-2 text-sm" v-if="limit == 'after'">
{{ endText }} {{ endText }}

View File

@ -6,6 +6,7 @@
<slot name="label"> <slot name="label">
<label v-if="label" :class="labelClasses"> <label v-if="label" :class="labelClasses">
{{label}} {{label}}
<span v-if="required" class="text-red ltr:ml-1 rtl:mr-1">*</span>
</label> </label>
</slot> </slot>
<div class="relative" :class="[ <div class="relative" :class="[
@ -31,7 +32,7 @@
v-bind="$attrs" v-bind="$attrs"
:valid="!error" :valid="!error"
:required="required" :required="required"
class="form-element" class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple"
:class="[{'is-valid': valid === true}, {'is-invalid': error}, inputClasses]"> :class="[{'is-valid': valid === true}, {'is-invalid': error}, inputClasses]">
</slot> </slot>
<div v-if="appendIcon || $slots.append" class="input-group-append absolute ltr:right-2 rtl:left-2 bottom-2 text-light-gray"> <div v-if="appendIcon || $slots.append" class="input-group-append absolute ltr:right-2 rtl:left-2 bottom-2 text-light-gray">
@ -106,7 +107,7 @@
labelClasses: { labelClasses: {
type: String, type: String,
description: "Input label css classes", description: "Input label css classes",
default: "form-control-label" default: "text-black text-sm font-medium"
}, },
inputClasses: { inputClasses: {
type: String, type: String,
@ -132,6 +133,10 @@
prependIcon: { prependIcon: {
type: String, type: String,
description: "Prepend icon (left)" description: "Prepend icon (left)"
},
notRequired: {
type: Boolean,
default: false
} }
}, },
data() { data() {

View File

@ -3,60 +3,70 @@
<InstallSteps :active_state="active"></InstallSteps> <InstallSteps :active_state="active"></InstallSteps>
<div class="card-body"> <div class="card-body">
<div role="alert" class="alert alert-danger d-none" :class="(form.response.error) ? 'show' : ''" v-if="form.response.error" v-html="form.response.message"></div> <div role="alert" class="alert alert-danger d-none" :class="(form.response.error) ? 'show' : ''" v-if="form.response.error" v-html="form.response.message"></div>
<div class="grid sm:grid-cols-6 gap-x-8 gap-y-6 my-3.5 mt-0"> <div class="grid sm:grid-cols-6 gap-x-8 gap-y-6 my-3.5 mt-0">
<div class="sm:col-span-6 form-group required" :class="[{'has-error': form.errors.get('hostname')}]"> <div class="sm:col-span-6 form-group required" :class="[{'has-error': form.errors.get('hostname')}]">
<label for="hostname" class="form-control-label">Hostname</label> <label for="hostname" class="text-black text-sm font-medium">Hostname</label>
<span class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div class="input-group input-group-merge"> <div class="input-group input-group-merge">
<input <input
class="form-element" class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple"
data-name="hostname" :class="[{'border-red': form.errors.get('hostname')}, {'border-light-gray': !form.errors.get('hostname')}]"
data-value="localhost" data-name="hostname"
@keydown="form.errors.clear('hostname')" data-value="localhost"
v-model="form.hostname" @keydown="form.errors.clear('hostname')"
required="required" v-model="form.hostname"
name="hostname" required="required"
type="text" name="hostname"
value="localhost" type="text"
id="hostname" value="localhost"
/> id="hostname"
</div> />
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('hostname')" v-html="form.errors.get('hostname')"></div>
</div> </div>
<div class="sm:col-span-6 form-group required" :class="[{'has-error': form.errors.get('username')}]"> <div class="text-red text-sm mt-1 block" v-if="form.errors.has('hostname')" v-html="form.errors.get('hostname')"></div>
<label for="username" class="form-control-label">Username</label>
<div class="input-group input-group-merge">
<input class="form-element" data-name="username" @keydown="form.errors.clear('username')" v-model="form.username" required="required" name="username" type="text" id="username" />
</div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('username')" v-html="form.errors.get('username')"></div>
</div>
<div class="sm:col-span-6 form-group" :class="[{'has-error': form.errors.get('password')}]">
<label for="password" class="form-control-label">Password</label>
<div class="input-group input-group-merge">
<input class="form-element" data-name="password" v-model="form.password" name="password" type="password" value="" id="password" />
</div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('password')" v-html="form.errors.get('password')"></div>
</div>
<div class="sm:col-span-6 form-group mb--2 required" :class="[{'has-error': form.errors.get('database')}]">
<label for="database" class="form-control-label">Database</label>
<div class="input-group input-group-merge">
<input class="form-element" data-name="database" @keydown="form.errors.clear('database')" v-model="form.database" required="required" name="database" type="text" id="database" />
</div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('database')" v-html="form.errors.get('database')"></div>
</div>
</div> </div>
<div class="sm:col-span-6 form-group required">
<label for="username" class="text-black text-sm font-medium">Username</label>
<span class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div class="input-group input-group-merge">
<input
:class="[{'border-red': form.errors.get('username')}, {'border-light-gray': !form.errors.get('username')}]"
class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" data-name="username" @keydown="form.errors.clear('username')" v-model="form.username" required="required" name="username" type="text" id="username" />
</div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('username')" v-html="form.errors.get('username')"></div>
</div>
<div class="sm:col-span-6 form-group">
<label for="password" class="text-black text-sm font-medium">Password</label>
<div class="input-group input-group-merge">
<input
:class="[{'border-red': form.errors.get('password')}, {'border-light-gray': !form.errors.get('password')}]"
class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" data-name="password" v-model="form.password" name="password" type="password" value="" id="password" />
</div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('password')" v-html="form.errors.get('password')"></div>
</div>
<div class="sm:col-span-6 form-group mb--2 required">
<label for="database" class="text-black text-sm font-medium">Database</label>
<span class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div class="input-group input-group-merge">
<input
:class="[{'border-red': form.errors.get('database')}, {'border-light-gray': !form.errors.get('database')}]"
class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" data-name="database" @keydown="form.errors.clear('database')" v-model="form.database" required="required" name="database" type="text" id="database" />
</div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('database')" v-html="form.errors.get('database')"></div>
</div>
</div>
</div> </div>
<div class="relative__footer"> <div class="relative__footer">

View File

@ -3,7 +3,7 @@
<InstallSteps :active_state="active"></InstallSteps> <InstallSteps :active_state="active"></InstallSteps>
<div class="form-group mb-0"> <div class="form-group mb-0">
<select v-model="form.lang" name="lang" id="lang" size="13" class="w-full form-control-label"> <select v-model="form.lang" name="lang" id="lang" size="13" class="w-full text-black text-sm font-medium">
<option v-for="(name, code) in languages" :value="code"> <option v-for="(name, code) in languages" :value="code">
{{ name }} {{ name }}
</option> </option>

View File

@ -3,41 +3,45 @@
<InstallSteps :active_state="active"></InstallSteps> <InstallSteps :active_state="active"></InstallSteps>
<div class="grid sm:grid-cols-6 gap-x-8 gap-y-6 my-3.5 mt-0"> <div class="grid sm:grid-cols-6 gap-x-8 gap-y-6 my-3.5 mt-0">
<div class="sm:col-span-6 required" :class="[{'has-error': form.errors.get('company_name')}]"> <div class="sm:col-span-6 required">
<label for="company_name" class="form-control-label">Company Name</label> <label for="company_name" class="text-black text-sm font-medium">Company Name</label>
<span class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div class="input-group input-group-merge"> <div class="input-group input-group-merge">
<input class="form-element" data-name="company_name" @keydown="form.errors.clear('company_name')" v-model="form.company_name" required="required" name="company_name" type="text" id="company_name" /> <input :class="[{'border-red': form.errors.get('company_name')}, {'border-light-gray': !form.errors.get('company_name')}]" class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" data-name="company_name" @keydown="form.errors.clear('company_name')" v-model="form.company_name" required="required" name="company_name" type="text" id="company_name" />
</div> </div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('company_name')" v-html="form.errors.get('company_name')"></div> <div class="text-red text-sm mt-1 block" v-if="form.errors.has('company_name')" v-html="form.errors.get('company_name')"></div>
</div> </div>
<div class="sm:col-span-6 required" :class="[{'has-error': form.errors.get('company_email')}]"> <div class="sm:col-span-6 required">
<label for="company_email" class="form-control-label">Company Email</label> <label for="company_email" class="text-black text-sm font-medium">Company Email</label>
<span class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div class="input-group input-group-merge"> <div class="input-group input-group-merge">
<input class="form-element" data-name="company_email" @keydown="form.errors.clear('company_email')" v-model="form.company_email" required="required" name="company_email" type="text" id="company_email" /> <input :class="[{'border-red': form.errors.get('company_email')}, {'border-light-gray': !form.errors.get('company_email')}]" class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" data-name="company_email" @keydown="form.errors.clear('company_email')" v-model="form.company_email" required="required" name="company_email" type="text" id="company_email" />
</div> </div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('company_email')" v-html="form.errors.get('company_email')"></div> <div class="text-red text-sm mt-1 block" v-if="form.errors.has('company_email')" v-html="form.errors.get('company_email')"></div>
</div> </div>
<div class="sm:col-span-6 required" :class="[{'has-error': form.errors.get('user_email')}]"> <div class="sm:col-span-6 required">
<label for="user_email" class="form-control-label">Admin Email</label> <label for="user_email" class="text-black text-sm font-medium">Admin Email</label>
<span class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div class="input-group input-group-merge"> <div class="input-group input-group-merge">
<input class="form-element" data-name="user_email" @keydown="form.errors.clear('user_email')" v-model="form.user_email" required="required" name="user_email" type="text" id="user_email" /> <input :class="[{'border-red': form.errors.get('user_email')}, {'border-light-gray': !form.errors.get('user_email')}]" class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" data-name="user_email" @keydown="form.errors.clear('user_email')" v-model="form.user_email" required="required" name="user_email" type="text" id="user_email" />
</div> </div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('user_email')" v-html="form.errors.get('user_email')"></div> <div class="text-red text-sm mt-1 block" v-if="form.errors.has('user_email')" v-html="form.errors.get('user_email')"></div>
</div> </div>
<div class="sm:col-span-6 required" :class="[{'has-error': form.errors.get('user_password')}]"> <div class="sm:col-span-6 required">
<label for="user_password" class="form-control-label">Admin Password</label> <label for="user_password" class="text-black text-sm font-medium">Admin Password</label>
<span class="text-red ltr:ml-1 rtl:mr-1">*</span>
<div class="input-group input-group-merge"> <div class="input-group input-group-merge">
<input class="form-element" data-name="user_password" @keydown="form.errors.clear('user_password')" v-model="form.user_password" required="required" name="user_password" type="password" value="" id="user_password" /> <input :class="[{'border-red': form.errors.get('user_password')}, {'border-light-gray': !form.errors.get('user_password')}]" class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg borde text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" data-name="user_password" @keydown="form.errors.clear('user_password')" v-model="form.user_password" required="required" name="user_password" type="password" value="" id="user_password" />
</div> </div>
<div class="text-red text-sm mt-1 block" v-if="form.errors.has('user_password')" v-html="form.errors.get('user_password')"></div> <div class="text-red text-sm mt-1 block" v-if="form.errors.has('user_password')" v-html="form.errors.get('user_password')"></div>

View File

@ -41,7 +41,7 @@
<div class="sm:col-span-3 grid gap-10"> <div class="sm:col-span-3 grid gap-10">
<div class="sm:col-span-3"> <div class="sm:col-span-3">
<base-input :label="translations.company.address"> <base-input :label="translations.company.address">
<textarea class="form-element" name="address" data-name="address" rows="3" :placeholder="translations.company.address" v-model="company.address"></textarea> <textarea class="w-full text-sm px-3 py-2.5 mt-1 rounded-lg border border-light-gray text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" name="address" data-name="address" rows="3" :placeholder="translations.company.address" v-model="company.address"></textarea>
</base-input> </base-input>
</div> </div>
@ -63,7 +63,7 @@
</div> </div>
<div class="sm:col-span-3"> <div class="sm:col-span-3">
<label class="form-control-label">{{ translations.company.logo }}</label> <label class="text-black text-sm font-medium">{{ translations.company.logo }}</label>
<akaunting-dropzone-file-upload ref="dropzoneWizard" class="form-file dropzone-column w-2/5" style="height:12.2rem" preview-classes="single" :attachments="logo" :v-model="logo"> <akaunting-dropzone-file-upload ref="dropzoneWizard" class="form-file dropzone-column w-2/5" style="height:12.2rem" preview-classes="single" :attachments="logo" :v-model="logo">
</akaunting-dropzone-file-upload> </akaunting-dropzone-file-upload>
</div> </div>