CODEWITHSUNDEEP
twitter-bootstrappharoseaside
Cascosoft
Cascosoft

Reputation: 41

How to make Bootstrap for Seaside responsive on mobile devices?

I am using the latest stable release of Bootstrap for Seaside, on Pharo Smalltalk. I thought bootstrap apps would behave well, out of the box, on mobile devices. However, neither my simple applications nor the examples from http://pharo.pharocloud.com/bootstrap look well on mobile devices (at least not on iPhone and Android ones). Is there something I need to do to make them web responsive (besides using Bootstrap as much as possible)?

Upvotes: 2

Views: 478

Answers (2)

Stephan Eggermont
Stephan Eggermont

Reputation: 15907

If you want too make them really responsive, you'll need to do more than what the meta tags provide. The problem is then less with small mobile devices, and more with large ones. How are you going to use the space an UHD monitor provides? That requires designing for a layout with at least 5 or 6 colums.

Upvotes: 1

Cascosoft
Cascosoft

Reputation: 41

I believe I found the answer. The default configuration of bootstrap for Seaside does not add the required meta tags (<meta name="viewport" content="width=device-width, initial-scale=1">).

To add the tag, simply modify the #updateRoot: method in your subclass of WAComponent. Something like this should work for most common cases:

updateRoot: anHtmlRoot super updateRoot: anHtmlRoot. anHtmlRoot meta name: 'viewport'; content: 'width=device-width, initial-scale=1.0'

_alejandro

Upvotes: 2

Related Questions