Remove dropdown version of language selector (#339)

* Remove dropdown version of language selector as it failed DAC testing

* Remove unused dependency

package.json

@@ -122,7 +122,6 @@
     "rimraf": "^2.6.3",
     "sass-lint": "^1.12.1",
     "sass-loader": "^7.1.0",
-    "throttle-typescript": "^1.0.1",
     "url-loader": "^1.1.2",
     "url-search-params-polyfill": "^5.0.0",
     "webpack": "^4.26.0",

src/components/language-selector/_macro.njk

@@ -1,34 +1,11 @@
 {% macro onsLanguageSelector(params) %}
-    {% if params.languages | length <= 3 %}
-        {% set alternativeLanguages = params.languages | rejectattr("current") %}
+    {% set alternativeLanguages = params.languages | rejectattr("current") %}
 
-        <ul class="language-links u-d-no@xs@m">
-            {% for language in alternativeLanguages %}
-                <li class="language-links__item">
-                    <a href="{{ language.url }}" lang="{{ language.ISOCode }}">{{ language.text }}</a>
-                </li>
-            {% endfor %}
-        </ul>
-    {% else %}
-        {% set currentLanguage = params.languages | selectattr("current") | first %}
-
-        <div class="language-switcher u-d-no@xs@m js-language-switcher" lang="{{ currentLanguage.ISOCode }}">
-            <a class="js-language-switcher-link" href="{{ params.allLanguagesUrl }}">{{ currentLanguage.chooseLanguage }}</a>
-            <button type="button" class="u-d-no language-switcher__button js-language-switcher-button" aria-label="{{ currentLanguage.buttonAriaLabel }}">{{ currentLanguage.text }}</button>
-            <ul id="language-switcher-items" class="u-d-no language-switcher__items js-language-switcher-items">
-                {% for language in params.languages %}
-                    {% if language.ISOCode != currentLanguage.ISOCode %}
-                        <li class="language-switcher__item">
-                            <a href="{{ language.url }}" class="language-switcher__language js-language-switcher-item" lang="{{ language.ISOCode }}" tabindex="-1">{{ language.text }}</a>
-                        </li>
-                    {% endif %}
-                {% endfor %}
-                {% if currentLanguage.allLanguages and params.allLanguagesUrl %}
-                    <li class="language-switcher__item">
-                        <a href="{{ params.allLanguagesUrl }}" class="language-switcher__language js-language-switcher-item" lang="{{ currentLanguage.ISOCode }}" tabindex="-1">{{ currentLanguage.allLanguages }}</a>
-                    </li>
-                {% endif %}
-            </ul>
-        </div>
-    {% endif %}
+    <ul class="language-links u-d-no@xs@m">
+        {% for language in alternativeLanguages %}
+            <li class="language-links__item">
+                <a href="{{ language.url }}" lang="{{ language.ISOCode }}">{{ language.text }}</a>
+            </li>
+        {% endfor %}
+    </ul>
 {% endmacro %}

src/components/language-selector/language.scss

@@ -1,101 +1,3 @@
-$language-switcher-button-height: 36px;
-$language-switcher-button-padding-y: 0.5rem;
-$language-switcher-button-padding-x: 0.5rem;
-$language-switcher-chevron-size: 15px;
-
-.language-switcher {
-  display: inline-flex;
-  flex-direction: column;
-  max-height: $language-switcher-button-height;
-
-  &__button {
-    position: relative;
-    padding: $language-switcher-button-padding-y $language-switcher-button-padding-x;
-    min-width: 8rem;
-    min-height: $language-switcher-button-height;
-    border: $input-border-width solid $color-input;
-    border-radius: 3px;
-    background: transparent;
-    font-family: inherit;
-    line-height: 1;
-    text-align: left;
-
-    transition: border-color 0.2s ease-in-out;
-
-    &:focus {
-      outline: 3px solid $color-focus;
-      outline-offset: 3px;
-    }
-
-    &:after {
-      content: '';
-      display: block;
-      position: absolute;
-      top: 50%;
-      right: $language-switcher-button-padding-x;
-
-      transform: translateY(-50%);
-
-      width: $language-switcher-chevron-size;
-      height: $language-switcher-chevron-size;
-
-      background: {
-        position: center;
-        image: url(#{$static}/img/icons/icons--chevron-down.svg);
-        size: $language-switcher-chevron-size;
-        repeat: no-repeat;
-      }
-    }
-
-    &:hover,
-    &:focus {
-      border-color: $color-links-hover;
-    }
-  }
-
-  &--open &__button {
-    border-bottom-left-radius: 0;
-    border-bottom-right-radius: 0;
-    border-color: $color-links-hover;
-
-    &:after {
-      transform: translateY(-50%) rotate(180deg);
-    }
-  }
-
-  &__items {
-    z-index: 10;
-    position: relative;
-    padding: 0;
-    list-style: none;
-    border: $input-border-width solid $color-links-hover;
-    border-top: 0;
-    border-bottom-left-radius: 3px;
-    border-bottom-right-radius: 3px;
-    background: $color-white;
-    opacity: 0;
-    pointer-events: none;
-  }
-
-  &--open &__items {
-    opacity: 1;
-    pointer-events: initial;
-  }
-
-  &__item {
-    margin: 0;
-
-    &:not(:last-child) {
-      border-bottom: $input-border-width solid $color-links-hover;
-    }
-  }
-
-  &__language {
-    display: block;
-    padding: $language-switcher-button-padding-y $language-switcher-button-padding-x;
-  }
-}
-
 .language-links {
   margin: 0;
   padding: 0;

src/js/index.js

@@ -7,6 +7,5 @@ import 'components/tabs/tabs';
 import 'components/details/collapsible.dom';
 import 'components/table/scrollable-table';
 import 'components/table/sortable-table';
-import 'components/language-selector/language.dom';
 import 'components/header/header-nav';
 import 'components/feedback/feedback.dom';