view: better spacing for mobile

This commit is contained in:
Tigor Hutasuhut 2024-05-13 13:38:13 +07:00
parent c03955f284
commit 17cd952d83
5 changed files with 28 additions and 21 deletions

View file

@ -14,8 +14,6 @@ type sqlLogger struct{}
func (sqlLogger) Log(ctx context.Context, level sqldblogger.Level, msg string, data map[string]interface{}) {
var lvl slog.Level
msg = strings.TrimSpace(msg)
switch level {
case sqldblogger.LevelDebug, sqldblogger.LevelTrace, sqldblogger.LevelInfo:
lvl = slog.LevelDebug
@ -23,5 +21,9 @@ func (sqlLogger) Log(ctx context.Context, level sqldblogger.Level, msg string, d
lvl = slog.LevelError
}
log.New(ctx).With("sql", data).Level(lvl).Log(msg)
entry := log.New(ctx)
if entry.Accept(lvl) {
msg = strings.TrimSpace(msg)
entry.With("sql", data).Level(lvl).Log(msg)
}
}

View file

@ -101,6 +101,10 @@ func New(ctx context.Context) *Entry {
return &Entry{ctx: ctx, handler: h, time: time.Now()}
}
func (entry *Entry) Accept(lvl slog.Level) bool {
return entry.handler.Enabled(entry.ctx, lvl)
}
func (entry *Entry) Caller(caller caller.Caller) *Entry {
entry.caller = caller
return entry

View file

@ -2,7 +2,11 @@
module.exports = {
content: ["./views/**/*.templ"],
theme: {
extend: {},
extend: {
screens: {
xs: "480px",
},
},
},
plugins: [
require("daisyui"),

View file

@ -39,7 +39,7 @@ templ DetailsContent(c *views.Context, data Data) {
<div class="flex items-center justify-between">
<h1>Subreddit { data.Subreddit.Name }</h1>
</div>
<div class="flex flex-wrap justify-between content-center">
<div class="flex flex-wrap justify-center xs:justify-between content-center gap-4">
<h2 class="my-auto">
Total Images:
{ strconv.FormatInt(data.TotalImages, 10) }

View file

@ -24,7 +24,7 @@ templ SubredditContent(c *views.Context, data Data) {
<h3>No Subreddits Found</h3>
<p>Click <a class="text-primary" href="/subreddits/add">here</a> to add a new subreddit.</p>
} else {
<div class="flex justify-between flex-wrap">
<div class="flex justify-center sm:justify-between flex-wrap gap-4">
<h2 class="my-auto">{ strconv.FormatInt(data.Subreddits.Total, 10) } Subreddits Registered</h2>
<a class="btn btn-primary text-base-100 no-underline" href="/subreddits/add">Add Subreddit</a>
</div>
@ -40,31 +40,28 @@ templ SubredditContent(c *views.Context, data Data) {
}
templ SubredditCard(c *views.Context, data *models.Subreddit) {
<div class="not-prose card card-bordered bg-base-100 hover:bg-base-200 shadow-xl w-80 top-0 hover:-top-1 transition-all rounded-none">
<a
href={ templ.URL(fmt.Sprintf("/subreddits/details/%s", data.Name)) }
class="not-prose card card-bordered bg-base-100 hover:bg-base-200 shadow-xl xs:w-80 w-full max-w-full top-0 hover:-top-1 transition-all rounded-none"
>
if len(data.R.Images) > 0 {
<figure class="p-8">
<a class="flex content-center" href={ templ.URL(fmt.Sprintf("/subreddits/details/%s", data.Name)) }>
<img
class="object-contain max-w-[16rem] max-h-[16rem]"
class="object-contain xs:max-w-[16rem] max-h-[16rem]"
src={ fmt.Sprintf("/img/%s", data.R.Images[0].ThumbnailRelativePath) }
alt={ data.Name }
/>
</a>
</figure>
} else {
<figure class="p-8">
<a href={ templ.URL(fmt.Sprintf("/subreddits/details/%s", data.Name)) }>
@imagePlaceholder()
</a>
</figure>
}
<div class="card-body">
<div class="flex-1"></div>
<a href={ templ.URL(fmt.Sprintf("/subreddits/details/%s", data.Name)) }>
<p class="text-center my-4 underline text-primary">{ data.Name }</p>
</div>
</a>
</div>
</div>
}
templ imagePlaceholder() {