Code-Basics Dark by skarabeydm

/* ==UserStyle==
@name         Code-Basics Dark
@version      20211218.11.55
@namespace    userstyles.world/user/skarabeydm
@description  Code-Basics Dark Theme
@author       skarabeydm
@license      No License
==/UserStyle== */

@-moz-document domain("code-basics.com") {
/*Dark Scrollbar*/
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}
::-webkit-scrollbar-track {
	background: #fff0;
}
::-webkit-scrollbar-thumb {
	background: #222;
}
::-webkit-scrollbar-thumb:hover {
	background: #252525;
}

#sidebar,
.sidebar,
.left-sidebar,
.top-bar,
.top-bar._fixed,
.ml12,
#post-form,
.bottom-notice,
.site-footer,
.site-header,
.py24,
.bc-black-3,

.bg-black-025,
.h\:bg-black-025:hover,
.f\:bg-black-025:focus {
	display: none !important;
}

body {
	padding-top: 0;
}

#content {
	border: none;
	margin: auto;
	width: 60%;
}

#mainbar,
.mainbar {
	width: 100% !important;
}

/*Dark Theme*/
:root {
	--bs-body-color: hsl(1deg 1% 80%) !important;
	--bs-body-bg: #212529 !important;
	--bs-border-light: #ffffff21;
	--bs-card-bg: hsl(210deg 5% 20%);
	--bs-code-color: #ff91c8;

	--bs-border: 2px solid var(--bs-border-light) !important;
}

.border,
.hexlet-basics-content pre,
.hexlet-basics-content .hexlet-basics-example {
	border: var(--bs-border) !important
}

/* подсветка кода в тексте */
code {
	color: var(--bs-code-color) !important
}

/* подсветка тегов */
.hljs-name,
.hljs-quote,
.hljs-selector-pseudo,
.hljs-selector-tag {
	color: #38de60;
}

/* подсветка атрибутов */
.hljs-attr,
.hljs-attribute,
.hljs-literal,
.hljs-meta,
.hljs-number,
.hljs-operator,
.hljs-selector-attr,
.hljs-selector-class,
.hljs-selector-id,
.hljs-variable {
	color: #93c6ff;
}

.dropdown-menu,
.card,
.list-group-item {
	background-color: var(--bs-card-bg) !important;
	border: var(--bs-border) !important;
}


.list-group-item {
	background-color: var(--bs-body-bg);
}

.dropdown-item-text,
.dropdown-item,
.table,
.hexlet-basics-content table,
a {
	color: var(--bs-body-color) !important
}

/* Подсветка комментариев */
.hljs-code,
.hljs-comment,
.hljs-formula {
	color: #afc4db !important;
}

.border-top {
	border-top: var(--bs-border) !important;
}


/* Обводка кнопок */
.btn {
	border: 2px solid transparent
}

.fw-normal {
	font-weight: 500 !important;
}

.btn-outline-primary:disabled,
.btn-outline-primary.disabled {
	color: #2d82ff !important
}

.nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
	background-color: var(--bs-body-bg) !important;
	border-color: var(--bs-border-light) !important;
}

/* manaco-editor - редактор кода. Увы, не работает. Не удаётся перекрасить текст в редакторе
/*
.monaco-editor,
.monaco-editor-background,
.monaco-editor .inputarea.ime-input {
	background-color: var(--bs-body-bg) !important;
}

.monaco-editor .margin {
	background-color: var(--bs-body-bg) !important;
}
*/
.bg-white {
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
}

.pt-3.px-2.pb-2.h-50.bg-white.border-top {
	--bs-bg-opacity: 1;
	background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
}

.hljs {
	color: var(--bs-body-color) !important;
	background: var(--bs-card-bg) !important;
}

/* Подсветка строк */
.hljs-meta .hljs-string,
.hljs-regexp,
.hljs-string {
	color: var(--bs-orange) !important;
}
.nav-tabs {
	border-bottom: 1px solid var(--bs-border-light);
}

.text-muted {
	color: #8f9ba7 !important;
}

.text-dark {
	--bs-text-opacity: 1;
	color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
}
}