Better messenger.com for Vivaldi web panel (CSS improvements)


  • Vivaldi Translator

    Messenger.com is too wide for average web panel in Vivaldi, but IMO for Facebook messaging it's better than m.facebook.com. So yesterday I made some small but useful improvements and I want to share them with Vivaldi users. :slight_smile:

    At first you can view current state and result you'll get in the screenshots at the post bottom.

    Let's begin:

    • Add https://www.messenger.com/ URL to your web panel.
    • Right click on it and choose "Show Desktop Version".
    • Add Stylish extension to Vivaldi.
    • Go to Extensions page (in Windows Ctrl+Shift+E) and click Options under Stylish.
    • Press "Write new style" button on the left.
    • Paste following code in the text field:
    ._4sp8 {
        min-width: 350px !important;
    }
    ._1z8r {
        padding: 5px 0 !important;
        float: right !important;
        clear: right !important;
    }
    ._4owc ._53ij {
        width: 40px !important;
        height: 290px !important;
    }
    ._2u_d {
        transform: translate(5%, -50%) !important;
    }
    ._nd_ ._2u_d {
        transform: translate(-105%, -50%) !important;
    }
    ._59s7 {
    width: 360px !important;
    }
    ._3-8x {
        margin-top: 0px !important;
    }
    ._39bj {
        display: inline-flex !important;
    }
    
    • Under the text field press "Specify",
    • In the drop down menu choose "URLs on the domain" and enter "messenger.com" in the next text field.
    • At the top left enter a name (e.g. "Messenger") and press Save.
    • Reload the web panel (to activate reload button right click on the Messenger icon in the web panel > Toolbar > Display All Controls).

    Done!
    I hope you'll enjoy this.


    You had this:

    0_1490866201696_111.jpg


    Now you have this:

    0_1490870417967_222.jpg


Log in to reply
 

Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.