BuddyDev

Search

CSS styling the Invite Friends plugin in Youzer

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on #22588

    Hi everyone in this awesome community 🙂

    This is a bit of a plea as the support forum for this plugin is abandoned πŸ™ (https://wordpress.org/support/plugin/invite-anyone/) I am looking to know what the CSS class is for this or even what can make this look less clumped together (spaced out well with a bit of styling…)

    This is due to the Youzer plugin removing the CSS, so I need it again to put it in the global settings. (yep, same story).

    Anyone got any ideas, or even what the class is for this? I would show you the link here but you’d need to be logged in. I am trying to get this looking less squished as well, maybe 1px between each line but i’d have to play about with that…

    Any suggestions / ideas are welcome.

    Many thanks to this community.

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on #22589

    Here is a screenshot:

    https://prntscr.com/ngo4ln

  • Keymaster
    (BuddyDev Team)
    Posts: 24593
    Brajesh Singh on #22601

    Hi Kristian,
    You can add the following css

    
    
    .widget.invite-anyone p,
    .widget.invite-anyone form {
      padding: 20px;
    }
    
    

    That should make it a bit better.

    Reagards
    Brajesh

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on #22664

    Thank you Brajesh, and sorry for the late reply. I wasn’t very well but feel better now πŸ™‚

    The code is great! thanks! but, is there a way I could adjust the left side too? it seems to only work on the right hand side πŸ™

    Here’s the new screenshot:

    https://prntscr.com/nidytl

    Any CSS Suggestions my friend?

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on #22681
    This reply has been marked as private.
  • Keymaster
    (BuddyDev Team)
    Posts: 24593
    Brajesh Singh on #22693

    Please link me to a page showing the form.

    Thank you
    Brajesh

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on #22695

    Hey I already did in the last message, but here it is again: – (You should see the widget on the right after logging in):

    https://taipeiexpats.com/activity/

    it is titled: “INVITE FRIENDS TO JOIN TAIPEI EXPATS”

  • Keymaster
    (BuddyDev Team)
    Posts: 24593
    Brajesh Singh on #22696

    Try this

    
    .widget-content.invite-anyone {
        padding: 20px;
    }
    
    .invite-anyone .widget-title {
       margin-bottom: 15px;
    }
    
    

    Regards
    Brajesh

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on #22698

    It’s perfect! Brajesh, thank you. I even added some of my own to your amazing code to pad out the top text, too.

    The widget is looking and being awesome πŸ˜€

    Thanks again, sir!

  • Participant
    Level: Enlightened
    Posts: 46
    Kristian Yngve on #22704

    Oh! sorry, Brajesh, just one last thing.

    I noticed the text is clumped together without any space below each line.

    What can I add to your plugin to provide a little bit between each text line?

    Thanks again, sir πŸ™‚

You must be logged in to reply to this topic.

This topic is: not resolved