Again question about Login / Logout Buttons

StefanSchoch
Offline

Active Subscriptions:

None

9 years 1 month ago #61565 by StefanSchoch

Replied by StefanSchoch on topic Again question about Login / Logout Buttons

Wonderful!!

If now Icould apply this to the logout-button too.... ;-)

The topic has been locked.

StefanSchoch
Offline

Active Subscriptions:

None

9 years 1 month ago #61566 by StefanSchoch

Replied by StefanSchoch on topic Again question about Login / Logout Buttons

Sorry, me again....

Now I added the 'Register' Button to the module, but the buttons now stick clise together again and the 'register' button is not centered.
stefan-schoch.de/ressourcen-uebersicht.html

I'm sorry, but I don't know too much about CSS, so I might have one it wrong.
See my CSS attached.
sts.css

The topic has been locked.

mel
Offline

Support Specialist

9 years 1 month ago #61567 by mel

Replied by mel on topic Again question about Login / Logout Buttons

Since you've added the Register button, the width needs to go back to 70% instead of 50%. Also the previous margin-top that I provided conflicts with another style so you need to alter what I send previously for margin-top. The following also has style to center the logout.

So what I think you should have:

.sclogin-modal-links {
margin-left: auto;
margin-right: auto;
width: 70%;
}
.sclogin a.art-button, .sclogin a.art-button:link, .sclogin a:link.art-button:link, body .sclogin a.art-button:link, .sclogin a.art-button:visited, body .sclogin a.art-button:visited, .sclogin input.art-button, .sclogin button.art-button {
margin-top: 10px !important;
}
.sclogin .logout-button {
margin-left: auto;
margin-right: auto;
width: 50%;
}

If you want to center the login and register buttons more than that, it will be more complicated CSS.

Attached is what mine looks like inputting it into the browser developer tools:

The topic has been locked.

StefanSchoch
Offline

Active Subscriptions:

None

9 years 1 month ago - 9 years 1 month ago #61568 by StefanSchoch

Replied by StefanSchoch on topic Again question about Login / Logout Buttons

Now we're coming close...

I'm really sorry to be so demanding.

If it would be possible to have both Buttons centered (not aligned to the same left margin) that'd be great.
Or (might even look better) change 'register' from 'button' to 'text-link'

And in the modal popup the register button is not on the same hight as the login button.

Thx so much!

Last edit: 9 years 1 month ago by StefanSchoch.

The topic has been locked.

StefanSchoch
Offline

Active Subscriptions:

None

9 years 1 month ago - 9 years 1 month ago #61569 by StefanSchoch

Replied by StefanSchoch on topic Again question about Login / Logout Buttons

me again...

Now the 'Abmelden' button is centered on some pages:
stefan-schoch.de/ressourcen-uebersicht.html

and not on other pages:
stefan-schoch.de/online-kurse/alle-kurse.html

(you can try with user:test / pw:test)

arrgh....

Last edit: 9 years 1 month ago by StefanSchoch.

The topic has been locked.

mel
Offline

Support Specialist

9 years 1 month ago #61581 by mel

Replied by mel on topic Again question about Login / Logout Buttons

If it would be possible to have both Buttons centered (not aligned to the same left margin) that'd be great.
Or (might even look better) change 'register' from 'button' to 'text-link'

Sometimes you glance past the simpler solution and make things too complex - Try changing

.sclogin-modal-links { 
margin-left: auto; 
margin-right: auto; 
width: 70%; 
}

.sclogin-modal-links { 
text-align:center;
}

And in the modal popup the register button is not on the same hight as the login button.

The following style is causing this at html/mod_sclogin/themese/sts.css line 163:

div#form-sclogin-submitcreate button {
margin-bottom: 10px !important;
}

The topic has been locked.

StefanSchoch
Offline

Active Subscriptions:

None

9 years 1 month ago #61632 by StefanSchoch

Replied by StefanSchoch on topic Again question about Login / Logout Buttons

now we're coming closer.... :-)

changed the CSS according to your advice above, but now the 'Abmelden' Button is centered but not the 'Login'. :-o

I don't gert it. I'm sorry...

And another question:
I implemented the login Button in the Slider 'Information zu An- / Abmeldung' with the 'modules anywhere' hack. Thx for the tip!
But now I need a different appearance of the buttons so I created a copy of the SCLogin module to be able to use 2 different CSS.
It seems thte 2nd module doesn't read the new CSS.
Is it not supported to use two instances of the module?

Stefan

The topic has been locked.

StefanSchoch
Offline

Active Subscriptions:

None

9 years 1 month ago - 9 years 1 month ago #61634 by StefanSchoch

Replied by StefanSchoch on topic Again question about Login / Logout Buttons

Correction:
Using two copies of the SCLogin module works. I have different settings in the logout layout (one with profile image one without) and these settings are used.

Problem still is with the template. Perhaps there is too much 'try and error' so I'd like to start from scratch with a fresh copy of the default template for the modal login.
Where do I find these?

Stefan

Addendum:
I'm getting crazy on this one. I tried again and it definetly looks as if both modules draw on the same CSS, even if there are different configured.
Bug?
Or am I crazy already? ;-)

Last edit: 9 years 1 month ago by StefanSchoch.

The topic has been locked.

mel
Offline

Support Specialist

9 years 1 month ago #61639 by mel

Replied by mel on topic Again question about Login / Logout Buttons

Problem still is with the template. Perhaps there is too much 'try and error' so I'd like to start from scratch with a fresh copy of the default template for the modal login. 
Where do I find these?

The default theme for SCLogin is installed in /media/sourcecoast/themes/sclogin/default.css

I'm getting crazy on this one. I tried again and it definetly looks as if both modules draw on the same CSS, even if there are different configured.

CSS targets elements on the page by the identifiers you use for the styles. For instance, an identifier that you've been using such as ".sclogin .logout-button" would be found in both instances of the module if they're both showing the logout button.

However, another example - if one of the module shows the Joomla login form via the Login View Settings > Always Visible and the other shows it in the modal popup via the Login View Settings > Modal Popup, those identifiers might be different because we have extra identifiers/styles for each of those layouts. This is what happened when you first started styling the module - Because you switched from showing the login form on the page then to a modal popup is one of the reasons why I had to keep giving you updated CSS. The identifiers changed, but the underlying styles were the same/very similar.

I have different settings in the logout layout (one with profile image one without) and these settings are used.

More elements in the module mean more styles that work in conjunction with each other. So adding a profile image to one module might affect how the styles look there differently than the other module without the profile image.

The topic has been locked.

SourceCoast Login

Again question about Login / Logout Buttons