Fix CSS of Kebab ( #500)

TheCoder4eu · Oct 3, 2016 · 80f57f7 · 80f57f7
1 parent a7754a2
commit 80f57f7
Show file tree

Hide file tree

Showing 3 changed files with 74 additions and 1 deletion.
diff --git a/gradleResources/staticResources/less/customizations.less b/gradleResources/staticResources/less/customizations.less
@@ -77,3 +77,70 @@ a.panel-title-link {
   max-width: 100%; // Part 1: Set a maximum relative to the parent
   height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
 }
+
+//Kebabs
+.dropdown-kebab ul > li > a {
+	padding: 1px 15px;
+}
+// Kebab dropmenu
+.dropdown-kebab-bf {
+  .btn-link {
+    color: @gray-darker;
+    font-size: (@font-size-base + 4);
+    line-height: 1;
+    padding: 4px 0;
+    &:active,
+    &:focus,
+    &:hover {
+      color: @link-color;
+    }
+  }
+  .dropdown-menu {
+    left: -15px;
+    margin-top: 11px;
+    &.dropdown-menu-right {
+      left: auto;
+      right: -15px;
+      &:after,
+      &:before {
+        left: auto;
+        right: 6px;
+      }
+    }
+    &:after,
+    &:before {
+      border-bottom-color: @dropdown-border;
+      border-bottom-style: solid;
+      border-bottom-width: 10px;
+      border-left: 10px solid transparent;
+      border-right: 10px solid transparent;
+      content: "";
+      display: inline-block;
+      left: 6px;
+      position: absolute;
+      top: -11px;
+    }
+    &:after {
+      border-bottom-color: @dropdown-bg;
+      top: -10px;
+    }
+  }
+  &.dropup .dropdown-menu {
+    margin-bottom: 11px;
+    margin-top: 0;
+    &:after,
+    &:before {
+      border-bottom: none;
+      border-top-color: @dropdown-border;
+      border-top-style: solid;
+      border-top-width: 10px;
+      bottom: -11px;
+      top: auto;
+    }
+    &:after {
+      border-top-color: @dropdown-bg;
+      bottom: -10px;
+    }
+  }
+}
+
diff --git a/gradleResources/staticResources/less/pf/customizations.less b/gradleResources/staticResources/less/pf/customizations.less
@@ -82,3 +82,9 @@ a.panel-title-link {
   max-width: 100%; // Part 1: Set a maximum relative to the parent
   height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
 }
+
+//Kebabs
+.dropdown-kebab ul > li > a {
+        padding: 1px 15px;
+}
+
diff --git a/src/main/java/net/bootsfaces/component/kebab/KebabRenderer.java b/src/main/java/net/bootsfaces/component/kebab/KebabRenderer.java
@@ -70,7 +70,7 @@ public void encodeBegin(FacesContext context, UIComponent component) throws IOEx
 		//<div class="dropdown dropdown-kebab dropdown-kebab-pf">
 		rw.startElement("div", kebab);
 		rw.writeAttribute("id", kebab.getId(), "id");
-	    String s="dropdown dropdown-kebab dropdown-kebab-pf";
+	    String s="dropdown dropdown-kebab dropdown-kebab-bf dropdown-kebab-pf";
 	    if(kebab.getStyleClass()!=null){
 	    	s=s.concat(" ").concat(kebab.getStyleClass());
 	    }