update image demo

fivethree-team · Jun 24, 2019 · 37b4e8b · 37b4e8b
1 parent 916300d
commit 37b4e8b
Showing 1 changed file with 32 additions and 28 deletions.
diff --git a/src/app/pages/image/image.page.html b/src/app/pages/image/image.page.html
@@ -55,35 +55,39 @@
     </fiv-gallery-toolbar>
 
   </fiv-gallery>
+  <ion-grid fixed>
+    <ion-row>
+      <ion-col size="12">
 
-  <ion-item-group>
-    <ion-item-divider>
-      <ion-label>ngfor example</ion-label>
-    </ion-item-divider>
-    <fiv-gallery class="loop">
-      <fiv-gallery-image *ngFor="let pic of picsum" [src]="pic"></fiv-gallery-image>
-    </fiv-gallery>
-    <ion-item-divider>
-      <ion-label>ngfor example async</ion-label>
-    </ion-item-divider>
-    <fiv-gallery class="loop">
-      <fiv-gallery-image *ngFor="let pic of picsumAsync | async" [src]="pic"></fiv-gallery-image>
-    </fiv-gallery>
-
-    <ion-item-divider>
-      <ion-label>ngfor example grid</ion-label>
-    </ion-item-divider>
-    <fiv-gallery>
-      <ion-grid fixed>
-        <ion-row>
-          <ion-col *ngFor="let pic of picsum" size="6">
-            <fiv-gallery-image [src]="pic"></fiv-gallery-image>
-          </ion-col>
-        </ion-row>
-      </ion-grid>
-    </fiv-gallery>
-
-  </ion-item-group>
+        <ion-item-group>
+          <ion-item-divider>
+            <ion-label>*ngFor example</ion-label>
+          </ion-item-divider>
+          <fiv-gallery class="loop">
+            <fiv-gallery-image *ngFor="let pic of picsum" [src]="pic"></fiv-gallery-image>
+          </fiv-gallery>
+          <ion-item-divider>
+            <ion-label>*ngFor example async</ion-label>
+          </ion-item-divider>
+          <fiv-gallery class="loop">
+            <fiv-gallery-image *ngFor="let pic of picsumAsync | async" [src]="pic"></fiv-gallery-image>
+          </fiv-gallery>
 
+          <ion-item-divider>
+            <ion-label>*ngFor example grid</ion-label>
+          </ion-item-divider>
+          <fiv-gallery>
+            <ion-grid fixed>
+              <ion-row>
+                <ion-col *ngFor="let pic of picsum" size="6" sizeMd="4">
+                  <fiv-gallery-image [src]="pic"></fiv-gallery-image>
+                </ion-col>
+              </ion-row>
+            </ion-grid>
+          </fiv-gallery>
 
+        </ion-item-group>
+      </ion-col>
+    </ion-row>
+  </ion-grid>
 </ion-content>