Skip to content

Commit

Permalink
fix: Cursor blink match theme background (#40)
Browse files Browse the repository at this point in the history
  • Loading branch information
@Spiker985
Spiker985 authored Apr 14, 2023
1 parent ba3a2e0 commit 4e3e787
Show file tree
Hide file tree
Showing 2 changed files with 46 additions and 21 deletions.
42 changes: 21 additions & 21 deletions spec/element-spec.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -377,7 +377,7 @@ describe('XTerminalElement', () => {
foreground: '#c5c8c6',
selectionBackground: '#999999',
cursor: '#ffffff',
cursorAccent: '#000000',
cursorAccent: '#1d1f21',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -412,7 +412,7 @@ describe('XTerminalElement', () => {
foreground: '#555555',
selectionBackground: '#afc4da',
cursor: '#000000',
cursorAccent: '#000000',
cursorAccent: '#ffffff',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -448,7 +448,7 @@ describe('XTerminalElement', () => {
selectionBackground: '#b4b7b4',
// selectionForeground: '#e0e0e0',
cursor: '#ffffff',
cursorAccent: '#000000',
cursorAccent: '#1d1f21',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -484,7 +484,7 @@ describe('XTerminalElement', () => {
selectionBackground: '#282a2e',
// selectionForeground: '#e0e0e0',
cursor: '#1d1f21',
cursorAccent: '#000000',
cursorAccent: '#ffffff',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -519,7 +519,7 @@ describe('XTerminalElement', () => {
foreground: '#f81705',
selectionBackground: '#298f16',
cursor: '#009f59',
cursorAccent: '#000000',
cursorAccent: '#0c0047',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -555,7 +555,7 @@ describe('XTerminalElement', () => {
selectionBackground: '#2a2f38',
// selectionForeground: '#b7c5d3',
cursor: '#528bff',
cursorAccent: '#000000',
cursorAccent: '#181d23',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -590,7 +590,7 @@ describe('XTerminalElement', () => {
foreground: 'white',
selectionBackground: '#44475a',
cursor: '#999999',
cursorAccent: '#000000',
cursorAccent: '#1e1f29',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -625,7 +625,7 @@ describe('XTerminalElement', () => {
foreground: 'rgb(255, 240, 165)',
selectionBackground: 'rgba(182, 73, 38, .99)',
cursor: 'rgb(142, 40, 0)',
cursorAccent: '#000000',
cursorAccent: 'rgb(19, 119, 61)',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -695,7 +695,7 @@ describe('XTerminalElement', () => {
foreground: '#000000',
selectionBackground: 'rgba(178, 215, 255, .99)',
cursor: 'rgb(146, 146, 146)',
cursorAccent: '#000000',
cursorAccent: '#ffffff',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -765,7 +765,7 @@ describe('XTerminalElement', () => {
foreground: 'black',
selectionBackground: 'rgba(178, 215, 255, .99)',
cursor: 'rgb(146, 146, 146)',
cursorAccent: '#000000',
cursorAccent: 'rgb(254, 244, 156)',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -800,7 +800,7 @@ describe('XTerminalElement', () => {
foreground: 'rgb(77, 47, 46)',
selectionBackground: 'rgba(155, 153, 122, .99)',
cursor: 'rgb(115, 99, 89)',
cursorAccent: '#000000',
cursorAccent: 'rgb(223, 219, 196)',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -835,7 +835,7 @@ describe('XTerminalElement', () => {
foreground: 'white',
selectionBackground: 'rgba(41, 134, 255, .99)',
cursor: 'rgb(146, 146, 146)',
cursorAccent: '#000000',
cursorAccent: 'rgb(44, 102, 201)',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -870,7 +870,7 @@ describe('XTerminalElement', () => {
foreground: '#abb2bf',
selectionBackground: '#9196a1',
cursor: '#528bff',
cursorAccent: '#000000',
cursorAccent: '#282c34',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -905,7 +905,7 @@ describe('XTerminalElement', () => {
foreground: 'hsl(230, 8%, 24%)',
selectionBackground: 'hsl(230, 1%, 90%)',
cursor: 'hsl(230, 100%, 66%)',
cursorAccent: '#000000',
cursorAccent: 'hsl(230, 1%, 98%)',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -940,7 +940,7 @@ describe('XTerminalElement', () => {
foreground: '#f1f1f1',
selectionBackground: 'rgba(255,255,255,0.25)',
cursor: '#f18260',
cursorAccent: '#000000',
cursorAccent: '#282828',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -1010,7 +1010,7 @@ describe('XTerminalElement', () => {
foreground: 'rgb(215, 201, 167)',
selectionBackground: 'rgba(60, 25, 22, .99)',
cursor: 'white',
cursorAccent: '#000000',
cursorAccent: 'rgb(143, 53, 39)',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -1080,7 +1080,7 @@ describe('XTerminalElement', () => {
foreground: '#000000',
selectionBackground: 'rgba(120, 123, 156, .99)',
cursor: 'rgb(224, 224, 224)',
cursorAccent: '#000000',
cursorAccent: 'rgb(146, 146, 146)',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -1115,7 +1115,7 @@ describe('XTerminalElement', () => {
foreground: '#708284',
selectionBackground: '#839496',
cursor: '#819090',
cursorAccent: '#000000',
cursorAccent: '#042029',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -1150,7 +1150,7 @@ describe('XTerminalElement', () => {
foreground: '#657a81',
selectionBackground: '#ece7d5',
cursor: '#586e75',
cursorAccent: '#000000',
cursorAccent: '#fdf6e3',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -1185,7 +1185,7 @@ describe('XTerminalElement', () => {
foreground: '#000000',
selectionBackground: 'rgba(178, 215, 255, .99)',
cursor: '#ffffff',
cursorAccent: '#000000',
cursorAccent: 'rgb(120, 132, 151)',
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down Expand Up @@ -1221,7 +1221,7 @@ describe('XTerminalElement', () => {
foreground: root.getPropertyValue('--standard-text-color'),
selectionBackground: root.getPropertyValue('--standard-background-color-selected'),
cursor: root.getPropertyValue('--standard-text-color-highlight'),
cursorAccent: '#000000',
cursorAccent: root.getPropertyValue('--standard-app-background-color'),
black: '#2e3436',
red: '#cc0000',
green: '#4e9a06',
Expand Down
25 changes: 25 additions & 0 deletions src/element.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -263,154 +263,179 @@ class XTerminalElementImpl extends HTMLElement {
colors.background = '#1d1f21'
colors.foreground = '#c5c8c6'
colors.selectionBackground = '#999999'
colors.cursorAccent = '#1d1f21'
colors.cursor = '#ffffff'
break
case 'Atom Light':
colors.background = '#ffffff'
colors.foreground = '#555555'
colors.selectionBackground = '#afc4da'
colors.cursorAccent = '#ffffff'
colors.cursor = '#000000'
break
case 'Base16 Tomorrow Dark':
colors.background = '#1d1f21'
colors.foreground = '#c5c8c6'
colors.selectionBackground = '#b4b7b4'
// colors.selectionForeground = '#e0e0e0'
colors.cursorAccent = '#1d1f21'
colors.cursor = '#ffffff'
break
case 'Base16 Tomorrow Light':
colors.background = '#ffffff'
colors.foreground = '#1d1f21'
colors.selectionBackground = '#282a2e'
// colors.selectionForeground = '#e0e0e0'
colors.cursorAccent = '#ffffff'
colors.cursor = '#1d1f21'
break
case 'Christmas':
colors.background = '#0c0047'
colors.foreground = '#f81705'
colors.selectionBackground = '#298f16'
colors.cursorAccent = '#0c0047'
colors.cursor = '#009f59'
break
case 'City Lights':
colors.background = '#181d23'
colors.foreground = '#666d81'
colors.selectionBackground = '#2a2f38'
// colors.selectionForeground = '#b7c5d3'
colors.cursorAccent = '#181d23'
colors.cursor = '#528bff'
break
case 'Dracula':
colors.background = '#1e1f29'
colors.foreground = 'white'
colors.selectionBackground = '#44475a'
colors.cursorAccent = '#1e1f29'
colors.cursor = '#999999'
break
case 'Grass':
colors.background = 'rgb(19, 119, 61)'
colors.foreground = 'rgb(255, 240, 165)'
colors.selectionBackground = 'rgba(182, 73, 38, .99)'
colors.cursorAccent = 'rgb(19, 119, 61)'
colors.cursor = 'rgb(142, 40, 0)'
break
case 'Homebrew':
colors.background = '#000000'
colors.foreground = 'rgb(41, 254, 20)'
colors.selectionBackground = 'rgba(7, 30, 155, .99)'
colors.cursorAccent = '#000000'
colors.cursor = 'rgb(55, 254, 38)'
break
case 'Inverse':
colors.background = '#ffffff'
colors.foreground = '#000000'
colors.selectionBackground = 'rgba(178, 215, 255, .99)'
colors.cursorAccent = '#ffffff'
colors.cursor = 'rgb(146, 146, 146)'
break
case 'Linux':
colors.background = '#000000'
colors.foreground = 'rgb(230, 230, 230)'
colors.selectionBackground = 'rgba(155, 30, 7, .99)'
colors.cursorAccent = '#000000'
colors.cursor = 'rgb(200, 20, 25)'
break
case 'Man Page':
colors.background = 'rgb(254, 244, 156)'
colors.foreground = 'black'
colors.selectionBackground = 'rgba(178, 215, 255, .99)'
colors.cursorAccent = 'rgb(254, 244, 156)'
colors.cursor = 'rgb(146, 146, 146)'
break
case 'Novel':
colors.background = 'rgb(223, 219, 196)'
colors.foreground = 'rgb(77, 47, 46)'
colors.selectionBackground = 'rgba(155, 153, 122, .99)'
colors.cursorAccent = 'rgb(223, 219, 196)'
colors.cursor = 'rgb(115, 99, 89)'
break
case 'Ocean':
colors.background = 'rgb(44, 102, 201)'
colors.foreground = 'white'
colors.selectionBackground = 'rgba(41, 134, 255, .99)'
colors.cursorAccent = 'rgb(44, 102, 201)'
colors.cursor = 'rgb(146, 146, 146)'
break
case 'One Dark':
colors.background = '#282c34'
colors.foreground = '#abb2bf'
colors.selectionBackground = '#9196a1'
colors.cursorAccent = '#282c34'
colors.cursor = '#528bff'
break
case 'One Light':
colors.background = 'hsl(230, 1%, 98%)'
colors.foreground = 'hsl(230, 8%, 24%)'
colors.selectionBackground = 'hsl(230, 1%, 90%)'
colors.cursorAccent = 'hsl(230, 1%, 98%)'
colors.cursor = 'hsl(230, 100%, 66%)'
break
case 'Predawn':
colors.background = '#282828'
colors.foreground = '#f1f1f1'
colors.selectionBackground = 'rgba(255,255,255,0.25)'
colors.cursorAccent = '#282828'
colors.cursor = '#f18260'
break
case 'Pro':
colors.background = '#000000'
colors.foreground = 'rgb(244, 244, 244)'
colors.selectionBackground = 'rgba(82, 82, 82, .99)'
colors.cursorAccent = '#000000'
colors.cursor = 'rgb(96, 96, 96)'
break
case 'Red Sands':
colors.background = 'rgb(143, 53, 39)'
colors.foreground = 'rgb(215, 201, 167)'
colors.selectionBackground = 'rgba(60, 25, 22, .99)'
colors.cursorAccent = 'rgb(143, 53, 39)'
colors.cursor = 'white'
break
case 'Red':
colors.background = '#000000'
colors.foreground = 'rgb(255, 38, 14)'
colors.selectionBackground = 'rgba(7, 30, 155, .99)'
colors.cursorAccent = '#000000'
colors.cursor = 'rgb(255, 38, 14)'
break
case 'Silver Aerogel':
colors.background = 'rgb(146, 146, 146)'
colors.foreground = '#000000'
colors.selectionBackground = 'rgba(120, 123, 156, .99)'
colors.cursorAccent = 'rgb(146, 146, 146)'
colors.cursor = 'rgb(224, 224, 224)'
break
case 'Solarized Dark':
colors.background = '#042029'
colors.foreground = '#708284'
colors.selectionBackground = '#839496'
colors.cursorAccent = '#042029'
colors.cursor = '#819090'
break
case 'Solarized Light':
colors.background = '#fdf6e3'
colors.foreground = '#657a81'
colors.selectionBackground = '#ece7d5'
colors.cursorAccent = '#fdf6e3'
colors.cursor = '#586e75'
break
case 'Solid Colors':
colors.background = 'rgb(120, 132, 151)'
colors.foreground = '#000000'
colors.selectionBackground = 'rgba(178, 215, 255, .99)'
colors.cursorAccent = 'rgb(120, 132, 151)'
colors.cursor = '#ffffff'
break
case 'Standard': {
const root = getComputedStyle(document.documentElement)
colors.background = root.getPropertyValue('--standard-app-background-color')
colors.foreground = root.getPropertyValue('--standard-text-color')
colors.selectionBackground = root.getPropertyValue('--standard-background-color-selected')
colors.cursorAccent = root.getPropertyValue('--standard-app-background-color')
colors.cursor = root.getPropertyValue('--standard-text-color-highlight')
break
}
Expand Down

0 comments on commit 4e3e787

Please sign in to comment.