SideBySide shows a stripe for nonexistent lines

This makes nonexistent lines more distinguishable so we
no longer let inserted/deleted/equal lines be across column
spans. This should be more consistent to most diff softwares.

Signed-off-by: Jack Cherng <[email protected]>

Author: jfcherng

README.md

@@ -170,15 +170,6 @@ $result = $htmlRenderer->renderArray(json_decode($jsonResult, true));
 ![Side By Side](https://raw.githubusercontent.com/jfcherng/php-diff/v6/example/images/side-by-side-renderer.png)
 
 
-### Renderer: Side By Side (no line numbers)
-
-```php
-<?php $rendererOptions = ['lineNumbers' => false];
-```
-
-![Side By Side](https://raw.githubusercontent.com/jfcherng/php-diff/v6/example/images/side-by-side-renderer-line-numbers-false.png)
-
-
 ### Renderer: Unified
 
 ```diff

example/diff-table.css

@@ -78,7 +78,7 @@
 }
 .diff-wrapper.diff.diff-html .change.change-ins .old, .diff-wrapper.diff.diff-html .change.change-del .new {
   cursor: not-allowed;
-  background: #ebebeb;
+  background: repeating-linear-gradient(-45deg, #ebebeb, #ebebeb 5px, #e0e0e0 5px, #e0e0e0 10px);
 }
 .diff-wrapper.diff.diff-html .change .old {
   background: #fbe1e1;

example/diff-table.scss

@@ -29,6 +29,7 @@
   // color for the nonexistent block
   // for example, there are a deleted line that has no corresponding one
   $bg-color-nonexistent-block: mix($bg-color, $table-sidebar-color, 60%);
+  $bg-color-nonexistent-block-alternative: mix($bg-color, $table-sidebar-color, 40%);
 
   background-color: $bg-color;
   border-collapse: collapse;
@@ -121,7 +122,13 @@
       &.change-ins .old,
       &.change-del .new {
         cursor: not-allowed;
-        background: $bg-color-nonexistent-block;
+        background: repeating-linear-gradient(
+          -45deg,
+          $bg-color-nonexistent-block,
+          $bg-color-nonexistent-block 5px,
+          $bg-color-nonexistent-block-alternative 5px,
+          $bg-color-nonexistent-block-alternative 10px,
+        );
       }
 
       .old {

example/images/side-by-side-renderer-line-numbers-false.png

@@ -126,27 +126,18 @@ protected function renderTableBlockEqual(array $block): string
         // the old and the new may not be exactly the same
         // because of ignoreCase, ignoreWhitespace, etc
         foreach ($block['new']['lines'] as $no => $newLine) {
-            if ($this->options['lineNumbers']) {
-                $oldLine = $block['old']['lines'][$no];
+            $oldLine = $block['old']['lines'][$no];
 
-                $oldLineNum = $block['old']['offset'] + $no + 1;
-                $newLineNum = $block['new']['offset'] + $no + 1;
+            $oldLineNum = $block['old']['offset'] + $no + 1;
+            $newLineNum = $block['new']['offset'] + $no + 1;
 
-                $html .=
-                    '<tr>' .
-                        $this->renderLineNumberColumn('old', $oldLineNum) .
-                        '<td class="old">' . $oldLine . '</td>' .
-                        $this->renderLineNumberColumn('new', $newLineNum) .
-                        '<td class="new">' . $newLine . '</td>' .
-                    '</tr>';
-            } else {
-                // hmm... but there is only space for one line
-                // we could only pick either the old or the new to show
-                $html .=
-                    '<tr>' .
-                        '<td class="new" colspan="2">' . $newLine . '</td>' .
-                    '</tr>';
-            }
+            $html .=
+                '<tr>' .
+                    $this->renderLineNumberColumn('old', $oldLineNum) .
+                    '<td class="old">' . $oldLine . '</td>' .
+                    $this->renderLineNumberColumn('new', $newLineNum) .
+                    '<td class="new">' . $newLine . '</td>' .
+                '</tr>';
         }
 
         return $html;
@@ -162,22 +153,15 @@ protected function renderTableBlockInsert(array $block): string
         $html = '';
 
         foreach ($block['new']['lines'] as $no => $newLine) {
-            if ($this->options['lineNumbers']) {
-                $newLineNum = $block['new']['offset'] + $no + 1;
+            $newLineNum = $block['new']['offset'] + $no + 1;
 
-                $html .=
-                    '<tr>' .
-                        $this->renderLineNumberColumn('', null) .
-                        '<td class="old"></td>' .
-                        $this->renderLineNumberColumn('new', $newLineNum) .
-                        '<td class="new">' . $newLine . '</td>' .
-                    '</tr>';
-            } else {
-                $html .=
-                    '<tr>' .
-                        '<td class="new" colspan="2">' . $newLine . '</td>' .
-                    '</tr>';
-            }
+            $html .=
+                '<tr>' .
+                    $this->renderLineNumberColumn('', null) .
+                    '<td class="old"></td>' .
+                    $this->renderLineNumberColumn('new', $newLineNum) .
+                    '<td class="new">' . $newLine . '</td>' .
+                '</tr>';
         }
 
         return $html;
@@ -193,22 +177,15 @@ protected function renderTableBlockDelete(array $block): string
         $html = '';
 
         foreach ($block['old']['lines'] as $no => $oldLine) {
-            if ($this->options['lineNumbers']) {
-                $oldLineNum = $block['old']['offset'] + $no + 1;
+            $oldLineNum = $block['old']['offset'] + $no + 1;
 
-                $html .=
-                    '<tr>' .
-                        $this->renderLineNumberColumn('old', $oldLineNum) .
-                        '<td class="old">' . $oldLine . '</td>' .
-                        $this->renderLineNumberColumn('', null) .
-                        '<td class="new"></td>' .
-                    '</tr>';
-            } else {
-                $html .=
-                    '<tr>' .
-                        '<td class="old" colspan="2">' . $oldLine . '</td>' .
-                    '</tr>';
-            }
+            $html .=
+                '<tr>' .
+                    $this->renderLineNumberColumn('old', $oldLineNum) .
+                    '<td class="old">' . $oldLine . '</td>' .
+                    $this->renderLineNumberColumn('', null) .
+                    '<td class="new"></td>' .
+                '</tr>';
         }
 
         return $html;