diff --git a/extensions/cpsection/aboutme/view.py b/extensions/cpsection/aboutme/view.py
index d92de87..58f3972 100644
--- a/extensions/cpsection/aboutme/view.py
+++ b/extensions/cpsection/aboutme/view.py
@@ -20,12 +20,16 @@ from gettext import gettext as _
 
 from sugar.graphics.icon import Icon
 from sugar.graphics import style
-from sugar.graphics.toolbutton import ToolButton
 from sugar.graphics.xocolor import XoColor
 
 from jarabe.controlpanel.sectionview import SectionView
 from jarabe.controlpanel.inlinealert import InlineAlert
 
+_DIRECTION_LEFT = 0
+_DIRECTION_TOP = 1
+_DIRECTION_CENTER = 2
+_DIRECTION_BOTTOM = 3
+_DIRECTION_RIGHT = 4
 
 class EventIcon(gtk.EventBox):
     __gtype_name__ = "SugarEventIcon"    
@@ -40,165 +44,80 @@ class EventIcon(gtk.EventBox):
 
         self.add(self.icon)
         self.icon.show()
-"""
-class StopButton(ToolButton):
-
-    def __init__(self, **kwargs):
-        ToolButton.__init__(self, 'activity-stop', **kwargs)
-        self.props.tooltip = _('Stop')
-        self.props.accelerator = '<Ctrl>Q'
-        self.connect('clicked', self.__stop_button_clicked_cb)
-
-    def __stop_button_clicked_cb(self, button):
-        print "out damn spot"
-"""
+
 class ColorPicker(EventIcon):
     __gsignals__ = {
         'color-changed': (gobject.SIGNAL_RUN_FIRST,
                           gobject.TYPE_NONE,
-                          ([str]))
+                          ([object]))
     }
-    def __init__(self, me, xo_color=None):
+    def __init__(self, direction):
         EventIcon.__init__(self)
-        self.icon.props.xo_color = xo_color
-        self.icon.props.icon_name = 'computer-xo'
-        self.icon.props.pixel_size = style.XLARGE_ICON_SIZE
-        self.connect('button_press_event', self.__pressed_cb, me)
-
-    def __pressed_cb(self, button, event, me):
-        me.set_random_colors()
 
-class ColorPrev(EventIcon):
-    __gsignals__ = {
-        'color-changed': (gobject.SIGNAL_RUN_FIRST,
-                          gobject.TYPE_NONE,
-                          ([str]))
-    }
-    def __init__(self, me, xo_next_color=None):
-        EventIcon.__init__(self)
-        self.icon.props.xo_color = xo_next_color
         self.icon.props.icon_name = 'computer-xo'
-        self.icon.props.pixel_size = style.STANDARD_ICON_SIZE
-        self.connect('button_press_event', self.__pressed_cb, me)
-
-    def __pressed_cb(self, button, event, me):
-        me.set_prev_colors()
+        self._direction = direction
+        self._color = None
 
-class ColorNext(EventIcon):
-    __gsignals__ = {
-        'color-changed': (gobject.SIGNAL_RUN_FIRST,
-                          gobject.TYPE_NONE,
-                          ([str]))
-    }
-    def __init__(self, me, xo_next_color=None):
-        EventIcon.__init__(self)
-        self.icon.props.xo_color = xo_next_color
-        self.icon.props.icon_name = 'computer-xo'
-        self.icon.props.pixel_size = style.STANDARD_ICON_SIZE
-        self.connect('button_press_event', self.__pressed_cb, me)
-
-    def __pressed_cb(self, button, event, me):
-        me.set_next_colors()
-
-class ColorUndo(EventIcon):
-    __gsignals__ = {
-        'color-changed': (gobject.SIGNAL_RUN_FIRST,
-                          gobject.TYPE_NONE,
-                          ([str]))
-    }
-    def __init__(self, me):
-        EventIcon.__init__(self)
-        self.icon.props.icon_name = 'edit-undo'
-        # self.icon.props.icon_name = 'view-refresh'
-        # self.icon.props.accelerator = '<Ctrl>z'
-        xocolor = XoColor()
-        xocolor.set_color("#FFFFFF,#FFFFFF")
-        self.icon.props.xo_color = xocolor
-        self.icon.props.pixel_size = style.MEDIUM_ICON_SIZE
-        self.connect('button_press_event', self.__pressed_cb, me)
-
-    def __pressed_cb(self, button, event, me):
-        me.undo_colors()
-
-class Prev(EventIcon):
-    __gsignals__ = {
-        'color-changed': (gobject.SIGNAL_RUN_FIRST,
-                          gobject.TYPE_NONE,
-                          ([str]))
-    }
-    def __init__(self, me):
-        EventIcon.__init__(self)
-        self.icon.props.icon_name = 'go-left'
-        xocolor = XoColor()
-        xocolor.set_color("#FFFFFF,#808080")
-        self.icon.props.xo_color = xocolor
-        self.icon.props.pixel_size = style.STANDARD_ICON_SIZE
-        self.connect('button_press_event', self.__pressed_cb, me)
-
-    def __pressed_cb(self, button, event, me):
-        me.set_prev_colors()
+        self.icon.props.pixel_size = style.XLARGE_ICON_SIZE
 
