CSS modifications for modifying the FreeCodeCamp UI to my preferences.

less-shitty-fcc.css

/* ensure odd lines in tables aren't white on white */
.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #777777;
}

/* pare the modal down to just the submit button to proceed to next lesson */
.modal-backdrop {
    display: none;
}
.modal-footer {
    border-top: none;
}
.modal-lg {
    margin-top: 25vh;
    width: 410px;
}
.completion-modal-body {
    height: 0;
    display: -ms-flexbox;
    display: none;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
}
.fcc-modal {
    background-color: #333333;
    color: #fff;
}
.modal-header {
    display: none;
}

/* remove the billion scrollbars - on Chrome */
.reflex-element::-webkit-scrollbar {
    width: 0 !important;
}

/* remove the search bar from the header */
.ais-SearchBox-form {
    display: none;
}

/* modify color scheme and font sizes for content other than the editor */
.reflex-layout {
        background-color: #333333;
}
.challenge-preview,
.challenge-preview-frame {
    height: calc(100vh - 75px);
    width: 100%;
    padding: 0;
    margin: 0;
    background-color: #ffffff;
}

.instructions-panel {
    background-color: #333333;
    color: #ffffff;
    font-size: 16px;
    text-align: left;
    height: 100%;
}
.instructions-panel p a {
    color: #ffffff;
}
.instructions-panel .app-wrapper {
    background-color: #333333;
    color: #ffffff;
}
.app-wrapper {
    font-size: 16px;
    text-align: left
}
.map-ui ul,
.map-ui ul li,
.map-ui ul li a,
.map-ui h4,
.map-ui h5 {
    color: #333333;
    font-size: 20px;
}
.btn-primary {
    color: #fff;
    background-color: #FF6D00;
    border-color: #FF6D00;
}
.btn-primary-invert {
    color: #FF6D00;
    background-color: #fff;
    border-color: #fff;
}
.btn-primary:focus,
.btn-primary-invert: focus {
    color: #fff;
    background-color: #BF360C;
    border-color: #BF360C;
}
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:hover,
.btn-primary:active,
.btn-primary-invert:active,
.btn-primary:active:hover,
.btn-primary-invert:hover,
.btn-primary-invert:active:hover {
    color: #fff;
    background-color: #BF360C;
    border-color: #BF360C;
}
.challenge-test-suite {
    background: #ffffff;
    color: #333333;
}
.challenge-test-suite code,
tt {
    background-color: rgba(0, 0, 0, .2);
    color: #222222;
}
a {
    color: #fefefe;
}
h2 {
    font-size: 36px;
}
.text-center {
    text-align: left;
}
h4 {
    font-size: 20px;
}
hr {
    margin: 5px 0 calc(1.45rem - 1px);
    padding: 0;
    background: rgba(255, 255, 255, .9);
    border: none;
    height: 3px;
}
p,
ul,
li {
    font-size: 20px;
}
.index-page-wrapper {
    background-color: #ffffff;
    color: #333333;
    justify-content: left;
    align-items: flex-start;
}
p a {
    color: #333333;
    text-decoration: underline;
}
.map-challenge-title-completed {
    opacity: .9;
}
#top-nav {
    background: #212121;
    padding: 20px 0;
    height: 70px;
}
.app-wrapper {
    margin-top: 70px;
    height: calc(100vh - 70px);
}
code,
tt {
    background-color: rgba(0, 0, 0, .2);
    color: #FF9800;
}
.util-spacer {
    margin: 5px 0;
    height: 10px;
}
.map-ui {
    height: 100%;
    max-height: calc(100vh - (75px + 1.45rem));
    margin-left: 0px;
}
ul {
    margin: 0;
}

