minimal style update

revolist · Sep 18, 2020 · d1051ef · d1051ef
1 parent 615a812
commit d1051ef
Show file tree

Hide file tree

Showing 2 changed files with 42 additions and 34 deletions.
diff --git a/src/components/revo-grid/revo-grid.default.scss b/src/components/revo-grid/revo-grid.default.scss
@@ -9,32 +9,32 @@ revogr-viewport {
 	box-shadow: $shadow-top;
 
 	revogr-header {
-			box-shadow: $header-shadow;
-			line-height: $header-size;
-
-			.group-row {
-				box-shadow: none;
+		text-align: center;
+		box-shadow: $header-shadow;
+		line-height: $header-size;
+
+		.group-row {
+			box-shadow: none;
 
-				.data-header-cell {
-					color: #9493a2;
-				}
+			.data-header-cell {
+				color: #9493a2;
 			}
-			.header-row {
-				height: $header-size;
+		}
+		.header-row {
+			height: $header-size;
 
-				&:not(.group) {
-					font-weight: 600;
-				}
-			}
-
-			.data-header-cell {
-				$shadow-left: -1px 0 0 0 $cell-border-color;
-				$shadow-right: -1px 0 0 0 $cell-border-color inset;
-				$shadow-bottom: 0 -1px 0 0 $header-border-color inset;
-				$shadow-top: 0 -1px 0 0 $header-border-color;
-				box-shadow: $shadow-left, $shadow-right, $shadow-top, $shadow-bottom;
-				text-align: center;
+			&:not(.group) {
+				font-weight: 600;
 			}
+		}
+
+		.data-header-cell {
+			$shadow-left: -1px 0 0 0 $cell-border-color;
+			$shadow-right: -1px 0 0 0 $cell-border-color inset;
+			$shadow-bottom: 0 -1px 0 0 $header-border-color inset;
+			$shadow-top: 0 -1px 0 0 $header-border-color;
+			box-shadow: $shadow-left, $shadow-right, $shadow-top, $shadow-bottom;
+		}
 	}
 
 	revogr-viewport-scroll {
@@ -58,12 +58,12 @@ revogr-viewport {
 
 	revogr-data {
 		$cell-shadow-cell: 0 -1px 0 0 $cell-border-color inset, -1px 0 0 0 $cell-border-color inset;
+		text-align: center;
 		.row {
 			line-height: $default-rows-size;
 		}
 		.data-cell {
 			box-shadow: $cell-shadow-cell;
-			text-align: center;
 
 			&.disabled {
 				background-color: $cell-disabled-bg;

diff --git a/src/components/revo-grid/revo-grid.material.scss b/src/components/revo-grid/revo-grid.material.scss
@@ -2,7 +2,8 @@
 
 $header-height: 50px;
 $default-rows-size: 42px;
-
+$cell-border-color: #f1f1f1;
+$header-border-color: $cell-border-color;
 
 $cell-shadow-cell: 0 -1px 0 0 $cell-border-color inset;
 
@@ -15,22 +16,25 @@ revogr-viewport {
 	revogr-header {
 		line-height: $header-height;
 		font-weight: 600;
+		text-align: left;
 
 		.data-header-cell {
-				$shadow-bottom: 0 -1px 0 0 $header-border-color inset;
-				$shadow-top: 0 -1px 0 0 $header-border-color;
-				box-shadow: $shadow-top, $shadow-bottom;
-				text-align: center;
+			$shadow-bottom: 0 -1px 0 0 $header-border-color inset;
+			$shadow-top: 0 -1px 0 0 $header-border-color;
+			box-shadow: $shadow-top, $shadow-bottom;
+			padding: 0 15px;
+			overflow: hidden;
+			text-overflow: ellipsis;
 		}
 
 
 		.header-row {
-				height: $header-height;
+			height: $header-height;
 
-				&.group {
-						$shadow-bottom: 0 -1px 0 0 $header-border-color inset;
-						box-shadow: $shadow-bottom;
-				}
+			&.group {
+				$shadow-bottom: 0 -1px 0 0 $header-border-color inset;
+				box-shadow: $shadow-bottom;
+			}
 		}
 	}
 
@@ -50,13 +54,17 @@ revogr-viewport {
 	}
 
 	revogr-data {
+		text-align: left;
+
 		.row {
 			line-height: $default-rows-size;
 		}
 
 		.data-cell {
 			box-shadow: $cell-shadow-cell;
-			text-align: center;
+			padding: 0 15px;
+			overflow: hidden;
+			text-overflow: ellipsis;
 			color: rgba(black, .87);
 
 			&.disabled {