Books listing upgrade

acf-json/group_5dfccae53e4bc.json

@@ -509,6 +509,26 @@
             "media_upload": 1,
             "delay": 0
         },
+        {
+            "key": "field_66c5b84bc694f",
+            "label": "Footer additional texts",
+            "name": "footer_additional_texts",
+            "aria-label": "",
+            "type": "wysiwyg",
+            "instructions": "If used footer will split in two columns on desktop: first columns contains \"Footer texts\", second column contains \"Footer additional texts\".",
+            "required": 1,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "default_value": "",
+            "tabs": "all",
+            "toolbar": "full",
+            "media_upload": 1,
+            "delay": 0
+        },
         {
             "key": "field_5edcf2dea1256",
             "label": "Favicons path",
@@ -794,5 +814,5 @@
     "active": true,
     "description": "",
     "show_in_rest": 0,
-    "modified": 1696353688
-}
+    "modified": 1724233898
+}

acf-json/group_66ee8b7f358e2.json

@@ -0,0 +1,53 @@
+{
+    "key": "group_66ee8b7f358e2",
+    "title": "Books page settings",
+    "fields": [
+        {
+            "key": "field_66ee8b7f1d4ce",
+            "label": "Page layout",
+            "name": "books_page_layout",
+            "aria-label": "",
+            "type": "select",
+            "instructions": "",
+            "required": 0,
+            "conditional_logic": 0,
+            "wrapper": {
+                "width": "",
+                "class": "",
+                "id": ""
+            },
+            "choices": {
+                "books-list": "List",
+                "books-mosaic": "Mosaic"
+            },
+            "default_value": false,
+            "return_format": "value",
+            "multiple": 0,
+            "allow_null": 0,
+            "ui": 0,
+            "ajax": 0,
+            "placeholder": ""
+        }
+    ],
+    "location": [
+        [
+            {
+                "param": "page_template",
+                "operator": "==",
+                "value": "page-books.php"
+            }
+        ]
+    ],
+    "menu_order": 0,
+    "position": "acf_after_title",
+    "style": "default",
+    "label_placement": "top",
+    "instruction_placement": "label",
+    "hide_on_screen": [
+        "the_content"
+    ],
+    "active": true,
+    "description": "",
+    "show_in_rest": 0,
+    "modified": 1726909434
+}

assets/css/desktop/_fullhd-grid-exc.scss

@@ -19,6 +19,10 @@
     .flex-hold-child:nth-child(4n) {
       margin-right: 0;
     }
+
+    &.books-listing {
+      justify-content: start;
+    }
   }
 }
 

assets/css/desktop/_grid-exc.scss

@@ -18,6 +18,7 @@
     .flex-hold-child:nth-child(5n) {
       margin-right: 0;
     }
+
   }
 }
 
@@ -37,6 +38,10 @@
     .flex-hold-child:nth-child(3n) {
       margin-right: 0;
     }
+
+    &.books-listing {
+      justify-content: start;
+    }
   }
 }
 

assets/css/desktop/_header-footer.scss

@@ -162,9 +162,9 @@
         margin-left: -90px;
         padding: 15px 0 !important;
         text-transform: none;
-        -webkit-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15);
-        -moz-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15);
-        box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15);
+        //-webkit-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15);
+        //-moz-box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15);
+        //box-shadow: 0 10px 20px 0 rgba(0, 0, 0, 0.15);
         opacity: 0;
         pointer-events: none;
         @include define-basic-transition(opacity, 0.15s);
@@ -281,4 +281,10 @@
       }
     }
   }
+}
+
+#footer {
+  .right {
+    text-align: right;
+  }
 }

assets/css/global/_colors-dark.scss

@@ -270,4 +270,8 @@ body.dark-theme {
 			}
 		}
 	}
+
+	.book-mosaic-item {
+		background-color: $color-4-dark;
+	}
 }

assets/css/global/_defaults.scss

@@ -386,6 +386,23 @@ a.absl:link {
 	border-bottom: 1px solid;
 }
 
+.book-mosaic-item {
+	position: relative;
+	width: 100%;
+	aspect-ratio: 1/1;
+
+	img,
+	video {
+		position: absolute;
+		top: 20px;
+		left: 20px;
+		width: calc(100% - 40px);
+		height: calc(100% - 40px);
+		object-fit: contain;
+		object-position: 50% 50%;
+	}
+}
+
 .lined {
 	border-bottom: 1px solid;
 }
