Skip to content

Blinking text Effect

Customisation
3 2 1.3k 1
  • Hello 🙂

    small blinking text effect that I put on the name of my forum:

    here the code :

    :root {
         --site-title-blink: #CCCCCC;
    }
    
    /*Blink text effect */
    @keyframes text-blink {
        0%,
        20%,
        22%,
        25%,
        28%,
        55%,
        80%,
        100% {
            text-shadow: 0 0 2px #000,
                0 0 10px var(--site-title-blink),
                0 0 5px var(--site-title-blink),
                0 0 25px var(--site-title-blink);
            opacity: 1;
            color: var(--site-title-blink);
        }
    
        21%,
        24%,
        56% {
            opacity: 0.2;
            text-shadow: none;
        }
    }
    
    .navbar-default .navbar-brand {
        animation: 0.5s text-blink 1.5s infinite alternate;
        animation-iteration-count: 5;
        animation-duration: 1000ms;
    }
    
  • DownPWundefined DownPW marked this topic as a regular topic on
  • Hello 🙂

    small blinking text effect that I put on the name of my forum:

    here the code :

    :root {
         --site-title-blink: #CCCCCC;
    }
    
    /*Blink text effect */
    @keyframes text-blink {
        0%,
        20%,
        22%,
        25%,
        28%,
        55%,
        80%,
        100% {
            text-shadow: 0 0 2px #000,
                0 0 10px var(--site-title-blink),
                0 0 5px var(--site-title-blink),
                0 0 25px var(--site-title-blink);
            opacity: 1;
            color: var(--site-title-blink);
        }
    
        21%,
        24%,
        56% {
            opacity: 0.2;
            text-shadow: none;
        }
    }
    
    .navbar-default .navbar-brand {
        animation: 0.5s text-blink 1.5s infinite alternate;
        animation-iteration-count: 5;
        animation-duration: 1000ms;
    }
    

    @DownPW looks great ! Has that “broken neon light” look that you see in films. When I saw the title of this post, I instantly thought of the flashing text everyone had on their website in the 90’s and early 00’s but I like this effect a lot.

    Custom-Bates-Motel-No-Vacancy-Glass-Neon-Light-Sign-Beer-Bar.jpg_Q90.jpg_.webp

  • @DownPW looks great ! Has that “broken neon light” look that you see in films. When I saw the title of this post, I instantly thought of the flashing text everyone had on their website in the 90’s and early 00’s but I like this effect a lot.

    Custom-Bates-Motel-No-Vacancy-Glass-Neon-Light-Sign-Beer-Bar.jpg_Q90.jpg_.webp

    @phenomlab

    I love it too

    @phenomlab said in Blinking text Effect:

    Has that “broken neon light” look that you see in films.

    It’s exactly that, kind of old neon signs of bar or pubs a bit cyberpunk too 😉


Related Topics
  • Nodebb to Xenforo

    Solved Configure xenforo nodebb
    3
    0 Votes
    3 Posts
    468 Views
    @cagatay as @downpw stated, there isn’t a native tool that will do this for you. You’d need to either develop your own or ask the nodebb team to assist which will be a paid exercise.
  • Bug in Nodebb route when clicking title

    Moved Configure nodebb
    3
    2 Votes
    3 Posts
    1k Views
    Ah silly me, thanks for finding that!
  • 36 Votes
    55 Posts
    20k Views
    @DownPW I see why. The code relies on the existence of [component="topic/quickreply/container"] However, this by definition means that the below has to be enabled [image: 1679077966615-aeef638f-4188-489d-a9f2-f3a26dbca9d8-image.png] It will then work [image: 1679077992245-7fb38631-e0f3-46ef-b652-00929d927b13-image.png] For some unknown reason, this is hidden in Harmony, and only shows if you select it. In v2, it seems that the <section> is deleted altogether in Persona if “Quick Reply” is disabled, meaning it won’t fire as it can’t locate that specific component. The downside is that you might not want the quick reply function, but I think it’s a PITA to scroll up to the top of the post just to reply, so I have it on
  • 14 Votes
    69 Posts
    46k Views
    @phenomlab Seems to be better with some scaling fix for redis on redis.conf. I haven’t seen the message yet since the changes I made # I increase it to the value of /proc/sys/net/core/somaxconn tcp-backlog 4096 # I'm uncommenting because it can slow down Redis. Uncommented by default !!!!!!!!!!!!!!!!!!! #save 900 1 #save 300 10 #save 60 10000 If you have other Redis optimizations. I take all your advice https://severalnines.com/blog/performance-tuning-redis/
  • The best css to customize our logo?

    Solved Customisation css
    2
    1 Votes
    2 Posts
    2k Views
    @Sala This should look better .sidenav .navbar-brand { padding-top: 0.5rem; padding-bottom: 0.5rem; } [image: 1669026666905-e5cec20e-be36-4ee8-9129-fd11ad4656ac-image.png] You can increase the top and bottom padding by increasing the values above.
  • 9 Votes
    32 Posts
    12k Views
    @DownPW said in Bottom footer navbar button extend: Oh my god, it’s beautiful mark I liked this design so much, I’ve implemented it here. I intend to do a lot more with the footer in due course, so hiding it makes a lot of sense. Thanks @DownPW for the idea and initial concept
  • Link Text Colour.

    Solved Customisation customise
    5
    2
    2 Votes
    5 Posts
    2k Views
    @phenomlab Thx again for the reply. Well I am sure that it will be well worth the wait. I will watch with anticipation. For now it is OK. Just small minor irritations I fell in a lot of NodeBB ‘default’ things.
  • Dark Theme Upper Padding

    Solved Customisation nodebb
    7
    1
    6 Votes
    7 Posts
    2k Views
    @DownPW great! thanks a lot… this code solves my problem.