Shadow DOM

keymaps/merge-conflicts.cson

@@ -8,13 +8,13 @@
 # For more detailed documentation see
 # https://atom.io/docs/latest/advanced/keymaps
 
-'.editor.conflicted':
+'atom-text-editor.conflicted':
   'ctrl-m down': 'merge-conflicts:next-unresolved'
   'ctrl-m up': 'merge-conflicts:previous-unresolved'
   'ctrl-m enter': 'merge-conflicts:accept-current'
   'ctrl-m r': 'merge-conflicts:revert-current'
   'ctrl-m 1': 'merge-conflicts:accept-ours'
   'ctrl-m 2': 'merge-conflicts:accept-theirs'
 
-'.workspace':
+'atom-workspace':
   'ctrl-m d': 'merge-conflicts:detect'

stylesheets/merge-conflicts.atom-text-editor.less

@@ -0,0 +1,20 @@
+@import "variables";
+
+.conflict-resolved {
+  background: @resolved-line-color;
+}
+
+.conflict-ours {
+  background: @ours-line-color;
+  &.cursor-line { background: @ours-current-color; }
+}
+
+.conflict-theirs {
+  background: @theirs-line-color;
+  &.cursor-line { background: @theirs-current-color; }
+}
+
+.conflict-dirty {
+  background: @dirty-line-color;
+  &.cursor-line { background: @dirty-current-color; }
+}

stylesheets/merge-conflicts.less

@@ -1,16 +1,4 @@
-// The ui-variables file is provided by base themes provided by Atom.
-//
-// See https://github.com/atom/atom-dark-ui/blob/master/stylesheets/ui-variables.less
-// for a full listing of what's available.
-@import "ui-variables";
-
-@ours-line-color: mix(@ui-site-color-1, @base-background-color);
-@ours-current-color: darken(@ours-line-color, 10%);
-@theirs-line-color: mix(@ui-site-color-2, @base-background-color);
-@theirs-current-color: darken(@theirs-line-color, 10%);
-@dirty-line-color: darken(@ui-site-color-5, 40%);
-@dirty-current-color: darken(@ui-site-color-5, 30%);
-@resolved-line-color: @background-color-highlight;
+@import "variables";
 
 .merge-conflicts {
   .navigate {
@@ -60,35 +48,9 @@
   .stage .text-success { display: none; }
 }
 
-// Temporary React editor workaround.
-.panes .pane .item-views > .react > .overlay.resolver {
-  left: 50%;
-  padding: 10px;
-  bottom: auto;
-}
-
-.editor {
-  .conflict-resolved {
-    background: @resolved-line-color;
-  }
-}
-
-.editor.conflicted {
-  .conflict-ours {
-    background: @ours-line-color;
-    &.cursor-line { background: @ours-current-color; }
-  }
-
-  .conflict-theirs {
-    background: @theirs-line-color;
-    &.cursor-line { background: @theirs-current-color; }
-  }
-
-  .conflict-dirty {
-    background: @dirty-line-color;
-    &.cursor-line { background: @dirty-current-color; }
-  }
-
+// This targetting is temporary until SideViews work as overlay decorations.
+// See https://github.com/smashwilson/merge-conflicts/pull/93 for progress.
+.overlayer {
   .side {
     padding: 0 20px;
     width: 100%;

stylesheets/variables.less

@@ -0,0 +1,9 @@
+@import "ui-variables";
+
+@ours-line-color: mix(@ui-site-color-1, @base-background-color);
+@ours-current-color: darken(@ours-line-color, 10%);
+@theirs-line-color: mix(@ui-site-color-2, @base-background-color);
+@theirs-current-color: darken(@theirs-line-color, 10%);
+@dirty-line-color: darken(@ui-site-color-5, 40%);
+@dirty-current-color: darken(@ui-site-color-5, 30%);
+@resolved-line-color: @background-color-highlight;