diff --git a/data/elementary/themes/edc/efl/panes.edc b/data/elementary/themes/edc/efl/panes.edc
index e9834af6f6..1706cf8172 100644
--- a/data/elementary/themes/edc/efl/panes.edc
+++ b/data/elementary/themes/edc/efl/panes.edc
@@ -98,7 +98,11 @@ group { name: "efl/panes/vertical";
             image.normal: "pane_handle_v.png";
             fill.smooth: 0;
             rel.to: "efl.bar";
-            color: 160 160 160 255;
+            color_class: "/fg/normal/panes/handle";
+         }
+         description { state: "pressed" 0.0;
+            inherit: "default" 0.0;
+            color_class: "/fg/pressed/panes/handle";
          }
       }
       part { name: "efl.event"; type: SWALLOW;
@@ -117,7 +121,7 @@ group { name: "efl/panes/vertical";
             fixed: 1 1;
             rel1.to_x: "efl.event";
             rel2.to_x: "efl.event";
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
          description { state: "disabled" 0.0;
             inherit: "default" 0.0;
@@ -127,6 +131,16 @@ group { name: "efl/panes/vertical";
    }
    programs {
       EFL_UI_CLICKABLE_PART_BIND("bar")
+      program { name: "bar_down";
+         signal: "mouse,down,1"; source: "bar";
+         action: STATE_SET "pressed" 0.0;
+         target: "dots";
+      }
+      program { name: "bar_up";
+         signal: "mouse,up,1"; source: "bar";
+         action: STATE_SET "default" 0.0;
+         target: "dots";
+      }
       program { // for efl_panes_fixed_set()
          signal: "efl,panes,fixed"; source: "efl";
          action: STATE_SET "disabled" 0.0;
@@ -225,7 +239,11 @@ group { name: "efl/panes/horizontal";
             image.normal: "pane_handle_h.png";
             fill.smooth: 0;
             rel.to: "efl.bar";
-            color: 160 160 160 255;
+            color_class: "/fg/normal/panes/handle";
+         }
+         description { state: "pressed" 0.0;
+            inherit: "default" 0.0;
+            color_class: "/fg/pressed/panes/handle";
          }
       }
       part { name: "efl.event"; type: SWALLOW;
@@ -244,7 +262,7 @@ group { name: "efl/panes/horizontal";
             fixed: 1 1;
             rel1.to_y: "efl.event";
             rel2.to_y: "efl.event";
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
          description { state: "disabled" 0.0;
             inherit: "default" 0.0;
@@ -254,6 +272,16 @@ group { name: "efl/panes/horizontal";
    }
    programs {
       EFL_UI_CLICKABLE_PART_BIND("bar")
+      program { name: "bar_down";
+         signal: "mouse,down,1"; source: "bar";
+         action: STATE_SET "pressed" 0.0;
+         target: "dots";
+      }
+      program { name: "bar_up";
+         signal: "mouse,up,1"; source: "bar";
+         action: STATE_SET "default" 0.0;
+         target: "dots";
+      }
       program { // for efl_panes_fixed_set()
          signal: "efl,panes,fixed"; source: "efl";
          action: STATE_SET "disabled" 0.0;
@@ -362,7 +390,7 @@ group { name: "efl/panes/vertical:flush";
             rel1.relative: 0.0 0.25;
             rel2.to_x: "efl.event";
             rel2.relative: 1.0 0.75;
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
          description { state: "disabled" 0.0;
             inherit: "default" 0.0;
@@ -376,13 +404,14 @@ group { name: "efl/panes/vertical:flush";
             image.normal: "shadow_circle_vert.png";
             rel1.to_x: "efl.bar";
             rel2.to_x: "efl.bar";
-            color: 255 255 255 0;
+            color_class: "/shadow/normal/panes/flush";
+            color: 255 255 255 0; // no cc
             offscale;
             visible: 0;
          }
          description { state: "active" 0.0;
             inherit: "default" 0.0;
-            color: 255 255 255 128;
+            color: 255 255 255 255; // no cc
             rel1.offset: -16 0;
             rel2.offset: 15 -1;
             visible: 1;
@@ -395,13 +424,14 @@ group { name: "efl/panes/vertical:flush";
             image.normal: "shadow_circle_vert.png";
             rel1.to_x: "efl.bar";
             rel2.to_x: "efl.bar";
-            color: 255 255 255 0;
+            color_class: "/shadow/normal/panes/flush";
+            color: 255 255 255 0; // no cc
             offscale;
             visible: 0;
          }
          description { state: "active" 0.0;
             inherit: "default" 0.0;
-            color: 255 255 255 128;
+            color: 255 255 255 255; // no cc
             rel1.offset: -16 0;
             rel2.offset: 15 -1;
             visible: 1;
@@ -413,7 +443,7 @@ group { name: "efl/panes/vertical:flush";
          description { state: "default" 0.0;
             rel1.to_x: "efl.bar";
             rel2.to_x: "efl.bar";
-            color: 51 153 255 255;
+            color_class: "/fg/normal/panes/flush";
             offscale;
             visible: 0;
          }
@@ -430,7 +460,7 @@ group { name: "efl/panes/vertical:flush";
          description { state: "default" 0.0;
             rel1.to_x: "efl.bar";
             rel2.to_x: "efl.bar";
-            color: 51 153 255 255;
+            color_class: "/fg/normal/panes/flush";
             offscale;
             visible: 0;
          }
@@ -446,7 +476,7 @@ group { name: "efl/panes/vertical:flush";
             fixed: 1 1;
             rel.to: "bar";
             rel2.relative: 0.5 1.0;
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
       }
       part { name: "bar2"; type: RECT; repeat_events: 1;
@@ -454,7 +484,7 @@ group { name: "efl/panes/vertical:flush";
             fixed: 1 1;
             rel.to: "bar";
             rel1.relative: 0.5 0.0;
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
       }
    }
@@ -599,7 +629,7 @@ group { name: "efl/panes/horizontal:flush";
             rel1.relative: 0.25 0.0;
             rel2.to_y: "efl.event";
             rel2.relative: 0.75 1.0;
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
          description { state: "disabled" 0.0;
             inherit: "default" 0.0;
@@ -613,13 +643,14 @@ group { name: "efl/panes/horizontal:flush";
             image.normal: "shadow_circle_horiz.png";
             rel1.to_y: "efl.bar";
             rel2.to_y: "efl.bar";
-            color: 255 255 255 0;
+            color_class: "/shadow/normal/panes/flush";
+            color: 255 255 255 0; // no cc
             offscale;
             visible: 0;
          }
          description { state: "active" 0.0;
             inherit: "default" 0.0;
-            color: 255 255 255 128;
+            color: 255 255 255 255; // no cc
             rel1.offset: 0 -16;
             rel2.offset: -1 15;
             visible: 1;
@@ -632,13 +663,14 @@ group { name: "efl/panes/horizontal:flush";
             image.normal: "shadow_circle_horiz.png";
             rel1.to_y: "efl.bar";
             rel2.to_y: "efl.bar";
-            color: 255 255 255 0;
+            color_class: "/shadow/normal/panes/flush";
+            color: 255 255 255 0; // no cc
             offscale;
             visible: 0;
          }
          description { state: "active" 0.0;
             inherit: "default" 0.0;
-            color: 255 255 255 128;
+            color: 255 255 255 255; // no cc
             rel1.offset: 0 -16;
             rel2.offset: -1 15;
             visible: 1;
@@ -650,7 +682,7 @@ group { name: "efl/panes/horizontal:flush";
          description { state: "default" 0.0;
             rel1.to_y: "efl.bar";
             rel2.to_y: "efl.bar";
-            color: 51 153 255 255;
+            color_class: "/fg/normal/panes/flush";
             offscale;
             visible: 0;
          }
@@ -667,7 +699,7 @@ group { name: "efl/panes/horizontal:flush";
          description { state: "default" 0.0;
             rel1.to_y: "efl.bar";
             rel2.to_y: "efl.bar";
-            color: 51 153 255 255;
+            color_class: "/fg/normal/panes/flush";
             offscale;
             visible: 0;
          }
@@ -683,7 +715,7 @@ group { name: "efl/panes/horizontal:flush";
             fixed: 1 1;
             rel.to: "bar";
             rel2.relative: 1.0 0.5;
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
       }
       part { name: "bar2"; type: RECT; repeat_events: 1;
@@ -691,7 +723,7 @@ group { name: "efl/panes/horizontal:flush";
             fixed: 1 1;
             rel.to: "bar";
             rel1.relative: 0.0 0.5;
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
       }
    }
@@ -768,7 +800,7 @@ group { name: "efl/panes/vertical:left-fold";
          repeat;
          desc { "default";
             rel.to: "dots";
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
       }
    }
@@ -778,6 +810,24 @@ group { name: "efl/panes/vertical:left-fold";
             set_int(open, 1);
          }
       }
+      program { name: "bar_down";
+         script {
+            if (get_int(open) == 1) {
+               set_state(PART:"dots", "pressed", 0.0);
+            } else if (get_int(open) == 0) {
+               set_state(PART:"dots", "closed-pressed", 0.0);
+            }
+         }
+      }
+      program { name: "bar_up";
+         script {
+            if (get_int(open) == 1) {
+               set_state(PART:"dots", "default", 0.0);
+            } else if (get_int(open) == 0) {
+               set_state(PART:"dots", "closed", 0.0);
+            }
+         }
+      }
       program { signal: "mouse,clicked,1"; source: "event";
          script {
             if (get_int(open) == 1) {
@@ -822,7 +872,7 @@ group { name: "efl/panes/vertical:right-fold";
          repeat;
          desc { "default";
             rel.to: "dots";
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
       }
    }
@@ -832,6 +882,24 @@ group { name: "efl/panes/vertical:right-fold";
             set_int(open, 1);
          }
       }
+      program { name: "bar_down";
+         script {
+            if (get_int(open) == 1) {
+               set_state(PART:"dots", "pressed", 0.0);
+            } else if (get_int(open) == 0) {
+               set_state(PART:"dots", "closed-pressed", 0.0);
+            }
+         }
+      }
+      program { name: "bar_up";
+         script {
+            if (get_int(open) == 1) {
+               set_state(PART:"dots", "default", 0.0);
+            } else if (get_int(open) == 0) {
+               set_state(PART:"dots", "closed", 0.0);
+            }
+         }
+      }
       program { signal: "mouse,clicked,1"; source: "event";
          script {
             if (get_int(open) == 1) {
@@ -876,7 +944,7 @@ group { name: "efl/panes/horizontal:up-fold";
          repeat;
          desc { "default";
             rel.to: "dots";
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
       }
    }
@@ -886,6 +954,24 @@ group { name: "efl/panes/horizontal:up-fold";
             set_int(open, 1);
          }
       }
+      program { name: "bar_down";
+         script {
+            if (get_int(open) == 1) {
+               set_state(PART:"dots", "pressed", 0.0);
+            } else if (get_int(open) == 0) {
+               set_state(PART:"dots", "closed-pressed", 0.0);
+            }
+         }
+      }
+      program { name: "bar_up";
+         script {
+            if (get_int(open) == 1) {
+               set_state(PART:"dots", "default", 0.0);
+            } else if (get_int(open) == 0) {
+               set_state(PART:"dots", "closed", 0.0);
+            }
+         }
+      }
       program { signal: "mouse,clicked,1"; source: "event";
          script {
             if (get_int(open) == 1) {
@@ -930,7 +1016,7 @@ group { name: "efl/panes/horizontal:down-fold";
          repeat;
          desc { "default";
             rel.to: "dots";
-            color: 0 0 0 0;
+            color: 0 0 0 0; // no cc
          }
       }
    }
@@ -940,6 +1026,24 @@ group { name: "efl/panes/horizontal:down-fold";
             set_int(open, 1);
          }
       }
+      program { name: "bar_down";
+         script {
+            if (get_int(open) == 1) {
+               set_state(PART:"dots", "pressed", 0.0);
+            } else if (get_int(open) == 0) {
+               set_state(PART:"dots", "closed-pressed", 0.0);
+            }
+         }
+      }
+      program { name: "bar_up";
+         script {
+            if (get_int(open) == 1) {
+               set_state(PART:"dots", "default", 0.0);
+            } else if (get_int(open) == 0) {
+               set_state(PART:"dots", "closed", 0.0);
+            }
+         }
+      }
       program { signal: "mouse,clicked,1"; source: "event";
          script {
             if (get_int(open) == 1) {