/* minimal styling for the code editor to get it to a default "terminal green" like I like */
.monaco-editor {
    padding-top: 20px;
}
.monaco-editor .minimap-slider,
.monaco-editor .minimap-slider .minimap-slider-horizontal {
    background: rgba(22, 22, 22, 0.2);
}
.monaco-editor .minimap-slider:hover,
.monaco-editor .minimap-slider:hover .minimap-slider-horizontal {
    background: rgba(100, 100, 100, 0.35);
}
.monaco-editor .minimap-slider.active,
.monaco-editor .minimap-slider.active .minimap-slider-horizontal {
    background: rgba(0, 0, 0, 0.3);
}
.monaco-editor .minimap-shadow-visible {
    box-shadow: #dddddd -6px 0 6px -6px inset;
}
.monaco-editor .scroll-decoration {
    box-shadow: #dddddd 0 6px 6px -6px inset;
}
.monaco-editor .focused .selected-text {
    background-color: #222222;
}
.monaco-editor .selected-text {
    background-color: #222222;
}
.monaco-editor,
.monaco-editor-background,
.monaco-editor .inputarea.ime-input {
    background-color: #101010;
}
.monaco-editor,
.monaco-editor .inputarea.ime-input {
    color: #000000;
}
.monaco-editor .margin {
    background-color: #151515;
}
.monaco-editor .rangeHighlight {
    background-color: rgba(253, 255, 0, 0.2);
}
.vs-whitespace {
    color: rgba(51, 51, 51, 0.2) !important;
}
.monaco-editor .view-overlays .current-line {
    border: none;
}
.monaco-editor .margin-view-overlays .current-line-margin {
    border: 2px solid #eeeeee;
}
.monaco-editor .lines-content .cigr {
    background-color: inherit;
}
.monaco-editor .line-numbers {
    color: #FF9800;
}
.monaco-editor .view-ruler {
    background-color: #222222;
}
.monaco-editor .cursor {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #000000;
}
.monaco-editor .redsquiggly {
    background: url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20height%3D'3'%20width%3D'6'%3E%3Cg%20fill%3D'%23ff0000'%3E%3Cpolygon%20points%3D'5.5%2C0%202.5%2C3%201.1%2C3%204.1%2C0'%2F%3E%3Cpolygon%20points%3D'4%2C0%206%2C2%206%2C0.6%205.4%2C0'%2F%3E%3Cpolygon%20points%3D'0%2C2%201%2C3%202.4%2C3%200%2C0.6'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") repeat-x bottom left;
}
.monaco-editor .greensquiggly {
    background: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20height%3D'3'%20width%3D'6'%3E%3Cg%20fill%3D'%23008000'%3E%3Cpolygon%20points%3D'5.5%2C0%202.5%2C3%201.1%2C3%204.1%2C0'%2F%3E%3Cpolygon%20points%3D'4%2C0%206%2C2%206%2C0.6%205.4%2C0'%2F%3E%3Cpolygon%20points%3D'0%2C2%201%2C3%202.4%2C3%200%2C0.6'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") repeat-x bottom left;
}
.monaco-editor .bracket-match {
    background-color: rgba(0, 100, 0, 0.1);
}
.monaco-editor .bracket-match {
    border: none;
}
.monaco-editor.vs .valueSetReplacement {
    outline: solid 2px #b9b9b9;
}
.monaco-diff-editor .diff-review-line-number {
    color: #2b91af;
}
.monaco-diff-editor .diff-review-shadow {
    box-shadow: #dddddd 0 -6px 6px -6px inset;
}
.monaco-editor .line-insert,
.monaco-editor .char-insert {
    background-color: rgba(155, 185, 85, 0.2);
}
.monaco-diff-editor .line-insert,
.monaco-diff-editor .char-insert {
    background-color: rgba(155, 185, 85, 0.2);
}
.monaco-editor .inline-added-margin-view-zone {
    background-color: rgba(155, 185, 85, 0.2);
}
.monaco-editor .line-delete,
.monaco-editor .char-delete {
    background-color: rgba(255, 0, 0, 0.2);
}
.monaco-diff-editor .line-delete,
.monaco-diff-editor .char-delete {
    background-color: rgba(255, 0, 0, 0.2);
}
.monaco-editor .inline-deleted-margin-view-zone {
    background-color: rgba(255, 0, 0, 0.2);
}
.monaco-diff-editor.side-by-side .editor.modified {
    box-shadow: -6px 0 5px -5px #dddddd;
}
.monaco-editor .codelens-decoration {
    color: #999999;
}
.monaco-editor .codelens-decoration > a:hover {
    color: #0000ff !important;
}
.monaco-editor .colorpicker-widget {
    background-color: #efeff2;
}
.monaco-editor .colorpicker-widget {
    border: 1px solid #c8c8c8;
}
.monaco-editor .colorpicker-header {
    border-bottom: 1px solid #c8c8c8;
}
.monaco-editor .findOptionsWidget {
    background-color: #efeff2;
}
.monaco-editor .findOptionsWidget {
    box-shadow: 0 2px 8px #a8a8a8;
}
.monaco-editor .findMatch {
    background-color: rgba(234, 92, 0, 0.33);
}
.monaco-editor .currentFindMatch {
    background-color: #a8ac94;
}
.monaco-editor .findScope {
    background-color: rgba(180, 180, 180, 0.3);
}
.monaco-editor .find-widget {
    background-color: #efeff2;
}
.monaco-editor .find-widget {
    box-shadow: 0 2px 8px #a8a8a8;
}
.monaco-editor .find-widget.no-results .matchesCount {
    color: #a1260d;
}
.monaco-editor .monaco-editor-overlaymessage .anchor {
    border-top-color: #007acc;
}
.monaco-editor .monaco-editor-overlaymessage .message {
    border: 1px solid #007acc;
}
.monaco-editor .monaco-editor-overlaymessage .message {
    background-color: #d6ecf2;
}
.monaco-editor .hoverHighlight {
    background-color: rgba(173, 214, 255, 0.15);
}
.monaco-editor .monaco-editor-hover {
    background-color: #efeff2;
}
.monaco-editor .monaco-editor-hover {
    border: 1px solid #c8c8c8;
}
.monaco-editor .monaco-editor-hover .hover-row:not(:first-child):not(:empty) {
    border-top: 1px solid rgba(200, 200, 200, 0.5);
}
.monaco-editor .monaco-editor-hover a {
    color: #4080d0;
}
.monaco-editor .monaco-editor-hover code {
    background-color: rgba(220, 220, 220, 0.4);
}
.monaco-editor .detected-link-active {
    color: #0000ff !important;
}
.monaco-editor .parameter-hints-widget {
    border: 1px solid #c8c8c8;
}
.monaco-editor .parameter-hints-widget.multiple .body {
    border-left: 1px solid rgba(200, 200, 200, 0.5);
}
.monaco-editor .parameter-hints-widget .signature.has-docs {
    border-bottom: 1px solid rgba(200, 200, 200, 0.5);
}
.monaco-editor .parameter-hints-widget {
    background-color: #efeff2;
}
.monaco-editor .suggest-widget:not(.frozen) .monaco-highlighted-label .highlight {
    color: #007acc;
}

