HH(Compact notifications bar) by stalker666

/* ==UserStyle==
@name           HH(Compact notifications bar)
@namespace      github.com/openstyles/stylus
@version        1.0.0.2
@description    Compact translucent notification bar without unnecessary animations
@author         stalker666
@preprocessor stylus

@var select   noti_box_pos_1 'Notification bar position' {
 "on the left*": "left",
 "on the right": "right"
}
@var select   noti_box_pos_2 'Notification bar position' {
 "on the lop*": "top",
 "on the bottom": "bottom"
}

==/UserStyle== */

@-moz-document domain("hentaiheroes.com"),
domain("haremheroes.com"),
domain("comixharem.com"),
domain("pornstarharem.com"),
domain("mangarpg.com"),
domain("amouragent.com") {
if noti_box_pos_1 == left {
    #toast-popups .popup_wrapper .popup {
        right: unset;
        left: 0px;
    }

    #toast-popups .popup_wrapper .popup .noti_box:before {
        background: transparent linear-gradient(90deg, rgba(62, 255, 255, .5) 0, rgba(62, 255, 200, 0) 100%) 0 0 no-repeat padding-box;
        border-radius: 0 .5rem .5rem 0;
    }

    #toast-popups .popup_wrapper .popup .noti_box:after {
        border-radius: 0 .25rem .25rem 0;
        background: transparent linear-gradient(90deg, rgba(0, 9, 8, .5) 0, rgba(0, 98, 85, .5) 100%) 0 0 no-repeat padding-box
    }
}

if noti_box_pos_1 == right {
    #toast-popups .popup_wrapper .popup .noti_box::before {
        background: transparent linear-gradient(90deg, rgba(62, 255, 200, 0) 0, rgba(62, 255, 255, .5) 100%) 0 0 no-repeat padding-box;
    }

    #toast-popups .popup_wrapper .popup .noti_box::after {
        background: transparent linear-gradient(90deg, rgba(0, 98, 85, .5) 0, rgba(0, 9, 8, .5) 100%) 0 0 no-repeat padding-box;
    }
}

if noti_box_pos_2 == top {
    #toast-popups .popup_wrapper .popup {
        top: 4rem;
    }
}

if noti_box_pos_2 == bottom {
    #toast-popups .popup_wrapper .popup {
        top: 33rem;
    }

    #toast-popups .popup_wrapper .popup .noti_box {
        top: unset;
        bottom: 0;
    }
}

#toast-popups .popup_wrapper .popup .noti_box * {
    pointer-events: none;
}

#toast-popups .popup_wrapper .popup .noti_box {
    border-radius: 0 .5rem .5rem 0;
    padding: 0 0 0 0;
}

#toast-popups .popup_wrapper .popup .noti_box:before,
#toast-popups .popup_wrapper .popup .noti_box:after,
#toast-popups .popup_wrapper .popup .points .row {
	transition: all 1ms;
}

#toast-popups .popup_wrapper .popup .points .row .contest_name {
    padding: 2px 10px 0 10px;
    color: #ffab00;
    text-shadow: 2px -2px 5px rgb(0 0 0 / 90%), 2px 2px 5px rgb(0 0 0 / 90%), -2px 2px 5px rgb(0 0 0 / 90%), -2px -2px 5px rgb(0 0 0 / 90%);
    animation: slide_left 1ms ease-out;
}

#toast-popups .popup_wrapper .popup .points .row .contest_points {
	animation: slide_left 1ms ease-out;
}

#toast-popups .popup_wrapper .popup .points .row .contest_points .points_name {
    padding: 0 0 2px 10px;
    color: #ff723d;
    text-shadow: 2px -2px 5px rgb(0 0 0 / 90%), 2px 2px 5px rgb(0 0 0 / 90%), -2px 2px 5px rgb(0 0 0 / 90%), -2px -2px 5px rgb(0 0 0 / 90%);
    animation: slide_left 1ms ease-out;
}

#toast-popups .popup_wrapper .popup .points .row .contest_points .points_num {
    animation: slide_left 1ms ease-out;
}

#toast-popups .popup_wrapper .popup .points .row .contest_points .points_num .points_i {
    padding: 0 10px 2px 0;
    color: #43ce39;
    text-shadow: 2px -2px 5px rgb(0 0 0 / 90%), 2px 2px 5px rgb(0 0 0 / 90%), -2px 2px 5px rgb(0 0 0 / 90%), -2px -2px 5px rgb(0 0 0 / 90%);
    animation: slide_left 1ms ease-out;
}
}