• This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn more.

XF 1.3 Stack Alert Position

Neil E.

Active member
#1
Is there a way to define where the popup is located? I'd like to have it fixed at the extreme bottom left corner of the screen (like the ajax progress indicator is fixed at the extreme top right of the screen).

I don't like the way the stack alert obscures the Redactor box.
 

Chris D

XenForo developer
Staff member
#2
In EXTRA.css:

Code:
#StackAlerts
{
    bottom: 0px!important;
    left: 0px!important;
}
That should do it - the !important may or may not be required (I haven't tested this).
 

Neil E.

Active member
#3
Thanks Chris. I didn't go as easily as I expected. The bottom left location wasn't much better, so I changed to top left. I like how it looks when it is configured to match the appearance of the progress indicator. The only part that is driving me nuts is the blue border. I can't seem to get rid of it. I haven't been able to remove the shadow either, although I want the shadow to stay. Using a black border doesn't cover the blue. There must be another element hidden there. [Paging Shelley]


Black border 1px, blue is there, but not easy to see. Shadow appears to be gray (OK).
Stack Alert 1.jpg

Black border 0px, blue is more visible.
Stack Alert 2.jpg


Code:
#StackAlerts
{
    top: -5px !important;
    left: 0px !important;
    position: fixed !important;
} 
/* ~position alert at top left corner of screen~ */
 
 
 
#StackAlerts .stackAlertContent
{     
    background-image: none !important;
    background-color: #000000 !important;
    border-top: 1px solid #000000 !important;
    border-right: 1px solid #000000 !important; 
    border-bottom: 1px solid #000000 !important; 
    border-left: 1px solid #000000 !important; 
    border-radius: 0px 0px 5px 0px !important;
    color: #ffffff !important;
}
/* ~alert notification popup~ */

Adding a larger radius to the bottom right corner (desired) shows the problem with the blue.
Stack Alert 3.jpg
 
Last edited: