improve anonymous segment list

Author: tzi

plugins/SegmentEditor/javascripts/Segmentation.js

@@ -163,10 +163,13 @@ Segmentation = (function($) {
                 + ' ' + self.translations['General_DefaultAppended']
                 + '</span>';
             var comparisonService = window.CoreHome.ComparisonsStoreInstance;
-            if (comparisonService.isComparisonEnabled()
-                || comparisonService.isComparisonEnabled() === null // may not be initialized since this code is outside of Vue
+            if (
+                comparisonService.isComparisonEnabled() ||
+                comparisonService.isComparisonEnabled() === null // may not be initialized since this code is outside of Vue
             ) {
-                listHtml += '<span class="compareSegment allVisitsCompareSegment" title="' + _pk_translate('SegmentEditor_CompareThisSegment') + '"></span>';
+                const className = 'compareSegment allVisitsCompareSegment ' + (self.segmentAccess === 'write' ? 'allVisitsCompareSegment--write' : '');
+                const title = _pk_translate('SegmentEditor_CompareThisSegment');
+                listHtml += '<span class="' + className + '" title="' + title + '"></span>';
             }
             listHtml += '</li>';
 

plugins/SegmentEditor/stylesheets/segmentation.less

@@ -232,6 +232,10 @@ div.scrollable {
     min-width: 206px;
 }
 
+.segmentationContainer hr {
+  margin: 10px 0;
+}
+
 .segmentationContainer .submenu ul {
     display: flex;
     flex-direction: column;
@@ -387,7 +391,9 @@ div.scrollable {
 
         &.allVisitsCompareSegment {
             margin-left: 20px;
-            margin-right: 20px;
+        }
+        &.allVisitsCompareSegment--write {
+          margin-right: 20px;
         }
     }