replace fancybox cdn with import node_modules package

docs-src/templates/2sxc - x/partials/head.tmpl.partial

@@ -31,7 +31,4 @@
 
   <!-- overwrite the built in highlightJs with a newer version -->
   <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/10.6.0/styles/default.min.css">
-
-  <!-- fancybox -->
-  <link rel="stylesheet" href="//cdn.jsdelivr.net/gh/fancyapps/[email protected]/dist/jquery.fancybox.min.css" />
 </head>

docs-src/templates/2sxc - x/partials/scripts.tmpl.partial

@@ -14,6 +14,3 @@
 <script type="text/javascript" src="{{_rel}}styles/main.js"></script>
 <script src="//cdnjs.cloudflare.com/ajax/libs/featherlight/1.7.13/featherlight.min.js" type="text/javascript" charset="utf-8"></script>
 <script type="text/javascript" src="{{_rel}}styles/2sxc-scripts.js"></script>
-
-<!-- fancybox -->
-<script src="https://cdn.jsdelivr.net/gh/fancyapps/[email protected]/dist/jquery.fancybox.min.js"></script>

docs-src/templates/2sxc/layout/_master.tmpl

@@ -37,17 +37,7 @@
       <meta name="loc:themeAuto" content="{{__global.themeAuto}}">
       <meta name="loc:changeTheme" content="{{__global.changeTheme}}">
       <meta name="loc:copy" content="{{__global.copy}}">
-      <meta name="loc:downloadPdf" content="{{__global.downloadPdf}}">
-
-      {{!2sxc added fancybox - TODO: PROBABLY update once it works }}
-      {{! <link rel="stylesheet" href="//cdn.jsdelivr.net/gh/fancyapps/[email protected]/dist/jquery.fancybox.min.css" /> }}
-      <script src="https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/fancybox/fancybox.umd.js"></script>
-      <link
-        rel="stylesheet"
-        href="https://cdn.jsdelivr.net/npm/@fancyapps/[email protected]/dist/fancybox/fancybox.css"
-      />
-
-
+      <meta name="loc:downloadPdf" content="{{__global.downloadPdf}}">      
     {{/redirect_url}}
   </head>
 

docs-src/templates/2sxc/src/main.scss

@@ -1,3 +1,5 @@
+@import "../../shared-global/src/styles/style.scss";
+
 /* Layout Styles */
 
 /* Change Search input to be less wide to allow for version */

docs-src/templates/2sxc/src/main.ts

@@ -4,7 +4,6 @@ import { docReady } from '../../shared-global/src/scripts/utils/docready';
 import { configureLightboxes } from '../../shared-global/src/scripts/images';
 import { setVersionButtonLink } from '../../shared-global/src/scripts/versions';
 import version from '../../../package.json';
-import { Html } from '@fancyapps/ui';
 import { lightboxForContextIllustration } from '../../shared-global/src/scripts/context-illustrations';
 import "./main.scss";
 

docs-src/templates/shared-global/src/scripts/context-illustrations.ts

@@ -1,3 +1,4 @@
+import { Fancybox } from '@fancyapps/ui';
 import packageJson from '../../../../package.json';
 const { enableDebug } = packageJson; 
 
@@ -35,7 +36,7 @@ export function lightboxForContextIllustration() {
   };
 
   // attach fancybox to all
-  (Fancybox as any).bind("[data-fancybox]");
+  Fancybox.bind("[data-fancybox]");
 }
 
 function createPopupDiv(original: HTMLElement, newName: string) {

docs-src/templates/shared-global/src/scripts/images.ts

@@ -1,3 +1,4 @@
+import { Fancybox } from '@fancyapps/ui';
 import packageJson from '../../../../package.json';
 const { enableDebug } = packageJson; 
 
@@ -44,5 +45,5 @@ export function configureLightboxes() {
   });
 
   // Attach Fancybox to all these images
-  (window.Fancybox as any).bind(imgSelector);
+  Fancybox.bind(imgSelector);
 }

docs-src/templates/shared-global/src/scripts/index.d.ts

@@ -1,8 +1,8 @@
 // declare module 'highlightjs-cshtml-razor';
 
-import { Fancybox } from '@fancyapps/ui';
+// import { Fancybox } from '@fancyapps/ui';
 
-// note: this doesn't work ATM
-declare global {
-  var Fancybox: Fancybox;
-}
+// // note: this doesn't work ATM
+// declare global {
+//   var Fancybox: Fancybox;
+// }

docs-src/templates/shared-global/src/styles/style.scss

@@ -0,0 +1 @@
+@import "~@fancyapps/ui/dist/fancybox/fancybox.css";