Google Classroom Dark Theme V2 by deltandy

/* ==UserStyle==
@name           Google Classroom Dark Theme
@namespace      github.com/openstyles/stylus
@version        2.0.1.0
@description    Dark theme for Google Classroom
@author         DeltAndy
@preprocessor   stylus

@var checkbox   fix-accent     "Fix invisible accent colors in some classrooms" 1

@var color      bg-primary     "Background Primary"   #111111
@var color      bg-secondary   "Background Secondary" #111111
@var color      bg-tertiary    "Background Tertiary"  #141414
@var color      bg-hover       "Background Hover"     #1a1a1a
@var color      border-primary "Border Primary"       #1f1f1f
@var color      border-2nd     "Border Secondary"     #3b3b3b
@var color      navbar         "Navigation Bar"       #111111
@var color      text-primary   "Text Primary"         #e8e5e3
@var color      text-hover     "Text Primary Hover"   #999897
@var color      text-secondary "Text Secondary"       #b8b3ad
@var color      text-tertiary  "Text Tertiary"        rgba(255,255,255,.549)

==/UserStyle== */

/*
Google Classroom Dark Theme
The old code had a lot of unneccesary stuff, was old, and broke with a UI update,
so I rewrote the entire theme from scratch. This version has more customizations.

Since there was no good dark theme for Google Classroom and the Dark Reader extension
didn't work perfectly, I decided to create my own dark theme for Google Classroom.
*/

