################################################################################
# SCROLLBAR
################################################################################

style "scrollbar" 
{
	# The values I set here have to do with the relative size of three graphic elements
    # I have used: the slider, the arrow box, and the trough. They all have the same width
    # of 15 pixels, but gtk wants to put in some spacing between them. It seems like it
    # places the sliders inside the trough with a default 1 pixel border on either side of the slider,
    # so that the trough has its width stretched by an additional two pixels(?). Setting the
    # trough border makes the arrow box sit on top of the trough squarely, by making sure that
    # the trough stays the same width as the arrowbox(?). I could be totally wrong here.
    GtkRange::trough_border = 0
    GtkRange::slider_width = 17

    # This sets the size of the steppers (arrow buttons on the end of the scrollbar). 
    # The image I am using is 15x15 pixels, and if I dont set this a one pixel line 
    # gets cut off of the top of the "up" stepper.
    GtkRange::stepper_size = 18

    # Set a minimum length for the slider. Since I set the border on the slider 
    # image to 15 pixels on either end of the slider I want the min length to be 
    # at least 30 pixels to avoid an ugly slider when gtk wants to make it smaller 
    # than 30 pixels.
    GtkScrollbar::min_slider_length = 30

	engine "pixmap" 
	{
		# Horizontal slider background
		image 
		{
            function        = BOX
            recolorable     = TRUE
            detail          = "trough"
            file            = "scrollbars/trough-scrollbar-horiz.png"
            border          = { 30, 30, 0, 0 }
            stretch         = TRUE
            orientation     = HORIZONTAL
        }
	    
	    # Vertical slider background
	    image 
		{
            function        = BOX
            recolorable     = TRUE
            detail          = "trough"
            file            = "scrollbars/trough-scrollbar-vert.png"
            border          = { 0, 0, 30, 30 }
            stretch         = TRUE
            orientation     = VERTICAL
        }

		# Normal horizontal slider
	    image 
		{
	        function        = SLIDER
	        recolorable     = TRUE
	        state           = NORMAL
	        file            = "scrollbars/slider-horiz.png"
	        border          = { 15, 15, 6, 6 }
	        stretch         = TRUE
	        orientation     = HORIZONTAL
	    }
		
		# Horizontal slider (active)
		image 
		{
	        function        = SLIDER
	        recolorable     = TRUE
	        state           = ACTIVE
	        file            = "scrollbars/slider-horiz-prelight.png"
	        border          = { 15, 15, 6, 6 }
	        stretch         = TRUE
	        orientation     = HORIZONTAL
		}

		# Horizontal slider (mouse over)
	    image 
		{
	        function        = SLIDER 
	        recolorable     = TRUE
	        state           = PRELIGHT
	        file            = "scrollbars/slider-horiz-prelight.png"
	        border          = { 15, 15, 6, 6 }
	        stretch         = TRUE
	        orientation     = HORIZONTAL
	    }
	    
	    # Horizontal slider (Insesitive)
		image 
		{
	        function        = SLIDER 
	        recolorable     = TRUE
	        state           = INSENSITIVE
	        file            = "scrollbars/slider-horiz.png"
	        border          = { 15, 15, 6, 6 }
	        stretch         = TRUE
	        orientation     = HORIZONTAL
	    }

	    # Normal vertical slider
	    image 
		{
	        function        = SLIDER
	        recolorable     = TRUE
	        state           = NORMAL
	        file            = "scrollbars/slider-vert.png"
	        border          = { 6, 6, 3, 3 }
	        stretch         = TRUE
	        orientation     = VERTICAL
		}
		
		# Vertical slider (Active)
		image 
		{
	        function        = SLIDER
	        recolorable     = TRUE
	        state           = ACTIVE
	        file            = "scrollbars/slider-vert.png"
	        border          = { 6, 6, 3, 3 }
	        stretch         = TRUE
	        orientation     = VERTICAL
		}

		# Vertical slider (mouse over)
	    image 
		{
	        function        = SLIDER 
	        recolorable     = TRUE
	        state           = PRELIGHT
	        file            = "scrollbars/slider-vert-prelight.png"
	        border          = { 6, 6, 3, 3 }
	        stretch         = TRUE
	        orientation     = VERTICAL
	    }
	    
	    # Vertical slider (Insesitive)
		image 
		{
	        function        = SLIDER 
	        recolorable     = TRUE
	        state           = INSENSITIVE
	        file            = "scrollbars/slider-vert-prelight.png"
	        border          = { 6, 6, 3, 3 }
	        stretch         = TRUE
	        orientation     = VERTICAL
	    }

################################################################################
# SCROLLBAR STEPPERS
################################################################################

	# Up
    image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= NORMAL
      file				= "scrollbars/stepper-up.png"
      #border			= { 12, 2, 2, 9 }
      stretch			= TRUE
      arrow_direction	= UP
    }
 	image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= PRELIGHT
      file				= "scrollbars/stepper-up.png"
      #border			= { 12, 2, 2, 9 }
      stretch			= TRUE
      arrow_direction	= UP
    }
 image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= ACTIVE
      file				= "scrollbars/stepper-up.png"
      #border			= { 12, 2, 2, 9 }
      stretch			= TRUE
      arrow_direction	= UP
    }
 image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= INSENSITIVE
      file				= "scrollbars/stepper-up.png"
      #border			= { 12, 2, 2, 9 }
      stretch			= TRUE
      arrow_direction	= UP
    }

 ######### DOWN ############


    image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= NORMAL
      file				= "scrollbars/stepper-down.png"
      #border			= { 12, 2, 10, 2 }
      stretch			= TRUE
      arrow_direction	= DOWN
    }
 image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= PRELIGHT
      file				= "scrollbars/stepper-down.png"
      #border			= { 12, 2, 10, 2 }
      stretch			= TRUE
      arrow_direction	= DOWN
    }
 image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= ACTIVE
      file				= "scrollbars/stepper-down.png"
      #border			= { 12, 2, 10, 2 }
      stretch			= TRUE
      arrow_direction	= DOWN
    }
 image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= INSENSITIVE
      file				= "scrollbars/stepper-down.png"
      #border			= { 12, 2, 10, 2 }
      stretch			= TRUE
      arrow_direction	= DOWN
    }

