Log in | Register
  1. Forum
  3. Non-Commercial Extensions
  5. SCLogin Enhanced Login
  7. Need help with Horizontal Layout

Topic-icon Need help with Horizontal Layout

Active Subscriptions:

None
10 years 2 months ago #45534 by BrianJA
I'm trying to display the module horizontal on top of the page. It works fine in Login view, but have logging in, it displays vertical like the attachment. How can I set it so it displays the avatar and dropdown menu in the same row? Thanks!

Brian
The topic has been locked.
Support Specialist
10 years 2 months ago #45548 by alzander
The picture was inserted into the post, so I can't see exactly what you're seeing. When you upload an image, please hit the green arrow to actually insert it into the post.

My guess is that the following CSS should help get things inline for you:
.sourcecoast #scprofile-pic {float:left;}
That generally should make everything go horizontal. If not, the best next step is to create a test account for me (username: test, password: test) and then let me know a URL I can login with. Then, I can see the actual CSS with your template in action and help you from there.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
10 years 2 months ago #45591 by BrianJA
Thanks! I sent you a PM with my login details.

Brian
The topic has been locked.
Support Specialist
10 years 2 months ago #45627 by alzander
Brian,
Thanks for the Private Message with details of what you're looking for. I'm going to post the answers back here as some of your questions are things others may want to know as well.

Second, after logging in, it displays the dropdown menu button, but when I click on it, it is hidden below the main menu. You might want to login to understand what I mean.

There's 2 CSS styles causing this to happen that you'll need to fix:
/templates/new_vision/css/template.css
The file is compressed, so I can't tell you the line number. You need to find the following declaration:
#s5_top_bar, #s5_footer_area2 {
background: #212121;
color: #FFFFFF;
height: 46px;
overflow: hidden;
position: relative;
z-index: 1;
}
Remove the overflow:hidden; line. That's preventing the dropdown from overflowing into the lower area.
In the same file, the following block:
#s5_top_menu li a, #s5_bottom_menu_wrap li a {
padding-right: 11px;
color: #ffffff !important;
display: block;
}
The color is being forced to white, which makes the items invisible.

Third, I want to replace the menu title on the button, with the Full Name of the user. (Now it says the menu title "Account".)

That's an awesome idea! We've added it as a to-do to the 6.2 release. For now, edit the /modules/mod_sclogin/helper.php file. Around line 498, you'll see:
$parentTitle = $db->loadResult();
Add the following line under that:
$parentTitle = JFactory::getUser()->get('name');
That should do it.

Also, I want to have the menu button more square corners, with a thin border around the menu button and avator, like the attachment.

While you're in the CSS file above, add the following style:
.sourcecoast ul.dropdown-menu {
border-radius: 3px;
}

I hope that helps, but if you need anything else, just let us know.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
10 years 2 months ago #45642 by BrianJA
Hi Alex,

Thank you for your help. The module looks awesome! It now displays the logged in users full name. Looks like this post is getting a lot of attention! This will definitely be a great feature in the new version.

Now, as for the modules it looks great, but when I remove the "overflow: hidden;" code, the drop down menu shows now, but it pushes the logo to the right, and forces the main menu down to the next row. It is very strange, because this only happens before you log-in. After you log-in, it is normal.

Instead of fixing that part, I was planning on putting the logo at the top in the middle. I think this will fix the problem. Is there an easy way to do that without having to make a new module position? I tried making a new position, but didn't work.

2 more small things with the module, and it will be perfect.

1. How can I place the "Forgot Username?" and "Forgot Password?" links below the username and password fields. I realize I'll have to change the height of my module position to make it fit.

2. I moved the logout button to the right of the drop-down menu. How can I use an image instead of a text button? I have a cool log-out button that I want to use. This would also be another great new feature.
The topic has been locked.
  1. Forum
  3. Non-Commercial Extensions
  5. SCLogin Enhanced Login
  7. Need help with Horizontal Layout
From the Blog
Facebook | Twitter | LinkedIn | Blog RSS