one tab in shortlist

[Pía_ZenaidaVirginia]

Hi, I have a shortlist width one layer, so no tab appears on the shortlist, but I want to see one tab that refer to sites of the layer.
How can I do this? What file and line of code I have to modify? This an example of what I want.

http://www.graphtech-gis.com/webapp/carthagehistory/

Thanks for help

Virginia

[Pía_ZenaidaVirginia]

Hi, you can see Acoana training app shortlist with the new version here

http://www.drivehq.com/file/df.aspx/publish/vbehm/wwwshortlistcursosacoana/index.html

Virginia

[Pía_ZenaidaVirginia]

Hi, with the new version of shortlist app, I think is not so easy to have one tab, one layer. In mobil devices there is no title and subtitle so I would like to see one tab, to explain what is about. What do you think?.

Thanks for feeback.

[Pía_ZenaidaVirginia]

Hi again, I change to cero, line 364 in the main.js and it works. Nice, now I can see the one tab with text in mobil device.

Regards

[RupertEssinger]

Hi Virginia

In our small display mode, we hide the name of the tab on purpose, the same as we do in the normal display mode. If someone opens your story map on their phone or small tablet, the first thing they'll see is the title and subtitle of your app. (If you open your app in large browser window and then resize it so that the small display mode is used, you won't see the title and subtitle of the app because you already opened the app). But press Refresh after resizing your web browser and you will see the title and subtitle.

But I can see why you want to add the long name into the tab. Your customization of the Shortlist to add the name of the tab in when there is just one tab is nice, but I noticed that there is an issue: there's a left arrow in the header that doesn't do anything when it is clicked (see the attached image). That arrow isn't there normally if there is just one tab in the Shortlist, but I'll see if that is something we should fix in the template in case other people do the same customization that you did.

Your ACOANA training Shortlist is nice:
http://www.drivehq.com/file/df.aspx/publish/vbehm/wwwshortlistcursosacoana/index.html
Could you add a web mapping application entry into ArcGIS Online representing that application, so that people can find it when they search or add it into a gallery. You've added one of these entries for your indigenous arts shortlist but not yet for the new one:
http://www.arcgis.com/home/item.html?id=b3351e5f4e454a71b36012852c53ba48
Please include 'story map', 'shortlist', 'custom' in the Tags, in addition to your other tags.

Rupert

[Pía_ZenaidaVirginia]

Hi, good morning, I really appreciate all you tell me. When I resize the navigator window (the first time) to see the mobile mode of shortlist app, my training example was open, so I didn´t see the title and subtitle. Later I realize that I can see them if I launch the application with the navigator window in small size. Now I know about refresh to see title.

I will add the instructions you feedback to me.

Thanks a lot.

Regards

Virginia

[RupertEssinger]

Hi Virginia
Regarding the issue in your customized Shortlist where you have changed it so that the single category of places in your Shortlist is shown as a tab, but in the mobile display an inactive < arrow appears next to this tab's name (see the screenshot above): We think you can hide that unwanted < arrow if you add a css rule:

.icon-arrow-left{
    display: none !important;
}

[Pía_ZenaidaVirginia]

Hi, I understand what do you tell me, but I would like to know where (before o after existing line of code) I have to write the rule.

Thanks for feedback

[RupertEssinger]

Hi Virginia

You could put that line of code into style.css file in the existing .icon-arrow-left sectionfile like this:

.icon-arrow-left{
     display: none !important;
     color: #ededed;
     position: absolute;
     left: 5px;
     top: 8px;
}

but we'd recommend adding it into the the Index.html file as a custom style (after line 33 - which is after where the other css files are specified) like this:

<style>
    .icon-arrow-left{
        display: none !important;
    }
</style>

In this way the changes you make to the code can be concentrated in the index.html which is specific to your particular Shortlist, which may make it easier for you to re-use your Shortlist code for other shortlists without having to remember what you changed in the CSS file.

[RupertEssinger]

I see your fix now in Index.html and that successfully hid the < arrow that your customization exposed in the black header bar above the Places list for your one tab in the small display mode: http://www.drivehq.com/file/df.aspx/publish/vbehm/wwwshortlistcursosacoana/index.html