- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
02-21-2018 08:28 AM
Hi guys,
I've noticed that the search bar is missing when I change my view port to mobile size. Would you guys have any idea why?
HTML:
<div id="homepage-search" class="hidden-xs wrapper-xl">
<div class="wrapper-xl">
<h3 class="text-center text-3x m-b-lg sp-tagline-color dropshadow-bg" ng-bind="options.title"></h3>
<h4 ng-if="options.short_description" class="text-center m-b-lg sp-tagline-color" ng-bind="options.short_description"></h4>
<sp-widget widget="data.typeAheadSearch" />
</div>
<!--Regina removed this as the Contact us has now it's own widget
<br><a style="text-decoration: underline" href="mailto:{{data.portal_email}}?Subject=Portal Feedback" target="_top"> Email </a> us or message us on <a style="text-decoration: underline" href={{data.slack_url}} target="_blank">Slack</a>
-->
<div class="feedback-text">
We are working hard to improve this portal please help by sending feedback.
<sp-widget widget="data.contactUs" />
</div>
</div>
Server Script
var fName = gs.getUser().getFirstName();
options.title = 'Hi ' + fName + ', how can we help?' ;
data.contactUs = $sp.getWidget('ssp_contact_us', '');
data.typeAheadSearch = $sp.getWidget('ssp_typeahead_search', options.typeahead_search);
data.slack_url = options.slack_url;
data.slack_channel = options.slack_channel;
data.portal_email = options.portal_email;
//data.typeAheadSearch = $sp.getWidget('typeahead-search', options.typeahead_search);
Solved! Go to Solution.
- Labels:
-
Service Portal Development

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
02-21-2018 08:39 AM
class=hidden-xs means that in extra small screens, the element is hidden which is why you don't see it in mobile view.

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
02-21-2018 08:39 AM
just remove class from <div id="homepage-search" class="hidden-xs wrapper-xl">

- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
02-21-2018 08:39 AM
class=hidden-xs means that in extra small screens, the element is hidden which is why you don't see it in mobile view.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
02-23-2018 02:25 AM
thanks guys removing the xs-hidden (not including wrapper-xl) does resolve the issue. Thanks for the help!