CSS: Filter pills.

Author: evoluteur

sass/action-filter.scss

@@ -1,7 +1,7 @@
 //  Evolutility-UI-jQuery :: action-filter.css
 
 //  https://github.com/evoluteur/evolutility-ui-jquery
-//  (c) 2017 Olivier Giulieri
+//  (c) 2020 Olivier Giulieri
 
 $color-condition: #f0ad4e;
 
@@ -19,14 +19,18 @@ $color-condition: #f0ad4e;
 
 .evo-zfilters{
 
-  padding-bottom: 6px;
+  padding: 6px 0;
 
   > a {
-    //background-color: $color-condition;
-    //color: #fff;
+    display: inline-block;
     margin: 1px 2px 2px 1px;
-    padding: 3px 2px;
+    padding: 0 5px 3px 10px;
+    border: silver 1px solid;
+    border-radius: 15px;
     clear: left;
+    text-decoration: none;
+    //background-color: $color-condition;
+    //color: #fff;
 /*
     &:hover,
     &:active{
@@ -40,7 +44,7 @@ $color-condition: #f0ad4e;
     }
     >button{
       float: none !important;
-      margin: 2px 2px 0 4px;
+      margin: 2px 2px 0 10px;
     }
   }
 
@@ -58,7 +62,11 @@ $color-condition: #f0ad4e;
   }
 }
 .evo-filters{
+  position: relative;
   >.close{
+      position: absolute;
+      right: 5px;
+      top: 5px;
     margin-right: 4px;
   }
 }
@@ -95,6 +103,7 @@ $color-condition: #f0ad4e;
   > span{
     float: left;
     margin:1px 6px 6px 1px;
+    padding: 3px 5px;
     font-size: 1.1em;
     width:auto;
   }