feat: Add accent color to invoice settings and update related views; enhance event creation with brand contract option

This commit is contained in:
I-Fun
2026-04-02 07:24:43 +07:00
parent 86176c99c7
commit 5748b163b6
15 changed files with 302 additions and 62 deletions

View File

@@ -6,7 +6,7 @@
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: 'Helvetica', Arial, sans-serif; color: #374151; font-size: 13px; padding: 40px; }
.header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 40px; }
.logo { font-size: 22px; font-weight: 900; color: #FFB7C5; }
.logo { font-size: 22px; font-weight: 900; color: {{ $invoiceSettings->accent_color ?? '#FFB7C5' }}; }
.logo-sub { font-size: 11px; color: #9CA3AF; margin-top: 2px; }
.inv-number { font-size: 22px; font-weight: 700; color: #1F2937; text-align: right; }
.badge { display: inline-block; padding: 3px 12px; border-radius: 20px; font-size: 11px; font-weight: 700; background: #FDE68A; color: #92400E; }
@@ -27,7 +27,7 @@
.totals { display: flex; justify-content: flex-end; margin-bottom: 24px; }
.totals-box { width: 260px; }
.totals-row { display: flex; justify-content: space-between; padding: 4px 0; font-size: 12px; }
.totals-row.total { border-top: 2px solid #FFB7C5; margin-top: 6px; padding-top: 8px; font-size: 15px; font-weight: 800; color: #FFB7C5; }
.totals-row.total { border-top: 2px solid {{ $invoiceSettings->accent_color ?? '#FFB7C5' }}; margin-top: 6px; padding-top: 8px; font-size: 15px; font-weight: 800; color: {{ $invoiceSettings->accent_color ?? '#FFB7C5' }}; }
.bank-box { background: #FFF5F7; border-radius: 12px; padding: 14px 16px; margin-bottom: 16px; }
.bank-title { font-weight: 700; font-size: 12px; color: #374151; margin-bottom: 4px; }
.bank-detail { font-size: 12px; color: #6B7280; }
@@ -91,7 +91,12 @@
<tbody>
@foreach($invoice->items as $item)
<tr>
<td>{{ $item->description }}</td>
<td>
{{ $item->description }}
@if(!$item->is_taxable)
<span style="margin-left:6px; font-size:10px; background:#F3F4F6; color:#6B7280; padding:2px 8px; border-radius:10px; font-weight:600;">Non-Taxable</span>
@endif
</td>
<td style="text-align:center">{{ $item->quantity }}</td>
<td style="text-align:right">Rp {{ number_format($item->unit_price, 0, ',', '.') }}</td>
<td style="text-align:right; font-weight:600">Rp {{ number_format($item->total, 0, ',', '.') }}</td>

View File

@@ -96,6 +96,22 @@
value="{{ old('header_title', $settings->header_title) }}"
class="input-soft text-sm" placeholder="Content Creator · KOL">
</div>
<div x-data="{ color: '{{ old('accent_color', $settings->accent_color ?? '#FFB7C5') }}' }">
<label class="block text-xs font-semibold text-gray-600 mb-1">Accent Color</label>
<div class="flex items-center gap-3 mt-1">
<input type="color" name="accent_color" x-model="color"
class="w-10 h-10 rounded-xl cursor-pointer border-2 border-pink-100 p-0.5">
<div class="flex gap-2 flex-wrap">
@foreach(['#FFB7C5','#B5EAD7','#FDFD96','#E8D5F5','#FFD5B8','#AEC6CF','#FF8FAD','#A8D8EA'] as $preset)
<button type="button"
class="w-7 h-7 rounded-full ring-2 ring-transparent hover:ring-gray-400 transition-all"
style="background:{{ $preset }}"
@click="color = '{{ $preset }}'"></button>
@endforeach
</div>
</div>
<p class="text-xs text-gray-400 mt-1.5">Applied to your invoice header name and totals.</p>
</div>
</div>
</div>

View File

@@ -24,7 +24,8 @@
alt="Logo" class="h-14 w-14 object-cover rounded-2xl border border-pink-100 shrink-0">
@endif
<div>
<div class="text-xl font-extrabold text-pink-500">
<div class="text-xl font-extrabold"
style="color:{{ $invoiceSettings->accent_color ?? '#FFB7C5' }}">
{{ $invoiceSettings->header_name ?: '🐱 KOL Manager' }}
</div>
<div class="text-sm text-gray-400 mt-0.5">
@@ -74,7 +75,12 @@
<tbody>
@foreach($invoice->items as $item)
<tr class="border-b border-pink-50">
<td class="py-3 px-4 text-sm text-gray-700">{{ $item->description }}</td>
<td class="py-3 px-4 text-sm text-gray-700">
{{ $item->description }}
@if(!$item->is_taxable)
<span class="ml-1.5 text-xs bg-gray-100 text-gray-500 px-2 py-0.5 rounded-full font-medium">Non-Taxable</span>
@endif
</td>
<td class="py-3 px-4 text-sm text-center text-gray-600">{{ $item->quantity }}</td>
<td class="py-3 px-4 text-sm text-right text-gray-600">Rp {{ number_format($item->unit_price, 0, ',', '.') }}</td>
<td class="py-3 px-4 text-sm text-right font-semibold text-gray-800">Rp {{ number_format($item->total, 0, ',', '.') }}</td>
@@ -95,7 +101,8 @@
<span class="font-medium">Rp {{ number_format($invoice->tax_amount, 0, ',', '.') }}</span>
</div>
@endif
<div class="flex justify-between text-base font-bold text-pink-600 pt-2 border-t border-pink-200">
<div class="flex justify-between text-base font-bold pt-2 border-t border-pink-200"
style="color:{{ $invoiceSettings->accent_color ?? '#FFB7C5' }}">
<span>Total (you receive)</span><span>{{ $invoice->formatted_total }}</span>
</div>
</div>