• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

Membercard colours/ borders

Morgain

Well-known member
#1
Am preparing AT LAST to transfer my 3rd forum to XF. Been waiting on an addon I needed.

Very odd I cant change the membercard in Style Properties - or maybe I overlooked it. I changed the background to dark green in the Overlays section but no effect.

I found Brogan's help on other features of the membercard
http://xenforo.com/community/threads/membercard-location.19002/#post-244614

So I tried this in EXTRA.css
Code:
/* Change colour of background on member card */
.xenOverlay.memberCard {
background: @primaryDark !important;
}
That worked but it lost the shadow round the edges.

Also I'd like to add a thin gold membercard.png border around the inside.
pic of my heart's desire
 

Shelley

Well-known member
#2
Have you tried pasting in extra.css changing the px size and colour to your preference? The reason you lost the shadow is because the shadow is not css and part of the default member-card image.

If you custom card is an image it would probably be best just adding a shadow border via a graphics editor like the devs did with the default membercard otherwise doing it via css will result in the shadow surrounding the end of the image which would have adverse effects if that him has a radius.

Code:
.xenOverlay.memberCard {
box-shadow: 0 0 10px #000 !important;
}
 

Morgain

Well-known member
#3
Shelley thank you - I was hoping you'd notice my request because you are the Membercard expert.

Any idea how I can get that narrow gold line border running around the inside of the container? I'm not so far using a graphic.
 

Shelley

Well-known member
#4
Shelley thank you - I was hoping you'd notice my request because you are the Membercard expert.

Any idea how I can get that narrow gold line border running around the inside of the container? I'm not so far using a graphic.
I'm quite sure you would have to make a template edit for that and add an additional class to surround the avatarcropper & .userinfo class with the alterations having to be made within the member_card template and styling thrown in extra.css
 

Morgain

Well-known member
#7
Thank you Shelley you're the lady.

Um - I got the graphic close.png into my editor and upped it to green. But it shows with white corners. I'm not clever at transparency or maybe I need a better editor.
(I always keep the original as eg closeORIG.png for safety so I do still have that)

close-green.png
 

Shelley

Well-known member
#8
Thank you Shelley you're the lady.

Um - I got the graphic close.png into my editor and upped it to green. But it shows with white corners. I'm not clever at transparency or maybe I need a better editor.
(I always keep the original as eg closeORIG.png for safety so I do still have that)

View attachment 34916
Yeah the reason for that is because you didn't have access to the source file (psd) and the shadow embedded within the image stops you from directly altering it efficiently.I'm about to jump in a bath, when I get back I'll re-create the closed icons and submit them in the database in psd format so this kind of thing doesn't happen. There are ways to get around altering png formats but directly adjusting the source file is just easier and output is cleaner.
 

Shelley

Well-known member
#10
Thank you Shelley you're the lady.

Um - I got the graphic close.png into my editor and upped it to green. But it shows with white corners. I'm not clever at transparency or maybe I need a better editor.
(I always keep the original as eg closeORIG.png for safety so I do still have that)

View attachment 34916
here's a quick alteration from the png but I'll re-create it from scratch in psd format. close.png