Update CSS for latest dconv version

Author: TimWolla

docs/css/page.css

@@ -1,168 +1,132 @@
-/* Global Styles */
-
-body {
-	margin-top: 50px;
-	background: #fff;
+/* Custom dark color */
+:root {
+	--bs-dark: #033c73;
+	--bs-dark-rgb: 3, 60, 115;
 }
 
-a.anchor {
-	display: block; position: relative; top: -50px; visibility: hidden;
+/* Sidebar */
+#sidebar {
+	max-width: 350px !important;
 }
 
-/* ------------------------------- */
-
-/* Wrappers */
-
-/* ------------------------------- */
-
-#index .well {
-	background-color: #033c73;
-	color: #fff;
-}
-#index small, #index .small {
-	color: #aaa;
+/* Sidebar navigation tabs on dark background */
+#sidebar .nav-tabs {
+	border-bottom-color: var(--bs-border-color-translucent);
 }
 
-#wrapper {
-    width: 100%;
+#sidebar .nav-tabs .nav-link {
+	color: var(--bs-light);
+	border-color: transparent;
+	background-color: transparent;
 }
 
-#page-wrapper {
-    padding: 0 15px 50px;
-    width: 720px;
-    background-color: #fff;
-    margin-left: 350px;
+#sidebar .nav-tabs .nav-link:hover {
+	color: var(--bs-white);
+	background-color: rgba(255, 255, 255, 0.1);
 }
 
-#sidebar {
-	position: fixed;
-	width: 350px;
-	top: 50px;
-	bottom: 0;
-	padding: 15px;
-        color: #ffffff;
-        background-color: #033c73;
-        border-right: 1px solid #ccc;
-        overflow-y: auto;
-}
-#sidebar li > a {
-    color: #fff;
-}
-#sidebar li.active > a,
-#sidebar li > a:hover {
-    color: #555 !important;
+#sidebar .nav-tabs .nav-link.active {
+	color: var(--bs-dark);
+	background-color: var(--bs-light);
+	border-color: var(--bs-border-color-translucent) var(--bs-border-color-translucent) var(--bs-light);
 }
 
-#sidebar .tab-content {
-  background-color: #fff;
-  color: #000;
-  padding: 0.5em;
-}
-#sidebar-summary {
-}
-#sidebar-keywords {
-}
-.summary td {
-  vertical-align: top;
-}
 
-/* ------------------------------- */
-
-/* Misc */
-
-/* ------------------------------- */
+/* Sidebar content links (light zone) */
+#sidebar .tab-content a {
+	color: var(--bs-body-color);
+	text-decoration: none;
+}
 
-.well-small ul {
-	padding: 0px;
+#sidebar .tab-content a:hover {
+	text-decoration: underline;
 }
-.table th,
-.table td.pagination-centered {
-	text-align: center;
+
+#sidebar .tab-content a.active {
+	font-weight: bold;
+	background-color: var(--bs-secondary-bg);
+	border-radius: 3px;
 }
 
+/* Sidebar footer links (dark zone) */
+#sidebar footer a,
+#sidebar .flex-shrink-0.border-top a {
+	color: var(--bs-light);
+	text-decoration: none;
+}
 
-pre {
-	overflow: visible; /* Workaround for dropdown menus */
+#sidebar .flex-shrink-0.border-top a:hover {
+	text-decoration: underline;
 }
 
-pre.text {
-        padding: 0;
-	font-size: 13px;
-	color: #000;
-	background: transparent;
-        border: none;
-        margin-bottom: 18px;
+/* Breadcrumbs bar */
+#breadcrumbs .breadcrumb-item + .breadcrumb-item::before {
+	color: var(--bs-secondary-color);
 }
-pre.arguments {
-        font-size: 13px;
-        color: #000;
-        background: transparent;
+
+/* Main content links (light zone) */
+#content a {
+	color: var(--bs-body-color);
+	text-decoration: none;
 }
 
-.comment {
-	color: #888;
+#content a:hover {
+	text-decoration: underline;
 }
-small, .small {
-	color: #888;
+
+/* Chapter numbers in sidebar */
+.summary td:first-child small {
+	color: var(--bs-secondary-color);
 }
-.level1 {
-	font-size: 125%;
+
+.summary td {
+	vertical-align: top;
 }
+
+/* Documentation content styles */
 .sublevels {
-	border-left: 1px solid #ccc;
+	border-left: 1px solid var(--bs-border-color);
 	padding-left: 10px;
 }
+
 .tab {
 	padding-left: 1.25em;
 }
-.keyword  {
-    font-family: Menlo, Monaco, "Courier New", monospace;
-    white-space: pre;
-    background: #eee;
-    border-top: 1px solid #fff;
-    border-bottom: 1px solid #ccc;
-}
 
-.label-see-also {
-	background-color: #999;
-}
-.label-disabled {
-	background-color: #ccc;
-}
-h5 {
-	text-decoration: underline;
+.keyword {
+	font-family: var(--bs-font-monospace);
+	white-space: pre;
+	background: var(--bs-tertiary-bg);
+	border-top: 1px solid var(--bs-light);
+	border-bottom: 1px solid var(--bs-border-color);
 }
 
 .example-desc {
-	border-bottom: 1px solid #ccc;
+	border-bottom: 1px solid var(--bs-border-color);
 	margin-bottom: 18px;
 }
-.noheight {
-	min-height: 0 !important;
-}
+
 .separator {
-    margin-bottom: 18px;
+	margin-bottom: 18px;
 }
 
-div {
-	word-wrap: break-word;
+.level1 {
+	font-size: 125%;
 }
 
-html, body {
-	width: 100%;
-	min-height: 100%:
+pre.text {
+	padding: 0;
+	font-size: 13px;
+	background: transparent;
+	border: none;
+	margin-bottom: 18px;
 }
 
-.dropdown-menu > li {
-	white-space: nowrap;
+pre.arguments {
+	font-size: 13px;
+	background: transparent;
 }
-/* TEMPORARILY HACKS WHILE PRE TAGS ARE USED
--------------------------------------------------- */
 
-h5,
-.unpre,
-.example-desc,
-.dropdown-menu {
-	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-        white-space: normal;
-}
+.comment {
+	color: var(--bs-secondary-color);
+}