navigation: added theme select support
This commit is contained in:
parent
2f66122be1
commit
33c1b0dd17
5
Makefile
5
Makefile
|
|
@ -47,6 +47,11 @@ build-dependencies:
|
|||
echo "Dayjs Relative Time not found, installing it"
|
||||
curl -o public/dayjs-relativeTime-1.11.10.min.js https://cdnjs.cloudflare.com/ajax/libs/dayjs/1.11.10/plugin/relativeTime.min.js
|
||||
fi
|
||||
@if [ ! -f "public/theme-change-2.0.2.min.js" ]; then
|
||||
mkdir -p public
|
||||
echo "Theme change not found, installing it"
|
||||
curl -o public/theme-change-2.0.2.min.js https://cdn.jsdelivr.net/npm/theme-change@2.0.2/index.js
|
||||
fi
|
||||
|
||||
build: build-dependencies prepare
|
||||
go build -o redmage
|
||||
|
|
|
|||
|
|
@ -1,32 +0,0 @@
|
|||
package api
|
||||
|
||||
import (
|
||||
"context"
|
||||
"time"
|
||||
)
|
||||
|
||||
type noTimeoutContext struct {
|
||||
inner context.Context
|
||||
}
|
||||
|
||||
func (no noTimeoutContext) Deadline() (deadline time.Time, ok bool) {
|
||||
return time.Time{}, false
|
||||
}
|
||||
|
||||
func (no noTimeoutContext) Done() <-chan struct{} {
|
||||
return nil
|
||||
}
|
||||
|
||||
func (no noTimeoutContext) Err() error {
|
||||
return nil
|
||||
}
|
||||
|
||||
func (no noTimeoutContext) Value(key any) any {
|
||||
return no.inner.Value(key)
|
||||
}
|
||||
|
||||
func noCancelContext(ctx context.Context) context.Context {
|
||||
return noTimeoutContext{
|
||||
inner: ctx,
|
||||
}
|
||||
}
|
||||
|
|
@ -65,14 +65,6 @@ func (reddit *Reddit) CheckSubreddit(ctx context.Context, params CheckSubredditP
|
|||
"response.location", resp.Request.URL.String(),
|
||||
).Code(http.StatusTooManyRequests)
|
||||
}
|
||||
if resp.StatusCode >= 400 {
|
||||
msg := fmt.Sprintf("unexpected %d status code from reddit", resp.StatusCode)
|
||||
return actual, errs.Fail(msg,
|
||||
"params", params,
|
||||
"url", url,
|
||||
"response.location", resp.Request.URL.String(),
|
||||
).Code(http.StatusFailedDependency)
|
||||
}
|
||||
|
||||
if resp.Request.URL.Path == "/subreddits/search.json" {
|
||||
return actual, errs.Fail("subreddit not found",
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ package components
|
|||
|
||||
templ Doctype() {
|
||||
<!DOCTYPE html>
|
||||
<html data-theme="cupcake">
|
||||
<html data-theme="light">
|
||||
{ children... }
|
||||
</html>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -13,6 +13,7 @@ templ Head(vc *views.Context, extras ...templ.Component) {
|
|||
<script src="/public/dayjs-1.11.10.min.js"></script>
|
||||
<script src="/public/dayjs-relativeTime-1.11.10.min.js"></script>
|
||||
<script>dayjs.extend(window.dayjs_plugin_relativeTime)</script>
|
||||
<script src="/public/theme-change-2.0.2.min.js"></script>
|
||||
if vc.Config.Bool("http.hotreload") {
|
||||
<script src="/public/hot_reload.js"></script>
|
||||
}
|
||||
|
|
@ -25,4 +26,3 @@ templ Head(vc *views.Context, extras ...templ.Component) {
|
|||
templ HeadTitle(name string) {
|
||||
<title>{ name }</title>
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -9,7 +9,7 @@ templ Navigation(c *views.Context) {
|
|||
<div class="drawer-content">
|
||||
<header class="navbar bg-base-200 lg:hidden">
|
||||
<div class="flex-none">
|
||||
<label for="drawer-toggle" class="btn btn-square btn-ghost drawer-button" onclick="console.log(this)">
|
||||
<label for="drawer-toggle" class="btn btn-square btn-ghost drawer-button">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" class="inline-block w-5 h-5 stroke-current"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"></path></svg>
|
||||
</label>
|
||||
</div>
|
||||
|
|
@ -80,27 +80,47 @@ templ navLogo() {
|
|||
}
|
||||
|
||||
templ Navbar(c *views.Context) {
|
||||
<header class="hidden lg:inline-block bg-base-200 min-w-[200px] w-[15vw] max-w-[300px] min-h-screen">
|
||||
<div class="flex flex-col items-center min-w-[180px] max-w-[280px] mx-auto">
|
||||
@navLogo()
|
||||
<span class="font-bold">Redmage</span>
|
||||
<header class="hidden lg:inline-block bg-base-200 min-w-[200px] w-[15vw] max-w-[300px]">
|
||||
<div class="sticky top-0 flex flex-col min-h-screen">
|
||||
<div class="flex flex-col items-center min-w-[180px] max-w-[280px] mx-auto">
|
||||
@navLogo()
|
||||
<span class="font-bold">Redmage</span>
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
<nav class="pt-4" hx-boost="true">
|
||||
<ul class="flex flex-col flex-wrap">
|
||||
<a href="/" class={ classForNavItem(c, "/") }>
|
||||
<li class="hover:bg-accent hover:text-neutral-50 py-2 text-center hover:font-bold">Home</li>
|
||||
</a>
|
||||
<a href="/about" class={ classForNavItem(c, "/about") }>
|
||||
<li class="hover:bg-accent hover:text-neutral-50 py-2 text-center hover:font-bold">About</li>
|
||||
</a>
|
||||
<a href="/config" class={ classForNavItem(c, "/config") }>
|
||||
<li class="hover:bg-accent hover:text-neutral-50 py-2 text-center hover:font-bold">Config</li>
|
||||
</a>
|
||||
<a href="/browse" class={ classForNavItem(c, "/browse") }>
|
||||
<li class="hover:bg-accent hover:text-neutral-50 py-2 text-center hover:font-bold">Browse</li>
|
||||
</a>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="flex-grow"></div>
|
||||
@SelectThemeInput()
|
||||
</div>
|
||||
<div class="divider"></div>
|
||||
<nav class="pt-4" hx-boost="true">
|
||||
<ul class="flex flex-col flex-wrap">
|
||||
<a href="/" class={ classForNavItem(c, "/") }>
|
||||
<li class="hover:bg-accent hover:text-neutral-50 py-2 text-center hover:font-bold">Home</li>
|
||||
</a>
|
||||
<a href="/about" class={ classForNavItem(c, "/about") }>
|
||||
<li class="hover:bg-accent hover:text-neutral-50 py-2 text-center hover:font-bold">About</li>
|
||||
</a>
|
||||
<a href="/config" class={ classForNavItem(c, "/config") }>
|
||||
<li class="hover:bg-accent hover:text-neutral-50 py-2 text-center hover:font-bold">Config</li>
|
||||
</a>
|
||||
<a href="/browse" class={ classForNavItem(c, "/browse") }>
|
||||
<li class="hover:bg-accent hover:text-neutral-50 py-2 text-center hover:font-bold">Browse</li>
|
||||
</a>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
}
|
||||
|
||||
templ SelectThemeInput() {
|
||||
<select class="select select-ghost select-bordered w-full" data-choose-theme>
|
||||
<option value="light">Light (Default)</option>
|
||||
<option value="dark">Dark</option>
|
||||
<option value="cupcake">Cupcake</option>
|
||||
<option value="bumblebee">Bumblebee</option>
|
||||
<option value="emerald">Emerald</option>
|
||||
<option value="corporate">Corporate</option>
|
||||
<option value="synthwave">Synthwave</option>
|
||||
<option value="retru">Retro</option>
|
||||
<option value="cyberpunk">Cyberpunk</option>
|
||||
<option value="valentine">Valentine</option>
|
||||
<option value="halloween">Halloween</option>
|
||||
</select>
|
||||
}
|
||||
|
|
|
|||
|
|
@ -35,10 +35,10 @@ templ RecentlyAddedImageCard(data *models.Image, opts ImageCardOption) {
|
|||
if !opts.Has(HideTitle) {
|
||||
<a
|
||||
href={ templ.URL(data.PostURL) }
|
||||
class="card-title font-bold underline text-base text-primary-content"
|
||||
class="card-title font-bold underline text-base text-primary"
|
||||
>{ data.Title }</a>
|
||||
}
|
||||
<a class="text-primary-content underline" href={ templ.URL(data.PosterURL) }>{ data.Poster }</a>
|
||||
<a class="text-primary underline" href={ templ.URL(data.PosterURL) }>{ data.Poster }</a>
|
||||
<div>
|
||||
@utils.RelativeTimeNode(fmt.Sprintf("relative-time-%s", data.PostName), data.CreatedAt)
|
||||
</div>
|
||||
|
|
@ -46,7 +46,7 @@ templ RecentlyAddedImageCard(data *models.Image, opts ImageCardOption) {
|
|||
if data.R.Subreddit != nil {
|
||||
if !opts.Has(HideSubreddit) {
|
||||
<a
|
||||
class="badge badge-outline"
|
||||
class="badge badge-outline badge-primary"
|
||||
href={ templ.URL(fmt.Sprintf("https://reddit.com/%s/%s", reddit.SubredditType(data.R.Subreddit.Subtype), data.R.Subreddit.Name)) }
|
||||
>{ data.R.Subreddit.Name } </a>
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in a new issue