Inbox alert Icon

Inbox alert Icon v1

No permission to download

Shelley

Well-known member
Shelley submitted a new resource:

Inbox alert Icon (version v1) - This alteration will display a image above the inbox link when you recieve a PC.

0DIvX.png
View attachment 37677

Summary: This alteration will changed the default standard alerts on the inbox and display an envelope icon although I encourage to use a better image than the one I provided. Standard alerts are untouched and will display the balloon.
notes: If you have a custom navigation you may need to re-position the Icon as this was tested on a default installation.

Install: Simply upload the Icon to your...

Read more about this resource...
 
hello, I have done what you indicate (modify the extra.css in templates) and no way to see the envelope when I have a question, change the code so
Code:
.navTabs .inbox .itemCount {
background: url("images/icons/alert_inbox.png") no-repeat scroll center transparent;
line-height: 13px;
box-shadow: none;
height: 22px;
min-width: 25px;
color: #4c4c4c;
top: -13px;}
 
.navTabs .inbox .itemCount .arrow { border-width: 0; }
 
Just seen this. Just what I needed. Users are asking for this and PM popup on new message. One problem solved. Thanks Shelley.
 
I use Ubuntu, which means there is no direct way to convert a psd to svg file. I can open a psd and save it in many file formats, including psd, but there is no direct path from psd to svg in Ubuntu. Which is odd, because I can save any other file format into a svg, but if you know anything about image quality, saving png for example into an svg does not upscale the quality.

Anyways.... I wanted this as an svg for higher resolution support.

Here is the code I used

Extra.css
PHP:
/* Notice alert icon */
.navTabs .inbox .itemCount {
    background: url("@imagePath/xenforo/icons/envelope.svg") no-repeat scroll center transparent;
    line-height: 20px;
    box-shadow: none;
    height: 20px;
    min-width: 25px;
    color: #4c4c4c;
    top: -13px;}

.navTabs .inbox .itemCount .arrow { border-width: 0; }
/* END Notice alert icon */

Attached is both the small svg icon I used and the original large (very large at 1488x1448) svg that you may change and edit if you wish.
 

Attachments

Back
Top Bottom