Greasy Fork

[SOLVED] LetterBox

http://letterboxd.com

Letterbox is a site for recording movies you have watched. Problem is they do not make it obvious as to what you watched without hovering over a movie poster.

Now when you hover over a movie poster it highlights the poster with a green bar around it. What I was wondering was if someone could have it highlight all movies seen with it.

Luckily the site adds a CSS class to the watched movies, so just add this userstyle to Stylish:

v2: (fullsize overlay)

@-moz-document domain("letterboxd.com") {

.film-watched:after {
    left:0; top:0; right:0; bottom:0;
    display:block; content:" "; position:absolute; z-index:999;
    background-color: rgba(255,128,0, 0.3);
    border: 1px solid orange;
}

}

v3: (small circle overlay)

@-moz-document domain("letterboxd.com") {

.film-watched:after {
    left:15px; bottom:15px; width:20px; height:20px; border-radius:10px;
    display:block; content:" "; position:absolute; z-index:999;
    background-color: rgba(255,128,0,0.5);
}

}

Nope. Didn't work.

Seems to work here.

Works on the front page and works on the movie page but when looking through an actors list it comes up blank.

Shows it:


Does not show anything:

I've updated the code.

Thanks

OK. Works great for coloring movies you seen. Only real issue now is that I can no longer click on the movie to look at it.

This is a minor issue since all I have to do is turn off the style and I can access it but I thought you might like to know about it.

See v3 above.