Replace sidebar/logo
This replaces the sidebar with a more 'common' header layout and also updates the logo. Not quite finished yet, though. Signed-off-by: Lars Hjemli <hjemli@gmail.com>
This commit is contained in:
		
							
								
								
									
										163
									
								
								cgit.css
									
									
									
									
									
								
							
							
						
						
									
										163
									
								
								cgit.css
									
									
									
									
									
								
							| @@ -11,41 +11,67 @@ body { | |||||||
| 	padding: 4px; | 	padding: 4px; | ||||||
| } | } | ||||||
|  |  | ||||||
| table { |  | ||||||
|       border-collapse: collapse; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| h2 { |  | ||||||
| 	font-size: 120%; |  | ||||||
| 	font-weight: bold; |  | ||||||
| 	margin-top: 0em; |  | ||||||
| 	margin-bottom: 0.25em; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| h3 { |  | ||||||
| 	margin-top: 0em; |  | ||||||
| 	font-size: 100%; |  | ||||||
| 	font-weight: normal; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| h4 { |  | ||||||
| 	margin-top: 1.5em; |  | ||||||
| 	margin-bottom: 0.1em; |  | ||||||
| 	font-size: 100%; |  | ||||||
| 	font-weight: bold; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| a { | a { | ||||||
| 	color: #600; | 	color: blue; | ||||||
| 	text-decoration: none; | 	text-decoration: none; | ||||||
| } | } | ||||||
|  |  | ||||||
| a:hover { | a:hover { | ||||||
| 	background-color: #ddd; | 	text-decoration: underline; | ||||||
| 	text-decoration: none; |  | ||||||
| } | } | ||||||
|  |  | ||||||
|  | table { | ||||||
|  |       border-collapse: collapse; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table#header { | ||||||
|  | 	width: 100%; | ||||||
|  | 	margin-bottom: 1em; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table#header td.logo { | ||||||
|  | 	width: 96px; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table#header td.main { | ||||||
|  | 	font-size: 200%; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table#header td.sub { | ||||||
|  | 	color: #777; | ||||||
|  | 	border-top: solid 1px #ccc; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table.tabs { | ||||||
|  | 	border-bottom: solid 2px #ccc; | ||||||
|  | 	border-collapse: collapse; | ||||||
|  | 	margin-top: 2em; | ||||||
|  | 	margin-bottom: 1em; | ||||||
|  | 	width: 100%; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table.tabs td { | ||||||
|  | 	padding: 0px 0.5em; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table.tabs td a { | ||||||
|  | 	padding: 2px 1em; | ||||||
|  | 	color: #007; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | table.tabs td a.active { | ||||||
|  | 	color: #000; | ||||||
|  | 	background-color: #ccc; | ||||||
|  | } | ||||||
|  |  | ||||||
|  | div.content { | ||||||
|  | 	margin: 0px; | ||||||
|  | 	padding: 1em; | ||||||
|  | } | ||||||
|  |  | ||||||
|  |  | ||||||
| table.list { | table.list { | ||||||
|  | 	width: 100%; | ||||||
| 	border: none; | 	border: none; | ||||||
| 	border-collapse: collapse; | 	border-collapse: collapse; | ||||||
| } | } | ||||||
| @@ -55,7 +81,7 @@ table.list tr { | |||||||
| } | } | ||||||
|  |  | ||||||
| table.list tr:hover { | table.list tr:hover { | ||||||
| 	background: #f8f8f8; | 	background: #eee; | ||||||
| } | } | ||||||
|  |  | ||||||
| table.list tr.nohover:hover { | table.list tr.nohover:hover { | ||||||
| @@ -63,8 +89,8 @@ table.list tr.nohover:hover { | |||||||
| } | } | ||||||
|  |  | ||||||
| table.list th { | table.list th { | ||||||
| 	font-weight: bold; | 	font-weight: normal; | ||||||
| 	border-bottom: solid 1px #777; | 	border-bottom: solid 1px #ccc; | ||||||
| 	padding: 0.1em 0.5em 0.1em 0.5em; | 	padding: 0.1em 0.5em 0.1em 0.5em; | ||||||
| 	vertical-align: baseline; | 	vertical-align: baseline; | ||||||
| } | } | ||||||
| @@ -74,81 +100,14 @@ table.list td { | |||||||
| 	padding: 0.1em 0.5em 0.1em 0.5em; | 	padding: 0.1em 0.5em 0.1em 0.5em; | ||||||
| } | } | ||||||
|  |  | ||||||
|  | table.list td a { | ||||||
|  | 	color: black; | ||||||
|  | } | ||||||
|  |  | ||||||
| img { | img { | ||||||
| 	border: none; | 	border: none; | ||||||
| } | } | ||||||
|  |  | ||||||
| table#layout { |  | ||||||
| 	border-collapse: collapse; |  | ||||||
| 	border: none; |  | ||||||
| 	margin: 0px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| td#sidebar { |  | ||||||
| 	vertical-align: top; |  | ||||||
| 	width: 162px; |  | ||||||
| 	padding: 0px 0px 0px 0px; |  | ||||||
| 	margin: 0px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| td#sidebar table { |  | ||||||
| 	border-collapse: separate; |  | ||||||
| 	border-spacing: 0px; |  | ||||||
| 	margin: 0px; |  | ||||||
| 	padding: 0px; |  | ||||||
| 	background-color: #ccc; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| td#sidebar table.sidebar td.sidebar { |  | ||||||
| 	padding: 4px; |  | ||||||
| 	border-top: solid 1px #eee; |  | ||||||
| 	border-left: solid 1px #eee; |  | ||||||
| 	border-right: solid 1px #aaa; |  | ||||||
| 	border-bottom: solid 1px #aaa; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| 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#sidebar h1 { |  | ||||||
| 	font-size: 10pt; |  | ||||||
| 	font-weight: bold; |  | ||||||
| 	margin: 8px 0px 0px 0px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| td#sidebar h1.first { |  | ||||||
| 	margin-top: 0px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| td#sidebar a.menu { |  | ||||||
| 	display: block; |  | ||||||
| 	background-color: #ccc; |  | ||||||
| 	padding: 0.1em 0.5em; |  | ||||||
| 	text-decoration: none; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| td#sidebar a.menu:hover { |  | ||||||
| 	background-color: #bbb; |  | ||||||
| 	text-decoration: none; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| td#sidebar select { |  | ||||||
| 	width: 100%; |  | ||||||
| 	margin: 2px 0px 0px 0px; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| td#sidebar form { |  | ||||||
| 	text-align: right; |  | ||||||
| } |  | ||||||
|  |  | ||||||
| input#switch-btn { | input#switch-btn { | ||||||
| 	margin: 2px 0px 0px 0px; | 	margin: 2px 0px 0px 0px; | ||||||
| } | } | ||||||
| @@ -357,7 +316,7 @@ table.diff td { | |||||||
| table.diff td div.head { | table.diff td div.head { | ||||||
| 	font-weight: bold; | 	font-weight: bold; | ||||||
| 	margin-top: 1em; | 	margin-top: 1em; | ||||||
| 	background-color: #eee; | 	color: black; | ||||||
| } | } | ||||||
|  |  | ||||||
| table.diff td div.hunk { | table.diff td div.hunk { | ||||||
|   | |||||||
							
								
								
									
										
											BIN
										
									
								
								cgit.png
									
									
									
									
									
								
							
							
						
						
									
										
											BIN
										
									
								
								cgit.png
									
									
									
									
									
								
							
										
											Binary file not shown.
										
									
								
							| Before Width: | Height: | Size: 5.3 KiB After Width: | Height: | Size: 1.8 KiB | 
							
								
								
									
										125
									
								
								ui-shared.c
									
									
									
									
									
								
							
							
						
						
									
										125
									
								
								ui-shared.c
									
									
									
									
									
								
							| @@ -7,6 +7,7 @@ | |||||||
|  */ |  */ | ||||||
|  |  | ||||||
| #include "cgit.h" | #include "cgit.h" | ||||||
|  | #include "cmd.h" | ||||||
| #include "html.h" | #include "html.h" | ||||||
|  |  | ||||||
| const char cgit_doctype[] = | const char cgit_doctype[] = | ||||||
| @@ -465,97 +466,59 @@ void add_hidden_formfields(int incl_head, int incl_search, char *page) | |||||||
| 	} | 	} | ||||||
| } | } | ||||||
|  |  | ||||||
|  | char *hc(struct cgit_cmd *cmd, const char *page) | ||||||
|  | { | ||||||
|  | 	return (strcmp(cmd->name, page) ? NULL : "active"); | ||||||
|  | } | ||||||
|  |  | ||||||
| void cgit_print_pageheader(struct cgit_context *ctx) | void cgit_print_pageheader(struct cgit_context *ctx) | ||||||
| { | { | ||||||
| 	static const char *default_info = "This is cgit, a fast webinterface for git repositories"; | 	struct cgit_cmd *cmd = cgit_get_cmd(ctx); | ||||||
| 	int header = 0; |  | ||||||
| 	char *url; |  | ||||||
|  |  | ||||||
| 	html("<table id='layout' summary=''>\n"); | 	html("<table id='header'>\n"); | ||||||
| 	html("<tr><td id='sidebar'>\n"); | 	html("<tr>\n"); | ||||||
| 	html("<table class='sidebar' cellspacing='0' summary=''>\n"); | 	html("<td class='logo' rowspan='2'><a href='"); | ||||||
| 	html("<tr><td class='sidebar'>\n<a href='"); |  | ||||||
| 	html_attr(cgit_rooturl()); | 	html_attr(cgit_rooturl()); | ||||||
| 	htmlf("'><img src='%s' alt='cgit'/></a>\n", | 	html("'><img src='"); | ||||||
| 	      ctx->cfg.logo); | 	html_attr(ctx->cfg.logo); | ||||||
| 	html("</td></tr>\n<tr><td class='sidebar'>\n"); | 	html("'/></a></td>\n"); | ||||||
| 	if (ctx->repo) { | 	html("<td class='main'>"); | ||||||
| 		html("<h1 class='first'>"); | 	if (ctx->repo) | ||||||
| 		html_txt(strrpart(ctx->repo->name, 20)); | 		html_txt(ctx->repo->name); | ||||||
| 		html("</h1>\n"); | 	else | ||||||
|  | 		html_txt(ctx->cfg.root_title); | ||||||
|  | 	html("</td></tr>\n"); | ||||||
|  | 	html("<tr><td class='sub'>"); | ||||||
|  | 	if (ctx->repo) | ||||||
| 		html_txt(ctx->repo->desc); | 		html_txt(ctx->repo->desc); | ||||||
| 		if (ctx->repo->owner) { | 	else | ||||||
| 			html("<h1>owner</h1>\n"); | 		html_txt(ctx->cfg.index_info); | ||||||
| 			html_txt(ctx->repo->owner); | 	html("</td></tr>\n"); | ||||||
| 		} | 	html("</table>\n"); | ||||||
| 		html("<h1>navigate</h1>\n"); |  | ||||||
| 		reporevlink(NULL, "summary", NULL, "menu", ctx->qry.head, | 	html("<table class='tabs'><tr><td>\n"); | ||||||
| 			    NULL, NULL); | 	if (ctx->repo) { | ||||||
| 		cgit_log_link("log", NULL, "menu", ctx->qry.head, NULL, NULL, | 		reporevlink(NULL, "summary", NULL, hc(cmd, "summary"), | ||||||
| 			      0, NULL, NULL); | 			    ctx->qry.head, NULL, NULL); | ||||||
| 		cgit_tree_link("tree", NULL, "menu", ctx->qry.head, | 		cgit_refs_link("refs", NULL, hc(cmd, "refs"), ctx->qry.head, | ||||||
| 			       ctx->qry.sha1, NULL); | 			       ctx->qry.sha1, NULL); | ||||||
| 		cgit_commit_link("commit", NULL, "menu", ctx->qry.head, | 		cgit_log_link("log", NULL, hc(cmd, "log"), ctx->qry.head, | ||||||
| 			      ctx->qry.sha1); | 			      NULL, NULL, 0, NULL, NULL); | ||||||
| 		cgit_diff_link("diff", NULL, "menu", ctx->qry.head, | 		cgit_tree_link("tree", NULL, hc(cmd, "tree"), ctx->qry.head, | ||||||
|  | 			       ctx->qry.sha1, NULL); | ||||||
|  | 		cgit_commit_link("commit", NULL, hc(cmd, "commit"), | ||||||
|  | 				 ctx->qry.head, ctx->qry.sha1); | ||||||
|  | 		cgit_diff_link("diff", NULL, hc(cmd, "diff"), ctx->qry.head, | ||||||
| 			       ctx->qry.sha1, ctx->qry.sha2, NULL); | 			       ctx->qry.sha1, ctx->qry.sha2, NULL); | ||||||
| 		cgit_patch_link("patch", NULL, "menu", ctx->qry.head, | 		cgit_patch_link("patch", NULL, hc(cmd, "patch"), ctx->qry.head, | ||||||
| 				ctx->qry.sha1); | 				ctx->qry.sha1); | ||||||
|  |  | ||||||
| 		for_each_ref(print_archive_ref, &header); |  | ||||||
|  |  | ||||||
| 		if (ctx->repo->clone_url || ctx->cfg.clone_prefix) { |  | ||||||
| 			html("<h1>clone</h1>\n"); |  | ||||||
| 			if (ctx->repo->clone_url) |  | ||||||
| 				url = ctx->repo->clone_url; |  | ||||||
| 			else |  | ||||||
| 				url = fmt("%s%s", ctx->cfg.clone_prefix, |  | ||||||
| 					  ctx->repo->url); |  | ||||||
| 			html("<a class='menu' href='"); |  | ||||||
| 			html_attr(url); |  | ||||||
| 			html("' title='"); |  | ||||||
| 			html_attr(url); |  | ||||||
| 			html("'>\n"); |  | ||||||
| 			html_txt(strrpart(url, 20)); |  | ||||||
| 			html("</a>\n"); |  | ||||||
| 		} |  | ||||||
|  |  | ||||||
| 		html("<h1>branch</h1>\n"); |  | ||||||
| 		html("<form method='get' action=''>\n"); |  | ||||||
| 		add_hidden_formfields(0, 1, ctx->qry.page); |  | ||||||
| //		html("<table summary='branch selector' class='grid'><tr><td id='branch-dropdown-cell'>"); |  | ||||||
| 		html("<select name='h' onchange='this.form.submit();'>\n"); |  | ||||||
| 		for_each_branch_ref(print_branch_option, ctx->qry.head); |  | ||||||
| 		html("</select>\n"); |  | ||||||
| //		html("</td><td>"); |  | ||||||
| 		html("<noscript><input type='submit' id='switch-btn' value='switch'/></noscript>\n"); |  | ||||||
| //		html("</td></tr></table>"); |  | ||||||
| 		html("</form>\n"); |  | ||||||
|  |  | ||||||
| 		html("<h1>search</h1>\n"); |  | ||||||
| 		html("<form method='get' action='"); |  | ||||||
| 		if (ctx->cfg.virtual_root) |  | ||||||
| 			html_attr(cgit_fileurl(ctx->qry.repo, "log", |  | ||||||
| 					       ctx->qry.path, NULL)); |  | ||||||
| 		html("'>\n"); |  | ||||||
| 		add_hidden_formfields(1, 0, "log"); |  | ||||||
| 		html("<select name='qt'>\n"); |  | ||||||
| 		html_option("grep", "log msg", ctx->qry.grep); |  | ||||||
| 		html_option("author", "author", ctx->qry.grep); |  | ||||||
| 		html_option("committer", "committer", ctx->qry.grep); |  | ||||||
| 		html("</select>\n"); |  | ||||||
| 		html("<input class='txt' type='text' name='q' value='"); |  | ||||||
| 		html_attr(ctx->qry.search); |  | ||||||
| 		html("'/>\n"); |  | ||||||
| 		html("</form>\n"); |  | ||||||
| 	} else { | 	} else { | ||||||
| 		if (!ctx->cfg.index_info || html_include(ctx->cfg.index_info)) | 		html("<a class='active' href='"); | ||||||
| 			html(default_info); | 		html_attr(cgit_rooturl()); | ||||||
|  | 		html("'>index</a>\n"); | ||||||
| 	} | 	} | ||||||
|  | 	html("</td></tr></table>\n"); | ||||||
| 	html("</td></tr></table></td>\n"); | 	html("<div class='content'>"); | ||||||
|  |  | ||||||
| 	html("<td id='content'>\n"); |  | ||||||
| } | } | ||||||
|  |  | ||||||
| void cgit_print_filemode(unsigned short mode) | void cgit_print_filemode(unsigned short mode) | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user
	 Lars Hjemli
					Lars Hjemli