fix: theming v1
This commit is contained in:
parent
d430e82d3f
commit
da2946fe7f
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
export function TrustStrip({ location = 'panel' }: { location?: 'panel' | 'sheet' }) {
|
||||
return (
|
||||
<div className={`text-[10px] ${location === 'sheet' ? 'mt-2' : ''} text-black/50 dark:text-white/50 flex items-center gap-2`}>
|
||||
<div className={`text-[10px] ${location === 'sheet' ? 'mt-2' : ''} text-black/50 flex items-center gap-2`}>
|
||||
<span aria-hidden>🔒</span>
|
||||
<span>Secure payments by Midtrans</span>
|
||||
<span aria-hidden className="ml-auto flex items-center gap-1">
|
||||
|
|
|
|||
|
|
@ -78,7 +78,7 @@ export function CheckoutPage() {
|
|||
<div className="space-y-3">
|
||||
<div className="text-sm font-medium">Konfirmasi data checkout</div>
|
||||
<label className="block">
|
||||
<div className="text-xs text-black/60 dark:text-white/60">Nama</div>
|
||||
<div className="text-xs text-black/60">Nama</div>
|
||||
<input
|
||||
type="text"
|
||||
className="w-full rounded border px-3 py-2"
|
||||
|
|
@ -87,7 +87,7 @@ export function CheckoutPage() {
|
|||
/>
|
||||
</label>
|
||||
<label className="block">
|
||||
<div className="text-xs text-black/60 dark:text-white/60">Email atau HP</div>
|
||||
<div className="text-xs text-black/60">Email atau HP</div>
|
||||
<input
|
||||
type="text"
|
||||
className="w-full rounded border px-3 py-2"
|
||||
|
|
@ -96,7 +96,7 @@ export function CheckoutPage() {
|
|||
/>
|
||||
</label>
|
||||
<label className="block">
|
||||
<div className="text-xs text-black/60 dark:text-white/60">Alamat</div>
|
||||
<div className="text-xs text-black/60">Alamat</div>
|
||||
<input
|
||||
type="text"
|
||||
className="w-full rounded border px-3 py-2"
|
||||
|
|
@ -105,7 +105,7 @@ export function CheckoutPage() {
|
|||
/>
|
||||
</label>
|
||||
<label className="block">
|
||||
<div className="text-xs text-black/60 dark:text-white/60">Catatan</div>
|
||||
<div className="text-xs text-black/60 ">Catatan</div>
|
||||
<textarea
|
||||
className="w-full rounded border px-3 py-2"
|
||||
value={form.notes}
|
||||
|
|
@ -114,7 +114,7 @@ export function CheckoutPage() {
|
|||
</label>
|
||||
<div className="pt-2 flex gap-2">
|
||||
<Button
|
||||
variant="primary"
|
||||
variant="secondary"
|
||||
className="w-full"
|
||||
aria-busy={isBusy}
|
||||
disabled={isBusy}
|
||||
|
|
@ -159,12 +159,12 @@ export function CheckoutPage() {
|
|||
disabled={locked}
|
||||
enabled={runtimeCfg?.paymentToggles
|
||||
? {
|
||||
bank_transfer: runtimeCfg.paymentToggles.bank_transfer,
|
||||
credit_card: runtimeCfg.paymentToggles.credit_card,
|
||||
gopay: runtimeCfg.paymentToggles.gopay,
|
||||
cstore: runtimeCfg.paymentToggles.cstore,
|
||||
cpay: !!runtimeCfg.paymentToggles.cpay,
|
||||
}
|
||||
bank_transfer: runtimeCfg.paymentToggles.bank_transfer,
|
||||
credit_card: runtimeCfg.paymentToggles.credit_card,
|
||||
gopay: runtimeCfg.paymentToggles.gopay,
|
||||
cstore: runtimeCfg.paymentToggles.cstore,
|
||||
cpay: !!runtimeCfg.paymentToggles.cpay,
|
||||
}
|
||||
: undefined}
|
||||
renderPanel={(m) => {
|
||||
const methodEnabled = runtimeCfg?.paymentToggles ?? defaultEnabled()
|
||||
|
|
@ -180,7 +180,7 @@ export function CheckoutPage() {
|
|||
<div className="space-y-2" aria-live="polite">
|
||||
<div className="text-xs text-black/60 dark:text-white/60">Pilih bank untuk membuat Virtual Account</div>
|
||||
<div className={`grid grid-cols-3 gap-2 ${isBusy ? 'pointer-events-none opacity-60' : ''}`}>
|
||||
{(['bca','bni','bri','cimb','mandiri','permata'] as BankKey[]).map((bk) => (
|
||||
{(['bca', 'bni', 'bri', 'cimb', 'mandiri', 'permata'] as BankKey[]).map((bk) => (
|
||||
<button
|
||||
key={bk}
|
||||
type="button"
|
||||
|
|
@ -210,7 +210,7 @@ export function CheckoutPage() {
|
|||
<div className="space-y-2" aria-live="polite">
|
||||
<div className="text-xs text-black/60 dark:text-white/60">Pilih toko untuk membuat kode pembayaran</div>
|
||||
<div className={`grid grid-cols-2 gap-2 ${isBusy ? 'pointer-events-none opacity-60' : ''}`}>
|
||||
{(['alfamart','indomaret'] as const).map((st) => (
|
||||
{(['alfamart', 'indomaret'] as const).map((st) => (
|
||||
<button
|
||||
key={st}
|
||||
type="button"
|
||||
|
|
|
|||
|
|
@ -12,14 +12,14 @@ export function DemoStorePage() {
|
|||
<div className="flex items-start justify-between gap-4">
|
||||
<div>
|
||||
<div className="text-sm font-medium">Produk: T-Shirt Hitam</div>
|
||||
<div className="text-xs text-black/60 dark:text-white/60">Ukuran: M • Bahan: Cotton</div>
|
||||
<div className="text-xs text-black/60">Ukuran: M • Bahan: Cotton</div>
|
||||
<div className="mt-2 text-lg font-semibold">Rp 3.500.000</div>
|
||||
</div>
|
||||
<div className="w-24 h-24 rounded bg-black/10 dark:bg-white/10" aria-hidden />
|
||||
</div>
|
||||
<div className="mt-4">
|
||||
<Button
|
||||
variant="primary"
|
||||
variant="secondary"
|
||||
className="w-full"
|
||||
aria-busy={busy}
|
||||
disabled={busy}
|
||||
|
|
|
|||
Loading…
Reference in New Issue