The forum of the forums
Would you like to react to this message? Create an account in a few clicks or log in to continue.

Border change color then there's new post

3 posters

Go down

Solved Border change color then there's new post

Post by unownus June 17th 2023, 9:28 pm

Hello.
I want to do that border-top color will change, then the new post appeared, or then the new post in categories.

css code:
Code:
.lastpost {
    width: 150px;
    padding: 15px;
    background: #F7F7F7;
    text-align: center;
    font: 700 8px/120% Montserrat, sans-serif;
    text-transform: uppercase;
    color: #777;
    display: block;
    overflow: hidden;
    margin-left: 160px;
    border-top: 10px solid;
    border-top-color: #000000; /* Pradinė spalva (juoda) */
    transition: border-top-color 0.5s ease; /* Pritaikyti spalvos pakeitimui animaciją */
}

.lastpost.new {
    border-top-color: #ff0000; /* Naujo pranešimo spalva (raudona) */
}
javacript code:
Code:
function addNewPost() {
    var lastpostElement = document.querySelector('.lastpost');
    lastpostElement.style.borderTopColor = '#ff0000';
}

//  addNewPost() after time
setTimeout(addNewPost, 2000);

it only work on one categorie, and its working even there is no new posts.
Border change color then there's new post 354525114_954107965843793_2729182113106841988_n.png?_nc_cat=111&ccb=1-7&_nc_sid=ae9488&_nc_ohc=pAG0xV9QiD8AX99kCxX&_nc_ht=scontent.fvno8-1


Last edited by unownus on June 26th 2023, 1:55 pm; edited 1 time in total
unownus
unownus
New Member

Posts : 6
Reputation : 1
Language : lithuanian

Back to top Go down

Solved Re: Border change color then there's new post

Post by Niko June 17th 2023, 10:50 pm

Dear @unownus

can you provide your forum URL and your forum version? (phpBB3, phpBB2, Invision, PunBB, AwesomeBB, ModernBB)

Thanks a lot :rose:

also, are we talking about this part? the last column?
Border change color then there's new post Scree153
Niko
Niko
Helper
Helper

Male Posts : 3131
Reputation : 246
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

unownus likes this post

Back to top Go down

Solved Re: Border change color then there's new post

Post by unownus June 19th 2023, 12:15 am

oh sorry, i forgot
forum: https://afterdark.forumlt.com/
version: phpBB2
and yes, im talking about the last column
unownus
unownus
New Member

Posts : 6
Reputation : 1
Language : lithuanian

Back to top Go down

Solved Re: Border change color then there's new post

Post by Niko June 19th 2023, 1:31 am

Are you sure it is not phpBB3? because some parts in the code are from phpBB3 and not phpBB2 Embarassed

In the meantime, go to your CSS stylesheet from the ACP and add this - to add the border Wink
Code:
.lastpost {
    border-top: 6px solid black;
}

.lastpost.new {
    border-top: 6px solid red!important;
}
Niko
Niko
Helper
Helper

Male Posts : 3131
Reputation : 246
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

TonnyKamper likes this post

Back to top Go down

Solved Re: Border change color then there's new post

Post by Razor12345 June 21st 2023, 10:38 am

Good afternoon!

Is your request complete?
if your request is complete, please mark it as Solved.


Border change color then there's new post Screen51
Razor12345
Razor12345
Support Moderator
Support Moderator

Male Posts : 1548
Reputation : 266
Language : Ukr, Rus, Eng
Location : Ukraine

Back to top Go down

Solved Re: Border change color then there's new post

Post by unownus June 24th 2023, 12:57 pm

Niko wrote:Are you sure it is not phpBB3? because some parts in the code are from phpBB3 and not phpBB2 Embarassed

In the meantime, go to your CSS stylesheet from the ACP and add this - to add the border Wink
Code:
.lastpost {
    border-top: 6px solid black;
}

.lastpost.new {
    border-top: 6px solid red!important;
}
yes, im sure it's phpBB2
it can be some codes from phpBB3, because im new in coding, so i dont know everything Very Happy

but it's still not working somehow..
i think the problem can be in javascript
unownus
unownus
New Member

Posts : 6
Reputation : 1
Language : lithuanian

