diff --git a/.build/build.py b/.build/build.py
index 42504049..98e17a7c 100644
--- a/.build/build.py
+++ b/.build/build.py
@@ -1,16 +1,23 @@
import argparse
import json
import os
+import sys
import shutil
import copy
import errno
+try:
+ import sass
+except ModuleNotFoundError:
+ print("ERROR: Missing SASS library. Please install using 'pip install libsass'")
+ sys.exit(1)
+
class BuildRules:
def __init__(self, config):
self.excluded_files = config["excluded_files"] or []
self.properties = config["properties"] or {}
-EXCLUDED_FILES = [".build", ".git", ".github", ".vscode", "SchoologyPlus.zip", "webstore-description.txt"]
+EXCLUDED_FILES = [".build", ".git", ".github", ".vscode", "SchoologyPlus.zip", "webstore-description.txt", "sass"]
chrome_rules = BuildRules({
"excluded_files": [],
@@ -33,7 +40,7 @@ def __init__(self, config):
}
parser = argparse.ArgumentParser(description="Schoology Plus build script")
-parser.add_argument("target", choices=list(targets.keys()) + ["all"], help="Which target to build")
+parser.add_argument("target", choices=list(targets.keys()) + ["all", "dev"], help="Which target to build")
args = parser.parse_args()
os.chdir(os.path.dirname(__file__) + "/..")
@@ -68,6 +75,17 @@ def copyFileOrDirectory(src, dst):
shutil.copy(src, dst)
else: raise
+def compileSCSS():
+ scss_dirs = [('scss/modern', 'css/modern')]
+ for dir_pair in scss_dirs:
+ print(f"Compiling SCSS in directory '{dir_pair[0]}' to directory '{dir_pair[1]}'")
+ sass.compile(dirname=dir_pair, output_style='expanded')
+
+compileSCSS()
+
+if args.target == "dev":
+ sys.exit()
+
for target in targets:
if args.target != "all" and args.target != target:
continue
diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md
index 60adf0b5..a64f00fb 100644
--- a/.github/ISSUE_TEMPLATE/bug_report.md
+++ b/.github/ISSUE_TEMPLATE/bug_report.md
@@ -8,17 +8,20 @@ assignees: ''
---
-**Describe the bug**
-A clear and concise description of what the bug is.
+### Describe the bug
+> A clear and concise description of what the bug is.
-**To Reproduce**
-Steps to reproduce the behavior
+### Steps to reproduce
+> Detailed steps to reproduce the behavior you describe
-**Expected behavior**
-A clear and concise description of what you expected to happen.
+### Expected behavior
+> A clear and concise description of what you expected to happen.
-**Screenshots**
-If applicable, add screenshots to help explain your problem.
+### Screenshots
+> If applicable, add screenshots to help explain your problem.
-**Additional context**
-Add any other context about the problem here.
+### Additional context
+> Add any other context about the problem here.
+
+### Platform
+> Please include your browser name, browser version, Schoology URL (if you feel comfortable), and Schoology Plus version
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 8a18f0fc..e945407a 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -3,22 +3,22 @@
Thank you for your interest in contributing to Schoology Plus! This is an open source passion project, so any help we can get is highly appreciated. Here are some of the ways you can contribute to Schoology Plus:
## Pull Requests
-Pull requests are welcomed! If you would like to add a new feature, the best way of doing so is to submit a pull request. All pull requests will be considered and reviewed thoroughly.
+Pull requests are welcomed! If you would like to add a new feature, the best way of doing so is to submit a pull request. All pull requests will be considered and reviewed thoroughly. Contact us in the `#contributions` channel in our [Discord server](https://discord.schoologypl.us) for help deciphering the code!
## Bug Reports
There are two ways you can report bugs you find in Schoology Plus:
1. Create a detailed [GitHub issue](https://github.com/aopell/SchoologyPlus/issues/new) describing the bug. Please provide detailed **steps to reproduce** and **screenshots** of the issue if applicable.
-2. Send a message in the #bugs-and-features channel of our [Discord server](https://discord.schoologypl.us).
+2. Send a message in the `#bug-reports` channel of our [Discord server](https://discord.schoologypl.us).
## Feature Requests
-To avoid the problem of issue spam, we'd appreciate if you kept all feature requests in the `#bugs-and-features` channel of our [Discord server](https://discord.schoologypl.us). Please **do not create GitHub issues for feature requests**.
+To avoid the problem of issue spam, we'd appreciate if you kept all feature requests in the `#feature-requests` channel of our [Discord server](https://discord.schoologypl.us). Please **do not create GitHub issues for feature requests**.
## Documentation
-If you would like to help write documentation for Schoology Plus, please contact us in either the `#support` or `#bugs-and-features` channel of our [Discord server](https://discord.schoologypl.us). We really appreciate all documentation contributions!
+If you would like to help write documentation for Schoology Plus, please contact us in either the `#contributions` channel of our [Discord server](https://discord.schoologypl.us). We really appreciate all documentation contributions!
## Content
-If you would like to submit content for Schoology Plus (including, but not limited to: course icons, themes, and other assets) please contact us in either the `#support` or `#bugs-and-features` channel of our [Discord server](https://discord.schoologypl.us).
+If you would like to submit content for Schoology Plus (including, but not limited to: course icons, themes, and other assets) please contact us in either the `#contributions` channel of our [Discord server](https://discord.schoologypl.us).
## Other Contributions
-If you can think of another way of contributing to Schoology Plus that isn't listed here, please contact us in our [Discord server](https://discord.schoologypl.us)!
\ No newline at end of file
+If you can think of another way of contributing to Schoology Plus that isn't listed here, please contact us in our [Discord server](https://discord.schoologypl.us)!
diff --git a/LICENSE b/LICENSE
index c8afd4ec..d1c6b57b 100644
--- a/LICENSE
+++ b/LICENSE
@@ -1,6 +1,6 @@
MIT License
-Copyright (c) 2017-2020 Aaron Opell and Glen Husman
+Copyright (c) 2017-2021 Aaron Opell and Glen Husman
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
diff --git a/PRIVACY.md b/PRIVACY.md
index e23532ca..bcd4da71 100644
--- a/PRIVACY.md
+++ b/PRIVACY.md
@@ -2,17 +2,19 @@
## Introduction
-It is Schoology Plus's policy to respect your privacy regarding any information we may collect while operating our browser extension. This Privacy Policy applies to the Schoology Plus browser extension for Chrome, Firefox, and Microsoft Edge (hereinafter, "us", "we", "the Extension", or "Schoology Plus"). We respect your privacy and are committed to protecting personally identifiable information accessible to us through the Extension. We have adopted this privacy policy ("Privacy Policy") to explain what information may be collected by our Extension, how we use this information, and under what circumstances we may disclose the information to third parties. This Privacy Policy applies only to information we collect through the Extension and does not apply to our collection of information from other sources.
+**Updated 5/26/2020**
+
+It is Schoology Plus's policy to respect your privacy regarding any information we may collect while using our website or operating our browser extension. This Privacy Policy applies to the Schoology Plus website and browser extension for Chrome, Firefox, and Microsoft Edge (hereinafter, "us", "we", or "Schoology Plus"). We respect your privacy and are committed to protecting personally identifiable information accessible to us through usage of Schoology Plus. We have adopted this privacy policy ("Privacy Policy") to explain what information may be collected by our Extension, how we use this information, and under what circumstances we may disclose the information to third parties. This Privacy Policy applies only to information we collect through the website and browser extension and does not apply to our collection of information from other sources.
## Non Personally Identifying Information
-Like most website operators, Schoology Plus collects non-personally-identifying information of the sort that web browsers and servers typically make available, such as the browser type, language preference, referring site, and the date and time of each user request. Schoology Plus's purpose in collecting non-personally identifying information is to better understand how Schoology Plus's users use the Extension. From time to time, Schoology Plus may release non-personally-identifying information in the aggregate, e.g., by publishing a report on trends in the usage of the Extension.
+Like most website operators, Schoology Plus collects non-personally-identifying information of the sort that web browsers and servers typically make available, such as the browser type, language preference, referring site, and the date and time of each user request. Schoology Plus's purpose in collecting non-personally identifying information is to better understand how Schoology Plus's users use the website and extension. From time to time, Schoology Plus may release non-personally-identifying information in the aggregate, e.g., by publishing a report on trends in the usage of the website and/or the extension.
-Schoology Plus uses Google Analytics to collect information for these purposes. If you would like to opt-out of tracking, you can install the [Google Analytics Opt-out Add-on](https://chrome.google.com/webstore/detail/google-analytics-opt-out/fllaojicojecljbmefodhfapmkghcbnh?hl=en) or another tracking-prevention extension.
+Schoology Plus uses Google Analytics to collect information for these purposes. If you would like to opt-out of tracking on our website, you can install the [Google Analytics Opt-out Add-on](https://chrome.google.com/webstore/detail/google-analytics-opt-out/fllaojicojecljbmefodhfapmkghcbnh?hl=en) or another tracking-prevention extension. If you would like to opt-out of tracking in our extension, you can change the "Anonymous Usage Statistics" setting to "Disabled" in Schoology Plus settings.
## Personally Identifying Information
-By using Schoology Plus, you grant us access to view and modify the contents of the Schoology website in your web browser. However, we DO NOT harvest or collect any information that can personally identify you longer than absolutely necessary to perform calculations or page enhancements. This information (including, but not limited to: school name, grades, and assignment details) is only modified locally and never leaves your computer.
+By using Schoology Plus, you grant us access to view and modify the contents of the Schoology website in your web browser. However, we DO NOT harvest or collect any information that can personally identify you longer than absolutely necessary to perform calculations or page enhancements. This information (including, but not limited to, name, grades, and assignment details) is only modified locally and never leaves your computer.
## Aggregated Statistics
@@ -20,11 +22,11 @@ Schoology Plus may collect statistics about the behavior of users. Schoology Plu
## Cookies
-To enrich and perfect your online experience, Schoology Plus uses "Cookies", similar technologies and services provided by others to display personalized content and store your preferences on your computer. A cookie is a string of information that a website stores on a user's computer, and that the user's browser provides to the website each time the user returns. Schoology Plus uses cookies to help us identify and track users' extension preferences. Schoology Plus users who do not wish to have cookies placed on their computers should set their browsers to refuse cookies before using the Extension, with the drawback that certain features of Schoology Plus may not function properly without the aid of cookies. By continuing to use the Extension without changing your cookie settings, you hereby acknowledge and agree to Schoology Plus's use of cookies.
+To enrich and perfect your online experience, Schoology Plus uses "Cookies" and similar technologies and services provided by others to display personalized content and store your preferences on your computer. A cookie is a string of information that a website stores on a user's computer, and that the user's browser provides to the website each time the user returns. Schoology Plus uses cookies to help us identify and track users' extension preferences. Schoology Plus users who do not wish to have cookies placed on their computers should set their browsers to refuse cookies before using Schoology Plus, with the drawback that certain features of Schoology Plus may not function properly without the aid of cookies. By continuing to use Schoology Plus without changing your cookie settings, you hereby acknowledge and agree to Schoology Plus's use of cookies.
## Privacy Policy Changes
-Although most changes are likely to be minor, Schoology Plus may change its Privacy Policy from time to time, and in Schoology Plus's sole discretion. Schoology Plus encourages users to frequently check this page for any changes to its Privacy Policy. Your continued use of the Extension after any change in this Privacy Policy will constitute your acceptance of such change. Any major changes will be prominently announced.
+Although most changes are likely to be minor, Schoology Plus may change its Privacy Policy from time to time, and in Schoology Plus's sole discretion. Schoology Plus encourages users to frequently check this page for any changes to its Privacy Policy. Your continued use of Schoology Plus after any change in this Privacy Policy will constitute your acceptance of such change. Any major changes will be prominently announced.
## Disclaimer
@@ -32,4 +34,4 @@ Schoology Plus is not affiliated with Schoology Inc. or the Los Angeles Unified
## Contact
-The developers of Schoology Plus can be contacted by email at [hello@schoologypl.us](mailto:hello@schoologypl.us) or through Discord at [this link](https://discord.schoologypl.us).
\ No newline at end of file
+The developers of Schoology Plus can be contacted by email at [privacy@schoologypl.us](mailto:privacy@schoologypl.us) or through Discord at [this link](https://schoologypl.us/discord).
diff --git a/README.md b/README.md
index a7b439cb..29516dfb 100644
--- a/README.md
+++ b/README.md
@@ -9,14 +9,14 @@
[](http://discord.schoologypl.us)
[](https://schoologypl.us/changelog)
-[](https://chrome.google.com/webstore/detail/schoology-plus/fbfppoaockpecjpbdmldojdehdpepfef)
+[](https://chrome.google.com/webstore/detail/schoology-plus/fbfppoaockpecjpbdmldojdehdpepfef)
[Schoology Plus v${chrome.runtime.getManifest().version_name || chrome.runtime.getManifest().version}${getBrowser() != "Chrome" || chrome.runtime.getManifest().update_url ? '' : ' dev'} | Discord Server | GitHub | Contributors | Privacy Policy | Changelog `;
-let modalFooterText = "Schoology Plus © Aaron Opell, Glen Husman 2017-2020";
+let verboseModalFooterText = `© Aaron Opell, Glen Husman 2017-2021 | Schoology Plus v${chrome.runtime.getManifest().version_name || chrome.runtime.getManifest().version}${getBrowser() != "Chrome" || chrome.runtime.getManifest().update_url ? '' : ' dev'} | Discord Server | GitHub | Contributors | Privacy Policy | Changelog `;
+let modalFooterText = "Schoology Plus © Aaron Opell, Glen Husman 2017-2021";
let frame = document.createElement("iframe");
frame.src = `https://schoologypl.us/changelog?version=${chrome.runtime.getManifest().version}`;
@@ -282,11 +247,13 @@ let modals = [
]),
createElement("div", ["setting-entry"], {}, [
createElement("h3", ["setting-title"], {}, [
+ createElement("a", [], { href: "https://github.com/xd-arsenic", textContent: "Alexander (@xd-arsenic)" }),
+ createElement("span", [], { textContent: ", " }),
createElement("a", [], { href: "https://github.com/Roguim", textContent: "@Roguim" }),
createElement("span", [], { textContent: ", " }),
createElement("a", [], { href: "https://github.com/reteps", textContent: "Peter Stenger (@reteps)" }),
createElement("span", [], { textContent: ", and " }),
- createElement("a", [], { href: "https://github.com/xd-arsenic", textContent: "Alexander (@xd-arsenic)" })
+ createElement("a", [], { href: "https://github.com/KTibow", textContent: "@KTibow" }),
]),
createElement("p", ["setting-description"], { textContent: "Various code contributions" })
]),
@@ -348,6 +315,62 @@ let modals = [
]),
modalFooterText
),
+ new Modal(
+ "choose-theme-modal",
+ "Schoology Plus Themes",
+ createElement("div", ["splus-modal-contents"], {}, [
+ createElement("h2", ["setting-entry"], { textContent: "Choose a New Theme!" }),
+ createElement("p", ["setting-description"], { textContent: "Schoology Plus has a bunch of new themes! Choose one from below, make your own, or keep your current theme. It's your choice! Click on each theme for a preview and then click the button to confirm your choice. You can change your theme at any time in Schoology Plus Settings.", style: { fontSize: "14px", paddingBottom: "10px" } }),
+ createElement("div", ["splus-button-tile-container"], {}, [
+ { text: "Modern Dark Theme", theme: "Schoology Plus Modern Dark", new: true },
+ { text: "Modern Light Theme", theme: "Schoology Plus Modern Light", new: true },
+ { text: "Modern Rainbow Theme", theme: "Rainbow Modern", new: true },
+ { text: "Schoology Plus Classic Theme", theme: "Schoology Plus", active: Theme.active.name === "Schoology Plus" },
+ { text: `Keep Current Theme: ${Theme.active.name}`, theme: Theme.active.name, active: Theme.active.name !== "Schoology Plus", hidden: Theme.active.name === "Schoology Plus" },
+ { text: "See More Themes or Make Your Own", theme: Theme.active.name, extraWide: Theme.active.name === "Schoology Plus" },
+ ].map(
+ obj => {
+ return createElement("div", [...["splus-button-tile", "select-theme-tile"], ...(obj.active ? ["active"] : [])],
+ {
+ style: { display: obj.hidden ? "none" : "flex", gridColumnEnd: obj.extraWide ? "span 2" : "unset" },
+ dataset: { new: obj.new },
+ onclick: e => {
+ for (let child of e.target.parentElement.children) {
+ child.classList.remove("active");
+ }
+ e.target.classList.add("active");
+
+ trackEvent("selected tile", obj.text, "Choose Theme Popup");
+
+ tempTheme = obj.theme;
+ Theme.apply(Theme.byName(obj.theme));
+
+ document.getElementById("theme-popup-select-button").value = `Select ${obj.text}`;
+ }
+ },
+ [
+ createElement("span", ["splus-button-tile-content"], { textContent: obj.text })
+ ]
+ )
+ }
+ )),
+ (() => {
+ let btn = createButton("theme-popup-select-button", `Select Keep Current Theme: ${Theme.active.name}`, e => {
+ localStorage.setItem("splus-temp-theme-chosen", true);
+ trackEvent("confirmed selection", document.querySelector(".select-theme-tile.active .splus-button-tile-content").textContent, "Choose Theme Popup");
+ modalClose(document.getElementById("choose-theme-modal"));
+ Setting.setValue("theme", tempTheme);
+ if (document.getElementById("choose-theme-modal").querySelector(".splus-button-tile-container .splus-button-tile:last-child").classList.contains("active")) {
+ location.href = chrome.runtime.getURL("/theme-editor.html");
+ }
+ });
+ btn.style.float = "right";
+ btn.style.margin = "20px 20px 0";
+ return btn;
+ })()
+ ]),
+ modalFooterText
+ )
];
(() => {
@@ -356,6 +379,11 @@ let modals = [
if (!newVersion || newVersion != chrome.runtime.getManifest().version) {
let currentVersion = chrome.runtime.getManifest().version;
+ if (Setting.getValue("defaultDomain") != window.location.hostname) {
+ Logger.log("[Updater] Domain isn't set as default, skipping migrations until domain is updated.");
+ return;
+ }
+
iziToast.show({
theme: 'dark',
iconUrl: chrome.runtime.getURL("/imgs/plus-icon.png"),
@@ -447,10 +475,54 @@ document.querySelector("#header > header > nav > ul:nth-child(2)").prepend(creat
createElement(
"button",
["_1SIMq", "_2kpZl", "_3OAXJ", "_13cCs", "_3_bfp", "_2M5aC", "_24avl", "_3v0y7", "_2s0LQ", "_3ghFm", "_3LeCL", "_31GLY", "_9GDcm", "_1D8fw", "util-height-six-3PHnk", "util-line-height-six-3lFgd", "util-text-decoration-none-1n0lI", "Header-header-button-active-state-3AvBm", "Header-header-button-1EE8Y", "sExtlink-processed"],
- { onclick: () => openModal("settings-modal") },
+ {
+ id: "splus-settings-navbar-button",
+ title: "Schoology Plus Settings\n\nChange settings relating to Schoology Plus.",
+ onclick: () => {
+ openModal("settings-modal");
+ trackEvent("splus-settings", "open", "Navbar Button");
+ }
+ },
[
createSvgLogo("_3ESp2", "dlCBz", "_1I3mg", "fjQuT", "uQOmx")
]
+ ),
+ createElement(
+ "button",
+ ["_1SIMq", "_2kpZl", "_3OAXJ", "_13cCs", "_3_bfp", "_2M5aC", "_24avl", "_3v0y7", "_2s0LQ", "_3ghFm", "_3LeCL", "_31GLY", "_9GDcm", "_1D8fw", "util-height-six-3PHnk", "util-line-height-six-3lFgd", "util-text-decoration-none-1n0lI", "Header-header-button-active-state-3AvBm", "Header-header-button-1EE8Y", "sExtlink-processed", "splus-track-clicks"],
+ {
+ id: "darktheme-toggle-navbar-button",
+ title: "Toggle Theme\n\nUse this button to temporarily disable your Schoology Plus theme if something isn't displaying correctly.",
+ onclick: e => {
+ let newVal = document.documentElement.getAttribute("modern") == "false" ? "true" : "false";
+ document.documentElement.setAttribute("modern", newVal);
+ trackEvent("modern-theme-toggle", newVal, "Navbar Button");
+ },
+ dataset: { popup: Setting.getNestedValue("popup", "modernThemeToggle", true) }
+ },
+ [
+ createElement("div", ["explanation-popup"], {}, [
+ createElement("span", [], { title: "", textContent: "Use this button to temporarily disable your Schoology Plus theme if something isn't displaying correctly." }),
+ createElement("h3", [], {
+ textContent: "OK",
+ onclick: e => {
+ e.stopPropagation();
+ trackEvent("modern-theme-toggle", "ok", "Explanation Popup");
+ Setting.setNestedValue("popup", "modernThemeToggle", false);
+ document.getElementById("darktheme-toggle-navbar-button").dataset.popup = false;
+ }
+ })
+ ]),
+ (function () {
+ let paintSvg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+ paintSvg.setAttribute("viewBox", "-12 -20 500 500");
+ paintSvg.setAttribute("class", "_3ESp2 dlCBz _1I3mg fjQuT uQOmx");
+
+ paintSvg.innerHTML = 'arrow_downward arrow_upward delete Thank you for helping improve Schoology Plus! Your feedback is incredibly valuable to us!
- Click here to visit survey.schoologypl.us and take the survey now!
+ Click here to visit survey.schoologypl.us and take the survey now!
`,
new Date(2020, 11 /* November */, 2)
@@ -314,6 +308,32 @@ let migrationsTo = {
"6.7.1": function (currentVersion, previousVersion) {
// reset setting value so people have checklists enabled by default
Setting.setValue("indicateSubmission", undefined);
+ },
+ "7.0": function (currentVersion, previousVersion) {
+ saveBroadcasts([
+ createBroadcast(
+ 700,
+ "Schoology Plus Fall 2020 Survey Closing Soon!",
+ `
+
+
The Schoology Plus Fall 2020 Survey will close on 1/31/2021 at midnight PST.
+
Big thank you to those who have already completed the survey! You're really helping improve Schoology Plus!
+
+
If you haven't yet filled it out, remember that By spending less than 15 minutes completing the survey and you'll be entered into a giveaway for one of 20 Amazon gift cards totaling $150!
+
+
Click here to visit survey.schoologypl.us and take the survey now!
+
"
],
"web_accessible_resources": [
"imgs/*",
"lib/js/pdf.worker.js",
"theme-editor.html",
- "default-icons.html",
- "css/modern.css"
+ "default-icons.html"
],
"content_security_policy": "script-src 'self'; object-src 'self'",
"background": {
@@ -50,6 +52,7 @@
"js/analytics.js",
"lib/js/analytics.js",
"lib/js/purify.min.js",
+ "js/background-permissions.js",
"js/background.js"
],
"persistent": true
@@ -77,7 +80,8 @@
"*://support.schoology.com/*"
],
"css": [
- "css/all.css"
+ "css/all.css",
+ "css/modern/all.css"
],
"js": [
"js/analytics.js",
@@ -215,7 +219,7 @@
"js": [
"js/page.js"
],
- "run_at":"document_end"
+ "run_at": "document_end"
},
{
"matches": [
diff --git a/scss/modern/all.scss b/scss/modern/all.scss
new file mode 100644
index 00000000..f59347a3
--- /dev/null
+++ b/scss/modern/all.scss
@@ -0,0 +1,3000 @@
+variable-intellisense {
+ --primary: #36393F;
+ --accent: #2F3136;
+ --secondary: #202225;
+ --text: #DCDDDE;
+ --contrast-text: #EEEEEE;
+ --muted-text: #72767D;
+ --contrast-border: #DCDDDE;
+ --input: #40444B;
+ --error: #F44336;
+ --highlight: rgba(184, 134, 11, 0.2);
+ --active: rgba(0, 255, 255, 0.1);
+ --grades: #8BC34A;
+ --border-radius: 5px;
+ --border-size: 1px;
+ --padding: 10px;
+ --theme-is-dark: 1;
+ --cal1: #457da5;
+ --cal2: #547c41;
+ --cal3: #926c37;
+ --cal4: #7c3d6b;
+ --cal5: #0b4c9c;
+ --cal6: #00209c;
+ --cal7: #004a09;
+ --cal8: #72721a;
+ --cal9: #44233e;
+ --cal10: #683131;
+ --cal11: #770a0a;
+ --cal12: #a72413;
+ --cal13: #E0024C;
+ --cal14: #188C16;
+ --cal15: #bd7304;
+ --cal16: #80168C;
+ --cal17: #164152;
+ --cal18: #00543f;
+ --cal19: #633e11;
+ --cal20: #461b2d;
+}
+
+:root[modern=true] {
+ --modern-border: var(--border-size) solid var(--contrast-border);
+
+ // General
+
+ h1,
+ h2,
+ h3,
+ h4,
+ h5,
+ h6,
+ p {
+ color: var(--text) !important;
+ }
+
+ pre {
+ background-color: var(--input);
+ color: var(--text);
+ }
+
+ #youtube-disclaimer {
+ display: inline-block !important;
+ color: var(--text) !important;
+ background-color: var(--secondary) !important;
+ padding: var(--padding) !important;
+ margin-top: var(--padding) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ textarea,
+ select,
+ input[type=text] {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ // All user-styled elements -- should be for override user styles only
+ &[style-override=true] {
+ .s-edge-feed .edge-item *[style] {
+ color: var(--text) !important;
+ background: none !important;
+ }
+
+ .discussion-view {
+
+ .discussion-prompt *[style],
+ .comment-body-wrapper *[style] {
+ color: var(--text) !important;
+ background: none !important;
+ }
+ }
+
+ #important-post-body *[style],
+ #main-inner .info-container *[style],
+ .standard-page .s-page-content-full *[style],
+ .discussion-prompt *[style],
+ .comment-comment .comment-body-wrapper *[style],
+ .instructions-content *[style],
+ .lrn_stimulus .lrn_stimulus_content *[style],
+ .lrn-possible-answer *[style] {
+ color: var(--text) !important;
+ background: none !important;
+ }
+ }
+
+ ul.context-menu-list {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-color: var(--accent) !important;
+
+ li.context-menu-item {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-color: var(--accent) !important;
+
+ &:hover {
+ background-color: var(--active) !important;
+ }
+ }
+ }
+
+ .menu-459.group-discussion-left-menu {
+ background-color: var(--primary) !important;
+ }
+
+ * {
+ &::-webkit-scrollbar {
+ background: transparent !important;
+ width: 15px;
+ }
+
+ &::-webkit-scrollbar-track-piece {
+ background: var(--accent) !important;
+ }
+
+ &::-webkit-scrollbar-button,
+ &::-webkit-scrollbar-corner {
+ display: none !important;
+ }
+
+ &::-webkit-scrollbar-thumb {
+ background: var(--input) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ scrollbar-color: var(--input) var(--accent) !important;
+ scrollbar-width: 15px !important;
+ scrollbar-arrow-color: var(--contrast-text) !important;
+ }
+
+ #body {
+ background-color: var(--primary) !important;
+ }
+
+ iframe {
+ // iframe must be white, because we can't change styles within it
+ background-color: white !important;
+ }
+
+ #main-content-wrapper {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+ }
+
+ #right-column-inner {
+ >div:not(:empty) {
+ background-color: var(--secondary) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ padding: var(--padding) !important;
+ }
+
+ >div[id^=sgyReactRenders_comp_] {
+ display: none;
+ }
+ }
+
+ #center-top {
+ background: unset !important;
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ border: none !important;
+ }
+
+ .has-right-col #center-inner {
+ background: none !important;
+ }
+
+ body {
+
+ a.link-btn,
+ button.link-btn {
+ box-shadow: none !important;
+ background: none !important;
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+ }
+
+ .inline-popup-wrapper {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+
+ .arrow-top {
+ display: none !important;
+ }
+ }
+
+ .s-polls-results-overlay {
+ background-color: var(--input) !important;
+ }
+
+ .s-notifications-mini .edge-sentence {
+ color: var(--text);
+ }
+
+ .grade-data {
+ color: var(--grades) !important;
+ }
+
+ #main .s-notifications-mini {
+
+ .edge-time,
+ .created {
+ color: var(--muted-text) !important;
+ }
+ }
+
+ .splus-modal-title {
+ color: var(--contrast-text) !important;
+ }
+
+ .submit-span-wrapper {
+ color: var(--contrast-text) !important;
+
+ input {
+
+ &[type="button"],
+ &[type="submit"] {
+ color: var(--contrast-text) !important;
+ }
+ }
+ }
+
+ :not(.submit-span-wrapper)>input {
+
+ &[type="button"],
+ &[type="submit"] {
+ color: var(--contrast-text) !important;
+ }
+ }
+
+ footer li a,
+ header li a {
+ color: var(--contrast-text) !important;
+ }
+
+ .splus-modal-footer-text {
+ color: var(--contrast-text) !important;
+
+ a {
+ color: var(--contrast-text) !important;
+ }
+ }
+
+ body a.link-btn.active,
+ div.courses-left-menu,
+ .portfolio-list a.btn,
+ a._3_bfp {
+ color: var(--contrast-text) !important;
+ }
+
+ footer {
+ color: var(--contrast-text) !important;
+
+ button {
+ color: var(--contrast-text) !important;
+ }
+ }
+
+ .Header-header-button-1EE8Y,
+ [class*="Header-header-drop-menu-item-"],
+ [class*="Header-header-drop-menu-"] li a *,
+ .Header-header-button-active-GnvKh,
+ .LGaPf svg {
+ color: var(--contrast-text) !important;
+ }
+
+ .Header-header-drop-menu-3SaYV._1Z0RM {
+ background-color: var(--hover-color) !important;
+ }
+
+ .close {
+ color: var(--contrast-text) !important;
+ opacity: 0.8 !important;
+
+ &:hover,
+ &:focus {
+ opacity: 1 !important;
+ color: var(--contrast-text) !important;
+ }
+ }
+
+ .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text {
+ background-color: var(--text) !important;
+ color: var(--secondary) !important;
+ filter: Invert(var(--theme-is-dark)) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ .action-links-unfold {
+ background-image: none !important;
+ background-color: var(--secondary) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ &[dark=false] .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ }
+
+ .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text:hover,
+ .action-links-unfold:hover {
+ background-color: var(--muted-text) !important;
+ }
+
+ &[dark=false] {
+
+ .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text:hover,
+ .action-links-unfold:hover {
+ background-color: var(--muted-text) !important;
+ }
+ }
+
+ // Schoology Popups
+
+ .popups-box .popups-body,
+ #popups-loading div {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ }
+
+ .popups-box {
+ .submit-buttons {
+ background-color: var(--accent) !important;
+ border-top: none !important;
+ }
+
+ .popups-title {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ }
+ }
+
+ .popups-close {
+ &:hover a {
+ background-color: var(--input) !important;
+ }
+
+ a {
+ background-position-y: calc(-80px - (20px * var(--theme-is-dark))) !important;
+ border-radius: 2px !important;
+ }
+ }
+
+ .likers li:not(.last) {
+ border-bottom: var(--modern-border) !important;
+ }
+
+ fieldset div div div label span {
+ color: var(--text) !important;
+ }
+
+ ._2WC16 span._24avl._17Z60 {
+ color: var(--accent) !important;
+ }
+
+ .popups-buttons-inner {
+ background: var(--secondary) !important;
+ }
+
+ .popups-tab,
+ .popups-tabs {
+ background: var(--accent) !important;
+ }
+
+ .popups-tab.active {
+ background: var(--primary) !important;
+ }
+
+ ._pendo-step-container-styles {
+ background-color: var(--accent) !important;
+ }
+
+ .pendo-mock-flexbox-element:nth-child(2)>button {
+ background-color: var(--primary) !important;
+ border-color: var(--contrast-border) !important;
+ color: var(--text) !important;
+ }
+
+ .popups-box {
+ &.popups-library #resources-left-menu-wrapper {
+ background: var(--accent) !important;
+ }
+
+ #library-wrapper {
+ background: var(--primary) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ }
+ }
+
+ div.error,
+ tr.error {
+ background-color: var(--error) !important;
+ border-color: var(--error) !important;
+ }
+
+ // Courses and Groups Dropdown
+
+ .splus-courses-navbar-button div[role=menu],
+ .splus-groups-navbar-button div[role=menu] {
+ background-color: var(--accent) !important;
+ }
+
+ .splus-coursesdropdown-reorder-btn {
+ filter: Invert(var(--theme-is-dark)) !important;
+ }
+
+ .splus-courses-navbar-button article,
+ .splus-groups-navbar-button article {
+ border: var(--border-size) solid transparent !important;
+ outline: none !important;
+
+ a {
+ border: var(--border-size) solid transparent !important;
+ outline: none !important;
+ }
+ }
+
+ .JoinCard-card-1qWtS {
+ border: var(--border-size) solid transparent !important;
+ outline: none !important;
+ }
+
+ .splus-courses-navbar-button article a:hover,
+ .splus-groups-navbar-button article a:hover,
+ .JoinCard-card-1qWtS:hover {
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ .Card-card-image-uV6Bu {
+ border-top-left-radius: var(--border-radius) !important;
+ border-top-right-radius: var(--border-radius) !important;
+ }
+
+ .Card-card-data-17m6S {
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+
+ div {
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+ }
+ }
+
+ .splus-courses-navbar-button article a div,
+ .splus-groups-navbar-button article a div {
+ background-color: var(--primary) !important;
+ }
+
+ .splus-courses-navbar-button article a div div._1wP6w,
+ .splus-groups-navbar-button article a div div._1wP6w {
+ color: var(--text) !important;
+ }
+
+ .splus-courses-navbar-button article a div div._2wOCj,
+ .splus-groups-navbar-button article a div div._2wOCj {
+ color: var(--muted-text) !important;
+ }
+
+ #darktheme-toggle-navbar-button {
+ &[data-popup=true] {
+ position: relative;
+ background-color: var(--highlight) !important;
+
+ .explanation-popup {
+ display: block;
+ position: absolute;
+ top: 100%;
+ left: 0;
+ padding: var(--padding);
+ background-color: var(--secondary);
+ border: var(--modern-border);
+ border-radius: var(--border-radius);
+ color: var(--text);
+ line-height: normal !important;
+ text-transform: none !important;
+ text-align: left !important;
+ width: 250px;
+ pointer-events: none;
+
+ h3 {
+ float: right;
+ padding: 5px 20px 5px;
+ margin-top: 5px;
+ border-radius: var(--border-radius);
+ background-color: var(--accent);
+ pointer-events: all;
+
+ &:hover {
+ background-color: var(--active);
+ }
+ }
+ }
+ }
+ }
+
+ header div.Je0RK button._1SIMq {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ ._1DD87,
+ ._3gfrT:focus:not(:active),
+ .oUq3j:hover:not(:active) {
+ border: var(--modern-border) !important;
+ }
+
+ .JoinCard-card-1qWtS ._1Z0RM {
+ background-color: var(--primary) !important;
+ }
+
+ // Calendar Page
+
+ .fcalendar-filter-menu-wrapper {
+ background-color: var(--secondary) !important;
+ border-radius: var(--border-radius);
+ }
+
+ .color-codes-box {
+ // Does not fix the left-pointing arrow, as that's a PNG
+ background-color: var(--accent) !important;
+ }
+
+ .fcalendar-filter-menu-wrapper .checkbox.filter-selected {
+ background-position-y: -19px !important;
+ }
+
+ body .fc-event-skin {
+ color: var(--text);
+ }
+
+ .color-default-personal,
+ .color-default-groups,
+ .color-default-courses,
+ .color-default-school,
+ .color-1,
+ .color-2,
+ .color-3,
+ .color-4,
+ .color-5,
+ .color-6,
+ .color-7,
+ .color-8,
+ .color-9,
+ .color-10,
+ .color-11,
+ .color-12,
+ .color-13,
+ .color-14,
+ .color-15,
+ .color-16 {
+ border-color: rgba(0, 0, 0, 0.4) !important;
+ }
+
+ .fc-event-skin.ev-course,
+ .legend-course {
+ background: var(--cal3);
+ border-color: rgba(0, 0, 0, 0.4) !important;
+ }
+
+ .fc-event-skin.ev-group,
+ .legend-group {
+ background: var(--cal2);
+ border-color: rgba(0, 0, 0, 0.4) !important;
+ }
+
+ .fc-event-skin.ev-user,
+ .legend-user {
+ background: var(--cal1);
+ border-color: rgba(0, 0, 0, 0.4) !important;
+ }
+
+ .fc-event-skin.ev-school,
+ .legend-school {
+ background: var(--cal4);
+ border-color: rgba(0, 0, 0, 0.4) !important;
+ }
+
+ .color-default-personal {
+ background: var(--cal1) !important;
+ }
+
+ .color-default-groups {
+ background: var(--cal2) !important;
+ }
+
+ .color-default-courses {
+ background: var(--cal3) !important;
+ }
+
+ .color-default-school {
+ background: var(--cal4) !important;
+ }
+
+ .color-1 {
+ background: var(--cal5) !important;
+ }
+
+ .color-2 {
+ background: var(--cal6) !important;
+ }
+
+ .color-3 {
+ background: var(--cal7) !important;
+ }
+
+ .color-4 {
+ background: var(--cal8) !important;
+ }
+
+ .color-5 {
+ background: var(--cal9) !important;
+ }
+
+ .color-6 {
+ background: var(--cal10) !important;
+ }
+
+ .color-7 {
+ background: var(--cal11) !important;
+ }
+
+ .color-8 {
+ background: var(--cal12) !important;
+ }
+
+ .color-9 {
+ background: var(--cal13) !important;
+ }
+
+ .color-10 {
+ background: var(--cal14) !important;
+ }
+
+ .color-11 {
+ background: var(--cal15) !important;
+ }
+
+ .color-12 {
+ background: var(--cal16) !important;
+ }
+
+ .color-13 {
+ background: var(--cal17) !important;
+ }
+
+ .color-14 {
+ background: var(--cal18) !important;
+ }
+
+ .color-15 {
+ background: var(--cal19) !important;
+ }
+
+ .color-16 {
+ background: var(--cal20) !important;
+ }
+
+ .fc-state-default {
+ background-color: var(--primary) !important;
+ border-color: none !important;
+ color: var(--text) !important;
+ border-width: var(--border-size) !important;
+
+ .fc-button-inner {
+ background-color: var(--primary) !important;
+ border-color: none !important;
+ color: var(--text) !important;
+ border-width: var(--border-size) !important;
+ }
+ }
+
+ .fc-button {
+ &.fc-corner-left {
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-top-left-radius: var(--border-radius) !important;
+ }
+
+ &.fc-corner-right {
+ border-bottom-right-radius: var(--border-radius) !important;
+ border-top-right-radius: var(--border-radius) !important;
+ }
+ }
+
+ .fc-state-disabled {
+ background-color: var(--secondary) !important;
+ color: var(--muted-text) !important;
+ border-color: none !important;
+
+ .fc-button-inner {
+ background-color: var(--secondary) !important;
+ color: var(--muted-text) !important;
+ border-color: none !important;
+ }
+ }
+
+ .fc-state-active {
+ background-color: var(--active) !important;
+
+ .fc-button-inner {
+ background-color: var(--active) !important;
+ }
+ }
+
+ // Navbar menus
+
+ div.les2- {
+ background-color: var(--secondary) !important;
+
+ ._3skcp {
+ border-color: var(--contrast-border) !important;
+ }
+
+ ._1wP6w {
+ color: var(--text) !important;
+ }
+
+ ._2wOCj {
+ color: var(--muted-text) !important;
+ }
+ }
+
+ .util-hover-background-color-cloud-grey-wHghL:hover,
+ .util-focus-background-color-cloud-grey-3x07X:focus,
+ ._33zXx {
+ background-color: var(--active) !important;
+ }
+
+ div.les2- h3 {
+ color: var(--text) !important;
+ }
+
+ // Modal Red Color
+
+ .close-button,
+ .restore-defaults {
+ color: var(--error) !important;
+ }
+
+ .setting-highlight {
+ background-color: var(--highlight) !important;
+ }
+
+ // Home Page
+
+ .splus-modal-body {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ }
+
+ .is-home {
+
+ #right-column-inner div,
+ #home-feed-container {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #center div#main,
+ #main-inner,
+ #main-content-wrapper {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ }
+ }
+
+ .date-header h4 span,
+ .s-poll-option-title,
+ .s-like-sentence {
+ color: var(--text) !important;
+ }
+
+ .s-polls-poll-option,
+ #edge-filters-menu {
+ background: none !important;
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #edge-filters {
+ background: none !important;
+ border: none !important;
+ }
+
+ #edge-filters-btn,
+ .feed-comments {
+ background-position-y: calc(-576px - 18px * var(--theme-is-dark)) !important;
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ opacity: unset !important;
+ }
+
+ #edge-filters-menu .edge-filter-option {
+ background-position: 0 calc(-237px - 20px * var(--theme-is-dark)) !important;
+
+ &:hover,
+ &.active:hover {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+ }
+ }
+
+ .gray,
+ .upcoming-time {
+ color: var(--muted-text) !important;
+ }
+
+ img.splus-logo-inline {
+ filter: brightness(var(--theme-is-dark)) !important;
+ }
+
+ .splus-broadcast-post {
+ background-color: var(--active) !important;
+ }
+
+ .theme-2016 .date-header h4,
+ #home-feed-container #smart-box {
+ border-bottom: var(--modern-border) !important;
+ }
+
+ .view-file-popup,
+ .view-btn-disabled,
+ .edit-external-tool-attachment {
+ border-left: var(--modern-border) !important;
+ }
+
+ .sgy-tabbed-navigation {
+ border-bottom: var(--modern-border) !important;
+
+ li.active {
+ border-bottom: 5px solid var(--contrast-border) !important;
+ }
+ }
+
+ .s-edge-type-update-post .update-body,
+ .s-edge-type-update-poll .update-body {
+ color: var(--text) !important;
+ }
+
+ .user span.name-wrapper {
+ background: var(--secondary) !important;
+ }
+
+ .selected-realm .name-text {
+ color: var(--text) !important;
+ }
+
+ #edge-filters-btn {
+ background-color: var(--text) !important;
+ color: var(--secondary) !important;
+ filter: Invert(var(--theme-is-dark)) !important;
+ background-position-y: -577px !important;
+ background-position-x: right !important;
+ background-image: url('/sites/all/themes/schoology_theme/images/btn-sprite.png?2f89e2e4127348b5') !important;
+ }
+
+ &[dark=false] #edge-filters-btn {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ filter: none !important;
+ background-image: url('/sites/all/themes/schoology_theme/images/btn-sprite.png?5f89e2e4127348b5') !important;
+ }
+
+ // Grades Page
+
+ .gradebook-course.hierarchical-grading-report {
+
+ .period-row .grade-column,
+ .category-row .grade-column,
+ .item-row .grade-column {
+ color: var(--grades) !important;
+ }
+ }
+
+ .grade-active-color,
+ .awarded-grade span {
+ color: var(--grades) !important;
+ }
+
+ .due-date,
+ .gradebook-course.hierarchical-grading-report .grade-column .max-grade,
+ .percentage-contrib,
+ span.comment,
+ .grade-none-color,
+ .course-grade-text,
+ .total-points-wrapper *,
+ .percentage-grade,
+ .no-grade {
+ color: var(--text) !important;
+ }
+
+ div.summary-course {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ .grade-edit-indicator {
+ filter: Grayscale(var(--theme-is-dark)) Invert(var(--theme-is-dark)) !important;
+ }
+
+ .gradebook-course.hierarchical-grading-report {
+ .item-row .td-content-wrapper {
+ border-top: var(--border-size) dotted var(--contrast-border) !important;
+ }
+
+ .period-row .td-content-wrapper,
+ .final-row .td-content-wrapper,
+ .td-content-wrapper {
+ border-top: var(--modern-border) !important;
+ }
+ }
+
+ .item-row.added-fake-assignment {
+ background-color: var(--highlight) !important;
+ }
+
+ .splus-grade-help-btn .icon-help {
+ background-position: calc(0px - 22px * var(--theme-is-dark)) -127px !important;
+ }
+
+ .gradebook-course.hierarchical-grading-report {
+ .childrenCollapsed .title-column {
+ &:hover .expandable-icon-grading-report {
+ position: absolute !important;
+ clip: rect(calc(15px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), 0) !important;
+ top: calc(0px + (16px * var(--theme-is-dark))) !important;
+ left: -20px !important;
+ opacity: 1 !important;
+ }
+
+ .expandable-icon-grading-report {
+ position: absolute !important;
+ clip: rect(calc(15px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), 0) !important;
+ top: calc(0px + (16px * var(--theme-is-dark))) !important;
+ left: -20px !important;
+ opacity: 0.8 !important;
+ }
+ }
+
+ .title-column {
+ .expandable-icon-grading-report {
+ position: absolute !important;
+ clip: rect(calc(46px - (11px * var(--theme-is-dark))), calc(60px - (45px * var(--theme-is-dark))), calc(80px - (30px * var(--theme-is-dark))), 0) !important;
+ top: calc(-32px + (16px * var(--theme-is-dark))) !important;
+ left: -20px !important;
+ opacity: 0.8 !important;
+ }
+
+ &:hover .expandable-icon-grading-report {
+ position: absolute !important;
+ clip: rect(calc(46px - (11px * var(--theme-is-dark))), calc(60px - (45px * var(--theme-is-dark))), calc(80px - (30px * var(--theme-is-dark))), 0) !important;
+ top: calc(-32px + (16px * var(--theme-is-dark))) !important;
+ left: -20px !important;
+ opacity: 1 !important;
+ }
+ }
+ }
+
+ .empty.grades-empty {
+ color: var(--muted-text) !important;
+ }
+
+ .download-grade-wrapper a.link-btn {
+ background-color: var(--primary) !important;
+ }
+
+ #past-selector .item-list a.link-btn.active {
+ background-color: var(--active) !important;
+ }
+
+ body ul.primary {
+ li {
+ &.active a {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+
+ &:hover {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+ }
+ }
+
+ a {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+
+ &:hover,
+ &:visited {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+ }
+ }
+ }
+
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+ }
+
+ .gradebook-course,
+ .attendance-course {
+ border-top: var(--modern-border) !important;
+ }
+
+ .attendance-course-attendance table {
+
+ th,
+ td {
+ border: var(--modern-border) !important;
+ }
+ }
+
+ // Mastery Page
+
+ #s-js-student-mastery-report-view-content {
+ background-color: var(--accent) !important;
+ }
+
+ .s-js-chart-and-pager-area .empty {
+ border-top: var(--modern-border) !important;
+ }
+
+ .highcharts-container>svg>rect {
+ fill: var(--primary);
+ }
+
+ .highcharts-axis-labels>text {
+ color: var(--text) !important;
+ fill: var(--text) !important;
+ }
+
+ .score-value {
+ color: var(--text) !important;
+ }
+
+ // Courses Page
+
+ .course-action-btns,
+ .group-action-btns {
+ padding: var(--padding) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #secondary-tabs-wrapper {
+ border-right: none !important;
+ background-color: var(--accent) !important;
+ }
+
+ body {
+ >div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ>div>div {
+ background-color: var(--primary) !important;
+
+ button {
+ filter: Grayscale(var(--theme-is-dark)) Invert(var(--theme-is-dark));
+ }
+
+ .Card-card-2rORL {
+ background-color: var(--accent) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ div {
+ color: var(--text) !important;
+
+ &._2wOCj {
+ color: var(--muted-text) !important;
+ }
+ }
+ }
+
+ #right-column-inner {
+
+ button.link-btn,
+ a.link-btn {
+ background-color: var(--primary) !important;
+ }
+ }
+ }
+
+ #reorder-ui button.link-btn span {
+ filter: Invert(var(--theme-is-dark)) !important;
+ }
+
+ .course-list-view #secondary-tabs-wrapper ul {
+ border-bottom: none !important;
+ }
+
+ .no-courses {
+ color: var(--muted-text) !important;
+ }
+
+ .tabs.secondary li {
+ a {
+ background: var(--secondary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ &.active a {
+ background: none !important;
+ color: var(--text) !important;
+ background-color: var(--active) !important;
+ border-radius: var(--border-radius) !important;
+ border: none !important;
+ }
+ }
+
+ .listing .course-item.list-item,
+ .courses-listing.mycourses h3 {
+ border-bottom: var(--modern-border) !important;
+ }
+
+ #main .courses-listing.listing {
+ border-top: var(--modern-border) !important;
+ }
+
+ .sgy-course-search-form__submit-row {
+ background: none !important;
+ border-color: none !important;
+ }
+
+ .sgy-react-select {
+
+ .Select-control,
+ .Select-menu-outer {
+ color: var(--text) !important;
+ border-color: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ .Select-control {
+ background-color: var(--input) !important;
+ }
+
+ .Select-placeholder {
+ color: var(--text) !important;
+ }
+
+ .Select-menu-outer {
+ background-color: var(--accent) !important;
+ }
+
+ .Select-option {
+ color: var(--text);
+
+ &:hover {
+ background-color: var(--active);
+ }
+ }
+ }
+
+ // Members Page
+
+ .enrollment-search .go-btn {
+ background-color: inherit !important;
+ }
+
+ .roster-top {
+ border-bottom: var(--modern-border) !important;
+ }
+
+ body {
+
+ .enrollment-filters span.active,
+ .grading-groups-list .grading-group.active {
+ background-color: var(--active) !important;
+ }
+ }
+
+ .enrollment-filters span:hover {
+ background-color: var(--active) !important;
+ }
+
+ // Breadcrumbs
+
+ #site-navigation-breadcrumbs nav {
+ background-color: var(--accent) !important;
+
+ li {
+
+ a,
+ span {
+ color: var(--text) !important;
+ }
+ }
+ }
+
+ // Resources Page
+
+ #library-main {
+ border-right: none !important;
+ }
+
+ #library-wrapper {
+ background-color: var(--accent) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+
+ a.active:not(.item-title),
+ .library-collections a:hover {
+ background-color: var(--active) !important;
+ }
+ }
+
+ #library-left td:hover {
+ background-color: var(--active) !important;
+ }
+
+ #library-search-form-container div {
+ background-color: var(--secondary) !important;
+
+ &::before {
+ display: none !important;
+ }
+ }
+
+ #collection-view-contents .collection-row-empty td {
+ color: var(--text) !important;
+ }
+
+ body.library-view #library-main {
+ border-left: var(--modern-border) !important;
+ }
+
+ #collection-toolbar {
+ border-top: var(--modern-border) !important;
+ }
+
+ #collection-view-contents {
+ border-top: var(--modern-border) !important;
+
+ th,
+ td {
+ border-bottom: var(--modern-border) !important;
+ }
+ }
+
+ #library-left .collections-list-wrapper {
+ border-bottom: var(--modern-border) !important;
+ }
+
+ body.library-view #library-left {
+ border-right: var(--modern-border) !important;
+ }
+
+ #collection-toolbar .action-links-unfold {
+ box-shadow: none !important;
+ border: none !important;
+ background: var(--secondary) !important;
+ border-radius: var(--border-radius) !important;
+ color: var(--text) !important;
+
+ &:hover {
+ background-color: var(--muted-text) !important;
+ }
+ }
+
+ #reorder-collections-btn {
+ color: var(--text) !important;
+
+ &:hover {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+ }
+ }
+
+ .action-links>li>span {
+ color: var(--text) !important;
+ }
+
+ .progressContainer,
+ .link-attachment,
+ .attachment-block,
+ .resource-attachment {
+ background: var(--primary) !important;
+ }
+
+ .options-reorder-btn,
+ .options-auto-arrange-btn {
+ color: var(--text) !important;
+ }
+
+ .options-reorder-btn:hover,
+ .options-auto-arrange-btn:hover {
+ background-color: var(--active) !important;
+ }
+
+ // Profile Page
+
+ .right-block-big-wrapper {
+ padding: var(--padding) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #sidebar-left #left-nav #menu-s-main ul li a.active {
+ background-color: var(--accent) !important;
+ border: var(--modern-border) !important;
+ border-right: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ }
+
+ .app-link-wrapper .active {
+ background-color: var(--accent) !important;
+ border: var(--modern-border) !important;
+ border-right: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+
+ &:hover {
+ background-color: var(--accent) !important;
+ border: var(--modern-border) !important;
+ border-right: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ }
+ }
+
+ #sidebar-left #menu-s-main .active-trail .active-trail a.course-materials-left-menu {
+ background-color: var(--accent) !important;
+ border: var(--modern-border) !important;
+ border-right: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ }
+
+ th.profile-header {
+ color: var(--text) !important;
+ }
+
+ #profile-form-tab {
+ background-color: var(--accent);
+ }
+
+ .tab-nav.active {
+ background-color: var(--input);
+
+ &:hover {
+ background-color: var(--input);
+ }
+ }
+
+ // Course Page
+
+ .action-links,
+ .comment.no-comments,
+ .materials-filter-wrapper {
+ background-color: var(--secondary) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+ color: var(--text) !important;
+ }
+
+ #wrapper {
+ background-color: var(--primary) !important;
+ }
+
+ .navigator-buttons a.navbtn.link-btn {
+ background-color: var(--primary) !important;
+ border-radius: var(--border-radius) !important;
+ color: var(--text) !important;
+ }
+
+ .has-folder-player #center-top .content-top-upper,
+ .has-materials-player #center-top .content-top-upper {
+ background-color: var(--secondary) !important;
+ border: none !important;
+ }
+
+ #course-profile-materials {
+ background-color: var(--accent) !important;
+ }
+
+ .materials-filter-wrapper .action-links-wrapper .action-links-unfold {
+ color: var(--text) !important;
+ }
+
+ .action-links-wrapper-gearless .action-links-unfold {
+
+ &.active,
+ &:active {
+ color: var(--text) !important;
+ }
+ }
+
+ .action-links .selected {
+ background-position: 0 calc(-237px - 20px * var(--theme-is-dark)) !important;
+ }
+
+ body .action-links a:hover {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+ }
+
+ .materials-top,
+ #folder-contents-table td,
+ #right-column h3,
+ .left-block-wrapper h3 {
+ border: none !important;
+ border-bottom: var(--modern-border) !important;
+ }
+
+ .s-edge-feed {
+ >li {
+ border-top: var(--modern-border) !important;
+ }
+
+ .edge-item li {
+ color: var(--text) !important;
+ }
+
+ table[bgcolor] {
+ background-color: var(--accent) !important;
+ }
+ }
+
+ .s-like-sentence:not(:last-child) {
+ border-bottom: var(--modern-border) !important;
+ }
+
+ .pre-fill,
+ .upcoming-list .empty,
+ .readonly-title,
+ .no-attendance-status-dates {
+ color: var(--muted-text) !important;
+ }
+
+ #edit-course-switcher-select-nid-menu {
+ border: var(--modern-border) !important;
+ background-color: var(--secondary);
+ border-radius: var(--border-radius) !important;
+
+ .ui-selectmenu-group li a:hover {
+ color: var(--text) !important;
+ background-color: var(--active) !important;
+ }
+ }
+
+ #edit-course-switcher-select-nid-button {
+ border: none !important;
+ background: none !important;
+ background-color: var(--secondary) !important;
+ border-radius: var(--border-radius) !important;
+
+ &:not(.ui-state-active) .edit-course-inline-dropdown-arrow {
+ filter: Invert(var(--theme-is-dark)) !important;
+ }
+ }
+
+ .messages.warning {
+ background: var(--highlight) !important;
+ color: var(--text) !important;
+ }
+
+ span#updates-count {
+ color: var(--text) !important;
+ background-color: var(--active) !important;
+ }
+
+ .link_view .page-title a:hover .external-link-icon {
+ background-position: 0 -1425px !important;
+ }
+
+ .access-code.left-block-wrapper,
+ #roster-wrapper .parent-code {
+ background-color: var(--accent);
+ color: var(--text);
+ }
+
+ // Messages
+
+ .privatemsg-list {
+ td {
+ background-color: var(--accent) !important;
+ }
+
+ .privatemsg-unread td {
+ background-color: var(--active) !important;
+ }
+ }
+
+ table.privatemsg-list {
+ border-top: var(--modern-border) !important;
+
+ td.no-messages {
+ color: var(--muted-text) !important;
+ }
+ }
+
+ #attachment-selector {
+ background: var(--secondary) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+
+ li {
+ border-right: none !important;
+ }
+ }
+
+ #ids {
+ background: none !important;
+ border: none !important;
+
+ .userlist_input {
+ border: none !important;
+ }
+
+ .name-wrapper {
+ background: var(--secondary) !important;
+ color: var(--text) !important;
+ }
+ }
+
+ .ac_results {
+ background: var(--secondary) !important;
+ color: var(--text) !important;
+
+ ul li {
+ background: var(--secondary) !important;
+ border-color: var(--contrast-border) !important;
+ }
+ }
+
+ .ac-name,
+ .ac-top {
+ color: var(--text) !important;
+ }
+
+ .ac-row {
+
+ .ac-bot,
+ .ac-school {
+ color: var(--muted-text) !important;
+ }
+ }
+
+ .ac_results .ac_over {
+ border-color: var(--contrast-border) !important;
+ background: var(--active) !important;
+ }
+
+ #sUserAutocomplete-recipient-helper {
+ background-color: var(--secondary) !important;
+ color: var(--muted-text) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ .message-participants {
+ color: var(--muted-text) !important;
+ }
+
+ .message-title,
+ .message-view-row {
+ border-bottom: var(--modern-border) !important;
+ }
+
+ // Discussion Board
+
+ .discussion-view {
+ .sticky-wrapper h2.page-title {
+ background: var(--primary) !important;
+ }
+
+ #content-wrapper {
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ background: var(--accent) !important;
+ }
+
+ #center-top h2.page-title {
+ border: none !important;
+ }
+
+ #s_comments .s_comments_level .comment.on-top,
+ #main #s_comments .s_comments_level .s_comments_level .comment.on-top {
+ background-color: var(--active) !important;
+ }
+ }
+
+ .grade-title {
+ color: var(--text) !important;
+ }
+
+ .received-grade {
+ color: var(--grades) !important;
+ }
+
+ .grading-grade .max-points {
+ color: var(--muted-text) !important;
+ }
+
+ .assignment-details,
+ .extra-details {
+ border-bottom: var(--modern-border) !important;
+ }
+
+ .discussion-view .sticky-wrapper {
+
+ .s-comments-post-form,
+ .s-comments-post-form-new {
+ background: var(--primary) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+ }
+ }
+
+ .discussion-action-bar {
+ background: var(--secondary) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+ }
+
+ .discussion-view {
+ .discussion-content #s_comments .discussion-card {
+ background: var(--primary) !important;
+ box-shadow: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #content-wrapper {
+
+ .discussion-content div#s_comments .s_comments_level .s_comments_level,
+ .s-comments-post-form-new div#s_comments .s_comments_level .s_comments_level {
+ background: var(--accent) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+ }
+ }
+
+ .expander-bar {
+ background: var(--accent) !important;
+ border: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ }
+ }
+
+ .post-count {
+ color: var(--muted-text) !important;
+ }
+
+ .discussion-view .discussion-content {
+ border-top: var(--modern-border) !important;
+ }
+
+ .bar-right-wrapper,
+ .comment-counts {
+ border-color: var(--contrast-border) !important;
+ }
+
+ .discussion-view #comment-placeholder {
+ background: var(--accent) !important;
+ border-radius: var(--border-radius) !important;
+ border: none !important;
+ color: var(--muted-text) !important;
+ }
+
+ .content-top-wrapper .info-container.not-admin .link-btn {
+ background: var(--secondary) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #comment-navigator td {
+ background: var(--primary) !important;
+ border: none !important;
+
+ &.slide-toggler-cell {
+ background: var(--secondary) !important;
+ }
+ }
+
+ .num-comments-wrapper {
+ color: var(--muted-text) !important;
+ }
+
+ // User Page
+
+ .info-tab {
+
+ th,
+ td {
+ color: var(--muted-text) !important;
+ border-bottom: var(--modern-border) !important;
+ }
+ }
+
+ .enrollment-view-wrapper {
+
+ td,
+ th {
+ color: var(--muted-text) !important;
+ border-bottom: var(--modern-border) !important;
+ }
+ }
+
+ .info-tab .profile-header {
+ color: var(--text) !important;
+ }
+
+ .private-profile {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-color: var(--contrast-border) !important;
+
+ h3 {
+ border-color: var(--contrast-border) !important;
+ }
+ }
+
+ .portfolio-list {
+ border: none !important;
+ }
+
+ .tw-bs {
+ .portfolio-list__no-portfolios-text {
+ color: var(--muted-text) !important;
+ }
+
+ .portfolio-list__add-new,
+ .portfolio-view__add-new {
+ background: transparent !important;
+ }
+
+ .portfolio-list__add-new-bg,
+ .portfolio-view__add-new-bg {
+ border-bottom: var(--modern-border) !important;
+ }
+ }
+
+ .portfolio-route-content {
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+ background: var(--secondary) !important;
+ }
+
+ .tw-bs .portfolio-title-bar {
+ background: var(--secondary) !important;
+ }
+
+ .portfolio-view__content {
+ background: var(--accent) !important;
+ }
+
+ .portfolio-card {
+ background: var(--primary) !important;
+ }
+
+ .tw-bs {
+
+ .portfolio-list__list-view>.ui-state-highlight,
+ .portfolio-item-list>.ui-state-highlight {
+ background: var(--primary) !important;
+ border-radius: var(--border-radius) !important;
+ }
+ }
+
+ // School / Group Page
+
+ #school-events {
+ padding: var(--padding) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #main {
+ background-color: var(--accent) !important;
+ }
+
+ .left-block {
+ dd {
+ color: var(--text) !important;
+ }
+
+ dt {
+ color: var(--muted-text) !important;
+ }
+ }
+
+ .enrollment-view-wrapper,
+ .roster-top,
+ .active-loader {
+ background-color: var(--accent) !important;
+ }
+
+ #s-user-realm-profile-notification-setting-form label:hover {
+ background: none !important;
+ background-color: var(--active) !important;
+ }
+
+ #content-left .s-enrollment-realm-actions {
+ border-top: var(--modern-border) !important;
+ }
+
+ // Unsure if this is used on other pages too, but it should fix there too if present
+
+ #edit-body_fontsizeselect_text {
+ background: transparent;
+ }
+
+ // Course Dashboard
+
+ .course-dashboard {
+ section {
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+
+ &.sgy-card {
+ background-color: var(--accent) !important;
+ border-radius: var(--border-radius) !important;
+ }
+ }
+
+ .sgy-card-lens {
+ background-color: var(--accent) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ .sgy-card {
+ border: var(--border-size) solid transparent !important;
+
+ &:hover {
+ border: var(--modern-border) !important;
+
+ .sgy-card-lens::after {
+ display: none !important;
+ }
+ }
+ }
+
+ section.sgy-card {
+ .sgy-multiline-ellipsis__split-part {
+ color: var(--text) !important;
+ }
+
+ .sgy-card-subcontext {
+ color: var(--muted-text) !important;
+ }
+ }
+
+ .ui-state-highlight {
+ border: var(--border-size) dashed var(--contrast-border) !important;
+ background-color: var(--secondary) !important;
+ }
+ }
+
+ // Search Bar
+
+ ul.Search-dropdown-3huUv {
+ border: none !important;
+ background-color: var(--accent) !important;
+ }
+
+ .Search-dropdown-3huUv {
+ // svg {
+ // filter: Invert(var(--theme-is-dark)) !important;
+ // }
+
+ input {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+ border-bottom: var(--border-size) solid transparent !important;
+ }
+ }
+
+ // Settings Page
+
+ ul.primary,
+ .with-tabs #center-top {
+ background: unset !important;
+ background-color: var(--secondary) !important;
+ }
+
+ ul.primary li {
+
+ a,
+ .link-wrapper a {
+ background: unset !important;
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ }
+
+ &.active {
+
+ a,
+ .link-wrapper a {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ }
+ }
+ }
+
+ .email-notify,
+ fieldset {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ }
+
+ .sticky-header *,
+ .ui-selectmenu-status {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ }
+
+ div.cellphone-container {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #s-user-set-notifications-form thead tr:hover {
+ background-color: var(--accent) !important;
+ }
+
+ #s-user-custom-notifications-form {
+ #edit-select-all-wrapper label {
+ background: var(--accent) !important;
+ }
+
+ label {
+ border-bottom: var(--modern-border) !important;
+ }
+ }
+
+ .ui-selectmenu {
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ background: none !important;
+ }
+
+ .ui-selectmenu-menu {
+ background: var(--secondary) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+
+ li {
+ a {
+ color: var(--text) !important;
+ }
+
+ &:hover a {
+ background-color: var(--active) !important;
+ }
+ }
+
+ .ui-selectmenu-item-focus a {
+ background-color: var(--active) !important;
+ }
+
+ .ui-selectmenu-item-selected a:after {
+ background-position: 0 calc(-242px - 20px * var(--theme-is-dark)) !important;
+ }
+ }
+
+ .settings-table tbody td {
+ &.selected {
+ background-color: var(--active) !important;
+
+ &:hover {
+ background-color: var(--active) !important;
+ }
+ }
+
+ background-color: var(--primary) !important;
+
+ &.realm-disabled {
+ background: none !important;
+
+ &:hover {
+ background: none !important;
+ }
+ }
+
+ &.area-disabled {
+ background: none !important;
+ }
+ }
+
+ .terms-msg {
+ color: var(--text) !important;
+ }
+
+ // Error Page
+
+ #error-page {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ }
+
+ // Calendar
+
+ .fc-state-highlight {
+ background: var(--active) !important;
+ }
+
+ .fc-view-month td:hover {
+ background-color: var(--highlight) !important;
+ }
+
+ table.fc-border-separate {
+ td {
+ border: var(--modern-border) !important;
+ }
+
+ .fc-widget-header {
+ border-bottom: var(--modern-border) !important;
+ }
+ }
+
+ .fc-agenda-slots {
+
+ td,
+ th {
+ border-color: var(--contrast-border) !important;
+ }
+ }
+
+ body .fc-widget-header,
+ .fc-agenda-allday th {
+ border-color: var(--contrast-border) !important;
+ }
+
+ body .fc-widget-header .fc-agenda-divider-inner {
+ background: var(--contrast-border) !important;
+ border-color: var(--contrast-border) !important;
+ }
+
+ // Assignment page
+
+ #dropbox-viewer-right-toggle {
+ border: var(--border-size) solid var(--input) !important;
+ background-color: var(--secondary) !important;
+ }
+
+ #dropbox-viewer-right {
+ background: var(--primary) !important;
+ color: var(--text) !important;
+ }
+
+ #dropbox-viewer-comments {
+ background: var(--accent) !important;
+ border-bottom: var(--border-size) solid var(--input) !important;
+ }
+
+ .dropbox-viewer-submission-activity,
+ .dropbox-viewer-submission-activity-inner {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ }
+
+ ul#attachment-selector li:hover>a {
+ background-color: var(--accent);
+ }
+
+ .popups-box.popups-library #resources-left-menu-wrapper {
+ background-color: var(--primary);
+ }
+
+ .drop-items li:hover {
+ background: var(--accent);
+ }
+
+ table#collection-view-contents tbody tr td {
+ background-color: var(--primary);
+ }
+
+ .s_comments_level {
+ background: var(--accent) !important;
+ border-color: var(--contrast-border) !important;
+ }
+
+ .discussion-card>.s_comments_level {
+ background: var(--secondary) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ .comment-container {
+ border-color: var(--contrast-border) !important;
+ }
+
+ .dropbox-viewer-item-wrapper {
+ background-color: var(--primary);
+ }
+
+ #grading-rubric-edit-grades-slider .bottom,
+ #district-mastery-grading-rubric-edit-grades-slider .bottom,
+ .s-slider .right-column,
+ .rubric-scroll .rubric-table tbody {
+ background-color: var(--primary);
+ color: var(--text);
+ }
+
+ .view-only .rubric-table .rubric-row-rating {
+
+ span.input-top,
+ .input-bottom {
+ color: var(--text);
+ }
+ }
+
+ .s_grade_item_assessment .assessment-status-wrapper,
+ .grading-grade-translated {
+ color: var(--muted-text) !important;
+ }
+
+ .grading-info {
+ background: var(--secondary) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ .not-editable .score-grade-score span,
+ .param-name {
+ color: var(--text) !important;
+ }
+
+ .assignment-param {
+ color: var(--muted-text) !important;
+ }
+
+ // New Layout
+
+ ._1wP6w,
+ ._2pDDZ:hover:not(:active),
+ ._3senP:focus:not(:active),
+ .wL3MX:active {
+ color: var(--text);
+ }
+
+ ._1IGEH:focus:not(:active),
+ ._1oxpz:hover:not(:active),
+ ._1Z0RM,
+ .Dkh_K:active {
+ background-color: var(--accent);
+ color: var(--text);
+ }
+
+ .StudentTable-table-wrapper-classname-2qr2_>div {
+ background-color: var(--primary) !important;
+ color: var(--text);
+ }
+
+ img#loader {
+ filter: Grayscale(var(--theme-is-dark)) brightness(0.3) !important;
+ }
+
+ // Blog Page
+
+ .active-trail>div>a {
+ background-color: var(--accent) !important;
+ }
+
+ // Google Docs
+
+ .modal-modal-1369068783,
+ .layout-row-inner-3835588998 {
+ background: var(--accent) !important;
+ }
+
+ .typography-button-secondary-button-3933442342 {
+ background: var(--primary) !important;
+ color: var(--text) !important;
+ border-color: var(--contrast-border) !important;
+ }
+
+ // Assesments
+
+ ._1IGEH:focus:not(:active),
+ ._1oxpz:hover:not(:active),
+ ._1Z0RM,
+ .Dkh_K:active {
+ background-color: var(--accent) !important;
+ }
+
+ ._2q19q {
+ background-color: var(--primary) !important;
+ }
+
+ ._1wP6w,
+ ._2pDDZ:hover:not(:active),
+ ._3senP:focus:not(:active),
+ .wL3MX:active {
+ color: var(--text) !important;
+ }
+
+ ._3dHTa {
+ background: var(--active) !important;
+ }
+
+ .UELBU {
+ background: var(--primary) !important;
+ }
+
+ .lrn {
+ color: var(--text) !important;
+ }
+
+ .lrn_widget {
+
+ .lrn_valid,
+ .lrn_selected {
+ background-color: var(--highlight) !important;
+ }
+ }
+
+ // Quizzes
+
+ #s-assessment-view-submission-form {
+ .selected.correct span.option-span {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+ }
+
+ .incorrect span.option-span {
+
+ &.legacy-true-false-question,
+ &.legacy-multiple-choice-question {
+ background-color: var(--highlight) !important;
+ color: var(--text) !important;
+ }
+ }
+ }
+
+ // Common Assesment (New Schoology Assessments)
+
+ &[dark=true] .assessment-delivery-landing-app div._3dHTa::after {
+ content: "WARNING: A dark theme is enabled and might prevent you from reading certain questions. If you can't read a question, you can temporarily disable dark theme using the Toggle Theme button on the navigation bar.";
+ display: inline-block;
+ text-align: center;
+ width: 50%;
+ padding: var(--padding);
+ background-color: var(--highlight);
+ border: var(--border-size) solid rgba(0, 0, 0, 0.5);
+ border-radius: var(--border-radius);
+ }
+
+ // LaTeX Math Formulas
+ .mathquill-formula {
+ filter: Invert(var(--theme-is-dark)) !important;
+ }
+
+ .ca-assessment-delivery-take-assessment,
+ .lrn-assess>div {
+ background-color: var(--primary) !important;
+ }
+
+ .lrn {
+ &.lrn-assess .lrn-right-region .right-wrapper .menu-overlay {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+ }
+
+ .pagination>li> {
+
+ a,
+ span {
+ background-color: var(--input) !important;
+ }
+
+ a,
+ span {
+ background-color: var(--input);
+ color: var(--text) !important;
+ }
+ }
+
+ &.lrn-assess {
+ .lrn-horizontal-toc {
+ .pagination .lrn-assess-btn {
+
+ &:focus,
+ &:hover {
+ background: var(--input) !important;
+ color: var(--accent) !important;
+ }
+ }
+
+ .lrn-assess-pagination .lrn-assess-btn {
+
+ &:focus,
+ &:hover {
+ background: var(--input) !important;
+ color: var(--accent) !important;
+ }
+ }
+ }
+
+ .test-title-text {
+ color: var(--text) !important;
+ }
+
+ .lrn-right-region .right-wrapper .lrn_btn.menu-expand-button {
+ box-shadow: none !important;
+ }
+
+ .app-panel.review-screen {
+ .panel-content {
+ border: var(--border-size) solid var(--input) !important;
+ background-color: var(--primary) !important;
+ border: var(--modern-border) !important;
+ background-color: var(--primary) !important;
+ }
+
+ .item-card .overlay {
+ background: var(--primary);
+ }
+
+ .item-number {
+ color: var(--text) !important;
+ }
+
+ .panel-content .panel-footer {
+ background-color: var(--input);
+ }
+ }
+
+ .lrn-right-region .right-wrapper {
+
+ .lrn_btn.lrn_active,
+ .lrn_widget.lrn_feature>button.lrn_active,
+ .lrn_btn.lrn_btn_blue.lrn_active {
+ border: var(--border-size) solid var(--text) !important;
+ border: var(--modern-border) !important;
+ background: var(--input) !important;
+ box-shadow: none;
+ }
+ }
+ }
+ }
+
+ .lrn-assess .item-count {
+ color: var(--text) !important;
+ }
+
+ .lrn.lrn-assess .app-panel.review-screen {
+ .panel-content .panel-footer {
+ background-color: var(--primary);
+ }
+
+ .item-card {
+ background-color: var(--input) !important;
+
+ //Unattempted
+ }
+ }
+
+ .lrn-assess-switch .lrn-assess-switch-trigger {
+ background: var(--input);
+
+ // Unattempted Legend
+ }
+
+ .lrn.lrn-assess {
+ .app-panel.review-screen .panel-content .panel-footer {
+ background-color: var(--primary) !important;
+ }
+
+ .lrn-right-region .right-wrapper {
+
+ .lrn_btn,
+ .lrn_widget.lrn_feature>button,
+ .lrn_btn.lrn_btn_blue {
+ background-color: var(--accent) !important;
+ border: none !important;
+ }
+
+ &.menu-with-scroll:after {
+ background-image: none !important;
+ }
+
+ .lrn_btn {
+
+ &:before,
+ .btn-label {
+ color: var(--text) !important;
+
+ // Menu Icons Color
+ }
+ }
+
+ .lrn_widget.lrn_feature>button {
+
+ &:before,
+ .btn-label {
+ color: var(--text) !important;
+
+ // Menu Icons Color
+ }
+ }
+
+ .lrn_btn.lrn_btn_blue {
+
+ &:before,
+ .btn-label {
+ color: var(--text) !important;
+
+ // Menu Icons Color
+ }
+ }
+ }
+
+ .lrn-region:not(.lrn-items-region) .lrn_btn_blue:before,
+ .dialogs .lrn_btn_blue:before {
+ color: var(--text) !important;
+ }
+
+ .lrn-region:not(.lrn-items-region) .lrn_btn,
+ .dialogs .lrn_btn {
+ color: var(--text) !important;
+ }
+ }
+
+ .menumask> ::-webkit-scrollbar-track-piece {
+ background: white !important;
+ }
+
+ .lrn.lrn-assess .app-panel.review-screen .item-card {
+ border: none !important;
+ color: var(--contrast-text) !important;
+ border: var(--modern-border) !important;
+ }
+
+ .lrn-region.lrn-right-region {
+ border: none !important;
+ }
+
+ .lrn.lrn-assess .app-panel.review-screen .panel-header {
+ border-bottom: var(--border-size) solid var(--primary) !important;
+ }
+
+ .lrn_btn.item-prev.pos-right {
+ background-color: var(--secondary) !important;
+ border: none !important;
+ }
+
+ .lrn.lrn-assess .app-panel.review-screen button.lrn_btn.lrn-assess-close-review-screen-btn {
+ background: var(--accent) !important;
+ }
+
+ .lrn-assess {
+ background: var(--primary) !important;
+
+ >div ::-webkit-scrollbar-thumb {
+ background: var(--primary) !important;
+ box-shadow: inset 1px 1px 2px black;
+ }
+ }
+
+ .lrn {
+ .modal-content {
+ background-color: var(--accent) !important;
+
+ // Timeout Alert
+ }
+
+ &.lrn-assess {
+
+ .lrn-region:not(.lrn-items-region) .lrn_btn,
+ .dialogs .lrn_btn {
+ background-color: var(--accent) !important;
+ }
+ }
+ }
+
+ .lrn_widget.lrn_mcq .lrn_response .lrn_mcqgroup-block {
+ .lrn-mcq-option {
+ .lrn-label {
+ background-color: var(--accent) !important;
+
+ // MC Questions
+ color: var(--text) !important;
+ }
+
+ &.lrn_selected .lrn-label {
+ background-color: var(--highlight) !important;
+ }
+ }
+
+ .lrn_choiceLabel {
+ background-color: var(--accent) !important;
+
+ // MC Questions
+ color: var(--text) !important;
+ }
+ }
+
+ .lrn {
+
+ .lrn_possibilityList,
+ .lrn_possibilityListContainer {
+ // Drag Blank
+ background-color: var(--accent) !important;
+ }
+
+ .lrn_possibilityList,
+ .lrn_possibilityListContainer {
+ border-top: none !important;
+ }
+
+ .lrn_possibilityList.lrn_list_bottom:before,
+ .lrn_possibilityListContainer.lrn_list_bottom:before {
+ border-bottom: 12px solid var(--muted-text) !important;
+
+ // Just trust me, it's needed for contrast
+ }
+ }
+
+ .lrn_dropzone {
+ background-color: var(--primary) !important;
+ }
+
+ .lrn .lrn_btn_drag {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ }
+
+ .lrn-annotations-c-modal--notepad {
+ background: var(--accent) !important;
+ }
+
+ .lrn .lrn-mask rect {
+ fill: var(--primary) !important;
+
+ // Remove Options Tool
+ }
+
+ .lrn_calc_column {
+ background: var(--accent) !important;
+
+ // Calculator tool
+ }
+
+ .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc {
+ .lrn_calc_btn_opt {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+
+ &:disabled:hover {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ }
+ }
+
+ .lrn_calc_btn_opt_dark {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+ }
+
+ .lrn_calc_cover {
+ background: var(--secondary) url(../../images/calc-cover.png) no-repeat center center !important;
+ }
+ }
+
+ .lrn_calc_column>.lrn_btn_grid {
+ background: var(--primary) !important;
+ }
+
+ .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc .lrn_btn_grid {
+ background-color: var(--primary);
+ color: var(--text) !important;
+ }
+
+ .lrn .lrn_btn_sort {
+ background-color: var(--accent) !important;
+
+ // Reorder Choices
+ color: var(--text) !important;
+ }
+
+ .lrn_box_skin_wrapper {
+ background-color: var(--accent) !important;
+
+ // Audio recording
+
+ .lrn_audioblock_right {
+ background-color: var(--accent) !important;
+
+ .lrn_audiomiclevelmask {
+ background-color: var(--accent) !important;
+ }
+
+ border-left: none !important;
+ }
+ }
+
+ .lrn_wfgraphic.lrn_wfcanvas {
+ background-color: var(--accent) !important;
+ }
+
+ .lrn_toolbar,
+ .lrn .lrn_btn {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+ }
+
+ .lrn_box_skin_wrapper .lrn_widget_footer .lrn_toolbar_left .lrn_btn {
+ border-right: none !important;
+ }
+
+ .lrn-audio-content {
+ background-color: var(--accent) !important;
+ }
+
+ .lrn_waveform {
+ filter: Invert(var(--theme-is-dark)) !important;
+ }
+
+ .lrn_qr.lrn_video .lrn-video-display {
+ background: var(--input) !important;
+
+ // Webcam Record
+ }
+
+ // Text Box for Assesments
+
+ .lrn_response_input_wrapper {
+ border-radius: var(--border-radius) !important;
+ border: var(--modern-border) !important;
+ border: none !important;
+ }
+
+ .lrn_widget {
+ &.lrn_texteditor {
+ border-radius: var(--border-radius) !important;
+ border: var(--modern-border) !important;
+ border: none !important;
+ }
+
+ &.lrn_chemistryessayV2 .lrn_texteditor_editable.wysihtml-placeholder,
+ &.lrn_formulaessayV2 .lrn_texteditor_editable.wysihtml-placeholder,
+ &.lrn_longtextV2 .lrn_texteditor_editable.wysihtml-placeholder {
+ color: var(--text) !important;
+ background: var(--accent) !important;
+ border: none !important;
+ }
+ }
+
+ .lrn_texteditor_editable.lrn_editor_area.lrn_longtextinput.wysihtml-sandbox.wysihtml-editor {
+ color: var(--text) !important;
+ background: var(--input) !important;
+ border: none !important;
+ }
+
+ .lrn-wysihtml-toolbar.lrn_clearfix {
+ color: var(--text) !important;
+ background: var(--secondary) !important;
+ border: none !important;
+ }
+
+ .lrn-toolbar {
+ background: var(--secondary) !important;
+ border: none !important;
+ }
+
+ .lrn_icon {
+
+ &.lrn-icon-bold,
+ &.lrn-icon-italic,
+ &.lrn-icon-underline,
+ &.lrn-icon-list-bulleted,
+ &.lrn-icon-list-numbered {
+ color: var(--text) !important;
+ background: transparent !important;
+ }
+ }
+
+ .lrn-toolbar-footer.lrn_clearfix {
+ background: var(--accent) !important;
+ color: var(--text) !important;
+ border: none !important;
+ }
+
+ .lrn_word_count,
+ .lrn_word_limit {
+ color: var(--text) !important;
+ border: none !important;
+ }
+
+ // Assesesment Rubric
+
+ .clock,
+ .lrn-assess .timer,
+ .counter,
+ .max-time,
+ .lrn-assess .timer {
+ color: var(--text) !important;
+ }
+
+ // Assesment Rubric
+
+ #grading-rubric-edit-slider .controls,
+ #district-mastery-grading-rubric-edit-slider .controls {
+ // Left side Menu
+ background: var(--accent) !important;
+ color: var(--text) !important;
+ border: none !important;
+ }
+
+ .rubric-row.ng-scope {
+ background: var(--acent) !important;
+
+ // rubric Background color
+ }
+
+ #grading-rubric-edit-slider .rubric-table .input-top,
+ .rubric-table span.input-bottom,
+ #district-mastery-grading-rubric-edit-slider .rubric-table .input-top,
+ .rubric-table span.input-bottom {
+ color: var(--contrast-text) !important;
+
+ // Top part of each row
+ }
+
+ #grading-rubric-edit-slider .rubric-table tr.header-row,
+ #district-mastery-grading-rubric-edit-slider .rubric-table tr.header-row {
+ border-top: var(--border-size) solid var(--input) !important;
+
+ // Border for header
+ border-bottom: var(--border-size) solid var(--input) !important;
+ border: none !important;
+ }
+
+ #grading-rubric-edit-slider .rubric-table .header-row th,
+ #district-mastery-grading-rubric-edit-slider .rubric-table .header-row th {
+ background-color: var(--accent) !important;
+
+ // Header Color
+ }
+
+ .rubric-scroll {
+ background: var(---accent) !important;
+ }
+
+ #grading-rubric-edit-slider .bottom-ctrls-wrapper,
+ #district-mastery-grading-rubric-edit-slider .bottom-ctrls-wrapper {
+ background: var(--accent) !important;
+ border: none !important;
+ color: var(--text) !important;
+ }
+
+ .s-slider.s-grading-rubric-edit-slider.s-grading-rubric.ng-scope.ui-resizable.opened.grade-setup-rubric-edit.new-rubric-edit.read-only {
+ border: none !important;
+ }
+
+ // Assesment Review
+
+ .lrn_widget {
+
+ .lrn_valid,
+ .lrn_selected {
+ background-color: var(--input) !important;
+ }
+
+ .lrn_incorrect {
+ background-color: var(--highlight) !important;
+ }
+
+ .lrn_correct {
+ background-color: var(--active) !important;
+ }
+ }
+
+ .lrn_assoc_table {
+ background-color: var(--accent) !important;
+ }
+
+ .lrn_assoc_col2.lrn_disabled.lrn_dragdrop.lrn_dropzone.lrn_incorrect_marker.lrn_response_container>.lrn_btn_drag.lrn_draggable.lrn_incorrect {
+ background-color: var(--highlight) !important;
+ }
+
+ .lrn_qr.lrn_association .lrn_possibilityList.lrn_list_bottom {
+ margin-top: 0 !important;
+ }
+
+ .lrn_widget {
+ .lrn_correctAnswers {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ }
+
+ .lrn_correctAnswerList>li {
+ background-color: var(--input) !important;
+ }
+ }
+
+ .lrn_btn_sort.lrn_sortable.lrn_button.lrn_correct.lrn_sort_block.lrn_draggable.lrn-dragdrop-group-516 {
+ background-color: var(--active) !important;
+ }
+
+ .lrn_display_correct_answer_enabled {
+ padding: 20px !important;
+ }
+
+ .lrn_texteditor_editable.lrn_editor_area.lrn_longtextinput.lrn_response_input_wrapper {
+ background-color: var(--input) !important;
+ }
+
+ .lrn_assoc_col2.lrn_correct_marker.lrn_disabled.lrn_dragdrop.lrn_dropzone.lrn_response_container>.lrn_btn_drag.lrn_draggable.lrn_correct {
+ background-color: var(--active) !important;
+ }
+
+ .lrn_btn_sort.lrn_sortable.lrn_button.lrn_incorrect.lrn_sort_block.lrn_draggable.lrn-dragdrop-group-516 {
+ background-color: var(--highlight) !important;
+ }
+
+ .lrn_widget .lrn_suggested_answer_item {
+ background: var(--accent) !important;
+ }
+
+ .lrn_suggested_answer_item.lrn_clearfix>.lrn_suggested.lrn_btn_sort.lrn_btn_no_handle.lrn_disabled.lrn_sort_block.lrn_button {
+ background-color: var(--active) !important;
+ }
+
+ .lrn_response.lrn_clearfix.lrn_style_button>.lrn-response-validate-wrapper.lrn_response_input.lrn_incorrect {
+ background-color: var(--accent) !important;
+ }
+
+ .lrn-response-validation-wrapper>.lrn_correctAnswers {
+ background-color: var(--active) !important;
+ }
+
+ // Quizzes
+
+ #s-assessment-view-submission-form .selected.correct span.option-span {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+ }
+
+ .layout-row-outer-1441760367,
+ .profile-header-2536997237,
+ .profile-container-4015500229 {
+ background-color: var(--primary) !important;
+ }
+
+ .content-box-container-3232021855 {
+ background-color: var(--accent) !important;
+ border-radius: var(--border-radius) !important;
+ border: var(--modern-border) !important;
+ font-family: muli !important;
+ }
+
+ .rubric-table-row-row-3856304603.rubric-table-row-zebraStripe-4015500229.fjQuT.uQOmx._2NVPS._1Sb_q.WnfJn._3ARYD._3t4oF,
+ .rubric-grader-header-header-212800519 {
+ background-color: var(--accent) !important;
+ }
+
+ .typography-smallheader-light-bg-text-1999437409 {
+ color: var(--text) !important;
+ }
+
+ .rubric-grader-manage-rubric-studentLabel-3923154451 {
+ color: var(--cal1) !important;
+ }
+
+ .rubric-grader-scrollContainer-634066954 {
+ background-color: var(--accent) !important;
+ }
+
+ .rubric-criteria-drawer-handle-drawerHandleActive-30552431 {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ }
+
+ .rubric-criteria-drawer-handle-copy-1446048478 {
+ color: var(--text) !important;
+ }
+
+ .rubric-grader-gradebook-comment-gradebookCommentContainer-1923026448 {
+ background-color: var(--accent) !important;
+ }
+
+ .rubric-grader-gradebook-comment-container-3347344084 {
+ color: var(--text) !important;
+ }
+
+ .chart-wrapper .highchart-obj .no-data-overlay {
+ background: transparent !important;
+ }
+
+ .no-data-message-wrapper {
+ background: var(--secondary) !important;
+ color: var(--text) !important;
+ padding: 3px !important;
+ border-radius: var(--border-radius);
+ }
+
+ // Text Boxes for Discussions
+
+ .s_comments_level {
+ background: var(--primary) !important;
+ border-radius: var(--border-radius) !important;
+ padding: var(--padding) !important;
+ }
+
+ .discussion-card>.s_comments_level {
+ background: var(--input) !important;
+ }
+
+ .iziToast-body img {
+ max-width: 24px !important;
+ }
+
+ .iziToast.iziToast-theme-dark .iziToast-message {
+ color: var(--contrast-text) !important;
+ opacity: 0.7;
+ }
+
+ // Fix for comment Reply
+
+ #main .s_comments_level #s-comment-reply-form {
+ background: var(--accent) !important;
+ }
+
+ #s-comment-reply-form {
+ width: auto !important;
+ border-radius: var(--border-radius) !important;
+ border: none !important;
+ }
+
+ .compose-message.sMessagingProcessed fieldset {
+ padding: 20px !important;
+ border-radius: var(--border-radius) !important;
+ }
+
+ #ids .name-wrapper {
+ background: transparent !important;
+ }
+
+ // Standard Popup Window Background Fix
+
+ .s-slider.rubric-grades-edit .rating-wrapper.selected {
+ background-color: var(--active) !important;
+ }
+
+
+ // Discussion Edit Icon Fix
+
+ .discussion-view .action-links-wrapper-junior .action-links-unfold,
+ .discussion-view .action-links-wrapper-junior .action-links-unfold:hover,
+ .discussion-view .action-links-wrapper-junior .active.action-links-unfold,
+ .discussion-view .action-links-wrapper-junior .active.action-links-unfold:hover {
+ background-image: url(https://asset-cdn.schoology.com/sites/all/themes/schoology_theme/images/sprite_discussion.png?5f9c91b5354f0ec1) !important;
+ /* Makes Icon Visble */
+ }
+
+ .s-js-comment-action-links.sActionLinksVisible>.action-links-wrapper.action-links-wrapper-junior.aligned-right>.action-links-unfold {
+ /* Changes Color When Hovered Over */
+ background-color: var(--accent) !important;
+ }
+
+ // Button tiles
+ .splus-button-tile.active {
+ background-color: var(--active) !important;
+ }
+}
\ No newline at end of file
diff --git a/scss/modern/theme-editor.scss b/scss/modern/theme-editor.scss
new file mode 100644
index 00000000..b574a6fe
--- /dev/null
+++ b/scss/modern/theme-editor.scss
@@ -0,0 +1,217 @@
+variable-intellisense {
+ --modern-primary: #36393F;
+ --modern-accent: #2F3136;
+ --modern-secondary: #202225;
+ --modern-text: #DCDDDE;
+ --modern-contrast-text: #EEEEEE;
+ --modern-muted-text: #72767D;
+ --modern-contrast-border: #DCDDDE;
+ --modern-input: #40444B;
+ --modern-error: #F44336;
+ --modern-highlight: rgba(184, 134, 11, 0.2);
+ --modern-active: rgba(0, 255, 255, 0.1);
+ --modern-grades: #8BC34A;
+ --modern-border-radius: 5px;
+ --modern-border-size: 1px;
+ --modern-padding: 10px;
+ --modern-theme-is-dark: 1;
+ --modern-cal1: #457da5;
+ --modern-cal2: #547c41;
+ --modern-cal3: #926c37;
+ --modern-cal4: #7c3d6b;
+ --modern-cal5: #0b4c9c;
+ --modern-cal6: #00209c;
+ --modern-cal7: #004a09;
+ --modern-cal8: #72721a;
+ --modern-cal9: #44233e;
+ --modern-cal10: #683131;
+ --modern-cal11: #770a0a;
+ --modern-cal12: #a72413;
+ --modern-cal13: #E0024C;
+ --modern-cal14: #188C16;
+ --modern-cal15: #bd7304;
+ --modern-cal16: #80168C;
+ --modern-cal17: #164152;
+ --modern-cal18: #00543f;
+ --modern-cal19: #633e11;
+ --modern-cal20: #461b2d;
+}
+
+:root[modern=true] {
+ &[dark=true] {
+ // anything dark specific? maybe an inverting icon example?
+ }
+
+ body {
+ background-color: var(--modern-secondary);
+ }
+
+ * {
+ color: var(--modern-text) !important;
+ }
+
+ .modern-primary {
+ background-color: var(--modern-primary) !important;
+ }
+
+ .modern-secondary {
+ background-color: var(--modern-secondary) !important;
+ }
+
+ .modern-accent {
+ background-color: var(--modern-accent) !important;
+ }
+
+ .modern-input {
+ background-color: var(--modern-input) !important;
+ }
+
+ .modern-highlight {
+ background-color: var(--modern-highlight) !important;
+ }
+
+ .modern-active {
+ background-color: var(--modern-active) !important;
+ }
+
+ .modern-error {
+ background-color: var(--modern-error) !important;
+ }
+
+ .modern-error-text {
+ color: var(--modern-error) !important;
+ }
+
+ .modern-grades {
+ color: var(--modern-grades) !important;
+ }
+
+ .modern-text {
+ color: var(--modern-text) !important;
+ }
+
+ .modern-contrast-text {
+ color: var(--modern-contrast-text) !important;
+ }
+
+ .modern-muted-text {
+ color: var(--modern-muted-text) !important;
+ }
+
+ .modern-border {
+ border: var(--modern-border-size) solid var(--modern-contrast-border) !important;
+ }
+
+ .modern-border-radius {
+ border-radius: var(--modern-border-radius) !important;
+ }
+
+ .modern-padding {
+ padding: var(--modern-padding) !important;
+ }
+
+ .modern-margin {
+ margin: var(--modern-padding) !important;
+ }
+
+ .modern-black {
+ color: black !important;
+ }
+
+ #themes-list-section {
+ .collection a.collection-item {
+ background-color: var(--modern-primary);
+
+ &.active {
+ background-color: var(--modern-active) !important;
+ }
+
+ &:not(.active):hover {
+ background-color: var(--modern-highlight);
+ }
+ }
+ }
+
+ #theme-editor-section {
+ .sp-replacer {
+ border: var(--modern-border-size) solid var(--modern-contrast-border);
+ background-color: var(--modern-input);
+ }
+ }
+
+ #preview-section {
+
+ svg,
+ svg * {
+ color: var(--modern-contrast-text) !important;
+ }
+
+ #preview-profile-pic {
+ border-color: var(--modern-contrast-text) !important;
+ }
+
+ .preview-course {
+ border: var(--modern-border-size) solid transparent;
+
+ &:hover {
+ border: var(--modern-border-size) solid var(--modern-contrast-border);
+ }
+
+ .preview-course-class {
+ color: var(--link-color) !important;
+ }
+
+ .preview-course-section {
+ color: var(--modern-text) !important;
+ }
+
+ .preview-course-school {
+ color: var(--modern-muted-text) !important;
+ }
+ }
+
+ #tab-icons {
+ #icon-list-table tbody:empty:before {
+ color: var(--modern-muted-text) !important;
+ }
+ }
+
+ #preview-dropdown-list li:hover {
+ background-color: var(--modern-active) !important;
+ }
+ }
+
+ .material-tooltip {
+ background-color: var(--modern-secondary);
+ border: var(--modern-border-size) solid var(--modern-contrast-border);
+ border-radius: var(--modern-border-radius);
+ }
+
+ .rs-bg-color {
+ background-color: var(--modern-input);
+ }
+
+ .full-spectrum {
+ background-color: var(--modern-accent) !important;
+
+ button {
+ background-color: var(--modern-secondary) !important;
+ background-image: none;
+ text-shadow: none;
+ }
+ }
+
+ input[type=range] {
+ border: var(--modern-border-size) solid var(--modern-contrast-border);
+ }
+
+ .action-button:hover {
+ transition: .3s ease-out !important;
+ color: var(--modern-contrast-text) !important;
+
+ i.material-icons {
+ transition: .3s ease-out !important;
+ color: var(--modern-contrast-text) !important;
+ }
+ }
+}
\ No newline at end of file
diff --git a/theme-editor.html b/theme-editor.html
index 120fcc76..08d5b0f1 100644
--- a/theme-editor.html
+++ b/theme-editor.html
@@ -7,6 +7,7 @@
-
+
Schoology Plus Theme Editor
@@ -57,32 +57,30 @@
@@ -90,260 +88,379 @@
Properties
Color
- Color Hue
-
+
- Custom Colors
-
-
- Primary Color
-
-
- Hover Color
-
-
- Background Color
-
-
- Border Color
-
+
- Rainbow
-
-
-
warning Warning
-
- This section contains advanced features. Please consult the
- documentation for how to use rainbow colors in your theme.
-
-
-
-
Hue
-
-
- Animate
-
-
-
- Animation Speed
- 100
-
-
-
-
- Hue Range
-
-
-
-
- Alternate
-
+
+
+
warning Warning
+
+ This section contains advanced features. Please consult the
+ documentation for how to use rainbow colors in your theme.
+
+
+
+
Hue
+
+
+ Animate
+
+
+
+ Animation Speed
+ 100
+
+
+
+
+ Hue Range
+
+
+
- Hue Range Preview (Left to Right)
-
-
-
-
+
+ Hue Range Preview (Left to Right)
+
+
+
+
-
-
Saturation
-
+
+
+
Saturation
+
+
+ Animate
+
+
+
+
+ Saturation Value
+ 100
+
+
-
-
- Animation Speed
- 100
-
-
-
-
- Saturation Range
- 0 -
- 100
-
-
-
- Alternate
-
-
-
-
- Saturation Value
- 100
-
-
-
-
-
-
Lightness
-
+
+
+
Lightness
+
+
+ Animate
+
+
+
+
+ Lightness Value
+ 100
+
+
-
-
- Animation Speed
- 100
-
-
-
-
- Lightness Range
- 0 -
- 100
-
-
-
- Alternate
-
-
-
-
- Lightness Value
- 100
-
-
-
-
+
+
+
Modern Engine Options
+
The Schoology Plus Modern Theme Engine gives you more control over the appearance of Schoology,
+ however it's slightly more complex to use. Additionally, the modern engine does not work
+ everywhere and may cause certain content to be displayed incorrectly. Use at your
+ own risk, but please use our
+ Discord server to report
+ bugs if you find them!
+
+
+
+
+
+
+
+
+
+
+
Calendar Colors
+ Calendar colors are not currently customizable via the theme editor.
+
+
+
+
+
-
+
-
- error Error
-
+
+ error Error
+
@@ -358,7 +475,7 @@
-
+
- COURSES
-
+
COURSES
+
Courses
-
You are not currently enrolled in any
- courses
+
+
+
MY CLASS
+
MY SECTION
+
My School
+
+
+
+
+
MY CLASS
+
MY SECTION
+
My School
+
+
+
+
+
MY CLASS
+
MY SECTION
+
My School
+
+
- RESOURCES
+ RESOURCES
-
+
+
+
+
+
Schoology Plus Theme
+ Editor
+
You can click the +
+ button on the navigation bar to switch between previews of different
+ screens.
+
+
+ You can click on this link
+ to be taken to the Schoology Plus theme creation help page.
+
+
+
These are examples of
+ grades:
+
+ A+
+ 100 /100B
+ 8.5 /10A
+ 46 /50
+
+ This is an example of muted text.
+
+
This is a textbox:
+
+
+
+
+
+
+
This tile has an accent color background.
+
+
+
Dropdown▼
+
+
+ One
+ Two
+ Three
+ Link
+
+
+
+ × This is an error
+
+
+
+
This tile has a secondary color background.
+
+ Accent Color
+
+ Primary Color
+
+
+ Highlight Color
+
+
@@ -471,13 +713,15 @@
Subtitle
placeholder="Type a class name here to preview its icon">
-
warning Warning
+ warning Warning
+
This section contains advanced features. Please consult the
documentation for how to use custom icons in your theme.
@@ -499,8 +743,7 @@
help
@@ -508,14 +751,14 @@ Icon URL or paste/drop
image
help
Icon
- add
+ add
@@ -544,7 +787,8 @@
Schoology Plus will attempt to match a class name to one of the
regular expressions above first (from top to bottom), but if it
- doesn't find a match it will use the default icon set .
+ doesn't find a match it will use the default icon
+ set .
To avoid this behavior, create a default icon for your theme by
adding an icon with pattern "." (a single period) as the last
icon in your list.
@@ -566,8 +810,8 @@
diff --git a/themes/DefaultDark.json b/themes/DefaultDark.json
new file mode 100644
index 00000000..9c19c3f5
--- /dev/null
+++ b/themes/DefaultDark.json
@@ -0,0 +1,62 @@
+{
+ "name": "Schoology Plus Modern Dark",
+ "version": 2,
+ "color": {
+ "custom": {
+ "primary": "#202225",
+ "hover": "#40444B",
+ "background": "#36393f",
+ "border": "#40444b",
+ "link": "#6fa8dc"
+ },
+ "modern": {
+ "dark": true,
+ "interface": {
+ "primary": "#36393F",
+ "accent": "#2F3136",
+ "secondary": "#202225",
+ "input": "#40444B",
+ "border": "#DCDDDE",
+ "highlight": "rgba(184, 134, 11, 0.2)",
+ "active": "rgba(0, 255, 255, 0.1)",
+ "grades": "#8BC34A",
+ "error": "#F44336"
+ },
+ "calendar": [
+ "#457da5",
+ "#547c41",
+ "#926c37",
+ "#7c3d6b",
+ "#0b4c9c",
+ "#00209c",
+ "#004a09",
+ "#72721a",
+ "#44233e",
+ "#683131",
+ "#770a0a",
+ "#a72413",
+ "#E0024C",
+ "#188C16",
+ "#bd7304",
+ "#80168C",
+ "#164152",
+ "#00543f",
+ "#633e11",
+ "#461b2d"
+ ],
+ "text": {
+ "primary": "#DCDDDE",
+ "muted": "#72767D",
+ "contrast": "#EEEEEE"
+ },
+ "options": {
+ "borderRadius": 5,
+ "borderSize": 1,
+ "padding": 10
+ }
+ }
+ },
+ "logo": {
+ "preset": "schoology_plus"
+ }
+}
\ No newline at end of file
diff --git a/themes/DefaultLight.json b/themes/DefaultLight.json
new file mode 100644
index 00000000..0ee48d9f
--- /dev/null
+++ b/themes/DefaultLight.json
@@ -0,0 +1,56 @@
+{
+ "name": "Schoology Plus Modern Light",
+ "version": 2,
+ "color": {
+ "hue": 200,
+ "modern": {
+ "dark": false,
+ "interface": {
+ "primary": "#EAEAEA",
+ "accent": "#F7F7F7",
+ "secondary": "#DDD",
+ "input": "#D0D0D0",
+ "border": "#BABABA",
+ "highlight": "rgba(255, 183, 2, 0.2)",
+ "active": "#98d4e4",
+ "grades": "#009400",
+ "error": "#F44336"
+ },
+ "calendar": [
+ "#d6e7f4",
+ "#d7e8cf",
+ "#f9e9d4",
+ "#e7e0e5",
+ "#e6b5c9",
+ "#f9f1cf",
+ "#daf0f9",
+ "#f9ddea",
+ "#fbd7d8",
+ "#f1f2d1",
+ "#e0e8f5",
+ "#fbd7e4",
+ "#fcddd3",
+ "#e7f2d5",
+ "#e6e0ee",
+ "#f0e5db",
+ "#fce8d1",
+ "#e1f1e7",
+ "#f0dfed",
+ "#e9e9ea"
+ ],
+ "text": {
+ "primary": "#2A2A2A",
+ "muted": "#677583",
+ "contrast": "white"
+ },
+ "options": {
+ "borderRadius": 5,
+ "borderSize": 1,
+ "padding": 10
+ }
+ }
+ },
+ "logo": {
+ "preset": "schoology_plus"
+ }
+}
\ No newline at end of file
diff --git a/themes/README.md b/themes/README.md
index e6ce9544..4011c9cf 100644
--- a/themes/README.md
+++ b/themes/README.md
@@ -4,28 +4,26 @@
Schoology Plus allows users to create, share, and apply custom themes for the Schoology interface. Themes are defined as a JSON object and can be installed to your browser from the theme editor, located in Schoology Plus settings. To install a theme from a JSON object, complete the following steps:
1. Open the theme editor from Schoology Plus settings
-2. Click the "New Theme" button
-3. Click the "Theme JSON" tab on the right above the theme preview
-4. Click into the text box with the default JSON
-5. Press Ctrl+V or right click and select Paste
-6. Click "Save" or "Save and Apply" to save the theme
-
-
+2. Click "Import Theme"
+3. Click into the "Paste Theme JSON Here" textbox
+4. Press Ctrl+V or right click and select Paste
+5. Click "Import"
## Format of Theme Specification Version 2
A Schoology Plus theme has the following format and components (each component will be explained in detail below):
-```json
+```js
{
"name": "My Theme",
"version": 2,
"color": {
- // Only one of the following properties
+ // Exactly one of the following 3 properties
"hue": 359,
"custom": {
"primary": "red",
"hover": "rgb(0,0,255)",
"background": "hsl(150,50%,50%)",
- "border": "#000000"
+ "border": "#000000",
+ "link": "magenta"
},
"rainbow": {
"hue": {
@@ -44,32 +42,51 @@ A Schoology Plus theme has the following format and components (each component w
"value": 50
}
},
+ // Optional
"modern": {
- "dark": true,
+ "dark": false,
"interface": {
- "primary": "",
- "accent": "",
- "secondary": "",
- "input": "",
- "border": "",
- "highlight": "",
- "active": "",
- "grades": "",
- "error": ""
+ "primary": "#EAEAEA",
+ "accent": "#F7F7F7",
+ "secondary": "#DDD",
+ "input": "#D0D0D0",
+ "border": "#BABABA",
+ "highlight": "rgba(255, 183, 2, 0.2)",
+ "active": "rgba(152, 212, 228, 0.8)",
+ "grades": "#009400",
+ "error": "#F44336"
},
"calendar": [
- // Array of 20 calendar colors
+ "#d6e7f4",
+ "#d7e8cf",
+ "#f9e9d4",
+ "#e7e0e5",
+ "#e6b5c9",
+ "#f9f1cf",
+ "#daf0f9",
+ "#f9ddea",
+ "#fbd7d8",
+ "#f1f2d1",
+ "#e0e8f5",
+ "#fbd7e4",
+ "#fcddd3",
+ "#e7f2d5",
+ "#e6e0ee",
+ "#f0e5db",
+ "#fce8d1",
+ "#e1f1e7",
+ "#f0dfed",
+ "#e9e9ea"
],
"text": {
- "primary": "",
- "muted": "",
- "contrast": "",
- "link": ""
+ "primary": "#2A2A2A",
+ "muted": "#677583",
+ "contrast": "white"
},
"options": {
"borderRadius": 5,
"borderSize": 1,
- "padding": 10,
+ "padding": 10
}
}
},
@@ -130,7 +147,7 @@ A Schoology Plus theme has the following format and components (each component w
|Value Type|`Object`|
|Optional|Yes
|Description|Describes the colors to use for the Schoology interface
-|Special Notes|The color object must contain ***exactly one*** of the following color definitions (either [hue](#hue-color-definition), [custom](#custom-color-definition), or [rainbow](#rainbow-color-definition))
+|Special Notes|The color object must contain ***exactly one*** of the following color definitions (either [hue](#hue-color-definition), [custom](#custom-color-definition), or [rainbow](#rainbow-color-definition)). It can optionally include a [modern](#modern-color-definition) color definition as well.
#### `hue` color definition
|Property||
|--|--|
@@ -149,10 +166,10 @@ A Schoology Plus theme has the following format and components (each component w
|Property||
|--|--|
|Key|`custom`
-|Value Type|`{primary: CSSColor, background: CSSColor, hover: CSSColor, border: CSSColor}`|
+|Value Type|`{primary: CSSColor, background: CSSColor, hover: CSSColor, border: CSSColor, link: CSSColor}`|
|Description|Allows fine control over individual colors in the interface
|Value Restrictions|Each of the defined colors must be [valid CSS colors](https://www.w3schools.com/colors/default.asp) in any valid format
-|Subkeys (Required)|
Key Description `primary` The main interface color used in the navigation bar and as the primary color for buttons and other UI elements. **Should be dark enough to read white text.** `background` The color of items in the settings menu (in the top right, when you click your name) when you hover over them. `hover` The background color of buttons and other interactive elements when you hover over them, the color of the settings dropdown menu (in the top right, when you click your name), and the color of most links throughout the website. **Should be dark enough to read white text.** `border` The border color of buttons and the border between the navigation bar and drop-down menus.
|
+|Subkeys (Required)|
Key Description `primary` The main interface color used in the navigation bar and as the primary color for buttons and other UI elements. **Should be dark enough to read white text.** `background` The color of items in the settings menu (in the top right, when you click your name) when you hover over them. `hover` The background color of buttons and other interactive elements when you hover over them, and the color of the settings dropdown menu (in the top right, when you click your name). **Should be dark enough to read white text.** `border` The border color of buttons and the border between the navigation bar and drop-down menus. `link` The color of clickable links throughout the website. This is **optional**, and defaults to `hover` if not specified to maintain backwards compatibility.
|
**Example**
```json
"color": {
@@ -160,7 +177,8 @@ A Schoology Plus theme has the following format and components (each component w
"primary": "#011e3e",
"hover": "#b70014",
"background": "#06448e",
- "border": "#b70014"
+ "border": "#b70014",
+ "link": "#b70014"
}
}
```
@@ -223,6 +241,88 @@ A Schoology Plus theme has the following format and components (each component w
}
}
```
+
+#### `modern` color definition
+|Property||
+|--|--|
+|Key|`modern`
+|Value Type|`Object` as defined below|
+|Description|Allows extremely fine-grained control of colors for the entire Schoology interface. Unlike the other color definitions, the `modern` color defintion changes the entire interface instead of just links and the navigation bar. |
+|Subkeys (Required)|
Key Description `dark` `bool`: `true` if the `primary` interface color is "dark", meaning dark enough that certain white images should be inverted. `interface` Defines colors used throughout the interface. [See more details below](#interface-color-defintion). `calendar` `CSSColor[16]`: Array of 16 colors to use for calendar events `text` Defines text colors used in different situations. [See more details below](#text-color-definition). `options` Defines certain styling options to apply to interface elements. [See more details below](#modern-options-definition).
|
+
+#### Interface Color Defintion
+|Property||
+|--|--|
+|Key|`interface`
+|Value Type|`Object` as defined below|
+|Description|Allows extremely fine-grained control of colors for the entire Schoology interface. Each value is a `CSSColor` and may be used in many contexts. The descriptions are just to give a general idea of where the color is used. |
+|Subkeys (Required)|
Key Description `primary` Primary interface color, used for page backgrounds. In general, should be the lightest of `primary`, `accent`, and `secondary`. `accent` Interface accent color, used for inset elements. In general, should have a lightness between `primary` and `secondary`. `secondary` Secondary interface color, used for menus and doubly-inset elements. In general, should be the darkest of `primary`, `accent`, and `secondary`. `input` Used for input fields (like text boxes) `border` Used for element borders `highlight` Used to draw attention to something important, usually used in negative connotations like warnings `active` Used for selected menu items and to draw attention to things in a more positive connotation, such as correct answers `grades` Used for letter grades and scores `error` Used for both error backgrounds and error text.
|
+
+#### Text Color Definition
+|Property||
+|--|--|
+|Key|`text`
+|Value Type|`Object` as defined below|
+|Description|Allows extremely fine-grained control of text colors for the entire Schoology interface. Each value is a `CSSColor` and may be used in many contexts. The descriptions are just to give a general idea of where the color is used. |
+|Subkeys (Required)|
Key Description `primary` Primary text color, used in nearly all contexts `muted` Muted text color, used for elements that shouldn't stand out as much `contrast` Text color used on the navigation bar or other elements with background colors set by other color definitions. In general, this should probably be `white`.
|
+#### Modern Options Definition
+|Property||
+|--|--|
+|Key|`options`
+|Value Type|`Object` as defined below|
+|Description|Defines certain styling options to apply to interface elements. |
+|Subkeys (Required)|
Key Description `borderRadius` `int`: CSS border radius property used on numerous inset elements (in pixels) `borderSize` `int`: Size of element borders (in pixels) `padding` `int`: Pixels of padding between elements
|
+
+**Full Example of Modern Color Definition**
+```json
+"modern": {
+ "dark": false,
+ "interface": {
+ "primary": "#EAEAEA",
+ "accent": "#F7F7F7",
+ "secondary": "#DDD",
+ "input": "#D0D0D0",
+ "border": "#BABABA",
+ "highlight": "rgba(255, 183, 2, 0.2)",
+ "active": "rgba(152, 212, 228, 0.8)",
+ "grades": "#009400",
+ "error": "#F44336"
+ },
+ "calendar": [
+ "#d6e7f4",
+ "#d7e8cf",
+ "#f9e9d4",
+ "#e7e0e5",
+ "#e6b5c9",
+ "#f9f1cf",
+ "#daf0f9",
+ "#f9ddea",
+ "#fbd7d8",
+ "#f1f2d1",
+ "#e0e8f5",
+ "#fbd7e4",
+ "#fcddd3",
+ "#e7f2d5",
+ "#e6e0ee",
+ "#f0e5db",
+ "#fce8d1",
+ "#e1f1e7",
+ "#f0dfed",
+ "#e9e9ea"
+ ],
+ "text": {
+ "primary": "#2A2A2A",
+ "muted": "#677583",
+ "contrast": "white"
+ },
+ "options": {
+ "borderRadius": 5,
+ "borderSize": 1,
+ "padding": 10
+ }
+}
+```
+
### `logo`
|Property||
|--|--|
@@ -234,7 +334,7 @@ A Schoology Plus theme has the following format and components (each component w
|Subkey Options (Must contain ***exactly one*** of these subkeys)|
Key Description `url` A direct link to an image to be used as the logo. Should be **160x50** or smaller for best results. `preset` One of the values described below that results in a preset image being used as the logo.
|`preset` Values|
Value Preview `"schoology_plus"`  `"schoology_logo"`  `"lausd_legacy"`  `"lausd_2019"`  `"default"` Don't override the logo whatsoever
**NOTE**: The Schoology and Schoology Plus logos have a transparent background, however the LAUSD logo backgrounds are orange or dark blue as shown.
**Examples**
-```json
+```js
// Example using "url"
"logo": {
"url": "https://example.com/my-correctly-sized-image.png"
diff --git a/webstore-description.txt b/webstore-description.txt
index 462a2368..04f46341 100644
--- a/webstore-description.txt
+++ b/webstore-description.txt
@@ -3,8 +3,10 @@ FEATURES
INTERFACE IMPROVEMENTS
-Blue Theme
-- Replaces your school's theme with a blue theme
+Brand New Dark and Light Themes
+- Dark Theme for Schoology! No more blinding whites!
+- Modern Light Theme which revitalizes the late 2000s interface to look modern and new
+- Many other theme options as well, or make your own!
- Replaces your school's logo with the Schoology logo
Custom Themes
@@ -26,6 +28,7 @@ Quick Access
Check Marks for Submitted Upcoming Assignments*
- By default, green check marks ✔ are shown on all assignments you've submitted.
+- You can also manually check off assignments as you complete them
- There are also options for putting a strikethrough through the assignment title or hiding the assignments completely.
Tooltips
](https://addons.mozilla.org/en-US/firefox/addon/schoology-plus/)
[
](https://microsoftedge.microsoft.com/addons/detail/fflijjibhgbhdgjgjkbbnamafdelcoal)
#### Contents
- [Features](#features)
- [Interface Improvements](#interface-improvements)
- - [Blue Theme](#blue-theme)
+ - [Brand New Dark and Light Themes](#brand-new-dark-and-light-themes)
- [Custom Themes](#custom-themes)
- [Course Icons](#course-icons)
- [Quick Access](#quick-access)
@@ -47,12 +47,13 @@
## Interface Improvements
> ***All features below marked with an asterisk\* can be changed or customized with a setting***
-### Blue Theme
+### Brand New Dark and Light Themes
+
-
-
-*Image: The blue Schology Plus navigation bar*
-- Replaces your school's theme with a blue theme
+*Image: Examples of the modern dark and light themes*
+- Dark Theme for Schoology! No more blinding whites!
+- Modern Light Theme which revitalizes the late 2000s interface to look modern and new
+- Many other theme options as well, or make your own!
- Replaces your school's logo with the Schoology logo
### Custom Themes
@@ -86,10 +87,11 @@
### Check Marks for Submitted Upcoming Assignments
-
+
*Image: Upcoming assignments with check marks*
- By default, green check marks ✔ are shown on all assignments you've submitted*
+- You can also manually check off assignments as you complete them
- There are also options for putting a ~~strikethrough~~ through the assignment title or hiding the assignments completely.
### Tooltips
diff --git a/css/all.css b/css/all.css
index 3a060156..1535f65b 100644
--- a/css/all.css
+++ b/css/all.css
@@ -5,6 +5,8 @@
--hover-color: hsl(var(--color-hue), 55%, 40%);
--link-color: var(--hover-color);
--border-color: hsl(var(--color-hue), 60%, 25%);
+ --contrast-text-color: white;
+ --dark-text-color: #333;
--cursor: auto;
--background-url: none;
cursor: var(--cursor);
@@ -35,6 +37,7 @@
/* Drop down menus (grades, applications, and user menu) */
+.Header-header-drop-menu-3SaYV,
.Header-header-drop-menu-3SaYV {
background-color: var(--hover-color) !important;
}
@@ -44,9 +47,13 @@ a.Header-header-drop-menu-3SaYV:hover,
background-color: var(--background-color) !important;
}
+._1k0yk:hover:not(:active), ._3hqpj, ._3JcU2:active, ._3VHSs:focus:not(:active) {
+ background-color: var(--background-color) !important;
+}
+
[class*="Header-header-drop-menu-item-"],
[class*="Header-header-drop-menu-"] li a * {
- color: white !important;
+ color: var(--contrast-text-color) !important;
}
footer .Footer-vertical-divider-3-9qQ a,
@@ -201,7 +208,7 @@ video.easter-egg {
.close:hover,
.close:focus {
- color: white;
+ color: var(--contrast-text-color);
text-decoration: none;
cursor: pointer;
}
@@ -209,11 +216,11 @@ video.easter-egg {
.splus-modal-header {
padding: 2px 16px;
background-color: var(--primary-color);
- color: white !important;
+ color: var(--contrast-text-color) !important;
}
.splus-modal-title {
- color: white !important;
+ color: var(--contrast-text-color) !important;
}
.splus-modal-body {
@@ -223,7 +230,7 @@ video.easter-egg {
.splus-modal-footer {
padding: 2px 16px;
background-color: var(--primary-color);
- color: white;
+ color: var(--contrast-text-color);
}
.splus-modal-title {
@@ -252,7 +259,7 @@ video.easter-egg {
}
.splus-modal-content .splus-modal-footer .splus-modal-footer-text a {
- color: white;
+ color: var(--contrast-text-color);
font-weight: normal !important;
}
@@ -372,7 +379,7 @@ section.sgy-card .sgy-card-lens img.injected-course-icon {
.submit-span-wrapper input[type=submit] {
height: 25px !important;
vertical-align: middle !important;
- color: white !important;
+ color: var(--contrast-text-color) !important;
}
.submit-span-wrapper {
@@ -403,7 +410,7 @@ h1.setting-title {
}
.popups-body .no-answer-provided {
- background: url('https://lms.lausd.net/sites/all/themes/schoology_theme/images/error_404.png') no-repeat 0 0;
+ background: url('https://app.schoology.com/sites/all/themes/schoology_theme/images/error_404.png') no-repeat 0 0;
padding: 0 0 0 25px;
font-weight: bold;
}
@@ -446,7 +453,7 @@ Make accept and cancel buttons similarly styled throughout the UI
#popup_cancel,
.cancel-btn {
background-color: #666 !important;
- color: white !important;
+ color: var(--contrast-text-color) !important;
}
#popup_cancel:hover,
@@ -644,12 +651,12 @@ body #primary-settings .unfold:hover,
ul.tabs li a.active,
#nav ul li a:hover {
background-color: var(--link-color) !important;
- color: white !important;
+ color: var(--contrast-text-color) !important;
}
body a.link-btn,
ul.tabs li a {
- color: #333333 !important;
+ color: var(--dark-text-color) !important;
}
footer li a,
@@ -659,7 +666,7 @@ body a.link-btn.active,
div.courses-left-menu,
.portfolio-list a.btn,
a._3_bfp {
- color: white !important;
+ color: var(--contrast-text-color) !important;
}
.setting-highlight {
@@ -675,8 +682,8 @@ a._3_bfp {
left: 3px;
top: 12px;
z-index: 9999;
- color: white !important;
- border: 2px solid white;
+ color: var(--contrast-text-color) !important;
+ border: 2px solid var(--contrast-text-color);
border-radius: 10px;
background-color: dodgerblue;
padding: 5px 8px;
@@ -690,8 +697,8 @@ a._3_bfp {
}
.splus-beta-container h3 {
- color: white !important;
- border-bottom: 1px solid white !important;
+ color: var(--contrast-text-color) !important;
+ border-bottom: 1px solid var(--contrast-text-color) !important;
}
.splus-beta-tag {
@@ -781,4 +788,92 @@ a._3_bfp {
.splus-mark-completed-hide .splus-assignment-complete {
display: none !important;
+}
+
+#header.site-navigation {
+ background: transparent !important;
+}
+
+/* :root .darktheme-toggle-navbar-path {
+ fill: transparent;
+ stroke: white;
+} */
+
+:root[modern=false] #darktheme-toggle-navbar-button {
+ display: none;
+ padding: 0 14px;
+}
+
+:root[modern=true] #darktheme-toggle-navbar-button {
+ fill: currentColor;
+ stroke: none;
+ padding: 0 14px;
+}
+
+:root[modern=false][dark] #darktheme-toggle-navbar-button {
+ display: inline-block;
+ stroke:currentColor;
+ stroke-width: 20pt;
+ fill: transparent;
+}
+
+#darktheme-toggle-navbar-button .explanation-popup {
+ display: none;
+}
+
+#darktheme-toggle-navbar-button svg {
+ width: 27px;
+ height: 33px;
+}
+
+:root[modern=true] #darktheme-toggle-navbar-button svg {
+ width: 27px;
+ height: 30px;
+}
+
+.splus-button-tile-container {
+ display: grid;
+ grid-template-columns: 30% 30% 30%;
+ grid-auto-rows: 100px;
+ gap: 20px 0;
+ justify-content: space-evenly;
+ margin: 10px 0;
+}
+
+.splus-button-tile {
+ width: 100%;
+ height: 100%;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+
+ border: 1px solid currentColor;
+ border-radius: 5px;
+}
+
+.splus-button-tile.active {
+ border: 1px solid var(--primary-color);
+ background-color: #ddf3fb;
+}
+
+.splus-button-tile:hover {
+ border: 1px solid var(--primary-color);
+ cursor: pointer;
+}
+
+.splus-button-tile-content {
+ font-weight: bold;
+ text-align: center;
+ pointer-events: none;
+ font-size: 14px;
+ font-weight: bold;
+}
+
+.select-theme-tile[data-new=true] .splus-button-tile-content::before {
+ content: "NEW!";
+ margin-right: 5px;
+ padding: 2px 5px;
+ border-radius: 5px;
+ color: white;
+ background: var(--primary-color);
}
\ No newline at end of file
diff --git a/css/modern.css b/css/modern.css
index 90f7875f..723d7e4a 100644
--- a/css/modern.css
+++ b/css/modern.css
@@ -2327,7 +2327,7 @@ img#loader {
}
.lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc .lrn_calc_cover {
- background: var(--secondary) url(../../images/calc-cover.png) no-repeat center center !important;
+ background-color: var(--secondary) !important;
}
.lrn_calc_column>.lrn_btn_grid {
@@ -2731,4 +2731,21 @@ img#loader {
#ids .name-wrapper {
background: transparent !important;
+}
+
+/* Standard Popup Window Background Fix */
+
+.s-slider.rubric-grades-edit .rating-wrapper.selected {
+ background-color: var(--active) !important;
+}
+
+
+/* Discussion Edit Icon Fix */
+
+.discussion-view .action-links-wrapper-junior .action-links-unfold, .discussion-view .action-links-wrapper-junior .action-links-unfold:hover, .discussion-view .action-links-wrapper-junior .active.action-links-unfold, .discussion-view .action-links-wrapper-junior .active.action-links-unfold:hover {
+ background-image: url(https://asset-cdn.schoology.com/sites/all/themes/schoology_theme/images/sprite_discussion.png?5f9c91b5354f0ec1) !important; /* Makes Icon Visble */
+}
+
+.s-js-comment-action-links.sActionLinksVisible > .action-links-wrapper.action-links-wrapper-junior.aligned-right > .action-links-unfold { /* Changes Color When Hovered Over */
+ background-color: var(--accent) !important;
}
\ No newline at end of file
diff --git a/css/modern/all.css b/css/modern/all.css
new file mode 100644
index 00000000..a3bba731
--- /dev/null
+++ b/css/modern/all.css
@@ -0,0 +1,2662 @@
+variable-intellisense {
+ --primary: #36393F;
+ --accent: #2F3136;
+ --secondary: #202225;
+ --text: #DCDDDE;
+ --contrast-text: #EEEEEE;
+ --muted-text: #72767D;
+ --contrast-border: #DCDDDE;
+ --input: #40444B;
+ --error: #F44336;
+ --highlight: rgba(184, 134, 11, 0.2);
+ --active: rgba(0, 255, 255, 0.1);
+ --grades: #8BC34A;
+ --border-radius: 5px;
+ --border-size: 1px;
+ --padding: 10px;
+ --theme-is-dark: 1;
+ --cal1: #457da5;
+ --cal2: #547c41;
+ --cal3: #926c37;
+ --cal4: #7c3d6b;
+ --cal5: #0b4c9c;
+ --cal6: #00209c;
+ --cal7: #004a09;
+ --cal8: #72721a;
+ --cal9: #44233e;
+ --cal10: #683131;
+ --cal11: #770a0a;
+ --cal12: #a72413;
+ --cal13: #E0024C;
+ --cal14: #188C16;
+ --cal15: #bd7304;
+ --cal16: #80168C;
+ --cal17: #164152;
+ --cal18: #00543f;
+ --cal19: #633e11;
+ --cal20: #461b2d;
+}
+
+[modern=true]:root {
+ --modern-border: var(--border-size) solid var(--contrast-border);
+}
+
+[modern=true]:root h1,
+[modern=true]:root h2,
+[modern=true]:root h3,
+[modern=true]:root h4,
+[modern=true]:root h5,
+[modern=true]:root h6,
+[modern=true]:root p {
+ color: var(--text) !important;
+}
+
+[modern=true]:root pre {
+ background-color: var(--input);
+ color: var(--text);
+}
+
+[modern=true]:root #youtube-disclaimer {
+ display: inline-block !important;
+ color: var(--text) !important;
+ background-color: var(--secondary) !important;
+ padding: var(--padding) !important;
+ margin-top: var(--padding) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root textarea,
+[modern=true]:root select,
+[modern=true]:root input[type=text] {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true][style-override=true]:root .s-edge-feed .edge-item *[style] {
+ color: var(--text) !important;
+ background: none !important;
+}
+
+[modern=true][style-override=true]:root .discussion-view .discussion-prompt *[style],
+[modern=true][style-override=true]:root .discussion-view .comment-body-wrapper *[style] {
+ color: var(--text) !important;
+ background: none !important;
+}
+
+[modern=true][style-override=true]:root #important-post-body *[style],
+[modern=true][style-override=true]:root #main-inner .info-container *[style],
+[modern=true][style-override=true]:root .standard-page .s-page-content-full *[style],
+[modern=true][style-override=true]:root .discussion-prompt *[style],
+[modern=true][style-override=true]:root .comment-comment .comment-body-wrapper *[style],
+[modern=true][style-override=true]:root .instructions-content *[style],
+[modern=true][style-override=true]:root .lrn_stimulus .lrn_stimulus_content *[style],
+[modern=true][style-override=true]:root .lrn-possible-answer *[style] {
+ color: var(--text) !important;
+ background: none !important;
+}
+
+[modern=true]:root ul.context-menu-list {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-color: var(--accent) !important;
+}
+
+[modern=true]:root ul.context-menu-list li.context-menu-item {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-color: var(--accent) !important;
+}
+
+[modern=true]:root ul.context-menu-list li.context-menu-item:hover {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .menu-459.group-discussion-left-menu {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root * {
+ scrollbar-color: var(--input) var(--accent) !important;
+ scrollbar-width: 15px !important;
+ scrollbar-arrow-color: var(--contrast-text) !important;
+}
+
+[modern=true]:root *::-webkit-scrollbar {
+ background: transparent !important;
+ width: 15px;
+}
+
+[modern=true]:root *::-webkit-scrollbar-track-piece {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root *::-webkit-scrollbar-button, [modern=true]:root *::-webkit-scrollbar-corner {
+ display: none !important;
+}
+
+[modern=true]:root *::-webkit-scrollbar-thumb {
+ background: var(--input) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #body {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root iframe {
+ background-color: white !important;
+}
+
+[modern=true]:root #main-content-wrapper {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #right-column-inner > div:not(:empty) {
+ background-color: var(--secondary) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ padding: var(--padding) !important;
+}
+
+[modern=true]:root #right-column-inner > div[id^=sgyReactRenders_comp_] {
+ display: none;
+}
+
+[modern=true]:root #center-top {
+ background: unset !important;
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ border: none !important;
+}
+
+[modern=true]:root .has-right-col #center-inner {
+ background: none !important;
+}
+
+[modern=true]:root body a.link-btn,
+[modern=true]:root body button.link-btn {
+ box-shadow: none !important;
+ background: none !important;
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .inline-popup-wrapper {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .inline-popup-wrapper .arrow-top {
+ display: none !important;
+}
+
+[modern=true]:root .s-polls-results-overlay {
+ background-color: var(--input) !important;
+}
+
+[modern=true]:root .s-notifications-mini .edge-sentence {
+ color: var(--text);
+}
+
+[modern=true]:root .grade-data {
+ color: var(--grades) !important;
+}
+
+[modern=true]:root #main .s-notifications-mini .edge-time,
+[modern=true]:root #main .s-notifications-mini .created {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .splus-modal-title {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root .submit-span-wrapper {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root .submit-span-wrapper input[type="button"], [modern=true]:root .submit-span-wrapper input[type="submit"] {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root :not(.submit-span-wrapper) > input[type="button"], [modern=true]:root :not(.submit-span-wrapper) > input[type="submit"] {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root footer li a,
+[modern=true]:root header li a {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root .splus-modal-footer-text {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root .splus-modal-footer-text a {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root body a.link-btn.active,
+[modern=true]:root div.courses-left-menu,
+[modern=true]:root .portfolio-list a.btn,
+[modern=true]:root a._3_bfp {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root footer {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root footer button {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root .Header-header-button-1EE8Y,
+[modern=true]:root [class*="Header-header-drop-menu-item-"],
+[modern=true]:root [class*="Header-header-drop-menu-"] li a *,
+[modern=true]:root .Header-header-button-active-GnvKh,
+[modern=true]:root .LGaPf svg {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root .Header-header-drop-menu-3SaYV._1Z0RM {
+ background-color: var(--hover-color) !important;
+}
+
+[modern=true]:root .close {
+ color: var(--contrast-text) !important;
+ opacity: 0.8 !important;
+}
+
+[modern=true]:root .close:hover, [modern=true]:root .close:focus {
+ opacity: 1 !important;
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text {
+ background-color: var(--text) !important;
+ color: var(--secondary) !important;
+ filter: Invert(var(--theme-is-dark)) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .action-links-unfold {
+ background-image: none !important;
+ background-color: var(--secondary) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true][dark=false]:root .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text:hover,
+[modern=true]:root .action-links-unfold:hover {
+ background-color: var(--muted-text) !important;
+}
+
+[modern=true][dark=false]:root .action-links-wrapper-expanded .action-links-unfold .action-links-unfold-text:hover,
+[modern=true][dark=false]:root .action-links-unfold:hover {
+ background-color: var(--muted-text) !important;
+}
+
+[modern=true]:root .popups-box .popups-body,
+[modern=true]:root #popups-loading div {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ border: none !important;
+}
+
+[modern=true]:root .popups-box .submit-buttons {
+ background-color: var(--accent) !important;
+ border-top: none !important;
+}
+
+[modern=true]:root .popups-box .popups-title {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: none !important;
+}
+
+[modern=true]:root .popups-close:hover a {
+ background-color: var(--input) !important;
+}
+
+[modern=true]:root .popups-close a {
+ background-position-y: calc(-80px - (20px * var(--theme-is-dark))) !important;
+ border-radius: 2px !important;
+}
+
+[modern=true]:root .likers li:not(.last) {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root fieldset div div div label span {
+ color: var(--text) !important;
+}
+
+[modern=true]:root ._2WC16 span._24avl._17Z60 {
+ color: var(--accent) !important;
+}
+
+[modern=true]:root .popups-buttons-inner {
+ background: var(--secondary) !important;
+}
+
+[modern=true]:root .popups-tab,
+[modern=true]:root .popups-tabs {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .popups-tab.active {
+ background: var(--primary) !important;
+}
+
+[modern=true]:root ._pendo-step-container-styles {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .pendo-mock-flexbox-element:nth-child(2) > button {
+ background-color: var(--primary) !important;
+ border-color: var(--contrast-border) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .popups-box.popups-library #resources-left-menu-wrapper {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .popups-box #library-wrapper {
+ background: var(--primary) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root div.error,
+[modern=true]:root tr.error {
+ background-color: var(--error) !important;
+ border-color: var(--error) !important;
+}
+
+[modern=true]:root .splus-courses-navbar-button div[role=menu],
+[modern=true]:root .splus-groups-navbar-button div[role=menu] {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .splus-coursesdropdown-reorder-btn {
+ filter: Invert(var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root .splus-courses-navbar-button article,
+[modern=true]:root .splus-groups-navbar-button article {
+ border: var(--border-size) solid transparent !important;
+ outline: none !important;
+}
+
+[modern=true]:root .splus-courses-navbar-button article a,
+[modern=true]:root .splus-groups-navbar-button article a {
+ border: var(--border-size) solid transparent !important;
+ outline: none !important;
+}
+
+[modern=true]:root .JoinCard-card-1qWtS {
+ border: var(--border-size) solid transparent !important;
+ outline: none !important;
+}
+
+[modern=true]:root .splus-courses-navbar-button article a:hover,
+[modern=true]:root .splus-groups-navbar-button article a:hover,
+[modern=true]:root .JoinCard-card-1qWtS:hover {
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .Card-card-image-uV6Bu {
+ border-top-left-radius: var(--border-radius) !important;
+ border-top-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .Card-card-data-17m6S {
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .Card-card-data-17m6S div {
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .splus-courses-navbar-button article a div,
+[modern=true]:root .splus-groups-navbar-button article a div {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .splus-courses-navbar-button article a div div._1wP6w,
+[modern=true]:root .splus-groups-navbar-button article a div div._1wP6w {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .splus-courses-navbar-button article a div div._2wOCj,
+[modern=true]:root .splus-groups-navbar-button article a div div._2wOCj {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root #darktheme-toggle-navbar-button[data-popup=true] {
+ position: relative;
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root #darktheme-toggle-navbar-button[data-popup=true] .explanation-popup {
+ display: block;
+ position: absolute;
+ top: 100%;
+ left: 0;
+ padding: var(--padding);
+ background-color: var(--secondary);
+ border: var(--modern-border);
+ border-radius: var(--border-radius);
+ color: var(--text);
+ line-height: normal !important;
+ text-transform: none !important;
+ text-align: left !important;
+ width: 250px;
+ pointer-events: none;
+}
+
+[modern=true]:root #darktheme-toggle-navbar-button[data-popup=true] .explanation-popup h3 {
+ float: right;
+ padding: 5px 20px 5px;
+ margin-top: 5px;
+ border-radius: var(--border-radius);
+ background-color: var(--accent);
+ pointer-events: all;
+}
+
+[modern=true]:root #darktheme-toggle-navbar-button[data-popup=true] .explanation-popup h3:hover {
+ background-color: var(--active);
+}
+
+[modern=true]:root header div.Je0RK button._1SIMq {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root ._1DD87,
+[modern=true]:root ._3gfrT:focus:not(:active),
+[modern=true]:root .oUq3j:hover:not(:active) {
+ border: var(--modern-border) !important;
+}
+
+[modern=true]:root .JoinCard-card-1qWtS ._1Z0RM {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .fcalendar-filter-menu-wrapper {
+ background-color: var(--secondary) !important;
+ border-radius: var(--border-radius);
+}
+
+[modern=true]:root .color-codes-box {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .fcalendar-filter-menu-wrapper .checkbox.filter-selected {
+ background-position-y: -19px !important;
+}
+
+[modern=true]:root body .fc-event-skin {
+ color: var(--text);
+}
+
+[modern=true]:root .color-default-personal,
+[modern=true]:root .color-default-groups,
+[modern=true]:root .color-default-courses,
+[modern=true]:root .color-default-school,
+[modern=true]:root .color-1,
+[modern=true]:root .color-2,
+[modern=true]:root .color-3,
+[modern=true]:root .color-4,
+[modern=true]:root .color-5,
+[modern=true]:root .color-6,
+[modern=true]:root .color-7,
+[modern=true]:root .color-8,
+[modern=true]:root .color-9,
+[modern=true]:root .color-10,
+[modern=true]:root .color-11,
+[modern=true]:root .color-12,
+[modern=true]:root .color-13,
+[modern=true]:root .color-14,
+[modern=true]:root .color-15,
+[modern=true]:root .color-16 {
+ border-color: rgba(0, 0, 0, 0.4) !important;
+}
+
+[modern=true]:root .fc-event-skin.ev-course,
+[modern=true]:root .legend-course {
+ background: var(--cal3);
+ border-color: rgba(0, 0, 0, 0.4) !important;
+}
+
+[modern=true]:root .fc-event-skin.ev-group,
+[modern=true]:root .legend-group {
+ background: var(--cal2);
+ border-color: rgba(0, 0, 0, 0.4) !important;
+}
+
+[modern=true]:root .fc-event-skin.ev-user,
+[modern=true]:root .legend-user {
+ background: var(--cal1);
+ border-color: rgba(0, 0, 0, 0.4) !important;
+}
+
+[modern=true]:root .fc-event-skin.ev-school,
+[modern=true]:root .legend-school {
+ background: var(--cal4);
+ border-color: rgba(0, 0, 0, 0.4) !important;
+}
+
+[modern=true]:root .color-default-personal {
+ background: var(--cal1) !important;
+}
+
+[modern=true]:root .color-default-groups {
+ background: var(--cal2) !important;
+}
+
+[modern=true]:root .color-default-courses {
+ background: var(--cal3) !important;
+}
+
+[modern=true]:root .color-default-school {
+ background: var(--cal4) !important;
+}
+
+[modern=true]:root .color-1 {
+ background: var(--cal5) !important;
+}
+
+[modern=true]:root .color-2 {
+ background: var(--cal6) !important;
+}
+
+[modern=true]:root .color-3 {
+ background: var(--cal7) !important;
+}
+
+[modern=true]:root .color-4 {
+ background: var(--cal8) !important;
+}
+
+[modern=true]:root .color-5 {
+ background: var(--cal9) !important;
+}
+
+[modern=true]:root .color-6 {
+ background: var(--cal10) !important;
+}
+
+[modern=true]:root .color-7 {
+ background: var(--cal11) !important;
+}
+
+[modern=true]:root .color-8 {
+ background: var(--cal12) !important;
+}
+
+[modern=true]:root .color-9 {
+ background: var(--cal13) !important;
+}
+
+[modern=true]:root .color-10 {
+ background: var(--cal14) !important;
+}
+
+[modern=true]:root .color-11 {
+ background: var(--cal15) !important;
+}
+
+[modern=true]:root .color-12 {
+ background: var(--cal16) !important;
+}
+
+[modern=true]:root .color-13 {
+ background: var(--cal17) !important;
+}
+
+[modern=true]:root .color-14 {
+ background: var(--cal18) !important;
+}
+
+[modern=true]:root .color-15 {
+ background: var(--cal19) !important;
+}
+
+[modern=true]:root .color-16 {
+ background: var(--cal20) !important;
+}
+
+[modern=true]:root .fc-state-default {
+ background-color: var(--primary) !important;
+ border-color: none !important;
+ color: var(--text) !important;
+ border-width: var(--border-size) !important;
+}
+
+[modern=true]:root .fc-state-default .fc-button-inner {
+ background-color: var(--primary) !important;
+ border-color: none !important;
+ color: var(--text) !important;
+ border-width: var(--border-size) !important;
+}
+
+[modern=true]:root .fc-button.fc-corner-left {
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-top-left-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .fc-button.fc-corner-right {
+ border-bottom-right-radius: var(--border-radius) !important;
+ border-top-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .fc-state-disabled {
+ background-color: var(--secondary) !important;
+ color: var(--muted-text) !important;
+ border-color: none !important;
+}
+
+[modern=true]:root .fc-state-disabled .fc-button-inner {
+ background-color: var(--secondary) !important;
+ color: var(--muted-text) !important;
+ border-color: none !important;
+}
+
+[modern=true]:root .fc-state-active {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .fc-state-active .fc-button-inner {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root div.les2- {
+ background-color: var(--secondary) !important;
+}
+
+[modern=true]:root div.les2- ._3skcp {
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root div.les2- ._1wP6w {
+ color: var(--text) !important;
+}
+
+[modern=true]:root div.les2- ._2wOCj {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .util-hover-background-color-cloud-grey-wHghL:hover,
+[modern=true]:root .util-focus-background-color-cloud-grey-3x07X:focus,
+[modern=true]:root ._33zXx {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root div.les2- h3 {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .close-button,
+[modern=true]:root .restore-defaults {
+ color: var(--error) !important;
+}
+
+[modern=true]:root .setting-highlight {
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root .splus-modal-body {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .is-home #right-column-inner div,
+[modern=true]:root .is-home #home-feed-container {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .is-home #center div#main,
+[modern=true]:root .is-home #main-inner,
+[modern=true]:root .is-home #main-content-wrapper {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .date-header h4 span,
+[modern=true]:root .s-poll-option-title,
+[modern=true]:root .s-like-sentence {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .s-polls-poll-option,
+[modern=true]:root #edge-filters-menu {
+ background: none !important;
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #edge-filters {
+ background: none !important;
+ border: none !important;
+}
+
+[modern=true]:root #edge-filters-btn,
+[modern=true]:root .feed-comments {
+ background-position-y: calc(-576px - 18px * var(--theme-is-dark)) !important;
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ opacity: unset !important;
+}
+
+[modern=true]:root #edge-filters-menu .edge-filter-option {
+ background-position: 0 calc(-237px - 20px * var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root #edge-filters-menu .edge-filter-option:hover, [modern=true]:root #edge-filters-menu .edge-filter-option.active:hover {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .gray,
+[modern=true]:root .upcoming-time {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root img.splus-logo-inline {
+ filter: brightness(var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root .splus-broadcast-post {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .theme-2016 .date-header h4,
+[modern=true]:root #home-feed-container #smart-box {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .view-file-popup,
+[modern=true]:root .view-btn-disabled,
+[modern=true]:root .edit-external-tool-attachment {
+ border-left: var(--modern-border) !important;
+}
+
+[modern=true]:root .sgy-tabbed-navigation {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .sgy-tabbed-navigation li.active {
+ border-bottom: 5px solid var(--contrast-border) !important;
+}
+
+[modern=true]:root .s-edge-type-update-post .update-body,
+[modern=true]:root .s-edge-type-update-poll .update-body {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .user span.name-wrapper {
+ background: var(--secondary) !important;
+}
+
+[modern=true]:root .selected-realm .name-text {
+ color: var(--text) !important;
+}
+
+[modern=true]:root #edge-filters-btn {
+ background-color: var(--text) !important;
+ color: var(--secondary) !important;
+ filter: Invert(var(--theme-is-dark)) !important;
+ background-position-y: -577px !important;
+ background-position-x: right !important;
+ background-image: url("/sites/all/themes/schoology_theme/images/btn-sprite.png?2f89e2e4127348b5") !important;
+}
+
+[modern=true][dark=false]:root #edge-filters-btn {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ filter: none !important;
+ background-image: url("/sites/all/themes/schoology_theme/images/btn-sprite.png?5f89e2e4127348b5") !important;
+}
+
+[modern=true]:root .gradebook-course.hierarchical-grading-report .period-row .grade-column,
+[modern=true]:root .gradebook-course.hierarchical-grading-report .category-row .grade-column,
+[modern=true]:root .gradebook-course.hierarchical-grading-report .item-row .grade-column {
+ color: var(--grades) !important;
+}
+
+[modern=true]:root .grade-active-color,
+[modern=true]:root .awarded-grade span {
+ color: var(--grades) !important;
+}
+
+[modern=true]:root .due-date,
+[modern=true]:root .gradebook-course.hierarchical-grading-report .grade-column .max-grade,
+[modern=true]:root .percentage-contrib,
+[modern=true]:root span.comment,
+[modern=true]:root .grade-none-color,
+[modern=true]:root .course-grade-text,
+[modern=true]:root .total-points-wrapper *,
+[modern=true]:root .percentage-grade,
+[modern=true]:root .no-grade {
+ color: var(--text) !important;
+}
+
+[modern=true]:root div.summary-course {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .grade-edit-indicator {
+ filter: Grayscale(var(--theme-is-dark)) Invert(var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root .gradebook-course.hierarchical-grading-report .item-row .td-content-wrapper {
+ border-top: var(--border-size) dotted var(--contrast-border) !important;
+}
+
+[modern=true]:root .gradebook-course.hierarchical-grading-report .period-row .td-content-wrapper,
+[modern=true]:root .gradebook-course.hierarchical-grading-report .final-row .td-content-wrapper,
+[modern=true]:root .gradebook-course.hierarchical-grading-report .td-content-wrapper {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root .item-row.added-fake-assignment {
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root .splus-grade-help-btn .icon-help {
+ background-position: calc(0px - 22px * var(--theme-is-dark)) -127px !important;
+}
+
+[modern=true]:root .gradebook-course.hierarchical-grading-report .childrenCollapsed .title-column:hover .expandable-icon-grading-report {
+ position: absolute !important;
+ clip: rect(calc(15px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), 0) !important;
+ top: calc(0px + (16px * var(--theme-is-dark))) !important;
+ left: -20px !important;
+ opacity: 1 !important;
+}
+
+[modern=true]:root .gradebook-course.hierarchical-grading-report .childrenCollapsed .title-column .expandable-icon-grading-report {
+ position: absolute !important;
+ clip: rect(calc(15px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), calc(30px - (15px * var(--theme-is-dark))), 0) !important;
+ top: calc(0px + (16px * var(--theme-is-dark))) !important;
+ left: -20px !important;
+ opacity: 0.8 !important;
+}
+
+[modern=true]:root .gradebook-course.hierarchical-grading-report .title-column .expandable-icon-grading-report {
+ position: absolute !important;
+ clip: rect(calc(46px - (11px * var(--theme-is-dark))), calc(60px - (45px * var(--theme-is-dark))), calc(80px - (30px * var(--theme-is-dark))), 0) !important;
+ top: calc(-32px + (16px * var(--theme-is-dark))) !important;
+ left: -20px !important;
+ opacity: 0.8 !important;
+}
+
+[modern=true]:root .gradebook-course.hierarchical-grading-report .title-column:hover .expandable-icon-grading-report {
+ position: absolute !important;
+ clip: rect(calc(46px - (11px * var(--theme-is-dark))), calc(60px - (45px * var(--theme-is-dark))), calc(80px - (30px * var(--theme-is-dark))), 0) !important;
+ top: calc(-32px + (16px * var(--theme-is-dark))) !important;
+ left: -20px !important;
+ opacity: 1 !important;
+}
+
+[modern=true]:root .empty.grades-empty {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .download-grade-wrapper a.link-btn {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root #past-selector .item-list a.link-btn.active {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root body ul.primary {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+}
+
+[modern=true]:root body ul.primary li.active a {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+}
+
+[modern=true]:root body ul.primary li.active a:hover {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+}
+
+[modern=true]:root body ul.primary li a {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+}
+
+[modern=true]:root body ul.primary li a:hover, [modern=true]:root body ul.primary li a:visited {
+ border-color: var(--contrast-border) !important;
+ border-width: var(--border-size) !important;
+}
+
+[modern=true]:root .gradebook-course,
+[modern=true]:root .attendance-course {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root .attendance-course-attendance table th,
+[modern=true]:root .attendance-course-attendance table td {
+ border: var(--modern-border) !important;
+}
+
+[modern=true]:root #s-js-student-mastery-report-view-content {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .s-js-chart-and-pager-area .empty {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root .highcharts-container > svg > rect {
+ fill: var(--primary);
+}
+
+[modern=true]:root .highcharts-axis-labels > text {
+ color: var(--text) !important;
+ fill: var(--text) !important;
+}
+
+[modern=true]:root .score-value {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .course-action-btns,
+[modern=true]:root .group-action-btns {
+ padding: var(--padding) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #secondary-tabs-wrapper {
+ border-right: none !important;
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div button {
+ filter: Grayscale(var(--theme-is-dark)) Invert(var(--theme-is-dark));
+}
+
+[modern=true]:root body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div .Card-card-2rORL {
+ background-color: var(--accent) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div div {
+ color: var(--text) !important;
+}
+
+[modern=true]:root body > div._1f1I3._35u4I.IaH_B.RuZ14.VSOiH._3brnw.S42JQ > div > div div._2wOCj {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root body #right-column-inner button.link-btn,
+[modern=true]:root body #right-column-inner a.link-btn {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root #reorder-ui button.link-btn span {
+ filter: Invert(var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root .course-list-view #secondary-tabs-wrapper ul {
+ border-bottom: none !important;
+}
+
+[modern=true]:root .no-courses {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .tabs.secondary li a {
+ background: var(--secondary) !important;
+ color: var(--text) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .tabs.secondary li.active a {
+ background: none !important;
+ color: var(--text) !important;
+ background-color: var(--active) !important;
+ border-radius: var(--border-radius) !important;
+ border: none !important;
+}
+
+[modern=true]:root .listing .course-item.list-item,
+[modern=true]:root .courses-listing.mycourses h3 {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root #main .courses-listing.listing {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root .sgy-course-search-form__submit-row {
+ background: none !important;
+ border-color: none !important;
+}
+
+[modern=true]:root .sgy-react-select .Select-control,
+[modern=true]:root .sgy-react-select .Select-menu-outer {
+ color: var(--text) !important;
+ border-color: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .sgy-react-select .Select-control {
+ background-color: var(--input) !important;
+}
+
+[modern=true]:root .sgy-react-select .Select-placeholder {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .sgy-react-select .Select-menu-outer {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .sgy-react-select .Select-option {
+ color: var(--text);
+}
+
+[modern=true]:root .sgy-react-select .Select-option:hover {
+ background-color: var(--active);
+}
+
+[modern=true]:root .enrollment-search .go-btn {
+ background-color: inherit !important;
+}
+
+[modern=true]:root .roster-top {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root body .enrollment-filters span.active,
+[modern=true]:root body .grading-groups-list .grading-group.active {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .enrollment-filters span:hover {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root #site-navigation-breadcrumbs nav {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root #site-navigation-breadcrumbs nav li a,
+[modern=true]:root #site-navigation-breadcrumbs nav li span {
+ color: var(--text) !important;
+}
+
+[modern=true]:root #library-main {
+ border-right: none !important;
+}
+
+[modern=true]:root #library-wrapper {
+ background-color: var(--accent) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #library-wrapper a.active:not(.item-title),
+[modern=true]:root #library-wrapper .library-collections a:hover {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root #library-left td:hover {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root #library-search-form-container div {
+ background-color: var(--secondary) !important;
+}
+
+[modern=true]:root #library-search-form-container div::before {
+ display: none !important;
+}
+
+[modern=true]:root #collection-view-contents .collection-row-empty td {
+ color: var(--text) !important;
+}
+
+[modern=true]:root body.library-view #library-main {
+ border-left: var(--modern-border) !important;
+}
+
+[modern=true]:root #collection-toolbar {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root #collection-view-contents {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root #collection-view-contents th,
+[modern=true]:root #collection-view-contents td {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root #library-left .collections-list-wrapper {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root body.library-view #library-left {
+ border-right: var(--modern-border) !important;
+}
+
+[modern=true]:root #collection-toolbar .action-links-unfold {
+ box-shadow: none !important;
+ border: none !important;
+ background: var(--secondary) !important;
+ border-radius: var(--border-radius) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root #collection-toolbar .action-links-unfold:hover {
+ background-color: var(--muted-text) !important;
+}
+
+[modern=true]:root #reorder-collections-btn {
+ color: var(--text) !important;
+}
+
+[modern=true]:root #reorder-collections-btn:hover {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .action-links > li > span {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .progressContainer,
+[modern=true]:root .link-attachment,
+[modern=true]:root .attachment-block,
+[modern=true]:root .resource-attachment {
+ background: var(--primary) !important;
+}
+
+[modern=true]:root .options-reorder-btn,
+[modern=true]:root .options-auto-arrange-btn {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .options-reorder-btn:hover,
+[modern=true]:root .options-auto-arrange-btn:hover {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .right-block-big-wrapper {
+ padding: var(--padding) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #sidebar-left #left-nav #menu-s-main ul li a.active {
+ background-color: var(--accent) !important;
+ border: var(--modern-border) !important;
+ border-right: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .app-link-wrapper .active {
+ background-color: var(--accent) !important;
+ border: var(--modern-border) !important;
+ border-right: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .app-link-wrapper .active:hover {
+ background-color: var(--accent) !important;
+ border: var(--modern-border) !important;
+ border-right: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #sidebar-left #menu-s-main .active-trail .active-trail a.course-materials-left-menu {
+ background-color: var(--accent) !important;
+ border: var(--modern-border) !important;
+ border-right: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root th.profile-header {
+ color: var(--text) !important;
+}
+
+[modern=true]:root #profile-form-tab {
+ background-color: var(--accent);
+}
+
+[modern=true]:root .tab-nav.active {
+ background-color: var(--input);
+}
+
+[modern=true]:root .tab-nav.active:hover {
+ background-color: var(--input);
+}
+
+[modern=true]:root .action-links,
+[modern=true]:root .comment.no-comments,
+[modern=true]:root .materials-filter-wrapper {
+ background-color: var(--secondary) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root #wrapper {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .navigator-buttons a.navbtn.link-btn {
+ background-color: var(--primary) !important;
+ border-radius: var(--border-radius) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .has-folder-player #center-top .content-top-upper,
+[modern=true]:root .has-materials-player #center-top .content-top-upper {
+ background-color: var(--secondary) !important;
+ border: none !important;
+}
+
+[modern=true]:root #course-profile-materials {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .materials-filter-wrapper .action-links-wrapper .action-links-unfold {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .action-links-wrapper-gearless .action-links-unfold.active, [modern=true]:root .action-links-wrapper-gearless .action-links-unfold:active {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .action-links .selected {
+ background-position: 0 calc(-237px - 20px * var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root body .action-links a:hover {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .materials-top,
+[modern=true]:root #folder-contents-table td,
+[modern=true]:root #right-column h3,
+[modern=true]:root .left-block-wrapper h3 {
+ border: none !important;
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .s-edge-feed > li {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root .s-edge-feed .edge-item li {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .s-edge-feed table[bgcolor] {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .s-like-sentence:not(:last-child) {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .pre-fill,
+[modern=true]:root .upcoming-list .empty,
+[modern=true]:root .readonly-title,
+[modern=true]:root .no-attendance-status-dates {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root #edit-course-switcher-select-nid-menu {
+ border: var(--modern-border) !important;
+ background-color: var(--secondary);
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #edit-course-switcher-select-nid-menu .ui-selectmenu-group li a:hover {
+ color: var(--text) !important;
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root #edit-course-switcher-select-nid-button {
+ border: none !important;
+ background: none !important;
+ background-color: var(--secondary) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #edit-course-switcher-select-nid-button:not(.ui-state-active) .edit-course-inline-dropdown-arrow {
+ filter: Invert(var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root .messages.warning {
+ background: var(--highlight) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root span#updates-count {
+ color: var(--text) !important;
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .link_view .page-title a:hover .external-link-icon {
+ background-position: 0 -1425px !important;
+}
+
+[modern=true]:root .access-code.left-block-wrapper,
+[modern=true]:root #roster-wrapper .parent-code {
+ background-color: var(--accent);
+ color: var(--text);
+}
+
+[modern=true]:root .privatemsg-list td {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .privatemsg-list .privatemsg-unread td {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root table.privatemsg-list {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root table.privatemsg-list td.no-messages {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root #attachment-selector {
+ background: var(--secondary) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #attachment-selector li {
+ border-right: none !important;
+}
+
+[modern=true]:root #ids {
+ background: none !important;
+ border: none !important;
+}
+
+[modern=true]:root #ids .userlist_input {
+ border: none !important;
+}
+
+[modern=true]:root #ids .name-wrapper {
+ background: var(--secondary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .ac_results {
+ background: var(--secondary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .ac_results ul li {
+ background: var(--secondary) !important;
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root .ac-name,
+[modern=true]:root .ac-top {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .ac-row .ac-bot,
+[modern=true]:root .ac-row .ac-school {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .ac_results .ac_over {
+ border-color: var(--contrast-border) !important;
+ background: var(--active) !important;
+}
+
+[modern=true]:root #sUserAutocomplete-recipient-helper {
+ background-color: var(--secondary) !important;
+ color: var(--muted-text) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .message-participants {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .message-title,
+[modern=true]:root .message-view-row {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .discussion-view .sticky-wrapper h2.page-title {
+ background: var(--primary) !important;
+}
+
+[modern=true]:root .discussion-view #content-wrapper {
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .discussion-view #center-top h2.page-title {
+ border: none !important;
+}
+
+[modern=true]:root .discussion-view #s_comments .s_comments_level .comment.on-top,
+[modern=true]:root .discussion-view #main #s_comments .s_comments_level .s_comments_level .comment.on-top {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .grade-title {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .received-grade {
+ color: var(--grades) !important;
+}
+
+[modern=true]:root .grading-grade .max-points {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .assignment-details,
+[modern=true]:root .extra-details {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .discussion-view .sticky-wrapper .s-comments-post-form,
+[modern=true]:root .discussion-view .sticky-wrapper .s-comments-post-form-new {
+ background: var(--primary) !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .discussion-action-bar {
+ background: var(--secondary) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .discussion-view .discussion-content #s_comments .discussion-card {
+ background: var(--primary) !important;
+ box-shadow: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .discussion-view #content-wrapper .discussion-content div#s_comments .s_comments_level .s_comments_level,
+[modern=true]:root .discussion-view #content-wrapper .s-comments-post-form-new div#s_comments .s_comments_level .s_comments_level {
+ background: var(--accent) !important;
+ border: none !important;
+ border-bottom-left-radius: var(--border-radius) !important;
+ border-bottom-right-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .discussion-view .expander-bar {
+ background: var(--accent) !important;
+ border: none !important;
+ border-top-left-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .post-count {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .discussion-view .discussion-content {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root .bar-right-wrapper,
+[modern=true]:root .comment-counts {
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root .discussion-view #comment-placeholder {
+ background: var(--accent) !important;
+ border-radius: var(--border-radius) !important;
+ border: none !important;
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .content-top-wrapper .info-container.not-admin .link-btn {
+ background: var(--secondary) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #comment-navigator td {
+ background: var(--primary) !important;
+ border: none !important;
+}
+
+[modern=true]:root #comment-navigator td.slide-toggler-cell {
+ background: var(--secondary) !important;
+}
+
+[modern=true]:root .num-comments-wrapper {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .info-tab th,
+[modern=true]:root .info-tab td {
+ color: var(--muted-text) !important;
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .enrollment-view-wrapper td,
+[modern=true]:root .enrollment-view-wrapper th {
+ color: var(--muted-text) !important;
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .info-tab .profile-header {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .private-profile {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root .private-profile h3 {
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root .portfolio-list {
+ border: none !important;
+}
+
+[modern=true]:root .tw-bs .portfolio-list__no-portfolios-text {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .tw-bs .portfolio-list__add-new,
+[modern=true]:root .tw-bs .portfolio-view__add-new {
+ background: transparent !important;
+}
+
+[modern=true]:root .tw-bs .portfolio-list__add-new-bg,
+[modern=true]:root .tw-bs .portfolio-view__add-new-bg {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .portfolio-route-content {
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+ background: var(--secondary) !important;
+}
+
+[modern=true]:root .tw-bs .portfolio-title-bar {
+ background: var(--secondary) !important;
+}
+
+[modern=true]:root .portfolio-view__content {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .portfolio-card {
+ background: var(--primary) !important;
+}
+
+[modern=true]:root .tw-bs .portfolio-list__list-view > .ui-state-highlight,
+[modern=true]:root .tw-bs .portfolio-item-list > .ui-state-highlight {
+ background: var(--primary) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #school-events {
+ padding: var(--padding) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #main {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .left-block dd {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .left-block dt {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .enrollment-view-wrapper,
+[modern=true]:root .roster-top,
+[modern=true]:root .active-loader {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root #s-user-realm-profile-notification-setting-form label:hover {
+ background: none !important;
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root #content-left .s-enrollment-realm-actions {
+ border-top: var(--modern-border) !important;
+}
+
+[modern=true]:root #edit-body_fontsizeselect_text {
+ background: transparent;
+}
+
+[modern=true]:root .course-dashboard section {
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .course-dashboard section.sgy-card {
+ background-color: var(--accent) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .course-dashboard .sgy-card-lens {
+ background-color: var(--accent) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .course-dashboard .sgy-card {
+ border: var(--border-size) solid transparent !important;
+}
+
+[modern=true]:root .course-dashboard .sgy-card:hover {
+ border: var(--modern-border) !important;
+}
+
+[modern=true]:root .course-dashboard .sgy-card:hover .sgy-card-lens::after {
+ display: none !important;
+}
+
+[modern=true]:root .course-dashboard section.sgy-card .sgy-multiline-ellipsis__split-part {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .course-dashboard section.sgy-card .sgy-card-subcontext {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .course-dashboard .ui-state-highlight {
+ border: var(--border-size) dashed var(--contrast-border) !important;
+ background-color: var(--secondary) !important;
+}
+
+[modern=true]:root ul.Search-dropdown-3huUv {
+ border: none !important;
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .Search-dropdown-3huUv input {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+ border-bottom: var(--border-size) solid transparent !important;
+}
+
+[modern=true]:root ul.primary,
+[modern=true]:root .with-tabs #center-top {
+ background: unset !important;
+ background-color: var(--secondary) !important;
+}
+
+[modern=true]:root ul.primary li a,
+[modern=true]:root ul.primary li .link-wrapper a {
+ background: unset !important;
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root ul.primary li.active a,
+[modern=true]:root ul.primary li.active .link-wrapper a {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .email-notify,
+[modern=true]:root fieldset {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .sticky-header *,
+[modern=true]:root .ui-selectmenu-status {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root div.cellphone-container {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #s-user-set-notifications-form thead tr:hover {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root #s-user-custom-notifications-form #edit-select-all-wrapper label {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root #s-user-custom-notifications-form label {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .ui-selectmenu {
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+ background: none !important;
+}
+
+[modern=true]:root .ui-selectmenu-menu {
+ background: var(--secondary) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .ui-selectmenu-menu li a {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .ui-selectmenu-menu li:hover a {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .ui-selectmenu-menu .ui-selectmenu-item-focus a {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .ui-selectmenu-menu .ui-selectmenu-item-selected a:after {
+ background-position: 0 calc(-242px - 20px * var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root .settings-table tbody td {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .settings-table tbody td.selected {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .settings-table tbody td.selected:hover {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .settings-table tbody td.realm-disabled {
+ background: none !important;
+}
+
+[modern=true]:root .settings-table tbody td.realm-disabled:hover {
+ background: none !important;
+}
+
+[modern=true]:root .settings-table tbody td.area-disabled {
+ background: none !important;
+}
+
+[modern=true]:root .terms-msg {
+ color: var(--text) !important;
+}
+
+[modern=true]:root #error-page {
+ background-color: var(--secondary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .fc-state-highlight {
+ background: var(--active) !important;
+}
+
+[modern=true]:root .fc-view-month td:hover {
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root table.fc-border-separate td {
+ border: var(--modern-border) !important;
+}
+
+[modern=true]:root table.fc-border-separate .fc-widget-header {
+ border-bottom: var(--modern-border) !important;
+}
+
+[modern=true]:root .fc-agenda-slots td,
+[modern=true]:root .fc-agenda-slots th {
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root body .fc-widget-header,
+[modern=true]:root .fc-agenda-allday th {
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root body .fc-widget-header .fc-agenda-divider-inner {
+ background: var(--contrast-border) !important;
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root #dropbox-viewer-right-toggle {
+ border: var(--border-size) solid var(--input) !important;
+ background-color: var(--secondary) !important;
+}
+
+[modern=true]:root #dropbox-viewer-right {
+ background: var(--primary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root #dropbox-viewer-comments {
+ background: var(--accent) !important;
+ border-bottom: var(--border-size) solid var(--input) !important;
+}
+
+[modern=true]:root .dropbox-viewer-submission-activity,
+[modern=true]:root .dropbox-viewer-submission-activity-inner {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root ul#attachment-selector li:hover > a {
+ background-color: var(--accent);
+}
+
+[modern=true]:root .popups-box.popups-library #resources-left-menu-wrapper {
+ background-color: var(--primary);
+}
+
+[modern=true]:root .drop-items li:hover {
+ background: var(--accent);
+}
+
+[modern=true]:root table#collection-view-contents tbody tr td {
+ background-color: var(--primary);
+}
+
+[modern=true]:root .s_comments_level {
+ background: var(--accent) !important;
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root .discussion-card > .s_comments_level {
+ background: var(--secondary) !important;
+ border: none !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .comment-container {
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root .dropbox-viewer-item-wrapper {
+ background-color: var(--primary);
+}
+
+[modern=true]:root #grading-rubric-edit-grades-slider .bottom,
+[modern=true]:root #district-mastery-grading-rubric-edit-grades-slider .bottom,
+[modern=true]:root .s-slider .right-column,
+[modern=true]:root .rubric-scroll .rubric-table tbody {
+ background-color: var(--primary);
+ color: var(--text);
+}
+
+[modern=true]:root .view-only .rubric-table .rubric-row-rating span.input-top,
+[modern=true]:root .view-only .rubric-table .rubric-row-rating .input-bottom {
+ color: var(--text);
+}
+
+[modern=true]:root .s_grade_item_assessment .assessment-status-wrapper,
+[modern=true]:root .grading-grade-translated {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root .grading-info {
+ background: var(--secondary) !important;
+ border: var(--modern-border) !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root .not-editable .score-grade-score span,
+[modern=true]:root .param-name {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .assignment-param {
+ color: var(--muted-text) !important;
+}
+
+[modern=true]:root ._1wP6w,
+[modern=true]:root ._2pDDZ:hover:not(:active),
+[modern=true]:root ._3senP:focus:not(:active),
+[modern=true]:root .wL3MX:active {
+ color: var(--text);
+}
+
+[modern=true]:root ._1IGEH:focus:not(:active),
+[modern=true]:root ._1oxpz:hover:not(:active),
+[modern=true]:root ._1Z0RM,
+[modern=true]:root .Dkh_K:active {
+ background-color: var(--accent);
+ color: var(--text);
+}
+
+[modern=true]:root .StudentTable-table-wrapper-classname-2qr2_ > div {
+ background-color: var(--primary) !important;
+ color: var(--text);
+}
+
+[modern=true]:root img#loader {
+ filter: Grayscale(var(--theme-is-dark)) brightness(0.3) !important;
+}
+
+[modern=true]:root .active-trail > div > a {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .modal-modal-1369068783,
+[modern=true]:root .layout-row-inner-3835588998 {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .typography-button-secondary-button-3933442342 {
+ background: var(--primary) !important;
+ color: var(--text) !important;
+ border-color: var(--contrast-border) !important;
+}
+
+[modern=true]:root ._1IGEH:focus:not(:active),
+[modern=true]:root ._1oxpz:hover:not(:active),
+[modern=true]:root ._1Z0RM,
+[modern=true]:root .Dkh_K:active {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root ._2q19q {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root ._1wP6w,
+[modern=true]:root ._2pDDZ:hover:not(:active),
+[modern=true]:root ._3senP:focus:not(:active),
+[modern=true]:root .wL3MX:active {
+ color: var(--text) !important;
+}
+
+[modern=true]:root ._3dHTa {
+ background: var(--active) !important;
+}
+
+[modern=true]:root .UELBU {
+ background: var(--primary) !important;
+}
+
+[modern=true]:root .lrn {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn_widget .lrn_valid,
+[modern=true]:root .lrn_widget .lrn_selected {
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root #s-assessment-view-submission-form .selected.correct span.option-span {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root #s-assessment-view-submission-form .incorrect span.option-span.legacy-true-false-question, [modern=true]:root #s-assessment-view-submission-form .incorrect span.option-span.legacy-multiple-choice-question {
+ background-color: var(--highlight) !important;
+ color: var(--text) !important;
+}
+
+[modern=true][dark=true]:root .assessment-delivery-landing-app div._3dHTa::after {
+ content: "WARNING: A dark theme is enabled and might prevent you from reading certain questions. If you can't read a question, you can temporarily disable dark theme using the Toggle Theme button on the navigation bar.";
+ display: inline-block;
+ text-align: center;
+ width: 50%;
+ padding: var(--padding);
+ background-color: var(--highlight);
+ border: var(--border-size) solid rgba(0, 0, 0, 0.5);
+ border-radius: var(--border-radius);
+}
+
+[modern=true]:root .mathquill-formula {
+ filter: Invert(var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root .ca-assessment-delivery-take-assessment,
+[modern=true]:root .lrn-assess > div {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .menu-overlay {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn .pagination > li > a,
+[modern=true]:root .lrn .pagination > li > span {
+ background-color: var(--input) !important;
+}
+
+[modern=true]:root .lrn .pagination > li > a,
+[modern=true]:root .lrn .pagination > li > span {
+ background-color: var(--input);
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-horizontal-toc .pagination .lrn-assess-btn:focus, [modern=true]:root .lrn.lrn-assess .lrn-horizontal-toc .pagination .lrn-assess-btn:hover {
+ background: var(--input) !important;
+ color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-horizontal-toc .lrn-assess-pagination .lrn-assess-btn:focus, [modern=true]:root .lrn.lrn-assess .lrn-horizontal-toc .lrn-assess-pagination .lrn-assess-btn:hover {
+ background: var(--input) !important;
+ color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .test-title-text {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn.menu-expand-button {
+ box-shadow: none !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .panel-content {
+ border: var(--border-size) solid var(--input) !important;
+ background-color: var(--primary) !important;
+ border: var(--modern-border) !important;
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .item-card .overlay {
+ background: var(--primary);
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .item-number {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .panel-content .panel-footer {
+ background-color: var(--input);
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn.lrn_active,
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_widget.lrn_feature > button.lrn_active,
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn.lrn_btn_blue.lrn_active {
+ border: var(--border-size) solid var(--text) !important;
+ border: var(--modern-border) !important;
+ background: var(--input) !important;
+ box-shadow: none;
+}
+
+[modern=true]:root .lrn-assess .item-count {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .panel-content .panel-footer {
+ background-color: var(--primary);
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .item-card {
+ background-color: var(--input) !important;
+}
+
+[modern=true]:root .lrn-assess-switch .lrn-assess-switch-trigger {
+ background: var(--input);
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .panel-content .panel-footer {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn,
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_widget.lrn_feature > button,
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn.lrn_btn_blue {
+ background-color: var(--accent) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper.menu-with-scroll:after {
+ background-image: none !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn:before,
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn .btn-label {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_widget.lrn_feature > button:before,
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_widget.lrn_feature > button .btn-label {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn.lrn_btn_blue:before,
+[modern=true]:root .lrn.lrn-assess .lrn-right-region .right-wrapper .lrn_btn.lrn_btn_blue .btn-label {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-region:not(.lrn-items-region) .lrn_btn_blue:before,
+[modern=true]:root .lrn.lrn-assess .dialogs .lrn_btn_blue:before {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-region:not(.lrn-items-region) .lrn_btn,
+[modern=true]:root .lrn.lrn-assess .dialogs .lrn_btn {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .menumask > ::-webkit-scrollbar-track-piece {
+ background: white !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .item-card {
+ border: none !important;
+ color: var(--contrast-text) !important;
+ border: var(--modern-border) !important;
+}
+
+[modern=true]:root .lrn-region.lrn-right-region {
+ border: none !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen .panel-header {
+ border-bottom: var(--border-size) solid var(--primary) !important;
+}
+
+[modern=true]:root .lrn_btn.item-prev.pos-right {
+ background-color: var(--secondary) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .app-panel.review-screen button.lrn_btn.lrn-assess-close-review-screen-btn {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .lrn-assess {
+ background: var(--primary) !important;
+}
+
+[modern=true]:root .lrn-assess > div ::-webkit-scrollbar-thumb {
+ background: var(--primary) !important;
+ box-shadow: inset 1px 1px 2px black;
+}
+
+[modern=true]:root .lrn .modal-content {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn.lrn-assess .lrn-region:not(.lrn-items-region) .lrn_btn,
+[modern=true]:root .lrn.lrn-assess .dialogs .lrn_btn {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn_widget.lrn_mcq .lrn_response .lrn_mcqgroup-block .lrn-mcq-option .lrn-label {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn_widget.lrn_mcq .lrn_response .lrn_mcqgroup-block .lrn-mcq-option.lrn_selected .lrn-label {
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root .lrn_widget.lrn_mcq .lrn_response .lrn_mcqgroup-block .lrn_choiceLabel {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn .lrn_possibilityList,
+[modern=true]:root .lrn .lrn_possibilityListContainer {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn .lrn_possibilityList,
+[modern=true]:root .lrn .lrn_possibilityListContainer {
+ border-top: none !important;
+}
+
+[modern=true]:root .lrn .lrn_possibilityList.lrn_list_bottom:before,
+[modern=true]:root .lrn .lrn_possibilityListContainer.lrn_list_bottom:before {
+ border-bottom: 12px solid var(--muted-text) !important;
+}
+
+[modern=true]:root .lrn_dropzone {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .lrn .lrn_btn_drag {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn-annotations-c-modal--notepad {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .lrn .lrn-mask rect {
+ fill: var(--primary) !important;
+}
+
+[modern=true]:root .lrn_calc_column {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc .lrn_calc_btn_opt {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc .lrn_calc_btn_opt:disabled:hover {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc .lrn_calc_btn_opt_dark {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc .lrn_calc_cover {
+ background: var(--secondary) url(../../images/calc-cover.png) no-repeat center center !important;
+}
+
+[modern=true]:root .lrn_calc_column > .lrn_btn_grid {
+ background: var(--primary) !important;
+}
+
+[modern=true]:root .lrn_feature.lrn_calculator .lrn_calc_content .lrn_calc .lrn_btn_grid {
+ background-color: var(--primary);
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn .lrn_btn_sort {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn_box_skin_wrapper {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn_box_skin_wrapper .lrn_audioblock_right {
+ background-color: var(--accent) !important;
+ border-left: none !important;
+}
+
+[modern=true]:root .lrn_box_skin_wrapper .lrn_audioblock_right .lrn_audiomiclevelmask {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn_wfgraphic.lrn_wfcanvas {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn_toolbar,
+[modern=true]:root .lrn .lrn_btn {
+ background-color: var(--input) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn_box_skin_wrapper .lrn_widget_footer .lrn_toolbar_left .lrn_btn {
+ border-right: none !important;
+}
+
+[modern=true]:root .lrn-audio-content {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn_waveform {
+ filter: Invert(var(--theme-is-dark)) !important;
+}
+
+[modern=true]:root .lrn_qr.lrn_video .lrn-video-display {
+ background: var(--input) !important;
+}
+
+[modern=true]:root .lrn_response_input_wrapper {
+ border-radius: var(--border-radius) !important;
+ border: var(--modern-border) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn_widget.lrn_texteditor {
+ border-radius: var(--border-radius) !important;
+ border: var(--modern-border) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn_widget.lrn_chemistryessayV2 .lrn_texteditor_editable.wysihtml-placeholder, [modern=true]:root .lrn_widget.lrn_formulaessayV2 .lrn_texteditor_editable.wysihtml-placeholder, [modern=true]:root .lrn_widget.lrn_longtextV2 .lrn_texteditor_editable.wysihtml-placeholder {
+ color: var(--text) !important;
+ background: var(--accent) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn_texteditor_editable.lrn_editor_area.lrn_longtextinput.wysihtml-sandbox.wysihtml-editor {
+ color: var(--text) !important;
+ background: var(--input) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn-wysihtml-toolbar.lrn_clearfix {
+ color: var(--text) !important;
+ background: var(--secondary) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn-toolbar {
+ background: var(--secondary) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn_icon.lrn-icon-bold, [modern=true]:root .lrn_icon.lrn-icon-italic, [modern=true]:root .lrn_icon.lrn-icon-underline, [modern=true]:root .lrn_icon.lrn-icon-list-bulleted, [modern=true]:root .lrn_icon.lrn-icon-list-numbered {
+ color: var(--text) !important;
+ background: transparent !important;
+}
+
+[modern=true]:root .lrn-toolbar-footer.lrn_clearfix {
+ background: var(--accent) !important;
+ color: var(--text) !important;
+ border: none !important;
+}
+
+[modern=true]:root .lrn_word_count,
+[modern=true]:root .lrn_word_limit {
+ color: var(--text) !important;
+ border: none !important;
+}
+
+[modern=true]:root .clock,
+[modern=true]:root .lrn-assess .timer,
+[modern=true]:root .counter,
+[modern=true]:root .max-time,
+[modern=true]:root .lrn-assess .timer {
+ color: var(--text) !important;
+}
+
+[modern=true]:root #grading-rubric-edit-slider .controls,
+[modern=true]:root #district-mastery-grading-rubric-edit-slider .controls {
+ background: var(--accent) !important;
+ color: var(--text) !important;
+ border: none !important;
+}
+
+[modern=true]:root .rubric-row.ng-scope {
+ background: var(--acent) !important;
+}
+
+[modern=true]:root #grading-rubric-edit-slider .rubric-table .input-top,
+[modern=true]:root .rubric-table span.input-bottom,
+[modern=true]:root #district-mastery-grading-rubric-edit-slider .rubric-table .input-top,
+[modern=true]:root .rubric-table span.input-bottom {
+ color: var(--contrast-text) !important;
+}
+
+[modern=true]:root #grading-rubric-edit-slider .rubric-table tr.header-row,
+[modern=true]:root #district-mastery-grading-rubric-edit-slider .rubric-table tr.header-row {
+ border-top: var(--border-size) solid var(--input) !important;
+ border-bottom: var(--border-size) solid var(--input) !important;
+ border: none !important;
+}
+
+[modern=true]:root #grading-rubric-edit-slider .rubric-table .header-row th,
+[modern=true]:root #district-mastery-grading-rubric-edit-slider .rubric-table .header-row th {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .rubric-scroll {
+ background: var(---accent) !important;
+}
+
+[modern=true]:root #grading-rubric-edit-slider .bottom-ctrls-wrapper,
+[modern=true]:root #district-mastery-grading-rubric-edit-slider .bottom-ctrls-wrapper {
+ background: var(--accent) !important;
+ border: none !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .s-slider.s-grading-rubric-edit-slider.s-grading-rubric.ng-scope.ui-resizable.opened.grade-setup-rubric-edit.new-rubric-edit.read-only {
+ border: none !important;
+}
+
+[modern=true]:root .lrn_widget .lrn_valid,
+[modern=true]:root .lrn_widget .lrn_selected {
+ background-color: var(--input) !important;
+}
+
+[modern=true]:root .lrn_widget .lrn_incorrect {
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root .lrn_widget .lrn_correct {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .lrn_assoc_table {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn_assoc_col2.lrn_disabled.lrn_dragdrop.lrn_dropzone.lrn_incorrect_marker.lrn_response_container > .lrn_btn_drag.lrn_draggable.lrn_incorrect {
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root .lrn_qr.lrn_association .lrn_possibilityList.lrn_list_bottom {
+ margin-top: 0 !important;
+}
+
+[modern=true]:root .lrn_widget .lrn_correctAnswers {
+ background-color: var(--primary) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .lrn_widget .lrn_correctAnswerList > li {
+ background-color: var(--input) !important;
+}
+
+[modern=true]:root .lrn_btn_sort.lrn_sortable.lrn_button.lrn_correct.lrn_sort_block.lrn_draggable.lrn-dragdrop-group-516 {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .lrn_display_correct_answer_enabled {
+ padding: 20px !important;
+}
+
+[modern=true]:root .lrn_texteditor_editable.lrn_editor_area.lrn_longtextinput.lrn_response_input_wrapper {
+ background-color: var(--input) !important;
+}
+
+[modern=true]:root .lrn_assoc_col2.lrn_correct_marker.lrn_disabled.lrn_dragdrop.lrn_dropzone.lrn_response_container > .lrn_btn_drag.lrn_draggable.lrn_correct {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .lrn_btn_sort.lrn_sortable.lrn_button.lrn_incorrect.lrn_sort_block.lrn_draggable.lrn-dragdrop-group-516 {
+ background-color: var(--highlight) !important;
+}
+
+[modern=true]:root .lrn_widget .lrn_suggested_answer_item {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root .lrn_suggested_answer_item.lrn_clearfix > .lrn_suggested.lrn_btn_sort.lrn_btn_no_handle.lrn_disabled.lrn_sort_block.lrn_button {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .lrn_response.lrn_clearfix.lrn_style_button > .lrn-response-validate-wrapper.lrn_response_input.lrn_incorrect {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .lrn-response-validation-wrapper > .lrn_correctAnswers {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root #s-assessment-view-submission-form .selected.correct span.option-span {
+ background-color: var(--active) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .layout-row-outer-1441760367,
+[modern=true]:root .profile-header-2536997237,
+[modern=true]:root .profile-container-4015500229 {
+ background-color: var(--primary) !important;
+}
+
+[modern=true]:root .content-box-container-3232021855 {
+ background-color: var(--accent) !important;
+ border-radius: var(--border-radius) !important;
+ border: var(--modern-border) !important;
+ font-family: muli !important;
+}
+
+[modern=true]:root .rubric-table-row-row-3856304603.rubric-table-row-zebraStripe-4015500229.fjQuT.uQOmx._2NVPS._1Sb_q.WnfJn._3ARYD._3t4oF,
+[modern=true]:root .rubric-grader-header-header-212800519 {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .typography-smallheader-light-bg-text-1999437409 {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .rubric-grader-manage-rubric-studentLabel-3923154451 {
+ color: var(--cal1) !important;
+}
+
+[modern=true]:root .rubric-grader-scrollContainer-634066954 {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .rubric-criteria-drawer-handle-drawerHandleActive-30552431 {
+ background-color: var(--accent) !important;
+ color: var(--text) !important;
+}
+
+[modern=true]:root .rubric-criteria-drawer-handle-copy-1446048478 {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .rubric-grader-gradebook-comment-gradebookCommentContainer-1923026448 {
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .rubric-grader-gradebook-comment-container-3347344084 {
+ color: var(--text) !important;
+}
+
+[modern=true]:root .chart-wrapper .highchart-obj .no-data-overlay {
+ background: transparent !important;
+}
+
+[modern=true]:root .no-data-message-wrapper {
+ background: var(--secondary) !important;
+ color: var(--text) !important;
+ padding: 3px !important;
+ border-radius: var(--border-radius);
+}
+
+[modern=true]:root .s_comments_level {
+ background: var(--primary) !important;
+ border-radius: var(--border-radius) !important;
+ padding: var(--padding) !important;
+}
+
+[modern=true]:root .discussion-card > .s_comments_level {
+ background: var(--input) !important;
+}
+
+[modern=true]:root .iziToast-body img {
+ max-width: 24px !important;
+}
+
+[modern=true]:root .iziToast.iziToast-theme-dark .iziToast-message {
+ color: var(--contrast-text) !important;
+ opacity: 0.7;
+}
+
+[modern=true]:root #main .s_comments_level #s-comment-reply-form {
+ background: var(--accent) !important;
+}
+
+[modern=true]:root #s-comment-reply-form {
+ width: auto !important;
+ border-radius: var(--border-radius) !important;
+ border: none !important;
+}
+
+[modern=true]:root .compose-message.sMessagingProcessed fieldset {
+ padding: 20px !important;
+ border-radius: var(--border-radius) !important;
+}
+
+[modern=true]:root #ids .name-wrapper {
+ background: transparent !important;
+}
+
+[modern=true]:root .s-slider.rubric-grades-edit .rating-wrapper.selected {
+ background-color: var(--active) !important;
+}
+
+[modern=true]:root .discussion-view .action-links-wrapper-junior .action-links-unfold,
+[modern=true]:root .discussion-view .action-links-wrapper-junior .action-links-unfold:hover,
+[modern=true]:root .discussion-view .action-links-wrapper-junior .active.action-links-unfold,
+[modern=true]:root .discussion-view .action-links-wrapper-junior .active.action-links-unfold:hover {
+ background-image: url(https://asset-cdn.schoology.com/sites/all/themes/schoology_theme/images/sprite_discussion.png?5f9c91b5354f0ec1) !important;
+ /* Makes Icon Visble */
+}
+
+[modern=true]:root .s-js-comment-action-links.sActionLinksVisible > .action-links-wrapper.action-links-wrapper-junior.aligned-right > .action-links-unfold {
+ /* Changes Color When Hovered Over */
+ background-color: var(--accent) !important;
+}
+
+[modern=true]:root .splus-button-tile.active {
+ background-color: var(--active) !important;
+}
diff --git a/css/modern/theme-editor.css b/css/modern/theme-editor.css
new file mode 100644
index 00000000..2ac57c80
--- /dev/null
+++ b/css/modern/theme-editor.css
@@ -0,0 +1,202 @@
+variable-intellisense {
+ --modern-primary: #36393F;
+ --modern-accent: #2F3136;
+ --modern-secondary: #202225;
+ --modern-text: #DCDDDE;
+ --modern-contrast-text: #EEEEEE;
+ --modern-muted-text: #72767D;
+ --modern-contrast-border: #DCDDDE;
+ --modern-input: #40444B;
+ --modern-error: #F44336;
+ --modern-highlight: rgba(184, 134, 11, 0.2);
+ --modern-active: rgba(0, 255, 255, 0.1);
+ --modern-grades: #8BC34A;
+ --modern-border-radius: 5px;
+ --modern-border-size: 1px;
+ --modern-padding: 10px;
+ --modern-theme-is-dark: 1;
+ --modern-cal1: #457da5;
+ --modern-cal2: #547c41;
+ --modern-cal3: #926c37;
+ --modern-cal4: #7c3d6b;
+ --modern-cal5: #0b4c9c;
+ --modern-cal6: #00209c;
+ --modern-cal7: #004a09;
+ --modern-cal8: #72721a;
+ --modern-cal9: #44233e;
+ --modern-cal10: #683131;
+ --modern-cal11: #770a0a;
+ --modern-cal12: #a72413;
+ --modern-cal13: #E0024C;
+ --modern-cal14: #188C16;
+ --modern-cal15: #bd7304;
+ --modern-cal16: #80168C;
+ --modern-cal17: #164152;
+ --modern-cal18: #00543f;
+ --modern-cal19: #633e11;
+ --modern-cal20: #461b2d;
+}
+
+[modern=true]:root body {
+ background-color: var(--modern-secondary);
+}
+
+[modern=true]:root * {
+ color: var(--modern-text) !important;
+}
+
+[modern=true]:root .modern-primary {
+ background-color: var(--modern-primary) !important;
+}
+
+[modern=true]:root .modern-secondary {
+ background-color: var(--modern-secondary) !important;
+}
+
+[modern=true]:root .modern-accent {
+ background-color: var(--modern-accent) !important;
+}
+
+[modern=true]:root .modern-input {
+ background-color: var(--modern-input) !important;
+}
+
+[modern=true]:root .modern-highlight {
+ background-color: var(--modern-highlight) !important;
+}
+
+[modern=true]:root .modern-active {
+ background-color: var(--modern-active) !important;
+}
+
+[modern=true]:root .modern-error {
+ background-color: var(--modern-error) !important;
+}
+
+[modern=true]:root .modern-error-text {
+ color: var(--modern-error) !important;
+}
+
+[modern=true]:root .modern-grades {
+ color: var(--modern-grades) !important;
+}
+
+[modern=true]:root .modern-text {
+ color: var(--modern-text) !important;
+}
+
+[modern=true]:root .modern-contrast-text {
+ color: var(--modern-contrast-text) !important;
+}
+
+[modern=true]:root .modern-muted-text {
+ color: var(--modern-muted-text) !important;
+}
+
+[modern=true]:root .modern-border {
+ border: var(--modern-border-size) solid var(--modern-contrast-border) !important;
+}
+
+[modern=true]:root .modern-border-radius {
+ border-radius: var(--modern-border-radius) !important;
+}
+
+[modern=true]:root .modern-padding {
+ padding: var(--modern-padding) !important;
+}
+
+[modern=true]:root .modern-margin {
+ margin: var(--modern-padding) !important;
+}
+
+[modern=true]:root .modern-black {
+ color: black !important;
+}
+
+[modern=true]:root #themes-list-section .collection a.collection-item {
+ background-color: var(--modern-primary);
+}
+
+[modern=true]:root #themes-list-section .collection a.collection-item.active {
+ background-color: var(--modern-active) !important;
+}
+
+[modern=true]:root #themes-list-section .collection a.collection-item:not(.active):hover {
+ background-color: var(--modern-highlight);
+}
+
+[modern=true]:root #theme-editor-section .sp-replacer {
+ border: var(--modern-border-size) solid var(--modern-contrast-border);
+ background-color: var(--modern-input);
+}
+
+[modern=true]:root #preview-section svg,
+[modern=true]:root #preview-section svg * {
+ color: var(--modern-contrast-text) !important;
+}
+
+[modern=true]:root #preview-section #preview-profile-pic {
+ border-color: var(--modern-contrast-text) !important;
+}
+
+[modern=true]:root #preview-section .preview-course {
+ border: var(--modern-border-size) solid transparent;
+}
+
+[modern=true]:root #preview-section .preview-course:hover {
+ border: var(--modern-border-size) solid var(--modern-contrast-border);
+}
+
+[modern=true]:root #preview-section .preview-course .preview-course-class {
+ color: var(--link-color) !important;
+}
+
+[modern=true]:root #preview-section .preview-course .preview-course-section {
+ color: var(--modern-text) !important;
+}
+
+[modern=true]:root #preview-section .preview-course .preview-course-school {
+ color: var(--modern-muted-text) !important;
+}
+
+[modern=true]:root #preview-section #tab-icons #icon-list-table tbody:empty:before {
+ color: var(--modern-muted-text) !important;
+}
+
+[modern=true]:root #preview-section #preview-dropdown-list li:hover {
+ background-color: var(--modern-active) !important;
+}
+
+[modern=true]:root .material-tooltip {
+ background-color: var(--modern-secondary);
+ border: var(--modern-border-size) solid var(--modern-contrast-border);
+ border-radius: var(--modern-border-radius);
+}
+
+[modern=true]:root .rs-bg-color {
+ background-color: var(--modern-input);
+}
+
+[modern=true]:root .full-spectrum {
+ background-color: var(--modern-accent) !important;
+}
+
+[modern=true]:root .full-spectrum button {
+ background-color: var(--modern-secondary) !important;
+ background-image: none;
+ text-shadow: none;
+}
+
+[modern=true]:root input[type=range] {
+ border: var(--modern-border-size) solid var(--modern-contrast-border);
+}
+
+[modern=true]:root .action-button:hover {
+ transition: .3s ease-out !important;
+ color: var(--modern-contrast-text) !important;
+}
+
+[modern=true]:root .action-button:hover i.material-icons {
+ transition: .3s ease-out !important;
+ color: var(--modern-contrast-text) !important;
+}
diff --git a/css/theme-editor.css b/css/theme-editor.css
index 91737e80..f0174891 100644
--- a/css/theme-editor.css
+++ b/css/theme-editor.css
@@ -17,6 +17,10 @@ body {
font-size: 100% !important;
}
+label {
+ color: #444444 !important;
+}
+
@font-face {
font-family: Muli;
font-style: normal;
@@ -83,6 +87,7 @@ body {
#preview {
cursor: var(--cursor);
+ background: rgb(250, 249, 247);
}
#preview-navbar {
@@ -205,7 +210,7 @@ body {
border-top: 5px solid var(--border-color);
position: absolute;
width: 100%;
- height: 150px;
+ /* height: 150px; */
background-color: white;
top: 60px;
left: 0;
@@ -216,12 +221,116 @@ body {
#preview-courses-drop-down h1 {
margin: 0;
+ margin-bottom: 10px;
font-size: 24px;
font-weight: 200;
padding-top: 15px;
padding-left: 15px;
}
+.preview-course {
+ width: 25%;
+ height: 120px;
+ display: inline-block;
+ border: 1px solid gray;
+ margin: 10px;
+ cursor: pointer;
+ position: relative;
+ background-image: url(https://image.flaticon.com/icons/svg/164/164949.svg);
+ background-repeat: no-repeat;
+ background-position: top center;
+ background-size: 50px;
+}
+
+.preview-course:hover {
+ border: 1px solid cornflowerblue;
+}
+
+.preview-course div {
+ position: absolute;
+ bottom: 25px;
+ left: 5px;
+}
+
+.preview-course p {
+ margin: 0;
+ padding: 0;
+ height: 18px;
+}
+
+.preview-course-class {
+ font-weight: bold;
+ color: var(--link-color);
+}
+
+.preview-course-section {
+ font-weight: bold;
+}
+
+.preview-course-school {
+ color: gray;
+}
+
+#preview-page > div:first-child {
+ height: 450px;
+}
+
+#preview-page > div {
+ height: 180px;
+}
+
+#preview-page div.larger {
+ height: 260px;
+}
+
+#preview-page > div > div {
+ height: 100%;
+ width: 100%;
+ background-color: white;
+ margin: 10px;
+ box-shadow: 0 1px 3px 0 rgb(0 0 0 / 15%);
+}
+
+#preview-page p {
+ margin-left: 10px;
+ padding-top: 10px;
+}
+
+#preview-dropdown-list {
+ position: relative;
+}
+
+#preview-dropdown-list div {
+ margin: 0 10px;
+ padding: 5px;
+ border: 1px solid black;
+ background: white;
+}
+
+#preview-dropdown-list ul {
+ position: absolute;
+ top: 100%;
+ left: 0;
+ width: 100%;
+ visibility: hidden;
+ margin: 0 0 0 10px;
+ border: 1px solid black;
+ background: white;
+}
+
+#preview-dropdown-list:focus-within ul {
+ visibility: visible;
+}
+
+#preview-dropdown-list li {
+ padding-left: 5px;
+}
+
+#preview-dropdown-list li:hover {
+ background-color: var(--primary-color);
+ color: white;
+}
+
h2.center {
font-size: 20px;
font-weight: 200;
@@ -237,10 +346,7 @@ h2.center {
background-color: var(--primary-color);
}
-#create-button,
-#import-button,
-#new-icon,
-#new-button {
+#new-icon {
background-color: var(--primary-color);
}
@@ -257,6 +363,7 @@ h2.center {
#discard-button:hover,
#create-button:hover,
+#import-button:hover,
#new-icon:hover,
#new-button:hover,
.delete-button {
@@ -282,6 +389,10 @@ h2.center {
color: var(--primary-color);
}
+#theme-editor-section {
+ margin-bottom: 50px;
+}
+
#preview-section .action-button {
visibility: hidden;
}
@@ -543,6 +654,15 @@ input[type=button] {
pointer-events: none;
}
+.theme-item span.tooltipped {
+ max-width: calc(100% - 160px);
+ overflow: hidden;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ display: inline-block;
+ vertical-align: middle;
+}
+
.theme-item .material-icons {
cursor: pointer;
}
@@ -651,8 +771,12 @@ textarea#json-output[readonly] {
background-color: lightcyan !important;
}
-.setting-link {
- color: var(--link-color);
+.setting-link h3.setting-title {
+ color: var(--link-color) !important;
+}
+
+a[href].link-color {
+ color: var(--link-color) !important
}
.show-lausd {
@@ -661,4 +785,8 @@ textarea#json-output[readonly] {
.hide-lausd {
display: var(--lausd-hidden);
+}
+
+#modern-wrapper .row .input-field.col.s12.m6 {
+ padding-top: 5px;
}
\ No newline at end of file
diff --git a/js/all.js b/js/all.js
index 8838783a..4e050cbd 100644
--- a/js/all.js
+++ b/js/all.js
@@ -1,3 +1,5 @@
+while (!window.splusPreload) { }
+
// Inform user about theme
{
if (localStorage["splus-temp-generatedtheme"]) {
@@ -41,101 +43,64 @@
createElement("input", [], { type: "checkbox", checked: checked, onchange: onchange })
]);
}
-
- // Dark Theme Beta
- if (betaCode == "darktheme") {
- let newThemeSheet = createElement("link", [], { rel: "stylesheet", href: chrome.runtime.getURL("/css/modern.css") });
- document.head.append(newThemeSheet);
- document.documentElement.setAttribute("test-mode", "crazy");
-
- var darkThemeTheme = Theme.loadFromObject({
- "color":
- {
- "custom":
- {
- "background": "#36393f",
- "border": "#40444b",
- "hover": "#6fa8dc",
- "primary": "#202225"
- }
- }, "logo":
- {
- "preset": "schoology_plus"
- },
- "name": "Dark Theme Test",
- "version": 2
- });
-
- Theme.apply(darkThemeTheme);
-
- betaSection.append(
- createBetaToggleCheckbox("Enable new theme engine", event => newThemeSheet.disabled = !event.target.checked, true),
- createBetaToggleCheckbox("Enable dark theme", event => {
- document.documentElement.setAttribute("dark", event.target.checked);
- Theme.apply(event.target.checked ? darkThemeTheme : Theme.byName(Setting.getValue("theme")));
- }, true),
- createBetaToggleCheckbox("Enable color test", event => document.documentElement.setAttribute("test", event.target.checked)),
- createBetaToggleCheckbox("Crazy mode", event => document.documentElement.setAttribute("test-mode", event.target.checked ? "crazy" : "standard"), true, 2)
- );
- }
}
// Check Schoology domain
-{
+setTimeout(function () {
const BLACKLISTED_DOMAINS = ["asset-cdn.schoology.com", "developer.schoology.com", "support.schoology.com", "info.schoology.com", "files-cdn.schoology.com", "status.schoology.com", "ui.schoology.com", "www.schoology.com", "api.schoology.com", "developers.schoology.com", "schoology.com", "support.schoology.com", "error-page.schoology.com", "app-msft-teams.schoology.com"];
let dd = Setting.getValue("defaultDomain");
- if (dd !== window.location.host && !BLACKLISTED_DOMAINS.includes(window.location.host) && !window.location.host.match(/.*[-\.]app\.schoology\.com/)) {
- Setting.setValue("defaultDomain", window.location.host);
-
- let bgColor = document.querySelector("#header header").style.backgroundColor;
-
- if (bgColor) {
- let t = {
- "name": `Auto Generated Theme for ${window.location.host}`,
- "version": 2,
- "color": {
- "custom": {
- "primary": bgColor,
- "hover": "rgb(2, 79, 125)",
- "background": "rgb(2, 79, 125)",
- "border": "rgb(2, 79, 125)"
+ if (dd !== window.location.hostname && !BLACKLISTED_DOMAINS.includes(window.location.hostname) && !window.location.hostname.match(/.*[-\.]app\.schoology\.com/)) {
+ Setting.setValue("defaultDomain", window.location.hostname, function () {
+ let bgColor = document.querySelector("#header header").style.backgroundColor;
+
+ if (bgColor && !["app.schoology.com", "lms.lausd.net"].includes(window.location.hostname)) {
+ let t = {
+ "name": `Auto Generated Theme for ${window.location.hostname}`,
+ "version": 2,
+ "color": {
+ "custom": {
+ "primary": bgColor,
+ "hover": "rgb(2, 79, 125)",
+ "background": "rgb(2, 79, 125)",
+ "border": "rgb(2, 79, 125)"
+ }
+ },
+ "logo": {
+ "preset": "default"
}
- },
- "logo": {
- "preset": "default"
- }
- };
+ };
- localStorage["splus-temp-generatedtheme"] = true;
+ localStorage["splus-temp-generatedtheme"] = true;
- chrome.storage.sync.get({ themes: [] }, s => {
- let themes = s.themes.filter(x => x.name !== `Auto Generated Theme for ${window.location.host}`);
- themes.push(t);
- chrome.storage.sync.set({ themes: themes }, () => {
- Logger.log(`Schoology Plus has updated the domain on which it runs.\nPrevious: ${dd}\nNew: ${window.location.host}`);
- location.reload();
+ chrome.storage.sync.get({ themes: [] }, s => {
+ let themes = s.themes.filter(x => x.name !== `Auto Generated Theme for ${window.location.hostname}`);
+ themes.push(t);
+ chrome.storage.sync.set({ themes: themes }, () => {
+ Logger.log(`Schoology Plus has updated the domain on which it runs.\nPrevious: ${dd}\nNew: ${window.location.hostname}`);
+ location.reload();
+ });
});
- });
- } else {
- Logger.log(`Schoology Plus has updated the domain on which it runs.\nPrevious: ${dd}\nNew: ${window.location.host}`);
- location.reload();
- }
+ } else {
+ Logger.log(`Schoology Plus has updated the domain on which it runs.\nPrevious: ${dd}\nNew: ${window.location.hostname}`);
+ location.reload();
+ }
+ });
}
-}
+}, 2000);
// Page Modifications
document.head.appendChild(createElement("meta", [], { name: "viewport", content: "width=device-width, initial-scale=1" }));
let bottom = document.querySelector("span.Footer-copyright-2Vt6I");
bottom.appendChild(createElement("span", ["footer-divider"], { textContent: "|" }, [
- createElement("span", ["footer-text-enhanced-by"], { textContent: "Enhanced by Schoology Plus" }),
+ createElement("span", ["footer-text-enhanced-by"], { style: { cursor: "pointer" }, onclick: () => window.open("https://schoologypl.us/?utm_source=ext-enhanced-by-footer", "_blank"), textContent: "Enhanced by Schoology Plus" }),
]));
document.documentElement.style.setProperty("--default-visibility", "visible");
-let verboseModalFooterText = `© Aaron Opell, Glen Husman 2017-2020 | Schoology Plus v${chrome.runtime.getManifest().version_name || chrome.runtime.getManifest().version}${getBrowser() != "Chrome" || chrome.runtime.getManifest().update_url ? '' : ' dev'} | Discord Server | GitHub | Contributors | Privacy Policy | Changelog`;
-let modalFooterText = "Schoology Plus © Aaron Opell, Glen Husman 2017-2020";
+let verboseModalFooterText = `© Aaron Opell, Glen Husman 2017-2021 | Schoology Plus v${chrome.runtime.getManifest().version_name || chrome.runtime.getManifest().version}${getBrowser() != "Chrome" || chrome.runtime.getManifest().update_url ? '' : ' dev'} | Discord Server | GitHub | Contributors | Privacy Policy | Changelog`;
+let modalFooterText = "Schoology Plus © Aaron Opell, Glen Husman 2017-2021";
let frame = document.createElement("iframe");
frame.src = `https://schoologypl.us/changelog?version=${chrome.runtime.getManifest().version}`;
@@ -282,11 +247,13 @@ let modals = [
]),
createElement("div", ["setting-entry"], {}, [
createElement("h3", ["setting-title"], {}, [
+ createElement("a", [], { href: "https://github.com/xd-arsenic", textContent: "Alexander (@xd-arsenic)" }),
+ createElement("span", [], { textContent: ", " }),
createElement("a", [], { href: "https://github.com/Roguim", textContent: "@Roguim" }),
createElement("span", [], { textContent: ", " }),
createElement("a", [], { href: "https://github.com/reteps", textContent: "Peter Stenger (@reteps)" }),
createElement("span", [], { textContent: ", and " }),
- createElement("a", [], { href: "https://github.com/xd-arsenic", textContent: "Alexander (@xd-arsenic)" })
+ createElement("a", [], { href: "https://github.com/KTibow", textContent: "@KTibow" }),
]),
createElement("p", ["setting-description"], { textContent: "Various code contributions" })
]),
@@ -348,6 +315,62 @@ let modals = [
]),
modalFooterText
),
+ new Modal(
+ "choose-theme-modal",
+ "Schoology Plus Themes",
+ createElement("div", ["splus-modal-contents"], {}, [
+ createElement("h2", ["setting-entry"], { textContent: "Choose a New Theme!" }),
+ createElement("p", ["setting-description"], { textContent: "Schoology Plus has a bunch of new themes! Choose one from below, make your own, or keep your current theme. It's your choice! Click on each theme for a preview and then click the button to confirm your choice. You can change your theme at any time in Schoology Plus Settings.", style: { fontSize: "14px", paddingBottom: "10px" } }),
+ createElement("div", ["splus-button-tile-container"], {}, [
+ { text: "Modern Dark Theme", theme: "Schoology Plus Modern Dark", new: true },
+ { text: "Modern Light Theme", theme: "Schoology Plus Modern Light", new: true },
+ { text: "Modern Rainbow Theme", theme: "Rainbow Modern", new: true },
+ { text: "Schoology Plus Classic Theme", theme: "Schoology Plus", active: Theme.active.name === "Schoology Plus" },
+ { text: `Keep Current Theme: ${Theme.active.name}`, theme: Theme.active.name, active: Theme.active.name !== "Schoology Plus", hidden: Theme.active.name === "Schoology Plus" },
+ { text: "See More Themes or Make Your Own", theme: Theme.active.name, extraWide: Theme.active.name === "Schoology Plus" },
+ ].map(
+ obj => {
+ return createElement("div", [...["splus-button-tile", "select-theme-tile"], ...(obj.active ? ["active"] : [])],
+ {
+ style: { display: obj.hidden ? "none" : "flex", gridColumnEnd: obj.extraWide ? "span 2" : "unset" },
+ dataset: { new: obj.new },
+ onclick: e => {
+ for (let child of e.target.parentElement.children) {
+ child.classList.remove("active");
+ }
+ e.target.classList.add("active");
+
+ trackEvent("selected tile", obj.text, "Choose Theme Popup");
+
+ tempTheme = obj.theme;
+ Theme.apply(Theme.byName(obj.theme));
+
+ document.getElementById("theme-popup-select-button").value = `Select ${obj.text}`;
+ }
+ },
+ [
+ createElement("span", ["splus-button-tile-content"], { textContent: obj.text })
+ ]
+ )
+ }
+ )),
+ (() => {
+ let btn = createButton("theme-popup-select-button", `Select Keep Current Theme: ${Theme.active.name}`, e => {
+ localStorage.setItem("splus-temp-theme-chosen", true);
+ trackEvent("confirmed selection", document.querySelector(".select-theme-tile.active .splus-button-tile-content").textContent, "Choose Theme Popup");
+ modalClose(document.getElementById("choose-theme-modal"));
+ Setting.setValue("theme", tempTheme);
+ if (document.getElementById("choose-theme-modal").querySelector(".splus-button-tile-container .splus-button-tile:last-child").classList.contains("active")) {
+ location.href = chrome.runtime.getURL("/theme-editor.html");
+ }
+ });
+ btn.style.float = "right";
+ btn.style.margin = "20px 20px 0";
+ return btn;
+ })()
+ ]),
+ modalFooterText
+ )
];
(() => {
@@ -356,6 +379,11 @@ let modals = [
if (!newVersion || newVersion != chrome.runtime.getManifest().version) {
let currentVersion = chrome.runtime.getManifest().version;
+ if (Setting.getValue("defaultDomain") != window.location.hostname) {
+ Logger.log("[Updater] Domain isn't set as default, skipping migrations until domain is updated.");
+ return;
+ }
+
iziToast.show({
theme: 'dark',
iconUrl: chrome.runtime.getURL("/imgs/plus-icon.png"),
@@ -447,10 +475,54 @@ document.querySelector("#header > header > nav > ul:nth-child(2)").prepend(creat
createElement(
"button",
["_1SIMq", "_2kpZl", "_3OAXJ", "_13cCs", "_3_bfp", "_2M5aC", "_24avl", "_3v0y7", "_2s0LQ", "_3ghFm", "_3LeCL", "_31GLY", "_9GDcm", "_1D8fw", "util-height-six-3PHnk", "util-line-height-six-3lFgd", "util-text-decoration-none-1n0lI", "Header-header-button-active-state-3AvBm", "Header-header-button-1EE8Y", "sExtlink-processed"],
- { onclick: () => openModal("settings-modal") },
+ {
+ id: "splus-settings-navbar-button",
+ title: "Schoology Plus Settings\n\nChange settings relating to Schoology Plus.",
+ onclick: () => {
+ openModal("settings-modal");
+ trackEvent("splus-settings", "open", "Navbar Button");
+ }
+ },
[
createSvgLogo("_3ESp2", "dlCBz", "_1I3mg", "fjQuT", "uQOmx")
]
+ ),
+ createElement(
+ "button",
+ ["_1SIMq", "_2kpZl", "_3OAXJ", "_13cCs", "_3_bfp", "_2M5aC", "_24avl", "_3v0y7", "_2s0LQ", "_3ghFm", "_3LeCL", "_31GLY", "_9GDcm", "_1D8fw", "util-height-six-3PHnk", "util-line-height-six-3lFgd", "util-text-decoration-none-1n0lI", "Header-header-button-active-state-3AvBm", "Header-header-button-1EE8Y", "sExtlink-processed", "splus-track-clicks"],
+ {
+ id: "darktheme-toggle-navbar-button",
+ title: "Toggle Theme\n\nUse this button to temporarily disable your Schoology Plus theme if something isn't displaying correctly.",
+ onclick: e => {
+ let newVal = document.documentElement.getAttribute("modern") == "false" ? "true" : "false";
+ document.documentElement.setAttribute("modern", newVal);
+ trackEvent("modern-theme-toggle", newVal, "Navbar Button");
+ },
+ dataset: { popup: Setting.getNestedValue("popup", "modernThemeToggle", true) }
+ },
+ [
+ createElement("div", ["explanation-popup"], {}, [
+ createElement("span", [], { title: "", textContent: "Use this button to temporarily disable your Schoology Plus theme if something isn't displaying correctly." }),
+ createElement("h3", [], {
+ textContent: "OK",
+ onclick: e => {
+ e.stopPropagation();
+ trackEvent("modern-theme-toggle", "ok", "Explanation Popup");
+ Setting.setNestedValue("popup", "modernThemeToggle", false);
+ document.getElementById("darktheme-toggle-navbar-button").dataset.popup = false;
+ }
+ })
+ ]),
+ (function () {
+ let paintSvg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+ paintSvg.setAttribute("viewBox", "-12 -20 500 500");
+ paintSvg.setAttribute("class", "_3ESp2 dlCBz _1I3mg fjQuT uQOmx");
+
+ paintSvg.innerHTML = '