maemo.org - Talk - View Single Post - userContent.css for tmo to be bearable on sailfish browser

	qwazix	2013-12-21 , 19:30
	Moderator \| Posts: 2,622 \| Thanked: 5,447 times \| Joined on Jan 2010	#8

I am not sure that user.js alone works. I put that line in prefs.js and then I read that this file should not be edited and that user.js should be used instead. The browser is supposed to copy user.js to prefs.js upon boot. So first thing to check would be if prefs.js has the new line.

Then try to enter a very low number, if it works all text should be huge and probably mangled up. Then enter a number to your preference.

Also, for the code of post 4 to work you need a viewport less than 400px, you can try, but it will break other sites. Also, that code misses the

Code:

@media(max-width: 400px){ .... }

enclosure as it wasn't meant to be used with userContent.css (cannot be used without breaking other sites unless we manage to inject a <viewport/> tag into tmo via something like greasemonkey, or a new version of sailfish-browser supports css @viewport declaration)

@shmerl, AFAIK sailfish-browser does not use any XUL chrome that can be styled with userChrome.css

Edit: this is a userContent.css that works fine with the viewport at 800px. Still two column, but with navigation buttons bigger and almost always visible, it's what I use right now until we force the viewport to our will

Code:

@-moz-document domain("talk.maemo.org"){ 
    .postdetails{font-size:140%!important}
    blockquote.bq{font-size:110%!important}
    #mnavigation-right-wrapper ul{
        background: #424345
    }

    #mcontainer #mnavigation{
        height: auto;
        width: 100vw;
        margin-left: -8px;
    }
    #mcontainer #mnavigation #mnavigation-right-wrapper,
    #mcontainer #mnavigation #mnavigation-left-wrapper{
        height: auto;
    }
    #mcontainer #mheader #muser-login{
        float: left;
    }
    #mcontainer #mheader #mregister{
        display: none;
    }
    #mcontainer #mnavigation ul li.selected{
        background: transparent;
    }
    #mcontainer #mcontent #msidebar ul.mrecent{
        margin-top: 0;
        margin-bottom: 0;
    }
    #mcontainer #mcontent #msidebar #mnav-sub{
        padding-left: 20px;
        padding-right: 20px;
        padding-top: 20px;
    }
    .tcat .smallfont a + br {display: none}
    .tcat .smallfont a + br + a{margin-left: 20px}
    .pagenav{
        float: none;
    }
    html body div#mcontainer div#mcontent div#mmain div#mmain-wrapper div div.page div:not(#vB_Editor_QR_controls)>table table{
        display: block;
    }
    html body div#mcontainer div#mcontent div#mmain div#mmain-wrapper div div.page div:not(#vB_Editor_QR_controls)>table table tr{
        display: block;
        margin-top: 20px;
        margin-bottom: 40px;
    }
    
    html body div#mcontainer div#mcontent div#mmain div#mmain-wrapper div div.page div:not(#vB_Editor_QR_controls)>table table td{
        display: inline-block;
    }
    .tborder tbody{
        display: block;
        width: 100%;
    }
.tborder{
        display: block
    }
    .tborder>td, .tborder>tr{
        display: block;
    }
    .tborder>tbody>tr>.tcat{
        float: left!important;
        width: 50%;
        height: 80px;
        /*margin-top: -40px;*/
    }
    td.tcat a{
        margin: 10px 0;
        display: inline-block;
        vertical-align: middle;
    }
    td.tcat a:nth-child(4){
        max-width: 80px
    }
    td.vbmenu_control{
        display: block!important;
    }
    td.alt1:nth-child(2),td.alt1:nth-child(n-2){
        font-size: 200%;
    }
    td.alt1:nth-child(2),td.alt1:nth-child(n-2){
        font-size: 200%;
    }
    .page>div[align=left]>table,
    .page>div[align=left]>table>tbody,
    .page>div[align=left]>table>tbody>tr,
    .page>div[align=left]>table>tbody>tr>td
    {
        display: block;
    }
    #threadtools, #threadsearch, #threadrating{
        text-align: right;
    }
    #threadtools, #threadrating{
        margin-right: -6px;
    }
    html body div#mcontainer div#mcontent div#mmain div#mmain-wrapper div div.page div table.tborder tbody tr td.tcat strong{
    }
    #qrform ~ .tborder > tbody > tr > .tcat{
        width: auto;
    }
}

__________________
Proud coding competition 2012 winner: ρcam
My other apps: speedcrunch N9 N900 Jolla –– contactlaunch –– timenow

Nemo UX blog: Grog
My website: qwazix.com
My job: oob

Last edited by qwazix; 2013-12-21 at 20:20.

Quote & Reply |

The Following User Says Thank You to qwazix For This Useful Post:
J4ZZ