Super Sale Limited Time 50% OFF for All-Access Plans
Save 50% Now

Mobile search function switched to widescreen bug


When I turn on the search function on the small screen, everything is normal, but when I switch to widescreen, there will be a blank page

I don't want this blank page to exist

<img src=" />

KTSearch options
showOnFocus: false
minLength: 1
layout: 'menu'
keypress: true
trigger: 'auto'


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 (5)


Can you handle this issue



Hi,

Could you please confirm which Metronic version are you using ?

Can you try to replace "src/js/components/search.js" with https://gist.github.com/keen333/11080a4e71430dfa34ae3e338ce487c6 version and recompile your assets with gulp or webpack following the docs guide?

Regards,
Sean



I am using the latest version of v8.2.8

This is the example code I wrote:
https://gist.github.com/ClearSeve/93a3d2b6caea82746dc1904bc1858dd6

Firstly, click on the search icon in small screen mode
Second, drag the browser window to the large screen
It will reproduce the problem



Hi,

Sorry for the late reply. We are checking this issue and provide a fix ASAP.

Regards,
Sean



How is this problem 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  :(