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>
This commit is contained in:
Lars Hjemli
parent
10ac7ad1f3
commit
0c8e184e9c
169
cgit.css
169
cgit.css
@ -1,15 +1,16 @@
|
||||
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 {
|
||||
border-collapse: collapse;
|
||||
}
|
||||
@ -35,12 +36,13 @@ h4 {
|
||||
}
|
||||
|
||||
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 @@ table.list tr {
|
||||
}
|
||||
|
||||
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;
|
||||
div#sidebar {
|
||||
vertical-align: top;
|
||||
width: 162px;
|
||||
padding: 0px 0px 0px 0px;
|
||||
margin: 4px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
div#sidebar div.infobox h1 {
|
||||
font-size: 11pt;
|
||||
font-weight: bold;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
td#header, td#logo {
|
||||
color: #666;
|
||||
background-color: #ddd;
|
||||
border-bottom: solid 1px #000;
|
||||
}
|
||||
|
||||
td#header {
|
||||
font-size: 150%;
|
||||
font-weight: bold;
|
||||
padding: 0.2em 0.5em;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
|
||||
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 {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
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;
|
||||
div#sidebar div.infobox a.menu:hover {
|
||||
background-color: #bbb;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
td#search form {
|
||||
div#sidebar div.infobox select {
|
||||
width: 100%;
|
||||
border: solid 1px #aaa;
|
||||
background-color: #bbb;
|
||||
margin: 2px 0px 0px 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
div#sidebar div.infobox input.txt {
|
||||
width: 100%;
|
||||
border: solid 1px #aaa;
|
||||
background-color: #bbb;
|
||||
margin: 2px 0px 0px 0px;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
table#grid {
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
td#search select {
|
||||
font-size: 9pt;
|
||||
padding: 0px;
|
||||
border: solid 1px #333;
|
||||
color: #333;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
td#search input {
|
||||
font-size: 9pt;
|
||||
padding: 0px;
|
||||
}
|
||||
|
||||
td#search input.txt {
|
||||
width: 8em;
|
||||
border: solid 1px #333;
|
||||
color: #333;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
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 {
|
||||
@ -187,10 +169,6 @@ table#downloads th {
|
||||
background-color: #ccc;
|
||||
}
|
||||
|
||||
td#content {
|
||||
padding: 1em 0.5em;
|
||||
}
|
||||
|
||||
div#blob {
|
||||
border: solid 1px black;
|
||||
}
|
||||
@ -284,7 +262,6 @@ div.diffstat-header {
|
||||
|
||||
table.diffstat {
|
||||
border-collapse: collapse;
|
||||
width: 100%;
|
||||
border: solid 1px #aaa;
|
||||
background-color: #eee;
|
||||
}
|
||||
@ -325,7 +302,7 @@ table.diffstat td.upd a {
|
||||
}
|
||||
|
||||
table.diffstat td.graph {
|
||||
width: 75%;
|
||||
width: 500px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
|
||||
2
cgit.h
2
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,
|
||||
|
||||
9
cgitrc
9
cgitrc
@ -85,8 +85,13 @@
|
||||
#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=
|
||||
|
||||
|
||||
|
||||
31
shared.c
31
shared.c
@ -303,6 +303,37 @@ char *trim_end(const char *str, char c)
|
||||
return s;
|
||||
}
|
||||
|
||||
char *strlpart(char *txt, int maxlen)
|
||||
{
|
||||
char *result;
|
||||
|
||||
if (!txt)
|
||||
return txt;
|
||||
|
||||
if (strlen(txt) <= maxlen)
|
||||
return txt;
|
||||
result = xmalloc(maxlen + 1);
|
||||
memcpy(result, txt, maxlen - 3);
|
||||
result[maxlen-1] = result[maxlen-2] = result[maxlen-3] = '.';
|
||||
result[maxlen] = '\0';
|
||||
return result;
|
||||
}
|
||||
|
||||
char *strrpart(char *txt, int maxlen)
|
||||
{
|
||||
char *result;
|
||||
|
||||
if (!txt)
|
||||
return txt;
|
||||
|
||||
if (strlen(txt) <= maxlen)
|
||||
return txt;
|
||||
result = xmalloc(maxlen + 1);
|
||||
memcpy(result + 3, txt + strlen(txt) - maxlen + 4, maxlen - 3);
|
||||
result[0] = result[1] = result[2] = '.';
|
||||
return result;
|
||||
}
|
||||
|
||||
void cgit_add_ref(struct reflist *list, struct refinfo *ref)
|
||||
{
|
||||
size_t size;
|
||||
|
||||
172
ui-shared.c
172
ui-shared.c
@ -362,77 +362,149 @@ void cgit_print_docstart(char *title, struct cacheitem *item)
|
||||
|
||||
void cgit_print_docend()
|
||||
{
|
||||
html("</td></tr></table>");
|
||||
html("</body>\n</html>\n");
|
||||
html("</td>\n</tr>\n<table>\n</body>\n</html>\n");
|
||||
}
|
||||
|
||||
int print_branch_option(const char *refname, const unsigned char *sha1,
|
||||
int flags, void *cb_data)
|
||||
{
|
||||
char *name = (char *)refname;
|
||||
html_option(name, name, cgit_query_head);
|
||||
return 0;
|
||||
}
|
||||
|
||||
int print_archive_ref(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];
|
||||
int *header = (int *)cb_data;
|
||||
|
||||
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("<p><h1>download</h1>");
|
||||
*header = 1;
|
||||
}
|
||||
url = cgit_pageurl(cgit_query_repo, "blob",
|
||||
fmt("id=%s&path=%s", sha1_to_hex(fileid),
|
||||
buf));
|
||||
html_link_open(url, NULL, "menu");
|
||||
html_txt(strlpart(buf, 20));
|
||||
html_link_close();
|
||||
return 0;
|
||||
}
|
||||
|
||||
void add_hidden_formfields(int incl_head, int incl_search)
|
||||
{
|
||||
if (!cgit_virtual_root) {
|
||||
if (cgit_query_repo)
|
||||
html_hidden("r", cgit_query_repo);
|
||||
if (cgit_query_page)
|
||||
html_hidden("p", cgit_query_page);
|
||||
}
|
||||
|
||||
if (incl_head && strcmp(cgit_query_head, cgit_repo->defbranch))
|
||||
html_hidden("h", cgit_query_head);
|
||||
|
||||
if (cgit_query_sha1)
|
||||
html_hidden("id", cgit_query_sha1);
|
||||
if (cgit_query_sha2)
|
||||
html_hidden("id2", cgit_query_sha2);
|
||||
|
||||
if (incl_search) {
|
||||
if (cgit_query_grep)
|
||||
html_hidden("qt", cgit_query_grep);
|
||||
if (cgit_query_search)
|
||||
html_hidden("q", cgit_query_search);
|
||||
}
|
||||
}
|
||||
|
||||
void cgit_print_pageheader(char *title, int show_search)
|
||||
{
|
||||
html("<table id='layout'>");
|
||||
html("<tr><td id='header'><a href='");
|
||||
html_attr(cgit_rooturl());
|
||||
html("'>");
|
||||
html_txt(cgit_root_title);
|
||||
html("</a></td><td id='logo'>");
|
||||
static const char *default_info = "This is cgit, a fast webinterface for git repositories";
|
||||
int header = 0;
|
||||
|
||||
html("<div id='sidebar'>\n");
|
||||
html("<a href='");
|
||||
html_attr(cgit_logo_link);
|
||||
htmlf("'><img src='%s' alt='logo'/></a>", cgit_logo);
|
||||
html("</td></tr>");
|
||||
html("<tr><td id='crumb'>");
|
||||
html_attr(cgit_rooturl());
|
||||
htmlf("'><div id='logo'><img src='%s' alt='cgit'/></div></a>\n",
|
||||
cgit_logo);
|
||||
html("<div class='infobox'>");
|
||||
if (cgit_query_repo) {
|
||||
html_txt(cgit_repo->name);
|
||||
html(" (");
|
||||
html_txt(cgit_query_head);
|
||||
html(") : ");
|
||||
reporevlink(NULL, "summary", NULL, NULL, cgit_query_head,
|
||||
html("<h1>");
|
||||
html_txt(strrpart(cgit_repo->name, 20));
|
||||
html("</h1>\n");
|
||||
html_txt(cgit_repo->desc);
|
||||
if (cgit_repo->owner) {
|
||||
html("<p>\n<h1>owner</h1>\n");
|
||||
html_txt(cgit_repo->owner);
|
||||
}
|
||||
html("<p>\n<h1>navigate</h1>\n");
|
||||
reporevlink(NULL, "summary", NULL, "menu", cgit_query_head,
|
||||
NULL, NULL);
|
||||
html(" ");
|
||||
cgit_log_link("log", NULL, NULL, cgit_query_head,
|
||||
cgit_log_link("log", NULL, "menu", cgit_query_head,
|
||||
cgit_query_sha1, cgit_query_path, 0);
|
||||
html(" ");
|
||||
cgit_tree_link("tree", NULL, NULL, cgit_query_head,
|
||||
cgit_tree_link("tree", NULL, "menu", cgit_query_head,
|
||||
cgit_query_sha1, NULL);
|
||||
html(" ");
|
||||
cgit_commit_link("commit", NULL, NULL, cgit_query_head,
|
||||
cgit_commit_link("commit", NULL, "menu", cgit_query_head,
|
||||
cgit_query_sha1);
|
||||
html(" ");
|
||||
cgit_diff_link("diff", NULL, NULL, cgit_query_head,
|
||||
cgit_diff_link("diff", NULL, "menu", cgit_query_head,
|
||||
cgit_query_sha1, cgit_query_sha2,
|
||||
cgit_query_path);
|
||||
} else {
|
||||
html_txt("Index of repositories");
|
||||
}
|
||||
html("</td>");
|
||||
html("<td id='search'>");
|
||||
if (show_search) {
|
||||
|
||||
for_each_ref(print_archive_ref, &header);
|
||||
|
||||
html("<p>\n<h1>branch</h1>\n");
|
||||
html("<form method='get' action=''>\n");
|
||||
add_hidden_formfields(0, 1);
|
||||
html("<select name='h' onchange='this.form.submit();'>\n");
|
||||
for_each_branch_ref(print_branch_option, cgit_query_head);
|
||||
html("</select>\n");
|
||||
html("</form>\n");
|
||||
|
||||
html("<p>\n<h1>search</h1>\n");
|
||||
html("<form method='get' action='");
|
||||
html_attr(cgit_currurl());
|
||||
html("'>");
|
||||
if (!cgit_virtual_root) {
|
||||
if (cgit_query_repo)
|
||||
html_hidden("r", cgit_query_repo);
|
||||
if (cgit_query_page)
|
||||
html_hidden("p", cgit_query_page);
|
||||
}
|
||||
if (cgit_query_head)
|
||||
html_hidden("h", cgit_query_head);
|
||||
if (cgit_query_sha1)
|
||||
html_hidden("id", cgit_query_sha1);
|
||||
if (cgit_query_sha2)
|
||||
html_hidden("id2", cgit_query_sha2);
|
||||
html("<select name='qt'>");
|
||||
html_attr(cgit_pageurl(cgit_query_repo, "log", NULL));
|
||||
html("'>\n");
|
||||
add_hidden_formfields(1, 0);
|
||||
html("<select name='qt'>\n");
|
||||
html_option("grep", "log msg", cgit_query_grep);
|
||||
html_option("author", "author", cgit_query_grep);
|
||||
html_option("committer", "committer", cgit_query_grep);
|
||||
html("</select>");
|
||||
html("</select>\n");
|
||||
html("<input class='txt' type='text' name='q' value='");
|
||||
html_attr(cgit_query_search);
|
||||
html("'/><input class='btn' type='submit' value='...'/></form>");
|
||||
html("'/>\n");
|
||||
html("</form>\n");
|
||||
} else {
|
||||
if (!cgit_index_info || html_include(cgit_index_info))
|
||||
html(default_info);
|
||||
}
|
||||
html("</td></tr>");
|
||||
html("<tr><td id='content' colspan='2'>");
|
||||
|
||||
html("</div>\n");
|
||||
|
||||
html("</div>\n<table class='grid'><tr><td id='content'>\n");
|
||||
}
|
||||
|
||||
|
||||
void cgit_print_snapshot_start(const char *mimetype, const char *filename,
|
||||
struct cacheitem *item)
|
||||
{
|
||||
|
||||
65
ui-summary.c
65
ui-summary.c
@ -120,47 +120,6 @@ static int print_tag(struct refinfo *ref)
|
||||
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 @@ void cgit_print_tags(int maxcount)
|
||||
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>");
|
||||
|
||||
Loading…
Reference in New Issue
Block a user