Update klaro to latest version, move to left

This closes #374
FitzwilliamMuseum · May 22, 2022 · 06b86bb · 06b86bb
1 parent a485b0e
commit 06b86bb
Show file tree

Hide file tree

Showing 10 changed files with 64 additions and 38 deletions.
diff --git a/public/css/app.css b/public/css/app.css
diff --git a/public/js/app.js b/public/js/app.js
diff --git a/public/js/config.js b/public/js/config.js
@@ -10,7 +10,9 @@ var klaroConfig = {
     // You can customize the ID of the DIV element that Klaro will create
     // when starting up. If undefined, Klaro will use 'klaro'.
     elementID: 'klaro',
-
+    styling: {
+        theme: ['dark', 'left', 'narrow'],
+    },
     // You can customize the name of the cookie that Klaro uses for storing
     // user consent decisions. If undefined, Klaro will use 'klaro'.
     cookieName: 'klaro',
@@ -21,10 +23,10 @@ var klaroConfig = {
 
     // You can customize the name of the cookie that Klaro will use to
     // store user consent. If undefined, Klaro will use 'klaro'.
- 
+
     // Put a link to your privacy policy here (relative or absolute).
     privacyPolicy: 'https://www.fitzmuseum.cam.ac.uk/website/cookiepolicy',
-    
+
     // Defines the default state for applications (true=enabled by default).
     default: true,
 
@@ -102,7 +104,7 @@ var klaroConfig = {
             // The purpose(s) of this app. Will be listed on the consent notice.
             // Do not forget to add translations for all purposes you list here.
             purposes : ['analytics'],
-            
+
             // A list of regex expressions or strings giving the names of
             // cookies set by this app. If the user withdraws consent for a
             // given app, Klaro will then automatically delete all matching
@@ -130,23 +132,11 @@ var klaroConfig = {
             // once regardless how often the user toggles it on and off.
             onlyOnce: true,
         },
-        {
-            name : 'bootstrap',
-            title : 'Bootstrap CDN',
-            purposes : ['styling']
-        },
-
         {
             name : 'googleFonts',
             title : 'Google Fonts',
             purposes : ['styling']
         },
-        {
-            name : 'cloudflare',
-            title : 'Cloudflare',
-            purposes : ['security'],
-            required: true,
-        },
         {
             name : 'vimeo',
             title : 'Vimeo',
@@ -163,4 +153,4 @@ var klaroConfig = {
             purposes : ['advertising'],
         },
     ],
-}
+}
diff --git a/public/js/klaro.js b/public/js/klaro.js
diff --git a/public/mix-manifest.json b/public/mix-manifest.json
@@ -1,5 +1,5 @@
 {
-    "/js/app.js": "/js/app.js?id=b19a40db8c9e68dc1319de586654d744",
-    "/css/app.css": "/css/app.css?id=65a0f55fda7de9065ce6acff8f51028f",
+    "/js/app.js": "/js/app.js?id=20082aa7f47e21ac3abbec86f61683a3",
+    "/css/app.css": "/css/app.css?id=9846fa833154f382fb5cf2e1f6b8bfe1",
     "/css/fitzwilliam.css": "/css/fitzwilliam.css?id=3c92412680b3a24991707362abeb7fa9"
 }
diff --git a/public/js/backtotop.js → resources/js/backtotop.js b/public/js/backtotop.js → resources/js/backtotop.js
diff --git a/resources/views/departments/details.blade.php b/resources/views/departments/details.blade.php
@@ -10,7 +10,7 @@
 @section('content')
     <div class="shadow-sm">
         <div class=" p-3 mx-auto mb-3">
-            @markdown($dept['department_description'])
+            @markdown($dept['department_description'] ?? '')
             @isset($dept['email_address'])
                 <p class="text-info">
                     Email: <a href="mailto:{{ $dept['email_address']}}">{{ $dept['email_address']}}</a>

diff --git a/resources/views/includes/scripts/javascript.blade.php b/resources/views/includes/scripts/javascript.blade.php
@@ -1,7 +1,5 @@
 <script src="{{ mix('js/app.js') }}"></script>
 
-<script src="{{ asset("/js/backtotop.js") }}"></script>
-
 <!-- Cookie management -->
 <script defer type="text/javascript" src="{{ asset("/js/config.js")}}"></script>
 <script defer type="text/javascript" src="{{ asset("/js/klaro.js")}}"></script>

diff --git a/resources/views/includes/structure/footer.blade.php b/resources/views/includes/structure/footer.blade.php
@@ -173,32 +173,70 @@
                 <h3 class="visually-hidden">Join our conversations</h3>
                 <p class="share text-center">
                     <a aria-label="Fitzwilliam Museum twitter account" href="https://twitter.com/FitzMuseum_UK">
-                        <img src="{{ asset( "/images/svg/twitter.svg") }}" width="48" class="eden my-2 mx-2"/>
+                        <img src="{{ asset( "/images/svg/twitter.svg") }}"
+                             width="48"
+                             height="48"
+                             alt="Twitter logo"
+                             class="eden my-2 mx-2"
+                        />
                     </a>
                     <a aria-label="Fitzwilliam Museum instagram account" href="https://www.instagram.com/fitzmuseum_uk">
-                        <img src="{{ asset( "/images/svg/instagram.svg") }}" width="48" class="eden my-2 mx-2"/>
+                        <img src="{{ asset( "/images/svg/instagram.svg") }}"
+                             width="48"
+                             height="48"
+                             alt="Instagram logo"
+                             class="eden my-2 mx-2"
+                        />
                     </a>
                     <a aria-label="Fitzwilliam Museum facebook account"
                        href="https://www.facebook.com/fitzwilliammuseum/">
-                        <img src="{{ asset( "/images/svg/facebook.svg") }}" width="48" class="eden my-2 mx-2"/>
+                        <img src="{{ asset( "/images/svg/facebook.svg") }}"
+                             width="48"
+                             height="48"
+                             alt="Facebook logo"
+                             class="eden my-2 mx-2"
+                        />
                     </a>
                     <a aria-label="Fitzwilliam Museum linkedin account"
                        href="https://www.linkedin.com/company/the-fitzwilliam-museum/">
-                        <img src="{{ asset( "/images/svg/linkedin.svg") }}" width="48" class="eden my-2 mx-2"/>
+                        <img src="{{ asset( "/images/svg/linkedin.svg") }}"
+                             width="48"
+                             height="48"
+                             alt="Linkin logo"
+                             class="eden my-2 mx-2"
+                        />
                     </a>
-                    <a aria-label="Fitzwilliam Museum sketchfab account"
-                       href="https://www.sketchfab.com/fitzwilliammuseum/">
-                        <img src="{{ asset( "/images/logos/sketchfab-logo.svg") }}" width="48" class="eden my-2 mx-2"/>
+                    <a aria-label="Fitzwilliam Museum sketchfab account" href="https://www.sketchfab.com/fitzwilliammuseum/">
+                        <img src="{{ asset( "/images/logos/sketchfab-logo.svg") }}"
+                             width="48"
+                             height="48"
+                             alt="Sketchfab logo"
+                             class="eden my-2 mx-2"
+                        />
                     </a>
-                    <a aria-label="Fitzwilliam Museum github account"
-                       href="https://www.github.com/fitzwilliammuseum/">
-                        <img src="{{ asset( "/images/svg/github.svg") }}" width="48" class="eden my-2 mx-2"/>
+                    <a aria-label="Fitzwilliam Museum github account" href="https://www.github.com/fitzwilliammuseum/">
+                        <img src="{{ asset( "/images/svg/github.svg") }}"
+                             width="48"
+                             class="eden my-2 mx-2"
+                             alt="Github logo"
+                             height="48"
+                        />
                     </a>
                     <a aria-label="Watch our YouTube videos" href="https://www.youtube.com/channel/UCFwhw5uPJWb4wVEU3Y2nScg">
-                        <img src="{{ asset( "/images/svg/youtube.svg") }}" width="48" class="eden my-2 mx-2"/>
+                        <img src="{{ asset( "/images/svg/youtube.svg") }}"
+                             width="48"
+                             class="eden my-2 mx-2"
+                             alt="Youtube logo"
+                             height="48"
+                        />
                     </a>
                     <a aria-label="Fitzwilliam Museum news feed" href="{{route("feeds.news")}}">
-                        <img src="{{ asset( "/images/svg/rss.svg") }}" width="48" class="eden my-2 mx-2"/>
+                        <img src="{{ asset( "/images/svg/rss.svg") }}"
+                             width="48"
+                             class="eden my-2 mx-2"
+                             height="48"
+                             alt="RSS logo"
+                        />
                     </a>
                 </p>
             </div>

diff --git a/webpack.mix.js b/webpack.mix.js
@@ -12,7 +12,7 @@ require('laravel-mix-purgecss');
  */
 
 mix.styles(['resources/css/site.css','resources/css/top.css'], 'public/css/fitzwilliam.css').version();
-mix.js('resources/js/app.js', 'public/js')
+mix.js(['resources/js/app.js','resources/js/backtotop.js'], 'public/js')
     .sass('resources/sass/app.scss', 'public/css').purgeCss({safelist: { deep: [/carousel/] }}).version();
 mix.webpackConfig({
     stats: {