fix: wrap nav and sticky boxes

Commit `92efa80`

Eric Bower · 2026-05-16 19:39:37 -0400 EDT

parent f3f5629

fix: wrap nav and sticky boxes

5 files changed, +8, -4

M html/file.page.tmpl

M html/header.partial.tmpl

M html/log.page.tmpl

M html/tree.page.tmpl

M static/main.css

M html/file.page.tmpl

+1, -1

......@@ -5,7 +5,7 @@
{{end}}

{{define "content"}}
  <div class="box sticky flex items-center gap border-visited" style="margin: 0 !important;">
  <div class="box sticky flex items-center gap border-visited flex-wrap" style="margin: 0 !important;">
    <code>{{.RevData.Name}}</code>

    {{range .Item.Crumbs}}

......@@ -1,6 +1,6 @@
{{define "header"}}
<div class="flex flex-col">
  <nav class="flex gap">
  <nav class="flex gap flex-wrap">
    <a class="btn-nav {{if eq .ActivePage `readme`}}btn-active{{end}}" href="{{.SiteURLs.SummaryURL}}">{{.Repo.RepoName}}</a>
    <a class="btn-nav flex items-center {{if eq .ActivePage `code`}}btn-active{{end}}" href="{{.RevData.TreeURL}}">
      <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="16" width="16" viewBox="0 0 16 16" style="margin-right: 5px;">

M html/log.page.tmpl

+1, -1

......@@ -5,7 +5,7 @@

{{define "content"}}
  <div class="group-2">
    <div class="box sticky flex items-center gap border-visited" style="margin: 0 !important;">
    <div class="box sticky flex items-center gap border-visited flex-wrap" style="margin: 0 !important;">
      <code>{{.RevData.Name}}</code>
      <div>
        <span class="font-bold">{{.NumCommits}}</span> commits

M html/tree.page.tmpl

+1, -1

......@@ -4,7 +4,7 @@
{{define "meta"}}{{end}}

{{define "content"}}
  <div class="box sticky flex items-center gap border-visited">
  <div class="box sticky flex items-center gap border-visited flex-wrap">
    <code>{{.RevData.Name}}</code>

    {{range .Tree.Crumbs}}

M static/main.css

+4, -0

......@@ -161,6 +161,10 @@ footer {
  flex-direction: column;
}

.flex-wrap {
  flex-wrap: wrap;
}

.items-center {
  align-items: center;
}

...	...		@@ -161,6 +161,10 @@ footer {
161	161		flex-direction: column;
162	162		}
163	163
	164	+	.flex-wrap {
	165	+	flex-wrap: wrap;
	166	+	}
	167	+
164	168		.items-center {
165	169		align-items: center;
166	170		}

...	...		@@ -5,7 +5,7 @@
5	5		{{end}}
6	6
7	7		{{define "content"}}
8		-	<div class="box sticky flex items-center gap border-visited" style="margin: 0 !important;">
	8	+	<div class="box sticky flex items-center gap border-visited flex-wrap" style="margin: 0 !important;">
9	9		<code>{{.RevData.Name}}</code>
10	10
11	11		{{range .Item.Crumbs}}

...	...		@@ -1,6 +1,6 @@
1	1		{{define "header"}}
2	2		<div class="flex flex-col">
3		-	<nav class="flex gap">
	3	+	<nav class="flex gap flex-wrap">
4	4		<a class="btn-nav {{if eq .ActivePage `readme`}}btn-active{{end}}" href="{{.SiteURLs.SummaryURL}}">{{.Repo.RepoName}}</a>
5	5		<a class="btn-nav flex items-center {{if eq .ActivePage `code`}}btn-active{{end}}" href="{{.RevData.TreeURL}}">
6	6		<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" height="16" width="16" viewBox="0 0 16 16" style="margin-right: 5px;">

...	...		@@ -5,7 +5,7 @@
5	5
6	6		{{define "content"}}
7	7		<div class="group-2">
8		-	<div class="box sticky flex items-center gap border-visited" style="margin: 0 !important;">
	8	+	<div class="box sticky flex items-center gap border-visited flex-wrap" style="margin: 0 !important;">
9	9		<code>{{.RevData.Name}}</code>
10	10		<div>
11	11		<span class="font-bold">{{.NumCommits}}</span> commits

...	...		@@ -4,7 +4,7 @@
4	4		{{define "meta"}}{{end}}
5	5
6	6		{{define "content"}}
7		-	<div class="box sticky flex items-center gap border-visited">
	7	+	<div class="box sticky flex items-center gap border-visited flex-wrap">
8	8		<code>{{.RevData.Name}}</code>
9	9
10	10		{{range .Tree.Crumbs}}

Commit 92efa80

Commit `92efa80`