Advertisement:

Author Topic: Increasing the font/size of the "unread posts" nav link  (Read 489 times)

Offline Steelponycowboy

  • Semi-Newbie
  • *
  • Posts: 12
Increasing the font/size of the "unread posts" nav link
« on: November 14, 2019, 03:15:17 PM »
Just upgraded to 2.1RC2 and have people who can't find the Nav Bar for "Unread Topics" or say it needs to be bigger and bolder.

How can I do this,  I can't seem to find the line of code where I can change font size and make it bold.

Offline Kindred

  • The Mean One
  • Support Specialist
  • SMF Legend
  • *
  • Posts: 58,632
  • Gender: Male
    • Kindred-999 on GitHub
Re: Increasing the font/size of the "unread posts" nav link
« Reply #1 on: November 14, 2019, 03:17:22 PM »
there should be no code edits required...   use the browser inspect tool, find the CSS referencing that text and than change the index.css file for that class/ID
Please do not PM, IM or Email me with support questions.  You will get better and faster responses in the support boards.  Thank you.

Offline Steelponycowboy

  • Semi-Newbie
  • *
  • Posts: 12
Re: Increasing the font/size of the "unread posts" nav link
« Reply #2 on: November 14, 2019, 03:20:08 PM »
Ok , I'm lost  :-\

Offline Bob Perry of Web Presence Consulting

  • Sophist Member
  • *****
  • Posts: 1,018
  • Gender: Male
  • (T)ogether (E)veryone (A)chieves (M)ore
    • Bobert921 on Facebook
    • https://www.linkedin.com/in/bperry921/ on LinkedIn
    • @bperry921 on Twitter
    • Web Presence Consulting
Re: Increasing the font/size of the "unread posts" nav link
« Reply #3 on: November 14, 2019, 09:53:57 PM »
Ok , I'm lost  :-\
He's referring to changing a .css file as opposed to changing .php source "code" file, recommend creating a test directory with an exact copy of everything in the root smf directory and experiment before changing your production files, this would also require a fresh database install (which you'll need to create on cpanel first)... may be a bit more complicated sounding than it really is, so until you feel comfortable with that you could also just be certain you keep a valid copy of your current site downloaded to safe place on your hard drive, separate from where you normally work from... if you are into smf managing long term you'll find mastering these procedures is essential, the more routinely you make copies the better...
Best Regards,
Bob Perry



"The world is moving so fast these days that the man who says it can't be done is generally interrupted by someone doing it." Elbert Hubbard

Offline skb

  • Jr. Member
  • **
  • Posts: 374
    • Metabolically Challenged
Re: Increasing the font/size of the "unread posts" nav link
« Reply #4 on: November 15, 2019, 03:24:26 AM »
In Themes/Default/CSS/index.css find
Code: [Select]
.navigate_section ul {
margin: 4px 0 0 0;
padding: 0 10px;
font-size: 0.9em;
overflow: hidden;
border: 1px solid #ddd;
border-radius: 2px;
box-shadow: 0 -2px 2px rgba(0, 0, 0, 0.08);
}

Change the font-size or add "font-weight: bold;" below that.
Learning, every day.
Forum - The Diabetic Pub
Because every diabetic needs help
SMF 2.1 RC2 (default theme) / TP 1.6.2

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,846
  • Master of BBC Abuse
Re: Increasing the font/size of the "unread posts" nav link
« Reply #5 on: November 15, 2019, 04:03:29 PM »
Or make it bright red, and put a CSS animation on it so it flashes on and off. Add dancing banana gifs for added visibility. Then wait for them to complain again. :D

(If you're feeling evil, I am happy to provide code for all of this.)

Offline Arantor

  • Resident Overthinker
  • SMF Friend
  • SMF Legend
  • *
  • Posts: 71,982
    • StoryBB/StoryBB on GitHub
Re: Increasing the font/size of the "unread posts" nav link
« Reply #6 on: November 15, 2019, 04:05:31 PM »
Animate it to spin round every so often.
Don’t try to tell me that some power can corrupt a person. You haven’t had enough to know what it’s like.

No good deed goes unpunished / No act of charity goes unresented.

Offline Steelponycowboy

  • Semi-Newbie
  • *
  • Posts: 12
Re: Increasing the font/size of the "unread posts" nav link
« Reply #7 on: November 16, 2019, 04:05:51 PM »
Or make it bright red, and put a CSS animation on it so it flashes on and off. Add dancing banana gifs for added visibility. Then wait for them to complain again. :D

(If you're feeling evil, I am happy to provide code for all of this.)

I like how you think,  yes please provide the the code  ;D

Oh, SKB,  thanks for the suggestion, worked perfectly !

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,846
  • Master of BBC Abuse
Re: Increasing the font/size of the "unread posts" nav link
« Reply #8 on: November 16, 2019, 07:44:42 PM »
Ok, I'll fire up local tonight and get some code together. It's always fun doing evil things.

This is a good nudge for me anyway. There's another SMF thing I really should finish off (got sidetracked...).

Offline Antechinus

  • SMF Friend
  • SMF Super Hero
  • *
  • Posts: 24,846
  • Master of BBC Abuse
Re: Increasing the font/size of the "unread posts" nav link
« Reply #9 on: November 17, 2019, 03:15:48 PM »
Here ya go. :D

Add this to the end of index.css:

Code: [Select]
/* Deadly disco ball. */
.navigate_section ul {
    padding: 4px 4px 0 10px;
}
.navigate_section a, .navigate_section em, .navigate_section span {
display: inline-block;
line-height: 36px;
}
.navigate_section .unread_links {
padding: 0 70px;
background-image: url(../images/banana.gif), url(../images/banana.gif);
background-position: 0 0, 100% 0;
background-repeat: no-repeat, no-repeat;
}
.unread_links a:first-child {
color: red;
font-weight: 700;
animation: B1_flash 1s infinite;
}
.unread_links a:nth-child(2) {
color: rebeccapurple;
font-weight: 700;
animation: B2_flash 1s infinite;
}
@keyframes B1_flash {
0% {
opacity: 0;
}
50% {
opacity: 1;
}
100% {
opacity: 0;
}
}
@keyframes B2_flash {
0% {
opacity: 1;
}
50% {
opacity: 0;
}
100% {
opacity: 1;
}
}

And add the attached image to Themes/default/images.
« Last Edit: November 17, 2019, 03:35:46 PM by Antechinus »

Offline Steelponycowboy

  • Semi-Newbie
  • *
  • Posts: 12
Re: Increasing the font/size of the "unread posts" nav link
« Reply #10 on: November 17, 2019, 06:08:15 PM »
THANKS !