Просмотр исходного кода

Plans features table styling for v2

Jessica Lawshe 8 лет назад
Родитель
Сommit
3a2c9a3830

+ 6 - 8
services/web/public/stylesheets/app/plans.less

@@ -43,7 +43,7 @@
 		}
 	}
 	.card-first, .card-last {
-		background: @white-med;
+		background: @plans-non-highlighted;
 	}
 	.card-highlighted {
 		border: @highlight-border solid @gray-lighter;
@@ -165,9 +165,7 @@
 */
 @best-val-height: 35px;
 @highlight-border: 3px;
-@highlight-color: #d3584b;
 @gray-med: #6d6d6d;
-@white-med: #fdfdfd;
 
 /* Media Queries */
 @media (max-width: @screen-sm-max) {
@@ -208,7 +206,7 @@
 */
 .plans-table {
 	border: 1px solid @gray-lighter;
-	background-color: @white-med;
+	background-color: @plans-non-highlighted;
 	margin: @best-val-height 0 15px 0;
 	table-layout: fixed;
 	width: 100%;
@@ -231,8 +229,8 @@
 		border-top: 0;
 		font-family: @headings-font-family;
 		font-size: @font-size-h2;
-	  font-weight: @headings-font-weight;
-	  line-height: @headings-line-height;
+		font-weight: @headings-font-weight;
+		line-height: @headings-line-height;
 		padding: 18px;
 	}
 
@@ -262,7 +260,7 @@
 			border-bottom: 0;
 			padding: 18px;
 		}
-			/* highlighted column */
+		/* highlighted column */
 		td:nth-child(3) {
 			position: relative;
 			/* keep here position here, otherwise messes up border on safari when there is a bg color */
@@ -333,7 +331,7 @@
 	/* highlight rows on hover */
 	tr:hover {
 		td {
-			background-color: @gray-lightest;
+			background-color: @table-hover-bg;
 		}
 	}
 	tr:first-child:hover {

+ 4 - 0
services/web/public/stylesheets/core/_common-variables.less

@@ -415,6 +415,10 @@
 @pager-disabled-color:                 @pagination-disabled-color;
 
 
+// Plans
+@table-hover-bg:                       @gray-lightest;
+@plans-non-highlighted:                #fdfdfd;
+
 //== Jumbotron
 //
 //##

+ 4 - 0
services/web/public/stylesheets/core/ol-variables.less

@@ -312,6 +312,10 @@
 @log-line-no-color              : #FFF;
 @log-hints-color                : @ol-blue-gray-4;
 
+// Plans
+@table-hover-bg                 : @ol-blue-gray-0;
+@plans-non-highlighted          : white;
+
 // Portals
 @black-alpha-strong             : rgba(0,0,0,0.8);