From 19f4aef78c5dc7b92d12e4af53122163f1fe40b7 Mon Sep 17 00:00:00 2001
From: Bass Jobsen <bass@w3masters.nl>
Date: Wed, 6 Jan 2016 09:03:53 +0100
Subject: [PATCH] refactor scss

---
 bower.json       |  4 ++--
 typeaheadjs.css  | 18 +++++++-----------
 typeaheadjs.less | 40 ----------------------------------------
 typeaheadjs.scss | 20 +++-----------------
 4 files changed, 12 insertions(+), 70 deletions(-)
 delete mode 100644 typeaheadjs.less

diff --git a/bower.json b/bower.json
index 543ac66..c144c8f 100644
--- a/bower.json
+++ b/bower.json
@@ -6,8 +6,8 @@
     "typeaheadjs.scss"
   ],
   "dependencies": {
-    "bootstrap": "~3.3",
-    "typeahead.js": "~0.10.0"
+    "bootstrap": "4.0",
+    "typeahead.js": "~0.11.0"
   },
   "ignore":[
     ".gitignore",
diff --git a/typeaheadjs.css b/typeaheadjs.css
index 7dab8ab..efd2f95 100644
--- a/typeaheadjs.css
+++ b/typeaheadjs.css
@@ -1,4 +1,4 @@
-span.twitter-typeahead .tt-menu, span.twitter-typeahead .tt-dropdown-menu {
+.dropdown-menu, span.twitter-typeahead .tt-menu {
   position: absolute;
   top: 100%;
   left: 0;
@@ -29,18 +29,18 @@ span.twitter-typeahead .tt-suggestion {
   white-space: nowrap;
   background: none;
   border: 0; }
-   span.twitter-typeahead .tt-suggestion:focus, .dropdown-item:hover, span.twitter-typeahead .tt-suggestion:hover {
+span.twitter-typeahead .tt-suggestion:focus, .dropdown-item:hover, span.twitter-typeahead .tt-suggestion:hover {
     color: #2b2d2f;
     text-decoration: none;
     background-color: #f5f5f5; }
-  span.twitter-typeahead .active.tt-suggestion, span.twitter-typeahead .tt-suggestion.tt-cursor, .dropdown-item.active:focus, span.twitter-typeahead .active.tt-suggestion:focus, span.twitter-typeahead .tt-suggestion.tt-cursor:focus, .dropdown-item.active:hover, span.twitter-typeahead .active.tt-suggestion:hover, span.twitter-typeahead .tt-suggestion.tt-cursor:hover {
+span.twitter-typeahead .active.tt-suggestion, span.twitter-typeahead .tt-suggestion.tt-cursor, span.twitter-typeahead .active.tt-suggestion:focus, span.twitter-typeahead .tt-suggestion.tt-cursor:focus, span.twitter-typeahead .active.tt-suggestion:hover, span.twitter-typeahead .tt-suggestion.tt-cursor:hover {
     color: #fff;
     text-decoration: none;
     background-color: #0275d8;
     outline: 0; }
-  span.twitter-typeahead .disabled.tt-suggestion, .dropdown-item.disabled:focus, span.twitter-typeahead .disabled.tt-suggestion:focus, .dropdown-item.disabled:hover, span.twitter-typeahead .disabled.tt-suggestion:hover {
+span.twitter-typeahead .disabled.tt-suggestion, span.twitter-typeahead .disabled.tt-suggestion:focus, span.twitter-typeahead .disabled.tt-suggestion:hover {
     color: #818a91; }
-  span.twitter-typeahead .disabled.tt-suggestion:focus, .dropdown-item.disabled:hover, span.twitter-typeahead .disabled.tt-suggestion:hover {
+span.twitter-typeahead .disabled.tt-suggestion:focus, span.twitter-typeahead .disabled.tt-suggestion:hover {
     text-decoration: none;
     cursor: not-allowed;
     background-color: transparent;
@@ -50,9 +50,5 @@ span.twitter-typeahead {
   width: 100%; }
   .input-group span.twitter-typeahead {
     display: block !important; }
-    .input-group span.twitter-typeahead .tt-dropdown-menu {
-      top: 32px !important; }
-  .input-group.input-group-lg span.twitter-typeahead .tt-dropdown-menu {
-    top: 44px !important; }
-  .input-group.input-group-sm span.twitter-typeahead .tt-dropdown-menu {
-    top: 28px !important; }
+    .input-group span.twitter-typeahead .tt-menu {
+      top: 2.375rem !important; }
diff --git a/typeaheadjs.less b/typeaheadjs.less
deleted file mode 100644
index c331557..0000000
--- a/typeaheadjs.less
+++ /dev/null
@@ -1,40 +0,0 @@
-span.twitter-typeahead {
-  width: 100%;
-
-  .tt-menu {
-    &:extend(.dropdown-menu);
-  }
-
-  .tt-dropdown-menu {
-    &:extend(.dropdown-menu);
-  }
-
-  .tt-suggestion {
-    &:extend(.dropdown-menu > li > a);
-    &:hover,
-    &:focus {
-      &:extend(.dropdown-menu > .active > a);
-    }
-  }
-
-  .tt-suggestion.tt-cursor {
-    &:extend(.dropdown-menu > .active > a);
-  }
-
-  .input-group & {
-    display: block !important;
-    .tt-dropdown-menu {
-      top:32px !important;
-    }
-  }
-  .input-group.input-group-lg & {
-    .tt-dropdown-menu {
-      top:44px !important;
-    }
-  }
-  .input-group.input-group-sm & {
-    .tt-dropdown-menu {
-      top:28px !important;
-    }
-  }
-}
diff --git a/typeaheadjs.scss b/typeaheadjs.scss
index 919b306..90227dd 100644
--- a/typeaheadjs.scss
+++ b/typeaheadjs.scss
@@ -1,4 +1,3 @@
-@import '../bootstrap4/bootstrap-4-dev/scss/bootstrap.scss';
 span.twitter-typeahead {
   width: 100%;
 
@@ -6,10 +5,6 @@ span.twitter-typeahead {
     @extend .dropdown-menu;
   }
 
-  .tt-dropdown-menu {
-    @extend .dropdown-menu;
-  }
-
   .tt-suggestion {
     @extend .dropdown-item;
   }
@@ -18,20 +13,11 @@ span.twitter-typeahead {
      @extend .dropdown-item.active;
   }
 
+
   .input-group & {
     display: block !important;
-    .tt-dropdown-menu {
-      top:32px !important;
-    }
-  }
-  .input-group.input-group-lg & {
-    .tt-dropdown-menu {
-      top:44px !important;
-    }
-  }
-  .input-group.input-group-sm & {
-    .tt-dropdown-menu {
-      top:28px !important;
+    .tt-menu {
+      top:(2 * $input-padding-y + $font-size-base*$line-height + 2 * $input-btn-border-width/$font-size-root) !important;
     }
   }
 }
-- 
GitLab