kallithea Changeset - ea89ac73bef8

Changeset - ea89ac73bef8

Parent rev.

Child rev.

[Not reviewed]

default

1 5 1

Marcin Kuzminski - 16 years ago 2010-05-09 17:35:51
marcin@python-works.com

Update css +file browsing and diffs

7 files changed with 260 insertions and 225 deletions:

pylons_app/public/css/diff.css

pylons_app/public/css/monoblue_custom.css

107

pylons_app/public/css/pygments.css

pylons_app/public/css/pygments_diff.css

pylons_app/templates/files/file_diff.html

pylons_app/templates/files/files_browser.html

pylons_app/templates/files/files_source.html

0 comments (0 inline, 0 general)

pylons_app/public/css/diff.css

➞

Show inline comments

@@ new file 100644 @@
 div.diffblock {
     overflow: auto;
     padding: 0px;
     border: 1px solid #ccc;
     background: #f8f8f8;
     font-size: 100%;
     line-height: 100%;
     /* new */
     line-height: 125%;
+}
 div.diffblock .code-header{
 	border-bottom: 1px solid #CCCCCC;
 	background: #EEEEEE;
 	color:blue;
 	padding:10px 0 10px 0;
+}
 div.diffblock .code-header span{
 	margin-left:25px;
 	font-weight: bold;
+}
 div.diffblock .code-body{
 	background: #EEEEEE;
+}
 .code-difftable{
 	border-collapse: collapse;
+}
 .code-difftable .add{
 	background:none repeat scroll 0 0 #DDFFDD;
+}
 .code-difftable .add ins{
 	background:none repeat scroll 0 0 #AAFFAA;
 	text-decoration:none;
+}
 .code-difftable .del{
 	background:none repeat scroll 0 0 #FFDDDD;
+}
 .code-difftable .del del{
 	background:none repeat scroll 0 0 #FFAAAA;
 	text-decoration:none;
+}
 .code-difftable .lineno{
 	background:none repeat scroll 0 0 #EEEEEE !important;
 	border-right:1px solid #DDDDDD;
 	padding-left:2px;
 	padding-right:2px;
 	text-align:right;
 	width:20px;
 	-moz-user-select:none;
 	-webkit-user-select: none;
+}
 .code-difftable .lineno pre{
 	color:#747474 !important;
 	font:11px "Bitstream Vera Sans Mono",Monaco,"Courier New",Courier,monospace !important;
 	letter-spacing:-1px;
 	text-align:right;
 	width:20px;
+}
 .code-difftable .lineno a{
 	color:#0000CC !important;
+}
 .code-difftable .code td{
 	margin:0;
 	padding: 0;
+}
 .code-difftable .code pre{
 	margin:0;
 	padding:0;
+}
 .code {
 	display: block;
 	width: 100%;
+}
 .code-diff {
     padding: 0px;
     margin-top: 5px;
     margin-bottom: 5px;
     border-left: 2px solid #ccc;
+}
 .code-diff pre, .line pre {
 	padding: 3px;
     margin: 0;
+}
 .lineno a {
 	text-decoration: none;
+}
 .line{
 	padding:0;
 	margin:0;
+}
@@ \ No newline at end of file @@

pylons_app/public/css/monoblue_custom.css

➞

Show inline comments

 /*** Initial Settings ***/
 * {
   margin: 0;
   padding: 0;
   font-weight: normal;
   font-style: normal;
+}
 html {
   font-size: 100%;
   font-family: sans-serif;
+}
 body {
   font-size: 77%;
 #mainhtml{
   margin: 15px 50px;
   background: #DBD4C6;
 	font-family: sans-serif;
+}
 a {
   color:#0000cc;
   text-decoration: none;
+}
 /*** end of Initial Settings ***/
 /** common settings **/
 a:HOVER{
 	text-decoration: underline;
+}
 /*** end of Initial Settings ***/ /** common settings **/
 div#main{
 padding:5px;
