Files
besttechfrom.eu/resources/views/components/product/plans-form.blade.php
T
Doar MihaiandClaude Sonnet 5.5 2a37695d78 fix: add dark mode variants to light-only views
Forms, upvote button, modal, notifications and several pages had no
dark: classes and rendered as white blocks in dark mode.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
2026-10-17 16:24:26 +03:00

42 lines
2.6 KiB
PHP

@props(['plans' => []])
@php
$initial = collect(old('plans_present') ? old('plans', []) : $plans)->map(fn ($p) => [
'name' => $p['name'] ?? '',
'price' => $p['price'] ?? '',
'period' => $p['period'] ?? 'monthly',
'description' => $p['description'] ?? '',
])->values()->all();
$input = 'block w-full px-3 py-2 border border-gray-300 dark:border-gray-600 dark:bg-gray-700 dark:text-white rounded-md shadow-sm focus:outline-none focus:ring-primary-500 focus:border-primary-500 sm:text-sm';
@endphp
<!-- Pricing plans -->
<div x-data="{ plans: @js($initial) }">
<input type="hidden" name="plans_present" value="1">
<label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Pricing plans</label>
<div class="mt-2 space-y-3">
<template x-for="(plan, i) in plans" :key="i">
<div class="grid grid-cols-1 sm:grid-cols-12 gap-2 p-3 border border-gray-200 dark:border-gray-700 rounded-md">
<input type="text" :name="`plans[${i}][name]`" x-model="plan.name" placeholder="Name" maxlength="100" class="{{ $input }} sm:col-span-3">
<input type="number" :name="`plans[${i}][price]`" x-model="plan.price" placeholder="Price (EUR)" min="0" max="99999" step="0.01" class="{{ $input }} sm:col-span-2">
<select :name="`plans[${i}][period]`" x-model="plan.period" class="{{ $input }} sm:col-span-2">
@foreach(\App\Models\PricingPlan::PERIODS as $period)
<option value="{{ $period }}">{{ $period }}</option>
@endforeach
</select>
<input type="text" :name="`plans[${i}][description]`" x-model="plan.description" placeholder="Description (optional)" maxlength="255" class="{{ $input }} sm:col-span-4">
<button type="button" @click="plans.splice(i, 1)" class="sm:col-span-1 text-sm text-red-600 dark:text-red-400 hover:text-red-800">Remove</button>
</div>
</template>
</div>
@foreach($errors->get('plans.*') as $messages)
<p class="mt-2 text-sm text-red-600 dark:text-red-400">{{ $messages[0] }}</p>
@endforeach
@error('plans')
<p class="mt-2 text-sm text-red-600 dark:text-red-400">{{ $message }}</p>
@enderror
<button type="button" @click="plans.push({ name: '', price: '', period: 'monthly', description: '' })"
class="mt-3 inline-flex items-center px-3 py-1.5 border border-gray-300 dark:border-gray-600 rounded-md text-sm text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-700">Add plan</button>
</div>