Daymap Pipboy Style by owo11

/* ==UserStyle==
@name           Daymap Pitboy Style
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description   Literally just a CSS style. Simple and made to be easily edited with little CSS knowledge. Meant to pair with this theme here (https://userstyles.world/style/13491/stylus-daymap-recolour).
@author         Me
==/UserStyle== */
@-moz-document url-prefix("https://daymap"),
url(https://daymap.aphs.sa.edu.au/) {
    /* Insert code here... */
    /* Colours*/
    @import url('https://fonts.googleapis.com/css2?family=Kode+Mono:wght@700&display=swap');
    :root {
        --text: #0f0;
        --bgouter: transparent;
        --bg: #000;
        --bginner: #000;
        --green: #0f0;
        --red: blue;
        --imgreplace: url(https://i1.sndcdn.com/avatars-000220217240-f9fzn1-t500x500.jpg);
        --headerimg: var(--green);
        --namereplace: "✱ ✱Vault Boy✱ ✱";
        --font: "Kode Mono", Tofu;
    }
    body,
    html {
        background: linear-gradient(to bottom, #001100 0%, #111311 100%);
        height: 100%;
        color: #0f0;
        box-shadow: inset 0 0 200px #020;
    }
    body {
        padding: 20px;

        background: repeating-linear-gradient(0deg, #000, #000 2px, #020 2px, #020 4px);
    }
    /* header 4 ez acess*/
    header {
        background: repeating-linear-gradient(0deg, #0c0, #0c0 1px, #050 1px, #050 2px) !important;
        background-repeat: repeat-x;
        --bgsize: 10%;

        border: 1px solid #0f0 !important;
        background-size: var(--bgsize);
        font-weight: 700;
    }
    .sdIndicator,
    .Badge,
    #ctl00_cp_dtbDate:focus {
        background: repeating-linear-gradient(0deg, #0c0, #0c0 1px, #050 1px, #050 2px) !important;
        box-shadow: 0 0 40px #0A0, inset 0 0 40px #0A0;
        border: 1px solid #0f0 !important;
    }
    .menu-item-container {
        background: transparent !important;
        border: 1px solid #0f0;
        box-shadow: 0 0 10px rgba(0, 255, 0, 0.5), rgba(0, 255, 0, 0.5);
        cursor: pointer;
        margin-bottom: 10px;
    }
    .ttCell {
        background: transparent !important;
        border: 1px solid #0f0;
        box-shadow: 0 0 10px rgba(0, 255, 0, 0.5), rgba(0, 255, 0, 0.5);
        cursor: pointer;
    }
    .ttEmpty {
        background: repeating-linear-gradient(0deg, #0c0, #0c0 1px, #050 1px, #050 2px) !important;
    }
    .ttSubject {
        color: white;
    }
    .main-layout {
        background: transparent !important;
    }
    .menu-item-container:hover {
        background: repeating-linear-gradient(0deg, #0c0, #0c0 1px, #050 1px, #050 2px) !important;
        box-shadow: 0 0 40px #0A0, inset 0 0 40px #0A0;
        border: 1px solid transparent;
        animation: twitch 0.5s infinite;
    }

    @keyframes flicker {
        0% {
            opacity: 0.8;
        }
        100% {
            opacity: 1;
        }
    }
    @keyframes twitch {
        0% {
            padding: 10px;
        }
        50% {
            padding: 10px;
        }
        51% {
            padding: 9px;
        }
        50% {
            padding: 10px;
        }
        100% {
            padding: 10px;
        }
    }

    #ddlWeek-button {
        background: repeating-linear-gradient(0deg, #0c0, #0c0 1px, #050 1px, #050 2px) !important;
        box-shadow: 0 0 40px #0A0, inset 0 0 40px #0A0;
    }
    .ui-selectmenu-text {
        color: #000 !important;
        font-weight: 700;
        background: transparent !important;
    }
    #divInbox,
    .ui-selectmenu-text:hover,
    .ui-selectmenu-text:focus {
        background: transparent !important;
    }



    /* BUNCHA COMMENTED OUT NAME/PFP STUFF BELOW VV*/
    /* THIS REPLACES YOUR PROFILE PICTURE VV*/
    .nav-user-image,
    .photoThumb,
    .ServerImage-module_ServerImage__r71jK.Avatar-module_Avatar__Jhan3.UserDetails-module_Avatar__cfwCK {
        background-image: var(--imgreplace) !important;
    }

    /* replacing name VV all the commented out bits is the name replace*/
    .name-text,
    .css-128,
    .sname,
    .label:nth-child(1) > .context-menu-text {
        visibility: hidden;
        position: relative;
    }
    .name-text:after,
    .css-128:after,
    .sname:after {
        visibility: visible;
        position: absolute;
        top: 0;
        left: 0;
        content: var(--namereplace);
    }
    .label:nth-child(1) > .context-menu-text:after {
        visibility: visible;
        position: absolute;
        top: 0;
        left: 0;
        content: "Logged in as " var(--namereplace);
    }
    /*
READ THIS IF YOU DONT UNDERSTAND CSS AND JUST WANT TO USE THIS
the :root above allows you to change certain colours, the image, the name and the header image
    if you want the name/header/profile pic to go to normal surround them w/ the \* *\ (except the other type of slash)
*/
}