@mjhls/mjh-framework 1.0.118 → 1.0.119

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.es.js CHANGED
@@ -11587,7 +11587,7 @@ var TaxonomyCard = function TaxonomyCard(props) {
11587
11587
  ),
11588
11588
  icon && React__default.createElement(
11589
11589
  'style',
11590
- { jsx: true },
11590
+ { jsx: 'true' },
11591
11591
  '\n .taxonomy-card:hover .taxonomy-icon {\n transform: translateY(-50%) scale(1.5) translateX(0) !important;\n }\n '
11592
11592
  )
11593
11593
  );
@@ -11731,7 +11731,7 @@ var GroupDeck = function GroupDeck(props) {
11731
11731
  ),
11732
11732
  React__default.createElement(
11733
11733
  'style',
11734
- { jsx: true },
11734
+ { jsx: 'true' },
11735
11735
  '\n #vid-slider * {\n box-sizing: border-box;\n }\n #vid-slider {\n position: relative;\n }\n #vid-slider .now-playing {\n position: absolute;\n top: 0.5rem;\n left: 0.5rem;\n color: white;\n padding: 0 1rem;\n background: rgba(0, 0, 0, 0.75);\n }\n #vid-slider h1,\n #vid-slider p {\n text-align: center;\n width: 100%;\n max-width: 500px;\n margin: auto;\n }\n #vid-slider a:link,\n #vid-slider a:hover,\n #vid-slider a:active,\n #vid-slider a:visited {\n transition: color 150ms;\n color: #95a5a6;\n text-decoration: none;\n }\n #vid-slider a:hover {\n color: #7f8c8d;\n text-decoration: underline;\n }\n #vid-slider .contain {\n width: 100%;\n }\n #vid-slider .row {\n overflow: scroll;\n width: 100%;\n }\n #vid-slider .tile__info {\n white-space: normal !important;\n position: absolute;\n text-align: center;\n color: ' + (props.dark ? 'white' : '#383838') + ';\n opacity: 1;\n font-size: 1rem;\n transition: opacity 0.25s;\n }\n #vid-slider .row__inner {\n transition: 450ms -webkit-transform;\n transition: 450ms transform;\n transition: 450ms transform, 450ms -webkit-transform;\n font-size: 0;\n white-space: nowrap;\n margin: 55px 0;\n padding-bottom: 10px;\n padding-left: 0;\n }\n #vid-slider .tile {\n position: relative;\n display: inline-block;\n width: 250px;\n height: 140.625px;\n margin-right: 10px;\n font-size: 20px;\n cursor: pointer;\n transition: 450ms all;\n -webkit-transform-origin: center left;\n transform-origin: center left;\n }\n #vid-slider .tile__img {\n width: 250px;\n height: 140.625px;\n -o-object-fit: cover;\n object-fit: cover;\n }\n #vid-slider .tile__details {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n top: 0;\n font-size: 10px;\n opacity: 0;\n background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);\n transition: 450ms opacity;\n }\n #vid-slider .tile__details:after,\n #vid-slider .tile__details:before {\n content: \'\';\n position: absolute;\n top: 50%;\n left: 50%;\n display: #000;\n }\n #vid-slider .tile__details:after {\n margin-top: -25px;\n margin-left: -25px;\n width: 50px;\n height: 50px;\n border: 3px solid #ecf0f1;\n line-height: 50px;\n text-align: center;\n border-radius: 100%;\n background: rgba(0, 0, 0, 0.5);\n z-index: 1;\n }\n #vid-slider .tile__details:before {\n content: \'\u25B6\';\n left: 0;\n width: 100%;\n font-size: 30px;\n margin-left: 3px;\n margin-top: -22px;\n text-align: center;\n z-index: 2;\n color: white;\n }\n #vid-slider .tile:hover .tile__details {\n opacity: 1;\n }\n #vid-slider .tile__title {\n position: absolute;\n bottom: 0;\n padding: 10px;\n max-width: 250px;\n }\n #vid-slider .tile__title_text {\n position: relative;\n left: 0;\n white-space: normal;\n }\n #vid-slider .row__inner:hover {\n -webkit-transform: translate3d(-62.5px, 0, 0);\n transform: translate3d(-62.5px, 0, 0);\n }\n #vid-slider .row__inner:hover .tile {\n opacity: 0.3;\n }\n #vid-slider .row__inner:hover .tile:hover {\n -webkit-transform: scale(1.25);\n transform: scale(1.25);\n opacity: 1;\n }\n #vid-slider .tile:hover ~ .tile {\n -webkit-transform: translate3d(62px, 0, 0);\n transform: translate3d(62px, 0, 0);\n }\n #vid-slider .tile:hover .tile__info {\n opacity: 0;\n }\n #vid-slider .tile__slider-prev,\n #vid-slider .tile__slider-next {\n width: 30px;\n background: transparent;\n border: none;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n z-index: 99;\n cursor: pointer;\n color: ' + (props.dark ? 'white' : 'black') + ';\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 2rem;\n }\n #vid-slider .tile__slider-prev {\n left: -3px;\n }\n #vid-slider .tile__slider-next {\n right: 0;\n }\n #vid-slider,\n #vid-slider .row {\n margin: 0;\n padding: 0 1.2rem;\n }\n #vid-slider .tile:last-child {\n margin-right: 2rem;\n }\n #vid-slider .row::-webkit-scrollbar-thumb {\n background-color: transparent !important;\n }\n #vid-slider i {\n border: solid ' + (props.dark ? 'white' : 'black') + ';\n border-width: 0 4px 4px 0;\n display: inline-block;\n padding: 4px;\n pointer-events: none;\n }\n\n #vid-slider .right {\n transform: rotate(-45deg);\n -webkit-transform: rotate(-45deg);\n }\n\n #vid-slider .left {\n transform: rotate(135deg);\n -webkit-transform: rotate(135deg);\n }\n '
11736
11736
  )
