Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Expose the ability to set logo image's width property #50

Open
AntonFriberg opened this issue Mar 13, 2022 · 1 comment
Open

Expose the ability to set logo image's width property #50

AntonFriberg opened this issue Mar 13, 2022 · 1 comment

Comments

@AntonFriberg
Copy link

Is your feature request related to a problem? Please describe.
I rarely do front-end development work and find the task of writing my own loginComponent daunting in order to resize the logo image.

Currently, it is hard-coded and I would want it to be as wide as the login div itself i.e set the width property to "420".

I do not know of any nextjs, react or css method that would allow me to change the img width property of an external component like this.

Describe the solution you'd like
Instead of hard-coding the img width property, it would be retrieved from a prop variable similar to logo which defines the source.

Describe alternatives you've considered
I considered writing my own loginComponent but find the current one very complex and I have not yet moved to typescript in my project so that also provides an additional barrier since I would need to translate it over to normal javascript.

Additional context
This is simply a feature-request! I really enjoyed using this so far. Thanks!

@AntonFriberg
Copy link
Author

Managed to do it using the globals.css in the nextjs template by using a selector on the alt property. I still think it would be great if it was possible to have the width property exposed though!

img[alt~="Logo"] {
  width: 420px;
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant