Merge pull request #3073 from overleaf/pr-highlight-styling-and-beta

New highlight styling + highlight in beta

GitOrigin-RevId: e5d308bd725b4a1cfc4f0e564af05663ac4188dc

services/web/frontend/js/ide/editor/directives/aceEditor.js

@@ -556,7 +556,6 @@ App.directive('aceEditor', function(
 
       let currentFirstVisibleRow = null
       const emitMiddleVisibleRowChanged = () => {
-        if (!window.user.alphaProgram) return
         const firstVisibleRow = editor.getFirstVisibleRow()
         if (firstVisibleRow === currentFirstVisibleRow) return
 

services/web/frontend/js/ide/outline/OutlineManager.js

@@ -39,7 +39,6 @@ class OutlineManager {
     })
 
     scope.$on('cursor:editor:update', (event, cursorPosition) => {
-      if (!window.user.alphaProgram) return
       if (this.ignoreNextCursorUpdate) {
         this.ignoreNextCursorUpdate = false
         return
@@ -49,7 +48,6 @@ class OutlineManager {
     })
 
     scope.$on('scroll:editor:update', (event, middleVisibleRow) => {
-      if (!window.user.alphaProgram) return
       if (this.ignoreNextScroll) {
         this.ignoreNextScroll = false
         return

services/web/frontend/stylesheets/app/editor/outline.less

@@ -182,7 +182,7 @@
 }
 
 .outline-item-link-highlight {
-  font-weight: bold;
+  background-color: @outline-highlight-bg;
 }
 
 .outline-caret-icon {

services/web/frontend/stylesheets/core/ol-light-variables.less

@@ -60,6 +60,7 @@
 // File outline
 @outline-line-guide-color: @ol-blue-gray-1;
 @outline-header-hover-bg: @file-tree-item-hover-bg;
+@outline-highlight-bg: mix(@file-tree-bg, @ol-blue-gray-1);
 
 @vertical-resizable-resizer-bg: @ol-blue-gray-1;
 @vertical-resizable-resizer-hover-bg: @file-tree-item-hover-bg;

services/web/frontend/stylesheets/core/variables.less

@@ -1020,7 +1020,7 @@
 @outline-expand-collapse-color: @ol-blue-gray-2;
 @outline-no-items-color: @ol-blue-gray-2;
 @outline-header-hover-bg: @ol-blue-gray-6;
-
+@outline-highlight-bg: tint(@file-tree-bg, 15%);
 @vertical-resizable-resizer-bg: @ol-blue-gray-5;
 @vertical-resizable-resizer-hover-bg: @ol-blue-gray-6;