X-Git-Url: http://review.tizen.org/git/?a=blobdiff_plain;f=src%2Fthemes%2Ftizen%2Fcommon%2Fjquery.mobile.tizen.toggleswitch.less;h=784ae083ba44aeebb766842753a881ca1167851c;hb=7e64e1780dd8f40528017724fbb8ebd94ee9f45b;hp=ede462ec5daf05bf9af8294f335db1b650d6b5d2;hpb=49951de8bccbdaa0915ca7c5622d5e30d4371f70;p=platform%2Fframework%2Fweb%2Fweb-ui-fw.git

diff --git a/src/themes/tizen/common/jquery.mobile.tizen.toggleswitch.less b/src/themes/tizen/common/jquery.mobile.tizen.toggleswitch.less
index ede462e..784ae08 100755
--- a/src/themes/tizen/common/jquery.mobile.tizen.toggleswitch.less
+++ b/src/themes/tizen/common/jquery.mobile.tizen.toggleswitch.less
@@ -1,131 +1,64 @@
 @import "config.less";
 
-.ui-toggleswitch {
-	height: 40 * @unit_base;
-	width: 30 * @unit_base;
-	overflow: hidden;
-	.ui-toggleswitch-mover {
-		position: relative;
-		font-size : 13 * @unit_base;
-		line-height : 20 * @unit_base;
-		display: block;
 
-		.ui-toggleswitch-off {
-			border-radius: 5 * @unit_base;
-			color: @color_text_sub;
-			.LESStoggleswitch_off_style;
-			height: 40 * @unit_base;
-			.ui-toggleswitch-img{
-				width: 100%;
-				position: absolute;
-				padding-top: 7 * @unit_base;
-				.ui-toggleswitch-sign{
-					position: absolute;
-					width: 66 * @unit_base;
-					height: 35 * @unit_base;
-					/*left: 50%;*/
-					margin-left:-2px;
-					background: url(images/00_button_off.png) no-repeat;
-					background-size: cover;
-					-ms-background-size: cover;
-					-webkit-background-size: cover;
-					-o-background-size: cover;
-					-moz-background-size: cover;
-				}
-			}
-		}
+div.ui-slider.ui-toggle-switch {
+	width: 66 * @unit_base;
+	height: 35 * @unit_base;
+	background-color : transparent;
 
-		.ui-toggleswitch-on {
-			display: none;
-			border-radius: 5 * @unit_base;
-			.LESStoggleswitch_on_style;
-			height: 40 * @unit_base;
-			color: white;
-			.ui-toggleswitch-img{
-				width: 100%;
-				position: absolute;
-				padding-top: 6 * @unit_base;
-				text-align: center;
-				.ui-toggleswitch-sign{
-					position: absolute;
-					width: 66 * @unit_base;
-					height: 35 * @unit_base;
-					left: 50%;
-					margin-left:-7px;
-					background: url(images/00_button_on.png) no-repeat;
-					background-size: cover;
-					-ms-background-size: cover;
-					-webkit-background-size: cover;
-					-o-background-size: cover;
-					-moz-background-size: cover;
-				}
-			}
-		}
+	.ui-slider-label {
+		position: absolute;
+		width: 66 * @unit_base;
+		height: 35 * @unit_base;
+		background-size: cover;
+		-ms-background-size: cover;
+		-webkit-background-size: cover;
+		-o-background-size: cover;
+		-moz-background-size: cover;
 
-		.ui-toggleswitch-reed {
-			position: absolute;
-			border-radius: 5 * @unit_base;
-			width: 28 * @unit_base;
-			.LESStoggleswitch_reed_style;
-			top: 20 * @unit_base;
-			height: 19 * @unit_base;
-			left: 1px;
+		&.ui-slider-label-a {
+			background: url(images/00_button_on.png) no-repeat;
 		}
 
-		.ui-toggleswitch-text {
-			width: 100%;
-			position: absolute;
-			text-align: center;
-			text-overflow: ellipsis;
+		&.ui-slider-label-b {
+			background: url(images/00_button_off.png) no-repeat;
 		}
 	}
-}
-
-.ui-toggleswitch-state-checked {
-	.ui-toggleswitch-mover {
-		.ui-toggleswitch-reed {
-			top: 1px;
-		}
 
-		.ui-toggleswitch-text {
-			top: 20 * @unit_base;
-		}
-		.ui-toggleswitch-img{
-			top: 20 * @unit_base;
-		}
-		.ui-toggleswitch-on {
-			display: block;
-		}
-
-		.ui-toggleswitch-off {
-			display: none;
+	.ui-slider-inneroffset {
+		a {
+			background : none;
 		}
 	}
 }
 
-.ui-toggleswitch.ui-toggleswitch-image-style {
-	display : inline-block;
-
-	width : 66 * @unit_base;
-	height : 35 * @unit_base;
-	.ui-toggleswitch-mover {
-
-		.ui-toggleswitch-off,
-		.ui-toggleswitch-on {
-			background-image : none;
-
-			height : 66 * @unit_base;
-			width : 35 * @unit_base;
+div.ui-slider.ui-slider-switch:not(.ui-toggle-switch) {
+	position : relative;
+	width : 5.5em;
+	height : 32 * @unit_base;
 
-			.ui-toggleswitch-img {
-				padding-top : 0px;
-				top : 0px;
-
-				.ui-toggleswitch-sign {
-					left : 0px;
-					margin-left : 0px;
-				}
-			}
+	a.ui-slider-handle {
+		position : absolute;
+		background : rgba(255, 255, 255, 1);
+		top : -34 * @unit_base;
+		margin-top : 30 * @unit_base;
+		border-radius : 15 * @unit_base;
+		border : 2px solid gray;
+	}
+	span {
+		position : absolute;
+		overflow : hidden;
+		text-align : center;
+		height :  32 * @unit_base;
+		font-weight : bold;
+		border-radius : 10 * @unit_base;
+		&.ui-slider-label-a {
+			left : 0px;
+			color : white;
+		}
+		&.ui-slider-label-b {
+			right : 0px;
+			color : black;
 		}
 	}
 }
\ No newline at end of file