Back to top Go down

Solved Re: Border change color then there's new post

Post by Niko June 24th 2023, 1:08 pm

@unownus and can you confirm that you added this code in ACP > Display > Images & Colors > Colors > CSS Stylesheet and then saved?

Code:
.lastpost {
    width: 150px;
    padding: 15px;
    background: #F7F7F7;
    text-align: center;
    font: 700 8px/120% Montserrat, sans-serif;
    text-transform: uppercase;
    color: #777;
    display: block;
    overflow: hidden;
    margin-left: 160px;
    border-top: 10px solid #000000!important;
    transition: border-top-color 0.5s ease;
}
 
.lastpost.new {
    border-top-color: #ff0000!important
}

because the code works for me Embarassed
Niko
Niko
Helper
Helper

Male Posts : 3131
Reputation : 246
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

Back to top Go down

Solved Re: Border change color then there's new post

Post by unownus June 25th 2023, 6:40 pm

no, it's still doesn't work..
unownus
unownus
New Member

Posts : 6
Reputation : 1
Language : lithuanian

Back to top Go down

Solved Re: Border change color then there's new post

Post by Niko June 26th 2023, 1:43 am

@unownus checking your CSS code, the code I mentioned above is not present Embarassed
can you keep it installed?
Niko
Niko
Helper
Helper

Male Posts : 3131
Reputation : 246
Language : English, Italian, French
Location : Italy

https://www.fmcodes.net/

Back to top Go down

Solved Re: Border change color then there's new post

Post by Razor12345 June 26th 2023, 1:02 pm

Good afternoon!

You've changed the phpbb2 templates quite a bit. This template is unrecognizable.

Unfortunately, I was never able to register on your forum, so I worked with what is available as a guest.

Since you don't use forum icons, there is another way to check for new messages - the image-link to the last post ( https://2img.net/i.postimg.cc/PJKCr4Rs/OLD.png ). I don't know the link to the image responsible for the unread new message on your forum.

If there are new posts in the forum section, the border will be red, but if the user read the last post in the section and there are more new posts in it, the border will still change color to black.

AP - Display - Templates - General - index_box

At the end of the template, insert the code:

Code:
<script>
 
  window.addEventListener('load', function() {
     
     let newMes = document.querySelectorAll('img[src="LINK TO UNREAD MESSAGE ICON"]');
        let noNewMes =document.querySelectorAll('img[src="https://2img.net/i.postimg.cc/PJKCr4Rs/OLD.png"]');
     newMes.forEach(item => {
          item.closest('.lastpost').style.borderTopColor = 'red';
            item.closest('.lastpost').style.borderTopWidth = '5px';
           item.closest('.lastpost').style.borderTopStyle = 'solid';
     });
        noNewMes.forEach(item => {
          item.closest('.lastpost').style.borderTopColor = 'black';
            item.closest('.lastpost').style.borderTopWidth = '5px';
           item.closest('.lastpost').style.borderTopStyle = 'solid';
  });
  });
</script>

Save. Publish.

Result:

Border change color then there's new post Scree182

Pay attention to this line. This is where the link to the image should be inserted.
Code:
let newMes = document.querySelectorAll('img[src="LINK TO UNREAD MESSAGE ICON"]');


Border change color then there's new post Screen51
Razor12345
Razor12345
Support Moderator
Support Moderator

Male Posts : 1548
Reputation : 266
Language : Ukr, Rus, Eng
Location : Ukraine

TonnyKamper and unownus like this post

Back to top Go down

Solved Re: Border change color then there's new post

Post by unownus June 26th 2023, 1:54 pm

thank you, now it's working  Border change color then there's new post 1f60d
unownus
unownus
New Member

Posts : 6
Reputation : 1
Language : lithuanian

Back to top Go down

Solved Re: Border change color then there's new post

Post by Razor12345 June 26th 2023, 1:57 pm

You are welcome!

Problem solved & topic archived.
Please read our forum rules: ESF General Rules


Border change color then there's new post Screen51
Razor12345
Razor12345
Support Moderator
Support Moderator

Male Posts : 1548
Reputation : 266
Language : Ukr, Rus, Eng
Location : Ukraine

Back to top Go down

Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum