Adopt codicons

src/vs/base/browser/ui/scrollbar/horizontalScrollbar.ts

@@ -36,7 +36,7 @@ export class HorizontalScrollbar extends AbstractScrollbar {
 			let scrollbarDelta = (options.horizontalScrollbarSize - ARROW_IMG_SIZE) / 2;
 
 			this._createArrow({
-				className: 'left-arrow',
+				className: 'scra codicon codicon-triangle-left',
 				top: scrollbarDelta,
 				left: arrowDelta,
 				bottom: undefined,
@@ -47,7 +47,7 @@ export class HorizontalScrollbar extends AbstractScrollbar {
 			});
 
 			this._createArrow({
-				className: 'right-arrow',
+				className: 'scra codicon codicon-triangle-right',
 				top: scrollbarDelta,
 				left: undefined,
 				bottom: undefined,

src/vs/base/browser/ui/scrollbar/media/arrow-down-dark.svg

-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11 11"><path transform="rotate(-180 5.49045991897583,5.811500072479248)" fill="#E8E8E8" d="m9.48046,8.9615l1.26,-1.26l-5.04,-5.04l-5.46,5.04l1.26,1.26l4.2,-3.78l3.78,3.78z"/></svg>
\ No newline at end of file

src/vs/base/browser/ui/scrollbar/media/arrow-down.svg

-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11 11"><path transform="rotate(-180 5.49045991897583,5.811500072479248)" fill="#424242" d="m9.48046,8.9615l1.26,-1.26l-5.04,-5.04l-5.46,5.04l1.26,1.26l4.2,-3.78l3.78,3.78z"/></svg>
\ No newline at end of file

src/vs/base/browser/ui/scrollbar/media/arrow-left-dark.svg

-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11 11"><path transform="rotate(-90 5.490459918975831,5.431382179260254)" fill="#E8E8E8" d="m9.48046,8.58138l1.26,-1.26l-5.04,-5.04l-5.46,5.04l1.26,1.26l4.2,-3.78l3.78,3.78z"/></svg>
\ No newline at end of file

src/vs/base/browser/ui/scrollbar/media/arrow-left.svg

-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 11 11"><path transform="rotate(-90 5.490459918975831,5.431382179260254)" fill="#424242" d="m9.48046,8.58138l1.26,-1.26l-5.04,-5.04l-5.46,5.04l1.26,1.26l4.2,-3.78l3.78,3.78z"/></svg>
\ No newline at end of file

src/vs/base/browser/ui/scrollbar/media/arrow-right-dark.svg

-<svg viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg"><path transform="rotate(90 5.6171650886535645,5.55808973312378) " fill="#E8E8E8" d="m9.60717,8.70809l1.26,-1.26l-5.04,-5.04l-5.46,5.04l1.26,1.26l4.2,-3.78l3.78,3.78z"/></svg>
\ No newline at end of file

src/vs/base/browser/ui/scrollbar/media/arrow-right.svg

-<svg viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg"><path transform="rotate(90 5.6171650886535645,5.55808973312378) " fill="#424242" d="m9.60717,8.70809l1.26,-1.26l-5.04,-5.04l-5.46,5.04l1.26,1.26l4.2,-3.78l3.78,3.78z"/></svg>
\ No newline at end of file

src/vs/base/browser/ui/scrollbar/media/arrow-up-dark.svg

-<svg viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg"><path d="m9.48046,8.9615l1.26,-1.26l-5.04,-5.04l-5.46,5.04l1.26,1.26l4.2,-3.78l3.78,3.78z" fill="#E8E8E8"/></svg>
\ No newline at end of file

src/vs/base/browser/ui/scrollbar/media/arrow-up.svg

-<svg viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg"><path d="m9.48046,8.9615l1.26,-1.26l-5.04,-5.04l-5.46,5.04l1.26,1.26l4.2,-3.78l3.78,3.78z" fill="#424242"/></svg>
\ No newline at end of file

src/vs/base/browser/ui/scrollbar/media/scrollbars.css

@@ -4,38 +4,9 @@
  *--------------------------------------------------------------------------------------------*/
 
 /* Arrows */
-.monaco-scrollable-element > .scrollbar > .up-arrow {
-	background: url('arrow-up.svg');
-	cursor: pointer;
-}
-.monaco-scrollable-element > .scrollbar > .down-arrow {
-	background: url('arrow-down.svg');
-	cursor: pointer;
-}
-.monaco-scrollable-element > .scrollbar > .left-arrow {
-	background: url('arrow-left.svg');
-	cursor: pointer;
-}
-.monaco-scrollable-element > .scrollbar > .right-arrow {
-	background: url('arrow-right.svg');
+.monaco-scrollable-element > .scrollbar > .scra {
 	cursor: pointer;
-}
-
-.hc-black .monaco-scrollable-element > .scrollbar > .up-arrow,
-.vs-dark .monaco-scrollable-element > .scrollbar > .up-arrow {
-	background: url('arrow-up-dark.svg');
-}
-.hc-black .monaco-scrollable-element > .scrollbar > .down-arrow,
-.vs-dark .monaco-scrollable-element > .scrollbar > .down-arrow {
-	background: url('arrow-down-dark.svg');
-}
-.hc-black .monaco-scrollable-element > .scrollbar > .left-arrow,
-.vs-dark .monaco-scrollable-element > .scrollbar > .left-arrow {
-	background: url('arrow-left-dark.svg');
-}
-.hc-black .monaco-scrollable-element > .scrollbar > .right-arrow,
-.vs-dark .monaco-scrollable-element > .scrollbar > .right-arrow {
-	background: url('arrow-right-dark.svg');
+	font-size: 11px !important;
 }
 
 .monaco-scrollable-element > .visible {
@@ -137,4 +108,4 @@
 
 .hc-black .monaco-scrollable-element .shadow.top.left {
 	box-shadow: none;
-}
\ No newline at end of file
+}

src/vs/base/browser/ui/scrollbar/verticalScrollbar.ts

@@ -37,7 +37,7 @@ export class VerticalScrollbar extends AbstractScrollbar {
 			let scrollbarDelta = (options.verticalScrollbarSize - ARROW_IMG_SIZE) / 2;
 
 			this._createArrow({
-				className: 'up-arrow',
+				className: 'scra codicon codicon-triangle-up',
 				top: arrowDelta,
 				left: scrollbarDelta,
 				bottom: undefined,
@@ -48,7 +48,7 @@ export class VerticalScrollbar extends AbstractScrollbar {
 			});
 
 			this._createArrow({
-				className: 'down-arrow',
+				className: 'scra codicon codicon-triangle-down',
 				top: undefined,
 				left: scrollbarDelta,
 				bottom: arrowDelta,