e-aules.uab.cat by soks-kat

/* ==UserStyle==
@name           uab.cat
@namespace      github.com/openstyles/stylus
@version        1.0.0
@description    A new userstyle
@author         Me
==/UserStyle== */

@-moz-document domain("e-aules.uab.cat") {
    /* Insert code here... */
    
    :root{
        --background: #1e1e2e;
        --background-light:#2d2c3e;
        --background-dark: #181825;
        
        --text: #cdd6f4;
        --text-dark: #181825;
        
        --primary: #cba6f7;
        --primary-b: #a177d1;
        --secondary: #89b4fa;
        --secondary-b: #5d8cda;
        --tertiary: #fab387;
        --four: #f38ba8;
        
        --border-radius: 5px;
        
        --red: var(--four);
        --red-b: #dd6887;;
        --orange: var(--tertiary);
        --orange-b: #f58e6a;
        --yellow: #f9e2af;
        --yellow-b: #fbd98d;
        --green: #a6e3a1;
        --green-b: #83d37d;
        --blue: var(--secondary);
        --blue-b: #6c99e2;
        --purple: var(--primary);
        --purple-b: var(--primary-b);
        
        --anuncis: var(--four);
        --pdf: var(--tertiary);
        --test: #f9e2af;
        --profile: var(--tertiary);

        
        /*set clean to 100 and gay to 0 to have a less colourful version (if you are boring and homophobic)*/
        --clean: 0%;
        --gay: 100%;
        
        
    }
    /*background*/
    body{
        color: var(--text);
        background-color: var(--background);
    }
    body.limitedwidth #page.drawers .main-inner, .header-maxwidth {
        background-color: var(--background);
    }
    nav.bg-white {
        background-color: var(--background-light)  !important;
    }
    #region-main {
        background-color: var(--background);
    }

    
    /*title*/
    #page-header {
        background-color: color-mix(in srgb, var(--primary) var(--gay), var(--background-light) var(--clean));
        border-radius: var(--border-radius);
        padding: 1em;
    }
    h1, .h1, h2, .h2{
        color: color-mix(in srgb, var(--text-dark) var(--gay), var(--primary) var(--clean));
        
    }
    
    h3, .h3, h4, .h4, h5, .h5, h6, .h6  {
        color: var(--text);
    }
        
    /*main tab bar*/
    .moremenu .nav-tabs {
        background-color: var(--background);
    }
    .secondary-navigation .navigation {
        background-color: var(--background);
        border-bottom: var(--background);
    }
    .moremenu .nav-link.active {
        background-color: var(--background);
        border-bottom-color: var(--primary);
    }
    .secondary-navigation .navigation a.nav-link {
        color: var(--text);
    }
    
    /*course sections*/
    .sectionname {
        color: var(--primary);
    }
    .course-section-header .btn {
        color: var(--primary);
    }
    a {
        color: var(--secondary);
    }
    .topics li.course-section {
        border-bottom: .2rem solid var(--primary);
        margin-bottom: .5rem;
    }
    .activity-item:not(.activityinline) {
        border-radius: var(--border-radius);
        border: 0px solid var(--secondary);
        background: var(--background-light);
    }
    element.style {
        color: rgb(33, 87, 202);
    }

    .course-content .current::before {
        border-left: var(--tertiary) 3px solid;
    }
 
    /*icons*/
    .activityiconcontainer.collaboration .activityicon:not(.nofilter), .activityiconcontainer.collaboration .icon:not(.nofilter) {
        filter: brightness(0) invert(var(--clean));
    }
    .activityiconcontainer.content .activityicon:not(.nofilter), .activityiconcontainer.content .icon:not(.nofilter) {
    filter: brightness(0) invert(var(--clean));
}
    .activityiconcontainer.assessment .activityicon:not(.nofilter), .activityiconcontainer.assessment .icon:not(.nofilter) {
    filter: brightness(0) invert(var(--clean));
}
    .activityiconcontainer.collaboration {
        background-color: color-mix(in srgb, var(--anuncis) var(--gay), var(--background-light) var(--clean));
        border-radius: var(--border-radius);
    }
    .activityiconcontainer.content {
        background-color: color-mix(in srgb, var(--pdf) var(--gay), var(--background-light) var(--clean));
        border-radius: var(--border-radius);
    }
    .activityiconcontainer.assessment {
        background-color: color-mix(in srgb, var(--test) var(--gay), var(--background-light) var(--clean));
        border-radius: var(--border-radius);
    }
    
    /*top bar*/
    .userinitials {
        background-color: var(--profile);
        color: var(--text-dark);
    }
    #usernavigation .icon, #usernavigation span.langbutton {
        color: var(--primary);
    }
    .dropdown-toggle::after {
        color: var(--text) !important;
    }

    .navbar .count-container {
        background-color: var(--red);
        color: var(--text-dark);
    }
    .primary-navigation .navigation .nav-link {
        color: var(--text);
    }

    
    /*side bar*/
    .drawer-toggles .drawer-toggler .btn {
        border-radius: var(--border-radius);
        padding: 10px;
        background-color: color-mix(in srgb, var(--secondary) var(--gay), var(--background-light) var(--clean));
    }
    .fa-chevron-left::before, .fa-list::before {
        color: color-mix(in srgb, var(--text-dark) var(--gay), var(--text) var(--clean)) !important;
    }
    
    .drawercontent {
        scrollbar-color: var(--secondary) var(--background-light);
        background: var(--background);
    }
    
    .courseindex .courseindex-item.pageitem {
        background-color: var(--background-light);
    }
    .courseindex .courseindex-item.courseindex-section-title a {
        color: var(--primary);
    }
    .btn{
        color: var(--primary);
    }
    .courseindex .courseindex-item .courseindex-link, .courseindex .courseindex-item .courseindex-chevron {
        color: var(--text);
    }
    .drawerheader {
        background: var(--background);
    }
    
    .courseindex .courseindex-section.current {
        border-left: solid 3px var(--tertiary);
    }
    .badge-primary {
        color: var(--text-dark);
        background-color: var(--tertiary);
        border-radius: var(--border-radius);
    }
    .rounded-pill {
        border-radius: 50rem !important;
    }
    
    /*inici*/
    .card {
        background-color: var(--background);
        border: 0px solid transparent;
        border-radius: var(--border-radius);
    }
    #frontpage-available-course-list .coursebox, #frontpage-course-list .coursebox, .course-search-result .coursebox {
        border: 2px solid var(--tertiary);
        background: var(--background-light);
        border-radius: var(--border-radius);
    }
    #site-news-forum h2, #frontpage-course-list h2, #frontpage-category-names h2, #frontpage-category-combo h2 {
        color: var(--primary);
    }
    .coursebox .content .teachers li {
        color: var(--primary);
    }
    
    .btn-secondary {
        color: var(--text);
        background-color: var(--background-light);
        border-color: transparent;
    }
    .form-control {
        color: color-mix(in srgb, var(--text-dark) var(--gay), var(--text) var(--clean));
        background-color: color-mix(in srgb, var(--tertiary) var(--gay), var(--background-light) var(--clean));
        border: 0px solid #ced4da;
        border-radius: var(--border-radius) !important;
        font-weight: 600;
    }
    .btn-outline-secondary {
        border-color: color-mix(in srgb, var(--tertiary) var(--gay), var(--background-light) var(--clean));
        border-width: 2px;
    }
    .border-bottom {
        border-bottom: 2px solid var(--primary) !important;
    }
    .list-group-item {
        background-color: var(--background);
    }
    .btn-primary {
        color: color-mix(in srgb, var(--text-dark) var(--gay), var(--text) var(--clean));
        background-color: color-mix(in srgb, var(--tertiary) var(--gay), var(--background-light) var(--clean));
        border: 0px solid #ced4da;
    }
    .custom-select {
        background: var(--background-light);
        border:  2px solid color-mix(in srgb, var(--primary) var(--gay), var(--background-light) var(--clean));
        border-radius: var(--border-radius);
    }
    .editmode-switch-form {
        color: var(--text);
    }
    /*
    .course_category_tree .category.with_children>.info>.categoryname {
        background-image: url(/2024-25/theme/image.php/boost/core/1730283310/t/expanded);
        filter: brightness(100%);
    }
    */
    
    /*entrega*/
    .breadcrumb:not(:empty) .breadcrumb-item a, .breadcrumb:not(:empty) .breadcrumb-item span {
        color: var(--text-dark);
    }
    .path-mod .activity-header:not(:empty) {
        background: var(--background);
    }
    div[data-region="activity-dates"] {
        border-radius: var(--border-radius);
        background-color: var(--background-light) !important;
        color: var(--text);
    }
    .path-mod-assign {
        color: var(--text);
    }
    .path-mod-assign td.earlysubmission, .path-mod-assign div.earlysubmission, .path-mod-assign td.submissionstatussubmitted, .path-mod-assign div.submissionstatussubmitted, .path-mod-assign a:link.submissionstatussubmitted {
        color: var(--text-dark);
        background-color: var(--green);
    }
    
    /*tauler*/
    .form-inline .form-control {
        background: var(--background);
        border: 2px solid var(--tertiary);
    }
    
    /*calendar*/
    .cal_courses_flt {
        color: var(--text);
    }
    .maincalendar .calendarmonth ul li .calendar-circle.calendar_event_course {
        background-color: var(--four);
        border: 2px solid var(--four);
    }
    .maincalendar .c    alendarmonth td.today .day-number-circle {
        border-radius: 50%;
        color: var(--text-dark);
        background-color: var(--secondary);
    }
    .path-mod-assign td.submissionnotgraded, .path-mod-assign div.submissionnotgraded{
        color: var(--primary);
    }
    .path-mod-assign td.submissionstatus...