added dropdown nav to actions so can toggle between blob, raw, blame and history

[catagits/Gitalist.git] / root / static / css / core.css

#debug_holder{
	
	adisplay:none;
	
	clear:both;
	padding-top:30px;
	margin:30px 0;
}

#debug_holder pre{
	margin:0;
	padding:10px;
	border:1px solid #ddd;
	background-color:#f0f0f0;
}


body{
	background:#FAFAFA url(/static/i/bg.png) repeat-x left top;
	padding:0;
	margin:0;
	font-family:Arial, Verdana, sans-serif;
	font-size:80%;
}
a img{
	border:0;
}


/* structure */
.sub_holder{
	width:970px;
	margin:0 auto;
	text-align:left;
}

#header_holder{
	margin-top:20px;
}
#header{
	height:60px;
}

#content_holder{
	background:transparent url([% c.uri_for('/static/i/bg_content.png') %]) repeat-y center center;
}
#content{
	min-height:200px;
	padding:0 12px 40px 10px;
	background:transparent url([% c.uri_for('/static/i/bg_bottom.png') %]) no-repeat center bottom;
}
#content_inner{
	padding-bottom:30px;
	background:transparent url([% c.uri_for('/static/i/bg_top.png') %]) no-repeat;
}
#logo{
	margin-left:-10px;
	float:left;
}
#header .search{
	margin-right:10px;
	float:right;
}
#git_logo{
	float:left;
	margin-left:15px;
}
#feeds{
	float:right;
	margin-right:15px;
}
#footer_holder{
	margin-bottom:100px;
}
#footer p{
	margin-left:15px;
}


/* nav tabs */
#nav_logs{
	width:100%;
	clear:both;
	float:right;
	margin:-5px 10px 0 0;
}
#nav_logs ul{
	margin:0;
	padding:0;
}
#nav_logs li{
	display:block;
	float:right;
	list-style:none;
	margin:0;
	padding:0;
}
#nav_logs li a{
	display:block;
	margin-left:20px;
	padding:10px 15px 10px 48px;
	color:#ffffff;
	font-size:1.4em;
	text-transform:uppercase;
	text-decoration:none;
}
a#log_short{
	background:#666 url([% c.uri_for('/static/i/icons/shortlog.gif') %]) no-repeat 15px center;
}
a#log_full{
	background:#666 url([% c.uri_for('/static/i/icons/fulllog.gif') %]) no-repeat 15px center;
}
a#tree{
	background:#666 url([% c.uri_for('/static/i/icons/tree.gif') %]) no-repeat 15px center;
}
#nav_logs li a:hover{
	text-decoration:underline;
	background-color:#DC143C;
}
#nav_logs li.selected a{
	background-color:#333;
}
#nav_logs #branch_selector{
	padding:10px 15px 10px 48px;
	font-size:1.3em;
	font-weight:bold;
	color:#666;
}





/* formating */
h1{
	margin:0;
	padding:20px 0;
	clear:both;
	font-weight:normal;
	font-size:1.85em;
	color:#fff;
}
h1 a{
	margin-right:10px;
	color:#fff;
}
h1 a:hover{
	color:#EAF2F5;
}
h2{
	font-size:1.85em;
	font-weight:normal;
	color:#666;
	margin:30px 15px 20px;
}
h2 span{
	color:#ccc;
}
h3{
	margin:0;
	color:#fff;
	padding:9px 5px 9px 10px;
	font-size:1em;
}
h3 a{
	color:#ffffff;
}
h4 a{
	color:#ffffff;
}
h4 a:hover{
	color:#EAF2F5;
}
p,
td,
a{
	color:#666;
}
a:hover{
	color:#DC143C;
}

/* sub actions dropdown changer in h1 */
#actions_nav_link{
	border:1px solid #666;
	padding:1px 4px;
	text-decoration:none;
	outline:none;
}
#actions_nav_link span{
	margin-right:5px;
	padding-right:18px;

	background:transparent url([% c.uri_for('/static/i/arrow_down_white.gif') %]) no-repeat right center;
}
#actions_nav_list{
	display:none;
	position:absolute;
	padding:0 0 3px 0;
	margin:0;
	background-color:#333;
	color:#fff;
	font-size:1em;
	border:1px solid #666;
	border-top:none;
}
#actions_nav_list li{
	list-style:none;
	margin:0;
	padding:2px 10px 2px 5px;
}
#actions_nav_list a{
	color:#fff;
	font-size:1.8em;
}
#actions_nav_list a:hover{
	color:#EAF2F5;
}
.actions_nav_list_over{
	display:block !important;
}
.button{
	display:block;
	float:left;
	vertical-align:middle;
	margin-right:8px;
	text-indent:-999999px;
	width:21px;
	height:21px;
	outline:none;
}
a.commit{
	background:transparent url([% c.uri_for('/static/i/icons/commit.png') %]) no-repeat;
}
a.diff{
	background:transparent url([% c.uri_for('/static/i/icons/diff.png') %]) no-repeat;
}
a.diffcurrent{
	background:transparent url([% c.uri_for('/static/i/icons/diffcurrent.png') %]) no-repeat;
}
a.tree{
	background:transparent url([% c.uri_for('/static/i/icons/tree.png') %]) no-repeat;
}
a.shortlog{
	background:transparent url([% c.uri_for('/static/i/icons/shortlog.png') %]) no-repeat;
}
a.longlog{
	background:transparent url([% c.uri_for('/static/i/icons/longlog.png') %]) no-repeat;
}
a.blob{
	background:transparent url([% c.uri_for('/static/i/icons/blob.png') %]) no-repeat;
}
a.blame{
	background:transparent url([% c.uri_for('/static/i/icons/blame.png') %]) no-repeat;
}
a.history{
	background:transparent url([% c.uri_for('/static/i/icons/history.png') %]) no-repeat;
}
a.raw{
	background:transparent url([% c.uri_for('/static/i/icons/raw.png') %]) no-repeat;
}
.sha1_holder{
	background:transparent url([% c.uri_for('/static/i/icons/button_sha1.png') %]) no-repeat;
}
.sha1_holder_invert{
	background:transparent url([% c.uri_for('/static/i/icons/button_sha1_invert.png') %]) no-repeat;
}
.sha1_label{
	padding-top:2px;
	float:left;
}
.msg{
	padding:5px 10px 5px 35px;
	background:#f0f0f0 url([% c.uri_for('/static/i/icons/attention.png') %]) no-repeat 10px center;
	border:1px solid #ddd;
	margin:30px 15px;
}

