Hopefully really the last paper-theme related styling fixes

David-Mulder · Dec 20, 2015 · 1650513 · 1650513
1 parent 2a46e4e
commit 1650513
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 3 deletions.
diff --git a/demo/miscellaneous/theming.html b/demo/miscellaneous/theming.html
@@ -49,6 +49,9 @@
 				color: rgba(255, 255, 255, var(--dark-primary-opacity));
 				--paper-input-container-input-color: rgba(255, 255, 255, var(--dark-primary-opacity));
 				--paper-datatable-navigation-bar-text-color: rgba(255, 255, 255, var(--dark-primary-opacity));
+
+				--paper-datatable-top-toolbar-text-color: rgba(255, 255, 255, var(--dark-primary-opacity));
+
 			}
 
 			paper-datatable{
@@ -84,10 +87,12 @@
 				};
 
 				--paper-datatable-edit-dialog-color: #303030;
+
 				--paper-datatable-edit-dialog: {
 					border: 1px solid rgba(255, 255, 255, .2);
 					box-sizing: border-box;
 				}
+
 			}
 
 
@@ -100,10 +105,10 @@
 
 				<paper-datatable-card header="Dangerously delicious">
 					<div toolbar-main>
-						<paper-icon-button icon="more-vert" on-tap="delete"></paper-icon-button>
+						<paper-icon-button icon="more-vert"></paper-icon-button>
 					</div>
 					<div toolbar-select>
-						<paper-icon-button icon="delete" on-tap="delete"></paper-icon-button>
+						<paper-icon-button icon="delete"></paper-icon-button>
 					</div>
 					<paper-datatable data="{{data}}" selectable multi-selection custom-row-style="{{generateRowCss}}" progress="{{progressBarVisble}}" sort-property="calories" sort-direction="asc">
 						<paper-datatable-column header="Dessert (100g serving)" property="title" type="String" style="width:99%;" sortable editable dialog edit-icon>

diff --git a/docs/styling.md b/docs/styling.md
@@ -65,7 +65,8 @@ Variables
  `--paper-datatable-divider-color` | divider color is used to draw the bottom line | --divider-color
  `--paper-datatable-selection-toolbar-color` | color of selected toolbar, should be 50 of the secondary color | `--paper-pink-50`
  `--paper-datatable-selection-toolbar-text-color` | text color of text and icons on selection toolbar | `--accent-color`
- `--paper-datatable-navigation-bar-text-color` | color of text in navigation bar | 
+ `--paper-datatable-navigation-bar-text-color` | color of text in navigation bar |
+ `--paper-datatable-top-toolbar-text-color` | color of text in the top toolbar | 
 
 Mixins
 ---
@@ -75,3 +76,4 @@ Mixins
  `--paper-datatable-card` | applied to the main card
  `--paper-datatable-navigation-bar` | applied to the bottom bar containing the navigation
  `--paper-datatable-selection-toolbar` | applied to the selection toolbar
+ `--paper-datatable-top-toolbar` | Applied to the general area above the data table
diff --git a/paper-datatable-card.html b/paper-datatable-card.html
@@ -54,10 +54,15 @@
 				height:64px;
 				padding:0px 6px 0px 24px;
 				position:relative;
+				@apply(--paper-datatable-top-toolbar);
 			}
 			#topBlock .header{
 				font-size:20px;
 				@apply(--paper-font-common-base);
+				color: var(--paper-datatable-top-toolbar-text-color);
+			}
+			#topBlock ::content paper-icon-button{
+				color: var(--paper-datatable-top-toolbar-text-color);
 			}
 			#topBlock .selectionHeader{
 				font-size:16px;