ctown/podstalk
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix blank episode form: move all CSS to external static files
Build and Deploy / build-and-deploy (push) Successful in 47s
Details

Browse Source 
- Go html/template rejects <style> blocks and inline style attributes
  when template expressions are present in URL/CSS contexts
- Move all inline CSS to static/auth.css, static/episode.css,
  static/dashboard.css
- Serve static files from embedded FS via /static/ handler
- Fix missing </div> in episode form audio file group
This commit is contained in:
James Brechtel
2026-07-08 13:12:43 -04:00
parent 9c24b30262
commit c3d1adddc2
10 changed files with 48 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
main.go
+5
View File
@@ -15,6 +15,9 @@ import (
//go:embed template/*.html
var templateFS embed.FS
//go:embed static/*
var staticFS embed.FS
func main() {
dbPath := os.Getenv("PODSTALK_DB")
if dbPath == "" {
@@ -81,6 +84,8 @@ func main() {
// Public uploaded files.
http.HandleFunc("/uploads/", epH.ServeUpload)
// Static files.
http.Handle("/static/", http.FileServer(http.FS(staticFS)))
port := envOrDefault("PORT", "8080")
addr := fmt.Sprintf(":%s", port)
podstalk
BIN
View File
Binary file not shown.
podstalk.db
BIN
View File
Binary file not shown.
static/auth.css
+7
View File
@@ -0,0 +1,7 @@
body { max-width: 960px; margin: 0 auto; padding: 2rem 1rem; }
.container { margin-top: 2rem; }
.flash { padding: 0.75rem 1rem; margin-bottom: 1rem; border: 2px solid #000; }
.flash-error { background: #ffcdd2; }
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; margin-bottom: 0.25rem; font-weight: bold; }
.form-actions { display: flex; gap: 0.5rem; margin-top: 1.5rem; }
static/dashboard.css
+20
View File
@@ -0,0 +1,20 @@
body { max-width: 960px; margin: 0 auto; padding: 2rem 1rem; }
.container { margin-top: 2rem; }
.flash { padding: 0.75rem 1rem; margin-bottom: 1rem; border: 2px solid #000; }
.flash-error { background: #ffcdd2; }
.flash-success { background: #c8e6c9; }
.hidden { display: none; }
.episode-actions { display: flex; gap: 0.5rem; }
.settings-section { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 2px solid #ddd; }
.settings-form { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.settings-form .form-group { margin-bottom: 0; }
.file-upload { position: relative; display: inline-block; }
.file-upload input[type="file"] { position: absolute; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.file-name { margin-left: 0.5rem; font-size: 0.85rem; color: #666; }
.form-flex-1 { flex: 1; min-width: 200px; }
.form-flex-slug { flex: 1; min-width: 160px; }
.podcast-img-preview { margin-top: 1rem; }
.podcast-img-preview img { max-width: 150px; max-height: 150px; border: 2px solid #000; }
.rss-card { margin-bottom: 1.5rem; }
.new-ep-row { margin-bottom: 1.5rem; }
.ep-thumb { max-width: 48px; max-height: 48px; border: 1px solid #000; }
static/episode.css
+11
View File
@@ -0,0 +1,11 @@
body { max-width: 960px; margin: 0 auto; padding: 2rem 1rem; }
.container { margin-top: 2rem; }
.flash { padding: 0.75rem 1rem; margin-bottom: 1rem; border: 2px solid #000; }
.flash-error { background: #ffcdd2; }
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; margin-bottom: 0.25rem; font-weight: bold; }
.form-actions { display: flex; gap: 0.5rem; margin-top: 1.5rem; }
.current-file { font-size: 0.85rem; color: #666; margin-top: 0.25rem; }
.file-upload { position: relative; display: inline-block; }
.file-upload input[type="file"] { position: absolute; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.file-name { margin-left: 0.5rem; font-size: 0.85rem; color: #666; }
template/dashboard.html
+1 -22
View File
@@ -5,28 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Podstalk — Dashboard</title>
<link rel="stylesheet" href="https://unpkg.com/neobrutalismcss@latest" />
<style>
body { max-width: 960px; margin: 0 auto; padding: 2rem 1rem; }
.container { margin-top: 2rem; }
.flash { padding: 0.75rem 1rem; margin-bottom: 1rem; border: 2px solid #000; }
.flash-error { background: #ffcdd2; }
.flash-success { background: #c8e6c9; }
.hidden { display: none; }
.episode-actions { display: flex; gap: 0.5rem; }
.settings-section { margin-bottom: 2rem; padding-bottom: 1.5rem; border-bottom: 2px solid #ddd; }
.settings-form { display: flex; gap: 1rem; align-items: flex-end; flex-wrap: wrap; }
.settings-form .form-group { margin-bottom: 0; }
.file-upload { position: relative; display: inline-block; }
.file-upload input[type="file"] { position: absolute; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.file-name { margin-left: 0.5rem; font-size: 0.85rem; color: #666; }
.form-flex-1 { flex: 1; min-width: 200px; }
.form-flex-slug { flex: 1; min-width: 160px; }
.podcast-img-preview { margin-top: 1rem; }
.podcast-img-preview img { max-width: 150px; max-height: 150px; border: 2px solid #000; }
.rss-card { margin-bottom: 1.5rem; }
.new-ep-row { margin-bottom: 1.5rem; }
.ep-thumb { max-width: 48px; max-height: 48px; border: 1px solid #000; }
</style>
<link rel="stylesheet" href="/static/dashboard.css" />
</head>
<body>
<nav class="nb-navbar" role="navigation" aria-label="Main navigation">
template/episode_form.html
+2 -12
View File
@@ -5,18 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Podstalk — {{if .Editing}}Edit Episode{{else}}New Episode{{end}}</title>
<link rel="stylesheet" href="https://unpkg.com/neobrutalismcss@latest" />
<style>
body { max-width: 960px; margin: 0 auto; padding: 2rem 1rem; }
.container { margin-top: 2rem; }
.flash { padding: 0.75rem 1rem; margin-bottom: 1rem; border: 2px solid #000; }
.flash-error { background: #ffcdd2; }
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; margin-bottom: 0.25rem; font-weight: bold; }
.form-actions { display: flex; gap: 0.5rem; margin-top: 1.5rem; }
.current-file { font-size: 0.85rem; color: #666; margin-top: 0.25rem; }
.file-upload { position: relative; display: inline-block; }
.file-upload input[type="file"] { position: absolute; opacity: 0; width: 100%; height: 100%; cursor: pointer; }
.file-name { margin-left: 0.5rem; font-size: 0.85rem; color: #666; }
<link rel="stylesheet" href="/static/episode.css" />
</head>
<body>
<nav class="nb-navbar" role="navigation" aria-label="Main navigation">
@@ -57,6 +46,7 @@
{{if .Episode.AudioPath}}Current: {{.Episode.AudioPath}}{{else}}No audio file uploaded.{{end}}
</div>
{{end}}
</div>
<div class="nb-form-group">
<label for="image_file">Episode Image (optional)</label>
<div class="file-upload">
template/signin.html
+1 -9
View File
@@ -5,15 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Podstalk — Sign In</title>
<link rel="stylesheet" href="https://unpkg.com/neobrutalismcss@latest" />
<style>
body { max-width: 960px; margin: 0 auto; padding: 2rem 1rem; }
.container { margin-top: 2rem; }
.flash { padding: 0.75rem 1rem; margin-bottom: 1rem; border: 2px solid #000; }
.flash-error { background: #ffcdd2; }
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; margin-bottom: 0.25rem; font-weight: bold; }
.form-actions { display: flex; gap: 0.5rem; margin-top: 1.5rem; }
</style>
<link rel="stylesheet" href="/static/auth.css" />
</head>
<body>
<nav class="nb-navbar" role="navigation" aria-label="Main navigation">
template/signup.html
+1 -9
View File
@@ -5,15 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Podstalk — Sign Up</title>
<link rel="stylesheet" href="https://unpkg.com/neobrutalismcss@latest" />
<style>
body { max-width: 960px; margin: 0 auto; padding: 2rem 1rem; }
.container { margin-top: 2rem; }
.flash { padding: 0.75rem 1rem; margin-bottom: 1rem; border: 2px solid #000; }
.flash-error { background: #ffcdd2; }
.form-group { margin-bottom: 1rem; }
.form-group label { display: block; margin-bottom: 0.25rem; font-weight: bold; }
.form-actions { display: flex; gap: 0.5rem; margin-top: 1.5rem; }
</style>
<link rel="stylesheet" href="/static/auth.css" />
</head>
<body>
<nav class="nb-navbar" role="navigation" aria-label="Main navigation">