Edit the "Login" window

Hi, 

For some reason I haven't been able to edit the "Login" window in any way, even with the !important tags. 
I haven't had any problems editing the other pages in CSS, but this one doesn't cooperate with me. Not sure if it's locked or if it's something I'm doing wrong. 
 

This is what I've written, I have tested multiple variations of this: 

//Login/Registration
//Window
.Dialog-container-uCx0n {
    background-color: #080808 !important;
}

//Title
.Dialog-container-uCx0n h1 {
    color: #FFF !important;
}

//Sign in button 
.Button-container-BtFfe {
    background-color: #FFF !important; 
    color: #000000 !important;
}

//Bottom text 
.Dialog-container-uCx0n footer a {
    color: #FFF !important;
}

//Input fields
.Input-container-1PpPx input {
    font-family: 'Clarkson', 'Proxima Nova', 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 13px;
    color: #FFF !important;
    background-color: #000000 !important;
}

//Hide header "login button"
.user-accounts-link.loaded .user-accounts-text-link {
  display: none;
}

Thank you!

Hi. You can't edit this popup with code. It is in iframe.

2 minutes ago, tuanphan said:

Hi. You can't edit this popup with code. It is in iframe.

Damnit, so there's no workaround at all for this? 

I was losing my mind trying to understand why it didn't work..

You cannot use CSS to interfere with code within an iframe tag. It is a code rule.

1 minute ago, tuanphan said:

You cannot use CSS to interfere with code within an iframe tag. It is a code rule.

Understandable. 
I'm guessing it's not possible to bypass with javascript either? 

I haven't tried with JS, you can try ✌️

@Masterworks Were you ever able to find a solution for this? This drives me crazy as well because it is the one part of my site (laterrarossa.com) that does not follow site styles and looks so out of place.

Folks. I tackled changing the title of the login successfully. So I imagine that it may be possible to make further customizations.

The code has some downsides. It depends on SS dynamic classes which can change at anytime. So you need to add a routine check of your site to see when things break and fix.

It does require JavaScript to work. The JavaScript can work because the login dialog is added via an iframe on the same domain as your site. So it is possible to cross the document boundary with JavaScript.

I can't say for sure what you want to accomplish can be done but if you are interested I might be able to modify the code to add the ability to include some custom CSS.

Let me know if you are interested.

Thank you, @creedon! I really appreciate you looking into this. It sounds like it might cause me more grief in terms of complexity than it is worth right now, but we'll see if my perfectionism gets to me and I give in! Thank you again!

On 11/28/2022 at 2:16 AM, creedon said:

Folks. I tackled changing the title of the login successfully. So I imagine that it may be possible to make further customizations.

The code has some downsides. It depends on SS dynamic classes which can change at anytime. So you need to add a routine check of your site to see when things break and fix.

It does require JavaScript to work. The JavaScript can work because the login dialog is added via an iframe on the same domain as your site. So it is possible to cross the document boundary with JavaScript.

I can't say for sure what you want to accomplish can be done but if you are interested I might be able to modify the code to add the ability to include some custom CSS.

Let me know if you are interested.

Can you give me any example of javascript to add text please so i can do it also 🙂

On 1/19/2023 at 3:32 AM, umershaikh said:

Can you give me any example of javascript to add text please so i can do it also

Please see the following.

Let us know how it goes.

15 hours ago, creedon said:

Please see the following two items.

Member Area Sign In Dialog Change

Let us know how it goes.

Thank you so much for the help

1 hour ago, umershaikh said:

Thank you so much for the help

I tried this code but its not working out 😞

https://www.agallocolors.com/

Kindly check what is i am doing wrong ?

Please help !

10 hours ago, umershaikh said:

I tried this code but its not working out 😞

https://www.agallocolors.com/

Kindly check what is i am doing wrong ?

The issue is that my code was written for v7.1 sites. Your site is v7.0.

Can you write code for v7.9 ?

On 1/20/2023 at 11:42 PM, umershaikh said:

Can you write code for v7.9 ?

It was a bit tricky as v7.0 and 7.1 handle the dialog in slightly different ways but I think I got there! 😅

Please see Member Area Sign In and up Dialog Change.

Let us know how it goes.

I have updated my Member Area Sign In Dialog Change code cited in my January 19 post.