LOGIN/REGISTER/PROFILE styling question

[digitex]

There's no official forum thread for Ryan's Login/Register/Profile so I'm hoping this is an OK place to ask this question:

I'm using this module, which is great and saved me a ton of time, without styling so I can control the look and I decided to use flex-box rather than floats because align-items: stretch; allows all of the field wrappers to be uniform. Problem is that the profile, register, login and forgot password forms are all wrapped in a div with class Inputfields which is where the flex has to be applied which means every form is a flex-box and I can't find a way to override it. now the login form is inline rather than stacked and forgot password is a mess.

Question I have is: is there an easy way to hook into the module to change "inputfields" to "inputfields-profile" and "inputfields-login" so I can target them separately?

ETA: See below, hooks not necessary. I just needed to give it some more thought.

Edited April 17, 2018 by digitex

[digitex]

I went and had a shower, great place to think. I found a solution that doesn't require hooks. It's a simple CSS thing.

For anyone in future thinking of using flex-box for the edit profile form, which does look and work better than floats, you can try this:

The Inputfields class is common for all of the forms in the module and is where flex needs to be applied but the forms themselves have individual IDs which allows you to target the .Inputfields class as follows:

.Inputfields {
    display: flex;
}
#LoginRegisterProfileForm > .Inputfields {
    flex-direction: row;
    justify-content: space-between;
    align-items: stretch;
    flex-wrap: wrap;
}
#LoginRegisterLoginForm > .Inputfields, #InputfieldForm1 > .Inputfields {
    flex-direction: column;
    justify-content: center;
    align-items: stretch;
    flex-wrap: nowrap;
}
#wrap_login_name, #wrap_login_pass, #wrap_username {
	display: block;
	max-width: 50%;
	margin: 0 auto 10px auto;
}

If that's helpful to anyone.