Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now
Light
Dark
System
Ask  Question

React version of latest M8 sign in page style is broken

Hi I trying to move the code from M7 to 8 React version and found that that:

  1. the style of sign in page is broken, this is what it looks like when play with the chrome window size: https://imgur.com/NVIkGl6 see how the background ended in the top and the text is displayed below.
  2. equivalent html version is NOT broken: https://preview.keenthemes.com/metronic8/demo1/authentication/layouts/corporate/sign-in.html
  3. you don't provide the actual sign in page you actually use in live preview, used here: https://preview.keenthemes.com/metronic8/react/demo1/auth which is the one I actually would like to use.

can you atleast fix the problem. it looks ugly.

M
Mehdi Hafid 3 years ago
Metronic React
2 Answers
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (2)

user
Lauris Stepanovs Author 3 years ago

Hi Mehdi,

Thank you for your feedback.

Created a task to update Auth pages markup in our React version, we will try to release it in the next Metronic update.

The styles in our HTML version are the same as in our React version so you can just copy Auth page markup from the HTML version and reuse them in React version.

Please don't hesitate to reach out if you need anything more from us.

Regards,
Lauris Stepanovs,
Keenthemes Support Team


M
Mehdi Hafid 3 years ago

It is also not mobilie freindly the same way as the html version.
I copied the html code and replaced to work for react and it is displayed properly now.


Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Click any option to insert into your comment. Select text first to wrap it.
  • **text** to make things bold
  • *text* to emphasize
  • ### Heading to make headings
  • [link text](url) for links
  • ![alt text](image-url) to paste in an image
  • - item to make a list
  • 1. item to make an ordered list
  • > quote to quote somebody
  • `code` for single line of code
  • ```js ... ``` for JS code block
  • ```html ... ``` for HTML code block
  • ```scss ... ``` for SCSS code block
  • ```php ... ``` for PHP code block
  • --- for a horizontal rule
  • happy  :)
  • shocked  :|
  • sad  :(