"New" button, need to make it larger(hard to click for some)

[RichardInTN]

Board URL: buildinggreatness.proboards.com/

The little "NEW" button (that's not really a button, but a link) is hard for some of my members to click because it's kind of tiny. I need to alter it EVERYWHERE to be bigger.

Does anyone know the code to do this, and where I can find it? I could probably figure out how to alter the size to what I need, but I've got no clue where to look. I'm guessing it's in CSS somewhere... but where?

Preferably I would like to NOT do it one theme at a time.... but if I have to, I will.




Thanks in advance,
Richard

[Kami]

If no one provides the CSS for you by tomorrow (i'm away from my computer at the moment) then I will. I just wanted to address you "I don't want to do it for each theme" comment.

Placing CSS between <style></style> tags and putting the whole thing in you global headers will affect the button globally. However, I advise you to make the effort because CSS style sheets are cached by the browser. This means that when a user first visits your forum the stylesheet loads and "saves". That way, the CSS doesn't have to reload every single time they navigate to a different part of the site.

CSS placed outside of a stylesheet file (.css) is not cached, and will reload every single time someone navigates to a new page or refreshes and so on.

This may not seem like much just for the "new" button but it does add up, since I gather from the above statement that you have multiple themes and may in the future want to make more changes across them all. The more CSS you add outside the stylesheets, the more your users will have to load on every page view which does impact load time.

So what i'm saying is that you don't "have" to. You can put CSS anywhere that accepts HTML as long as it's between the appropriate tags. But it's better if you don't.

[RichardInTN]

Oh, I'll make the change wherever appropriate. If that's in the individual style sheets, so be it. I just didn't want to have to if there was a better way. If that's the best way then that's they way I'll go.

(more "old programmer" thinking... OUTSIDE "goto"s {the individual style sheets} is better than INSIDE... Learn something new every day!)

[Lynx]

This is per theme, but no need to go to the stylesheet, as the options are right in the Visual Editor (Admin > Themes > Advanced Styles & CSS > Visual Editor (tab)):

[RichardInTN]

That image jumped off my screen! LOL

Thanks, Lynx

[Kami]

Jan 6, 2017 22:48:05 GMT -8 RichardInTN said:

That image jumped off my screen! LOL

Thanks, Lynx

lol yeah, proboards has the tooltips plugin installed that allows you to preview attachments

[RichardInTN]

Jan 6, 2017 23:19:56 GMT -8 Kami said:

Jan 6, 2017 22:48:05 GMT -8 RichardInTN said:

That image jumped off my screen! LOL

Thanks, Lynx

lol yeah, proboards has the tooltips plugin installed that allows you to preview attachments

I've got that one too... I just wasn't expecting such a ginormous image to pop open. LOL.

[RichardInTN]

Well... That fixes the text part of the "button"... but now the word "NEW" is falling outside of the "button" itself. (the button didn't re-size to fit the bigger text).

Does anyone know where the code for the actual "button"s height is?

[Lynx]

Jan 7, 2017 3:30:33 GMT -8 RichardInTN said:

Well... That fixes the text part of the "button"... but now the word "NEW" is falling outside of the "button" itself. (the button didn't re-size to fit the bigger text).

Does anyone know where the code for the actual "button"s height is?

I think I did that part with CSS (placed at the end of the stylesheet - also is per theme):


/* NEW icon button size */
.new-icon {
  height: 12px;
  width: 12px;
}


Adjust the 12px to your needs.

[RichardInTN]

Now to wait until another member posts something "new"!

[Lynx]

Jan 7, 2017 19:15:23 GMT -8 RichardInTN said:

Now to wait until another member posts something "new"!

No need to. Just go to any thread list, mouse over a thread, tick the checkbox, go to the Actions dropdown, select Mark As New and refresh the page. That's how I test, anyways.

[RichardInTN]

Great idea!

Got some new posts already though... one more little issue, the "button" starts at the top of the text now. and goes down from there (changing "height" adds more "button" or takes it away, but the top is always even with the text). How can I add some "button" ABOVE the text or move the text down in the "button" somehow?


(totally appreciate the assistance, by the way!)

[RichardInTN]

Bump... any suggestions on the "button"s background centering?

[Chris]

Not easy to see a new button as a guest but the HTML for one can be dropped into the DOM so the various CSS rules can then be observed, the problem however is none of the CSS rules that have been discussed in this thread is present in the theme available to guests. So two things: set the theme that has the edits as the default so guest can see them (or migrate the rules to the current default theme) then specify which new button you are referring to since they all have slightly different rules depending on where they are located (in a breadcrumb menu, by the participated button, by thread subject, etc.)

[RichardInTN]

I can do that! (give me a minute)


ETA: It's now included in the "default" (DeviantART) theme.

I didn't want to incorporate it into ALL themes until I was happy with how it looked/worked.