Merge pull request #5525 from Ocelot-Social-Community/5523-make-click-on-logo-configurable

feat: 🍰 Implement `LOGO_HEADER_CLICK` As Configuration

webapp/constants/logos.js

@@ -3,6 +3,15 @@
 export default {
   LOGO_HEADER_PATH: '/img/custom/logo-horizontal.svg',
   LOGO_HEADER_WIDTH: '130px',
+  LOGO_HEADER_CLICK: {
+    externalLink: null,
+    internalPath: {
+      to: {
+        name: 'index',
+      },
+      scrollTo: '.main-navigation',
+    },
+  },
   LOGO_SIGNUP_PATH: '/img/custom/logo-squared.svg',
   LOGO_WELCOME_PATH: '/img/custom/logo-squared.svg',
   LOGO_LOGOUT_PATH: '/img/custom/logo-squared.svg',

webapp/layouts/default.vue

@@ -5,7 +5,17 @@
         <div>
           <ds-flex class="main-navigation-flex">
             <ds-flex-item :width="{ base: LOGOS.LOGO_HEADER_WIDTH }" style="margin-right: 20px">
-              <nuxt-link :to="{ name: 'index' }" v-scroll-to="'.main-navigation'">
+              <a
+                v-if="LOGOS.LOGO_HEADER_CLICK.externalLink"
+                :href="LOGOS.LOGO_HEADER_CLICK.externalLink"
+              >
+                <logo logoType="header" />
+              </a>
+              <nuxt-link
+                v-else
+                :to="LOGOS.LOGO_HEADER_CLICK.internalPath.to"
+                v-scroll-to="LOGOS.LOGO_HEADER_CLICK.internalPath.scrollTo"
+              >
                 <logo logoType="header" />
               </nuxt-link>
             </ds-flex-item>
@@ -103,31 +113,31 @@
 </template>
 
 <script>
-import Logo from '~/components/Logo/Logo'
+import { mapGetters } from 'vuex'
 import LOGOS from '../constants/logos.js'
 import headerMenu from '../constants/headerMenu.js'
-import { mapGetters } from 'vuex'
+import seo from '~/mixins/seo'
+import AvatarMenu from '~/components/AvatarMenu/AvatarMenu'
+import FilterMenu from '~/components/FilterMenu/FilterMenu.vue'
+import InviteButton from '~/components/InviteButton/InviteButton'
 import LocaleSwitch from '~/components/LocaleSwitch/LocaleSwitch'
+import Logo from '~/components/Logo/Logo'
 import SearchField from '~/components/features/SearchField/SearchField.vue'
 import Modal from '~/components/Modal'
 import NotificationMenu from '~/components/NotificationMenu/NotificationMenu'
-import seo from '~/mixins/seo'
-import FilterMenu from '~/components/FilterMenu/FilterMenu.vue'
 import PageFooter from '~/components/PageFooter/PageFooter'
-import AvatarMenu from '~/components/AvatarMenu/AvatarMenu'
-import InviteButton from '~/components/InviteButton/InviteButton'
 
 export default {
   components: {
-    Logo,
-    LocaleSwitch,
-    SearchField,
-    Modal,
-    NotificationMenu,
     AvatarMenu,
     FilterMenu,
-    PageFooter,
     InviteButton,
+    LocaleSwitch,
+    Logo,
+    Modal,
+    NotificationMenu,
+    PageFooter,
+    SearchField,
   },
   mixins: [seo],
   data() {

webapp/pages/index.vue

@@ -8,7 +8,7 @@
       <ds-grid-item v-if="showDonations" class="top-info-bar" :row-span="1" column-span="fullWidth">
         <donation-info :goal="goal" :progress="progress" />
       </ds-grid-item>
-      <!-- newsfeed -->
+      <!-- news feed -->
       <template v-if="hasResults">
         <masonry-grid-item
           v-for="post in posts"