BetterReplyte (repl, repl.co, connerow, connerow.dev, replyte, replyte.connerow.dev) by ifreaku

/* ==UserStyle==
@name           BetterReplyte
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    Tweaks For Replyte
@author         @iFreaku
@preprocessor   stylus
@var select     fontName "Font name" ["Arial", "Verdana", "Consolas", "Times New Roman"]
@var select theme "Theme" ["tesseract:Tesseract", "atomic:Atomic One Dark"]
==/UserStyle== */
@-moz-document url("https://replyte.connerow.dev/chat"),
url("https://replyte-chat-app.ironcladdev.repl.co/chat") {
    body {
        font-family: fontName, sans-serif;
    }

    div.chat_mention__kVQtU {
        .chat_messageMain__WimRN {
            background: #368677;
            border-radius: 10px !important;
            transition: border 0.5s, box-shadow 0.5s, background 2s, border-radius 0.5s, padding 0.5s, font-size 0.5s !important;
        }
        if theme==tesseract {
            .chat_messageMain__WimRN:hover {
                border: 1px solid #34f3cf !important;
                box-shadow: 5px 10px #36867759 !important;
                border-radius: 5px !important;
                padding: 15px;
                background: linear-gradient(100deg, #368677, #1E2D46) !important;
            }
        }
        else if theme==atomic {
            .chat_messageMain__WimRN:hover {
                border: 1px solid #34f3cf !important;
                box-shadow: 5px 10px #36867759 !important;
                border-radius: 5px !important;
                padding: 15px;
                background: linear-gradient(100deg, #368677, #2c313c) !important;
            }
        }
    }

    div.chat_message__MTsSc {

        div.chat_deleteMessageButton__Zyf07 {
            display: none;
        }
    }

    div.chat_message__MTsSc:hover {

        div.chat_deleteMessageButton__Zyf07 {
            display: block;
        }
    }

    .chat_messageMain__WimRN {
        border-radius: 10px !important;
        transition: border 0.5s, box-shadow 0.5s, background 2s, border-radius 0.5s, padding 0.5s, font-size 0.5s !important;
    }

    .chat_messageMain__WimRN:hover {
        if theme==atomic {
            border: 1px solid #626f8d !important;
            box-shadow: 5px 10px #626f8d59 !important;
            border-radius: 5px !important;
            padding: 15px;
            background: linear-gradient(100deg, #626f8d, #2c313c) !important;
        }
        else if theme==tesseract {
            border: 1px solid #00BCFF !important;
            box-shadow: 5px 10px #00bcff59 !important;
            border-radius: 5px !important;
            padding: 15px;
            background: linear-gradient(100deg, #4A6EA8, #1E2D46) !important;
        }
    }

    button.ui_button__kyWx2:hover {
        if theme==atomic {
            background: #626f8d !important;
        }
        else if theme==tesseract {
            background: #4a6ea8 !important;
        }
    }


    div.chat_hover__QzAiQr {
        padding: 0px;
        transition: background 0.5s, padding 0.5s, opacity 0.5s;
    }

    div.chat_hover__QzAiQ:hover {
        if theme==atomic {
            background: #626f8d !important;
            border-radius: 5px !important;
            padding: 0.5px !important;
            opacity: 1 !important;
        }
        else if theme==tesseract {
            background: #4a6ea8 !important;
            border-radius: 5px !important;
            padding: 0.5px !important;
            opacity: 1 !important;
        }
    }

    div.chat_channelActive__HxTfD:hover {
        if theme==tesseract {
            background: #4a6ea8 !important;
        }
        else if theme==atomic {
            background: #626f8d !important;
        }
    }

    img.chat_profileImage__G20wo {
        width: 40px;
        height: 40px;
        transition: height 0.5s, width 0.5s !important;
    }

    img.chat_profileImage__G20wo:hover {
        width: 100px !important;
        height: 100px !important;
    }

    img.chat_userImg__FLU9B {
        width: 40px;
        height: 40px;
        transition: height 0.5s, width 0.5s !important;
    }

    img.chat_userImg__FLU9B:hover {
        width: 100px !important;
        height: 100px !important;
    }

    div.chat_deleteMessageButton__Zyf07 {
        transition: padding 0.5s, height 0.5s, width 0.5s;
    }

    div.chat_deleteMessageButton__Zyf07:hover {
        padding: 12px;
        height: 40px !important;
        width: 40px !important;
    }
}