@-moz-document domain("classroom.google.com") {
  body {
    background-color: bg-primary;
    color: text-primary;
  }
  
  .VfPpkd-xl07Ob .VfPpkd-StrnGf-rymPhb-IhFlZd, .VfPpkd-xl07Ob .VfPpkd-StrnGf-rymPhb-f7MjDc {
    color: text-primary;
  }
  
  .I7OXgf {
    background-color: bg-primary;
  }
  
  .joJglb,
  .mwJvDe .KEDCCd,
  .Tabkde, .Tabkde .OX4Vcb,
  .ETRkCe,
  .lXuxY .u73Apc
  {
    background-color: navbar;
    border-color: border-primary;
  }
  
  .WMQb5e .oBSRLe,
  .s2g3Xd,
  .q1Kmyc,
  .SZ0kZe,
  .gKkZCe,
  .E5f6Vd,
  .svNSpd,
  .Rj2Mlf:not(:disabled),
  .ar1wE .eqqrO, .ySjuvd .eqqrO,
  .AeAAkf,
  .DC55n td,
  .a4YS1c,
  .hYt5f.FRDm8d .WkZsyc:not(:last-child), .hYt5f.FRDm8d .Kql9ed:not(:last-child),
  .geqPvd .VfPpkd-WLXbod, .geqPvd,
  .tUJKGd:not(:first-child),
  .d6CWTd, .ycbm1d,
  .LDr2ne,
  .O9YpHb, .Iwp0Ue:not(:first-child)
  {
    border-color: border-primary;
  }
  
  .xVPuB .mIZh1c, .vnnr5e .mIZh1c, .oQ5Hqe {
    background-color: border-2nd;
  }
  
  .MHxtic:not(:last-child), .LKqFXc,
  .Rj2Mlf:not(:disabled):hover
  {
    border-color: border-2nd;
  }
  
  .EZrbnd,
  .asQXV,
  .rpo4wf-J3yWx,
  .wZTANe .J1raN,
  .A6dC2c-J3yWx, .z3vRcc-J3yWx,
  .z3vRcc, .tDxNLe
  .apFsO.onkcGd, .apFsO.onkcGd:visited,
  .WOPwXe,
  .A6dC2c, .saYe1e,
  .cfWmIb:not(.VfPpkd-fmcmS-yrriRe-OWXEXe-OWB6Me) .VfPpkd-fmcmS-wGMbrd,
  .Evt7cb, .Evt7cb:visited,
  .nk37z,
  .geqPvd .VfPpkd-Rj7Y9b,
  .q6oraf .VfPpkd-StrnGf-rymPhb,
  .z80M1,
  .s8kOBc .VfPpkd-rymPhb-ibnC6b-OWXEXe-gk6SMd .VfPpkd-rymPhb-fpDzbe-fmcmS, .s8kOBc .VfPpkd-rymPhb-ibnC6b-OWXEXe-pXU01b .VfPpkd-rymPhb-fpDzbe-fmcmS, .s8kOBc .VfPpkd-rymPhb-ibnC6b-OWXEXe-gk6SMd.VfPpkd-rymPhb-ibnC6b-OWXEXe-SfQLQb-M1Soyc-Bz112c .VfPpkd-rymPhb-KkROqb, .s8kOBc .VfPpkd-rymPhb-ibnC6b-OWXEXe-pXU01b.VfPpkd-rymPhb-ibnC6b-OWXEXe-SfQLQb-M1Soyc-Bz112c .VfPpkd-rymPhb-KkROqb
  {
    color: text-primary;
  }
  
  .wZTANe .J1raN:hover,
  .LjDxcd:hover:not(:disabled), .LjDxcd.VfPpkd-ksKsZd-mWPk3d-OWXEXe-AHe6Kc-XpnDCe:not(:disabled), .LjDxcd:not(.VfPpkd-ksKsZd-mWPk3d):focus:not(:disabled), .LjDxcd:active:not(:disabled)
  {
    color: text-hover;
  }
  
  .dDKhVc, .WdYux, .tLDEHd, .ViCi4,
  .Erb9le:not(.RDPZE) .qmMNRc:hover, .Erb9le:not(.RDPZE) .qmMNRc.y7OZL,
  .ReCbLb:not(.VfPpkd-O1htCb-OWXEXe-OWB6Me) .VfPpkd-uusGie-fmcmS,
  .FUvKMe, // wtf is this class name
  .cSyPgb,
  .lziZub, .lziZub:visited,
  .s8kOBc .VfPpkd-rymPhb-fpDzbe-fmcmS,
  .WmnPA:not(.VfPpkd-fmcmS-yrriRe-OWXEXe-OWB6Me) .VfPpkd-fmcmS-wGMbrd
  {
    color: text-secondary;
  }
  
  .K6Ovqd, .sdDCme, .oBSRLe, .IMvYId, .IMvYId:visited, .LjDxcd:not(:disabled) {
    color: text-tertiary;
  }
  
  .hgjBDc, .DC55n td {
    background-color: bg-secondary;
  }
  
  .d4Fe0d, .Aopndd {
    background-color: bg-secondary;
    border-color: border-primary;
  }
  
  .vnnr5e .I9OJHe, .vnnr5e .CIy9F, .fWf7qe .Yalane, .aSjeL.aSjeL td,
  .V8apv,
  .WufxEd .ynt9Dc .VfPpkd-WLXbod, .WufxEd .ynt9Dc,
  .VfPpkd-xl07Ob-XxIAqe,
  .hVNH5c .K0NPx,
  .s8kOBc .VfPpkd-rymPhb-ibnC6b.VfPpkd-rymPhb-ibnC6b-OWXEXe-gk6SMd,
  .WmnPA:not(.VfPpkd-fmcmS-yrriRe-OWXEXe-OWB6Me)
  {
    background-color: bg-tertiary;
  }
  
  .vnnr5e:not(.RDPZE):hover .I9OJHe, .vnnr5e:not(.RDPZE):hover .CIy9F,
  .fWf7qe:not(.RDPZE):hover .Yalane,
  .TisIWb .kKn9Nc:before,
  .z80M1.FwR7Pc,
  .Mupove .tUJKGd:not(.xp2dJ):focus-within.boxOzd, .Mupove .tUJKGd:not(.xp2dJ):focus-within.idtp4e, .Mupove .tUJKGd:not(.xp2dJ) :focus-within.boxOzd, .Mupove .tUJKGd:not(.xp2dJ) :focus-within.idtp4e, .Mupove .ZoT1D:focus-within.boxOzd, .Mupove .ZoT1D:focus-within.idtp4e, .Mupove .ZoT1D :focus-within.boxOzd, .Mupove .ZoT1D :focus-within.idtp4e
  {
    background-color: bg-hover;
  }
  
  
  .ZoT1D:hover.idtp4e,
  .UISY8d-Ysl7Fe:hover,
  .P3W0Dd-Ysl7Fe:focus, .maXJsd:focus .P3W0Dd-Ysl7Fe, .maXJsd:focus .P3W0Dd-Ysl7Fe,
  .bFjUmb-Ysl7Fe, .bFjUmb-Ysl7Fe, .CNpREd.bFjUmb-Ysl7Fe, .CNpREd .bFjUmb-Ysl7Fe,
  .qk0lee:focus:after,
  .TJtJXb:hover td, .tYQn5c:hover td, .DC55n:hover td,
  .Iwp0Ue:not(.xp2dJ):not(.rZXyy):hover.rXdid, .Iwp0Ue:not(.xp2dJ):not(.rZXyy):hover.h7Ww0, .Iwp0Ue:not(.xp2dJ):not(.rZXyy):hover .rXdid, .Iwp0Ue:not(.xp2dJ):not(.rZXyy):hover .h7Ww0, .xWw7yd:hover.rXdid, .xWw7yd:hover.h7Ww0, .xWw7yd:hover .rXdid, .xWw7yd:hover .h7Ww0
  {
    background-color: bg-hover !important;
  }
  
  .Iwp0Ue:not(.xp2dJ):not(.rZXyy) .h7Ww0 {
    background-color: bg-primary !important;
  }
  
  .z80M1.qs41qe>.aBBjbd {
    background-image: radial-gradient(circle farthest-side,#424242,#424242 80%,rgba(189,189,189,0) 100%)
  }
  
  
  
  // Hardcoded fixes
  .u73Apc:not(.lXuxY .u73Apc) {
    border-bottom: none;
  }
  
  if fix-accent {
    .UvHKof {
      .OGhwGf:hover, .OGhwGf:focus,
      .VnOHwf-Tvm9db, .VnOHwf-Tvm9db, .CNpREd.VnOHwf-Tvm9db, .CNpREd .VnOHwf-Tvm9db,
      .n42Gr:not(:disabled),
      .n42Gr:not(:disabled):hover,
      .n42Gr:not(:disabled).VfPpkd-ksKsZd-mWPk3d-OWXEXe-AHe6Kc-XpnDCe, .n42Gr:not(:disabled):not(.VfPpkd-ksKsZd-mWPk3d):focus
      {
        color: #dfdedb;
        fill: #dfdedb;
      }
    }
  }
}