static html classnames return to tailwind classnames for .blade files

This commit is contained in:
Burak Civan 2022-06-10 10:17:46 +03:00
parent df5f9e7dc7
commit 12b19a3ad0
16 changed files with 90 additions and 102 deletions

114
public/css/app.css vendored
View File

@ -1274,7 +1274,28 @@ input[type=file]::file-selector-button:hover{
/* form */
.form-element{
/* .form-element {
@apply 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;
} */
/* .has-error .form-element {
@apply border-red;
}
.prepend-input-icon .form-element {
@apply px-10;
} */
/* .form-control-label {
@apply text-black text-sm font-medium;
} */
/* div.required > .form-control-label::after {
content: '*';
@apply text-red ml-1;
} */
.input-money{
margin-top: 0.25rem;
width: 100%;
border-radius: 0.5rem;
@ -1293,32 +1314,32 @@ input[type=file]::file-selector-button:hover{
color: rgb(66 66 66 / var(--tw-text-opacity));
}
.form-element::-webkit-input-placeholder{
.input-money::-webkit-input-placeholder{
--tw-placeholder-opacity: 1;
color: rgb(199 201 217 / var(--tw-placeholder-opacity));
}
.form-element::-moz-placeholder{
.input-money::-moz-placeholder{
--tw-placeholder-opacity: 1;
color: rgb(199 201 217 / var(--tw-placeholder-opacity));
}
.form-element:-ms-input-placeholder{
.input-money:-ms-input-placeholder{
--tw-placeholder-opacity: 1;
color: rgb(199 201 217 / var(--tw-placeholder-opacity));
}
.form-element::-ms-input-placeholder{
.input-money::-ms-input-placeholder{
--tw-placeholder-opacity: 1;
color: rgb(199 201 217 / var(--tw-placeholder-opacity));
}
.form-element::placeholder{
.input-money::placeholder{
--tw-placeholder-opacity: 1;
color: rgb(199 201 217 / var(--tw-placeholder-opacity));
}
.form-element:focus{
.input-money:focus{
--tw-border-opacity: 1;
border-color: rgb(85 88 139 / var(--tw-border-opacity));
outline: 2px solid transparent;
@ -1326,7 +1347,7 @@ input[type=file]::file-selector-button:hover{
--tw-ring-color: transparent;
}
.form-element:disabled{
.input-money:disabled{
--tw-bg-opacity: 1;
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}
@ -1336,31 +1357,6 @@ input[type=file]::file-selector-button:hover{
border: none;
}
.has-error .form-element{
--tw-border-opacity: 1;
border-color: rgb(204 0 0 / var(--tw-border-opacity));
}
.prepend-input-icon .form-element{
padding-left: 2.5rem;
padding-right: 2.5rem;
}
.form-control-label{
font-size: 0.875rem;
line-height: 1.25rem;
font-weight: 500;
--tw-text-opacity: 1;
color: rgb(66 66 66 / var(--tw-text-opacity));
}
div.required > .form-control-label::after {
content: '*';
margin-left: 0.25rem;
--tw-text-opacity: 1;
color: rgb(204 0 0 / var(--tw-text-opacity));
}
[type="radio"]{
--tw-text-opacity: 1;
color: rgb(85 88 139 / var(--tw-text-opacity));
@ -46725,6 +46721,7 @@ input[type="date"]::-webkit-inner-spin-button,
.el-select .el-input .el-input__inner{
margin-top: 0.25rem;
height: auto;
width: 100%;
border-radius: 0.5rem;
border-width: 1px;
@ -46780,18 +46777,7 @@ input[type="date"]::-webkit-inner-spin-button,
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}
.has-error .el-select .el-input .el-input__inner{
--tw-border-opacity: 1;
border-color: rgb(204 0 0 / var(--tw-border-opacity));
}
.prepend-input-icon .el-select .el-input .el-input__inner{
padding-left: 2.5rem;
padding-right: 2.5rem;
}
.el-select .el-input .el-input__inner {
height: auto;
color:#595959 !important;
}
@ -47004,16 +46990,6 @@ input[type="date"]::-webkit-inner-spin-button,
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}
.has-error .el-date-editor input{
--tw-border-opacity: 1;
border-color: rgb(204 0 0 / var(--tw-border-opacity));
}
.prepend-input-icon .el-date-editor input{
padding-left: 2.5rem;
padding-right: 2.5rem;
}
.el-date-editor input {
color: #595959 !important;
}
@ -47689,16 +47665,16 @@ body{
background-color: rgb(238 238 243 / var(--tw-bg-opacity));
}
.disabled\:bg-gray-50:disabled{
--tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
}
.disabled\:bg-gray-200:disabled{
--tw-bg-opacity: 1;
background-color: rgb(229 231 235 / var(--tw-bg-opacity));
}
.disabled\:bg-gray-50:disabled{
--tw-bg-opacity: 1;
background-color: rgb(249 250 251 / var(--tw-bg-opacity));
}
.disabled\:bg-green-300:disabled{
--tw-bg-opacity: 1;
background-color: rgb(197 217 186 / var(--tw-bg-opacity));
@ -47839,14 +47815,14 @@ body{
margin-right: 0.75rem;
}
[dir="ltr"] .ltr\:mr-1{
margin-right: 0.25rem;
}
[dir="ltr"] .ltr\:ml-1{
margin-left: 0.25rem;
}
[dir="ltr"] .ltr\:mr-1{
margin-right: 0.25rem;
}
[dir="ltr"] .ltr\:ml-4{
margin-left: 1rem;
}
@ -48007,14 +47983,14 @@ body{
margin-left: 0.75rem;
}
[dir="rtl"] .rtl\:ml-1{
margin-left: 0.25rem;
}
[dir="rtl"] .rtl\:mr-1{
margin-right: 0.25rem;
}
[dir="rtl"] .rtl\:ml-1{
margin-left: 0.25rem;
}
[dir="rtl"] .rtl\:mr-4{
margin-right: 1rem;
}
@ -48223,6 +48199,10 @@ body{
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.sm\:grid-cols-2{
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.sm\:grid-cols-3{
grid-template-columns: repeat(3, minmax(0, 1fr));
}

View File

@ -8,7 +8,28 @@
@layer base {
/* form */
.form-element {
/* .form-element {
@apply 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;
} */
/* .has-error .form-element {
@apply border-red;
}
.prepend-input-icon .form-element {
@apply px-10;
} */
/* .form-control-label {
@apply text-black text-sm font-medium;
} */
/* div.required > .form-control-label::after {
content: '*';
@apply text-red ml-1;
} */
.input-money {
@apply 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;
}
@ -17,23 +38,6 @@
border: none;
}
.has-error .form-element {
@apply border-red;
}
.prepend-input-icon .form-element {
@apply px-10;
}
.form-control-label {
@apply text-black text-sm font-medium;
}
div.required > .form-control-label::after {
content: '*';
@apply text-red ml-1;
}
[type="radio"] {
@apply text-purple focus:outline-none focus:ring-purple focus:border-purple;
}
@ -248,7 +252,7 @@
}
.el-select .el-input .el-input__inner {
@apply form-element h-auto;
@apply w-full h-auto 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;
color:#595959 !important;
}
@ -368,7 +372,7 @@
}
.el-date-editor input {
@apply form-element;
@apply 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;
color: #595959 !important;
}

View File

@ -38,7 +38,7 @@
<input
type="text"
:ref="'items-' + index + '-name'"
class="form-element mt-0"
class="w-full text-sm px-3 py-2.5 mt-0 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 mt-0"
:name="'items.' + index + '.name'"
autocomplete="off"
required="required"
@ -65,7 +65,7 @@
<td class="px-3 py-3 border-b-0 description">
@if (! $hideItemDescription)
<textarea
class="form-element mt-1.5 resize-none"
class="w-full text-sm px-3 py-2.5 mt-1.5 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 resize-none"
style="height:42px;"
:ref="'items-' + index + '-description'"
placeholder="{{ trans('items.enter_item_description') }}"
@ -94,7 +94,7 @@
type="number"
min="0"
:ref="'items-' + index + '-quantity'"
class="form-element mt-0 text-right input-number-disabled"
class="w-full text-sm px-3 py-2.5 mt-0 text-right 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 input-number-disabled"
:name="'items.' + index + '.quantity'"
autocomplete="off"
required="required"
@ -233,7 +233,7 @@
<input type="number"
min="0"
placeholder="Discount"
class="form-element text-center mt-0"
class="w-full text-sm px-3 py-2.5 mt-0 text-center 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="'items.' + index + '.discount'"
autocomplete="off"
required="required"

View File

@ -4,7 +4,7 @@
label="{{ trans_choice('general.notes', 2) }}"
:value="$notes"
not-required
class="form-element border-0 bg-transparent px-0 rounded-none resize-none"
class="w-full text-sm px-0 py-2.5 mt-1 border-light-gray text-black placeholder-light-gray disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple border-0 bg-transparent rounded-none resize-none"
form-label-class="lg:text-lg"
form-group-class="border-b pb-2 mb-3.5"
rows="1"

View File

@ -43,7 +43,6 @@
<x-form.input.email
name="{{ $name }}"
id="{{ $id }}"
class="form-element"
value="{{ $value }}"
placeholder="{{ $placeholder }}"
v-model="{{ !empty($attributes['v-model']) ? $attributes['v-model'] : (!empty($attributes['data-field']) ? 'form.' . $attributes['data-field'] . '.' . $name : 'form.' . $name) }}"

View File

@ -43,7 +43,6 @@
<x-form.input.number
name="{{ $name }}"
id="{{ $id }}"
class="form-element"
value="{{ $value }}"
placeholder="{{ $placeholder }}"
v-model="{{ !empty($attributes['v-model']) ? $attributes['v-model'] : (!empty($attributes['data-field']) ? 'form.' . $attributes['data-field'] . '.' . $name : 'form.' . $name) }}"

View File

@ -43,7 +43,6 @@
<x-form.input.password
name="{{ $name }}"
id="{{ $id }}"
class="form-element"
value="{{ $value }}"
placeholder="{{ $placeholder }}"
v-model="{{ !empty($attributes['v-model']) ? $attributes['v-model'] : (!empty($attributes['data-field']) ? 'form.' . $attributes['data-field'] . '.' . $name : 'form.' . $name) }}"

View File

@ -26,7 +26,7 @@
@if (! $attributes->has('label') && ! empty($label->contents))
{!! $label ?? '' !!}
@elseif (! empty($label))
<x-form.label for="{{ $name }}" class="form-control-label">{!! $label !!}</x-form.label>
<x-form.label for="{{ $name }}" {{ $attributes->merge($custom_attributes) }}>{!! $label !!}</x-form.label>
@endif
<div @class([
@ -43,7 +43,6 @@
<x-form.input.text
name="{{ $name }}"
id="{{ $id }}"
class="form-element"
value="{{ $value }}"
placeholder="{!! $placeholder !!}"
disabled="{{ $disabled }}"

View File

@ -45,7 +45,7 @@
<x-form.input.textarea
name="{{ $name }}"
id="{{ $id }}"
class="form-element"
class="w-full h-24 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"
value="{!! $value !!}"
placeholder="{{ $placeholder }}"
rows="{{ $rows }}"

View File

@ -1,6 +1,7 @@
<input type="email"
name="{{ $name }}"
id="{{ $id }}"
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"
@if ($value)
value="{!! $value !!}"
@endif

View File

@ -1,6 +1,7 @@
<input type="number"
name="{{ $name }}"
id="{{ $id }}"
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"
@if ($value)
value="{{ $value }}"
@endif

View File

@ -1,6 +1,7 @@
<input type="password"
name="{{ $name }}"
id="{{ $id }}"
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"
@if ($value)
value="{!! $value !!}"
@endif

View File

@ -1,6 +1,7 @@
<input type="text"
name="{{ $name }}"
id="{{ $id }}"
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"
value="{!! $value !!}"
placeholder="{!! $placeholder !!}"
@if ($disabled)

View File

@ -1,3 +1,7 @@
<label {{ $attributes }}>
<label class="text-black text-sm font-medium" {{ $attributes }}>
{!! $slot !!}
@if ($attributes->has('required'))
<span class="text-red ltr:ml-1 rtl:mr-1">*</span>
@endif
</label>

View File

@ -7,7 +7,7 @@
</span>
</div>
<input type="text" name="search" wire:model.debounce.500ms="keyword" class="form-element" autocomplete="off" placeholder="{{ trans('general.search') }}">
<input type="text" name="search" wire:model.debounce.500ms="keyword" class="y text-black placeholder-light-gray bg-white disabled:bg-gray-200 focus:outline-none focus:ring-transparent focus:border-purple" autocomplete="off" placeholder="{{ trans('general.search') }}">
@if ($results)
<div class="dropdown-menu dropdown-menu-xl dropdown-menu-center show" ref="menu">

View File

@ -38,7 +38,7 @@
<label for="cron_command" class="form-control-label">
{{ trans('settings.scheduling.command') }}
</label>
<input type="text" class="form-element form-element-muted" disabled value="php {{ base_path('artisan') }} schedule:run >> /dev/null 2>&1">
<input type="text" 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" disabled value="php {{ base_path('artisan') }} schedule:run >> /dev/null 2>&1">
</div>
<x-form.group.text name="time" label="{{ trans('settings.scheduling.schedule_time') }}" value="{{ setting('schedule.time') }}" not-required />