Cinnamon: Changing margin-from-top-edge-of-screen #notification css property in theme not working

Created on 11 Mar 2016  ·  3Comments  ·  Source: linuxmint/cinnamon

I'm trying to change position of notification popup like here http://www.webupd8.org/2012/06/how-to-change-notifications-position-in.html . But adding or changing margin-from-top-edge-of-screen has no effect at all. In contrast changing margin-from-right-edge-of-screen works fine.

I'm using Linux Mint 17.3 with Linux Mint theme and my #notifications looks like this:

#notification {
font-size: 8.5pt;
border-radius: 10px 10px 10px 10px;
border: 2px solid rgba(214,214,214,0.5);
background-gradient-direction: vertical;
background-gradient-start: rgba(66,66,66,0.9);
background-gradient-end: rgba(55,55,55,0.9);
padding: 8px 8px 8px 8px;
spacing-rows: 10px;
spacing-columns: 10px;
margin-from-right-edge-of-screen: 80px;  
margin-from-top-edge-of-screen: 350px;
width: 34em;
color: white;    
/* The px are a temporary fix until get_theme_node() can return raw numbers. */
opacity:255px;
mouseover-opacity:96px
}

Any idea why changing margin-from-top-edge-of-screen has no effect?

Most helpful comment

Ok so is there a way to move this popup so it is not over minimize/maximize/close buttons? It's really annoying to place popups in right top corner of screen...

//EDIT

ok I found code responsible for placing notification, /usr/share/cinnamon/js/ui/messageTray.js :

_onNotificationExpanded: function() {
    let expandedY = this._notification.actor.height - this._notificationBin.height;
    // Don't animate the notification to its new position if it has shrunk:
    // there will be a very visible "gap" that breaks the illusion.

    // This isn't really working at the moment, but it was just crashing before
    // if it encountered a critical notification.  expandedY is always 0.  For now
    // just make sure it's not covering the top panel if there is one.

    let monitor = Main.layoutManager.primaryMonitor;
    let panel = Main.panelManager.getPanel(0, false); // We only want the top panel in monitor 0
    let height = 5;
    if (panel)
        height += panel.actor.get_height();
    let newY = monitor.y + height + 50; // ADDED 50 HERE SO POPUP IS NOT OVER WINDOW CONTROLS

    if (this._notificationBin.y < expandedY)
        this._notificationBin.y = expandedY;
    else if (this._notification.y != expandedY)
        this._tween(this._notificationBin, '_notificationState', State.SHOWN,
                    { y: newY,
                      time: ANIMATION_TIME,
                      transition: 'easeOutQuad'
                    });

},

It will stop working after cinnamon update since this file will be overwritten .

All 3 comments

That's because margin-from-top-edge-of-screen isn't a real property. There is no such thing so Cinnamon is just ignoring it. The post you pointed to is really old. Things have likely changed since then.

Ok so is there a way to move this popup so it is not over minimize/maximize/close buttons? It's really annoying to place popups in right top corner of screen...

//EDIT

ok I found code responsible for placing notification, /usr/share/cinnamon/js/ui/messageTray.js :

_onNotificationExpanded: function() {
    let expandedY = this._notification.actor.height - this._notificationBin.height;
    // Don't animate the notification to its new position if it has shrunk:
    // there will be a very visible "gap" that breaks the illusion.

    // This isn't really working at the moment, but it was just crashing before
    // if it encountered a critical notification.  expandedY is always 0.  For now
    // just make sure it's not covering the top panel if there is one.

    let monitor = Main.layoutManager.primaryMonitor;
    let panel = Main.panelManager.getPanel(0, false); // We only want the top panel in monitor 0
    let height = 5;
    if (panel)
        height += panel.actor.get_height();
    let newY = monitor.y + height + 50; // ADDED 50 HERE SO POPUP IS NOT OVER WINDOW CONTROLS

    if (this._notificationBin.y < expandedY)
        this._notificationBin.y = expandedY;
    else if (this._notification.y != expandedY)
        this._tween(this._notificationBin, '_notificationState', State.SHOWN,
                    { y: newY,
                      time: ANIMATION_TIME,
                      transition: 'easeOutQuad'
                    });

},

It will stop working after cinnamon update since this file will be overwritten .

Closing this since the the original issue is about a property that doesn't even exist and we have other open issues about being able to move notifications.

Was this page helpful?
0 / 5 - 0 ratings