☰

learn.vccs.edu

A new userstyle

/* ==UserStyle==
@name           learn.vccs.edu
@version        1
@description    A new userstyle
@author         rssaromeo
@license        GPLv3
@namespace https://greasyfork.org/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;
}
}