* [PATCH 1/4] ui-shared: improve pageheader display on text-based browsers
2019-01-01 11:44 [PATCH 0/4] improve rendering w/o CSS reliance e
@ 2019-01-01 11:44 ` e
2019-01-01 11:44 ` [PATCH 2/4] ui-{commit,tag}: use <pre> for commit-msg e
` (4 subsequent siblings)
5 siblings, 0 replies; 8+ messages in thread
From: e @ 2019-01-01 11:44 UTC (permalink / raw)
Text-based browsers (and some GUI browsers such as dillo) display
the pageheader as:
"summaryrefslogtreecommitdiff"
This is difficult-to-read. Improve accessibility for users who
cannot run memory-hungry browsers by using whitespace instead of
relying on CSS.
---
cgit.css | 1 -
ui-shared.c | 15 ++++++++++++---
2 files changed, 12 insertions(+), 4 deletions(-)
diff --git a/cgit.css b/cgit.css
index d4aadbf..8c313e2 100644
--- a/cgit.css
+++ b/cgit.css
@@ -75,7 +75,6 @@ div#cgit table.tabs td {
}
div#cgit table.tabs td a {
- padding: 2px 0.75em;
color: #777;
font-size: 110%;
}
diff --git a/ui-shared.c b/ui-shared.c
index 7a4c726..017fe30 100644
--- a/ui-shared.c
+++ b/ui-shared.c
@@ -1029,32 +1029,41 @@ void cgit_print_pageheader(void)
html("<table class='tabs'><tr><td>\n");
if (ctx.env.authenticated && ctx.repo) {
- if (ctx.repo->readme.nr)
+ if (ctx.repo->readme.nr) {
reporevlink("about", "about", NULL,
hc("about"), ctx.qry.head, NULL,
NULL);
+ html(" ");
+ }
cgit_summary_link("summary", NULL, hc("summary"),
ctx.qry.head);
+ html(" ");
cgit_refs_link("refs", NULL, hc("refs"), ctx.qry.head,
ctx.qry.sha1, NULL);
+ html(" ");
cgit_log_link("log", NULL, hc("log"), ctx.qry.head,
NULL, ctx.qry.vpath, 0, NULL, NULL,
ctx.qry.showmsg, ctx.qry.follow);
+ html(" ");
if (ctx.qry.page && !strcmp(ctx.qry.page, "blame"))
cgit_blame_link("blame", NULL, hc("blame"), ctx.qry.head,
ctx.qry.sha1, ctx.qry.vpath);
else
cgit_tree_link("tree", NULL, hc("tree"), ctx.qry.head,
ctx.qry.sha1, ctx.qry.vpath);
+ html(" ");
cgit_commit_link("commit", NULL, hc("commit"),
ctx.qry.head, ctx.qry.sha1, ctx.qry.vpath);
+ html(" ");
cgit_diff_link("diff", NULL, hc("diff"), ctx.qry.head,
ctx.qry.sha1, ctx.qry.sha2, ctx.qry.vpath);
- if (ctx.repo->max_stats)
+ if (ctx.repo->max_stats) {
+ html(" ");
cgit_stats_link("stats", NULL, hc("stats"),
ctx.qry.head, ctx.qry.vpath);
+ }
if (ctx.repo->homepage) {
- html("<a href='");
+ html(" <a href='");
html_attr(ctx.repo->homepage);
html("'>homepage</a>");
}
--
EW
^ permalink raw reply [flat|nested] 8+ messages in thread
* [PATCH 2/4] ui-{commit,tag}: use <pre> for commit-msg
2019-01-01 11:44 [PATCH 0/4] improve rendering w/o CSS reliance e
2019-01-01 11:44 ` [PATCH 1/4] ui-shared: improve pageheader display on text-based browsers e
@ 2019-01-01 11:44 ` e
2019-01-01 11:44 ` [PATCH 3/4] ui-log: improve decoration display for browsers without CSS e
` (3 subsequent siblings)
5 siblings, 0 replies; 8+ messages in thread
From: e @ 2019-01-01 11:44 UTC (permalink / raw)
This preserves formatting readable for users of text-based browsers
without CSS support.
---
cgit.css | 5 -----
tests/t0105-commit.sh | 2 +-
ui-commit.c | 4 ++--
ui-tag.c | 4 ++--
4 files changed, 5 insertions(+), 10 deletions(-)
diff --git a/cgit.css b/cgit.css
index 8c313e2..9f70d14 100644
--- a/cgit.css
+++ b/cgit.css
@@ -436,11 +436,6 @@ div#cgit div.commit-subject {
padding: 0em;
}
-div#cgit div.commit-msg {
- white-space: pre;
- font-family: monospace;
-}
-
div#cgit div.notes-header {
font-weight: bold;
padding-top: 1.5em;
diff --git a/tests/t0105-commit.sh b/tests/t0105-commit.sh
index 9cdf55c..9e34abd 100755
--- a/tests/t0105-commit.sh
+++ b/tests/t0105-commit.sh
@@ -11,7 +11,7 @@ test_expect_success 'find commit subject' '
grep "<div class=.commit-subject.>commit 5<" tmp
'
-test_expect_success 'find commit msg' 'grep "<div class=.commit-msg.></div>" tmp'
+test_expect_success 'find commit msg' 'grep "<pre class=.commit-msg.></pre>" tmp'
test_expect_success 'find diffstat' 'grep "<table summary=.diffstat. class=.diffstat.>" tmp'
test_expect_success 'find diff summary' '
diff --git a/ui-commit.c b/ui-commit.c
index 9a47b54..1c04c87 100644
--- a/ui-commit.c
+++ b/ui-commit.c
@@ -120,11 +120,11 @@ void cgit_print_commit(char *hex, const char *prefix)
cgit_close_filter(ctx.repo->commit_filter);
show_commit_decorations(commit);
html("</div>");
- html("<div class='commit-msg'>");
+ html("<pre class='commit-msg'>");
cgit_open_filter(ctx.repo->commit_filter);
html_txt(info->msg);
cgit_close_filter(ctx.repo->commit_filter);
- html("</div>");
+ html("</pre>");
if (notes.len != 0) {
html("<div class='notes-header'>Notes</div>");
html("<div class='notes'>");
diff --git a/ui-tag.c b/ui-tag.c
index f530224..9e54d2c 100644
--- a/ui-tag.c
+++ b/ui-tag.c
@@ -25,9 +25,9 @@ static void print_tag_content(char *buf)
html_txt(buf);
html("</div>");
if (p) {
- html("<div class='commit-msg'>");
+ html("<pre class='commit-msg'>");
html_txt(++p);
- html("</div>");
+ html("</pre>");
}
}
--
EW
^ permalink raw reply [flat|nested] 8+ messages in thread
* [PATCH 3/4] ui-log: improve decoration display for browsers without CSS
2019-01-01 11:44 [PATCH 0/4] improve rendering w/o CSS reliance e
2019-01-01 11:44 ` [PATCH 1/4] ui-shared: improve pageheader display on text-based browsers e
2019-01-01 11:44 ` [PATCH 2/4] ui-{commit,tag}: use <pre> for commit-msg e
@ 2019-01-01 11:44 ` e
2019-01-01 11:44 ` [PATCH 4/4] ui-diff: preserve spaces w/o CSS on context lines e
` (2 subsequent siblings)
5 siblings, 0 replies; 8+ messages in thread
From: e @ 2019-01-01 11:44 UTC (permalink / raw)
Text-based browsers without CSS support show all the decorations
bunched together without spacing. Rely on a whitespace instead
of CSS support.
---
cgit.css | 1 -
ui-log.c | 5 +++++
2 files changed, 5 insertions(+), 1 deletion(-)
diff --git a/cgit.css b/cgit.css
index 9f70d14..6fcd984 100644
--- a/cgit.css
+++ b/cgit.css
@@ -708,7 +708,6 @@ div#cgit div.commit-subject a.tag-deco,
div#cgit div.commit-subject a.tag-annotated-deco,
div#cgit div.commit-subject a.remote-deco,
div#cgit div.commit-subject a.deco {
- margin-left: 1em;
font-size: 75%;
}
diff --git a/ui-log.c b/ui-log.c
index 3bcb657..10dc286 100644
--- a/ui-log.c
+++ b/ui-log.c
@@ -67,6 +67,7 @@ void show_commit_decorations(struct commit *commit)
while (deco) {
struct object_id peeled;
int is_annotated = 0;
+
strlcpy(buf, prettify_refname(deco->name), sizeof(buf));
switch(deco->type) {
case DECORATION_NONE:
@@ -74,11 +75,13 @@ void show_commit_decorations(struct commit *commit)
* don't display anything. */
break;
case DECORATION_REF_LOCAL:
+ html(" ");
cgit_log_link(buf, NULL, "branch-deco", buf, NULL,
ctx.qry.vpath, 0, NULL, NULL,
ctx.qry.showmsg, 0);
break;
case DECORATION_REF_TAG:
+ html(" ");
if (!peel_ref(deco->name, &peeled))
is_annotated = !oidcmp(&commit->object.oid, &peeled);
cgit_tag_link(buf, NULL, is_annotated ? "tag-annotated-deco" : "tag-deco", buf);
@@ -86,12 +89,14 @@ void show_commit_decorations(struct commit *commit)
case DECORATION_REF_REMOTE:
if (!ctx.repo->enable_remote_branches)
break;
+ html(" ");
cgit_log_link(buf, NULL, "remote-deco", NULL,
oid_to_hex(&commit->object.oid),
ctx.qry.vpath, 0, NULL, NULL,
ctx.qry.showmsg, 0);
break;
default:
+ html(" ");
cgit_commit_link(buf, NULL, "deco", ctx.qry.head,
oid_to_hex(&commit->object.oid),
ctx.qry.vpath);
--
EW
^ permalink raw reply [flat|nested] 8+ messages in thread
* [PATCH 4/4] ui-diff: preserve spaces w/o CSS on context lines
2019-01-01 11:44 [PATCH 0/4] improve rendering w/o CSS reliance e
` (2 preceding siblings ...)
2019-01-01 11:44 ` [PATCH 3/4] ui-log: improve decoration display for browsers without CSS e
@ 2019-01-01 11:44 ` e
2019-01-04 10:32 ` e
2019-01-04 22:23 ` [PATCH 5/4] ui-{tree,repolist}: improve button spacing for browsers w/o CSS e
2020-02-08 18:44 ` [PATCH 0/4] improve rendering w/o CSS reliance e
5 siblings, 1 reply; 8+ messages in thread
From: e @ 2019-01-01 11:44 UTC (permalink / raw)
We need to use a non-breaking space entity to preserve
spacing for browsers without CSS support.
---
html.c | 46 ++++++++++++++++++++++++++++++++++++++++++++++
html.h | 1 +
ui-diff.c | 5 +----
3 files changed, 48 insertions(+), 4 deletions(-)
diff --git a/html.c b/html.c
index 7f81965..138c649 100644
--- a/html.c
+++ b/html.c
@@ -156,6 +156,52 @@ ssize_t html_ntxt(const char *txt, size_t len)
return slen;
}
+ssize_t html_ntxt_pre(const char *txt, size_t len)
+{
+ const char *t = txt;
+ ssize_t slen;
+ int prev = 0;
+
+ if (len > SSIZE_MAX)
+ return -1;
+
+ slen = (ssize_t) len;
+ while (t && *t && slen--) {
+ int c = *t;
+ if (c == '<' || c == '>' || c == '&' || c == ' ' || c == '\t') {
+ html_raw(txt, t - txt);
+ if (c == '>')
+ html(">");
+ else if (c == '<')
+ html("<");
+ else if (c == '&')
+ html("&");
+ else if (c == ' ') {
+ if (!prev || prev == ' ' || prev == '\t') {
+ html(" ");
+ /* next byte can be unescaped ' ' */
+ c = 160;
+ } else {
+ html(" ");
+ }
+ } else if (c == '\t') {
+ html("    "
+ "    ");
+ /* next byte can be unescaped ' ' */
+ c = 160;
+ }
+ txt = t + 1;
+ }
+ prev = c;
+ t++;
+ }
+ if (t != txt)
+ html_raw(txt, t - txt);
+ return slen;
+}
+
+
+
void html_attrf(const char *fmt, ...)
{
va_list ap;
diff --git a/html.h b/html.h
index fa4de77..4479b8e 100644
--- a/html.h
+++ b/html.h
@@ -20,6 +20,7 @@ extern void html_attrf(const char *format,...);
extern void html_txt(const char *txt);
extern ssize_t html_ntxt(const char *txt, size_t len);
+extern ssize_t html_ntxt_pre(const char *txt, size_t len);
extern void html_attr(const char *txt);
extern void html_url_path(const char *txt);
extern void html_url_arg(const char *txt);
diff --git a/ui-diff.c b/ui-diff.c
index 70dcc91..ca19f9e 100644
--- a/ui-diff.c
+++ b/ui-diff.c
@@ -222,7 +222,6 @@ static void cgit_print_diffstat(const struct object_id *old_oid,
static void print_line(char *line, int len)
{
char *class = "ctx";
- char c = line[len-1];
if (line[0] == '+')
class = "add";
@@ -232,10 +231,8 @@ static void print_line(char *line, int len)
class = "hunk";
htmlf("<div class='%s'>", class);
- line[len-1] = '\0';
- html_txt(line);
+ html_ntxt_pre(line, len - 1);
html("</div>");
- line[len-1] = c;
}
static void header(const struct object_id *oid1, char *path1, int mode1,
--
EW
^ permalink raw reply [flat|nested] 8+ messages in thread
* [PATCH 5/4] ui-{tree,repolist}: improve button spacing for browsers w/o CSS
2019-01-01 11:44 [PATCH 0/4] improve rendering w/o CSS reliance e
` (3 preceding siblings ...)
2019-01-01 11:44 ` [PATCH 4/4] ui-diff: preserve spaces w/o CSS on context lines e
@ 2019-01-04 22:23 ` e
2020-02-08 18:44 ` [PATCH 0/4] improve rendering w/o CSS reliance e
5 siblings, 0 replies; 8+ messages in thread
From: e @ 2019-01-04 22:23 UTC (permalink / raw)
For browsers on low-end machines running browsers without CSS
support, the default tree view displayed "logplain" when it
should be "log plain". Stop relying on CSS and add a space
in between elements to improve accessibility.
---
cgit.css | 1 -
ui-repolist.c | 2 ++
ui-tree.c | 12 +++++++++---
3 files changed, 11 insertions(+), 4 deletions(-)
diff --git a/cgit.css b/cgit.css
index 6fcd984..d4f2418 100644
--- a/cgit.css
+++ b/cgit.css
@@ -575,7 +575,6 @@ div#cgit table.list td.reposection {
div#cgit a.button {
font-size: 80%;
- padding: 0em 0.5em;
}
div#cgit a.primary {
diff --git a/ui-repolist.c b/ui-repolist.c
index 41424c0..6187101 100644
--- a/ui-repolist.c
+++ b/ui-repolist.c
@@ -353,8 +353,10 @@ void cgit_print_repolist(void)
if (ctx.cfg.enable_index_links) {
html("<td>");
cgit_summary_link("summary", NULL, "button", NULL);
+ html(" ");
cgit_log_link("log", NULL, "button", NULL, NULL, NULL,
0, NULL, NULL, ctx.qry.showmsg, 0);
+ html(" ");
cgit_tree_link("tree", NULL, "button", NULL, NULL, NULL);
html("</td>");
}
diff --git a/ui-tree.c b/ui-tree.c
index df8ad82..436c2b3 100644
--- a/ui-tree.c
+++ b/ui-tree.c
@@ -245,15 +245,21 @@ static int ls_item(const struct object_id *oid, struct strbuf *base,
cgit_log_link("log", NULL, "button", ctx.qry.head,
walk_tree_ctx->curr_rev, fullpath.buf, 0, NULL, NULL,
ctx.qry.showmsg, 0);
- if (ctx.repo->max_stats)
+ if (ctx.repo->max_stats) {
+ html(" ");
cgit_stats_link("stats", NULL, "button", ctx.qry.head,
fullpath.buf);
- if (!S_ISGITLINK(mode))
+ }
+ if (!S_ISGITLINK(mode)) {
+ html(" ");
cgit_plain_link("plain", NULL, "button", ctx.qry.head,
walk_tree_ctx->curr_rev, fullpath.buf);
- if (!S_ISDIR(mode) && ctx.cfg.enable_blame)
+ }
+ if (!S_ISDIR(mode) && ctx.cfg.enable_blame) {
+ html(" ");
cgit_blame_link("blame", NULL, "button", ctx.qry.head,
walk_tree_ctx->curr_rev, fullpath.buf);
+ }
html("</td></tr>\n");
free(name);
strbuf_release(&fullpath);
--
EW
^ permalink raw reply [flat|nested] 8+ messages in thread
* [PATCH 0/4] improve rendering w/o CSS reliance
2019-01-01 11:44 [PATCH 0/4] improve rendering w/o CSS reliance e
` (4 preceding siblings ...)
2019-01-04 22:23 ` [PATCH 5/4] ui-{tree,repolist}: improve button spacing for browsers w/o CSS e
@ 2020-02-08 18:44 ` e
5 siblings, 0 replies; 8+ messages in thread
From: e @ 2020-02-08 18:44 UTC (permalink / raw)
Eric Wong <e at 80x24.org> wrote:
> Here are a few changes to improve rendering for people with
> low-end machines using text-based browsers (w3m, lynx) or
> lightweight GUI browsers such as dillo, which has incomplete CSS
> support.
Ping. Any feedback on this series? Thanks.
^ permalink raw reply [flat|nested] 8+ messages in thread