Updated styles
authorThierry Florac <thierry.florac@onf.fr>
Tue, 14 Apr 2015 16:38:16 +0200
changeset 47 a5b11cb9d4ef
parent 46 1130ff95ebbe
child 48 5bba3227f9e2
Updated styles
src/pyams_skin/resources/css/myams.css
src/pyams_skin/resources/less/typo.less
src/pyams_skin/resources/less/widgets.less
--- a/src/pyams_skin/resources/css/myams.css	Tue Apr 14 16:37:49 2015 +0200
+++ b/src/pyams_skin/resources/css/myams.css	Tue Apr 14 16:38:16 2015 +0200
@@ -3033,22 +3033,22 @@
  */
 @font-face {
   font-family: 'Ubuntu';
-  src: url('fonts/Ubuntu-C.eot');
-  src: url('fonts/Ubuntu-C.eot?#iefix') format('embedded-opentype'), url('fonts/Ubuntu-C.woff') format('woff'), url('fonts/Ubuntu-C.ttf') format('truetype'), url('fonts/Ubuntu-C.svg') format('svg');
+  src: url('./fonts/Ubuntu-C.eot');
+  src: url('./fonts/Ubuntu-C.eot?#iefix') format('embedded-opentype'), url('./fonts/Ubuntu-C.woff') format('woff'), url('./fonts/Ubuntu-C.ttf') format('truetype'), url('./fonts/Ubuntu-C.svg') format('svg');
   font-weight: normal;
   font-style: normal;
 }
 @font-face {
   font-family: 'Ubuntu-Light';
-  src: url('fonts/Ubuntu-L.eot');
-  src: url('fonts/Ubuntu-L.eot?#iefix') format('embedded-opentype'), url('fonts/Ubuntu-L.woff') format('woff'), url('fonts/Ubuntu-L.ttf') format('truetype'), url('fonts/Ubuntu-L.svg') format('svg');
+  src: url('./fonts/Ubuntu-L.eot');
+  src: url('./fonts/Ubuntu-L.eot?#iefix') format('embedded-opentype'), url('./fonts/Ubuntu-L.woff') format('woff'), url('./fonts/Ubuntu-L.ttf') format('truetype'), url('./fonts/Ubuntu-L.svg') format('svg');
   font-weight: normal;
   font-style: normal;
 }
 @font-face {
   font-family: 'Ubuntu-Bold';
-  src: url('fonts/Ubuntu-B.eot');
-  src: url('fonts/Ubuntu-B.eot?#iefix') format('embedded-opentype'), url('fonts/Ubuntu-B.woff') format('woff'), url('fonts/Ubuntu-B.ttf') format('truetype'), url('fonts/Ubuntu-B.svg') format('svg');
+  src: url('./fonts/Ubuntu-B.eot');
+  src: url('./fonts/Ubuntu-B.eot?#iefix') format('embedded-opentype'), url('./fonts/Ubuntu-B.woff') format('woff'), url('./fonts/Ubuntu-B.ttf') format('truetype'), url('./fonts/Ubuntu-B.svg') format('svg');
   font-weight: bold;
   font-style: normal;
 }
