[Template] Change Mini Profile Width

[pawl]

This modification will show you how to change the width of the mini-profiles that appear next to posts and pm's, as it's not as easy as you might think. To begin with, if you want to decrease the size of the mini-profile you'll have to reduce the max avatar size, for which you'll need to read this thread - it only takes a minute though.

Once you're done, read on....


Head to your style sheet - Admin Panel -> Themes -> Colours & Styles -> Style Sheet

At approx line 975 you should find the following;

.posts .post .left-panel { width: 172px; vertical-align: top; }
Change the purple text to the width you'd like the entire mini profile to be (that is, the box with the border). Make sure that it's at least as wide as your max avatar width, ideally just a little wider.

Approx line 1031 you should find this line, make the same edit as above;

.messages .item .left-panel { width: 172px; }


The next number you need to change is on approx line 1138;

.mini-profile { color: @mini_text_color; font: @mini_text_font; background: @mini_background; border: @mini_border; .rounded-corners(@mini_border_radius); text-align: @mini_text_align; overflow: hidden; padding: 13px 10px; width: 150px; }
The number in red wants to be just smaller (by maybe 20px or so) than your .left-panel width above.


If you're making the mini-profile smaller, you're done. Sit back and relax!
If however you're making it bigger, there's one more thing you need to do.

Still in the stylesheet, approx. line 976, look for this;

.posts .post .content { padding-left: 10px; vertical-align: top; }
The number in blue needs to be increased by the same amount you've widened your mini-profile. If you've gone from the default 172px to 200px (an increase of 28px), then you need to go from 10px here to 38px.
This will stop your posts from overlapping into the mini-profile.

The same then needs to be done to the following line, approx 1036;
.messages .item .content { padding-left: 10px; word-wrap: break-word; overflow-x: auto; overflow-y: hidden; }

And there, we're done!



As ever feel free to reply if you're stuck, have a question, or think I've made a mistake. =]

[tunescool]

 paul i changed the first line and not the second one because i was having problems changing the sizes

i can see the size of the post changed but the mini profile didnt change size

thenotablenook.freemessageboards.com/thread/22025/bv-fhj-druh?scrollTo=24638

[pawl]

Can you remove the changes for me, go back to what you had before? =]

[tunescool]

alrite

[pawl]

Right, forum looks normal again.
This thread, just the first two (line 1150, and line 1157 - both '150px' to the new value)

Save. You shouldn't actually see any difference on the link you provided, because your avatar won't be shrinking.


Then follow my post, for lines 1129 and 966.

Have tested it on a couple of my v5 forums, no problems.

ed; are you trying to make the miniprofile smaller or larger?

[tunescool]

i dont want to change the avatar size

i changed what you said what would change the mini profile width but it didnt, youre now saying to change my avatar size, i dont want to change that

[pawl]

Are you trying to make the mini-profile thinner, or wider?
If you're trying to make it thinner (which is what I'd understood), then you'll have to reduce the size of the avatar limits, otherwise they will overlap into the post area. The mini-profile is currently 172px wide, and your avatar can be up to 150px wide. If you decrease the mini-profile size to say 125px wide, anyone with a full size avatar (like one made in the avatar creator) will have it display over their posts.
The rest of the post should automatically stretch the distance - example here

If you're trying to make the mini-profile wider then you won't need to decrease them, just follow my original post in this thread.

[tunescool]

i did again but it still dint get wider, but you cann see that the  post is more to the right, theres the width i set it to, 250px, from the left side of the miniprofile to the left side of the post. but the mini profile is the same

[pawl]

That's because you've only changed the first number (the .left-panel one), and not the next two. The red and blue numbers in the first post still need changing. =]

[tunescool]

the second one just moves the top of the post, in the green

my mini profile hasnt moved once from the left green line to the rite green once

[pawl]

Looking through your CSS now;

Line 1138;
.mini-profile {
color: #000000;
font: normal 700 12px Tahoma, Geneva, sans-serif;
background: #ffffff repeat fixed url('http://i709./ww95/tunescool/grey12.jpg');
border: 2px solid #000000;
border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
text-align: center;
overflow: hidden;
padding: 13px 10px;
width: 150px;
}

Still hasn't been changed. Try that first off for me.

[tunescool]

i dont know, i was looking at it and changing everything i dont know how it didnt get changed

anyway, its fine now, thanks paul

[pawl]

No worries, glad it got sorted.

[tunescool]

thenotablenook.freemessageboards.com/conversation/542

paul the PMs didnt change

[pawl]

Well spotted, didn't think about them. Gonna update the first post now. =]

Try changing this line for me, approx 1031;

.messages .item .left-panel { width: 172px; }
The width there should be the same as your .posts .left-panel