disable twitter

Author: samipe

src/components/CompanyCarousel.vue

@@ -1,8 +1,8 @@
 <template>
   <div v-if="activeCompany">
-    <h4>
+    <!-- <h4>
       {{ $t('introduction.usedByTitle') }}
-    </h4>
+    </h4> -->
     <div class="row carousel-container pt-small pb-small bg-white bg-grey-dark-darkmode card">
       <button
         class="col-sm-1 flex center middle"
@@ -14,7 +14,7 @@
         <div
           :key="activeCompanyIndex"
           class="col-sm-10 row middle"
-          :style="!$store.state.isMobile ? 'height: 10rem;' : ''">
+          :style="!$store.state.isMobile ? 'height: 13rem;' : ''">
           <div
             class="col-sm-12 col-md-3 col-md-offset-0"
             :class="$store.state.isMobile ? 'mb-medium' : ''">
@@ -52,9 +52,9 @@
       <div class="row between">
         <button
           v-for="(company, i) in companiesShuffled.slice(5, 10)"
-          :key="company.name"
-          :aria-label="`${company.name} testimonial`"
-          :style="`background-image: url(${publicPath}img/carousel-company-icons/${company.imgName})`"
+          :key="company?.name"
+          :aria-label="`${company?.name} testimonial`"
+          :style="`background-image: url(${publicPath}img/carousel-company-icons/${company?.imgName}); ${!company.name && 'opacity: 0; pointer-events: none;'}`"
           class="img-container-small bg-white card mt-small"
           :class="activeCompanyIndex === i + 5 ? 'logo-active border-black border-thin' : ''"
           @click="activeCompanyIndex = i + 5" />
@@ -65,7 +65,7 @@
         v-for="(company, i) in companiesShuffled"
         :key="company.name"
         :aria-label="`${company.name} testimonial`"
-        :style="`background-image: url(${publicPath}img/carousel-company-icons/${company.imgName})`"
+        :style="`background-image: url(${publicPath}img/carousel-company-icons/${company.imgName}); ${!company.name && 'opacity: 0; pointer-events: none;'}`"
         class="img-container-small bg-white card mt-small"
         :class="[
           activeCompanyIndex === i ? 'logo-active border-black border-thin' : '',
@@ -100,9 +100,6 @@ export default {
   computed: {
     activeCompany() {
       return this.$tm('introduction.companies')[this.activeCompanyIndex]
-    },
-    numberOfCompanies() {
-      return this.$tm('introduction.companies').length
     }
   },
   methods: {
@@ -131,7 +128,7 @@ export default {
       const j = Math.floor(Math.random() * (i + 1));
       [companies[i], companies[j]] = [companies[j], companies[i]]
     }
-    this.companiesShuffled = companies
+    this.companiesShuffled = [...companies, {}]
     this.isDarkMode = window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches
   }
 }

src/components/PageSection.vue

@@ -11,14 +11,16 @@
         </h2>
       </div>
       <div
+        v-if="body !== ''"
         class="col-sm-12 col-lg-9"
         :class="$store.state.isMobile ? '' : 'pt-2xsmall'"
         v-html="body" />
+        <slot v-else />
     </div>
     <div
       class="row"
       :class="$store.state.isMobile ? '' : 'pl-small pr-small'">
-      <slot />
+      <slot v-if="body !== ''"/>
     </div>
   </div>
 </template>

src/content/english/main.js

@@ -102,7 +102,7 @@ export default () => ({
         imgName: 'Finnair.svg'
       },
       {
-        title: 'Finnish Tax Administration',
+        name: 'Finnish Tax Administration',
         description: `Finnish Tax Administration is using Robot Framework in multiple projects.
         Robot Framework is one of the core tools in their development to make Quality Assurance and Automation.`,
         imgName: 'Vero.svg'

src/views/Home.vue

@@ -5,14 +5,16 @@
   <navbar class="nav-desktop" />
   <div class="container mb-xlarge">
     <!-- introduction -->
-    <page-section-twitter
+    <page-section
       title-id="introduction"
-      :title="$t('introduction.title')"
-      :body="$t('introduction.body')">
-      <div class="mt-small mb-small">
-        <company-carousel />
+      :title="$t('introduction.title')">
+      <div class="col-sm-12 col-lg-9 row">
+        <div class="col-sm-12 col-lg-8 pr-small" v-html="$t('introduction.body')" />
+        <div class="col-lg-4 pt-xsmall">
+          <company-carousel />
+        </div>
       </div>
-    </page-section-twitter>
+    </page-section>
     <!-- getting started -->
     <page-section
       title-id="getting-started"