Skip to content

Canvas TUE - Dark mode by kolevvelyan

Details

Authorkolevvelyan

LicenseNo License

Categorytue

Created

Updated

Size54 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

Updated background of Assignment modules headers.

Notes

Userstyle doesn't have notes.

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name           Canvas TUE - Dark mode
@namespace      USO Archive
@author         nicolas michael
@description    `Fixed an old version of it`
@version        20200401.4.22
@license        CC0-1.0
@preprocessor   uso
==/UserStyle== */
@-moz-document url-prefix("https://canvas.tue.nl/") {
    .header {
        background-color: inherit !important;
    }

    .fLzZc_caGd {
        background: #161616;
        color: white;
    }
    
    .file_download_btn > img, .ui-icon-extlink {
        filter: invert(100%);
    }
    
    .student-group-header {
        background-color: inherit !important;
    }

    div#panel-uGaVy3a2fPsK {
        background: inherit;
    }
    
    .fOyUs_bGBk > .enRcg_bGBk.enRcg_ycrn.enRcg_eQnG {
        display: none;
    }
    
    .fOyUs_bGBk > .fOyUs_bGBk.fOyUs_UeJS.fClCc_bGBk.fClCc_fLbg > .fOyUs_bGBk.jpyTq_bGBk.jpyTq_ycrn.jpyTq_bCcs > a {
        color: #70b8e1;
    }
    
    .fOyUs_bGBk > .fOyUs_bGBk.fOyUs_UeJS.fClCc_bGBk.fClCc_fLbg > .fOyUs_bGBk.jpyTq_bGBk.jpyTq_ycrn.jpyTq_bCcs > div{
        color: #565656;
    }
    
    #immersive_reader_mount_point span{
        background: inherit;
        color: #b1b1b1;
    }
    
    #immersive_reader_mount_point svg{
        fill: orange !important;
        filter: invert(76%); 
    }

    .fOyUs_bGBk.fOyUs_EMjX.dpCPB_caGd.eJkkQ_bEpV {
        background: inherit;
    }

    div#dashboard-planner-header {
        background: inherit;
    }
    
    .submission-missing-pill *{
        background-color: inherit;
    }
    
    div.ig-header {
        background: inherit !important;
    }
    
    .omit-from-final-warning {
        background-color: inherit;
    }

    h2.fOyUs_bGBk.emyav_bGBk.emyav_eABG.emyav_fAVi.emyav_evMo {
        background: inherit;
    }


    .root_hppr.planner-empty-days {
        color: white;
        background: inherit;
    }

    .cjUyb_bGBk.cjUyb_ycrn.cjUyb_dfDs.cjUyb_eQnG {
        color: white !important;
        background: inherit;
    }

    button.fOyUs_bGBk.eHiXd_bGBk.eHiXd_dnnz.eHiXd_ycrn.eHiXd_bPzo.eHiXd_cuTS.eHiXd_wWyq {
        background: inherit;
    }

    .root_2rqW.PlannerHeader {
        background: inherit;
    }

    ol.list_3FFz {
        background: inherit;
    }

    .root_2_RE {
        background: inherit;
    }

    .planner-day {
        background: inherit;
    }
    
    .PlannerHeader-styles__root.PlannerHeader {
        background-color: #161616;
    }
    
    .Grouping-styles__title, .Grouping-styles__title::after {
        background: #161616;
    }
    
    .dLyYq_bGBk, .yyQPt_cSXm {
        background-color: #161616;
    }
    
    .nothingPlannedContent_hppr,
    .fOyUs_bGBk {
        background: #161616;
    }

    span[style="color: #000080;"] {
        color: #9BAED2 !important;
    }
    
    span[style="color: #000000;"] {
        color: inherit !important;
    }

    svg._2ABty3O {
        opacity: .86 !important;
    }

    svg {
        opacity: .91 !important;
    }

    button#planner-today-btn {
        color: #bbb;
    }

    /* inputs and selects */
    select,
    ._3wnIWQ7 input,
    .ic-app-header__main-navigation,
    ._3OrOeDO,
    _3prwVCi,
    ._3prwVCi._3JHmve9._3n3x0nD._1je4z_v,
    ._2UwSTdu_DehztgIrOm97QY {
        background-color: #111 !important;
        color: #ccc !important;
        border-color: #444 !important;
    }

    label._2KTQrDy

    /* , span.bbzHXk9._3AaFP3w, input._21DwbCr, span.bbzHXk9._3AaFP3w */
        {
        opacity: .66;
    }

    /* filter */
    ._1XW2h0xjBptQaE8Dpogfxs.planner-day,
    ._1B338NhmQjJo5_5LoRKVC3.planner-empty-days,
    ._1XHmI9W5FaxNsQf5oK9Sc4.planner-day.planner-today,
    .planner-today,
    ._1XHmI9W5FaxNsQf5oK9Sc4,
    _1pkhvjq2p8WkpW4O3Gi58f,
    ._1xJ4wm9VeFF2EZB7saBFT8 {
        background: #2220 !important;
        background-color: #2220 !important;
        -webkit-filter: invert(100%) hue-rotate(180deg) contrast(80%) !important;
    }

    .S00PYzdLZt5SiHWV-o71u,
    .S00PYzdLZt5SiHWV-o71u,
    #planner-today-btn,
    dashboard-is-planner primary-nav-transitions context-user_16162 lato-font-not-loaded-yet webkit chrome touch {
        background-color: #222;
        border-color: #111;
    }

    .jHMeNYB ._2CUXt80 {
        color: #bbb;
    }

    /* courses sidebar */
    ._22OAa8u.vsJ-dCk.VRKPAUP._3mVsBJT.pQaqUQx._1jAG_ri,
    ._22OAa8u.vsJ-dCk.VRKPAUP._3mVsBJT.pQaqUQx._1jAG_ri,
    ._22OAa8u.vsJ-dCk,
    ._3PtINRL._1kcGt6A._2fHAswJ._3Q93Z1L._2_zsa_m,
    ._3PtINRL,
    html,
    .OKaZ47z,
    ._2j9P-N_,
    ._2oCBBfa,
    .W3X1gHf,
    ._2pUll1V,
    .kuSM657,
    ._352PuUI,
    ._2sWaUbN,
    ._1Jvvn51,
    .KdZV6c4,
    .EeVNEgy {
        background-color: #1a1a1a;
        border-color: #111;
    }

    ._3jLMUSh._3F9N9cl._3F3lDiw._2WOMSfA,
    .ii51ZkV.ZFg6yPN._2vkwkEn._3kbl2G4,
    ._9aG_Teh._2U_DGBf._2d84DPH._2_XedaZ {
        color: #ccc !important;
    }

    button svg {
        fill: #bbb !important;
    }

    /* original */
    #breadcrumbs {
        background-color: #161616;
    }

    #breadcrumbs>ul {
        margin: 0;
        padding: 4px 15px;
        list-style: none;
    }

    #breadcrumbs>ul>li+li:last-of-type a {
        color: #ddd;
    }

    .header-bar {
        border-bottom: 0px solid #242424;
        background-color: #161616;
        min-height: 33px;
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .header-bar:before,
    .header-bar:after {
        display: table;
        content: "";
        line-height: 0;
    }

    .header-bar:after {
        clear: both;
    }

    .header-bar.pinned {
        position: fixed;
        top: 0;
        width: 1071px;
        background-color: #ccc;
        box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.5);
        margin-left: -12px;
        padding: 15px;
        z-index: 100;
    }

    .react-select-box-label {
        color: #2D3B45;
    }

    .react-select-box-click-outside-layer {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 2;
    }

    .react-select-box-clear {
        position: absolute;
        top: 15px;
        right: 0;
        width: 35px;
        height: 20px;
        background-color: #ddd;
        text-indent: -9999em;
        z-index: 3;
        border: none;
    }

    .react-select-box-clear:before {
        content: '×';
        position: absolute;
        top: 2px;
        left: 10px;
        z-index: 1;
        background-color: #73818C;
        border-radius: 100%;
        font-size: 13px;
        font-size: .8125rem;
        color: #ddd;
        line-height: 1;
        width: 15px;
        height: 15px;
        text-indent: 0;
        text-align: center;
    }

    .react-select-box-clear:hover:before,
    .react-select-box-clear:focus:before {
        background-color: var(--ic-brand-primary);
    }

    .react-select-box-hidden {
        display: none;
    }

    .react-select-box-options {
        margin: 2px 0 0;
        position: absolute;
        padding: 10px 0;
        width: 240px;
        top: 100%;
        left: 0;
        z-index: 4;
        background-color: #ddd;
        border-radius: 4px;
    }

    .ic-badge.ic-badge--neutral {
        background: #EBEDEE;
        color: #2D3B45;
    }

    .ic-badge.ic-badge--success {
        background: #00AC18;
    }

    .ic-badge.ic-badge--alert {
        background: #FC5E13;
    }

    .ic-badge.ic-badge--danger {
        background: #EE0612;
    }

    body {
        min-height: 100vh;
        background: #161616;
    }

    body:not(.is-inside-submission-frame):not(.embedded) {
        min-width: 768px;
    }

    body.no-headers #header,
    body.no-headers #topbar,
    body.no-headers #left-side,
    body.no-headers #breadcrumbs,
    body.embedded #header,
    body.embedded #topbar,
    body.embedded #left-side,
    body.embedded #breadcrumbs {
        display: none !important;
    }

    .ic-app-footer {
        box-sizing: border-box;
        padding: 12px 0;
        margin: 0 24px;
        border-top: 1px solid #242424;
    }

    #right-side .events_list .todo-details,
    #right-side .to-do-list .todo-details {
        padding-right: 30px;
    }

    #right-side .events_list .todo-details:after,
    #right-side .to-do-list .todo-details:after {
        width: 0px;
        background: linear-gradient();
    }

    #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 {
        /* content:""; */
        position: absolute;
        top: 0;
        right: 0;
        height: 0%;
        width: 0px;
        background: linear-gradient();
    }

    .ic-DashboardCard {
        box-sizing: border-box;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
        border-radius: 0px;
        overflow: hidden;
        background: #ddd;
        width: 262px;
        display: inline-block;
        vertical-align: top;
        margin: 0 36px 36px 0;
    }

    .ic-Dashboard-header__layout {
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        align-items: center;
        padding: 0 0 9px;
        border-bottom: 1px solid #242424;
        background: #161616;
    }

    .ic-Dashboard-Activity {
        padding: 12px;
    }

    .ic-Dashboard-header__title {
        margin-top: 0;
        margin-bottom: 0;
        -webkit-flex: 1;
        flex: 1;
        padding-right: 12px;
        box-sizing: border-box;
    }

    .ic-Dashboard-header__actions {
        box-sizing: border-box;
        display: -webkit-flex;
        display: flex;
        -webkit-align-items: center;
        align-items: center;
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
    }

    #right-side .placeholder {
        height: 200px;
    }

    .recent-activity-header {
        margin: 0;
        border-bottom: 1px solid #C7CDD1;
        line-height: 1.2;
        pad...

Reviews

No reviews yet.