feat: Add accent color to invoice settings and update related views; enhance event creation with brand contract option
This commit is contained in:
@@ -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>
|
||||
|
||||
@@ -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>
|
||||
|
||||
|
||||
@@ -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>
|
||||
|
||||
Reference in New Issue
Block a user