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

Xenforo Default membercard PSD v1

This is a source file I constructed of the default membercard........

  1. Shelley

    Shelley Well-Known Member

    Shelley submitted a new resource:

    Xenforo Default membercard PSD (version v1) - This is a source file I constructed of the default membercard........

    Read more about this resource...
     
    Survivalist80, Lisa and Kevin like this.
  2. CritiKiL

    CritiKiL Active Member

    Great! Thank you soo much ;-)
     
  3. Xyphien

    Xyphien Active Member

    Wish you'd add pictures, would help a lot :)
     
  4. Chris D

    Chris D XenForo Developer Staff Member

    Pivetor likes this.
  5. Xyphien

    Xyphien Active Member

    It does not seem to want to change for me. It remains the same, even though I upload it to the FTP.
     
  6. Chris D

    Chris D XenForo Developer Staff Member

    What are you trying to do?

    The file is a Photoshop file and is the source file for the member card overlay. It's been provided so that people can edit it and replace the default one.
     
    Survivalist80 likes this.
  7. CritiKiL

    CritiKiL Active Member

    I think I know what you mean: You've updated your membercard and you don't see the changed one but still the old one? Same happened to me! You'll have to clear your browser cache and give your server time to update. It will show up later on. But it's still storing the old version until it's cleared / updated ;-)
     
    Pivetor likes this.
  8. erich37

    erich37 Well-Known Member

    does anyone know where to find the CSS for styling the "outer glow shadow" for the member-card ? I would like to change this "shadow" to a transparent-colored-border.

    member-card-border-style.jpg


    Instead of the default grey-shadow, I would like to make the same "transparent outer border" (border-radius: 20px 20px 20px 20px) as which is showing when you click onto the icon for "Open Quick Navigation" (the icon which is located at the right of the Breadcrumb).


    I have tried to put this CSS-code into template Extra.css, but there is too much padding around the member-card.png image. It is a step in the right direction, but there is still something missing with my approach :confused:
    Code:
    .xenOverlay.memberCard {
        border: 20px solid rgba(170, 6, 64, 0.5);
        border-radius: 20px 20px 20px 20px;
        box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
        padding: 0;
    }
     
  9. Shelley

    Shelley Well-Known Member

    The outer glow is not css it's added via a graphics editor. You will be able to adjust the shadow (outerglow) directly from the PSD. The settings are within photoshop to do this effect where the shadow is solid rather than it being spread.

    box-shadow should be removed and border on your membercard css as this is all done via a graphics editor and changes made directly to the graphic itself
     
    Survivalist80 likes this.
  10. Shelley

    Shelley Well-Known Member

    Is this something you had been after? Let me know if it is and I'll upload it.

    membercard-overlay.png
     
    erich37 likes this.
  11. erich37

    erich37 Well-Known Member

    yep, exactly this. (y)

    Although I would like to have another color for the "member-card.png"-image.... so I want to be able to customize the color of this image.

    Or even better just set the background-color via CSS instead of having this "member-card.png"-image ?
    The "Open Quick Navigation"-popup also does not contain any .png-image..... not sure why there is even a need for a "member-card.png"-image-file when it might be possible to do it all with CSS ?
     
  12. Shelley

    Shelley Well-Known Member

    hmmm I remember kier or mike saying their was a good reason why the had to use an image (I am sure it was because of old browser support) but here is the image if your still wanting to use it. member-card.png
     
  13. erich37

    erich37 Well-Known Member

    yeah, I am fine using an image for the member-card.png and just change the color of this image via your PSD-file, which is great !

    But I want to be able to change the color of the blue-transparent border via CSS.......

    Code:
    .xenOverlay.memberCard {
        border: 20px solid rgba(170, 6, 64, 0.5);
        border-radius: 20px 20px 20px 20px;
        box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
        padding: 0;
    }
     
  14. Shelley

    Shelley Well-Known Member

    You can't change the border via css because the border is embedded/part of the image.
     
  15. erich37

    erich37 Well-Known Member

    yeah, this is the reason I want an image without blue-transparent-border..... and make the blue-transparent-border with CSS.......with the CSS-code posted above.
     
  16. Shelley

    Shelley Well-Known Member

    I don't think your understanding the limitation here. if you added a border whilst using a membercard image the border would become square in shape because it doesn't take notice you designed a membercard with a radius it looks at the canvas as a square so you would get an adverse affect where it would be outside of the image on the edge of the canvas.
     
  17. Shelley

    Shelley Well-Known Member

    Screenshot below

    Untitled-4.png
     
  18. erich37

    erich37 Well-Known Member

    well, the member-card.png-image does not have to have "rounded borders"....
    it would be just perfect to have the "member-card.png" with square borders (no radius).
     
  19. Shelley

    Shelley Well-Known Member

    You should have just said. try this and then try your css stuff it should work okay from here on in. (attachment) Let me know how you get on with it.
     

    Attached Files:

    erich37 likes this.
  20. Shelley

    Shelley Well-Known Member

    Scrub that, I just tried it and the corners shoot off past the css border.
     

Share This Page