-class Next(EventIcon):
-    __gsignals__ = {
-        'color-changed': (gobject.SIGNAL_RUN_FIRST,
-                          gobject.TYPE_NONE,
-                          ([str]))
-    }
-    def __init__(self, me):
-        EventIcon.__init__(self)
-        self.icon.props.icon_name = 'go-right'
-        xocolor = XoColor()
-        xocolor.set_color("#FFFFFF,#808080")
-        self.icon.props.xo_color = xocolor
-        self.icon.props.pixel_size = style.STANDARD_ICON_SIZE
-        self.connect('button_press_event', self.__pressed_cb, me)
+        self.connect('button_press_event', self.__pressed_cb, direction)
+
+    def update(self, color):
+        if self._direction == _DIRECTION_CENTER:
+            self._color = color
+        elif self._direction == _DIRECTION_LEFT:
+            self._color = XoColor(color.get_prev_fill_color())
+        elif self._direction == _DIRECTION_RIGHT:
+            self._color = XoColor(color.get_prev_stroke_color())
+        elif self._direction == _DIRECTION_TOP:
+            self._color = XoColor(color.get_next_fill_color())
+        else:
+            self._color = XoColor(color.get_next_stroke_color())
+        self.icon.props.xo_color = self._color
 
-    def __pressed_cb(self, button, event, me):
-        me.set_next_colors()
+    def __pressed_cb(self, button, event, direction):
+        if direction != _DIRECTION_CENTER:
+            self.emit('color-changed', self._color)
 
 class AboutMe(SectionView):
     def __init__(self, model, alerts):
         SectionView.__init__(self)
 
         self._model = model
-        self._xo_color = XoColor(self._model.get_color_xo())
-        self._undo_colors = self._xo_color.to_string()
-        self._xo_next_color = XoColor(self._xo_color.get_next_color())
-        self._xo_prev_color = XoColor(self._xo_color.get_prev_color())
         self.restart_alerts = alerts
         self._nick_sid = 0
         self._color_valid = True
         self._nick_valid = True
-        self._color_change_handler = None
-        self._nick_change_handler = None
+        self._handlers = []
 
         self.set_border_width(style.DEFAULT_SPACING * 2)
         self.set_spacing(style.DEFAULT_SPACING)
         self._group = gtk.SizeGroup(gtk.SIZE_GROUP_HORIZONTAL)
 
-        self._nick_box = gtk.HBox(spacing=style.DEFAULT_SPACING)
-        self._nick_alert_box = gtk.HBox(spacing=style.DEFAULT_SPACING)
-        self._nick_entry = None
-        self._nick_alert = None
-        self._setup_nick()
-
+        self._color_label = gtk.HBox(spacing=style.DEFAULT_SPACING)
         self._color_box = gtk.HBox(spacing=style.DEFAULT_SPACING)
         self._color_alert_box = gtk.HBox(spacing=style.DEFAULT_SPACING)
-        self._color_picker = None
         self._color_alert = None
-        self._setup_color()        
 
+        self._pickers = {
+                _DIRECTION_CENTER: ColorPicker(_DIRECTION_CENTER),
+                _DIRECTION_LEFT: ColorPicker(_DIRECTION_LEFT),
+                _DIRECTION_RIGHT: ColorPicker(_DIRECTION_RIGHT),
+                _DIRECTION_TOP: ColorPicker(_DIRECTION_TOP),
+                _DIRECTION_BOTTOM: ColorPicker(_DIRECTION_BOTTOM)}
+
+        self._setup_color()
+        initial_color = XoColor(self._model.get_color_xo())
+        self._update_pickers(initial_color)
+
+        self._nick_box = gtk.HBox(spacing=style.DEFAULT_SPACING) 
+        self._nick_alert_box = gtk.HBox(spacing=style.DEFAULT_SPACING)
+        self._nick_entry = None
+        self._nick_alert = None
+        self._setup_nick()
         self.setup()
 
     def _setup_nick(self):
