mirror of
https://github.com/aljazceru/opencode.git
synced 2025-12-22 18:24:21 +01:00
ignore: cloud balance section
This commit is contained in:
@@ -130,7 +130,7 @@ const dummyPaymentData = [
|
|||||||
},
|
},
|
||||||
]
|
]
|
||||||
|
|
||||||
export default function () {
|
export default function() {
|
||||||
const actor = createAsync(() => getActor())
|
const actor = createAsync(() => getActor())
|
||||||
onMount(() => {
|
onMount(() => {
|
||||||
console.log("MOUNTED", actor())
|
console.log("MOUNTED", actor())
|
||||||
@@ -366,15 +366,26 @@ export default function () {
|
|||||||
<section data-slot="balance-section">
|
<section data-slot="balance-section">
|
||||||
<div data-slot="section-title">
|
<div data-slot="section-title">
|
||||||
<h2>Balance</h2>
|
<h2>Balance</h2>
|
||||||
<p>Manage your billing and add credits to your account.</p>
|
<p>Add credits to your account.</p>
|
||||||
</div>
|
</div>
|
||||||
<div data-slot="balance">
|
<div data-slot="balance">
|
||||||
<p>
|
<div
|
||||||
{(() => {
|
data-slot="amount"
|
||||||
const balanceStr = ((billingInfo()?.billing?.balance ?? 0) / 100000000).toFixed(2)
|
classList={{
|
||||||
return `$${balanceStr === "-0.00" ? "0.00" : balanceStr}`
|
danger: (() => {
|
||||||
})()}
|
const balanceStr = ((billingInfo()?.billing?.balance ?? 0) / 100000000).toFixed(2)
|
||||||
</p>
|
return balanceStr === "0.00" || balanceStr === "-0.00"
|
||||||
|
})(),
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
<span data-slot="currency">$</span>
|
||||||
|
<span data-slot="value">
|
||||||
|
{(() => {
|
||||||
|
const balanceStr = ((billingInfo()?.billing?.balance ?? 0) / 100000000).toFixed(2)
|
||||||
|
return balanceStr === "-0.00" ? "0.00" : balanceStr
|
||||||
|
})()}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
<button color="primary" disabled={isLoading()} onClick={handleBuyCredits}>
|
<button color="primary" disabled={isLoading()} onClick={handleBuyCredits}>
|
||||||
{isLoading() ? "Loading..." : "Buy Credits"}
|
{isLoading() ? "Loading..." : "Buy Credits"}
|
||||||
</button>
|
</button>
|
||||||
|
|||||||
@@ -27,13 +27,15 @@
|
|||||||
|
|
||||||
/* Common elements */
|
/* Common elements */
|
||||||
button {
|
button {
|
||||||
padding: var(--space-2) var(--space-4);
|
padding: var(--space-3) var(--space-4);
|
||||||
border: 1px solid var(--color-border);
|
border: 1px solid var(--color-border);
|
||||||
border-radius: var(--border-radius-sm);
|
border-radius: var(--border-radius-sm);
|
||||||
background-color: var(--color-bg);
|
background-color: var(--color-bg);
|
||||||
color: var(--color-text);
|
color: var(--color-text);
|
||||||
font-size: var(--font-size-sm);
|
font-size: var(--font-size-sm);
|
||||||
font-family: var(--font-sans);
|
font-family: var(--font-sans);
|
||||||
|
font-weight: 500;
|
||||||
|
text-transform: uppercase;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
transition: all 0.15s ease;
|
transition: all 0.15s ease;
|
||||||
|
|
||||||
@@ -264,15 +266,39 @@ a {
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
gap: var(--space-3);
|
gap: var(--space-3);
|
||||||
padding: var(--space-4);
|
padding: var(--space-4);
|
||||||
background-color: var(--color-bg-surface);
|
|
||||||
border: 1px solid var(--color-border);
|
border: 1px solid var(--color-border);
|
||||||
border-radius: var(--border-radius-sm);
|
border-radius: var(--border-radius-sm);
|
||||||
max-width: 32rem;
|
min-width: 14.5rem;
|
||||||
|
width: fit-content;
|
||||||
|
|
||||||
p {
|
[data-slot="amount"] {
|
||||||
font-size: var(--font-size-2xl);
|
padding: var(--space-3-5) var(--space-4);
|
||||||
font-weight: 500;
|
background-color: var(--color-bg-surface);
|
||||||
color: var(--color-text);
|
border-radius: var(--border-radius-sm);
|
||||||
|
display: flex;
|
||||||
|
align-items: baseline;
|
||||||
|
gap: var(--space-1);
|
||||||
|
justify-content: flex-end;
|
||||||
|
|
||||||
|
&.danger {
|
||||||
|
[data-slot="value"] {
|
||||||
|
color: var(--color-danger);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-slot="currency"] {
|
||||||
|
position: relative;
|
||||||
|
bottom: 2px;
|
||||||
|
font-size: var(--font-size-lg);
|
||||||
|
color: var(--color-text-muted);
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-slot="value"] {
|
||||||
|
font-size: var(--font-size-3xl);
|
||||||
|
font-weight: 500;
|
||||||
|
color: var(--color-text);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user