
Show HN: DSLR Webcam List (Cam Link Compatible) - dewey
https://notmyhostna.me/webcam/
======
tedyoung
UI: recommend moving the search box closer to the list itself. Right now doing
a search isn't obvious that it changed anything.

Recommend using positive labels instead of negative ones, e.g., replace "Not
fully compatible" with "Fully Compatible" (not quite sure what "compatible"
means here, though).

Combine the two columns for resolution, not sure why these are separate?

You also have "Connection" twice.

Compatibility: what does "full", "partial", and "none" mean?

The last column has links, but they don't look like links.

As of this comment, can't scroll horizontally on desktop, the
overflow-x:scroll needs to be on the container div.

~~~
dewey
Good feedback, thanks a lot! I'll work my way through the list.

It's basically based on the list from Elgato
([https://www.elgato.com/en/gaming/cam-link/camera-
check](https://www.elgato.com/en/gaming/cam-link/camera-check)) right now
that's why some labels are "negative". I removed these now, I think they are
mostly used for their interface as they display in different ways if something
is recommended or needs some customization.

------
tedyoung
These aren't (all) DSLR, many are mirrorless (would be good to label which are
which). I know that seems pedantic, but mirrorless cameras are better able to
run unlimited video out, vs. DSLRs that may timeout after a while.

------
iamben
The table list is cut off for me (unless I zoom my browser right out). You
could probably add:

display: block; overflow-x: scroll;

as an inline style or to your CSS for the table (which has the ID 'example')
and you'll get a horizontal scroll bar on it.

~~~
dewey
Thanks, I just pushed the fix!

------
leeoniya
you should remove `display: block` from <table> and add `position: sticky;
top: 0;` to <thead>.

otherwise the table becomes worthless as soon as the header is out of view.

~~~
dewey
Fixed, thanks for that! I'm not really a frontend developer and whipped this
up during breakfast...as you can see :)

~~~
leeoniya
sorry, i misled you. you cannot add sticky to thead, you have to apply it to
the cells:

    
    
        thead th {
          position: sticky;
          top: 0;
          background: white;
        }

~~~
dewey
For some reason that works locally but not when deployed. Slightly confused.
Thanks for the hint, I'll figure it out :)

