terrylee/star-cloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[STYLE] 銷售中心與 admin header 手機版響應式調整

Browse Source 
1. 銷售中心三個 Tab 容器圓角與內距改為行動優先（rounded-2xl sm:rounded-3xl、p-4 sm:p-6 lg:p-8）。
2. 訂單/發票/出貨三個列表的搜尋欄寬度改為手機滿版、桌面才套 min-w-[280px]（w-full min-w-0 lg:min-w-[280px]）。
3. admin layout：body 加 overflow-x-clip 防止水平溢出；行動版品牌字在窄螢幕隱藏、自動刷新與 logo 區塊調整間距與 shrink-0 避免擠壓。

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
sky121113 2026-06-18 11:41:37 +08:00
parent 69a1d02fc7
commit 840052dd5a
5 changed files with 10 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
resources/views/admin/sales/index.blade.php
View File

@ -21,7 +21,7 @@
<div x-show="activeTab === 'orders'" class="relative"
x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0 translate-y-4"
x-transition:enter-end="opacity-100 translate-y-0">
<div class="luxury-card rounded-3xl p-8 relative overflow-hidden">
<div class="luxury-card rounded-2xl sm:rounded-3xl p-4 sm:p-6 lg:p-8 relative overflow-hidden">
<x-luxury-spinner show="tabLoading === 'orders'" />
<div id="tab-orders-container" :class="{ 'opacity-30 pointer-events-none transition-opacity duration-300': tabLoading === 'orders' }">
@include('admin.sales.partials.tab-orders')
@ -33,7 +33,7 @@
<div x-show="activeTab === 'invoices'" class="relative"
x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0 translate-y-4"
x-transition:enter-end="opacity-100 translate-y-0" x-cloak>
<div class="luxury-card rounded-3xl p-8 relative overflow-hidden">
<div class="luxury-card rounded-2xl sm:rounded-3xl p-4 sm:p-6 lg:p-8 relative overflow-hidden">
<x-luxury-spinner show="tabLoading === 'invoices'" />
<div id="tab-invoices-container" :class="{ 'opacity-30 pointer-events-none transition-opacity duration-300': tabLoading === 'invoices' }">
@include('admin.sales.partials.tab-invoices')
@ -45,7 +45,7 @@
<div x-show="activeTab === 'dispense'" class="relative"
x-transition:enter="transition ease-out duration-300" x-transition:enter-start="opacity-0 translate-y-4"
x-transition:enter-end="opacity-100 translate-y-0" x-cloak>
<div class="luxury-card rounded-3xl p-8 relative overflow-hidden">
<div class="luxury-card rounded-2xl sm:rounded-3xl p-4 sm:p-6 lg:p-8 relative overflow-hidden">
<x-luxury-spinner show="tabLoading === 'dispense'" />
<div id="tab-dispense-container" :class="{ 'opacity-30 pointer-events-none transition-opacity duration-300': tabLoading === 'dispense' }">
@include('admin.sales.partials.tab-dispense')

2
resources/views/admin/sales/partials/tab-dispense.blade.php
View File

@ -4,7 +4,7 @@
<input type="hidden" name="tab" value="dispense">
<div class="relative group flex-1 min-w-[280px]">
<div class="relative group flex-1 w-full min-w-0 lg:min-w-[280px]">
<span class="absolute inset-y-0 left-0 flex items-center pl-4 pointer-events-none z-10">
<svg class="w-4 h-4 text-slate-400 group-focus-within:text-cyan-500 transition-colors stroke-[2.5]"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round">

2
resources/views/admin/sales/partials/tab-invoices.blade.php
View File

@ -4,7 +4,7 @@
<input type="hidden" name="tab" value="invoices">
<div class="relative group flex-1 min-w-[280px]">
<div class="relative group flex-1 w-full min-w-0 lg:min-w-[280px]">
<span class="absolute inset-y-0 left-0 flex items-center pl-4 pointer-events-none z-10">
<svg class="w-4 h-4 text-slate-400 group-focus-within:text-cyan-500 transition-colors stroke-[2.5]"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round">

2
resources/views/admin/sales/partials/tab-orders.blade.php
View File

@ -4,7 +4,7 @@
<input type="hidden" name="tab" value="orders">
<div class="relative group flex-1 min-w-[280px]">
<div class="relative group flex-1 w-full min-w-0 lg:min-w-[280px]">
<span class="absolute inset-y-0 left-0 flex items-center pl-4 pointer-events-none z-10">
<svg class="w-4 h-4 text-slate-400 group-focus-within:text-cyan-500 transition-colors stroke-[2.5]"
viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round">

8
resources/views/layouts/admin.blade.php
View File

@ -44,7 +44,7 @@
</head>
<body
class="bg-gray-50 dark:bg-[#0f172a] antialiased font-sans h-full selection:bg-indigo-100 dark:selection:bg-indigo-900/40"
class="bg-gray-50 dark:bg-[#0f172a] antialiased font-sans h-full overflow-x-clip selection:bg-indigo-100 dark:selection:bg-indigo-900/40"
x-data="{
sidebarOpen: false,
sidebarCollapsed: localStorage.getItem('sidebarCollapsed') === 'true',
@ -128,18 +128,18 @@
<header
class="sticky top-0 inset-x-0 flex flex-wrap sm:justify-start sm:flex-nowrap z-[48] w-full bg-white/80 backdrop-blur-md border-b border-slate-200/50 text-sm py-2.5 sm:py-4 lg:pl-[var(--admin-sidebar-offset)] dark:bg-[#0f172a]/80 dark:border-slate-800/50 shadow-sm transition-all duration-300">
<nav class="flex basis-full items-center w-full mx-auto pl-4 lg:pl-0 pr-4 sm:pr-6 md:pr-8" aria-label="Global">
<div class="mr-5 lg:mr-0 lg:hidden text-center">
<div class="mr-2 lg:mr-0 lg:hidden text-center shrink-0">
<a class="flex items-center gap-x-2 flex-none text-xl font-bold dark:text-white font-display tracking-tight"
href="{{ route('admin.dashboard') }}" aria-label="Brand">
<img src="{{ auth()->user()->company && auth()->user()->company->hasCustomBrandingEnabled() && auth()->user()->company->logo_url ? auth()->user()->company->logo_url : asset('starcloud_icon.png') }}"
alt="{{ auth()->user()->company ? auth()->user()->company->name : config('app.name') }} Logo"
class="w-7 h-7 max-h-7 max-w-[28px] object-contain shrink-0">
<span>Star<span class="text-cyan-500">Cloud</span></span>
<span class="hidden min-[400px]:inline">Star<span class="text-cyan-500">Cloud</span></span>
</a>
</div>
<!-- Auto Refresh -->
<div class="relative inline-flex ml-4 sm:ml-10 lg:ml-0" x-data="{
<div class="relative inline-flex shrink-0 ml-2 sm:ml-10 lg:ml-0" x-data="{
refreshOpen: false,
interval: localStorage.getItem('autoRefreshInterval') || 'Off',
timeLeft: 0,