xavierk/Voiced
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases 3 Wiki Activity

Release 1.2.0: Reset all data #3

Merged
xavierk merged 7 commits from release/1.2.0 into main 2026-10-06 07:14:35 +00:00
Conversation 1 Commits 7 Files Changed 75
+50 -23
2 changed files with 50 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit 66a39b2291 - Show all commits
src/styles/carbon.scss
+27
View File
@@ -213,6 +213,33 @@ body {
margin-bottom: 2rem; margin-bottom: 2rem;
} }
// The invoice form's fields sit on a plain 12-column grid. Carbon's nested <Grid> gives a column only as wide as the
// outer grid's tracks, which left dates, GSTINs and the saved-client box too narrow to show their text.
.voiced-fields {
display: grid;
grid-template-columns: repeat(12, minmax(0, 1fr));
gap: 1rem;
align-items: start;
}
.voiced-field {
grid-column: span 12;
min-width: 0;
}
@for $n from 1 through 12 {
.voiced-field--#{$n} {
grid-column: span $n;
}
}
@media (max-width: 1000px) {
// A narrow window: each of the three date/number fields still needs room for its text.
.voiced-field--4 {
grid-column: span 6;
}
}
.voiced-stack > * + * { .voiced-stack > * + * {
margin-top: 1.5rem; margin-top: 1.5rem;
} }
src/views/NewInvoice.tsx
+23 -23
View File
@@ -800,8 +800,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
</Column> </Column>
<Column sm={4} md={8} lg={9} className="voiced-stack"> <Column sm={4} md={8} lg={9} className="voiced-stack">
<Grid narrow> <div className="voiced-fields">
<Column sm={4} md={4} lg={5}> <div className="voiced-field voiced-field--4">
<TextInput <TextInput
id="invoiceDate" id="invoiceDate"
disabled={locked} disabled={locked}
@@ -813,8 +813,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
setDueDate(addDays(e.target.value, settings.paymentTermsDays)); setDueDate(addDays(e.target.value, settings.paymentTermsDays));
}} }}
/> />
</Column> </div>
<Column sm={4} md={4} lg={5}> <div className="voiced-field voiced-field--4">
<TextInput <TextInput
id="dueDate" id="dueDate"
disabled={locked} disabled={locked}
@@ -823,12 +823,12 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
value={dueDate} value={dueDate}
onChange={(e) => setDueDate(e.target.value)} onChange={(e) => setDueDate(e.target.value)}
/> />
</Column> </div>
<Column sm={4} md={8} lg={6}> <div className="voiced-field voiced-field--4">
<TextInput id="invoiceNumber" labelText="Invoice number" value={issued?.number ?? number} readOnly /> <TextInput id="invoiceNumber" labelText="Invoice number" value={issued?.number ?? number} readOnly />
</Column> </div>
<Column sm={4} md={8} lg={8}> <div className="voiced-field voiced-field--12">
<ComboBox <ComboBox
id="savedClient" id="savedClient"
disabled={locked} disabled={locked}
@@ -853,8 +853,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
> >
Create client Create client
</Button> </Button>
</Column> </div>
<Column sm={4} md={8} lg={8}> <div className="voiced-field voiced-field--12">
<TextInput <TextInput
id="clientName" id="clientName"
disabled={locked} disabled={locked}
@@ -865,8 +865,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
setClientId(null); setClientId(null);
}} }}
/> />
</Column> </div>
<Column sm={4} md={8} lg={16}> <div className="voiced-field voiced-field--12">
<TextArea <TextArea
id="clientAddress" id="clientAddress"
disabled={locked} disabled={locked}
@@ -875,8 +875,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
value={clientAddress} value={clientAddress}
onChange={(e) => setClientAddress(e.target.value)} onChange={(e) => setClientAddress(e.target.value)}
/> />
</Column> </div>
<Column sm={4} md={4} lg={5}> <div className="voiced-field voiced-field--5">
<TextInput <TextInput
id="clientGstin" id="clientGstin"
disabled={locked} disabled={locked}
@@ -886,8 +886,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
invalid={Boolean(clientGstinError)} invalid={Boolean(clientGstinError)}
invalidText={clientGstinError} invalidText={clientGstinError}
/> />
</Column> </div>
<Column sm={4} md={4} lg={5}> <div className="voiced-field voiced-field--7">
<TextInput <TextInput
id="poNumber" id="poNumber"
disabled={locked} disabled={locked}
@@ -895,8 +895,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
value={poNumber} value={poNumber}
onChange={(e) => setPoNumber(e.target.value)} onChange={(e) => setPoNumber(e.target.value)}
/> />
</Column> </div>
<Column sm={4} md={8} lg={6}> <div className="voiced-field voiced-field--12">
<Select <Select
id="placeOfSupply" id="placeOfSupply"
disabled={locked} disabled={locked}
@@ -908,8 +908,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
<SelectItem key={s.code} value={s.code} text={`${s.code} — ${s.name}`} /> <SelectItem key={s.code} value={s.code} text={`${s.code} — ${s.name}`} />
))} ))}
</Select> </Select>
</Column> </div>
<Column sm={4} md={8} lg={16}> <div className="voiced-field voiced-field--12">
<Toggle <Toggle
id="saveClient" id="saveClient"
disabled={locked} disabled={locked}
@@ -917,8 +917,8 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
toggled={saveClient} toggled={saveClient}
onToggle={setSaveClient} onToggle={setSaveClient}
/> />
</Column> </div>
</Grid> </div>
<div> <div>
<h3 style={{ marginBottom: "0.75rem" }}>Line items</h3> <h3 style={{ marginBottom: "0.75rem" }}>Line items</h3>
@@ -969,7 +969,7 @@ export default function NewInvoice({ settings, onSettingsChange, active, onActiv
/> />
</div> </div>
) : null} ) : null}
<div style={{ flex: "0 1 150px" }}> <div style={{ flex: "0 1 180px" }}>
<Select <Select
id={`mode-${index}`} id={`mode-${index}`}
disabled={locked} disabled={locked}