a.rss_logo {
  float: right;
  padding: 3px 0px;
  width: 35px;
  line-height: 10px;
  border: 1px solid;
  border-color: #fcc7a5 #7d3302 #3e1a01 #ff954e;
  color: #ffffff;
  background-color: #ff6600;
  font-weight: bold;
  font-family: sans-serif;
  font-size: 70%;
  font-style: normal;
  text-align: center;
  text-decoration: none;
  margin: 3px;
}

a.rss_logo:hover {
  background-color: #ee5500;
}



/* paging */
.pager{
	width:100%;
	float:left;
	margin:10px 0;
	padding:0;
}
.pager li{
	margin:0;
	padding:0;
	display:block;
	list-style:none;
}
.pager li a{
	display:block;
	padding:4px 6px;
	color:#fff;
	border:1px solid #ddd;
	background-color:#333;
}
.pager .pager_prev a{
	margin-left:20px;
	float:left;
}
.pager .pager_next a{
	margin-right:20px;
	float:right;
}




/* table listings */
th{
	padding:9px 5px 9px 10px;
	text-align:left;
	color:#fff;
}
th a{
	color:#fff;
}
th a:hover{
	color:#f0f0f0;
}
.summary tr{
	background-color:#FAFAFA;
	border-bottom:1px solid #fff;
}
.summary td{
	vertical-align:middle !important;
}
tr{
	background-color:#fff;
}
thead tr{
	background-color:transparent !important;
}
tr.invert{
	background-color:#f0f0f0;
}
tr.header{
	background-color:#666;
}
.sha1{
	width:80px;
}
.file-mode{
	width:80px;
}
.time-since{
	width:95px;
	font-weight:bold;
}
.author{
	width:180px;
}
.author img{
	margin-right:5px;
	vertical-align:middle;
}
table.listing{
	width:970px;
	border-collapse:collapse;
}
.listing td{
	vertical-align:top;
	padding:9px 5px 9px 10px;
}

/*

puts the repo description on one line which gets truncated if the repo name is too long
BUT the final width needs to be set with javascript based on the parent element (td) width

.description{
	white-space:nowrap;
	overflow:hidden;
}
.description div{
	position:absolute;
	white-space:nowrap;
	overflow:hidden;
	width:200px;
}
*/

.action-list{
	width:120px;
}

.diff-tree{
	background-color:#f0f0f0;
}
.diff-tree th{
	background-color:#666;
}
.diff-tree tr{
	border-bottom:1px solid #fff;
}
.diff-tree td{
	padding:6px 5px 4px 10px;
}
.differences{
	margin-top:0;
	padding:0px 15px;
}
.differences pre{
	line-height:140%;
	font-size:12px;
	overflow:auto;
	margin:0;
	padding:10px;
	border:1px solid #ddd;
	background-color:#f0f0f0;
	min-height:40px;
}
.diff-head{
	background-color:#666;
	color:#fff;
	margin:10px 0 0 0 !important;
	border:1px solid #ddd;
	border-bottom:none;
	font-family: monospace;
	padding:10px;
	font-size:13px;
}
.diff-index {
	margin:0 0 30px 0;
	border:1px solid #ddd;
	border-top:none;
	background-color:#ccc;
	padding:5px 10px;
}


/* /blame */
#blame pre, #blame tt {
  margin: 0;
  font-size: 12px;
}
#blame .commit-info {

}
#blame .lineno {
  text-align: right;
  padding: 0 8px;
}
#blame a {
 atext-decoration: none;
}
#blame {
    overflow-x: scroll;
}
#blame tr.alt {
  background-color: #f7f7f7;
}
#blame tbody tr:hover {
  background-color: #fefeaa;
}
#blame td {
	vertical-align:middle;
	padding: 3px;
}
#blame td.lineno {
  background-color: #eee;
}
#blame td.date, #blame td.author, #blame td.commit-info {
}
#blame tbody td.data {
  padding-left: 5px;
  background-color: #333;
  color: #ddd;
}

/* /blob */
pre.blob {
  background-color: #333;
  color: #ddd;
  border-left: solid 3px #c33;
  padding: 5px;
  padding-left: 15px;
  margin: 20px 15px 20px;
  overflow:auto;
  font-size:12px;
}
div.blob {
    text-align: center;
    margin: 30px;
}

/* /blobdiff etc */