diff --git a/server/auth.ts b/server/auth.ts
index 5b16b540f..d8c2d1861 100644
--- a/server/auth.ts
+++ b/server/auth.ts
@@ -7,7 +7,7 @@ import {
   TokenSet,
 } from 'openid-client';
 import passport from 'passport';
-import { SITE_ROOT } from '../shared/constants';
+import { DOCS_ROOT } from '../shared/constants';
 import { App } from './app';
 import { Config } from './config';
 import log from './log';
@@ -43,7 +43,7 @@ export class Auth {
       });
     } else {
       log.fatal(
-        `Missing auth scheme. Review ${SITE_ROOT}/docs/Installation.html#configuration for how to configure auth.`
+        `Missing auth scheme. Review ${DOCS_ROOT}/Installation.html#configuration for how to configure auth.`
       );
     }
   }
diff --git a/shared/constants.ts b/shared/constants.ts
index 338665f09..e4f9a8be9 100644
--- a/shared/constants.ts
+++ b/shared/constants.ts
@@ -38,3 +38,5 @@ export const MODE_FEATURES = {
   dashboard: MODE === 'server',
   scheduledExports: MODE === 'server',
 };
+
+export const DOCS_ROOT = SITE_ROOT + '/docs/' + VERSION;
diff --git a/ui/panels/DatabasePanel.tsx b/ui/panels/DatabasePanel.tsx
index 99d6686b6..cd29bc460 100644
--- a/ui/panels/DatabasePanel.tsx
+++ b/ui/panels/DatabasePanel.tsx
@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { SITE_ROOT } from '../../shared/constants';
+import { DOCS_ROOT } from '../../shared/constants';
 import { NoConnectorError } from '../../shared/errors';
 import {
   ConnectorInfo,
@@ -192,7 +192,7 @@ export function DatabaseInfo({ panel }: { panel: DatabasePanelInfo }) {
       Use <code>DM_getPanel($panel_number_or_name)</code> to reference other
       panels. Once you have called this once for one panel, use{' '}
       <code>t_$panel_number_or_name</code> to refer to it again. Read more{' '}
-      <a href={SITE_ROOT + '/docs/Panels/Code_Panels.html'}>here</a>.
+      <a href={DOCS_ROOT + '/Panels/Code_Panels.html'}>here</a>.
     </React.Fragment>
   );
 }
diff --git a/ui/panels/ProgramPanel.tsx b/ui/panels/ProgramPanel.tsx
index 831112b90..858dcf3d3 100644
--- a/ui/panels/ProgramPanel.tsx
+++ b/ui/panels/ProgramPanel.tsx
@@ -1,6 +1,6 @@
 import React from 'react';
 import { shape } from 'shape';
-import { MODE, SITE_ROOT } from '../../shared/constants';
+import { DOCS_ROOT, MODE } from '../../shared/constants';
 import { LANGUAGES, SupportedLanguages } from '../../shared/languages';
 import { PanelInfo, PanelResult, ProgramPanelInfo } from '../../shared/state';
 import { panelRPC } from '../asyncRPC';
@@ -112,7 +112,7 @@ export function ProgramInfo({ panel }: { panel: ProgramPanelInfo }) {
         Use <code>DM_getPanel($panel_number_or_name)</code> to reference other
         panels. Once you have called this once for one panel, use{' '}
         <code>t_$panel_number_or_name</code> to refer to it again. Read more{' '}
-        <a href={SITE_ROOT + '/docs/Panels/Code_Panels.html'}>here</a>.
+        <a href={DOCS_ROOT + '/Panels/Code_Panels.html'}>here</a>.
       </React.Fragment>
     );
   }
@@ -122,7 +122,7 @@ export function ProgramInfo({ panel }: { panel: ProgramPanelInfo }) {
       Use builtin functions, <code>DM_setPanel($some_array_data)</code> and{' '}
       <code>DM_getPanel($panel_number_or_name)</code>, to interact with other
       panels. Read more{' '}
-      <a href={SITE_ROOT + '/docs/Panels/Code_Panels.html'}>here</a>.
+      <a href={DOCS_ROOT + '/Panels/Code_Panels.html'}>here</a>.
     </React.Fragment>
   );
 }
diff --git a/ui/style.css b/ui/style.css
index 9766d0d54..5000465fa 100644
--- a/ui/style.css
+++ b/ui/style.css
@@ -611,7 +611,7 @@ header > div {
     padding: 0 5px;
   }
 
-  code {
+  p code {
     border: 1px solid #ddd;
     background: rgba(255, 255, 255, 0.5);
     margin: 0 3px;