You are here

Home » API reference » Select with Style 7

Plain Jane - pink.css in Select with Style 7

Same filename in this branch
  1. 7 select_with_style/css/Plain Jane - pink.css
  2. 7 slide_with_style/css/Plain Jane - pink.css
.ui-slider-horizontal .ui-widget-header {
  background-image:         linear-gradient(left, lightgrey 0%, white 75%, lightpink 100%);
  background-image:    -moz-linear-gradient(left, lightgrey 0%, white 75%, lightpink 100%);
  background-image: -webkit-linear-gradient(left, lightgrey 0%, white 75%, lightpink 100%);
}
.ui-slider-vertical .ui-widget-header {
  background-image:         linear-gradient(bottom, lightgrey 0%, white 75%, lightpink 100%);
  background-image:    -moz-linear-gradient(bottom, lightgrey 0%, white 75%, lightpink 100%);
  background-image: -webkit-linear-gradient(bottom, lightgrey 0%, white 75%, lightpink 100%);
}

.ui-slider .ui-state-default {
  border: 1px solid #bbb;
}

.ui-slider .slider-bubble {
	background-color: #ffdddd; /* pale pink */
  border: 1px solid grey;
}

File

slide_with_style/css/Plain Jane - pink.css
View source 
  1. 

  2. .ui-slider-horizontal .ui-widget-header {

  3.   background-image:         linear-gradient(left, lightgrey 0%, white 75%, lightpink 100%);

  4.   background-image:    -moz-linear-gradient(left, lightgrey 0%, white 75%, lightpink 100%);

  5.   background-image: -webkit-linear-gradient(left, lightgrey 0%, white 75%, lightpink 100%);

  6. }

  7. .ui-slider-vertical .ui-widget-header {

  8.   background-image:         linear-gradient(bottom, lightgrey 0%, white 75%, lightpink 100%);

  9.   background-image:    -moz-linear-gradient(bottom, lightgrey 0%, white 75%, lightpink 100%);

  10.   background-image: -webkit-linear-gradient(bottom, lightgrey 0%, white 75%, lightpink 100%);

  11. }

  12. 

  13. .ui-slider .ui-state-default {

  14.   border: 1px solid #bbb;

  15. }

  16. 

  17. .ui-slider .slider-bubble {

  18. 	background-color: #ffdddd; /* pale pink */

  19.   border: 1px solid grey;

  20. }

  21.