tests/org.eclipse.rap.rwt.themes.test/src/org/eclipse/rap/rwt/themes/test/fancy/Slider.test.css

/*******************************************************************************
 * Copyright (c) 2010 EclipseSource and others.
 * All rights reserved. This program and the accompanying materials
 * are made available under the terms of the Eclipse Public License v1.0
 * which accompanies this distribution, and is available at
 * http://www.eclipse.org/legal/epl-v10.html
 *
 * Contributors:
 *    EclipseSource - initial API and implementation
 ******************************************************************************/

/* Slider */

Slider {
  background-color: #f3f3f4;
}

Slider-DownButton[HORIZONTAL] {
  background-color: transparent;
  border: 1px solid #A4A4A4;
  border-radius: 2px 0px 0px 2px;
  padding: 0;
  background-image: gradient(
    linear, left top, left bottom,
    from( #ffffff ),
    color-stop( 48%, #f0f0f0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #cccccc )
  );
}

Slider-DownButton[HORIZONTAL]:pressed {
  background-image: gradient(
    linear, left top, left bottom,
    from( #e0e0e0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #b0b0b0 )
  );
}

Slider-DownButton-Icon[HORIZONTAL] {
  background-image: url( theme/fancy/icons/left.png );
}

Slider-DownButton-Icon[HORIZONTAL]:hover {
  background-image: url( theme/fancy/icons/left-hover.png );
}

Slider-UpButton[HORIZONTAL] {
  background-color: transparent;
  border: 1px solid #A4A4A4;
  border-radius: 0px 2px 2px 0px;
  padding: 0;
  background-image: gradient(
    linear, left top, left bottom,
    from( #ffffff ),
    color-stop( 48%, #f0f0f0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #cccccc )
  );
}

Slider-UpButton[HORIZONTAL]:pressed {
  background-image: gradient(
    linear, left top, left bottom,
    from( #e0e0e0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #b0b0b0 )
  );
}

Slider-UpButton-Icon[HORIZONTAL] {
  background-image: url( theme/fancy/icons/right.png );
}

Slider-UpButton-Icon[HORIZONTAL]:hover {
  background-image: url( theme/fancy/icons/right-hover.png );
}

Slider-DownButton[VERTICAL] {
  background-color: transparent;
  border: 1px solid #A4A4A4;
  border-radius: 2px 2px 0px 0px;
  padding: 0;
  background-image: gradient(
    linear, left top, right top,
    from( #ffffff ),
    color-stop( 48%, #f0f0f0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #cccccc )
  );
}

Slider-DownButton[VERTICAL]:pressed {
  background-image: gradient(
    linear, left top, right top,
    from( #e0e0e0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #b0b0b0 )
  );
}

Slider-DownButton-Icon[VERTICAL] {
  background-image: url( theme/fancy/icons/up.png );
}

Slider-DownButton-Icon[VERTICAL]:hover {
  background-image: url( theme/fancy/icons/up-hover.png );
}

Slider-UpButton[VERTICAL] {
  background-color: transparent;
  border: 1px solid #A4A4A4;
  border-radius: 0px 0px 2px 2px;
  padding: 0;
  background-image: gradient(
    linear, left top, right top,
    from( #ffffff ),
    color-stop( 48%, #f0f0f0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #cccccc )
  );
}

Slider-UpButton[VERTICAL]:pressed {
  background-image: gradient(
    linear, left top, right top,
    from( #e0e0e0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #b0b0b0 )
  );
}

Slider-UpButton-Icon[VERTICAL] {
  background-image: url( theme/fancy/icons/down.png );
}

Slider-UpButton-Icon[VERTICAL]:hover {
  background-image: url( theme/fancy/icons/down-hover.png );
}

Slider-Thumb[HORIZONTAL] {
  background-color: transparent;
  border: 1px solid #A4A4A4;
  border-radius: 2px 2px 2px 2px;
  background-image: gradient(
    linear, left top, left bottom,
    from( #ffffff ),
    color-stop( 48%, #f0f0f0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #cccccc )
  );
}

Slider-Thumb[HORIZONTAL]:pressed {
  background-image: gradient(
    linear, left top, left bottom,
    from( #e0e0e0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #b0b0b0 )
  );
}
  
Slider-Thumb[VERTICAL] {
  background-color: transparent;
  border: 1px solid #A4A4A4;
  border-radius: 2px 2px 2px 2px;
  background-image: gradient(
    linear, left top, right top,
    from( #ffffff ),
    color-stop( 48%, #f0f0f0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #cccccc )
  );
}

Slider-Thumb[VERTICAL]:pressed {
  background-image: gradient(
    linear, left top, right top,
    from( #e0e0e0 ),
    color-stop( 52%, #e0e0e0 ),
    to( #b0b0b0 )
  );
}