Make the change list in the commit view a little nicer by styling the

individual change types with colored markers and apply a little help
hint to each of them.
This commit is contained in:
Thomas Keller 2011-01-26 02:27:08 +01:00
parent 4eb34044ff
commit 52d76cd146
2 changed files with 43 additions and 5 deletions

View File

@ -29,20 +29,20 @@
<td> <td>
<table class="changes"> <table class="changes">
{foreach $changes.deletions as $filename} {foreach $changes.deletions as $filename}
<tr><td>D</td><td>{$filename}{if !empty($diff.files[$filename])} (<a href="#diff-{$filename|md5}">{trans 'full'}</a>){/if}</td></tr> <tr><td><span class="scm-action deleted" title="{trans 'deleted'}">D</span></td><td>{$filename}{if !empty($diff.files[$filename])} (<a href="#diff-{$filename|md5}">{trans 'full'}</a>){/if}</td></tr>
{/foreach} {/foreach}
{foreach $changes.renames as $oldname => $newname} {foreach $changes.renames as $oldname => $newname}
<tr><td>R</td><td><a href="{url 'IDF_Views_Source::tree', array($project.shortname, $commit, $newname)}">{$oldname} -> {$newname}</a></td></tr> <tr><td><span class="scm-action renamed" title="{trans 'renamed'}">R</span></td><td><a href="{url 'IDF_Views_Source::tree', array($project.shortname, $commit, $newname)}">{$oldname} -> {$newname}</a></td></tr>
{/foreach} {/foreach}
{foreach $changes.additions as $filename} {foreach $changes.additions as $filename}
<tr><td>A</td><td><a href="{url 'IDF_Views_Source::tree', array($project.shortname, $commit, $filename)}">{$filename}</a>{if !empty($diff.files[$filename])} (<a href="#diff-{$filename|md5}">{trans 'full'}</a>){/if}</td></tr> <tr><td><span class="scm-action added" title="{trans 'added'}">A</span></td><td><a href="{url 'IDF_Views_Source::tree', array($project.shortname, $commit, $filename)}">{$filename}</a>{if !empty($diff.files[$filename])} (<a href="#diff-{$filename|md5}">{trans 'full'}</a>){/if}</td></tr>
{/foreach} {/foreach}
{foreach $changes.patches as $filename} {foreach $changes.patches as $filename}
{assign $ndiff = count($diff.files[$filename]['chunks'])} {assign $ndiff = count($diff.files[$filename]['chunks'])}
<tr><td>M</td><td><a href="{url 'IDF_Views_Source::tree', array($project.shortname, $commit, $filename)}">{$filename}</a>{if !empty($diff.files[$filename])} (<a href="#diff-{$filename|md5}">{blocktrans $ndiff}{$ndiff} diff{plural}{$ndiff} diffs{/blocktrans}</a>){/if}</td></tr> <tr><td><span class="scm-action patched" title="{trans 'modified'}">M</span></td><td><a href="{url 'IDF_Views_Source::tree', array($project.shortname, $commit, $filename)}">{$filename}</a>{if !empty($diff.files[$filename])} (<a href="#diff-{$filename|md5}">{blocktrans $ndiff}{$ndiff} diff{plural}{$ndiff} diffs{/blocktrans}</a>){/if}</td></tr>
{/foreach} {/foreach}
{foreach $changes.properties as $filename => $properties} {foreach $changes.properties as $filename => $properties}
<tr><td>P</td><td><a href="{url 'IDF_Views_Source::tree', array($project.shortname, $commit, $filename)}">{$filename}</a> <tr><td><span class="scm-action property-changed" title="{trans 'properies changed'}">P</span></td><td><a href="{url 'IDF_Views_Source::tree', array($project.shortname, $commit, $filename)}">{$filename}</a>
<table class="properties"> <table class="properties">
{foreach $properties as $key => $value} {foreach $properties as $key => $value}
<tr><td>{$key}</td> <tr><td>{$key}</td>

View File

@ -956,3 +956,41 @@ ol > li {
.context > .expander div.input-with-delete.default { .context > .expander div.input-with-delete.default {
opacity: 0.5; opacity: 0.5;
} }
/**
* SCM action icons in the commit view
*/
span.scm-action {
display: inline-block;
line-height: 9px;
font-size: 9px;
text-align: center;
padding: 2px;
width: 9px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
color: white;
cursor: default;
}
span.scm-action.added {
background-color: darkgreen;
}
span.scm-action.deleted {
background-color: darkred;
}
span.scm-action.patched {
background-color: orange;
}
span.scm-action.renamed {
background-color: purple;
}
span.scm-action.property-changed {
background-color: blue;
}