-        label_entry = gtk.Label(_('Name:'))
-        label_entry.modify_fg(gtk.STATE_NORMAL, 
-                              style.COLOR_SELECTION_GREY.get_gdk_color())
-        self._group.add_widget(label_entry)
-        label_entry.set_alignment(1, 0.5)
-        self._nick_box.pack_start(label_entry, expand=False)
-        label_entry.show()
-
         self._nick_entry = gtk.Entry()                
         self._nick_entry.modify_bg(gtk.STATE_INSENSITIVE, 
                                    style.COLOR_WHITE.get_gdk_color())
@@ -219,48 +138,26 @@ class AboutMe(SectionView):
             self._nick_alert.props.msg = self.restart_msg
             self._nick_alert.show()
 
-        self.pack_start(self._nick_box, False)
+        self._center_in_panel = gtk.Alignment(0.5)
+        self._center_in_panel.add(self._nick_box)
+        self.pack_start(self._center_in_panel, False)
         self.pack_start(self._nick_alert_box, False)
         self._nick_box.show()
         self._nick_alert_box.show()
+        self._center_in_panel.show()
     
     def _setup_color(self):                
         label_color = gtk.Label(_('Click to change your color:'))
         label_color.modify_fg(gtk.STATE_NORMAL, 
                               style.COLOR_SELECTION_GREY.get_gdk_color())
         self._group.add_widget(label_color)
-        self._color_box.pack_start(label_color, expand=False)
+        self._color_label.pack_start(label_color, expand=False)
         label_color.show()
 
-        self._color_prev = ColorPrev(self,self._xo_prev_color)
-        self._color_box.pack_start(self._color_prev, expand=False)
-        self._color_prev.show()
-        
-        self._prev = Prev(self)
-        self._color_box.pack_start(self._prev, expand=False)
-        self._prev.show()
-
-        self._color_picker = ColorPicker(self,self._xo_color)
-        self._color_box.pack_start(self._color_picker, expand=False)
-        self._color_picker.show()
-
-        self._next = Next(self)
-        self._color_box.pack_start(self._next, expand=False)
-        self._next.show()
-
-        self._color_next = ColorNext(self,self._xo_next_color)
-        self._color_box.pack_start(self._color_next, expand=False)
-        self._color_next.show()
-
-        self._color_undo = ColorUndo(self)
-        self._color_box.pack_start(self._color_undo, expand=False)
-        self._color_undo.show()
-
-        """
-        self._stop = StopButton()
-        self._color_box.pack_start(self._stop, expand=False)
-        self._stop.show()
-        """
+        for direction in sorted(self._pickers.keys()):
+            picker = self._pickers[direction]
+            picker.show()
+            self._color_box.pack_start(picker, expand=False)
 
         label_color_error = gtk.Label()
         self._group.add_widget(label_color_error)
@@ -273,94 +170,40 @@ class AboutMe(SectionView):
             self._color_alert.props.msg = self.restart_msg
             self._color_alert.show()
 
-        self.pack_start(self._color_box, False)
+        self._center_in_panel = gtk.Alignment(0.5)
+        self._center_in_panel.add(self._color_box)
+        self.pack_start(self._color_label, False)
+        self.pack_start(self._center_in_panel, False)
         self.pack_start(self._color_alert_box, False)        
+        self._color_label.show()
         self._color_box.show()
         self._color_alert_box.show()
