Make your Mint iPhone friendly

So, Mint. It works beautifully on iPhone, but having two columns on a 320px wide screen leaves much to be desired. Mint’s preferences has an option to “Enable single-column mode”, but I’d like to keep Mint’s great multi-column view on my desktop Mac. Wouldn’t it be great to have Mint display full multi-columns on browsers, but have a single-column view specifically for iPhone?

Update: Shaun Inman’s packaged all this into a one-click Pepper install, so ignore my inane ramblings and get to downloading!

Update #2: Now with fancy screenshot! (via)

After some poking around, I’ve optimized my Mint install to make it iPhone friendly. Works a treat (tested w/ default style). Here’s how to do it:

Open: yourdomain.tld/mint/app/includes/head.php

Find:
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
Add After:
<meta name="viewport" content="width=320; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />

Find:
<link rel="stylesheet" type="text/css" href="styles/<?php echo $Mint->cfg['preferences']['style']; ?>/style.css" />
Add After:
<link href="app/styles/mint-iphone.css" rel="stylesheet" type="text/css" media="only screen and (max-device-width: 480px)" charset="utf-8" />
Now grab this here stylesheet, and upload to:
yourdomain.tld/mint/app/styles/mint-iphone.cssThat’s it! Now I have multi-columns in my browser, and single-column goodness on iPhone. :)

del.icio.us:Make your Mint iPhone friendlydigg:Make your Mint iPhone friendly

5 Comments

  1. Shaun Inman
    July 23, 2007
    10:54 am
     

    Nice work Richard. As we discussed I’ve packaged your code into the iPhone Pepper so no modification of the base Mint files are required.

  2. ssleong77
    November 15, 2007
    8:08 am
     

    who can help me????
    my iphone blokered ,,is i donwloaded version 1.12 my iphone blokered…who can me this who can give me version 1.11?
    please…..

  3. josh
    February 9, 2008
    4:01 pm
     

    what does it mean to have a mint phone?
    cuz i want 2 buy this iphone but it says that the phone is a mint?
    any help???

  4. Dan Walsh
    September 5, 2009
    9:38 pm
     

    In Mint 2.17 and iPhone OS 3.01, the panes list displays in the middle of the header. I removed it with the following modification to your css. Hope it helps.

    #header .panes div
    {
    display:none;
    /*padding: 0 4px 0 2px;*/
    }

  5. Kamal kishor meghwal
    July 25, 2011
    9:52 pm
     

    I m rock

Post a Comment

Your email is never published nor shared. Required fields are marked *
*
*