Change the cgit layout This modifies and hopefully improves the layout of all cgit pages: * Remove the header from all pages and replace it with a sidebar; most pages have sufficient width but many needs more height. * Add a dropdown-box to switch between branches, using a one-liner javascript to reload the current page in context of the selected branch. * Include refs found below refs/archives in the sidebar, appearing as a set of menuitems below a 'download' heading. * Include the brand new cgit logo Signed-off-by: Lars Hjemli <hjemli@gmail.com>
Lars Hjemli hjemli@gmail.com
Tue, 30 Oct 2007 10:47:38 +0100
7 files changed,
231 insertions(+),
197 deletions(-)
M
cgit.css
→
cgit.css
@@ -1,13 +1,14 @@
-body { - font-family: arial, sans-serif; - font-size: 11pt; - color: black; - background: white; -} - body, table { padding: 0em; margin: 0em; +} + +body { + font-family: sans; + font-size: 10pt; + color: #333; + background: white; + padding-left: 4px; } table {@@ -35,12 +36,13 @@ font-weight: bold;
} a { - color: blue; + color: #600; text-decoration: none; } a:hover { - text-decoration: underline; + background-color: #ddd; + text-decoration: none; } table.list {@@ -53,7 +55,7 @@ background: white;
} table.list tr:hover { - background: #eee; + background: #f8f8f8; } table.list tr.nohover:hover {@@ -76,98 +78,78 @@ img {
border: none; } -table#layout { - width: 100%; - border-collapse: collapse; - margin: 0px; +div#sidebar { + vertical-align: top; + width: 162px; + padding: 0px 0px 0px 0px; + margin: 4px; + float: left; } -td#header, td#logo { - color: #666; - background-color: #ddd; - border-bottom: solid 1px #000; +div#logo { + margin: 0px; + padding: 4px 0px 4px 0px; + text-align: center; + background-color: #ccc; + border-top: solid 1px #eee; + border-left: solid 1px #eee; + border-right: solid 1px #aaa; + border-bottom: solid 1px #aaa; } -td#header { - font-size: 150%; - font-weight: bold; - padding: 0.2em 0.5em; - vertical-align: text-bottom; +div#sidebar div.infobox { + margin: 0px 0px 0pax 0px; + padding: 0.5em; + text-align: left; + background-color: #ccc; + border-top: solid 1px #eee; + border-left: solid 1px #eee; + border-right: solid 1px #aaa; + border-bottom: solid 1px #aaa; } -td#header a { - color: #666; -} - -td#header a:hover { - text-decoration: underline; -} - -td#logo { - text-align: right; - vertical-align: middle; - padding-right: 0.5em; -} - -td#crumb, td#search { - color: #ccc; - border-top: solid 3px #555; - background-color: #666; - border-bottom: solid 1px #333; - padding: 2px 1em; -} - -td#crumb { +div#sidebar div.infobox h1 { + font-size: 11pt; font-weight: bold; + margin: 0px; } -td#crumb a { - color: #ccc; - background-color: #666; - padding: 0em 0.5em 0em 0.5em; -} - -td#crumb a:hover { - color: #666; +div#sidebar div.infobox a.menu { + display: block; background-color: #ccc; + padding: 0.1em 0.5em; text-decoration: none; } -td#search { - text-align: right; - vertical-align: middle; - padding-right: 0.5em; -} - -td#search form { - margin: 0px; - padding: 0px; +div#sidebar div.infobox a.menu:hover { + background-color: #bbb; + text-decoration: none; } -td#search select { - font-size: 9pt; +div#sidebar div.infobox select { + width: 100%; + border: solid 1px #aaa; + background-color: #bbb; + margin: 2px 0px 0px 0px; padding: 0px; - border: solid 1px #333; - color: #333; - background-color: #fff; } -td#search input { - font-size: 9pt; - padding: 0px; +div#sidebar div.infobox input.txt { + width: 100%; + border: solid 1px #aaa; + background-color: #bbb; + margin: 2px 0px 0px 0px; + padding: 0; } -td#search input.txt { - width: 8em; - border: solid 1px #333; - color: #333; - background-color: #fff; +table#grid { + margin: 0px; } -td#search input.btn { - border: solid 1px #333; - color: #333; - background-color: #ccc; +td#content { + vertical-align: top; + padding: 1em 2em 1em 1em; + border: none; } div#summary {@@ -185,10 +167,6 @@ }
table#downloads th { background-color: #ccc; -} - -td#content { - padding: 1em 0.5em; } div#blob {@@ -284,7 +262,6 @@ }
table.diffstat { border-collapse: collapse; - width: 100%; border: solid 1px #aaa; background-color: #eee; }@@ -325,7 +302,7 @@ color: blue;
} table.diffstat td.graph { - width: 75%; + width: 500px; vertical-align: middle; }
M
cgit.h
→
cgit.h
@@ -181,6 +181,8 @@ extern int chk_non_negative(int result, char *msg);
extern int hextoint(char c); extern char *trim_end(const char *str, char c); +extern char *strlpart(char *txt, int maxlen); +extern char *strrpart(char *txt, int maxlen); extern void cgit_add_ref(struct reflist *list, struct refinfo *ref); extern int cgit_refs_cb(const char *refname, const unsigned char *sha1,
A
cgit.png
M
cgitrc
→
cgitrc
@@ -85,8 +85,13 @@ ## Set the title printed on the root page
#root-title=Git repository browser -## If specified, the file at this path will be included as HTML in the index -## of repositories +## If specified, the file at this path will be included as HTML in the +## sidebar on the repository index page +#index-info= + + +## If specified, the file at this path will be included as HTML above +## the repository index #index-header=
M
ui-summary.c
→
ui-summary.c
@@ -120,47 +120,6 @@ }
return 0; } -static int cgit_print_archive_cb(const char *refname, const unsigned char *sha1, - int flags, void *cb_data) -{ - struct tag *tag; - struct taginfo *info; - struct object *obj; - char buf[256], *url; - unsigned char fileid[20]; - - if (prefixcmp(refname, "refs/archives")) - return 0; - strncpy(buf, refname+14, sizeof(buf)); - obj = parse_object(sha1); - if (!obj) - return 1; - if (obj->type == OBJ_TAG) { - tag = lookup_tag(sha1); - if (!tag || parse_tag(tag) || !(info = cgit_parse_tag(tag))) - return 0; - hashcpy(fileid, tag->tagged->sha1); - } else if (obj->type != OBJ_BLOB) { - return 0; - } else { - hashcpy(fileid, sha1); - } - if (!header) { - html("<table id='downloads'>"); - html("<tr><th>Downloads</th></tr>"); - header = 1; - } - html("<tr><td>"); - url = cgit_pageurl(cgit_query_repo, "blob", - fmt("id=%s&path=%s", sha1_to_hex(fileid), - buf)); - html_link_open(url, NULL, NULL); - html_txt(buf); - html_link_close(); - html("</td></tr>"); - return 0; -} - static void print_refs_link(char *path) { html("<tr class='nohover'><td colspan='4'>");@@ -221,28 +180,16 @@ if (maxcount < list.count)
print_refs_link("tags"); } -static void cgit_print_archives() -{ - header = 0; - for_each_ref(cgit_print_archive_cb, NULL); - if (header) - html("</table>"); -} - void cgit_print_summary() { - html("<div id='summary'>"); - cgit_print_archives(); - html("<h2>"); - html_txt(cgit_repo->name); - html(" - "); - html_txt(cgit_repo->desc); - html("</h2>"); - if (cgit_repo->readme) + if (cgit_repo->readme) { + html("<div id='summary'>"); html_include(cgit_repo->readme); - html("</div>"); + html("</div>"); + } if (cgit_summary_log > 0) - cgit_print_log(cgit_query_head, 0, cgit_summary_log, NULL, NULL, NULL, 0); + cgit_print_log(cgit_query_head, 0, cgit_summary_log, NULL, + NULL, NULL, 0); html("<table class='list nowrap'>"); if (cgit_summary_log > 0) html("<tr class='nohover'><td colspan='4'> </td></tr>");