split oauth_tokens.claims column up; improved fonts; allow multiple sse connections per user; make navbar and use friendly
This commit is contained in:
+1
@@ -5,6 +5,7 @@
|
||||
"HXPost" (printf "/api/accounts/%d/inventory/sync-groups/draft/listings" $acctID)
|
||||
"HXTarget" "#accounts-acct-id-inventory-sync-groups-draft-table"
|
||||
"HXSwap" "outerHTML"
|
||||
"HXSelect" "#accounts-acct-id-inventory-sync-groups-draft-table"
|
||||
"ID" "sync-groups-draft-table-add-listing-button"
|
||||
"Class" "mt-[1em] mb-[1em]"
|
||||
"Text" "Add Listing"
|
||||
|
||||
+4
-1
@@ -8,7 +8,9 @@
|
||||
id="accounts-acct-id-inventory-sync-groups-draft-table"
|
||||
class="max-w-full overflow-x-auto"
|
||||
hx-get="{{ printf "/ui/accounts/%d/inventory/sync-groups/draft/table" $acctID }}"
|
||||
hx-trigger="sse:{{ printf "accounts_%d_inventory_sync-groups_draft" $acctID }}"
|
||||
hx-trigger="sse:{{ printf "accounts_%d_inventory_sync-groups_draft" $acctID }},sse:{{ printf "accounts_%d_inventory_sync-groups_draft_listings" $acctID }}"
|
||||
hx-select="#accounts-acct-id-inventory-sync-groups-draft-table"
|
||||
hx-swap="outerHTML"
|
||||
>
|
||||
<thead>
|
||||
<tr>
|
||||
@@ -30,6 +32,7 @@
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody
|
||||
hx-swap="morph"
|
||||
_="
|
||||
init
|
||||
set element allRowsFilledOut to false
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
{{/* .HXGet | .HXPost | .HXDelete, .HXTrigger, .HXTarget, .HXSwap, .HXVals, ._, .Text, .ID, .Class, .Disabled */}}
|
||||
{{/* .HXGet | .HXPost | .HXDelete, .HXTrigger, .HXTarget, .HXSelect, .HXSwap, .HXVals, ._, .Text, .ID, .Class, .Disabled */}}
|
||||
|
||||
|
||||
<button
|
||||
@@ -32,6 +32,9 @@
|
||||
{{- if .HXTarget }}
|
||||
hx-target="{{.HXTarget}}"
|
||||
{{- end }}
|
||||
{{- if .HXSelect }}
|
||||
hx-select="{{.HXSelect}}"
|
||||
{{- end }}
|
||||
{{- if .HXSwap }}
|
||||
hx-swap="{{.HXSwap}}"
|
||||
{{- end }}
|
||||
|
||||
+66
-13
@@ -13,19 +13,27 @@
|
||||
<script src="/scripts/_hyperscript.min.js.gz"></script>
|
||||
<script src="/scripts/htmx-ext-sse.js"></script>
|
||||
<script src="/scripts/htmx-ext-path-params.js"></script>
|
||||
<script src="/scripts/idiomorph-ext.js"></script>
|
||||
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/favicon/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon/favicon-16x16.png">
|
||||
<link rel="manifest" href="/favicon/site.webmanifest">
|
||||
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Geist:wght@100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Alexandria:wght@100..900&family=Geist:wght@100..900&family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap" rel="stylesheet">
|
||||
|
||||
{{/* This can be set by the template in ./pages being rendered */}}
|
||||
{{- block "head" . }}{{ end }}
|
||||
</head>
|
||||
|
||||
<body
|
||||
class="basis-full grow bg-background flex flex-col items-stretch"
|
||||
hx-ext="path-params,sse"
|
||||
hx-ext="morph,path-params,sse"
|
||||
{{/* get requests to just replace the body - until we start replacing the head, this will be good */}}
|
||||
hx-boost="true"
|
||||
|
||||
{{/* subscribe to sse (if logged in) */}}
|
||||
{{- if and .Identity .Identity.AccessToken }}
|
||||
@@ -34,12 +42,35 @@
|
||||
{{- end }}
|
||||
>
|
||||
<header>
|
||||
<nav class="flex flex-col items-center text-xl overflow-x-scroll overflow-y-hidden ">
|
||||
<nav
|
||||
class="
|
||||
w-full
|
||||
text-xl
|
||||
overflow-x-hidden
|
||||
overflow-y-hidden
|
||||
|
||||
flex
|
||||
justify-center
|
||||
"
|
||||
>
|
||||
{{- $path := or .Request.URL.Path "/" }}
|
||||
|
||||
<ul class="flex text-nowrap overflow-x-scroll overflow-y-hidden">
|
||||
<ul
|
||||
hx-swap="morph:innerHTML"
|
||||
class="
|
||||
max-w-full
|
||||
overflow-x-auto
|
||||
overflow-y-hidden
|
||||
text-nowrap
|
||||
|
||||
flex
|
||||
basis-[fit-content]
|
||||
"
|
||||
style="
|
||||
"
|
||||
>
|
||||
<li class="pt-[1em] pb-[1em]">
|
||||
<a href="/ui" class="p-[1em] font-bold {{ if eq $path "/" }}selected{{ end }}">
|
||||
<a href="/ui" class="p-[1em] font-display {{ if eq $path "/" }}selected{{ end }}">
|
||||
Home
|
||||
</a>
|
||||
</li>
|
||||
@@ -55,7 +86,7 @@
|
||||
{{- if not $userID }}
|
||||
|
||||
<li class="pt-[1em] pb-[1em]">
|
||||
<a href="/api/auth/login" class="p-[1em] font-bold {{ if eq $path "/auth/login" }}selected{{ end }}">
|
||||
<a href="/api/auth/login" hx-boost="false" class="p-[1em] font-display {{ if eq $path "/auth/login" }}selected{{ end }}">
|
||||
Log In / Sign Up
|
||||
</a>
|
||||
</li>
|
||||
@@ -63,25 +94,25 @@
|
||||
{{- else if $acctID }}
|
||||
|
||||
<li class="pt-[1em] pb-[1em]">
|
||||
<a href="/ui/accounts/{{$acctID}}" class="p-[1em] font-bold {{ if eq $path (printf "/accounts/%d" $acctID) }}selected{{ end }}">
|
||||
<a href="/ui/accounts/{{$acctID}}" class="p-[1em] font-display {{ if eq $path (printf "/accounts/%d" $acctID) }}selected{{ end }}">
|
||||
Account
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="pt-[1em] pb-[1em]">
|
||||
<a href="/ui/accounts/{{$acctID}}/inventory" class="p-[1em] font-bold {{ if eq $path (printf "/accounts/%d/inventory" $acctID) }}selected{{ end }}">
|
||||
<a href="/ui/accounts/{{$acctID}}/inventory" class="p-[1em] font-display {{ if eq $path (printf "/accounts/%d/inventory" $acctID) }}selected{{ end }}">
|
||||
Inventory
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="pt-[1em] pb-[1em]">
|
||||
<a href="/ui/accounts/{{$acctID}}/reports" class="p-[1em] font-bold {{ if eq $path (printf "/accounts/%d/reports" $acctID) }}selected{{ end }}">
|
||||
<a href="/ui/accounts/{{$acctID}}/reports" class="p-[1em] font-display {{ if eq $path (printf "/accounts/%d/reports" $acctID) }}selected{{ end }}">
|
||||
Reports
|
||||
</a>
|
||||
</li>
|
||||
|
||||
<li class="pt-[1em] pb-[1em]">
|
||||
<a href="/api/auth/logout" class="p-[1em] font-bold">
|
||||
<a href="/api/auth/logout" hx-boost="false" class="p-[1em] font-display">
|
||||
Log Out
|
||||
</a>
|
||||
</li>
|
||||
@@ -96,11 +127,33 @@
|
||||
{{- block "body" . }}{{ end }}
|
||||
</main>
|
||||
|
||||
<footer class="flex flex-col items-center">
|
||||
<address class="flex items-center">
|
||||
<a href="mailto:contact-us@inventory-plus-plus.com" class="p-[1em] font-bold">Contact Us</a>
|
||||
<a href="mailto:support@inventory-plus-plus.com" class="p-[1em] font-bold">Support</a>
|
||||
<footer class="grid grid-cols-[6rem_10fr_6rem] justify-center items-center">
|
||||
<address class="grow-1 col-2 flex justify-center">
|
||||
<a href="mailto:contact-us@inventory-plus-plus.com" class="p-[1em] font-display text-center">Contact Us</a>
|
||||
<a href="mailto:support@inventory-plus-plus.com" class="p-[1em] font-display text-center">Support</a>
|
||||
</address>
|
||||
{{- if .Identity.Claims.Picture }}
|
||||
<div
|
||||
class="
|
||||
col-3
|
||||
max-w-full
|
||||
max-h-full
|
||||
|
||||
flex
|
||||
justify-center
|
||||
items-center
|
||||
"
|
||||
>
|
||||
<img
|
||||
src="{{ .Identity.Claims.Picture }}"
|
||||
style="
|
||||
max-height: 3rem;
|
||||
border-radius: 50%;
|
||||
margin: 1rem 0;
|
||||
"
|
||||
/>
|
||||
</div>
|
||||
{{- end }}
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -4,7 +4,10 @@
|
||||
|
||||
{{- $acctID := .Identity.Account }}
|
||||
|
||||
<h1>Account: {{ $acctID.Email }}</h1>
|
||||
<section>
|
||||
<h2>Account: {{ $acctID.Email }}</h2>
|
||||
<h3>{{ .Identity.Claims.Name }}</h3>
|
||||
</section>
|
||||
|
||||
{{- $etsyUser := .Etsy.GetUserPointerByAccountID $acctID.AccountID }}
|
||||
{{- if $etsyUser }}
|
||||
|
||||
@@ -1,5 +1,12 @@
|
||||
<section class="flex justify-center max-w-full mt-[3em] mb-[3em]">
|
||||
<h1 class="bg-card max-w-full p-[2em] border-[1px] border-sidebar-border rounded-lg text-nowrap">
|
||||
<h1 class="
|
||||
min-[400px]:px-[calc(10vw-0.5em)]
|
||||
min-[400px]:py-[calc(8vw-0.5em)]
|
||||
border-[1px] border-sidebar-border rounded-lg
|
||||
bg-card
|
||||
text-nowrap
|
||||
text-center
|
||||
">
|
||||
Inventory++
|
||||
</h1>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user