-    
-    def set_prev_colors(self):
-        # update next color to the current color
-        self._xo_next_color.set_color(self._xo_color.to_string())
-        self._color_next.icon.props.xo_color = self._xo_next_color
-        self._color_next.emit('color-changed', self._xo_next_color.to_string())
-        # update color picker to the prev color
-        self._undo_colors = self._xo_color.to_string()
-        self._xo_color.set_color(self._xo_prev_color.to_string())
-        self._color_picker.icon.props.xo_color = self._xo_color
-        self._color_picker.emit('color-changed', self._xo_color.to_string())
-        # update prev color to its prev color
-        self._xo_prev_color.set_color(self._xo_prev_color.get_prev_color())
-        self._color_prev.icon.props.xo_color = self._xo_prev_color
-        self._color_prev.emit('color-changed', self._xo_prev_color.to_string())
-
-    def set_random_colors(self):
-        # update this color to a random color
-        self._undo_colors = self._xo_color.to_string()
-        self._xo_color.set_color(self._xo_color.get_random_color())
-        self._color_picker.icon.props.xo_color = self._xo_color
-        self._color_picker.emit('color-changed', self._xo_color.to_string())
-        # update prev color from the current color
-        self._xo_prev_color.set_color(self._xo_color.get_prev_color())
-        self._color_prev.icon.props.xo_color = self._xo_prev_color
-        self._color_prev.emit('color-changed', self._xo_prev_color.to_string())
-        # update next color from the current color
-        self._xo_next_color.set_color(self._xo_color.get_next_color())
-        self._color_next.icon.props.xo_color = self._xo_next_color
-        self._color_next.emit('color-changed', self._xo_next_color.to_string())
-
-    def set_next_colors(self):
-        # update prev color to the current color
-        self._xo_prev_color.set_color(self._xo_color.to_string())
-        self._color_prev.icon.props.xo_color = self._xo_prev_color
-        self._color_prev.emit('color-changed', self._xo_prev_color.to_string())
-        # update color picker to the next color
-        self._undo_colors = self._xo_color.to_string()
-        self._xo_color.set_color(self._xo_next_color.to_string())
-        self._color_picker.icon.props.xo_color = self._xo_color
-        self._color_picker.emit('color-changed', self._xo_color.to_string())
-        # update next color to its next color
-        self._xo_next_color.set_color(self._xo_next_color.get_next_color())
-        self._color_next.icon.props.xo_color = self._xo_next_color
-        self._color_next.emit('color-changed', self._xo_next_color.to_string())
-
-    def undo_colors(self):
-        # undo last change
-        tmp = self._xo_color.to_string()
-        self._xo_color.set_color(self._undo_colors)
-        self._undo_colors = tmp
-        self._color_picker.icon.props.xo_color = self._xo_color
-        self._color_picker.emit('color-changed', self._xo_color.to_string())
-        # update prev color from the current color
-        self._xo_prev_color.set_color(self._xo_color.get_prev_color())
-        self._color_prev.icon.props.xo_color = self._xo_prev_color
-        self._color_prev.emit('color-changed', self._xo_prev_color.to_string())
-        # update next color from the current color
-        self._xo_next_color.set_color(self._xo_color.get_next_color())
-        self._color_next.icon.props.xo_color = self._xo_next_color
-        self._color_next.emit('color-changed', self._xo_next_color.to_string())
+        self._center_in_panel.show()
     
     def setup(self):
         self._nick_entry.set_text(self._model.get_nick())
-        # mycolor = self._model.get_color_xo()
-        self._color_picker.icon.props.xo_color = self._xo_color
-        self._color_next.icon.props.xo_color = self._xo_next_color
-        self._color_prev.icon.props.xo_color = self._xo_prev_color
-
         self._color_valid = True
         self._nick_valid = True
         self.needs_restart = False
-        self._nick_change_handler = self._nick_entry.connect( \
-                'changed', self.__nick_changed_cb)
-        self._color_change_handler = self._color_picker.connect( \
-                'color-changed', self.__color_changed_cb)
+
+        def connect(widget, signal, cb):
+            self._handlers.append((widget, widget.connect(signal, cb)))
+
+        connect(self._nick_entry, 'changed', self.__nick_changed_cb)
+        for picker in self._pickers.values():
+            connect(picker, 'color-changed', self.__color_changed_cb)
 
     def undo(self):
-        self._color_picker.disconnect(self._color_change_handler)
-        self._nick_entry.disconnect(self._nick_change_handler)
+        for widget, handler in self._handlers:
+            widget.disconnect(handler)
         self._model.undo()
         self._nick_alert.hide()
         self._color_alert.hide()        
 
+    def _update_pickers(self, color):
+        for picker in self._pickers.values():
+            picker.update(color)
+
     def _validate(self):
         if self._nick_valid and self._color_valid:
             self.props.is_valid = True
@@ -392,8 +235,8 @@ class AboutMe(SectionView):
         self._nick_alert.show()
         return False
 
-    def __color_changed_cb(self, colorpicker, xocolor):        
-        self._model.set_color_xo(xocolor)
+    def __color_changed_cb(self, colorpicker, color):
+        self._model.set_color_xo(color.to_string())
         self.needs_restart = True
         self._color_alert.props.msg = self.restart_msg
         self._color_valid = True
@@ -401,4 +244,7 @@ class AboutMe(SectionView):
 
         self._validate()
         self._color_alert.show()
+
+        self._update_pickers(color)
+
         return False
