Skip to content
This repository has been archived by the owner on Sep 6, 2021. It is now read-only.

Fix highlighting 10325 #10737

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open

Fix highlighting 10325 #10737

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
4d13aa8
#10325 First draft to add a highlight on the previous active line in …
aringot Feb 12, 2015
d6414ac
Code a bit cleaner and better-looking colors for the inactive-pane ac…
aringot Mar 5, 2015
d842714
Found a way to apply the highlight to the nested editor. #10325
aringot Mar 13, 2015
65874d4
Merge remote-tracking branch 'upstream/master' into fix-highlighting-…
aringot Mar 13, 2015
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
24 changes: 24 additions & 0 deletions src/styles/brackets_codemirror_override.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -50,14 +50,28 @@
background: transparent;
}

.CodeMirror .CodeMirror-activeline-background {
background: @activeline-bg-unfocused;
}

.CodeMirror-focused .CodeMirror-activeline-background {
background: @activeline-bg;
}

.show-line-padding .CodeMirror .CodeMirror-activeline-background {
box-shadow: inset @code-padding 0 0 0 @activeline-number-bg-unfocused;
}

.show-line-padding .CodeMirror-focused .CodeMirror-activeline-background {
box-shadow: inset @code-padding 0 0 0 @activeline-number-bg;
}

.CodeMirror .CodeMirror-activeline {
.CodeMirror-gutter-elt {
background: @activeline-number-bg-unfocused;
}
}

.CodeMirror-focused .CodeMirror-activeline {
& > div, .CodeMirror-gutter-elt {
height: 100%;
Expand Down Expand Up @@ -252,6 +266,10 @@ div.CodeMirror-cursors {
color: @accent-comment;
}

.CodeMirror .CodeMirror-activeline-background {
background: @activeline-bg-unfocused;
}

.CodeMirror-focused .CodeMirror-activeline-background {
background: @activeline-bg;
}
Expand All @@ -260,6 +278,12 @@ div.CodeMirror-cursors {
box-shadow: inset @code-padding 0 0 0 @background;
}

.CodeMirror .CodeMirror-activeline {
.CodeMirror-gutter-elt {
background: @activeline-number-bg-inline-unfocused;
}
}

.CodeMirror-focused .CodeMirror-activeline {
.CodeMirror-gutter-elt {
background: @activeline-number-bg-inline;
Expand Down
46 changes: 46 additions & 0 deletions src/styles/brackets_theme_default.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,16 @@
@activeline-number-bg: #dee5e6;
@activeline-number-bg-inline: #d7dede;

/* background color of the line that has the cursor in the inactive pane */
@activeline-bg-unfocused: #f1f1f1;
@activeline-number-unfocused: rgba(0, 0, 0, 0.7);
@activeline-number-bg-unfocused: rgba(222, 229, 230, 0.7);
@activeline-number-bg-inline-unfocused: rgba(215, 222, 222, 0.5);

/* same for dark theme */
@activeline-bg-unfocused-dark: rgba(255, 255, 255, 0.04);
@activeline-number-bg-unfocused-dark: rgba(0, 0, 0, 0.4);

/* custom scrollbar colors */
@win-scrollbar-track: rgb(240, 240, 240);
@win-scrollbar-thumb: rgb(206, 206, 206);
Expand Down Expand Up @@ -159,6 +169,17 @@

.dark {
.inline-widget {

.CodeMirror .CodeMirror-activeline-background {
background-color: @activeline-bg-unfocused-dark;
}

.CodeMirror .CodeMirror-activeline {
.CodeMirror-gutter-elt {
background-color: @activeline-number-bg-unfocused-dark;
}
}

color: @dark-bc-text;
background-color: @dark-bc-bg-inline-widget;
border-top: 1px solid rgba(255, 255, 255, 0.1);
Expand Down Expand Up @@ -247,6 +268,31 @@
color: @dark-bc-text-thin-quiet;
}
}

.CodeMirror .CodeMirror-activeline-background {
background-color: @activeline-bg-unfocused-dark;
}

.CodeMirror .CodeMirror-activeline {
.CodeMirror-gutter-elt {
background-color: @activeline-number-bg-unfocused-dark;
}
}

/* For nested editor */
.CodeMirror {
.CodeMirror .CodeMirror-activeline-background {
/* Only way I found to override the normal style*/
background-color: @activeline-bg-unfocused-dark!important;
}

.CodeMirror .CodeMirror-activeline {
.CodeMirror-gutter-elt {
/* Only way I found to override the normal style*/
background-color: @activeline-number-bg-unfocused-dark!important;
}
}
}
}

/* Variables and Mixins for non-code UI elements that can be styled */
Expand Down