11737
11737
  );
@@ -11931,7 +11931,7 @@ var YoutubeGroup = function YoutubeGroup(props) {
11931
11931
  ),
11932
11932
  React__default.createElement(
11933
11933
  'style',
11934
- { jsx: true },
11934
+ { jsx: 'true' },
11935
11935
  '\n #vid-slider * {\n box-sizing: border-box;\n }\n #vid-slider {\n position: relative;\n }\n #vid-slider .now-playing {\n position: absolute;\n top: 0.5rem;\n left: 1rem;\n color: white;\n background: rgba(0, 0, 0, 0.75);\n }\n #vid-slider h1,\n #vid-slider p {\n text-align: center;\n width: 100%;\n max-width: 500px;\n margin: auto;\n }\n #vid-slider a:link,\n #vid-slider a:hover,\n #vid-slider a:active,\n #vid-slider a:visited {\n transition: color 150ms;\n color: #95a5a6;\n text-decoration: none;\n }\n #vid-slider a:hover {\n color: #7f8c8d;\n text-decoration: underline;\n }\n #vid-slider .contain {\n width: 100%;\n }\n #vid-slider .row {\n overflow: scroll;\n width: 100%;\n }\n #vid-slider .tile__info {\n white-space: normal !important;\n position: absolute;\n text-align: center;\n color: ' + (props.dark ? 'white' : '#383838') + ';\n opacity: 1;\n font-size: 1rem;\n transition: opacity 0.25s;\n }\n #vid-slider .row__inner {\n transition: 450ms -webkit-transform;\n transition: 450ms transform;\n transition: 450ms transform, 450ms -webkit-transform;\n font-size: 0;\n white-space: nowrap;\n margin: 55px 0;\n padding-bottom: 10px;\n padding-left: 0;\n }\n #vid-slider .tile {\n position: relative;\n display: inline-block;\n width: 250px;\n height: 140.625px;\n margin-right: 10px;\n font-size: 20px;\n cursor: pointer;\n transition: 450ms all;\n -webkit-transform-origin: center left;\n transform-origin: center left;\n }\n #vid-slider .tile__img {\n width: 250px;\n height: 140.625px;\n -o-object-fit: cover;\n object-fit: cover;\n }\n #vid-slider .tile__details {\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n top: 0;\n font-size: 10px;\n opacity: 0;\n background: linear-gradient(to top, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0) 100%);\n transition: 450ms opacity;\n }\n #vid-slider .tile__details:after,\n #vid-slider .tile__details:before {\n content: \'\';\n position: absolute;\n top: 50%;\n left: 50%;\n display: #000;\n }\n #vid-slider .tile__details:after {\n margin-top: -25px;\n margin-left: -25px;\n width: 50px;\n height: 50px;\n border: 3px solid #ecf0f1;\n line-height: 50px;\n text-align: center;\n border-radius: 100%;\n background: rgba(0, 0, 0, 0.5);\n z-index: 1;\n }\n #vid-slider .tile__details:before {\n content: \'\u25B6\';\n left: 0;\n width: 100%;\n font-size: 30px;\n margin-left: 2px;\n margin-top: -23px;\n text-align: center;\n z-index: 2;\n color: white;\n }\n #vid-slider .tile:hover .tile__details {\n opacity: 1;\n }\n #vid-slider .tile__title {\n position: absolute;\n bottom: 0;\n padding: 10px;\n max-width: 250px;\n }\n #vid-slider .tile__title_text {\n position: relative;\n left: 0;\n white-space: normal;\n }\n #vid-slider .row__inner:hover {\n -webkit-transform: translate3d(-62.5px, 0, 0);\n transform: translate3d(-62.5px, 0, 0);\n }\n #vid-slider .row__inner:hover .tile {\n opacity: 0.3;\n }\n #vid-slider .row__inner:hover .tile:hover {\n -webkit-transform: scale(1.25);\n transform: scale(1.25);\n opacity: 1;\n }\n #vid-slider .tile:hover ~ .tile {\n -webkit-transform: translate3d(62px, 0, 0);\n transform: translate3d(62px, 0, 0);\n }\n #vid-slider .tile:hover .tile__info {\n opacity: 0;\n }\n #vid-slider .tile__slider-prev,\n #vid-slider .tile__slider-next {\n width: 30px;\n background: transparent;\n border: none;\n position: absolute;\n top: 50%;\n transform: translateY(-50%);\n z-index: 99;\n cursor: pointer;\n color: ' + (props.dark ? 'white' : 'black') + ';\n display: flex;\n justify-content: center;\n align-items: center;\n font-size: 2rem;\n }\n #vid-slider .tile__slider-prev {\n left: -3px;\n }\n #vid-slider .tile__slider-next {\n right: 0;\n }\n #vid-slider,\n #vid-slider .row {\n margin: 0;\n padding: 0 1.2rem;\n }\n #vid-slider .tile:last-child {\n margin-right: 2rem;\n }\n #vid-slider .row::-webkit-scrollbar-thumb {\n background-color: transparent !important;\n }\n #vid-slider i {\n border: solid ' + (props.dark ? 'white' : 'black') + ';\n border-width: 0 4px 4px 0;\n display: inline-block;\n padding: 4px;\n pointer-events: none;\n }\n\n #vid-slider .right {\n transform: rotate(-45deg);\n -webkit-transform: rotate(-45deg);\n }\n\n #vid-slider .left {\n transform: rotate(135deg);\n -webkit-transform: rotate(135deg);\n }\n '
11936
11936
  )
