input typing caret
Unanswered
Nile tilapia posted this in #help-forum
Nile tilapiaOP
Does anyone know if there is a way to edit the typing caret? i am trying to recreate the typing caret from the linux terminal
https://i.givemeyourcreditcard.info/71yofyvg.png
https://i.givemeyourcreditcard.info/71yofyvg.png
19 Replies
caret-shape: block
Nile tilapiaOP
1 sec I can look when I get to my pc
damn and the way they show you can fake it is not actually in a input
oh... i didn't see that
Nile tilapiaOP
its fine
but yeah safe to say there is no easy way to do this, you need some css shenanigans or js libs
browsers dont support that css property yet
Nile tilapiaOP
do you know any ts libs that can do something like this?
i don't know any, but searching for some at the moment
you can use monaco editor if it's suitable for your purpose, it has
cursorStyle: "block"
but it's not for every type of input
that's the only way i can find honestly. other than that, you can kinda do it by
* get the position of the caret (search on google, there are some stackoverflow questions with working but ugly code but that's the best we can do)
* use css to render a fake blinking rectangle absolutely positioned to the position calculated above
* use
but i can't imagine the amount of edge cases this method has. what if someone resizes the browser? what to do when the input is unfocused? and a ton of other questions that you need to answer
* get the position of the caret (search on google, there are some stackoverflow questions with working but ugly code but that's the best we can do)
* use css to render a fake blinking rectangle absolutely positioned to the position calculated above
* use
caret-color
to hide the caretbut i can't imagine the amount of edge cases this method has. what if someone resizes the browser? what to do when the input is unfocused? and a ton of other questions that you need to answer
Nile tilapiaOP
does it work on the default text input
No it doesn’t
Nile tilapiaOP
💀
then what does it work with
Go read what it is
Nile tilapiaOP
i might just wait until they add native support because i cant find anything on monaco editor for react i may just be blind and dont feel like messing around with a very not well put together work around