Hi,

As also described in https://issues.apache.org/bloodhound/ticket/687 I've had a quick play with making the timeline for the ticket look a little more, um, designed. I'm afraid that it was grating with me!

Hopefully at least some of us will think of this as an improvement. I am not completely happy with it yet but I have done enough to make me ignore it again for a while. As ever.. comments and improvements will be very welcome.

Cheers,
    Gary

On 04/10/13 18:46, [email protected] wrote:
Author: gjm
Date: Fri Oct  4 17:46:05 2013
New Revision: 1529237

URL: http://svn.apache.org/r1529237
Log:
updating the ticket timeline arrow of time and event grouping - towards #687

Removed:
     
bloodhound/trunk/bloodhound_theme/bhtheme/htdocs/img/change_history_arrow_line.png
Modified:
     bloodhound/trunk/bloodhound_theme/bhtheme/htdocs/bloodhound.css
     bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket.html
     bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket_change.html

Modified: bloodhound/trunk/bloodhound_theme/bhtheme/htdocs/bloodhound.css
URL: 
http://svn.apache.org/viewvc/bloodhound/trunk/bloodhound_theme/bhtheme/htdocs/bloodhound.css?rev=1529237&r1=1529236&r2=1529237&view=diff
==============================================================================
--- bloodhound/trunk/bloodhound_theme/bhtheme/htdocs/bloodhound.css (original)
+++ bloodhound/trunk/bloodhound_theme/bhtheme/htdocs/bloodhound.css Fri Oct  4 
17:46:05 2013
@@ -187,12 +187,6 @@ div.reports form {
   font-weight: normal;
  }
-.activityfeed {
-  background-image: url("img/change_history_arrow_line.png");
-  background-repeat: repeat-y;
-  background-position: 20px 0px;
-}
-
  .timeline .activityfeed {
    background-image: none;
  }
@@ -627,6 +621,14 @@ input[type="submit"].btn.btn-micro {
   display: none !important;
  }
+.shade-desktop {
+ opacity: 0.2;
+}
+
+.visible-desktop-hover:hover .shade-desktop {
+ opacity: 1;
+}
+
  .hidden-desktop {
   display: none !important;
  }
@@ -1243,7 +1245,7 @@ table.wiki th {
#changelog div.comment-box{
- border: 1px solid #ccc;
+ border: 2px solid #ccc;
   border-radius: 6px;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05) inset;
   padding: 13px;
@@ -1252,6 +1254,10 @@ table.wiki th {
   min-height: 20px;
  }
+#changelog div.change:hover div.comment-box{
+ border-color: #FFCC33;
+}
+
  #trac-add-comment fieldset{
   width: 100%;
  }
@@ -1267,13 +1273,70 @@ textarea#comment, #trac-add-comment fiel
   content: attr(placeholder-content);
  }
+.uparrow div.change,
+.downarrow div.change {
+  margin-bottom: 3px;
+  padding: 1px 0;
+  position: relative;
+  z-index: 1;
+}
+
+.uparrow div.change:before,
+.uparrow div.change:after,
+.downarrow div.change:before,
+.downarrow div.change:after{
+  background: none repeat scroll 0 0 #CCCCCC;
+  content: "";
+  height: 100%;
+  position: absolute;
+  top: 0;
+  width: 0.5em;
+  z-index: -1;
+}
+
+.uparrow div.change:hover:before,
+.uparrow div.change:hover:after,
+.downarrow div.change:hover:before,
+.downarrow div.change:hover:after {
+  background: none repeat scroll 0 0 #FFCC33;
+}
+
+.uparrow div.change:before,
+.downarrow div.change:before {
+  left: 20px;
+}
+
+.uparrow div.change:after,
+.downarrow div.change:after{
+  left: 15px;
+  right: 100%;
+}
+
+.uparrow div.change:before,
+.downarrow div.change:after {
+  transform: skew(0deg, 26deg);
+  -ms-transform: skew(0deg, 26deg);
+  -webkit-transform: skew(0deg, 26deg);
+}
+
+.uparrow div.change:after,
+.downarrow div.change:before {
+  transform: skew(0deg, -26deg);
+  -ms-transform: skew(0deg, -26deg);
+  -webkit-transform: skew(0deg, -26deg);
+}
+
  #changelog div.comment-box h4 {
    margin-top: 0px;
  }
#changelog ul.changes {
-  list-style-image: url('../common/collapsed.png');
-  padding: 0px 0px 0px 11px;
+  list-style-type: none;
+  margin: 0 0 0 11px;
+}
+
+#changelog ul.changes>li {
+  padding: 0 20px;
  }
.ticket form#prefs input[type="radio"]{

Modified: bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket.html
URL: 
http://svn.apache.org/viewvc/bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket.html?rev=1529237&r1=1529236&r2=1529237&view=diff
==============================================================================
--- bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket.html 
(original)
+++ bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket.html Fri Oct  
4 17:46:05 2013
@@ -288,6 +288,23 @@
            var comment = 
$("#trac-comment-editor").next("div.comment").html(reply);
            comment.toggle(comment.children().length != 0);
          }, "#changelog .trac-loading");
+
+        // quick hack to set arrow direction on change
+        arrow_dir = {
+          'oldest': function() {
+            $('div#changelog').addClass('downarrow');
+            $('div#changelog').removeClass('uparrow');
+          },
+          'newest': function() {
+            $('div#changelog').addClass('uparrow');
+            $('div#changelog').removeClass('downarrow');
+          },
+        };
+
+        $('#trac-comments-newest').change(arrow_dir['newest']);
+        $('#trac-comments-oldest').change(arrow_dir['oldest']);
+        arrow_dir[comments_prefs.comments_order]();
+
          /*]]>*/
          <py:if test="preview_mode">
          $("#attachments").toggleClass("collapsed");
@@ -648,7 +665,7 @@
                </div>
              </div>
- <div class="$cols_activity">
+            <div>
                <!--! Preview of ticket changes -->
                <div py:if="ticket.exists and can_append" id="ticketchange" 
class="ticketdraft"
                      style="${'display: none' if not (change_preview.fields or 
change_preview.comment)

Modified: 
bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket_change.html
URL: 
http://svn.apache.org/viewvc/bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket_change.html?rev=1529237&r1=1529236&r2=1529237&view=diff
==============================================================================
--- bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket_change.html 
(original)
+++ bloodhound/trunk/bloodhound_theme/bhtheme/templates/bh_ticket_change.html 
Fri Oct  4 17:46:05 2013
@@ -59,7 +59,7 @@ Arguments:
          <div class="pull-right">
            <span py:if="'cnum' in change" id="comment:$cnum" 
class="cnum">${commentref('comment:', cnum)}</span>
          </div>
-        <div py:if="show_buttons" class="pull-right bh-ticket-buttons hidden-desktop 
trac-ticket-buttons">
+        <div py:if="show_buttons" class="pull-right bh-ticket-buttons shade-desktop 
trac-ticket-buttons">
            <py:if test="'date' in change">
              ${pretty_dateinfo(change.date)}
            </py:if>
@@ -163,7 +163,7 @@ ${edited_comment if edited_comment is no
              <em>${field.old}</em> deleted
            </i18n:msg></py:otherwise>
          </py:choose>
-        <span class="${'hidden-desktop' if change.cnum else ''}">
+        <span class="${'shade-desktop' if change.cnum else ''}">
          - by ${authorinfo(change.author)}<span py:if="'date' in change">, 
${pretty_dateinfo(change.date)}</span>
          </span>
          <span py:if="field_name == 'attachment' and change.comment" class="attachment-desc 
searchable" xml:space="preserve">



Reply via email to