Assume fomantic-ui in stead of semantic-ui and add some custom styling for search and action tables

app/assets/javascripts/dunlop-semantic/ui-dropdown.coffee

@@ -1,15 +1,17 @@
 Dunlop.register_setup 'ui-dropdown', (target) ->
-  target.find('.ui.dropdown').each ->
+  target.find('.ui.dropdown').dropdown() # assume fomantic that has the clearable class option, a lot better than the below custom code
-    el = $(@)
+#Dunlop.register_setup 'ui-dropdown', (target) ->
-    settings = el.data() || {}
+#  target.find('.ui.dropdown').each ->
-    can_clear = not el.find('option:first').val()
+#    el = $(@)
-    settings.fireOnInit = true
+#    settings = el.data() || {}
-    settings.onChange = (value, text, item) ->
+#    can_clear = not el.find('option:first').val()
-      return unless can_clear
+#    settings.fireOnInit = true
-      dropdown = $(@)
+#    settings.onChange = (value, text, item) ->
-      if value
+#      return unless can_clear
-        clear_icon = $('<i class="delete icon"></i>').click ->
+#      dropdown = $(@)
-          dropdown.dropdown('clear')
+#      if value
-          $(@).remove()
+#        clear_icon = $('<i class="delete icon"></i>').click ->
-        el.after clear_icon
+#          dropdown.dropdown('clear')
-    el.dropdown settings
+#          $(@).remove()
+#        el.after clear_icon
+#    el.dropdown settings

app/assets/stylesheets/dunlop-semantic-ui.sass

@@ -5,6 +5,7 @@
 @import ./dunlop-semantic/convenience-helpers
 @import ./dunlop/components/environment-ribbon
 //@import ./dunlop/components/user_management
+@import ./dunlop-semantic/tables
 
 .ui.selection.dropdown > .delete.icon
   margin-right: 6px

app/assets/stylesheets/dunlop-semantic/tables.sass

@@ -0,0 +1,22 @@
+table.ui.table
+  .actions
+    text-align: right
+  thead
+    tr.search
+      th, td
+        padding-top: 2px
+        padding-bottom: 2px
+        .clear-filters-button
+          display: none
+      &.conditions-present
+        th, td
+          background-color: #d2e1ec
+          .clear-filters-button
+            display: inline-block
+      .column-filter.actions
+        min-width: 85px
+        padding-right: 3px
+  tbody
+    td.actions
+      min-width: 112px
+      padding-right: 3px