Remove icons from sections

7 files changed, 11 insertions, 49 deletions

diff --git a/content/_data/landing.yaml b/content/_data/landing.yaml
index 2e5fd541..83917cda 100644
--- a/content/_data/landing.yaml
+++ b/content/_data/landing.yaml
@@ -10,16 +10,8 @@ quickLinks:
   - title: Command line Git
     url: '/ee/gitlab-basics/start-using-git.html'
 
-##
-# Important: If you update an icon property here,
-# you will need to also add it to the $icons variable
-# in content/assets/stylesheets/_landing.scss in
-# order for it to appear when the component is rendered
-# as an accordion (small-width screens).
-#
 sectionTabs:
   - title: Use GitLab
-    icon: tanuki
     refs:
       - '/ee/topics/git/index.md'
       - '/ee/topics/set_up_organization.md'
@@ -36,7 +28,6 @@ sectionTabs:
       - '/ee/policy/experiment-beta-support.md'
       - '/ee/user/version.md'
   - title: Tutorials
-    icon: book
     refs:
       - '/ee/tutorials/gitlab_navigation.md'
       - '/ee/tutorials/learn_git.md'
@@ -46,7 +37,6 @@ sectionTabs:
       - '/ee/tutorials/infrastructure.md'
       - '/ee/tutorials/develop.md'
   - title: Subscribe
-    icon: plus-square-o
     refs:
       - '/ee/subscriptions/choosing_subscription.md'
       - '/ee/subscriptions/gitlab_com/index.md'
@@ -57,7 +47,6 @@ sectionTabs:
       - '/ee/subscriptions/quarterly_reconciliation.md'
       - '/ee/ci/pipelines/cicd_minutes.md'
   - title: Install
-    icon: download
     refs:
       - '/ee/install/requirements.md'
       - '/ee/install/install_methods.md'
@@ -68,7 +57,6 @@ sectionTabs:
       - '/runner/install/index.md'
       - '/runner/configuration/index.md'
   - title: Administer
-    icon: admin
     refs:
       - '/ee/administration/get_started.md'
       - '/ee/user/feature_flags.md'
@@ -80,7 +68,6 @@ sectionTabs:
       - '/ee/security/index.md'
       - '/ee/user/profile/account/create_accounts.md'
   - title: Extend
-    icon: connected
     refs:
       - '/ee/integration/index.md'
       - '/ee/user/project/integrations/webhooks.md'
@@ -91,7 +78,6 @@ sectionTabs:
 
 secondarySections:
   - title: Contribute
-    icon: merge-request
     links:
       - title: GitLab
         url: '/ee/development/contributing/'
@@ -106,7 +92,6 @@ secondarySections:
       - title: GitLab documentation
         url: 'ee/development/documentation/'
   - title: Solutions
-    icon: todo-done
     links:
       - title: Amazon Web Services
         url: '/ee/solutions/cloud/aws/'
diff --git a/content/assets/stylesheets/_landing.scss b/content/assets/stylesheets/_landing.scss
index 5bf0611a..a575ae18 100644
--- a/content/assets/stylesheets/_landing.scss
+++ b/content/assets/stylesheets/_landing.scss
@@ -50,13 +50,6 @@
       margin-right: -1rem;
     }
 