@@ -3280,13 +3280,13 @@
   margin-right: -4px !important;
 }
 .bordered {
-  border: 1px solid #dddddd;
+  border: 1px solid #bdbdbd;
 }
 .bordered:hover {
   border: 1px solid #bbbbbb;
 }
 .bordered.nohover:hover {
-  border-color: #dddddd;
+  border-color: #bdbdbd;
 }
 .no-border,
 .well[class*=" bg-"].no-border {
@@ -3449,7 +3449,6 @@
 .no-padding > table {
   border: 0!important;
   margin-bottom: 0!important;
-  border-bottom-width: 0!important;
 }
 .no-padding .dataTables_wrapper table tr td:first-child,
 .no-padding > table tr td:first-child,
@@ -3714,6 +3713,7 @@
 		background: -webkit-gradient(linear, top left, top right, from(#829db0), to(#6f8696));
 		background: -webkit-linear-gradient(left, #829db0 93%, #6f8696 100%);
 		background: linear-gradient(to right, #829db0 93%, #6f8696 100%);*/
+
 }
 #header {
   display: block;
@@ -4325,9 +4325,11 @@
 }
 .login-info span {
   /*height: 38px;*/
+
   display: inline-block;
   padding: 0 0 0 10px;
   /*border-bottom: 1px solid #1A1817;*/
+
 }
 .login-info span a.btn-success {
   margin-top: -10px;
@@ -4395,6 +4397,7 @@
   overflow: visible;
   /*border-bottom: 1px solid #1A1817;
 			border-top: 1px solid #525151;*/
+
 }
 .minified #left-panel > ul > li > ul::before,
 .minified nav > ul > li > ul::before {
@@ -4501,6 +4504,7 @@
 .minified nav > ul > li > ul > li {
   background-color: rgba(91, 103, 113, 0.8);
   /*background-color: rgba(69, 69, 69, .9);*/
+
 }
 .minified #left-panel > ul > li > ul > li > ul > li,
 .minified nav > ul > li > ul > li > ul > li {
@@ -7198,7 +7202,7 @@
 .tree li {
   list-style-type: none;
   margin: 0;
-  padding: 5px;
+  padding: 3px 0 3px 5px;
   position: relative;
 }
 .tree li:after,
@@ -7212,7 +7216,7 @@
   border-left: 1px solid #999;
   bottom: 50px;
   height: 100%;
-  top: -11px;
+  top: -5px;
   width: 1px;
   -webkit-transition: "border-color 0.1s ease 0.1s";
   transition: "border-color 0.1s ease 0.1s";
@@ -7223,56 +7227,45 @@
 .tree li:after {
   border-top: 1px solid #999;
   height: 20px;
-  top: 18px;
+  top: 14px;
   width: 25px;
 }
-.tree li span {
+.tree li:hover {
+  background: rgba(0, 0, 0, 0.15);
+}
+.tree li > span {
   border: 1px dotted #999;
   border-radius: 5px;
   display: inline-block;
-  padding: 3px 8px;
+  padding: 4px 8px;
   text-decoration: none;
   -webkit-transition: color 0.2s ease 0.1s, background-color 0.2s ease 0.1s, border-color 0.3s ease 0.2s;
   transition: color 0.2s ease 0.1s, background-color 0.2s ease 0.1s, border-color 0.3s ease 0.2s;
 }
+.tree li > span > i {
+  padding-right: 4px;
+}
 .tree li.parent_li > span {
-  cursor: pointer;
   padding: 7px;
 }
-.tree li.parent_li > span:hover {
-  background-color: #DF8505;
-  border: 1px solid #C67605;
-  color: #fff;
-}
-.tree li.parent_li > span:hover + ul li::before {
-  border-left-color: #F89406;
-}
-.tree li.parent_li > span:hover + ul li::after {
-  border-top-color: #F89406;
-}
-.tree li.parent_li > span:hover + ul li span {
-  background: #FDDFB3!important;
-  border: 1px solid #FAA937;
-  color: #000;
-}
-.tree li.parent_li > span:hover,
-.tree li.parent_li > span:hover + ul li span {
+.tree li > span {
+  cursor: pointer;
+}
+.tree li > span:hover,
+.tree li > span:hover + ul li > span {
   background: #eee;
   border: 1px solid #94a0b4;
   color: #000;
 }
 .tree ul ul {
   padding-left: 34px;
-  padding-top: 10px;
-}
-.tree ul ul li:hover {
-  background: rgba(0, 0, 0, 0.015);
+  padding-top: 5px;
 }
 .tree > ul {
   padding-left: 0;
 }
-.tree > ul > li :after,
-.tree > ul > li :before {
+.tree > ul > li:after,
+.tree > ul > li:before {
   border: 0;
 }
 .pace {
@@ -10487,13 +10480,16 @@
   .btn-header a {
     margin-top: 9px!important;
     /*width: 40px!important;*/
+  
   }
 }
 @media (min-width: 768px) and (max-width: 880px) {
   .btn-header a {
     margin-top: 9px!important;
     /*width: 40px!important;*/
+  
     /*height: 39px!important;*/
+  
     line-height: 26px!important;
   }
 }
@@ -11491,7 +11487,7 @@
   padding: 0 0 0 8px;
   overflow: hidden;
   position: relative;
-  border: 1px solid #ccc;
+  border: 1px solid #bdbdbd;
   white-space: nowrap;
   line-height: 26px;
   color: #444;
@@ -11862,7 +11858,7 @@
   margin: 0;
   padding: 0;
   position: relative;
-  border: 1px solid #ccc;
+  border: 1px solid #bdbdbd;
   cursor: text;
   overflow: hidden;
   background-color: #fff;
@@ -11948,7 +11944,7 @@
   cursor: default;
 }
 .select2-container-multi.select2-container-disabled .select2-choices .select2-search-choice {
-  padding: 3px 5px;
+  padding: 1px 5px;
   border: 1px solid #4a90cc;
   background-image: none;
   background-color: #86b4dd;
@@ -12623,117 +12619,7 @@
  * Colorpicker
  */
 .colorpicker {
-  zoom: 1;
-  top: 0;
-  left: 0;
-  padding: 4px;
-  min-width: 120px;
-  margin-top: 1px;
-  border-top-right-radius: 4px;
-  border-top-left-radius: 4px;
-  border-bottom-right-radius: 4px;
-  border-bottom-left-radius: 4px;
-}
-.colorpicker:after {
-  clear: both;
-}
-.colorpicker:before {
-  content: '';
-  display: inline-block;
-  border-left: 7px solid transparent;
-  border-right: 7px solid transparent;
-  border-bottom: 7px solid #ccc;
-  border-bottom-color: rgba(0, 0, 0, 0.2);
-  position: absolute;
-  top: -7px;
-  left: 6px;
-}
-.colorpicker:after {
-  content: '';
-  display: inline-block;
-  border-left: 6px solid transparent;
-  border-right: 6px solid transparent;
-  border-bottom: 6px solid #fff;
-  position: absolute;
-  top: -6px;
-  left: 7px;
-}
-.colorpicker.alpha {
-  min-width: 140px;
-}
-.colorpicker.alpha .colorpicker-alpha {
-  display: block;
-}
-.colorpicker div {
-  position: relative;
-}
-.colorpicker-saturation {
-  width: 100px;
-  height: 100px;
-  background-image: url(../img/saturation.png);
-  cursor: crosshair;
-  float: left;
-}
-.colorpicker-saturation i {
-  display: block;
-  height: 5px;
-  width: 5px;
-  border: 1px solid #000;
-  position: absolute;
-  top: 0;
-  left: 0;
-  margin: -4px 0 0 -4px;
-}
-.colorpicker-saturation i b {
-  display: block;
-  height: 5px;
-  width: 5px;
-  border: 1px solid #fff;
-}
-.colorpicker-color {
-  height: 10px;
-  margin-top: 5px;
-  clear: both;
-  background-image: url(../img/alpha.png);
-  background-position: 0 100%;
-}
-.colorpicker-color div {
-  height: 10px;
-}
-.colorpicker-alpha,
-.colorpicker-hue {
-  width: 15px;
-  height: 100px;
-  float: left;
-  cursor: row-resize;
-  margin-left: 4px;
-  margin-bottom: 4px;
-}
-.colorpicker-alpha i,
-.colorpicker-hue i {
-  display: block;
-  height: 1px;
-  background: #000;
-  border-top: 1px solid #fff;
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  margin-top: -1px;
-}
-.colorpicker-hue {
-  background-image: url(../img/hue.png);
-}
-.colorpicker-alpha {
-  background-image: url(../img/alpha.png);
-  display: none;
-}
-.input-append.color .add-on i,
-.input-prepend.color .add-on i {
-  display: block;
-  cursor: pointer;
-  width: 16px;
-  height: 16px;
+  padding-left: 30px!important;
 }
 /*
  * Timepicker
@@ -15428,30 +15314,42 @@
 .modal-overflow .scrollmarker.top {
   background: -moz-linear-gradient(top, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* FF3.6+ */
+
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3276b1), color-stop(17%, rgba(50, 118, 177, 0.83)), color-stop(100%, rgba(50, 118, 177, 0)));
   /* Chrome,Safari4+ */
+
   background: -webkit-linear-gradient(top, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* Chrome10+,Safari5.1+ */
+
   background: -o-linear-gradient(top, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* Opera 11.10+ */
+
   background: -ms-linear-gradient(top, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* IE10+ */
+
   background: linear-gradient(to bottom, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* W3C */
+
 }
 .modal-overflow .scrollmarker.bottom {
   background: -moz-linear-gradient(bottom, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* FF3.6+ */
+
   background: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #3276b1), color-stop(17%, rgba(50, 118, 177, 0.83)), color-stop(100%, rgba(50, 118, 177, 0)));
   /* Chrome,Safari4+ */
+
   background: -webkit-linear-gradient(bottom, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* Chrome10+,Safari5.1+ */
+
   background: -o-linear-gradient(bottom, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* Opera 11.10+ */
+
   background: -ms-linear-gradient(bottom, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* IE10+ */
+
   background: linear-gradient(to top, #3276b1 0%, rgba(50, 118, 177, 0.83) 17%, rgba(50, 118, 177, 0) 100%);
   /* W3C */
+
 }
 /*
  * Pricing-style component
--- a/src/pyams_skin/resources/less/typo.less	Tue Apr 14 16:37:49 2015 +0200
+++ b/src/pyams_skin/resources/less/typo.less	Tue Apr 14 16:38:16 2015 +0200
@@ -290,13 +290,13 @@
 }
 
 .bordered {
-	border: 1px solid #dddddd;
+	border: 1px solid #bdbdbd;
 
 	&:hover {
 		border: 1px solid #bbbbbb;
 	}
 	&.nohover:hover {
-		border-color: #dddddd;
+		border-color: #bdbdbd;
 	}
 }
 
@@ -476,7 +476,6 @@
 	>table {
 		border: 0!important;
 		margin-bottom: 0!important;
-		border-bottom-width: 0!important;
 	}
 	.dataTables_wrapper table,
 	>table {
--- a/src/pyams_skin/resources/less/widgets.less	Tue Apr 14 16:37:49 2015 +0200
+++ b/src/pyams_skin/resources/less/widgets.less	Tue Apr 14 16:38:16 2015 +0200
@@ -812,7 +812,7 @@
 			padding: 0 0 0 8px;
 			overflow: hidden;
 			position: relative;
-			border: 1px solid #ccc;
+			border: 1px solid #bdbdbd;
 			white-space: nowrap;
 			line-height: 26px;
 			color: #444;
@@ -1226,7 +1226,7 @@
 				margin: 0;
 				padding: 0;
 				position: relative;
-				border: 1px solid #ccc;
+				border: 1px solid #bdbdbd;
 				cursor: text;
 				overflow: hidden;
 				background-color: #fff;
@@ -1322,7 +1322,7 @@
 				cursor: default;
 
 				.select2-search-choice {
-					padding: 3px 5px;
+					padding: 1px 5px;
 					border: 1px solid #4a90cc;
 					background-image: none;
 					background-color: #86b4dd;
@@ -2124,136 +2124,15 @@
 	_overflow: hidden;
 }
 
+
 /*
  * Colorpicker
  */
 
 .colorpicker {
-	zoom: 1;
-	top: 0;
-	left: 0;
-	padding: 4px;
-	min-width: 120px;
-	margin-top: 1px;
-	border-top-right-radius: 4px;
-	border-top-left-radius: 4px;
-	border-bottom-right-radius: 4px;
-	border-bottom-left-radius: 4px;
-
-	&:after {
-		clear: both;
-	}
-	&:before {
-		content: '';
-		display: inline-block;
-		border-left: 7px solid transparent;
-		border-right: 7px solid transparent;
-		border-bottom: 7px solid #ccc;
-		border-bottom-color: rgba(0, 0, 0, .2);
-		position: absolute;
-		top: -7px;
-		left: 6px;
-	}
-	&:after {
-		content: '';
-		display: inline-block;
-		border-left: 6px solid transparent;
-		border-right: 6px solid transparent;
-		border-bottom: 6px solid #fff;
-		position: absolute;
-		top: -6px;
-		left: 7px;
-	}
-	&.alpha {
-		min-width: 140px;
-
-		.colorpicker-alpha {
-			display: block;
-		}
-	}
-	div {
-		position: relative;
-	}
+	padding-left: 30px!important;
 }
 
-.colorpicker-saturation {
-	width: 100px;
-	height: 100px;
-	background-image: url(../img/saturation.png);
-	cursor: crosshair;
-	float: left;
-
-	i {
-		display: block;
-		height: 5px;
-		width: 5px;
-		border: 1px solid #000;
-		position: absolute;
-		top: 0;
-		left: 0;
-		margin: -4px 0 0 -4px;
-
-		b {
-			display: block;
-			height: 5px;
-			width: 5px;
-			border: 1px solid #fff;
-		}
-	}
-}
-
-.colorpicker-color {
-	height: 10px;
-	margin-top: 5px;
-	clear: both;
-	background-image: url(../img/alpha.png);
-	background-position: 0 100%;
-
-	div {
-		height: 10px;
-	}
-}
-
-.colorpicker-alpha,
-.colorpicker-hue {
-	width: 15px;
-	height: 100px;
-	float: left;
-	cursor: row-resize;
-	margin-left: 4px;
-	margin-bottom: 4px;
-
-	& i {
-		display: block;
-		height: 1px;
-		background: #000;
-		border-top: 1px solid #fff;
-		position: absolute;
-		top: 0;
-		left: 0;
-		width: 100%;
-		margin-top: -1px;
-	}
-}
-
-.colorpicker-hue {
-	background-image: url(../img/hue.png);
-}
-
-.colorpicker-alpha {
-	background-image: url(../img/alpha.png);
-	display: none;
-}
-
-.input-append.color,
-.input-prepend.color {
-	.add-on i {
-		display: block;
-		cursor: pointer;
-		width: 16px;
-		height: 16px;
-	}
-}
 
 /*
  * Timepicker