Nav Not working in Tablet Portrait mode

Permalink Browser Info Environment
Hi Michael,

Came across another small problem with the theme. The Navigation button doesn't work when the site is changed to a tablet portrait size.

This seems ot be the case when the screen size is between 770px wide & 990 px wide.

When it's smaller the grey bar appears to the right and you can select from the Nav. When it's bigger the Nav is along the top.

Tested it on an iPad & Galaxy Note 10.1 both of which will not allow the Nav to work when in portrait.

Type: Pre-Sale
Status: In Progress
garyjhills
View Replies:
buurvrouw replied on at Permalink Reply
buurvrouw
+1 for this issue. Same problem here.
buurvrouw replied on at Permalink Reply
buurvrouw
I found the error causing the problem:

In iGotStyle.less around line 57 you'll find the styles for #mobileNav. They have max-size instead of min-size set in the media query

Change this line:
@media only screen and (max-width:767px){

to this:
@media only screen and (min-width:767px){


For me this solved the menu-problem.
garyjhills replied on at Permalink Reply
garyjhills
Awesome. That seems to have done the trick. Michael, you may want to update the file for future downloaders.
julehti replied on at Permalink Reply
julehti
One closely related question:

The text size on the right side mobile navigation is quite huge. How to make it smaller in iGotStyle.less?
muoks replied on at Permalink Reply
muoks
Here's the line 71 in iGotStyle.less, where you can set the text size of right side mobile nav:
Original:
#mobileNav ul li a {color: #fff; }
.
With font size adjustment:
#mobileNav ul li a {font-size: 16px; color: #fff; }
.
Vivid replied on at Permalink Reply
Vivid
If you did this, you may want to make some changes. Changing it from max-width to min-width actually breaks it on anything LESS than 768.

That said around line 58, it should be max-width: 991px.

and then on 66, it should be min-width: 992px.

Version 1.2.1 fixes this.
regattanet replied on at Permalink Reply
Still doesn't work for me. Tried reducing line 57 to 750px, and I-Pad Air 2 won't activate the menu in portrait mode.
julehti replied on at Permalink Reply
julehti
I updated Fruitful today to version 1.2 and now mobile nav seems to work properly at least on iPhone and iPad on vertical and horizontal views. Thank you for nice update!
Vivid replied on at Permalink Reply
Vivid
It always worked on mobile and tablets (in portrait) there were some issues between 768 and ~990px.

As of version 1.2.1, they've been fixed.

Also the main point of 1.2 was that we added styles for the new ecommerce add-on (see the demo site)

concrete5 Environment Information

# concrete5 Version
5.7.2.1

# concrete5 Packages
ExchangeCore reCAPTCHA (0.9.0), Fruitful (1.1.1), Spacer (0.9.0), Thumb Gallery (1.0.1).

# concrete5 Overrides
languages/sv_SE, languages/en_GB, languages/it_IT, languages/el_GR, languages/nl_NL, languages/da_DK, languages/fr_FR, languages/sl_SI, languages/de_DE, languages/ja_JP, languages/tr_TR, languages/ru_RU, languages/fi_FI

# concrete5 Cache Settings
Block Cache - On
Overrides Cache - On
Full Page Caching - Off
Full Page Cache Lifetime - Every 6 hours (default setting).

# Server Software
Apache

# Server API
cgi-fcgi

# PHP Version
5.3.29

# PHP Extensions
bcmath, bz2, calendar, cgi-fcgi, Core, ctype, curl, date, dom, ereg, exif, ffmpeg, fileinfo, filter, ftp, gd, gettext, gmp, hash, iconv, imagick, imap, intl, ionCube Loader, json, libxml, mbstring, mcrypt, mysql, mysqli, openssl, pcre, PDO, pdo_mysql, pdo_sqlite, Phar, posix, pspell, Reflection, session, SimpleXML, soap, sockets, SourceGuardian, SPL, SQLite, sqlite3, ssh2, standard, tidy, tokenizer, wddx, xml, xmlreader, xmlrpc, xmlwriter, xsl, Zend Guard Loader, zip, zlib.

# PHP Settings
max_execution_time - 60
log_errors_max_len - 1024
max_file_uploads - 20
max_input_nesting_level - 64
max_input_time - 60
max_input_vars - 1000
memory_limit - 256M
post_max_size - 128M
safe_mode - Off
safe_mode_exec_dir - <i>no value</i>
safe_mode_gid - Off
safe_mode_include_dir - <i>no value</i>
sql.safe_mode - Off
upload_max_filesize - 128M
mysql.max_links - Unlimited
mysql.max_persistent - Unlimited
mysqli.max_links - Unlimited
mysqli.max_persistent - Unlimited
pcre.backtrack_limit - 1000000
pcre.recursion_limit - 100000
session.cache_limiter - <i>no value</i>
session.gc_maxlifetime - 1440
soap.wsdl_cache_limit - 5
safe_mode_allowed_env_vars - PHP_
safe_mode_protected_env_vars - LD_LIBRARY_PATH

Browser User-Agent String

Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/39.0.2171.95 Safari/537.36

Hide Post Content

This will replace the post content with the message: "Content has been removed by an Administrator"

Hide Content

Request Refund

Click below to request a refund for License #7692323. Assigned to TCH Hua Hin.
Created on Dec 28 2014 at 8:03 am
.