diff --git a/src/assets/scss/_view-mode-polaroid.scss b/src/assets/scss/_view-mode-polaroid.scss new file mode 100644 index 0000000..d787c58 --- /dev/null +++ b/src/assets/scss/_view-mode-polaroid.scss @@ -0,0 +1,74 @@ +.tainacan-polaroid-container { + padding: 30px 4.166666667%; + background-color: #f5f5f5; + + .row { justify-content: space-around; } + .col { + flex-grow: 0; + &:nth-of-type(odd) { + transform: rotate(0.5deg); + } + &:nth-of-type(even) { + transform: rotate(-1.0deg); + } + &:nth-of-type(3n+0) { + transform: rotate(1.0deg); + } + &:nth-of-type(7n+0) { + transform: rotate(-0.5deg); + } + } + + .tainacan-polaroid { + padding: 16px; + text-align: center; + background-color: white; + box-shadow: 0px 2px 14px -8px #333; + margin: 16px; + transition: box-shadow 0.1s; + + &:hover { + box-shadow: 0px 3px 16px -7px #333; + } + + img { + width: 258px; + height: auto; + margin-bottom: 0.75rem; + } + + .metadata-title { + flex-shrink: 0; + font-size: 0.875rem; + margin-bottom: 0; + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + padding-bottom: 1.0rem; + text-align: center; + } + .list-metadata { + flex: 1; + font-size: 0.6875rem; + color: gray; + overflow: hidden; + display: grid; + + .metadata-label { + font-size: 0.75rem; + line-height: 1.0; + margin-bottom: 0.2rem; + } + + .metadata-value { + text-overflow: ellipsis; + white-space: nowrap; + overflow: hidden; + } + + } + + } +} + + diff --git a/src/assets/scss/style.scss b/src/assets/scss/style.scss index 0bc29a5..0c5190d 100644 --- a/src/assets/scss/style.scss +++ b/src/assets/scss/style.scss @@ -210,4 +210,6 @@ form{ @import "_view-mode-masonry.scss"; -@import "_view-mode-books.scss"; \ No newline at end of file +@import "_view-mode-books.scss"; + +@import "_view-mode-polaroid.scss"; \ No newline at end of file diff --git a/src/functions.php b/src/functions.php index 653a33e..6cf0d15 100644 --- a/src/functions.php +++ b/src/functions.php @@ -90,6 +90,12 @@ if(!function_exists('tainacan_setup')) { 'icon' => '', 'dynamic_metadata' => false, ]); + tainacan_register_view_mode('polaroid', [ + 'label' => 'Polaroid view', + 'description' => 'A framed picture view, similar to polaroid photographs', + 'icon' => '', + 'dynamic_metadata' => true, + ]); } } diff --git a/src/tainacan/view-mode-polaroid.php b/src/tainacan/view-mode-polaroid.php new file mode 100644 index 0000000..3b2b9ea --- /dev/null +++ b/src/tainacan/view-mode-polaroid.php @@ -0,0 +1,35 @@ + + +