############ RIGHT ################

    image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= NORMAL
      file				= "scrollbars/stepper-right.png"
      #border			= { 2, 9, 2, 13 }
      stretch			= TRUE
      arrow_direction	= RIGHT
    }
 image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= PRELIGHT
      file				= "scrollbars/stepper-right.png"
      #border			= { 2, 9, 2, 13 }
      stretch			= TRUE
      arrow_direction	= RIGHT
    }
 image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= ACTIVE
      file				= "scrollbars/stepper-right.png"
      #border			= { 2, 9, 2, 13 }
      stretch			= TRUE
      arrow_direction	= RIGHT
    }
 image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= INSENSITIVE
      file				= "scrollbars/stepper-right.png"
      #border			= { 2, 9, 2, 13 }
      stretch			= TRUE
      arrow_direction	= RIGHT
    }

############### LEFT ###################


    image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= NORMAL
      file				= "scrollbars/stepper-left.png"
      border			= { 2, 9, 2, 13 }
      #stretch			= TRUE
      arrow_direction	= LEFT
    }
  image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= PRELIGHT
      file				= "scrollbars/stepper-left.png"
      #border			= { 2, 9, 2, 13 }
      stretch			= TRUE
      arrow_direction	= LEFT
    }
  image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= ACTIVE
      file				= "scrollbars/stepper-left.png"
      #border			= { 2, 9, 2, 13 }
      stretch			= TRUE
      arrow_direction	= LEFT
    }
  image 
    {
      function			= STEPPER
      recolorable		= TRUE
      state				= INSENSITIVE
      file				= "scrollbars/stepper-left.png"
      #border			= { 2, 9, 2, 13 }
      stretch			= TRUE
      arrow_direction	= LEFT
    }
  	}
}
class "GtkScrollbar"       		style "scrollbar"
class "GtkHScrollbar"       	style "scrollbar"
class "GtkVScrollbar"       	style "scrollbar"
