Less.js: Warna hex dengan opacity kusut

Dibuat pada 17 Jul 2018  ·  14Komentar  ·  Sumber: less/less.js

Diperbarui menjadi [email protected] setelah itu warna opacity dengan render as

warna-latar belakang: #55555599; -> #55555599 99; (tidak valid)
warna latar: #5559; --> #5559 9; (tidak valid)

bug medium priority

Komentar yang paling membantu

Saya telah memperbarui fungsi color() untuk mengenali #RRGGBBAA serta melakukan beberapa pembaruan untuk menjaga warna dalam ruang warna yang sama. Di masa lalu, semuanya dikonversi ke hex sederhana (jika alfa = 1) atau rgba() untuk kompatibilitas browser. Sekarang, kita dapat menjaga Less lebih konsisten dengan mempertahankan nilai warna seperti yang digunakan. Warna hex dan kata kunci sudah keluar apa adanya, tetapi dengan PR saya, Less akan menghasilkan hsl() dan hsla() apa adanya (kecuali saat menjepit nilai), dan bahkan mempertahankan ruang warna setelah warna operasi seperti darken() atau spin() .

Semua 14 komentar

Apakah Less bahkan mendukung notasi hex rgba sebelumnya?

@rjgotten Tidak secara langsung, tidak. Tapi itu harus melewati (mempertahankan) nilai yang tidak dikenal. Itu mungkin regresinya.

@rjgotten @tapsaman Saya tidak berpikir ini adalah regresi, sebanyak itu belum didukung. Namun, itu hanya beberapa perubahan regex dan perubahan pada simpul warna untuk mendukung formulir ini. Lihat tes di PR untuk verifikasi.

Satu hal yang dilakukan adalah menghapus warna "tidak valid" untuk kompatibilitas di masa mendatang. Tidak sampai Anda mencoba menggunakan warna "tidak valid" dalam operasi warna yang seharusnya menimbulkan kesalahan pada waktu evaluasi. Tetapi Less in 3.0+ lebih memaafkan nilai di properti, jadi ini sepertinya masuk akal untuk dihapus.

Satu hal: haruskah Less mengonversi #RRGGBBAA untuk browser yang tidak kompatibel? Sampai hari ini, IE/Edge tidak memiliki dukungan, dan beberapa browser lain juga tidak. Microsoft belum memberikan indikasi apa pun bahwa mereka akan menerapkannya dalam waktu dekat. Namun, alasan mengapa saya menerapkannya adalah karena pasti ada masalah dengan penguraian dalam fungsi penguraian warna. Itu meraih seluruh string dan menyimpan warna, tetapi tidak memajukan parser jika warnanya 4 atau 8 karakter, itulah sebabnya ia mengulangi digit terakhir.

