diff options
| author | Alan Pearce | 2024-06-19 13:51:24 +0200 |
|---|---|---|
| committer | Alan Pearce | 2024-06-19 14:10:44 +0200 |
| commit | 8002766378b1153e749297ed1d01ba221ee72b41 (patch) | |
| tree | 070039ee0b76ea576791418f72e76e95c2c5e7ab | |
| parent | 45a2e290aa2bc59deb5971255accba517500cc25 (diff) | |
| download | website-8002766378b1153e749297ed1d01ba221ee72b41.tar.lz website-8002766378b1153e749297ed1d01ba221ee72b41.tar.zst website-8002766378b1153e749297ed1d01ba221ee72b41.zip | |
style external nav menu links
| -rw-r--r-- | config.toml | 3 | ||||
| -rw-r--r-- | internal/builder/homepage.templ | 2 | ||||
| -rw-r--r-- | internal/builder/page.templ | 11 | ||||
| -rw-r--r-- | internal/config/config.go | 2 | ||||
| -rw-r--r-- | static/external-link.svg | 11 | ||||
| -rw-r--r-- | templates/style.css | 7 |
6 files changed, 33 insertions, 3 deletions
diff --git a/config.toml b/config.toml index fa26b27..769ebd8 100644 --- a/config.toml +++ b/config.toml @@ -18,6 +18,9 @@ oidc_host = "https://id.alanpearce.eu/" default-src = [ "'none'", ] + img-src = [ + "'self'", + ] form-action = [ "'none'", ] diff --git a/internal/builder/homepage.templ b/internal/builder/homepage.templ index df5bc32..848b9ed 100644 --- a/internal/builder/homepage.templ +++ b/internal/builder/homepage.templ @@ -33,7 +33,7 @@ templ homepage(config config.Config, posts []content.Post, content string) { </li> for _, link := range config.Menus["me"] { <li> - <a class="u-url" rel="me" href={ templ.SafeURL(link.URL) }>{ link.Name }</a> + <a class="u-url" rel="me" href={ templ.SafeURL(link.URL.String()) }>{ link.Name }</a> </li> } </ul> diff --git a/internal/builder/page.templ b/internal/builder/page.templ index 7b3380f..9a2be2f 100644 --- a/internal/builder/page.templ +++ b/internal/builder/page.templ @@ -20,6 +20,15 @@ func extendClasses(cs string, attrs templ.Attributes) string { } } +templ menuItem(item config.MenuItem) { + <a + href={ templ.SafeURL(item.URL.String()) } + if item.URL.IsAbs() { + target="_blank" + } + >{ item.Name }</a> +} + templ page(site config.Config, page PageSettings) { <!DOCTYPE html> <html lang={ site.DefaultLanguage }> @@ -38,7 +47,7 @@ templ page(site config.Config, page PageSettings) { </h2> <nav> for _, item := range site.Menus["main"] { - <a href={ templ.SafeURL(item.URL) }>{ item.Name }</a> + @menuItem(item) } </nav> </header> diff --git a/internal/config/config.go b/internal/config/config.go index df69bce..4477ad4 100644 --- a/internal/config/config.go +++ b/internal/config/config.go @@ -16,7 +16,7 @@ type Taxonomy struct { type MenuItem struct { Name string - URL string `toml:"url"` + URL URL `toml:"url"` } type URL struct { diff --git a/static/external-link.svg b/static/external-link.svg new file mode 100644 index 0000000..35b5805 --- /dev/null +++ b/static/external-link.svg @@ -0,0 +1,11 @@ +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20"> + <g style="stroke:rgb(35,82,124);stroke-width:1"> + <line x1="5" y1="5" x2="5" y2="14" /> + <line x1="14" y1="9" x2="14" y2="14" /> + <line x1="5" y1="14" x2="14" y2="14" /> + <line x1="5" y1="5" x2="9" y2="5" /> + <line x1="10" y1="2" x2="17" y2="2" /> + <line x1="17" y1="2" x2="17" y2="9" /> + <line x1="10" y1="9" x2="17" y2="2" style="stroke-width:1.5" /> + </g> +</svg> diff --git a/templates/style.css b/templates/style.css index 84ce1ce..89fd58f 100644 --- a/templates/style.css +++ b/templates/style.css @@ -11,6 +11,7 @@ --code-background-color: #f2f2f2; --code-color: #222; --blockquote-color: #222; + --icon-external-link: url("/external-link.svg"); } @media (prefers-color-scheme: dark) { @@ -205,3 +206,9 @@ svg.rss-icon { height: 1.5ex; width: 1.5ex; } + +a[target="_blank"]::after { + content: ""; + background: no-repeat var(--icon-external-link); + padding-right: 1em; +} |
