Topic-icon How to customize the modal pop up window

1 year 6 months ago #68284 by LGASM
Hi!Congrats for this fine module!I need an urgent help here: how can I customize it to look just like the one on your website?(attached  screenshot)Do I need JFB Connect to do it?If so, no problem I intend to buy it anyway.Tks a lot!
Attachments:
The topic has been locked.
1 year 6 months ago #68285 by LGASM
Additional info:
Currently, our website acianf.com.br
looks like this in the attached printscreen.
We would like to center it on screen, change the transparent background to a white one, get fields one on top of the other and add social login buttons.
Please help us out.
Best regards!
The topic has been locked.
Support Specialist
1 year 6 months ago #68287 by mel
The SCLogin comes with two themes. In the "Login View Settings" module parameters, choose SourceCoast as your theme. If you're using JFBConnect, you'll also want to go into the JFBConnect Backend > Configuration > Advanced area and turn on "Load jQuery/Bootstrap". I'd also suggest turning on Load Bootstrap CSS if bootstrap is not already included by another extension. I think these steps will get you closer to where you need to be and we can go from there.

-Melissa
The topic has been locked.
1 year 6 months ago #68288 by LGASM
Tks a lot Melissa!
We got those parameters activated but no change.
It may be best to change CSS to do these:
1. change the modal/popup background to white instead of transparent
2. put a border on the popup
3. centralize it.
But I don't know how to do this.
Best regards!
The topic has been locked.
1 year 6 months ago - 1 year 6 months ago #68289 by LGASM
Hi Melissa!
We do need your help.
We did activate the parameters you suggested but it did not work to achieve what we have in mind (change popup background to white, center it on page and apply a border.
But please look at devs.acianf.com.br so you can see where we are at.
This is our dev site.
<Edited to remove credentials>
We just need to put the popup window centered on page with a white background and a border.
Best regards!
Last edit: 1 year 6 months ago by mel.
The topic has been locked.
Support Specialist
1 year 6 months ago #68290 by mel
The email address was edited out by our spam / forum software. Can you send it via our Contact Us at www.sourcecoast.com/contact-us/.
The topic has been locked.
Support Specialist
1 year 6 months ago #68293 by mel
When clicking on the modal popup, a class usually gets assigned to the modal element. Since the class is missing, the styling associated with that class is not loaded. This usually is from either 2 bootstrap javascript or 2 jquery files being loaded on the page. You can turn off the two settings I mentioned if there was no change.

In the meantime while we need to narrow down what's causing the conflict, in your SCLogin theme, can you try changing:
In media/sourcecoast/themes/sclogin/default.css around line 24
div.sclogin-modal.modal.in {
to
div.sclogin-modal.modal.in,div.sclogin-modal.modal.show {

When I get the email/username, I can look at the JFBC/SCLogin settings further.
The following user(s) said Thank You: LGASM
The topic has been locked.
1 year 6 months ago #68294 by LGASM
Hi Melissa!
Tks a lot!
That did the trick, or at least most of it!
But I still cannot get our popup like the ine on your site...
It seems that something is messing up with the buttons (show password and forgot pwd/username): they spill over to another line instead of remaining alongside the fields.
I already sent you the credentials via contact form.
Best regards!
The topic has been locked.
Support Specialist
1 year 6 months ago #68296 by mel
There's a style in your template targeting
input[type="text"]:not(.form-control) {
display:block;
}

This is what's pushing those buttons to the next line. Either you can 1) do a template override of the SCLogin view classes to add the form-control class or 2) add a style like the following (this is probably the easier way to fix)
input.sclogin-username, input.sclogin-passwd {
display:inline-block;
}
The topic has been locked.
1 year 5 months ago #68297 by LGASM
Hi Mel!
Where , on which fiel, can I add the style you mentioned in item 2 above?
Best regards!
The topic has been locked.