11937
11937
  );
@@ -12172,7 +12172,7 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
12172
12172
  var contentCategoryName = article.contentCategory ? article.contentCategory.name : 'Articles';
12173
12173
  return React__default.createElement(
12174
12174
  React__default.Fragment,
12175
- null,
12175
+ { key: article._id ? article._id : index$$1 },
12176
12176
  React__default.createElement(
12177
12177
  VisibilitySensor,
12178
12178
  {
@@ -12192,7 +12192,7 @@ var QueueDeckExpanded = function QueueDeckExpanded(props) {
12192
12192
  React__default.createElement(
12193
12193
  'a',
12194
12194
  null,
12195
- article.thumbnail && article.thumbnail.asset ? React__default.createElement('img', { className: 'mr-3', src: renderCardImage(article, builder, imageHeight, imageWidth), alt: article.title }) : React__default.createElement('img', { src: defaultImage, className: 'mr-3', width: '240', height: '135' })
12195
+ article.thumbnail && article.thumbnail.asset ? React__default.createElement('img', { className: 'mr-3', src: renderCardImage(article, builder, imageHeight, imageWidth), alt: article.title }) : article.thumbnail ? React__default.createElement('img', { src: article.thumbnail, className: 'mr-3', alt: article.title }) : React__default.createElement('img', { src: defaultImage, src2: article.thumbnail, className: 'mr-3', width: '240', height: '135', alt: article.title })
12196
12196
  )
12197
12197
  ),
12198
12198
  React__default.createElement(
@@ -12812,12 +12812,12 @@ var LeftNav = function LeftNav(props) {
12812
12812
  { key: subIndex },
12813
12813
  React__default.createElement(
12814
12814
  ListGroup.Item,
12815
- { as: 'li', active: true },
12815
+ { as: 'li', active: true, key: subIndex + '_1' },
12816
12816
  row.name
12817
12817
  ),
12818
12818
  React__default.createElement(
12819
12819
  ListGroup.Item,
12820
- { as: 'li' },
12820
+ { as: 'li', key: subIndex + '_2' },
12821
12821
  renderListGroupItem(subRow)
12822
12822
  )
12823
12823
  );
@@ -12827,7 +12827,7 @@ var LeftNav = function LeftNav(props) {
12827
12827
  { key: subIndex },
12828
12828
  React__default.createElement(
12829
12829
  ListGroup.Item,
12830
- { as: 'li' },
12830
+ { as: 'li', key: subIndex + '_1' },
12831
12831
  renderListGroupItem(subRow)
12832
12832
  )
12833
12833
  );
@@ -12888,7 +12888,7 @@ var PageFilter = function PageFilter(props) {
12888
12888
  ),
12889
12889
  React__default.createElement(
12890
12890
  'style',
12891
- { jsx: true },
12891
+ { jsx: 'true' },
12892
12892
  '\n .select-dropdown > a {\n color: #8e8c84;\n }\n '
12893
12893
  )
12894
12894
  );
@@ -12944,7 +12944,7 @@ var Column3 = function Column3(props) {
12944
12944
  ),
12945
12945
  React__default.createElement(
12946
12946
  'style',
12947
- { jsx: true },
12947
+ { jsx: 'true' },
12948
12948
  '\n .filter-box {\n padding-top: 6px;\n padding-right: 18px;\n }\n @media only screen and (min-width: 768px) {\n .title-wrap {\n display: flex;\n justify-content: space-between;\n }\n }\n @media only screen and (max-width: 767px) {\n .filter-box {\n float: right;\n display: flex;\n justify-content: flex-end;\n }\n .title-wrap {\n display: flex;\n flex-direction: column;\n margin-bottom: 10px;\n }\n }\n '
12949
12949
  ),
12950
12950
  (!main_36 || showRightAd) && React__default.createElement(
@@ -13178,7 +13178,7 @@ var Search = function Search(props) {
13178
13178
  ),
13179
13179
  React__default.createElement(
13180
13180
  'style',
13181
- { jsx: true },
13181
+ { jsx: 'true' },
13182
13182
  '\n .mobile-search {\n width: 75%;\n margin-right: 15px;\n }\n '
13183
13183
  )
13184
13184
  );
@@ -13252,8 +13252,8 @@ var NavMagazine = function NavMagazine(props) {
13252
13252
  website = props.website,
13253
13253
  _props$showLogin = props.showLogin,
13254
13254
  showLogin = _props$showLogin === undefined ? false : _props$showLogin,
13255
- _props$loginState = props.loginState,
13256
- loginState = _props$loginState === undefined ? false : _props$loginState;
13255
+ _props$initialLoginSt = props.initialLoginState,
13256
+ initialLoginState = _props$initialLoginSt === undefined ? false : _props$initialLoginSt;
13257
13257
 
13258
13258
  var navRef = useRef(null);
13259
13259
 
@@ -13267,6 +13267,11 @@ var NavMagazine = function NavMagazine(props) {
13267
13267
  screenWidth = _useState4[0],
13268
13268
  setScreenWidth = _useState4[1];
13269
13269
 
13270
+ var _useState5 = useState(initialLoginState),
13271
+ _useState6 = slicedToArray(_useState5, 2),
13272
+ loginState = _useState6[0],
13273
+ setLoginState = _useState6[1];
13274
+
13270
13275
  useEffect(function () {
13271
13276
  document.addEventListener('scroll', trackScrolling);
13272
13277
  return function () {
@@ -13277,6 +13282,11 @@ var NavMagazine = function NavMagazine(props) {
13277
13282
 
13278
13283
  useEffect(function () {
13279
13284
  setScreenWidth(parseInt(window.innerWidth));
13285
+ if (typeof GCN !== 'undefined' && GCN && GCN.onecount) {
13286
+ setLoginState(GCN.onecount.isLoggedIn());
13287
+ } else {
13288
+ console.error('GCN not defined');
13289
+ }
13280
13290
  }, []);
13281
13291
 
13282
13292
  var trackScrolling = function trackScrolling() {
@@ -13289,6 +13299,24 @@ var NavMagazine = function NavMagazine(props) {
13289
13299
  }
13290
13300
  };
13291
13301
 
13302
+ var handleLogin = function handleLogin(e) {
13303
+ if (typeof GCN !== 'undefined' && GCN && GCN.onecount) {
13304
+ GCN.onecount.login();
13305
+ setLoginState(GCN.onecount.isLoggedIn());
13306
+ } else {
13307
+ console.error('GCN not defined');
13308
+ }
13309
+ };
13310
+
13311
+ var handleLogout = function handleLogout(e) {
13312
+ if (typeof GCN !== 'undefined' && GCN && GCN.onecount) {
13313
+ GCN.onecount.logout();
13314
+ setLoginState(GCN.onecount.isLoggedIn());
13315
+ } else {
13316
+ console.error('GCN not defined');
13317
+ }
13318
+ };
13319
+
13292
13320
  return React__default.createElement(
13293
13321
  React__default.Fragment,
13294
13322
  null,
@@ -13306,7 +13334,9 @@ var NavMagazine = function NavMagazine(props) {
13306
13334
  { id: 'nav-mobile-register' },
13307
13335
  React__default.createElement(
13308
13336
  'div',
13309
- { className: 'px-2 py-2' },
13337
+ { className: 'px-2 py-2', onClick: function onClick(e) {
13338
+ return handleLogin(e);
13339
+ } },
13310
13340
  React__default.createElement(MdEmail, null),
13311
13341
  ' Register'
13312
13342
  )
@@ -13329,7 +13359,9 @@ var NavMagazine = function NavMagazine(props) {
13329
13359
  { id: 'nav-mobile-login' },
13330
13360
  React__default.createElement(
13331
13361
  'div',
13332
- { className: 'px-2 py-2 ' },
13362
+ { className: 'px-2 py-2 ', onClick: function onClick(e) {
13363
+ return handleLogin(e);
13364
+ } },
13333
13365
  React__default.createElement(IoMdLogIn, null),
13334
13366
  ' Login'
13335
13367
  )
@@ -13342,7 +13374,9 @@ var NavMagazine = function NavMagazine(props) {
13342
13374
  { id: 'nav-mobile-logout' },
13343
13375
  React__default.createElement(
13344
13376
  'div',
13345
- { className: ' pl-2 pr-3 py-2 text-right' },
13377
+ { className: 'pl-2 pr-3 py-2 text-right', onClick: function onClick(e) {
13378
+ return handleLogout(e);
13379
+ } },
13346
13380
  React__default.createElement(IoMdLogIn, null),
13347
13381
  ' Logout'
13348
13382
  )
@@ -13360,7 +13394,9 @@ var NavMagazine = function NavMagazine(props) {
13360
13394
  null,
13361
13395
  React__default.createElement(
13362
13396
  'div',
13363
- { className: 'px-2 py-2 mr-2', id: 'nav-register' },
13397
+ { className: 'px-2 py-2 mr-2', id: 'nav-register', onClick: function onClick(e) {
13398
+ return handleLogin(e);
13399
+ } },
13364
13400
  React__default.createElement(MdEmail, null),
13365
13401
  ' Register'
13366
13402
  )
@@ -13370,7 +13406,9 @@ var NavMagazine = function NavMagazine(props) {
13370
13406
  null,
13371
13407
  React__default.createElement(
13372
13408
  'div',
13373
- { className: ' px-2 py-2', id: 'nav-login' },
13409
+ { className: 'px-2 py-2', id: 'nav-login', onClick: function onClick(e) {
13410
+ return handleLogin(e);
13411
+ } },
13374
13412
  React__default.createElement(IoMdLogIn, null),
13375
13413
  ' Login'
13376
13414
  )
@@ -13384,7 +13422,9 @@ var NavMagazine = function NavMagazine(props) {
13384
13422
  null,
13385
13423
  React__default.createElement(
13386
13424
  'div',
13387
- { className: ' px-2 py-2', id: 'nav-logout' },
13425
+ { className: 'px-2 py-2', id: 'nav-logout', onClick: function onClick(e) {
13426
+ return handleLogout(e);
13427
+ } },
13388
13428
  React__default.createElement(IoMdLogIn, null),
13389
13429
  ' Logout'
13390
13430
  )
@@ -13512,7 +13552,7 @@ var NavMagazine = function NavMagazine(props) {
13512
13552
  ),
13513
13553
  React__default.createElement(
13514
13554
  'style',
13515
- { jsx: true },
13555
+ { jsx: 'true' },
13516
13556
  '\n .sticky-home {\n position: relative;\n top: -3px;\n left: -6px;\n cursor: pointer;\n }\n .nav-item svg{\n margin-bottom: 2px;\n }\n #nav-login,\n #nav-logout,\n #nav-register {\n padding: 0.5rem;\n cursor: pointer;\n }\n #nav-mobile-login,\n #nav-mobile-logout,\n #nav-mobile-register {\n display: none;\n \n }\n #nav-mobile-logout, #nav-mobile-login{\n position: absolute;\n right: 1rem;\n }\n #nav-mobile-register {\n position: absolute;\n left: 1rem;\n }\n \n @media screen and (max-width: 1199px) {\n #nav-mobile-login,\n #nav-mobile-logout,\n #nav-mobile-register {\n display: block;\n }\n .navbar-top {\n flex-direction: row;\n justify-content: space-around !important;\n align-items: center;\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n width: 100%;\n }\n }\n\n @media screen and (max-width: 991px) {\n .mobile-nav .nav-toggle {\n width: 100%;\n }\n \n .mobile-nav .nav-toggle .navbar-toggler {\n float: left;\n height: 45px;\n }\n .mobile-nav .nav-toggle .form-inline {\n float: right;\n margin: 4px 0px 0px 0px;\n }\n .mobile-nav .form-inline .mobile-search {\n width: auto;\n }\n .sticky-home {\n display: none;\n }\n .dropdown-menu {\n max-height: 315px;\n overflow: auto;\n }\n ::-webkit-scrollbar {\n width: 10px;\n }\n ::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background-color: rgba(214, 214, 214, 0.8);\n box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n }\n .navbar-expand-lg .show#basic-navbar-sub {\n display: block;\n }\n .navbar .mobile-nav .navbar-collapse.show {\n padding-bottom: 20px;\n border-bottom: 0.5px solid white;\n margin-bottom: 15px;\n }\n .navbar .mobile-nav .navbar-collapse .form-inline {\n display: none;\n }\n .navbar .mobile-nav .navbar-collapse {\n margin-top: 15px;\n }\n .navbar .mobile-nav .navbar-collapse:last-child {\n border-bottom: none;\n margin-bottom: 0px;\n padding-bottom: 0px;\n margin-top: 0px;\n }\n .navbar .mobile-nav .navbar-collapse .nav-footer ul {\n list-style-type: none;\n padding: inherit;\n margin-bottom: 0rem;\n }\n .navbar .mobile-nav .navbar-collapse .nav-footer .nav-link {\n text-transform: capitalize !important;\n font-weight: 300;\n }\n .navbar .mobile-nav .dropdown-item:focus {\n background-color: #696969;\n }\n .navbar .mobile-nav .dropdown-menu .dropdown-item {\n color: white;\n }\n .navbar .mobile-nav .dropdown-menu {\n background: inherit;\n border: none;\n }\n .navbar .mobile-nav .dropdown-menu.show {\n max-height: 100px;\n }\n }\n @media screen and (min-width: 992px) {\n #basic-navbar-sub {\n display: none !important;\n }\n .navbar .mobile-nav .dropdown-menu .dropdown-item {\n color: #696969;\n }\n .navbar .mobile-nav .dropdown-menu {\n background: white;\n border: 1 px solid #708090;\n }\n .mobile-nav .nav-toggle .form-inline {\n display: none;\n }\n }\n\n @media screen and (max-width: 376px) {\n .mobile-nav .nav-toggle .form-inline .mobile-search {\n width: 60%;\n }\n .mobile-nav .nav-toggle .form-inline {\n width: 70%;\n }\n }\n @media screen and (max-width: 328px) {\n .mobile-nav .nav-toggle .form-inline .mobile-search {\n margin-right: 5px;\n }\n }\n @media screen and (max-width: 767px) {\n .logo {\n width: 100%;\n padding-left: 10px;\n padding-right: 10px;\n }\n \n }\n '
13517
13557
  )
13518
13558
  );
@@ -13642,7 +13682,7 @@ var NavNative = function NavNative(props) {
13642
13682
  ),
13643
13683
  React__default.createElement(
13644
13684
  'style',
13645
- { jsx: true },
13685
+ { jsx: 'true' },
13646
13686
  '\n @media screen and (max-width: 991px) {\n .dropdown-menu {\n max-height: 315px;\n overflow: auto;\n }\n ::-webkit-scrollbar {\n width: 10px;\n }\n ::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background-color: rgba(214, 214, 214, 0.8);\n box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n }\n .navbar-expand-lg .show#basic-navbar-sub {\n display: block;\n }\n .navbar .mobile-nav .navbar-collapse.show {\n padding-bottom: 20px;\n border-bottom: 0.5px solid white;\n margin-bottom: 15px;\n }\n .navbar .mobile-nav .navbar-collapse .form-inline {\n margin: 5px 0px;\n }\n .navbar .mobile-nav .navbar-collapse:last-child {\n border-bottom: none;\n margin-bottom: 0px;\n padding-bottom: 0px;\n }\n .navbar .mobile-nav .navbar-collapse .nav-footer ul {\n list-style-type: none;\n padding: inherit;\n margin-bottom: 0rem;\n }\n .navbar .mobile-nav .navbar-collapse .nav-footer .nav-link {\n text-transform: capitalize !important;\n font-weight: 300;\n }\n .navbar .mobile-nav .dropdown-item:focus {\n background-color: #696969;\n }\n .navbar .mobile-nav .dropdown-menu .dropdown-item {\n color: white;\n }\n .navbar .mobile-nav .dropdown-menu {\n background: inherit;\n border: none;\n }\n }\n @media screen and (min-width: 992px) {\n #basic-navbar-sub {\n display: none !important;\n }\n .navbar .mobile-nav .dropdown-menu .dropdown-item {\n color: #696969;\n }\n .navbar .mobile-nav .dropdown-menu {\n background: white;\n border: 1 px solid #708090;\n }\n }\n '
13647
13687
  )
13648
13688
  );
@@ -13720,7 +13760,7 @@ var NavNormal = function NavNormal(props) {
13720
13760
  ),
13721
13761
  React__default.createElement(
13722
13762
  'style',
13723
- { jsx: true },
13763
+ { jsx: 'true' },
13724
13764
  '\n @media screen and (max-width: 991px) {\n .dropdown-menu {\n max-height: 315px;\n overflow: auto;\n }\n ::-webkit-scrollbar {\n width: 10px;\n }\n ::-webkit-scrollbar-thumb {\n border-radius: 4px;\n background-color: rgba(214, 214, 214, 0.8);\n box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n -webkit-box-shadow: 0 0 1px rgba(255, 255, 255, 0.5);\n }\n }\n '
13725
13765
  )
13726
13766
  );
@@ -17756,7 +17796,7 @@ var Sidebar = function Sidebar(_ref) {
17756
17796
  ),
17757
17797
  React__default.createElement(
17758
17798
  'style',
17759
- { jsx: true },
17799
+ { jsx: 'true' },
17760
17800
  '\n .sidebar {\n width: 40%;\n padding: 1rem 0 0;\n margin-left: 1rem;\n margin-right: 10%;\n }\n @media screen and (max-width: 991px) {\n .sidebar {\n width: unset;\n padding: 1.25rem;\n margin-left: 1rem;\n margin-right: 1rem;\n }\n }\n '
17761
17801
  )
17762
17802
  );
@@ -20137,8 +20177,8 @@ var YouTubeGallery = function YouTubeGallery(_ref) {
20137
20177
  //variables
20138
20178
 
20139
20179
 
20140
- var get2 = router.asPath.split('/')[1];
20141
- var get3 = router.asPath.split('/')[2].split('?')[0];
20180
+ var get2 = router && router.asPath ? router.asPath.split('/')[1] : '';
20181
+ var get3 = router && router.asPath ? router.asPath.split('/')[2].split('?')[0] : '';
20142
20182
 
20143
20183
  // Once component mounts, set the variables
20144
20184
  useEffect(function () {
@@ -20279,7 +20319,7 @@ var YouTubeGallery = function YouTubeGallery(_ref) {
20279
20319
  ),
20280
20320
  React__default.createElement(
20281
20321
  'style',
20282
- { jsx: true },
20322
+ { jsx: 'true' },
20283
20323
  '\n .vid-series .video-detail iframe {\n height: 415px !important;\n }\n span.btn {\n margin: 0 1rem;\n }\n '
20284
20324
  )
20285
20325
  );
@@ -20621,9 +20661,60 @@ var getSerializers$1 = function getSerializers(client, pageview, videoAccountIDs
20621
20661
  // ...,
20622
20662
  // feature_img { asset-> {url} }
20623
20663
  // }`
20664
+
20665
+
20624
20666
  var Feature = function Feature(props) {
20625
20667
  var dataset = props.dataset;
20626
20668
 
20669
+ var checkUrlIsExternal = function checkUrlIsExternal(url) {
20670
+ if (/(http|https?)([^\s]+)/g.test(url)) {
20671
+ return true;
20672
+ }
20673
+ return false;
20674
+ };
20675
+
20676
+ var renderUrl = function renderUrl(feature_link, feature_title, feature_body) {
20677
+ if (checkUrlIsExternal(feature_link)) {
20678
+ return React__default.createElement(
20679
+ React__default.Fragment,
20680
+ null,
20681
+ React__default.createElement(
20682
+ 'a',
20683
+ { href: feature_link, target: '_blank' },
20684
+ React__default.createElement(
20685
+ 'h3',
20686
+ { style: { color: 'white' } },
20687
+ feature_title
20688
+ ),
20689
+ React__default.createElement(
20690
+ 'p',
20691
+ { style: { color: '#eee' } },
20692
+ feature_body
20693
+ )
20694
+ )
20695
+ );
20696
+ }
20697
+
20698
+ return React__default.createElement(
20699
+ Link,
20700
+ { href: feature_link },
20701
+ React__default.createElement(
20702
+ 'a',
20703
+ null,
20704
+ React__default.createElement(
20705
+ 'h3',
20706
+ { style: { color: 'white' } },
20707
+ feature_title
20708
+ ),
20709
+ React__default.createElement(
20710
+ 'p',
20711
+ { style: { color: '#eee' } },
20712
+ feature_body
20713
+ )
20714
+ )
20715
+ );
20716
+ };
20717
+
20627
20718
  return React__default.createElement(
20628
20719
  'div',
20629
20720
  null,
@@ -20644,24 +20735,7 @@ var Feature = function Feature(props) {
20644
20735
  React__default.createElement(
20645
20736
  Carousel$1.Caption,
20646
20737
  { style: { paddingRight: '50%', left: '3rem', right: '3rem', top: '0', height: '100%', display: 'flex', justifyContent: 'center', alignItems: 'center' } },
20647
- React__default.createElement(
20648
- Link,
20649
- { href: feature_link },
20650
- React__default.createElement(
20651
- 'a',
20652
- null,
20653
- React__default.createElement(
20654
- 'h3',
20655
- { style: { color: 'white' } },
20656
- feature_title
20657
- ),
20658
- React__default.createElement(
20659
- 'p',
20660
- { style: { color: '#eee' } },
20661
- feature_body
20662
- )
20663
- )
20664
- )
20738
+ renderUrl(feature_link, feature_title, feature_body)
20665
20739
  )
20666
20740
  );
20667
20741
  })
@@ -20705,7 +20779,7 @@ var Breadcrumbs = function Breadcrumbs(_ref) {
20705
20779
  }),
20706
20780
  React__default.createElement(
20707
20781
  'style',
20708
- { jsx: true },
20782
+ { jsx: 'true' },
20709
20783
  '\n .breadcrumb {\n border: none;\n background: transparent;\n }\n .breadcrumb .breadcrumb-item a {\n color: var(--primary);\n font-size: 12px;\n }\n .breadcrumb .breadcrumb-item .active{\n font-size: 12px;\n }\n .breadcrumb-item + .breadcrumb-item::before {\n content: \'' + separator + '\';\n }\n '
20710
20784
  )
20711
20785
  );
@@ -20731,7 +20805,7 @@ var Breadcrumbs = function Breadcrumbs(_ref) {
20731
20805
  ),
20732
20806
  React__default.createElement(
20733
20807
  'style',
20734
- { jsx: true },
20808
+ { jsx: 'true' },
20735
20809
  '\n ol.breadcrumb {\n background: transparent;\n padding-left: 0.25rem;\n }\n '
20736
20810
  )
20737
20811
  );