@@ -426,4 +443,29 @@ a.absl:link {
 		display: block;
 		clear: both;
 	}
+}
+
+#footer {
+	.flex-hold {
+		margin-top: 0;
+		padding: 0;
+		align-items: normal;
+
+		.flex-hold-child {
+			margin-bottom: 0;
+		}
+	}
+}
+
+.screen-reader-text {
+	border: 0;
+	clip: rect(1px, 1px, 1px, 1px);
+	clip-path: inset(50%);
+	height: 1px;
+	margin: -1px;
+	overflow: hidden;
+	padding: 0;
+	position: absolute;
+	width: 1px;
+	word-wrap: normal !important;
 }

footer.php

@@ -4,33 +4,45 @@
 ?>
 </div><!-- body-shaper closing tag -->
 <footer id="footer" class="delight-area bg-5 txt-1 menu">
-  <div class="wrapper">
-    <div class="wrapper-padded">
-      <?php the_field( 'credits_and_more', 'options' ); ?>
-    </div>
-  </div>
+	<div class="wrapper">
+		<div class="wrapper-padded">
+			<?php if ( get_field( 'footer_additional_texts', 'options' ) ) : ?>
+				<div class="flex-hold flex-hold-2 margins-wide">
+					<div class="flex-hold-child">
+						<?php the_field( 'credits_and_more', 'options' ); ?>
+					</div>
+					<div class="flex-hold-child right">
+						<?php the_field( 'footer_additional_texts', 'options' ); ?>
+					</div>
+				</div>
+			<?php else : ?>
+				<?php the_field( 'credits_and_more', 'options' ); ?>
+			<?php endif; ?>
+		</div>
+	</div>
 </footer>
 <div class="loading-transition-effect bg-5">
-  <div class="spinner-in flex-hold verticalize">
-    <div class="spinner">
-      <div class="bounce1 bg-2"></div>
-      <div class="bounce2 bg-2"></div>
-      <div class="bounce3 bg-2"></div>
-    </div>
-  </div>
+	<div class="spinner-in flex-hold verticalize">
+		<div class="spinner">
+			<div class="bounce1 bg-2"></div>
+			<div class="bounce2 bg-2"></div>
+			<div class="bounce3 bg-2"></div>
+		</div>
+	</div>
 </div>
 </div>
 </div><!-- swup closing tag -->
 <script type="text/javascript">
-var SWIPE_THRESHOLD = 60, // default value
-DBL_TAP_THRESHOLD = 200, // range of time in which a dbltap event could be detected,
-LONG_TAP_THRESHOLD = 1000, // range of time after which a longtap event could be detected
-TAP_THRESHOLD = 150, // range of time in which a tap event could be detected
-TAP_PRECISION = 60 / 2, // default value (touch events boundaries)
-JUST_ON_TOUCH_DEVICES = false, // default value ( decide whether you want to use the Tocca.js events only on the touch devices )
-IGNORE_JQUERY = false; // default value ( will not use jQuery events, even if jQuery is detected )
+	var SWIPE_THRESHOLD = 60, // default value
+		DBL_TAP_THRESHOLD = 200, // range of time in which a dbltap event could be detected,
+		LONG_TAP_THRESHOLD = 1000, // range of time after which a longtap event could be detected
+		TAP_THRESHOLD = 150, // range of time in which a tap event could be detected
+		TAP_PRECISION = 60 / 2, // default value (touch events boundaries)
+		JUST_ON_TOUCH_DEVICES = false, // default value ( decide whether you want to use the Tocca.js events only on the touch devices )
+		IGNORE_JQUERY = false; // default value ( will not use jQuery events, even if jQuery is detected )
 </script>
 <?php wp_footer(); ?>
 
 </body>
-</html>
+
+</html>

header.php

@@ -564,6 +564,12 @@
 				;
 			}
 
+			.clear-theme .book-mosaic-item {
+				background-color:
+					<?php the_field( 'custom_color_2', 'options' ); ?>
+				;
+			}
+
 			.view-more-button {
 				color:
 					<?php the_field( 'custom_color_1', 'options' ); ?>
@@ -678,6 +684,10 @@
 				background: #AFAFAF;
 			}
 
+			.clear-theme .book-mosaic-item {
+				background-color: #F9F9F9;
+			}
+
 			.menu ul li .sub-menu {
 				background-color: #FFFFFF;
 			}