.monaco-editor .focused .selectionHighlight {
    background-color: rgba(173, 214, 255, 0.3);
}
.monaco-editor .selectionHighlight {
    background-color: rgba(173, 214, 255, 0.15);
}
.monaco-editor .wordHighlight {
    background-color: rgba(87, 87, 87, 0.25);
}
.monaco-editor .wordHighlightStrong {
    background-color: rgba(14, 99, 156, 0.25);
}
.monaco-editor .accessibilityHelpWidget {
    background-color: #efeff2;
}
.monaco-editor .accessibilityHelpWidget {
    box-shadow: 0 2px 8px #a8a8a8;
}
.monaco-editor .tokens-inspect-widget {
    border: 1px solid #c8c8c8;
}
.monaco-editor .tokens-inspect-widget .tokens-inspect-separator {
    background-color: inherit;
}
.monaco-editor .tokens-inspect-widget {
    background-color: #efeff2;
}
.monaco-editor .reference-zone-widget .ref-tree .referenceMatch {
    background-color: rgba(234, 92, 0, 0.3);
}

.monaco-editor .reference-zone-widget .preview .reference-decoration {
    background-color: rgba(245, 216, 2, 0.87);
}
.monaco-editor .reference-zone-widget .ref-tree {
    background-color: #f3f3f3;
}
.monaco-editor .reference-zone-widget .ref-tree {
    color: #646465;
}
.monaco-editor .reference-zone-widget .ref-tree .reference-file {
    color: #1e1e1e;
}
.monaco-editor .reference-zone-widget .ref-tree .monaco-tree.focused .monaco-tree-rows > .monaco-tree-row.selected:not(.highlighted) {
    background-color: rgba(51, 153, 255, 0.2);
}
.monaco-editor .reference-zone-widget .ref-tree .monaco-tree.focused .monaco-tree-rows > .monaco-tree-row.selected:not(.highlighted) {
    color: #6c6c6c !important;
}
.monaco-editor .reference-zone-widget .preview .monaco-editor .monaco-editor-background,
.monaco-editor .reference-zone-widget .preview .monaco-editor .inputarea.ime-input {
    background-color: #f2f8fc;
}
.monaco-editor .reference-zone-widget .preview .monaco-editor .margin {
    background-color: #f2f8fc;
}
.monaco-editor .goto-definition-link {
    color: #00FF09 !important;
}
.mtk1 {
    color: #00FF09;
}
.mtk2 {
    color: #00FF09;
}
.mtk3 {
    color: #00FF09;
}
.mtk4 {
    color: #00FF09;
}
.mtk5 {
    color: #00FF09;
}
.mtk6 {
    color: #00FF09;
}
.mtk7 {
    color: #00FF09;
}
.mtk8 {
    color: #00FF09;
}
.mtk9 {
    color: #00FF09;
}
.mtk10 {
    color: #00FF09;
}
.mtk11 {
    color: #00FF09;
}
.mtk12 {
    color: #00FF09;
}
.mtk13 {
    color: #00FF09;
}
.mtk14 {
    color: #00FF09;
}
.mtk15 {
    color: #00FF09;
}
.mtk16 {
    color: #00FF09;
}
.mtk17 {
    color: #00FF09;
}
.mtk18 {
    color: #00FF09;
}
.mtk19 {
    color: #00FF09;
}
.mtk20 {
    color: #00FF09;
}
.mtk21 {
    color: #00FF09;
}
.mtk22 {
    color: #00FF09;
}
.mtk23 {
    color: #00FF09;
}
.mtk24 {
    color: #00FF09;
}
.mtki {
    font-style: italic;
}
.mtkb {
    font-weight: bold;
}
.mtku {
    text-decoration: underline;
}
/* Disable intellisense in the code editor */
.monaco-editor .suggest-widget {
    display: none;
    color: #000000;
}
.monaco-editor .reference-zone-widget {
    display: none;
}