Password Strength Graphics

OK so I've created a test forum with Forumotion to get a better idea of what to propose and I found that the default password strength graphics are pretty naff, so here are some new ones :0







If you are having trouble changing them just give me a PM and I'll help you

Thanks

EDIT: Just made a quick 'Connect With Facebook' icon to, use it if you like...

how to edit them with CSS?

Just go to your CSS and find #cont_pwd, change the width to 150px and height to 20px. Then just below it find .pwd_img and change the color to #fff, set the width to 150px, height to 20px and line-height to 20px.

Then find the following lines of code:
#pwd_good
#pwd_middle
#pwd_bad

and replace the images acording to the image.

Give me some time for the Facebook, I'll have to install that plug in first

Does the CSS editing work for all forum versions? I'm having trouble with punBB

It's the same with PUNBB.

Code:

#pwd_good {
   background:url('http://illiweb.com/fa/p_strength/pwd_good.png');
   }
#pwd_middle {
   background:url('http://illiweb.com/fa/p_strength/pwd_middle.png');
   }
#pwd_bad {
   background:url('http://illiweb.com/fa/p_strength/pwd_bad.png');

Code:

Detected error
We have counted a different number of "{" and of "}". It means your CSS risks to be not valid and will not be posted correctly on your forum.

We advise you to reread your code.

I'm really confused

AlphaPkz wrote:

Code:

Detected error
We have counted a different number of "{" and of "}". It means your CSS risks to be not valid and will not be posted correctly on your forum.

We advise you to reread your code.

I'm really confused

Press it again and even if that message shows it should be fine.

bit too simple , users don't know which one shows what message . You should add some text to show that

AlphaPkz wrote:

Code:

Detected error
We have counted a different number of "{" and of "}". It means your CSS risks to be not valid and will not be posted correctly on your forum.

We advise you to reread your code.

I'm really confused

This happens alot to me - it doesn't really make much difference.

AlphaPkz wrote:

Detected error
We have counted a different number of "{" and of "}". It means your CSS risks to be not valid and will not be posted correctly on your forum.

We advise you to reread your code.

I'm really confused

Try this:

Code:

 #pwd_good {
  background:url('http://illiweb.com/fa/p_strength/pwd_good.png');
  }
#pwd_middle {
  background:url('http://illiweb.com/fa/p_strength/pwd_middle.png');
  }
#pwd_bad {
  background:url('http://illiweb.com/fa/p_strength/pwd_bad.png');
  }

naca007 wrote:bit too simple , users don't know which one shows what message . You should add some text to show that

I can't add text to them, it's added via. the CSS

You mean the CSS add them text ? Than they are cool