dropdown fix

Author: pgalias

css/components.css

@@ -8,6 +8,7 @@
     box-sizing: border-box;
     font-size: @item-font-size;
     background-color: #fff;
+    padding: 0;
   }
 
   input[type=checkbox] {
@@ -33,7 +34,6 @@
   &--out {
     > .dropdown__menu {
       .transition(visibility opacity transform, @menu-transition);
-
       position: absolute;
       //top: 0;
       left: 0;
@@ -52,7 +52,10 @@
     &.dropdown--down {
       > input[type=checkbox] {
         &:checked ~ .dropdown__menu {
-          transform: translateY(100%);
+          //transform: translateY(100%);
+          transform: translateY(0);
+          top: 100%;
+          margin-top: 0;
         }
         &:not(:checked) ~ .dropdown__menu {
           transform: translateY(-30px);
@@ -63,7 +66,10 @@
     &.dropdown--up {
       > input[type=checkbox] {
         &:checked ~ .dropdown__menu {
-          transform: translateY(-@menu-font-size - 2px);
+          //transform: translateY(-@menu-font-size - 2px);
+          transform: translateY(0);
+          bottom: 100%;
+          margin-bottom: 0;
         }
         &:not(:checked) ~ .dropdown__menu {
           transform: translateY(-30px);
@@ -78,7 +84,8 @@
     &.dropdown--left {
       > input[type=checkbox] {
         &:checked ~ .dropdown__menu {
-          transform: translate(-100%, calc(~"100% - @{item-font-size}"));
+          //transform: translate(-100%, calc(~"100% - @{item-font-size}"));
+          left: -100%;
         }
         &:not(:checked) ~ .dropdown__menu {
           transform: translateX(30px);
@@ -89,13 +96,22 @@
     &.dropdown--right {
       > input[type=checkbox] {
         &:checked ~ .dropdown__menu {
-          transform: translate(100%, calc(~"100% - @{item-font-size}"));
+          //transform: translate(100%, calc(~"100% - @{item-font-size}"));
+          left: 100%;
         }
         &:not(:checked) ~ .dropdown__menu {
           transform: translateX(-30px);
         }
       }
     }
+
+    &.dropdown--left,
+    &.dropdown--right {
+      > input[type=checkbox]:checked ~ .dropdown__menu {
+        transform: translateX(0);
+        top: 0;
+      }
+    }
   }
 
   &--in {