diff --git a/input.css b/input.css index 9710e26..52482f6 100644 --- a/input.css +++ b/input.css @@ -3,32 +3,34 @@ @source './static/**/*.js'; @source './template/**/*.templ'; -body { - @apply font-garamond text-gray-700; -} -input:focus { - @apply outline-none ring-0; -} - @font-face { font-family: "EB Garamond"; src: url("/static/font/EBGaramond-VariableFont_wght.woff2") format("woff2"); } -@theme { - --font-garamond: "EB Garamond", serif; +body { + font-family: "EB Garamond", serif; + @apply text-gray-700; +} + +input:focus { + @apply outline-none ring-0; +} + +button { + @apply cursor-pointer; } /* Button */ .button { - transition: all 150ms linear; + transition: all 150ms linear; @apply cursor-pointer border-2 rounded-lg border-transparent; } .button-primary:hover, .button-normal:hover { - transform: translate(-0.25rem, -0.25rem); - box-shadow: 3px 3px 3px var(--color-gray-200); + transform: translate(-0.25rem, -0.25rem); + box-shadow: 3px 3px 3px var(--color-gray-200); } .button-primary { @@ -56,3 +58,5 @@ input:focus { box-shadow: 0 0 0 2px var(--color-gray-200); } + + diff --git a/internal/template/account/account.templ b/internal/template/account/account.templ index 3a3006f..cfdb2fa 100644 --- a/internal/template/account/account.templ +++ b/internal/template/account/account.templ @@ -66,7 +66,9 @@ templ EditAccount(account *types.Account) { hx-swap="outerHTML" class="button button-neglect px-1 flex items-center gap-2" > - @svg.Cancel() + + @svg.Cancel() + Cancel diff --git a/internal/template/layout.templ b/internal/template/layout.templ index 46b776c..a215db4 100644 --- a/internal/template/layout.templ +++ b/internal/template/layout.templ @@ -1,5 +1,7 @@ package template +import "spend-sparrow/internal/template/svg" + func layoutLinkClass(isActive bool) string { common := "text-2xl p-2 text-gray-900 decoration-yellow-400 decoration-[0.25rem] hover:bg-gray-200 rounded-lg" if isActive { @@ -28,37 +30,49 @@ templ Layout(slot templ.Component, user templ.Component, loggedIn bool, path str /> + - -
- - SpendSparrow logo - -
- @user -
-
- // Content -
- if loggedIn { - - } -
- if slot != nil { - @slot + +
+
+ + + SpendSparrow logo + +
+ @user +
+
+ // Content +
+ if loggedIn { + } -
+
+ if slot != nil { + @slot + } +
+
+ +
+ + SpendSparrow logo + + +
+ @navigation(path) +
} + +templ navigation(path string) { + +} diff --git a/internal/template/svg/default.templ b/internal/template/svg/default.templ index 587dfe3..ddec57a 100644 --- a/internal/template/svg/default.templ +++ b/internal/template/svg/default.templ @@ -31,7 +31,7 @@ templ Save() { } templ Cancel() { - + } @@ -47,3 +47,13 @@ templ Info() { } + +templ Menu() { + + + + + + + +} diff --git a/internal/template/transaction/transaction.templ b/internal/template/transaction/transaction.templ index 8197799..e80fc6b 100644 --- a/internal/template/transaction/transaction.templ +++ b/internal/template/transaction/transaction.templ @@ -188,7 +188,9 @@ templ EditTransaction(transaction *types.Transaction, accounts []*types.Account, hx-swap="outerHTML" class="button button-neglect px-1 flex items-center gap-2" > - @svg.Cancel() + + @svg.Cancel() + Cancel diff --git a/internal/template/transaction_recurring/transaction_recurring.templ b/internal/template/transaction_recurring/transaction_recurring.templ index 696892f..08b5bb1 100644 --- a/internal/template/transaction_recurring/transaction_recurring.templ +++ b/internal/template/transaction_recurring/transaction_recurring.templ @@ -193,7 +193,9 @@ templ EditTransactionRecurring(transactionRecurring *types.TransactionRecurring, hx-swap="outerHTML" class="button button-neglect px-1 flex items-center gap-2" > - @svg.Cancel() + + @svg.Cancel() + Cancel diff --git a/internal/template/treasurechest/treasure_chest.templ b/internal/template/treasurechest/treasure_chest.templ index 2146dcc..5477b21 100644 --- a/internal/template/treasurechest/treasure_chest.templ +++ b/internal/template/treasurechest/treasure_chest.templ @@ -88,7 +88,9 @@ templ EditTreasureChest(treasureChest *types.TreasureChest, parents []*types.Tre hx-swap="outerHTML" class="button button-neglect px-1 flex items-center gap-2" > - @svg.Cancel() + + @svg.Cancel() + Cancel diff --git a/static/js/layout.js b/static/js/layout.js new file mode 100644 index 0000000..afa6118 --- /dev/null +++ b/static/js/layout.js @@ -0,0 +1,11 @@ + +document.addEventListener("DOMContentLoaded", () => { + menuButton.addEventListener("click", function (e) { + menu.showModal(); + }); + menuButtonClose.addEventListener("click", function (e) { + menu.close(); + }); + +}) +