Switched handling of minimum event width to CSS

css/laps.css

@@ -39,6 +39,7 @@
   transition: width 0.6s ease;
   position: absolute;
   border-left: 1px solid #f5f5f5;
+  min-width: 2px;
 }
 #wpadminbar .laps-timeline .event-theme {
   background-color: #5cb85c;

css/laps.less

@@ -51,6 +51,7 @@
 		.transition(width .6s ease);
 		position: absolute; // disable stacking at start
 		border-left: 1px solid @timeline-bg;
+		min-width: 2px;
 	}
 
 	.laps-timeline .event-theme {

src/class-laps.php

@@ -252,15 +252,9 @@ class Laps {
 				if ( $offset == $last_offset ) {
 					$key = count( $query_data ) - 1;
 					$query_data[$key]['sql'] .= '<br />' . $sql;
+
 					$last_duration += $duration;
-					$width = round( $last_duration / $total * 100, 2 );
+					$width                     = round( $last_duration / $total * 100, 2 );
-
-					if ( 0 == $width ) {
-						$width = '2px';
-					} else {
-						$width .= '%';
-					}
-
 					$query_data[$key]['width'] = $width;
 
 					continue;
@@ -270,12 +264,6 @@ class Laps {
 				$last_offset   = $offset;
 				$last_duration = $duration;
 
-				if ( 0 == $width ) {
-					$width = '2px';
-				} else {
-					$width .= '%';
-				}
-
 				$query_data[] = compact( 'sql', 'duration', 'offset', 'width', 'category' );
 			}
 		}

views/laps.mustache

@@ -7,7 +7,7 @@
 {{#savequeries}}
 <div class="laps-timeline">
 	{{#queries}}
-		<div class="event event-{{category}}" title="{{sql}}" style="width:{{width}}; left:{{offset}}%;"></div>
+		<div class="event event-{{category}}" title="{{sql}}" style="width:{{width}}%; left:{{offset}}%;"></div>
 	{{/queries}}
 </div>
 {{/savequeries}}