Skip to content

Instantly share code, notes, and snippets.

@Jabbslad
Forked from mewmew/ten-seconds.md
Created March 3, 2021 00:31
Show Gist options
  • Save Jabbslad/31fc02cb2904947e28588394fcdb5264 to your computer and use it in GitHub Desktop.
Save Jabbslad/31fc02cb2904947e28588394fcdb5264 to your computer and use it in GitHub Desktop.

Revisions

  1. @veggiedefender veggiedefender created this gist Mar 1, 2021.
    43 changes: 43 additions & 0 deletions ten-seconds.md
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,43 @@
    # Ten seconds to ponder if a thread is worth it

    ![recording](https://user-images.githubusercontent.com/8890878/109542775-8419da00-7a93-11eb-9d0b-b11439f972cc.gif)

    A userstyle that makes you wait ten seconds before entering a Hacker News thread. I use [stylus](https://github.com/openstyles/stylus) to manage mine.

    ```css
    .subtext {
    display: inline-block;
    background: linear-gradient(to left, transparent 50%, #f60 50%) right;
    background-position: 100% 0%;
    background-size: 200%;
    transition: background 0.2s;
    }

    .subtext:hover {
    background-position: left;
    transition: background 10s linear;
    }

    .subtext a[href^="item"] {
    pointer-events: none;
    }

    .subtext:hover a[href^="item"] {
    animation: enable-click 10.01s forwards;
    }

    /* workaround because pointer-events is not animatable */
    @keyframes enable-click {
    0% {
    pointer-events: none;
    }

    99% {
    pointer-events: none;
    }

    100% {
    pointer-events: auto;
    }
    }
    ```