Karena kita tidak bisa lagi menggunakan ::selection ini tidak mungkin lagi seperti pada versi VS Code saat ini.
Ada beberapa tantangan ketika mendekati masalah ini:
- Pilihan saat ini digambar di bawah teks dalam baris, yang juga dapat memiliki warna latar belakang. Pemisahan ini bagus dan merupakan ide yang baik untuk menjaga rendering seleksi benar-benar terpisah dari rendering baris.
- Karena tidak setiap elemen dalam .xterm-rows tidak dibungkus dalam elemennya sendiri, pemilihan dapat dimulai atau diakhiri di tengah elemen, yang membatasi beberapa solusi.
Satu ide:
- Manfaatkan gagasan bahwa seleksi dibagi menjadi 3 bagian; baris atas, baris tengah, baris bawah (seperti pada https://github.com/sourcelair/xterm.js/pull/691)
- Elemen baris tengah dalam
.xterm-rowsdapat ditandai dengan kelasxterm-invert-selectionyang membalikkan warna latar belakang dan latar depan melalui CSS. - Baris atas dan bawah dapat digambar di atas baris menggunakan
z-index: 1dan konten sebenarnya dari baris ditambahkan ke pilihan.aria-hiddenkemudian dapat ditambahkan untuk ukuran yang baik untuk memastikan itu tidak dibacakan dua kali.
Tidak yakin apakah itu solusi yang tepat, saya tidak terlalu suka duplikasi teks dalam solusi di atas tetapi setidaknya hanya pada 2 baris.
Tyriar
Semua 4 komentar
@Tyriar Memberikan ini beberapa pemikiran, saya khawatir ide Anda di atas tidak akan berfungsi setelah kami mengirimkan dukungan warna yang sebenarnya. Saya khawatir kita harus membagi latar belakang / seleksi / latar depan menjadi lapisan terpisah, dan kemudian memanipulasi latar depan dan latar belakang yang ada di dalam seleksi. Saya akan mencoba membaginya menjadi beberapa lapisan setelah kita menggabungkan truecolor.
mofux
pada 25 Jul 2017
Ini lebih bagus untuk dimiliki, saya tidak berpikir kami ingin berkompromi dengan kinerja/arsitektur atau apa pun untuk memungkinkan ini. https://github.com/sourcelair/xterm.js/issues/720 jauh lebih penting.
Tyriar
pada 28 Jul 2017
Saya tidak punya waktu untuk PR sekarang, tetapi saya menemukan bahwa kami dapat menggunakan properti css mix-blend-mode untuk menyelesaikan ini dengan penyaji dengan upaya yang sangat rendah:
.xterm-selection-layer {
mix-blend-mode: exclusion;
}
Selain itu, bahkan dengan pemilihan warna yang tidak buram, ini akan membuat latar depan, pemilihan, dan latar belakang terlihat:
.xterm-selection-layer {
mix-blend-mode: multiply;
}
Sayangnya, tampaknya tidak didukung oleh Edge atm.
mofux
pada 5 Jan 2018
Penutupan karena ini jauh lebih kompleks daripada yang tampaknya benar dan tidak ada yang memilihnya. Plus itu akan menjadi pilihan lain.
Tyriar
pada 7 Okt 2019
Masalah terkait
Tyriar
·
4Komentar
tandatle
·
3Komentar
pfitzseb
·
3Komentar
albinekb
·
4Komentar
LB-J
·
3Komentar
Komentar yang paling membantu
Saya tidak punya waktu untuk PR sekarang, tetapi saya menemukan bahwa kami dapat menggunakan properti css
mix-blend-modeuntuk menyelesaikan ini dengan penyaji dengan upaya yang sangat rendah:Selain itu, bahkan dengan pemilihan warna yang tidak buram, ini akan membuat latar depan, pemilihan, dan latar belakang terlihat:
Sayangnya, tampaknya tidak didukung oleh Edge atm.