CanvasCustomizer by actuallyexeon

/* ==UserStyle==
@name           Exeon's Canvas Revamp
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         Exeon

@preprocessor   stylus
@license        GPLv3

@var color accent "Accent" #13ac7b

@var select theme 'Background Color' {
    'Dark (default)': 'dark',
    'Light': 'light',
}

==/UserStyle== */

@-moz-document domain("instructure.com") {
    :root {
        --accent: accent;
        --ic-brand-global-nav-bgd: var(--accent) !important;
        --ic-brand-global-nav-logo-bgd: var(--accent) !important;
        --ic-brand-header-image: url("") !important;
        --ctheme-height: 5px;
        --ic-brand-font-color-dark-lightened-30: var(--text);
        if theme==dark {
            --bguf: #111111;
            --bguf-wa: #222222;
            --text: #eeeeee;
        } else if theme==light {
            --bguf: #eeeeee;
            --bguf-wa: var(--bguf);
            --text: #111111;
        }
        --ic-brand-global-nav-ic-icon-svg-fill--active: var(--accent) !important;
        --ic-brand-global-nav-menu-item__text-color--active: var(--accent) !important;
    }

    // logo height workaround
    body.primary-nav-expanded .ic-app-header__logomark {
        height: var(--ctheme-height) !important;
    }
    
    body {
        background-color: var(--bguf) !important;
        color: var(--text) !important;
    }
    
    #breadcrumbs {
        background-color: var(--bguf) !important;
        color: var(--text) !important;
    }
    #breadcrumbs > ul > li + li:last-of-type a {
        background-color: var(--bguf) !important;
        color: var(--text) !important;
    }
    a {
        color: var(--accent) !important;
    }
    a:hover {
        color: var(--accent) !important;
        filter: brightness(0.6);
    }
    .ic-Dashboard-header__layout {
        background-color: var(--bguf) !important;
    }
    @css {
    .ic-DashboardCard, .ic-DashboardCard__header_content {
            background-color: var(--bguf-wa) !important;
    }
    }
    .ic-DashboardCard__header-title > span {
       color: var(--accent) !important; 
    }
    .ctrLD_bGBk {
        color: var(--text) !important;
    }
    .header-bar, .pages.show, .course-title, .btn, div > button > span {
        background-color: var(--bguf) !important;
        color: var(--text) !important;
    }
    .ic-app-header__menu-list-item.ic-app-header__menu-list-item--active .ic-app-header__menu-list-link {
        background: var(--bguf-wa);
    }
    // home screen todo fix
    #right-side .events_list .event-details::after, #right-side .events_list .todo-details::after, #right-side .to-do-list .event-details::after, #right-side .to-do-list .todo-details::after {
        background: var(--bguf) !important;
    }
    // right side of class feedback hover patch
    .recent_feedback_icon:hover {
        filter: brightness(1);
    }
    //modules list background
    .item-group-container, .ig-list, .ig-row, .item-group-condensed.ig-list li:first-child.ig-row, .item-group-condensed.ig-list li:first-of-type.ig-row, .item-group-condensed.first_visible.ig-row, .ig-header {
        background-color: var(--bguf) !important;
    }
    .name {
        color: var(--text) !important;
        text-shadow: 0px 0px 0 rgba(255,255,255,.5) !important;
    }
    .fOyUs_bGBk {
        background-color: var(--bguf);
    }
    .title, .locked_title {
        color: var(--text)
    }
    
}