rename styles add jp variable styles

src/debugger.ts

@@ -152,8 +152,8 @@ export namespace Debugger {
       this._codeValue = observableString;
     }
 
-    get selectCurrentLine() {
-      return this._selectCurrentLine;
+    get currentLineChanged() {
+      return this._currentLineChanged;
     }
 
     dispose(): void {
@@ -176,7 +176,7 @@ export namespace Debugger {
     private _session: IDebugger.ISession | null;
     private _sessionChanged = new Signal<this, void>(this);
     private _service = new DebugService(null, this);
-    private _selectCurrentLine = new Signal<this, number>(this);
+    private _currentLineChanged = new Signal<this, number>(this);
   }
 
   export namespace Model {

src/handlers/cell.ts

@@ -30,7 +30,7 @@ export class CellManager implements IDisposable {
       this.clearGutter(this.activeCell);
     });
 
-    this._debuggerModel.selectCurrentLine.connect((_, lineNumber) => {
+    this._debuggerModel.currentLineChanged.connect((_, lineNumber) => {
       this.showCurrentLine(lineNumber);
     });
   }
@@ -47,9 +47,17 @@ export class CellManager implements IDisposable {
     if (this.activeCell) {
       const editor = this.activeCell.editor as CodeMirrorEditor;
       editor.doc.eachLine(line => {
-        editor.editor.removeLineClass(line, 'wrap', 'highlight');
+        editor.editor.removeLineClass(
+          line,
+          'wrap',
+          'jp-breakpoint-line-highlight'
+        );
       });
-      editor.editor.addLineClass(lineNumber - 1, 'wrap', 'highlight');
+      editor.editor.addLineClass(
+        lineNumber - 1,
+        'wrap',
+        'jp-breakpoint-line-highlight'
+      );
     }
   }
 

src/service.ts

@@ -68,7 +68,7 @@ export class DebugService {
       });
       if (index === 0) {
         this._model.sidebar.variables.model.scopes = values;
-        this._model.selectCurrentLine.emit(frame.line);
+        this._model.currentLineChanged.emit(frame.line);
       }
     });
 

style/breakpoints.css

@@ -11,9 +11,9 @@
   position: absolute;
   left: -35px;
   top: -1px;
-  color: #f22;
+  color: var(--jp-error-color1);
 }
 
-.highlight {
-  background-color: orange;
+.jp-breakpoint-line-highlight {
+  background-color: var(--jp-warn-color0);
 }