EDIT: Apa yang saya lakukan adalah mengizinkan konversi oleh penulis ke format rgba() melalui rgba(#55555599) .

Berikut adalah daftar pemikiran yang saya miliki sehubungan dengan ini.

  • Saya tidak yakin itu tugas Less untuk menyadari dukungan browser.
  • Menggabungkan fungsi Less dengan fungsi CSS "terasa" berbahaya, tetapi saya tidak bisa mengatakan alasannya.
  • Kami _DO_ sudah memiliki fungsi argb() dimaksudkan untuk menghasilkan #AARRGGBB .
  • Kami juga memiliki fungsi color() . Apakah itu mendukung #AARRGGBB , #ARGB ?
  • color: #AA334455; dan color: #A345; adalah CSS yang valid (atau dapat diterima), meskipun tidak banyak browser yang _memahami_ bentuk tersebut.
  • Saya ingin tahu apakah casting rbga() adalah lereng yang licin. rgb() , hsl() , dan hsla() adalah semua fungsi CSS juga.
  • Di sisi lain, mengingat Less adalah superset dari CSS, rgba() sangat masuk akal.

tl; dr: Saya pikir kesan pertama saya secara keseluruhan adalah bahwa kita harus memastikan fungsi color() mendukung string ARGB 8- dan 4-digit, karena tampaknya memang itulah tujuannya.

Menggabungkan fungsi Less dengan fungsi CSS "terasa" berbahaya, tetapi saya tidak bisa mengatakan alasannya.

Kapal itu telah berlayar. rgba() telah ada sejak lama sebagai fungsi Less. Tetapi alasan utamanya adalah agar Anda dapat meneruskan warna ke sesuatu seperti lighten() . Artinya, rgba() perlu mengembalikan warna secara internal. Jadi fungsi seperti rgba() _have_ menjadi fungsi Less jika Anda ingin benar-benar menggunakan fungsi warna Less. (misalnya lighten(rgba(50,50,50,0.5), 50%)) Jika tidak, itu hanya akan menjadi panggilan fungsi yang tidak diketahui. Kita harus tahu apa sebenarnya warna _is_ untuk memanipulasi warna tersebut.

Saya ingin tahu apakah casting rbga() adalah lereng yang licin. rgb(), hsl(), dan hsla() adalah semua fungsi CSS juga.

Ya saya kira. Tapi casting adalah cara yang salah untuk memikirkannya. Ini juga mengaktifkan formulir ini: rgba(#777777, 0.5) , yang diizinkan atau akan diizinkan di browser. Itu tidak meluas ke hsla() , itu benar, tetapi implementasi internal jauh lebih sulit dan juga tidak diperlukan jika Anda memiliki metode yang berfungsi.

Kami juga memiliki fungsi color(). Apakah mendukung #AARRGGBB, #ARGB?

Tidak, terima kasih telah menunjukkan ini. Saya bisa menambahkan itu. Meskipun saya bingung mengapa fungsi itu ada sama sekali?

Ini juga mengaktifkan formulir ini: rgba(#777777, 0.5), yang diizinkan atau akan diizinkan di browser.

Untuk kata ulang, formulir ini adalah warna yang valid dalam CSS: rgba(<Color> [, opacity]) . Jadi tidak ada alasan untuk tidak mengizinkan ini.

Kami _DO_ sudah memiliki fungsi argb() dimaksudkan untuk menghasilkan #AARRGGBB .

Urutan ARGB secara khusus digunakan untuk filter DirectShow lama di Internet Explorer.
Sintaks hex 8 atau 4 digit dalam CSS adalah urutan RGBA afaik.

Mendukung keduanya juga membuat secara langsung tidak mungkin untuk mengetahui apakah #000000FF literal mewakili biru transparan penuh (ARGB), atau hitam buram penuh (RGBA).

Saran saya: jatuhkan dukungan warna ARGB. Anda hanya akan membutuhkannya untuk browser IE zaman batu yang sudah lama kehabisan komisi.

Saran saya: jatuhkan dukungan warna ARGB. Anda hanya akan membutuhkannya untuk browser IE zaman batu yang sudah lama kehabisan komisi.

Kami tidak menguji dukungan pada apa pun yang kurang dari IE11, jadi ini adalah ide yang bagus.

@rjgotten Apakah ada kandidat fungsi (atau fitur) lain untuk dihentikan? Saya masih bingung mengapa ada orang yang perlu menulis warna sebagai _string_ di Less dan kemudian mengubahnya menjadi warna menggunakan fungsi color() . Sepertinya itu ditambahkan 4 tahun yang lalu.

Saya masih bingung mengapa ada orang yang perlu menulis warna sebagai string di Less dan kemudian mengubahnya menjadi warna menggunakan fungsi color() .

Satu-satunya hal yang dapat saya bayangkan adalah skenario ekstraksi otomatis.
Misalnya plugin kompleks yang mengintrospeksi gambar latar belakang SVG dan mengekstrak definisi warna darinya untuk mencocokkan penggunaan warna dalam aturan lain, atau semacamnya.

Kasus tepi yang cukup mendalam, saya pikir.

@rjgotten Sayangnya saya tidak dapat menemukan riwayat apa pun dalam masalah yang menjelaskan dari mana asalnya.

Saya telah memperbarui fungsi color() untuk mengenali #RRGGBBAA serta melakukan beberapa pembaruan untuk menjaga warna dalam ruang warna yang sama. Di masa lalu, semuanya dikonversi ke hex sederhana (jika alfa = 1) atau rgba() untuk kompatibilitas browser. Sekarang, kita dapat menjaga Less lebih konsisten dengan mempertahankan nilai warna seperti yang digunakan. Warna hex dan kata kunci sudah keluar apa adanya, tetapi dengan PR saya, Less akan menghasilkan hsl() dan hsla() apa adanya (kecuali saat menjepit nilai), dan bahkan mempertahankan ruang warna setelah warna operasi seperti darken() atau spin() .

Mengejar, saya ikut. Fungsi argb() menurut saya menjawab semua kebutuhan untuk format lama. Ini adalah langkah yang bagus.

Apakah halaman ini membantu?
0 / 5 - 0 peringkat