Стилизация чередующихся строк в редакторе атомов

Я просматривал настройки редактора атомов и решил внести простое изменение, чтобы показать другой цвет для чередующихся строк, чтобы я мог видеть, что происходит при переносе строки.

Похоже, что редактор не отображает строки по порядку:

Пример выделения строки в редакторе Atom

Как вы можете видеть в строке 26, я пытаюсь сделать так, чтобы каждая четная строка имела разный цвет фона, но строки 12, 13 и 14 выделены.

Глядя на инструменты разработчика (Command-option-i на Mac), видно, что строки хранятся в документе не по порядку, поэтому они чередуются, но не так, как они выделяются на экране.

Есть ли способ постоянно выделять чередующиеся строки?

Изменить:

Я также попытался добавить стиль к номерам строк:

.editor .line[data-screen-row]:nth-child(2n) {
  background-color:red;
}

У этого также есть проблемы, также я заметил, что при переносе строк им присваивается новый номер строки.


atom-editor css
person Totoro    schedule 01.01.2015    source источник
comment
Мне также было интересно, может ли кто-нибудь объяснить, почему документы хранятся таким странным образом?   -  person Totoro    schedule 01.01.2015
comment
Я добавил проблему на странице проблемы атома github.com/atom/atom/issues/4829< /а>   -  person Totoro    schedule 02.01.2015

Ответы (2)


arrow_upward
0
arrow_downward

Я не думаю, что то, о чем вы просите, возможно с учетом того, как в настоящее время спроектирован Atom. Насколько я понимаю, строки размещаются в DOM в любом порядке, наиболее целесообразном во время их вставки/модификации, а затем позиционируются на экране с использованием абсолютного позиционирования, как вы можете видеть в атрибуте style каждого div.

person Lee    schedule 02.01.2015

arrow_upward
0
arrow_downward

Это может быть не самое красивое решение, но вам поможет:

atom-text-editor::shadow .line[data-screen-row$="0"],
atom-text-editor::shadow .line[data-screen-row$="2"],
atom-text-editor::shadow .line[data-screen-row$="4"],
atom-text-editor::shadow .line[data-screen-row$="6"],
atom-text-editor::shadow .line[data-screen-row$="8"] {
  background-color: #292929;
}
person Aaron Contreras    schedule 19.05.2015