fix(example): adjust styles to display spinner correctly (#1203)

eranshmil · brandonroberts · commit 4a0b58052a05 · 2018-07-28T22:10:42.000-05:00
diff --git a/example-app/app/books/components/book-search.component.ts b/example-app/app/books/components/book-search.component.ts
@@ -30,18 +30,18 @@ import { Component, Output, Input, EventEmitter } from '@angular/core';
 
       .mat-form-field {
         min-width: 300px;
+        margin-right: 10px; // Make room for the spinner
       }
 
       .mat-spinner {
         position: relative;
         top: 10px;
         left: 10px;
-        opacity: 0;
-        padding-left: 60px; // Make room for the spinner
+        visibility: hidden;
       }
 
       .mat-spinner.show {
-        opacity: 1;
+        visibility: visible;
       }
     `,
   ],

Original file line number	Diff line number	Diff line change
`@@ -30,18 +30,18 @@ import { Component, Output, Input, EventEmitter } from '@angular/core';`
`30`	`30`
`31`	`31`	`.mat-form-field {`
`32`	`32`	`min-width: 300px;`
	`33`	`+ margin-right: 10px; // Make room for the spinner`
`33`	`34`	`}`
`34`	`35`
`35`	`36`	`.mat-spinner {`
`36`	`37`	`position: relative;`
`37`	`38`	`top: 10px;`
`38`	`39`	`left: 10px;`
`39`		`- opacity: 0;`
`40`		`- padding-left: 60px; // Make room for the spinner`
	`40`	`+ visibility: hidden;`
`41`	`41`	`}`
`42`	`42`
`43`	`43`	`.mat-spinner.show {`
`44`		`- opacity: 1;`
	`44`	`+ visibility: visible;`
`45`	`45`	`}`
`46`	`46`	`,
`47`	`47`	`],`