Add stable markup hooks for site themes

1 file changed, 37 insertions, 14 deletions

diff --git a/source/ui-shared.c b/source/ui-shared.c
index 4417975..0f2f1e3 100644
--- a/source/ui-shared.c
+++ b/source/ui-shared.c
@@ -104,6 +104,22 @@ static void site_url(const char *page, const char *search, const char *sort, int
 	}
 }
 
+/*
+ * Write the class of a link, and mark the link as the current one for
+ * assistive technology when the class says it is the active tab or the
+ * current page of a pager.
+ */
+static void link_class(const char *class)
+{
+	if (!class)
+		return;
+	html(" class='");
+	html_attr(class);
+	html("'");
+	if (!strcmp(class, "active") || !strcmp(class, "current"))
+		html(" aria-current='page'");
+}
+
 static void site_link(const char *page, const char *name, const char *title,
 	const char *class, const char *search, const char *sort, int ofs, int always_root)
 {
@@ -113,11 +129,7 @@ static void site_link(const char *page, const char *name, const char *title,
 		html_attr(title);
 		html("'");
 	}
-	if (class) {
-		html(" class='");
-		html_attr(class);
-		html("'");
-	}
+	link_class(class);
 	html(" href='");
 	site_url(page, search, sort, ofs, always_root);
 	html("'>");
@@ -142,11 +154,7 @@ static const char *repolink(const char *title, const char *class, const char *pa
 		html_attr(title);
 		html("'");
 	}
-	if (class) {
-		html(" class='");
-		html_attr(class);
-		html("'");
-	}
+	link_class(class);
 	html(" href='");
 	if (ctx.cfg.virtual_root) {
 		html_url_path(ctx.cfg.virtual_root);
@@ -631,7 +639,7 @@ static void print_repo_tabs(void)
 
 static void print_repo_search(void)
 {
-	html("<form class='search' method='get' action='");
+	html("<form class='search' role='search' method='get' action='");
 	if (ctx.cfg.virtual_root) {
 		char *fileurl = cgit_fileurl(ctx.qry.repo, "log", ctx.qry.vpath, NULL);
 		html_url_path(fileurl);
@@ -669,7 +677,7 @@ static void print_site_search(void)
 {
 	char *currenturl = cgit_currenturl();
 
-	html("<form class='search' method='get' action='");
+	html("<form class='search' role='search' method='get' action='");
 	html_attr(currenturl);
 	html("'>\n");
 	html("<input class='txt' type='search' name='q' aria-label='Search' value='");
@@ -1703,12 +1711,27 @@ void cgit_print_pageheader(void)
 {
 	const struct object_id *pinned;
 
-	html("<div id='cgit'>\n");
+	// The root names the page and the repository so a stylesheet or script
+	// can tell them apart without reading the tabs.
+	html("<div id='cgit'");
+	if (ctx.cfg.embedded)
+		html(" class='cgit-embedded'");
+	if (ctx.qry.page) {
+		html(" data-page='");
+		html_attr(ctx.qry.page);
+		html("'");
+	}
+	if (ctx.repo) {
+		html(" data-repo='");
+		html_attr(ctx.repo->url);
+		html("'");
+	}
+	html(">\n");
 	if (!ctx.env.authenticated || ctx.cfg.enable_header)
 		print_header();
 
 	if (ctx.env.authenticated)
-		html("<nav class='tabs'>\n");
+		html("<nav class='tabs' aria-label='Pages'>\n");
 	if (ctx.env.authenticated && ctx.repo && ctx.empty_repo) {
 		// Every other tab needs a commit to render and the search form
 		// has nothing to search, so an empty repo gets summary alone.