angel/inventory-plus-plus
1
0
Fork 0
Code Issues 34 Pull Requests Actions Packages Projects 4 Releases Wiki Activity

mock shop page: search listings

Browse Source
This commit is contained in:
angel
2026-02-05 11:02:29 -07:00
parent 02893511ba
commit 0924d0edb1
2 changed files with 94 additions and 65 deletions
Download Patch File Download Diff File Expand all files Collapse all files
styles/index.css
-11
View File
@@ -268,9 +268,6 @@
.ml-\[1em\] {
margin-left: 1em;
}
.box-border {
box-sizing: border-box;
}
.block {
display: block;
}
@@ -358,9 +355,6 @@
.list-none {
list-style-type: none;
}
.grid-cols-\[1fr_1fr\] {
grid-template-columns: 1fr 1fr;
}
.grid-cols-\[2fr_8fr_2fr\] {
grid-template-columns: 2fr 8fr 2fr;
}
@@ -802,11 +796,6 @@
padding-block: calc(8vw - 0.5em);
}
}
.sm\:grid-cols-\[1fr_1fr\] {
@media (width >= 40rem) {
grid-template-columns: 1fr 1fr;
}
}
.md\:grid-cols-\[1fr_1fr\] {
@media (width >= 48rem) {
grid-template-columns: 1fr 1fr;
templates/pages/accounts/{acctID.int64}/platforms/{platform}/shops/mocks/{shopID}/index.html.tmpl
+94 -54
View File
@@ -79,7 +79,7 @@
<h3 class="col-[span_2] text-center">
New Listing
</h3>
<label for="name">
<label for="name" class="self-center">
Name:
</label>
<input
@@ -90,7 +90,7 @@
placeholder="What's in a name..."
class="bg-accent p-[0.25em] rounded-sm"
/>
<label for="sku">
<label for="sku" class="self-center">
SKU:
</label>
<input
@@ -99,7 +99,7 @@
required
class="bg-accent p-[0.25em] rounded-sm"
/>
<label for="description">
<label for="description" class="self-center">
Description:
</label>
<input
@@ -160,7 +160,7 @@
<h3 class="col-[span_2] text-center">
Edit Listing
</h3>
<label for="name">
<label for="name" class="self-center">
Name:
</label>
<input
@@ -171,7 +171,7 @@
placeholder="What's in a name..."
class="bg-accent p-[0.25em] rounded-sm"
/>
<label for="sku">
<label for="sku" class="self-center">
SKU:
</label>
<input
@@ -180,7 +180,7 @@
required
class="bg-accent p-[0.25em] rounded-sm"
/>
<label for="description">
<label for="description" class="self-center">
Description:
</label>
<input
@@ -212,63 +212,103 @@
}}
</form>
<ul class="max-h-[50em] overflow-y-auto flex flex-col gap-[1em]">
{{- range $listing := .Accounts.ListMockListingsForShop $acctID $platform $shopID }}
<li
id="listing-{{$listing.ListingID}}"
<div>
<form
class="
grid
grid-cols-[max-content_1fr]
gap-[0.5em]
mb-[1em]
p-[1em]
grid grid-cols-[max-content_1fr] gap-x-[1em]
bg-card
h-fit
rounded-lg
"
_="
on click
send startEditingExistingListing(
listingID: '{{$listing.ListingID}}',
name: '{{$listing.Name}}',
sku: '{{$listing.SKU}}',
description: '{{$listing.Description}}'
) to #listings-container
send reset() to <li/> in the closest <ul/>
add .border-foreground to me
add .border to me
on reset
remove .border-foreground from me
remove .border from me
"
>
<span>
Name:
</span>
<span>
{{ $listing.Name }}
</span>
<label for="name" class="self-center">
Find Listing
</label>
<input
type="search"
name="name"
class="bg-accent p-[0.25em] rounded-sm"
_="
on input
set term to event.target.value
if (not term)
remove .hidden from <li/> in next <ul/>
else
for li in (<li/> in the next <ul/>)
set name to the (innerHTML of the first .listing-name in li).trim()
if not name.includes(term)
add .hidden to li
else
remove .hidden from li
end
end
end
"
/>
</form>
<span>
SKU:
</span>
<span>
{{ $listing.SKU }}
</span>
<ul class="max-h-[50em] overflow-y-auto flex flex-col gap-[1em]">
{{- range $listing := .Accounts.ListMockListingsForShop $acctID $platform $shopID }}
<li
id="listing-{{$listing.ListingID}}"
class="
p-[1em]
grid grid-cols-[max-content_1fr] gap-x-[1em]
bg-card
rounded-lg
"
_="
on click
send startEditingExistingListing(
listingID: '{{$listing.ListingID}}',
name: '{{$listing.Name}}',
sku: '{{$listing.SKU}}',
description: '{{$listing.Description}}'
) to #listings-container
send reset() to <li/> in the closest <ul/>
add .border-foreground to me
add .border to me
<span>
Description:
</span>
<span>
{{ $listing.Description }}
</span>
on reset
remove .border-foreground from me
remove .border from me
"
>
<span>
Name:
</span>
<span class="listing-name">
{{ $listing.Name }}
</span>
<span>
Count:
</span>
<span>
{{ $listing.Count }}
</span>
</li>
{{- end }}
</ul>
<span>
SKU:
</span>
<span>
{{ $listing.SKU }}
</span>
<span>
Description:
</span>
<span>
{{ $listing.Description }}
</span>
<span>
Count:
</span>
<span>
{{ $listing.Count }}
</span>
</li>
{{- end }}
</ul>
</div>
</div>
</section>