forked from tangled.org/core
Monorepo for Tangled — https://tangled.org

appview: setup tailwind and htmx

Also gets rid of unused old templates.

+1
.gitignore
···
tmp
*.db
.bin/
+
appview/pages/static/
+10 -1
appview/pages/pages.go
···
"io"
"io/fs"
"log"
+
"net/http"
"path"
"strings"
···
"github.com/sotangled/tangled/types"
)
-
//go:embed templates/*
+
//go:embed templates/* static/*
var files embed.FS
type Pages struct {
···
func (p *Pages) RepoBlob(w io.Writer, params RepoBlobParams) error {
return p.executeRepo("repo/blob", w, params)
}
+
+
func (p *Pages) Static() http.Handler {
+
sub, err := fs.Sub(files, "static")
+
if err != nil {
+
log.Fatalf("no static dir found? that's crazy: %v", err)
+
}
+
return http.StripPrefix("/static/", http.FileServer(http.FS(sub)))
+
}
+19 -21
appview/pages/templates/layouts/base.html
···
{{ define "layouts/base" }}
-
<!doctype html>
-
<html lang="en">
-
<head>
-
<meta charset="UTF-8" />
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-
<script
-
src="https://unpkg.com/htmx.org@2.0.4"
-
integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+"
-
crossorigin="anonymous"
-
></script>
-
<title>{{block "title" .}}tangled{{end}}</title>
-
</head>
-
<body>
-
<header class="topbar">
-
{{ block "topbar" .}}
-
{{ template "layouts/topbar" . }}
-
{{end}}
-
</header>
-
<main class="content">{{block "content" .}}{{end}}</main>
-
</body>
-
</html>
+
<!doctype html>
+
<html lang="en">
+
<head>
+
<meta charset="UTF-8" />
+
<meta
+
name="viewport"
+
content="width=device-width, initial-scale=1.0"
+
/>
+
<title>{{ block "title" . }}tangled{{ end }}</title>
+
</head>
+
<body>
+
<header class="topbar">
+
{{ block "topbar" . }}
+
{{ template "layouts/topbar" . }}
+
{{ end }}
+
</header>
+
<main class="content">{{ block "content" . }}{{ end }}</main>
+
</body>
+
</html>
{{ end }}
-37
appview/pages/templates/layouts/head.html
···
-
<head>
-
<meta charset="utf-8" />
-
<meta name="viewport" content="width=device-width, initial-scale=1" />
-
<link rel="stylesheet" href="/static/style.css" type="text/css" />
-
<link rel="icon" type="image/png" size="32x32" href="/static/legit.png" />
-
<script src="https://unpkg.com/htmx.org@2.0.4"></script>
-
<meta name="htmx-config" content='{"selfRequestsOnly":false}' />
-
-
{{ if .parent }}
-
<title>
-
{{ .meta.Title }} &mdash; {{ .name }} ({{ .ref }}): {{ .parent }}/
-
</title>
-
-
{{ else if .path }}
-
<title>
-
{{ .meta.Title }} &mdash; {{ .name }} ({{ .ref }}): {{ .path }}
-
</title>
-
{{ else if .files }}
-
<title>{{ .meta.Title }} &mdash; {{ .name }} ({{ .ref }})</title>
-
{{ else if .commit }}
-
<title>{{ .meta.Title }} &mdash; {{ .name }}: {{ .commit.This }}</title>
-
{{ else if .branches }}
-
<title>{{ .meta.Title }} &mdash; {{ .name }}: refs</title>
-
{{ else if .commits }} {{ if .log }}
-
<title>{{ .meta.Title }} &mdash; {{ .name }}: log</title>
-
{{ else }}
-
<title>{{ .meta.Title }} &mdash; {{ .name }}</title>
-
{{ end }} {{ else }}
-
<title>{{ .meta.Title }}</title>
-
{{ end }} {{ if and .servername .gomod }}
-
<meta
-
name="go-import"
-
content="{{ .servername}}/{{ .name }} git https://{{ .servername }}/{{ .name }}"
-
/>
-
{{ end }}
-
<!-- other meta tags here -->
-
</head>
-13
appview/pages/templates/layouts/nav.html
···
-
{{ define "nav" }}
-
<nav>
-
<ul>
-
{{ if .name }}
-
<li><a href="/{{ .name }}">summary</a></li>
-
<li><a href="/{{ .name }}/refs">refs</a> {{ if .ref }}</li>
-
-
<li><a href="/{{ .name }}/tree/{{ .ref }}/">tree</a></li>
-
<li><a href="/{{ .name }}/log/{{ .ref }}">log</a> {{ end }}</li>
-
{{ end }}
-
</ul>
-
</nav>
-
{{ end }}
-11
appview/pages/templates/layouts/repo-header.html
···
-
{{ define "repo-header" }}
-
<header>
-
<h2>
-
<a href="/">all repos</a>
-
&mdash; {{ .displayname }} {{ if .ref }}
-
<span class="ref">@ {{ .ref }}</span>
-
{{ end }}
-
</h2>
-
<h3 class="desc">{{ .desc }}</h3>
-
</header>
-
{{ end }}
+1 -2
appview/pages/templates/layouts/repoBase.html appview/pages/templates/layouts/repobase.html
···
{{ end }}
-
{{ define "layouts/repoBase" }}
+
{{ define "layouts/repobase" }}
{{ template "layouts/base" . }}
{{ end }}
-
-5
appview/pages/templates/layouts/test.html
···
-
<p>Hello world!</p>
-
<div class="example">
-
<h1>Welcome</h1>
-
<p>This is a simple HTML example</p>
-
</div>
+35 -26
appview/pages/templates/user/login.html
···
{{ define "user/login" }}
-
<!doctype html>
-
<html lang="en">
-
<head>
-
<meta charset="UTF-8" />
-
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
-
<script
-
src="https://unpkg.com/htmx.org@2.0.4"
-
integrity="sha384-HGfztofotfshcF7+8n44JQL2oJmowVChPTg48S+jvZoztPfvwD79OC/LTtG6dMp+"
-
crossorigin="anonymous"
-
></script>
-
<title>login</title>
-
</head>
-
<body>
-
<main class="content">
-
<h1>login</h1>
-
<form method="POST" action="/login">
-
<label for="handle">handle</label>
-
<input type="text" id="handle" name="handle" required />
+
<!doctype html>
+
<html lang="en">
+
<head>
+
<meta charset="UTF-8" />
+
<meta
+
name="viewport"
+
content="width=device-width, initial-scale=1.0"
+
/>
+
<script src="/static/htmx.min.js"></script>
+
<link rel="stylesheet" href="/static/tw.css" type="text/css" />
+
<title>login</title>
+
</head>
+
<body>
+
<main class="content">
+
<h1>login</h1>
+
<form method="POST" action="/login">
+
<label for="handle">handle</label>
+
<input type="text" id="handle" name="handle" required />
-
<label for="app_password">app password</label>
-
<input type="password" id="app_password" name="app_password" required />
-
-
<button type="submit">login</button>
-
</form>
-
</main>
-
</body>
-
</html>
+
<label for="app_password">app password</label>
+
<input
+
type="password"
+
id="app_password"
+
name="app_password"
+
required
+
/>
+
<button
+
class="bg-blue-500 text-white font-bold py-2 px-4 rounded"
+
type="submit"
+
>
+
login
+
</button>
+
</form>
+
</main>
+
</body>
+
</html>
{{ end }}
+2
appview/state/state.go
···
func (s *State) StandardRouter() http.Handler {
r := chi.NewRouter()
+
r.Handle("/static/*", s.pages.Static())
+
r.Get("/", s.Timeline)
r.Get("/login", s.Login)
+1
flake.nix
···
pkgs.indigo-lexgen
pkgs.litecli
pkgs.websocat
+
pkgs.tailwindcss
];
};
});
+21
input.css
···
+
@tailwind base;
+
@tailwind components;
+
@tailwind utilities;
+
@layer base {
+
@font-face {
+
font-family: "Inter";
+
font-style: normal;
+
font-weight: 400;
+
font-display: swap;
+
}
+
h1 {
+
@apply text-2xl;
+
@apply font-sans;
+
@apply text-gray-900;
+
}
+
::selection {
+
@apply bg-green-400;
+
@apply text-gray-900;
+
@apply bg-opacity-30;
+
}
+
}
+22
tailwind.config.js
···
+
/** @type {import('tailwindcss').Config} */
+
module.exports = {
+
content: ["./appview/pages/templates/**/*.html"],
+
theme: {
+
container: {
+
padding: "2rem",
+
center: true,
+
screens: {
+
sm: "540px",
+
md: "650px",
+
lg: "900px",
+
xl: "1100px",
+
"2xl": "1300x",
+
},
+
},
+
extend: {
+
fontFamily: {
+
sans: ["Inter", "system-ui", "sans-serif", "ui-sans-serif"],
+
},
+
},
+
},
+
};