From d614ab0562a2d35201327ded99121ae94f968e9a Mon Sep 17 00:00:00 2001 From: onursenture Date: Tue, 19 May 2020 20:55:43 +0300 Subject: [PATCH 1/7] Fix typo --- src/views/treetable/TreeTableColResizeDemo.vue | 4 ++-- src/views/treetable/TreeTableDoc.vue | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/views/treetable/TreeTableColResizeDemo.vue b/src/views/treetable/TreeTableColResizeDemo.vue index 9152c2eb6..e47ca17b3 100755 --- a/src/views/treetable/TreeTableColResizeDemo.vue +++ b/src/views/treetable/TreeTableColResizeDemo.vue @@ -16,7 +16,7 @@ -

Expand Mdoe

+

Expand Mode

@@ -36,7 +36,7 @@ <Column field="type" header="Type"></Column> </TreeTable> -<h3>Expand Mdoe</h3> +<h3>Expand Mode</h3> <TreeTable :value="nodes" :resizableColumns="true" columnResizeMode="expand"> <Column field="name" header="Name" :expander="true"></Column> <Column field="size" header="Size"></Column> diff --git a/src/views/treetable/TreeTableDoc.vue b/src/views/treetable/TreeTableDoc.vue index 2427e4d30..3497e0508 100755 --- a/src/views/treetable/TreeTableDoc.vue +++ b/src/views/treetable/TreeTableDoc.vue @@ -1173,7 +1173,7 @@ export default { <Column field="type" header="Type"></Column> </TreeTable> -<h3>Expand Mdoe</h3> +<h3>Expand Mode</h3> <TreeTable :value="nodes" :resizableColumns="true" columnResizeMode="expand"> <Column field="name" header="Name" :expander="true"></Column> <Column field="size" header="Size"></Column> From ac2f718b1894913fa62476447f6292f33e83cf04 Mon Sep 17 00:00:00 2001 From: mertsincan Date: Wed, 20 May 2020 22:25:58 +0300 Subject: [PATCH 2/7] Fixed #327 - Alignment issue on Galleria with left and right thumbnail position --- src/components/galleria/Galleria.vue | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/components/galleria/Galleria.vue b/src/components/galleria/Galleria.vue index 909a595f4..ef30e81bf 100755 --- a/src/components/galleria/Galleria.vue +++ b/src/components/galleria/Galleria.vue @@ -182,7 +182,6 @@ export default { display: flex; flex-direction: column; position: relative; - height: 100%; } .p-galleria-item-container { @@ -299,7 +298,6 @@ export default { .p-galleria-thumbnails-left .p-galleria-content, .p-galleria-thumbnails-right .p-galleria-content { flex-direction: row; - align-items: center; } .p-galleria-thumbnails-left .p-galleria-item-wrapper, @@ -320,6 +318,7 @@ export default { .p-galleria-thumbnails-left .p-galleria-thumbnail-container, .p-galleria-thumbnails-right .p-galleria-thumbnail-container { flex-direction: column; + flex-grow: 1; } .p-galleria-thumbnails-left .p-galleria-thumbnail-items, From eba832d958954fc42716368929ab51420f493df3 Mon Sep 17 00:00:00 2001 From: mertsincan Date: Wed, 20 May 2020 22:26:44 +0300 Subject: [PATCH 3/7] Refactor on galleria demo pages --- src/views/galleria/GalleriaIndicatorDemo.vue | 38 ++++++++++++++++++-- src/views/galleria/GalleriaThumbnailDemo.vue | 8 ++--- 2 files changed, 40 insertions(+), 6 deletions(-) diff --git a/src/views/galleria/GalleriaIndicatorDemo.vue b/src/views/galleria/GalleriaIndicatorDemo.vue index 82b0ad927..6b43231d5 100755 --- a/src/views/galleria/GalleriaIndicatorDemo.vue +++ b/src/views/galleria/GalleriaIndicatorDemo.vue @@ -63,7 +63,7 @@ @@ -173,6 +173,23 @@ export default { }); } } + + + +::v-deep { + .custom-indicator-galleria { + .indicator-text { + color: #e9ecef; + cursor: pointer; + } + + .p-highlight { + .indicator-text { + color: var(--primary-color); + } + } + } +} @@ -215,4 +232,21 @@ export default { }); } } - \ No newline at end of file + + + diff --git a/src/views/galleria/GalleriaThumbnailDemo.vue b/src/views/galleria/GalleriaThumbnailDemo.vue index 8a3abd40e..fd83c11d1 100755 --- a/src/views/galleria/GalleriaThumbnailDemo.vue +++ b/src/views/galleria/GalleriaThumbnailDemo.vue @@ -19,7 +19,7 @@

Positioned at Left

- + @@ -31,7 +31,7 @@

Positioned at Right

- + @@ -69,7 +69,7 @@ </Galleria> <h3>Positioned at Left</h3> -<Galleria :value="images" :responsiveOptions="responsiveOptions2" :numVisible="4" thumbnailsPosition="left" style="max-width: 610px"> +<Galleria :value="images" :responsiveOptions="responsiveOptions2" :numVisible="4" thumbnailsPosition="left" style="max-width: 640px"> <template #item="slotProps"> <img :src="slotProps.item.previewImageSrc" :alt="slotProps.item.alt" style="width: 100%; display: block;" /> </template> @@ -81,7 +81,7 @@ </Galleria> <h3>Positioned at Right</h3> -<Galleria :value="images" :responsiveOptions="responsiveOptions2" :numVisible="4" thumbnailsPosition="right" style="max-width: 610px"> +<Galleria :value="images" :responsiveOptions="responsiveOptions2" :numVisible="4" thumbnailsPosition="right" style="max-width: 640px"> <template #item="slotProps"> <img :src="slotProps.item.previewImageSrc" :alt="slotProps.item.alt" style="width: 100%; display: block;" /> </template> From 3aabaac99524c603b6551db422b6dc79eb93ceec Mon Sep 17 00:00:00 2001 From: mertsincan Date: Thu, 21 May 2020 03:43:17 +0300 Subject: [PATCH 4/7] Refactor on advanced galleria demo --- src/views/galleria/GalleriaAdvancedDemo.vue | 269 ++++++++++++++------ 1 file changed, 189 insertions(+), 80 deletions(-) diff --git a/src/views/galleria/GalleriaAdvancedDemo.vue b/src/views/galleria/GalleriaAdvancedDemo.vue index 1e3b58a5b..7a15f6abb 100644 --- a/src/views/galleria/GalleriaAdvancedDemo.vue +++ b/src/views/galleria/GalleriaAdvancedDemo.vue @@ -12,7 +12,7 @@ :showThumbnails="showThumbnails" :showItemNavigators="true" :showItemNavigatorsOnHover="true" :circular="true" :autoPlay="true" :transitionInterval="3000"> @@ -45,7 +176,7 @@ export default { images: null, activeIndex: 0, showThumbnails: false, - isPreviewFullScreen: false + fullScreen: false } }, galleriaService: null, @@ -61,17 +192,17 @@ export default { this.showThumbnails = !this.showThumbnails; }, toggleFullScreen() { - if (this.isPreviewFullScreen) { - this.closePreviewFullScreen(); + if (this.fullScreen) { + this.closeFullScreen(); } else { - this.openPreviewFullScreen(); + this.openFullScreen(); } }, onFullScreenChange() { - this.isPreviewFullScreen = !this.isPreviewFullScreen; + this.fullScreen = !this.fullScreen; }, - openPreviewFullScreen() { + openFullScreen() { let elem = this.$refs.galleria.$el; if (elem.requestFullscreen) { elem.requestFullscreen(); @@ -86,7 +217,7 @@ export default { elem.msRequestFullscreen(); } }, - closePreviewFullScreen() { + closeFullScreen() { if (document.exitFullscreen) { document.exitFullscreen(); } @@ -115,10 +246,10 @@ export default { }, computed: { galleriaClass() { - return ['custom-galleria', {'preview-fullscreen': this.isPreviewFullScreen}]; + return ['custom-galleria', {'fullscreen': this.fullScreen}]; }, fullScreenIcon() { - return `pi ${this.isPreviewFullScreen ? 'pi-window-minimize' : 'pi-window-maximize'}`; + return `pi ${this.fullScreen ? 'pi-window-minimize' : 'pi-window-maximize'}`; } } } @@ -127,82 +258,60 @@ export default {