Support » Plugin: WHA Crossword » Amazing plugin, just needed a CSS snippet to make it more fun

  • Thank you for this AMAZING plugin! It works really well.

    I made the CSS snippet below to customize it a little bit. Btw, I noticed that when you’re filling a word, and then, erase a letter, the row is still green. With this snippet, the row is yellow so you know something’s wrong.

    Hope this snippet will be useful for someone else! đŸ™‚

    /**
     * Customize the crossword
     */
     .wha-square.wha-letter.wha-first div.wha-counter{
        font-family: Quicksand, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
        padding: 2px;
        top: -0.4rem;
        right: auto;
        left: -0.5rem;
        background-color: #fff;
        border: inherit;
        border-radius: 1rem;
        width: auto;
        height: auto;
        font-size: 0.7rem;
        padding: 2px 4px;
        font-weight: 900;
        text-align: center;
     }
     .wha-square{
        border-radius: 6px;
        font-family: Quicksand, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
     }
     #wha-crossword input.wha-char{
        font-size: 1.4rem;
     }
     .wha-crossword-questions{
        max-width: 600px !important;
     }
     .wha-square[style*="background-color: rgb(179, 255, 180);"]{
        background-color:#ffd000 !important;
     }
     .wha-square.wha-letter.wha-correct{
        background-color: #699644 !important;
     }
     .wha-square.wha-letter.wha-error{
        background-color: #db2a35 !important;
     }
     .wha-square.wha-letter.wha-error input, .wha-square.wha-letter.wha-correct input{
        color: #fff !important;
     }

    Feature request: It would be great if, when you write the letters, you didn’t have to click ENTER to move to the next box. Right after you write a letter, you should be automatically redirected to the next box.

    Thank you so much for this plugin!

    Cheers,

  • The topic ‘Amazing plugin, just needed a CSS snippet to make it more fun’ is closed to new replies.