/* ==UserStyle==
@name learn.vccs.edu
@version 1
@description A new userstyle
@author rssaromeo
@license GPLv3
@namespace https://gf.qytechs.cn/users/1184528
==/UserStyle== */
@-moz-document domain("learn.vccs.edu"), domain("canvadocs.instructure.com"), regexp("https?://learn.vccs.edu/conversations.*") {
/*
@regex \.css-[^-]+([^^ ,{.]+)(?=[ ,{.])
@replace [class$="$1"]
@endregex
*/
:root {
--border: #101014;
--bg-dark: #16161e;
--bg-dark-2: #212433;
--bg: #1a1b26;
--bg-2: #282b3c;
--bg-3: #3f4256;
--bg-4: #444b6a;
--highlight-1: #1e202e;
--highlight-2: #2e3448;
--blue-accent: #89ddff;
--blue-dim: #5c88e6;
--text: #c0caf5;
--text-dim: #565f89;
--ic-link-color: #7aa2f7;
--blue: #7aa2f7;
--notification: #e66135;
--red: #f7768e;
--green: #9ece6a;
--ic-brand-global-nav-bgd: var(--bg-dark);
--ic-brand-primary: var(--blue);
/* --bg-dark: #1a1b26; */
/* --bg-lighter: #16161e; */
/* --bg-darkest: #000; */
--fg-dark: #c0caf5;
--fg-light: #cfd5f3;
--trans: #0000;
--secondary-light: #6da2e9;
--secondary-dark: #4a92f7;
--change-purple: #7300ff;
--change-white: #fff;
--custom-thumb-color: var(--fg-dark);
--custom-track-color: var(--bg-dark-2);
--webkit-scrollbar-width-height: 10px;
--webkit-scrollbar-border-radius: 50px;
--custom-track-color-hover: color-mix( in srgb,
var(--fg-dark) 10%,
#000 100%);
}
div,
li,
ul,
h1,
h2,
h3,
h4,
h5,
h6,
h7 {
color: var(--fg-dark) !important;
}
input,
span:has(>input):before {
border: 1px solid var(--fg-dark) !important;
}
[class*="transition--fade-"] > *,
[class*="transition--fade-"] > * > *,
[class*="transition--fade-"] > * > * > *,
[class*="transition--fade-"] > * > * > * > *,
[class*="transition--fade-"] > * > * > * > * > * {
background-color: var(--bg-dark) !important;
}
#section-tabs-header-subtitle {
display: none !important;
}
[class$="-textInput__facade"],
[class$="-textInput__facade"]:focus,
.address-book-menu-item-subMenuCourse-subMenu,
[class$="-textInput__beforeElement"],
[class$="-textInput__layout"],
[class$="-textInput__layout"]::before,
[id^="Selectable_"][id$="-list"],
li[class*="optionItem"],
*[id^="Selectable"],
[class$="-view--block"],
*[id^="address-book-menu"],
[class$="-view"],
span:has(> [class$="-view"]) {
background-color: var(--bg-dark) !important;
/* border-color: var(--bg-dark-2) !important; */
border: none !important;
}
span > [class$="-textInput__facade"] > input {
border-color: var(--bg-dark) !important;
}
[class$="-view-row"] > [class$="-colHeader"],
[class$="view-cell"] {
border-radius: 0 !important;
}
[class$="-view"] {
background-color: var(--trans) !important;
}
[class$="-view-flexItem"] > div > span > div > div > span {
background-color: var(--bg-dark) !important;
border-radius: 15px;
padding: 10px !important;
width: 40% !important;
}
[id^="Select_"] {
color: var(--fg-dark) !important;
}
/* [class$="-view--block"] {
background-color: var(--bg-darkest) !important;
border: 1px solid var(--bg-light) !important;
} */
[class$="-mask"],
.transition--fade-entered,
.transition--fade-transitioning,
.transition--fade-entering {
background-color: var(--trans) !important;
}
[class$="textInput__facade"]::before {
background-color: var(--trans) !important;
}
[class$="-view--block"]:has(> .discussions-editor) {
background-color: var(--trans) !important;
}
[class$="-view--block"][data-testid="pill-container"] {
background-color: var(--trans) !important;
}
[class$="-view--block"] {
background-color: var(--trans) !important;
border: none !important;
}
.tox-tbtn.tox-split-button__chevron {
background-color: var(--trans) !important;
}
/* .tox-swatches,
.tox-swatches__row {
background-color: var(--bg-darkest) !important;
} */
.tox-dialog-wrap,
.tox-dialog-wrap__backdrop {
background-color: var(--trans) 004a !important;
}
.tox-dialog__header,
.tox-dialog__body,
.tox-dialog__footer,
.tox-dialog,
.tox-tbtn,
.tox-icon,
.tox-tbtn__icon-wrap,
.tox-tbtn,
.tox-split-button__chevron,
.tox-edit-area,
.tox-sidebar-wrap,
iframe,
.tox-menu-nav__js .tox-collection__item,
.tox-collection__group {
background-color: var(--bg-dark) !important;
border-color: var(--fg-dark) !important;
}
div:has(> .tox-tbtn) {
background-color: var(--bg-dark) !important;
}
iframe[src^="/api/v1/canvadoc_session"] {
overflow: hidden !important;
box-sizing: border-box !important;
border: 1px solid var(--fg-dark) !important;
background-color: var(--bg-dark) !important;
}
atomic-search-desktop-widget,
#ajas-search-widget {
display: none !important;
width: 0 !important;
height: 0 !important;
background-color: var(--trans) !important;
color: var(--trans) !important;
}
.closed-for-comments-discussions-v2__wrapper,
.discussions-v2__container-image,
.unpinned-discussions-v2__wrapper,
.ic-item-row.ic-discussion-row {
background-color: var(--bg-dark) !important;
border-color: var(--fg-dark) !important;
}
.ic-unread-badge__count.ic-unread-badge__total-count {
background-color: var(--secondary-light) !important;
}
.ic-unread-badge__count.ic-unread-badge__unread-count {
background-color: var(--secondary-dark) !important;
}
div[data-testid="DiscussionEdit-container"] > * > * > * > [class$="-view--flex-flex"] {
background-color: var(--bg-dark-2) !important;
}
.cm-gutter.cm-lineNumbers,
[class$="-label"] > * > * > * > * {
background-color: var(--bg-dark-2) !important;
border-color: var(--trans) !important;
color: var(--fg-dark) !important;
}
[class$="-codeEditorContainer"] > * > * > div.cm-content.cm-lineWrapping {
background-color: var(--bg-dark) !important;
}
.cm-layer.cm-layer-above.cm-cursorLayer,
.cm-cursor.cm-cursor-primary {
border-left-color: var(--change-purple) !important;
color: var(--change-white) !important;
}
[class$="-view-flexItem"][title="Editor Status Bar"] > div {
border-color: var(--trans) !important;
}
[id^="message-body-"][id$="_statusbar"],
[data-testid="DiscussionEdit-container"] > * > * > * > [class$="-view"] {
background-color: var(--bg-dark) !important;
border: 1px solid var(--fg-dark) !important;
border-radius: 0 !important;
}
[data-testid="DiscussionEdit-container"] > * > * > * > [class$="-view"] {
border-bottom: none !important;
}
[class$="-view-billboard"] {
background-color: var(--bg-dark) !important;
}
.cm-editor,
[class$="-codeEditorContainer"] {
border-color: var(--trans) !important;
}
img[src="https://du11hjcvx0uqb.cloudfront.net/dist/webpack-production/775230e7b86a756c.svg"] {
content: url("");
}
img[src="https://du11hjcvx0uqb.cloudfront.net/dist/webpack-production/3fdd834ad1e40326.svg"] {
content: url("");
}
img[src="https://instructure-uploads.s3.amazonaws.com/account_130960000000000001/attachments/12/vccs-logo-360x140.png"] {
content: url("");
}
circle[class$="-spinner__circleTrack"],
circle.InstUISpinner-circleTrack {
stroke: var(--trans) !important;
}
circle[class$="-spinner__circleSpin"],
circle.InstUISpinner-circleSpin {
stroke: var(--fg-dark) !important;
}
span.ui-menu-carat,
span.ui-menu-carat > span {
color: var(--trans) !important;
border-color: var(--trans) !important;
}
iframe[src="https://www.nr.edu/canvas/canvas-home.php"],
p > iframe[src="https://www.nr.edu/canvas/canvas-home.php"],
.show-content.user_content.clearfix.enhanced > p > iframe[src="https://www.nr.edu/canvas/canvas-home.php"] {
display: none !important;
height: 0 !important;
}
[role="dialog"][aria-label="Upload Media"][class$="-modal"] {
border-color: var(--fg-dark) !important;
background-color: var(--fg-dark) !important;
}
[role="dialog"][aria-label="Upload Media"][class$="-modal"] > * {
background-color: var(--bg-dark-2) !important;
border-radius: 0 !important;
border-color: var(--fg-dark) !important;
}
[class$="-view-panel__content"] {
overflow: hidden !important;
}
[class$="-view-tabs__tabList"],
[class$="-view-panel__content"] {
border: 1px solid var(--fg-dark) !important;
}
[class$="-view-tabs__tabList"],
[class$="-view-panel__content"],
.css-1ktha4a-view-panel__content.transition--fade-entered {
background-color: var(--bg-dark) !important;
}
[id^="tab-"] {
color: var(--fg-dark) !important;
}
/*[class$="-view-flexItem"] {
background-color: var(--bg-dark) !important;
}*/
textarea[placeholder="Submit a Comment"] {
border: 1px solid var(--fg-dark) !important;
}
[class$="-view-flexItem"] > * > * > * > [class$="-view--inlineBlock"],
#mediaCommentButton,
#attachmentFileButton {
border: 1px solid var(--fg-dark) !important;
padding: 4px;
}
#comments-tray {
border: 1px solid var(--fg-dark) !important;
}
#comments-tray > * > [class$="-view-flexItem"] {
border-bottom: 1px solid var(--fg-dark) !important;
}
#assignments-not-weighted > div:nth-child(1) > h2 {
border-bottom-color: var(--fg-dark) !important;
}
*:has(* > [class$="-menu"][role="menu"]) {
border-color: var(--fg-dark) !important;
}
[class$="contextView__arrow"] {
display: none !important;
}
[class$="-view--block"] {
background-color: var(--bg-dark) !important;
}
.ui-state-hover {
background-color: var(--fg-dark) !important;
}
button[role="menuitem"]:hover,
button[role="menuitem"]:hover > * {
background-color: var(--bg-dark) !important;
color: var(--fg-dark) !important;
}
.question_input,
[class$="textInput__layout"],
[id^="opt-"] {
box-sizing: border-box !important;
border: 1px solid var(--fg-dark) !important;
}
[id^="opt-"] {
border-radius: 5px;
}
[id^="assignment_comment_"] {
background-color: var(--bg-dark) !important;
border-color: var(--bg-dark) !important;
}
.nav-badge {
background-color: var(--bg-dark) !important;
color: var(--fg-dark) !important;
}
.ic-flash-success.flash-message-container {
background-color: var(--bg-dark) !important;
}
.ic-flash-success.flash-message-container > .Button.Button--icon-action.close_link {
background-color: var(--trans) !important;
}
[class$="-pill"] {
background-color: var(--bg-dark) !important;
border-color: var(--fg-dark) !important;
}
span.menu-item__badge:not(:has(*)) {
display: none !important;
}
span.menu-item__badge:has(*),
span.menu-item__badge > span,
span.menu-item__badge > * > span {
background-color: var(--bg-dark) !important;
}
span.menu-item__badge:has(*) {
border: 1px solid var(--fg-dark) !important;
}
code {
background-color: var(--bg-dark) !important;
border: 1px solid var(--fg-dark) !important;
color: var(--secondary-light) !important;
}
*:not(select) {
scrollbar-color: var(--custom-thumb-color) var(--custom-track-color) !important;
scrollbar-width: var(--custom-width) !important;
}
/* Chrome and derivatives*/
::-webkit-scrollbar {
max-width: var(--webkit-scrollbar-width-height) !important;
max-height: var(--webkit-scrollbar-width-height) !important;
background: var(--custom-track-color) !important;
}
::-webkit-scrollbar-corner,
::-webkit-scrollbar-track,
::-webkit-scrollbar-track-piece {
background: var(--custom-track-color) !important;
}
::-webkit-scrollbar-thumb {
background: var(--custom-thumb-color) !important;
border-radius: var(--webkit-scrollbar-border-radius) !important;
}
::-webkit-scrollbar-corner:hover,
::-webkit-scrollbar-track:hover,
::-webkit-scrollbar-track-piece:hover {
background: var(--custom-track-color-hover) !important;
}
::-webkit-scrollbar-thumb:hover {
background: var(--custom-thumb-color-hover) !important;
}
/* GitHub https://github.com/StylishThemes/GitHub-Dark/issues/870 */
*::-webkit-scrollbar {
max-width: var(--webkit-scrollbar-width-height) !important;
width: var(--webkit-scrollbar-width-height) !important;
}
*::-webkit-scrollbar-thumb {
background: var(--custom-thumb-color) !important;
border: 0 !important;
border-radius: var(--webkit-scrollbar-border-radius) !important;
box-shadow: none !important;
}
*::-webkit-scrollbar-track-piece {
background: var(--custom-track-color) !important;
}
/* Hide the scrollbars that the overlay scrollbars style adds */
[style*="overflow-y:auto"] {
scrollbar-width: none !important;
}
[style*="overflow-y:auto"]::-webkit-scrollbar {
display: none !important;
}
body:not(.full-width):not(.outcomes) .ic-Layout-wrapper {
max-width: none;
}
#ui-id-1.ui-dialog-title {
background-color: var(--bg-dark-3) !important;
}
#planner_note_context {
border-color: var(--fg-dark) !important;
}
[class$="checkbox__control"] > span > span:has( + span),
[class$="checkboxFacade__facade"]:before {
/* display: none !important; */
background-color: var(--bg-dark) !important;
border: 1px solid var(--fg-dark) !important;
}
svg[name="IconCheckMark"],
svg[name="IconCheckMark"] > *,
svg[name="IconCheckMark"] > * > *,
svg[name="IconCheckMark"] > * > * > * {
fill: red !important;
}
.tool_launch{
height:1500px !important;
}
}
@-moz-document url-prefix("https://canvadocs.instructure.com"), url-prefix("http://canvadocs.instructure.com") {
/*
@regex \.css-[^-]+([^^ ,{.]+)(?=[ ,{.])
@replace [class$="$1"]
@endregex
*/
html,
head,
body,
.App,
.ViewerControls,
.ViewerControls--with-annotations,
.Pages,
.Pages-annotatable,
.SecondaryControls {
background-color: var(--trans) !important;
border-color: var(--trans) !important;
}
.ColorButton {
background-color: var(--bg-dark-2) !important;
border-color: var(--trans) !important;
}
.AnnotationControlButton.selected,
.AnnotationControls {
background-color: var(--bg-dark-2) !important;
border-color: var(--fg-dark) !important;
}
.download-button--button > svg > g > g,
path,
polygon {
fill: var(--fg-dark) !important;
}
#App > nav > div > nav.DocumentControls > div:nth-child(1) > span,
.AnnotationControlButton-inner,
.AnnotationControlButton-outer {
color: var(--fg-dark) !important;
background-color: var(--bg-dark-2) !important;
border-color: var(--fg-dark) !important;
}
circle[class$="-spinner__circleTrack"],
circle.InstUISpinner-circleTrack {
stroke: var(--trans) !important;
}
circle[class$="-spinner__circleSpin"],
circle.InstUISpinner-circleSpin {
stroke: var(--fg-dark) !important;
}
.ui-state-hover {
background-color: var(--fg-dark) !important;
}
[class="TextLayer-container"]{
background-color: #0007 !important;
}
}
@-moz-document regexp("https?://learn.vccs.edu/calendar.*") {
/*
@regex \.css-[^-]+([^^ ,{.]+)(?=[ ,{.])
@replace [class$="$1"]
@endregex
*/
table:has(> .fc-head),
#calendar-list-holder,
#other-calendars-list-holder,
#undated-events,
.fc-body,
.fc-head,
.fc.fc-unthemed.fc-ltr,
.context_list_context.hover-container.checked,
.calendars-context-list,
.event-details-header,
.details_title,
#event-details-trap-focus,
[id^="popover-"],
#edit_calendar_event_form_holder,
.edit_calendar_event_option,
#edit_planner_note_form_holder {
background-color: var(--bg-dark) !important;
border-color: var(--fg-dark) !important;
}
/*.ui-state-active {
background-color: var(--fg-dark) !important;
}*/
#edit_event_tabs > ul {
background-color: var(--bg-dark-2) !important;
}
#edit_event_tabs > ul > li > a {
background-color: var(--bg-dark-3) !important;
}
#edit_event_tabs > ul > li:hover {
background-color: var(--bg-dark-3) !important;
}
#edit_event_tabs > ul > li.ui-state-hover:not(.ui-state-active) {
background-color: var(--bg-dark-2) !important;
border-color: var(--fg-dark)
}
#edit_event_tabs > ul > li.ui-state-active {
background-color: var(--bg-dark) !important;
border-color: var(--fg-dark)
}
/*.ui-state-default {
background-color: var(--bg-dark) !important;
}*/
/** {
border-color: var(--fg-dark);
}*/
.popover_close.x-close-link.close {
text-decoration-color: var(--fg-dark) !important;
text-shadow: var(--fg-dark) !important;
color: var(--fg-dark) !important;
}
.event-details-content {
border-color: var(--fg-dark) !important;
}
a {
color: var(--fg-light) !important;
}
select {
background-color: var(--bg-dark) !important;
border-color: var(--bg-dark-2) !important;
color: var(--fg-dark) !important;
}
.ui-datepicker-header,
.edit_planner_note_option,
.ui-tabs-anchor {
background-color: var(--bg-dark-2) !important;
color: var(--fg-dark) !important;
border-color: var(--bg-dark-2) !important;
}
.tab_list.ui-tabs-nav {
background-color: var(--bg-dark-2) !important;
}
}
@-moz-document regexp("https?://learn.vccs.edu/courses/\\d{6}/?([?#].*)?$") {
/*
@regex \.css-[^-]+([^^ ,{.]+)(?=[ ,{.])
@replace [class$="$1"]
@endregex
*/
iframe {
/*display: none !important;*/
}
}
@-moz-document regexp("https?://learn\\.vccs\\.edu/courses/\\d+/external_tools/retrieve.*"), regexp("https?://.*\\.quiz-lti-iad-prod\\.instructure.com/taking/\\d+/take/?$") {
* {
background-color: #000 !important;
color: #1a1b26 !important;
}
}
@-moz-document regexp(".*://learn.vccs.edu/courses/.*/grades.*") {
#grades_summary > thead > tr > th[scope="col"]:last-child,
#grades_summary > tbody > tr > td:last-child {
display: none !important;
}
}