Change the width in Search Widget

[WwLl]

Hey, 

When i change the width on this css file "WebAppBuilderForArcGIS\client\stemapp\widgets\Search\setting\css"   

This happens:

It should look like this, but with an increased width:

Is it the right file to change the search widget width?

[RobertScheitlin__GISP]

You need to increase the .searchInputGroup parent element as well.

[WwLl]

sry when i ask this, but what exactly do u mean?

 

the blue arrows shows where i change the width size

[RobertScheitlin__GISP · Accepted solution]

Actually the css rule will not allow proper adjustment of the widgets width, because it is set in the widget.js code. Change all your css changes back to original and then make this change in the widget.js file.

      // use for small screen responsive
      _resetSearchDijitStyle: function() {
        html.removeClass(this.domNode, 'use-absolute');
        if (this.searchDijit && this.searchDijit.domNode) {
          html.setStyle(this.searchDijit.domNode, 'width', 'auto');
        }

        setTimeout(lang.hitch(this, function() {
          if (this.searchDijit && this.searchDijit.domNode) {
            var box = {
              w: !window.appInfo.isRunInMobile ? 274 : // original width of search dijit
                parseInt(html.getComputedStyle(this.domNode).width, 10)
...‍‍‍‍‍‍‍‍‍‍‍‍‍

Line 11 change the 274 value there to your choice.