extra.css

/*
https://github.com/squidfunk/mkdocs-material/discussions/2951
Commenting these to be a guide for when i want to


This is how i can target a specific element in a specific light/dark theme

[data-md-color-scheme="default"] .md-nav--primary .md-nav__list label.md-nav__link{
    background-color:#3fecf2 !important;
   }

*/

/* Light mode */
[data-md-color-scheme="default"] {
    /* background-image: url('https://github.com/SpyNetGirl/spynetgirl.github.io/raw/main/images/Windows6545.png'); */
    --md-default-bg-color: #ffffff;

}

/* Dark mode  */

[data-md-color-scheme="slate"] {
    --md-default-bg-color: #0d1117;
}







/* Making the navigation titles bold  */
.md-tabs__link {
    font-weight: bold;
}












/* Adds animations to the sidebar icons  */
@keyframes heart {

    0%,
    40%,
    80%,
    100% {
        transform: scale(1);
    }

    20%,
    60% {
        transform: scale(1.15);
    }
}

.md-nav--primary .md-nav svg {
    position: relative;
    animation: heart 1500ms infinite;
}










/* This is CSS for top banner */
.md-banner a {
    color: #ef6eae;
    transition: 0.25s;
}

.md-banner a:hover,
.md-banner a:focus {
    animation: pulse 1s;
    box-shadow: 0 0 0 2em rgba(255, 255, 255, 0);
    border-color: #ff9bc7;
    color: #ff9bc7;
}

@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 #ff9bc7;
    }
}

.md-banner a {
    background: none;
    /*   border: 2px solid; */
    font: inherit;
    /*    line-height: 1;*/
    /*   margin: 0.5em; */
    /*  padding: 1em 2em; */
}





/* For tooltips including inlines and standalone ones */
.md-tooltip--active {
    /* https://uigradients.com/#MoonlitAsteroid */
    background: linear-gradient(to right, #2C5364, #203A43, #0F2027);

    color: rgb(236, 236, 236);
}






/* For Site Title */
.md-header__ellipsis .md-header__topic .md-ellipsis {
    color: #41ec40;
    background-image: -webkit-linear-gradient(45deg, #41ec40 50%, #f657e5 29%);
    background-clip: text;
    -webkit-background-clip: text;
    text-fill-color: transparent;
    -webkit-text-fill-color: transparent;

}










/* for main menu items*/
.md-tabs__list .md-tabs__item a {

    color: #fefefe;
    background-image: -webkit-linear-gradient(45deg, #ffffff 50%, #ff33eb 17%, #ff1da4 96%);
    -webkit-background-clip: text;
    text-fill-color: transparent;
    -webkit-text-fill-color: transparent;

}









/* Setting the header/banner color the same as the background color, which is the GitHub's dark background color */
div .md-banner {
    background-color: #0d1117;
}










/* Setting the footer color the same as the background color, which is the GitHub's dark background color */
.md-container .md-footer .md-footer-meta {
    background-color: #0d1117;
}







/* Center Markdown Tables (requires md_in_html extension) */
.center-table {
    text-align: center;
}

.md-typeset .center-table :is(td,th):not([align]) {
    /* Reset alignment for table cells */
    text-align: initial;
}