[STYLE] 優化機台介面:加大 Tab 字體、自定義上傳 UI、優化開關深色模式
All checks were successful
star-cloud-deploy-demo / deploy-demo (push) Successful in 47s
All checks were successful
star-cloud-deploy-demo / deploy-demo (push) Successful in 47s
This commit is contained in:
@@ -1,7 +1,7 @@
|
||||
@extends('layouts.admin')
|
||||
|
||||
@section('content')
|
||||
<div class="space-y-10 pb-20">
|
||||
<div class="space-y-10 pb-20" x-data="{ selectedFileCount: 0, handleFileChange(e) { this.selectedFileCount = e.target.files.length; } }">
|
||||
<!-- Header -->
|
||||
<div class="flex flex-col md:flex-row md:items-center md:justify-between gap-6">
|
||||
<div class="flex items-center gap-4">
|
||||
@@ -199,7 +199,7 @@
|
||||
<div class="relative inline-flex items-center cursor-pointer">
|
||||
<input type="hidden" name="welcome_gift_enabled" value="0">
|
||||
<input type="checkbox" name="welcome_gift_enabled" value="1" {{ $machine->welcome_gift_enabled ? 'checked' : '' }} class="sr-only peer">
|
||||
<div class="w-11 h-6 bg-slate-200 rounded-full peer peer-focus:ring-4 peer-focus:ring-cyan-300 dark:peer-focus:ring-cyan-800 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-cyan-500"></div>
|
||||
<div class="w-11 h-6 bg-slate-200 dark:bg-slate-700 rounded-full peer peer-focus:ring-4 peer-focus:ring-cyan-300 dark:peer-focus:ring-cyan-800 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-cyan-500 transition-colors"></div>
|
||||
</div>
|
||||
</label>
|
||||
|
||||
@@ -211,7 +211,7 @@
|
||||
<div class="relative inline-flex items-center cursor-pointer">
|
||||
<input type="hidden" name="member_system_enabled" value="0">
|
||||
<input type="checkbox" name="member_system_enabled" value="1" {{ $machine->member_system_enabled ? 'checked' : '' }} class="sr-only peer">
|
||||
<div class="w-11 h-6 bg-slate-200 rounded-full peer peer-focus:ring-4 peer-focus:ring-cyan-300 dark:peer-focus:ring-cyan-800 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-cyan-500"></div>
|
||||
<div class="w-11 h-6 bg-slate-200 dark:bg-slate-700 rounded-full peer peer-focus:ring-4 peer-focus:ring-cyan-300 dark:peer-focus:ring-cyan-800 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all dark:border-gray-600 peer-checked:bg-cyan-500 transition-colors"></div>
|
||||
</div>
|
||||
</label>
|
||||
</div>
|
||||
@@ -243,7 +243,27 @@
|
||||
|
||||
<div>
|
||||
<label class="block text-[11px] font-black text-slate-400 uppercase tracking-[0.2em] mb-2">{{ __('Upload New Images') }} ({{ __('Max 3') }})</label>
|
||||
<input type="file" name="images[]" multiple accept="image/*" class="luxury-input w-full text-xs py-2">
|
||||
<label class="relative flex flex-col items-center justify-center w-full h-32 border-2 border-dashed border-slate-200 dark:border-slate-800 rounded-3xl cursor-pointer bg-slate-50/50 dark:bg-slate-900/50 hover:bg-slate-100 dark:hover:bg-slate-800/80 transition-all group">
|
||||
<template x-if="selectedFileCount === 0">
|
||||
<div class="flex flex-col items-center justify-center pt-5 pb-6">
|
||||
<svg class="w-8 h-8 mb-3 text-slate-400 group-hover:text-cyan-500 transition-colors" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M15 13l-3-3m0 0l-3 3m3-3v12" />
|
||||
</svg>
|
||||
<p class="text-xs font-bold text-slate-500 dark:text-slate-400 uppercase tracking-widest">{{ __('Click to upload') }}</p>
|
||||
</div>
|
||||
</template>
|
||||
<template x-if="selectedFileCount > 0">
|
||||
<div class="flex flex-col items-center justify-center pt-5 pb-6">
|
||||
<div class="w-10 h-10 rounded-full bg-emerald-500/10 flex items-center justify-center text-emerald-500 mb-2">
|
||||
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2.5" d="M5 13l4 4L19 7" />
|
||||
</svg>
|
||||
</div>
|
||||
<p class="text-xs font-black text-emerald-500 uppercase tracking-widest" x-text="`${selectedFileCount} {{ __('files selected') }}`"></p>
|
||||
</div>
|
||||
</template>
|
||||
<input type="file" name="images[]" multiple accept="image/*" class="hidden" @change="handleFileChange">
|
||||
</label>
|
||||
<p class="text-[10px] text-slate-400 mt-2 font-bold uppercase tracking-widest">* {{ __('Uploading new images will replace all existing images.') }}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user