+}
 div#container {
   background: #FFFFFF;
   position: relative;
@@ @@ -39,6 +28,7 @@ div.page-header { @@
   background: #556cb5 top left repeat-x;
   position: relative;
+}
   div.page-header h1 {
     margin: 10px 0 30px;
     font-size: 1.8em;
@@ @@ -47,10 +37,12 @@ div.page-header { @@
     letter-spacing: 1px;
     color: #DDD;
+  }
   div.page-header h1 a {
     font-weight: bold;
     color: #FFF;
+  }
   div.page-header a {
     text-decoration: none;
+  }
@@ @@ -61,21 +53,25 @@ div.page-header { @@
     bottom: 0;
     right: 20px;
+  }
   div.page-header form label {
     color: #DDD;
+  }
   div.page-header form input {
     padding: 2px;
     border: solid 1px #DDD;
+  }
   div.page-header form dl {
     overflow: hidden;
+  }
   div.page-header form dl dt {
     font-size: 1.2em;
+  }
   div.page-header form dl dt,
   div.page-header form dl dd {
 div.page-header form dl dt,div.page-header form dl dd {
     margin: 0 0 0 5px;
     float: left;
     height: 24px;
@@ @@ -87,7 +83,9 @@ div.page-header { @@
     list-style-type: none;
     overflow: hidden;
     width: 800px;
 	padding: 0;
+  }
     ul.page-nav li {
       margin: 0 2px 0 0;
       float: left;
@@ @@ -95,21 +93,24 @@ div.page-header { @@
       font-size: 1.1em;
       line-height: 24px;
       text-align: center;
 	background: #DDD;
+    }
     ul.page-nav li.current {
       background: #FFF;
       padding-right:5px;
       padding-left:5px;
+    }
     ul.page-nav li a {
       height: 24px;
       color: #666;
       padding-right:5px;
       padding-left:5px;
       background: #DDD;
       display: block;
       text-decoration: none;
+    }
     ul.page-nav li a:hover {
       color:#333;
       background: #FFF;
@@ @@ -119,6 +120,7 @@ ul.submenu { @@
   margin: 10px 0 -10px 20px;
   list-style-type: none;
+}
 ul.submenu li {
   margin: 0 10px 0 0;
   font-size: 1.2em;
@@ @@ -135,14 +137,17 @@ h2 { @@
   border-top: dotted 1px #D5E1E6;
   font-weight: bold;
+}
 h2.no-link {
   color:#006699;
+}
 h2.no-border {
   color: #FFF;
   background: #556CB5;
   border: 0;
+}
 h2 a {
   font-weight:bold;
   color:#006699;
@@ @@ -160,6 +165,7 @@ div.page-footer { @@
   margin: 50px 0 0;
   position: relative;
+}
   div.page-footer p {
     position: relative;
     left: 20px;
@@ @@ -174,9 +180,11 @@ div.page-footer { @@
     height: 20px;
     list-style-type: none;
+  }
   ul.rss-logo li {
     display: inline;
+  }
   ul.rss-logo li a {
     padding: 3px 6px;
     line-height: 10px;
@@ @@ -190,6 +198,7 @@ div.page-footer { @@
     text-align:center;
     text-decoration:none;
+  }
   div.rss-logo li a:hover {
     background-color:#ee5500;
+  }
@@ @@ -199,18 +208,6 @@ p.normal { @@
   font-size: 1.2em;
+}
 table {
   margin: 0 0 0 0;
   border-collapse: collapse;
+}
 /*
 table tr td {
   font-size: 1.1em;
+}
 table tr td.nowrap {
   white-space: nowrap;
+}
 */
 table tr.parity0:hover,table tr.parity1:hover {
   background: #D5E1E6;
+}
@@ @@ -218,15 +215,10 @@ table tr.parity0:hover,table tr.parity1: @@
 table tr.parity0 {
   background: #EAEAE9;
+}
 table tr.parity1 {
   background: #FFFFFF;
+}
 table tr td {
   padding: 3px 3px;
+}
 table.annotated tr td {
   padding: 0px 3px;
+}
 span.logtags span {
 	background-repeat:no-repeat;
@@ @@ -236,13 +228,16 @@ span.logtags span { @@
 	text-align:left;
 	font-weight: bold;
+}
 span.logtags span.tagtag {
 	background-image:url("/images/label_16.png");
+}
 span.logtags span.branchtag {
 	background-image:url("/images/left_16.png");
 	color: #628F53;
+}
 span.logtags span.inbranchtag {
 	background-image:url("/images/left_16.png");
+}
@@ @@ -250,12 +245,14 @@ span.logtags span.inbranchtag { @@
 div.diff pre {
   margin: 10px 0 0 0;
+}
 div.diff pre span {
   font-family: monospace;
   white-space: pre;
   font-size: 1.2em;
   padding: 3px 0;
+}
 td.source {
   white-space: pre;
   font-family: monospace;
@@ @@ -263,31 +260,37 @@ td.source { @@
   font-size: 1.2em;
   font-family: monospace;
+}
   div.source div.parity0,
   div.source div.parity1 {
 div.source div.parity0,div.source div.parity1 {
     padding: 1px;
     font-size: 1.2em;
+  }
   div.source div.parity0 {
     background: #F1F6F7;
+  }
   div.source div.parity1 {
     background: #FFFFFF;
+  }
 div.parity0:hover,
 div.parity1:hover {
 div.parity0:hover,div.parity1:hover {
   background: #D5E1E6;
+}
 .linenr {
   color: #999;
   text-align: right;
+}
 .lineno {
   text-align: right;
+}
 .lineno a {
   color: #999;
+}
 td.linenr {
   width: 60px;
+}
@@ @@ -299,69 +302,33 @@ div#powered-by { @@
   right: 20px;
   font-size: 1.2em;
+}
 div#powered-by a {
   color: #EEE;
   text-decoration: none;
+}
 div#powered-by a:hover {
   text-decoration: underline;
+}
 /*
 div#monoblue-corner-top-left {
   position: absolute;
   top: 0;
   left: 0;
   width: 10px;
   height: 10px;
   background: url(./monoblue-corner.png) top left no-repeat !important;
   background: none;
+}
 div#monoblue-corner-top-right {
   position: absolute;
   top: 0;
   right: 0;
   width: 10px;
   height: 10px;
   background: url(./monoblue-corner.png) top right no-repeat !important;
   background: none;
+}
 div#monoblue-corner-bottom-left {
   position: absolute;
   bottom: 0;
   left: 0;
   width: 10px;
   height: 10px;
   background: url(./monoblue-corner.png) bottom left no-repeat !important;
   background: none;
+}
 div#monoblue-corner-bottom-right {
   position: absolute;
   bottom: 0;
   right: 0;
   width: 10px;
   height: 10px;
   background: url(./monoblue-corner.png) bottom right no-repeat !important;
   background: none;
+}
 */
 /** end of common settings **/
 /** summary **/
 dl.overview {
   margin: 0 0 0 30px;
   font-size: 1.1em;
   overflow: hidden;
+}
   dl.overview dt,
   dl.overview dd {
 dl.overview dt,dl.overview dd {
     margin: 5px 0;
     float: left;
+  }
   dl.overview dt {
     clear: left;
     font-weight: bold;
     width: 150px;
+  }
 /** end of summary **/
 /** chagelog **/
@@ @@ -371,14 +338,17 @@ h3.changelog { @@
   font-size: 1.4em;
   border-bottom: dotted 1px #D5E1E6;
+}
 ul.changelog-entry {
   margin: 0 0 10px 30px;
   list-style-type: none;
   position: relative;
+}
 ul.changelog-entry li span.revdate {
   font-size: 1.1em;
+}
 ul.changelog-entry li.age {
   position: absolute;
   top: -25px;
@@ @@ -388,14 +358,17 @@ ul.changelog-entry li.age { @@
   font-weight: bold;
   font-style: italic;
+}
 ul.changelog-entry li span.name {
   font-size: 1.2em;
   font-weight: bold;
+}
 ul.changelog-entry li.description {
   margin: 10px 0 0;
   font-size: 1.1em;
+}
 /** end of changelog **/
 /** file **/
@@ @@ -404,6 +377,7 @@ p.files { @@
   font-size: 2.0em;
   font-weight: bold;
+}
 /** end of file **/
 /** changeset **/
@@ @@ -413,9 +387,11 @@ h3.changeset { @@
   font-size: 1.6em;
   border-bottom: dotted 1px #D5E1E6;
+}
 p.changeset-age {
   position: relative;
+}
 p.changeset-age span {
   position: absolute;
   top: -25px;
@@ @@ -425,12 +401,14 @@ p.changeset-age span { @@
   font-weight: bold;
   font-style: italic;
+}
 p.description {
   margin: 10px 30px 0 30px;
   padding: 10px;
   border: solid 1px #CCC;
   font-size: 1.2em;
+}
 /** end of changeset **/
 /** canvas **/
@@ @@ -472,27 +450,64 @@ ul#graphnodes li .info { @@
 	display: block;
 	position: relative;
+}
 /** end of canvas **/
 /* FILE BROWSER */
 div.browserblock {
     overflow: hidden;
     padding: 0px;
     border: 1px solid #ccc;
     background: #f8f8f8;
     font-size: 100%;
     line-height: 100%;
     /* new */
     line-height: 125%;
+}
 div.browserblock .browser-header{
 	border-bottom: 1px solid #CCCCCC;
 	background: #EEEEEE;
 	color:blue;
 	padding:10px 0 10px 0;
+}
 div.browserblock .browser-header span{
 	margin-left:25px;
 	font-weight: bold;
+}
 div.browserblock .browser-body{
 	background: #EEEEEE;
+}
 table.code-browser{
 	border-collapse:collapse;
+}
 table.code-browser tr{
 	margin:3px;
+}
+}
 table.code-browser thead th {
 	background-color:#EEEEEE;
 	border:1px solid #999999;
 	height:20px;
 	font-size: 1.1em;
 	font-weight: bold;
 	text-align: center;
+}
 table.code-browser tbody tr {
+}
 table.code-browser tbody td {
 	border:1px solid #999999;
 	padding-left:10px;
 	height:20px;
+}
 .info-table {
 	background:none repeat scroll 0 0 #FAFAFA;
 	border-bottom:1px solid #DDDDDD;
 	width:100%;
+}
 .rss_logo{
 	background-image:url("/images/feed.png");
 	background-repeat:no-repeat;
@@ @@ -501,8 +516,8 @@ table.code-browser tbody td { @@
 	padding-left:20px;
 	padding-top:0px;
 	text-align:left;
+}
+}
 .atom_logo{
 	background-image:url("/images/atom.png");
 	background-repeat:no-repeat;
@@ @@ -511,8 +526,8 @@ table.code-browser tbody td { @@
 	padding-left:20px;
 	padding-top:0px;
 	text-align:left;
+}
+}
 .browser-file {
 	background-image:url("/images/document_16.png");
 	background-repeat:no-repeat;
@@ @@ -522,6 +537,7 @@ table.code-browser tbody td { @@
 	padding-top:0px;
 	text-align:left;
+}
 .browser-dir {
 	background-image:url("/images/folder_16.png");
 	background-repeat:no-repeat;
@@ @@ -534,10 +550,9 @@ table.code-browser tbody td { @@
 .current_submenu{
 	border-bottom: 2px solid;
+}
+}
 #repos_list{
 border:1px solid #556CB5;
 background: #FFFFFF;
+}
@@ \ No newline at end of file @@

pylons_app/public/css/pygments.css

➞

Show inline comments

@@ @@ -8,6 +8,16 @@ div.codeblock { @@
     /* new */
     line-height: 125%;
+}
 div.codeblock .code-header{
 	border-bottom: 1px solid #CCCCCC;
 	background: #EEEEEE;
 	color:blue;
 	padding:10px 0 10px 0;
+}
 div.codeblock .code-header span{
 	margin-left:25px;
 	font-weight: bold;
+}
 .code-highlight {
     padding: 0px;

pylons_app/public/css/pygments_diff.css

➞

Show inline comments

deleted file

pylons_app/templates/files/file_diff.html

➞

Show inline comments

@@ @@ -22,50 +22,38 @@ @@
 </%def>
 <%def name="css()">
 <link rel="stylesheet" href="/css/monoblue_custom.css" type="text/css" />
-<link rel="stylesheet" href="/css/pygments_diff.css" type="text/css" />
+<link rel="stylesheet" href="/css/diff.css" type="text/css" />
 </%def>
 <div></div>
 <%def name="main()">
     <h2 class="no-link no-border">${'%s: %s@%s %s %s' % (_('File diff'),c.f_path,c.diff2,'&rarr;',c.diff1)|n}</h2>
 	<div id="files_data">
 		<div id="body" class="codeblock">
 			${h.pygmentize(c.diff,linenos=True,anchorlinenos=True,cssclass="code-diff")}
 		</div>
     <h2 class="no-link no-border">${'%s:  %s %s %s' % (_('File diff'),c.diff2,'&rarr;',c.diff1)|n}</h2>
 <div id="body" class="diffblock">
 	<div class="code-header">
 		<span>${h.link_to(c.f_path,h.url('files_home',repo_name=c.repo_name,revision=c.diff2.split(':')[1],f_path=c.f_path))}</span>
 	</div>
 	<div style="clear:both"></div>
     <div id="files_data">
         <div id="body" class="codeblock">
             <table class='highlighttable'>
             %for x in c.diff_2[0]['chunks']:
 	<div class="code-body">
  			%if c.no_changes:
             	${_('No changes')}
             %else:
 	            <table class='code-difftable'>
 	            %for diff in c.diff_files:
 		            %for x in diff['chunks']:
                 %for y in x:
                     <tr class="line ${y['action']}">
                         <td class="lineno_new">
                             <div class="linenodiv">
                                 <pre>
                                     ${y['new_lineno']}
                                 </pre>
                             </div>
 		                        <td id="#${diff['filename']}_N${y['new_lineno']}"class="lineno new">
 		                              <pre><a href="#${diff['filename']}_N${y['new_lineno']}">${y['new_lineno']}</a></pre>
                         </td>
                         <td class="lineno_old">
                             <div class="linenodiv">
                                 <pre>
                                     ${y['old_lineno']}
                                 </pre>
                             </div>
 		                        <td id="#${diff['filename']}_O${y['old_lineno']}" class="lineno old">
 		                              <pre><a href="#${diff['filename']}_O${y['old_lineno']}">${y['old_lineno']}</a></pre>
                         </td>
                         <td class="code">
 	                        <div class="code-diff">
 	                           <pre>
 	                               <span>
 	                               ${y}
 	                               </span>
 	                           </pre>
 	                        </div>
 		                           <pre>${y['line']|n}</pre>
                         </td>
                     </tr>
                 %endfor$
             %endfor
 		        %endfor
             </table>
             %endif
         </div>
     </div>
 </%def>
@@ \ No newline at end of file @@

pylons_app/templates/files/files_browser.html

➞

Show inline comments

@@ @@ -5,29 +5,36 @@ @@
 		<%return "browser-dir"%>
 	%endif
 </%def>
 <div id="body" class="browserblock">
 	<div class="browser-header">
 		${h.form(h.url.current())}
 		<span>${_('view')}@rev:${h.text('at_rev',value=c.rev_nr,size='5')}</span>
 		${h.submit('view','view')}
 		${h.end_form()}
 	</div>
 	<div class="browser-body">
 <table class="code-browser">
          <thead>
              <tr>
                  <th class="width-50 lefted">${_('Name')}</th>
                  <th class="width-10 righted">${_('Size')}</th>
                  <th class="width-10 righted">${_('Revision')}</th>
                  <th class="width-15 righted">${_('Last modified')}</th>
                  <th class="width-15 righted">${_('Last commiter')}</th>
 		                 <th>${_('Name')}</th>
 		                 <th>${_('Size')}</th>
 		                 <th>${_('Revision')}</th>
 		                 <th>${_('Last modified')}</th>
 		                 <th>${_('Last commiter')}</th>
              </tr>
          </thead>
          	<tr>
 		         	<tr class="parity0">
 		          		<td>
          		% if c.files_list.parent:
           		<td>
           			${h.link_to('..',h.url('files_home',repo_name=c.repo_name,revision=c.cur_rev,f_path=c.files_list.parent),class_="browser-dir")}
 		          			${h.link_to('..',h.url('files_home',repo_name=c.repo_name,revision=c.cur_rev,f_path=c.files_list.parent.path),class_="browser-dir")}
 		          		%endif
           		</td>
           		<td></td>
           		<td></td>
           		<td></td>
           		<td></td>
          		%endif
          	</tr>
     %for cnt,node in enumerate(c.files_list):
+		    %for cnt,node in enumerate(c.files_list,1):
 		<tr class="parity${cnt%2}">
              <td>
 				${h.link_to(node.name,h.url('files_home',repo_name=c.repo_name,revision=c.cur_rev,f_path=node.path),class_=file_class(node))}
@@ @@ -54,4 +61,6 @@ @@
              </td>
 		</tr>
 	%endfor
 </table>
@@ \ No newline at end of file @@
 		</table>
 	</div>
 </div>
@@ \ No newline at end of file @@

pylons_app/templates/files/files_source.html

➞

Show inline comments

 <dl class="overview">
 	<dt>${_('Revision')}</dt>
-	<dd>r${c.files_list.changeset.revision}:${c.files_list.changeset._short}</dd>
+	<dd>r${c.files_list.last_changeset.revision}:${c.files_list.last_changeset._short}</dd>
 	<dt>${_('Size')}</dt>
 	<dd>${h.filesizeformat(c.files_list.size)}</dd>
 	<dt>${_('Options')}</dt>
-	<dd>history  / annotate  / raw  </dd>
+	<dd>${h.link_to(_('annotate'),h.url('#'))}  / ${h.link_to(_('raw'),h.url('#'))}</dd>
 	<dt>${_('History')}</dt>
 	<dd>
 		${h.form(h.url('files_diff_home',repo_name=c.repo_name,f_path=c.f_path),method='GET')}
-		${h.hidden('diff2',c.files_list.changeset._short)}
+		${h.hidden('diff2',c.files_list.last_changeset._short)}
 		${h.select('diff1','',c.file_history)}
 		${h.submit('diff','diff')}
 		${h.end_form()}
@@ @@ -16,5 +16,10 @@ @@
 </dl>
 <div id="body" class="codeblock">
 	<div class="code-header">
 		<span>${c.files_list.name}@r${c.files_list.last_changeset.revision}:${c.files_list.last_changeset._short}</span>
 	</div>
 	<div class="code-body">
 	${h.pygmentize(c.files_list.content,linenos=True,anchorlinenos=True,cssclass="code-highlight")}
 	</div>
 </div>
@@ \ No newline at end of file @@

0 comments (0 inline, 0 general)