臺北科大校園入口網站美化 - 登入界面 by rileychh

         /* ==UserStyle==
@name         臺北科大校園入口網站美化
@version      20240402.09.16
@namespace    https://userstyles.world/user/rileychh, uix._.uix
@description  臺北科大校園入口網站美化
@author       rileychh, uix._.uix
@license      MIT
==/UserStyle== */
@-moz-document url-prefix("https://nportal.ntut.edu.tw/index.do") {
    table,
    .boxContent > img,
    #eyes,
    .titleEng,
    .header,
    .copyright,
    #sliderShow,
    a[title="重新產生驗證碼"] {
        display: none;
    }

    #wrap,
    .boxContent {
        all: unset;
    }

    .co,
    .co > input,
    .loginBtn {
        margin: 0;
    }
    
    body {
        width: 100vw;
        height: 100vh;
        background: no-repeat center/cover url(https://unsplash.com/photos/q0RoK42sQLQ/download?ixid=M3wxMjA3fDB8MXxhbGx8fHx8fHx8fHwxNzI1OTY4MDc0fA&force=true&w=2400), #222;
    }
    
    @keyframes gradient {
        0% {
            background-position: 0% 50%;
        }
        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0% 50%;
        }
    }

    .boxContent {
        float: none;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        
        background-image: linear-gradient(
            -45deg,
            rgba(191, 97, 106, 0.6),
            rgba(208, 135, 112, 0.6),
            rgba(235, 203, 139, 0.6),
            rgba(163, 190, 140, 0.6),
            rgba(136, 192, 208, 0.6),
            rgba(180, 142, 173, 0.6)
        );
        background-size: 400% 400%, cover;
        animation: gradient 30s ease infinite;
    }

    .form {
        background: rgba(255, 255, 255, 0.25);
        padding: 2rem;
        backdrop-filter: blur(1rem);
        border-radius: 20px;

        display: flex;
        flex-direction: column;
        justify-content: space-evenly;
        gap: 1rem;
    }

    .co {
        display: flex;
        align-items: center;
        
        input {
            padding: 0 0.5em;
            font-family: monospace;

            &:focus {
                outline: none;
            }
        }
    }

    .authcode > a {
        width: 170px;
        text-align: center;
    }

    .loginBtn > input {
        background: #0071e3;
        border-radius: 5px;
        
        &:hover {
            background: #318EEC;
            border-radius: 10px;
        }
    }
}