-    $icons: tanuki, book, plus-square-o, download, admin, connected;
-    @each $icon in $icons {
-      &.#{$icon} .gl-button-text::before {
-        content: url("/assets/vendor/icons-stacked.svg##{$icon}");
-      }
-    }
-
     .collapse {
       margin-left: 0;
       border-bottom: 1px solid $theme-indigo-100;
diff --git a/content/frontend/default/components/tabs_section.vue b/content/frontend/default/components/tabs_section.vue
index 9a6f5cd4..a3043c82 100644
--- a/content/frontend/default/components/tabs_section.vue
+++ b/content/frontend/default/components/tabs_section.vue
@@ -2,7 +2,6 @@
 import {
   GlAccordion,
   GlAccordionItem,
-  GlIcon,
   GlTabs,
   GlTab,
   GlSafeHtmlDirective as SafeHtml,
@@ -19,7 +18,6 @@ export default {
   components: {
     GlTabs,
     GlTab,
-    GlIcon,
     GlAccordion,
     GlAccordionItem,
   },
@@ -70,28 +68,19 @@ export default {
     <gl-tabs
       v-if="hasValidContent && isWideScreen"
       :sync-active-tab-with-query-params="true"
-      class="gl-border-b"
+      class="gl-border-b gl-mb-5"
     >
       <gl-tab
         v-for="(title, key) in tabTitles"
         :key="key"
         v-safe-html:[safe_html_config]="tabContents[key]"
-        :query-param-value="title.titleText"
-      >
-        <template #title>
-          <gl-icon v-if="title.icon" :name="title.icon" class="gl-mr-2" />
-          <span>{{ title.titleText }}</span>
-        </template>
-      </gl-tab>
+        :title="title"
+        :query-param-value="title"
+      />
     </gl-tabs>
 
     <gl-accordion v-else :auto-collapse="false" :header-level="2" class="gl-my-5">
-      <gl-accordion-item
-        v-for="(title, key) in tabTitles"
-        :key="key"
-        :title="title.titleText"
-        :class="title.icon"
-      >
+      <gl-accordion-item v-for="(title, key) in tabTitles" :key="key" :title="title">
         <div v-safe-html:[safe_html_config]="tabContents[key]"></div>
       </gl-accordion-item>
     </gl-accordion>
diff --git a/content/frontend/default/default.js b/content/frontend/default/default.js
index e498aea8..10264105 100644
--- a/content/frontend/default/default.js
+++ b/content/frontend/default/default.js
@@ -91,7 +91,7 @@ document.addEventListener('DOMContentLoaded', async () => {
     const tabContents = [];
 
     tabset.querySelectorAll('.tab-title').forEach((tab) => {
-      tabTitles.push({ titleText: tab.innerText, icon: null });
+      tabTitles.push(tab.innerText);
       tabContents.push(getNextUntil(tab, '.tab-title'));
     });
 
diff --git a/content/frontend/landing/featured_sections.js b/content/frontend/landing/featured_sections.js
index 4ef32702..6c325359 100644
--- a/content/frontend/landing/featured_sections.js
+++ b/content/frontend/landing/featured_sections.js
@@ -12,7 +12,7 @@ document.addEventListener('DOMContentLoaded', () => {
     const tabContents = [];
 
     tabset.querySelectorAll('.site-section').forEach((tab) => {
-      tabTitles.push({ titleText: tab.dataset.sectionTitle, icon: tab.dataset.sectionIcon });
+      tabTitles.push(tab.dataset.sectionTitle);
       tabContents.push(tab.innerHTML);
     });
 
diff --git a/content/index.erb b/content/index.erb
index 19353cf8..ecd10f1d 100644
--- a/content/index.erb
+++ b/content/index.erb
@@ -34,7 +34,7 @@ title: GitLab Documentation
 
       <div class="featured-sections js-tabs">
         <% @items['/_data/landing.yaml'][:sectionTabs].each do |tab| %>
-          <div data-section-title="<%= tab[:title] %>" data-section-icon="<%= tab[:icon] %>" class="site-section">
+          <div data-section-title="<%= tab[:title] %>" class="site-section">
             <div class="site-section-inner gl-pt-3 gl-pb-5">
               <% if tab[:refs] %>
                 <% tab[:refs].each do |ref| %>
@@ -55,9 +55,7 @@ title: GitLab Documentation
       <div class="secondary-sections gl-md-display-flex">
           <% @items['/_data/landing.yaml'][:secondarySections].each do |section| %>
             <div class="gl-mr-7">
-              <h3 class="gl-mb-3 gl-heading-scale-500 gl-text-theme-indigo-900">
-                <%= icon(section[:icon], "16", "gl-ml-0! gl-vertical-align-middle!") %> <%= section[:title] %>
-                </h3>
+              <h3 class="gl-mb-3 gl-heading-scale-500 gl-text-theme-indigo-900"><%= section[:title] %></h3>
               <ul class="gl-display-grid gl-grid-template-columns-2 gl-pl-0 gl-font-sm gl-list-style-none">
                 <% section[:links].each do |link| %>
                   <li><a href="<%= link[:url] %>"><%= link[:title] %></a></li>
diff --git a/spec/frontend/default/components/tabs_section_spec.js b/spec/frontend/default/components/tabs_section_spec.js
index ac009cf1..0d19097e 100644
--- a/spec/frontend/default/components/tabs_section_spec.js
+++ b/spec/frontend/default/components/tabs_section_spec.js
@@ -9,10 +9,7 @@ import TabsSection from '../../../../content/frontend/default/components/tabs_se
 describe('content/frontend/default/components/tabs_section.vue', () => {
   it('Tabs are visible', () => {
     const propsData = {
-      tabTitles: [
-        { titleText: 'Tab one', icon: null },
-        { titleText: 'Tab two', icon: null },
-      ],
+      tabTitles: ['Tab one', 'Tab two'],
       tabContents: ['Tab one content', 'Tab two content'],
     };
     const wrapper = shallowMount(TabsSection, { propsData });
@@ -21,7 +18,7 @@ describe('content/frontend/default/components/tabs_section.vue', () => {
 
   it('validateTabContents', () => {
     const propsData = {
-      tabTitles: [{ titleText: 'Tab one', icon: null }],
+      tabTitles: ['Tab one'],
       tabContents: ['Tab one content', 'Tab two content'],
     };
     const wrapper = shallowMount(TabsSection, { propsData });