From 139b588c4630e470206e5f02f79b3e7b38614dc7 Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Wed, 5 Dec 2018 12:21:14 +0100
Subject: [PATCH] fix #2372 @1

---
 style/fluidbook.less | 119 ++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 117 insertions(+), 2 deletions(-)

diff --git a/style/fluidbook.less b/style/fluidbook.less
index 569bf5f8..81f2bb0f 100644
--- a/style/fluidbook.less
+++ b/style/fluidbook.less
@@ -103,6 +103,7 @@ html {
 	-webkit-user-select: text;
 	-o-user-select: text;
 	-ms-user-select: text;
+
 	&.ios {
 		position: fixed;
 		top: 0;
@@ -202,6 +203,7 @@ body, html {
 		#links {
 			cursor: url(./images/cursors/zoom-in.cur), auto;
 		}
+
 		.zoomed {
 			#links {
 				cursor: url(./images/cursors/zoom-out.cur), auto;
@@ -215,6 +217,7 @@ body, html {
 		#links {
 			cursor: zoom-in;
 		}
+
 		.zoomed {
 			#links {
 				cursor: zoom-out;
@@ -225,6 +228,7 @@ body, html {
 
 #links .link {
 	cursor: auto;
+
 	&.eventOverlayLink {
 		cursor: inherit;
 	}
@@ -282,6 +286,7 @@ body, html {
 
 	&.show {
 		display: block;
+
 		svg {
 			animation-name: loader-spin;
 			animation-duration: 1s;
@@ -302,6 +307,7 @@ body, html {
 
 .background {
 	background-repeat: no-repeat;
+
 	img {
 		width: 100%;
 		height: 100%;
@@ -329,6 +335,7 @@ body, html {
 	position: absolute;
 	top: 0px;
 	background-color: #fff;
+
 	.texts {
 		position: absolute;
 		top: -1px;
@@ -350,6 +357,7 @@ body, html {
 
 	&.right {
 		z-index: 1;
+
 		.shade {
 			left: 0px;
 		}
@@ -375,6 +383,7 @@ body, html {
 	top: 0px;
 	left: 0px;
 	z-index: 3;
+
 	.highlight {
 		position: absolute;
 		border-width: 2px;
@@ -388,15 +397,19 @@ body, html {
 		&[data-color="0"], &[data-color="5"], &[data-color="10"] {
 			.highlight-area(#00ff00);
 		}
+
 		&[data-color="1"], &[data-color="6"], &[data-color="11"] {
 			.highlight-area(#ffff00);
 		}
+
 		&[data-color="2"], &[data-color="7"], &[data-color="12"] {
 			.highlight-area(#00ffff);
 		}
+
 		&[data-color="3"], &[data-color="8"], &[data-color="13"] {
 			.highlight-area(#ff00ff);
 		}
+
 		&[data-color="4"], &[data-color="9"], &[data-color="14"] {
 			.highlight-area(#ff0000);
 		}
@@ -476,6 +489,7 @@ body, html {
 			&.left {
 				background-image: url("../images/shadows/back/left.png");
 				left: -35px;
+
 				.portrait & {
 					left: -29px;
 				}
@@ -725,6 +739,7 @@ header {
 #nav > a {
 	vertical-align: top;
 	display: inline-block;
+
 	&.hidden {
 		display: none;
 	}
@@ -845,6 +860,7 @@ footer, header, #interface {
 	-o-transition: opacity 400ms ease-in, visibility 400ms ease-in;
 	-ms-transition: opacity 400ms ease-in, visibility 400ms ease-in;
 	transition: opacity 400ms ease-in, visibility 400ms ease-in;
+
 	&.hidden {
 		visibility: hidden;
 		opacity: 0;
@@ -886,6 +902,7 @@ a.bookmark {
 /* Cart */
 .icon-cart {
 	position: relative;
+
 	span.number {
 		position: absolute;
 		top: 0.7em;
@@ -915,10 +932,12 @@ a.bookmark {
 			td {
 				&.name {
 					width: 100%;
+
 					.m {
 						display: block;
 					}
 				}
+
 				&.price, &.price_excluding_taxes, &.price_unit {
 					display: none;
 				}
@@ -931,6 +950,7 @@ a.bookmark {
 			text-align: left;
 			position: relative;
 			top: -40px;
+
 			p {
 				float: none;
 				width: 100%;
@@ -947,6 +967,7 @@ a.bookmark {
 
 		.cart-shipping-form {
 			margin-top: 30px;
+
 			.col {
 				&.col-left, &.col-right {
 					width: 100%;
@@ -956,6 +977,7 @@ a.bookmark {
 					padding: 0 30px;
 				}
 			}
+
 			.cart-footer {
 				top: 0;
 			}
@@ -967,23 +989,29 @@ a.bookmark {
 		width: 100%;
 		max-width: 1004px;
 		margin-left: 10px;
+
 		td {
 			padding: 15px;
 			text-align: left;
 			vertical-align: middle;
 			white-space: nowrap;
+
 			&.name {
 				white-space: normal;
+
 				.m {
 					display: none;
 				}
 			}
+
 			&.price {
 				font-weight: 700;
 			}
+
 			&.price, &.price_excluding_taxes, &.price_unit {
 				text-align: right;
 			}
+
 			&.delete {
 				a {
 					display: inline-block;
@@ -994,6 +1022,7 @@ a.bookmark {
 					top: 1px;
 					left: -5px;
 					padding: 0 6px;
+
 					svg {
 						width: 11px;
 						height: 11px;
@@ -1002,10 +1031,12 @@ a.bookmark {
 				}
 			}
 		}
+
 		.input-number {
 			position: relative;
 			width: 170px;
 			height: 44px;
+
 			input {
 				height: 44px;
 				width: 70px;
@@ -1016,6 +1047,7 @@ a.bookmark {
 				padding: 20px;
 				text-align: center;
 			}
+
 			a {
 				display: inline-block;
 				height: 44px;
@@ -1032,17 +1064,20 @@ a.bookmark {
 			margin: 18px 18px 50px;
 			float: right;
 			clear: both;
+
 			td.hr {
 				height: 2px;
 				background-color: #fff;
 				padding: 0;
 			}
+
 			tr.total {
 				td {
 					font-weight: 700;
 
 				}
 			}
+
 			td {
 				padding: 6px 12px;
 				text-align: right;
@@ -1054,6 +1089,7 @@ a.bookmark {
 		clear: both;
 		width: 100%;
 		text-align: left;
+
 		p {
 			float: left;
 			width: 450px;
@@ -1075,6 +1111,7 @@ a.bookmark {
 			display: inline-block;
 			text-align: left;
 			position: relative;
+
 			input {
 				width: 100%;
 				padding: 18px 15px;
@@ -1138,6 +1175,7 @@ html.ios body.portrait #interface {
 		position: relative;
 		left: 50%;
 	}
+
 	.rightContainer {
 		position: relative;
 		left: -50%;
@@ -1170,6 +1208,7 @@ html.ios body.portrait #interface {
 		transition: opacity 1s;
 		display: none;
 		opacity: 0;
+
 		&.show {
 			opacity: 1;
 		}
@@ -1188,12 +1227,15 @@ html.ios body.portrait #interface {
 	height: 100%;
 	display: block;
 	background-color: transparent;
+
 	&.displayArea {
 		-webkit-tap-highlight-color: @links-area-color;
 		background-color: fadeout(@links-color, 99.999%);
+
 		&.animating {
 			background-color: @links-area-color;
 		}
+
 		.no-ftouch &:hover {
 			opacity: 1 !important;
 			background-color: @links-area-color;
@@ -1222,6 +1264,7 @@ html.ios body.portrait #interface {
 
 		&.left {
 			left: @bookmark-corner-offset;
+
 			.portrait #fluidbook & {
 				right: @bookmark-corner-offset+@book-page-width;
 				left: auto;
@@ -1240,6 +1283,7 @@ html.ios body.portrait #interface {
 	opacity: 0.01;
 	display: block;
 	cursor: pointer;
+
 	&[data-enabled], &:hover {
 		opacity: 1 !important;
 		-moz-transition: none;
@@ -1324,6 +1368,7 @@ html.ios body.portrait #interface {
 			padding: 0;
 			position: relative;
 			z-index: 4;
+
 			a, div {
 				&.button.back {
 					width: 30px;
@@ -1352,6 +1397,7 @@ html.ios body.portrait #interface {
 	// Popup with close button outside
 	&[data-menu="iframe"], &[data-menu="text"] {
 		overflow: visible;
+
 		a, div {
 			&.button.back {
 				right: -30px;
@@ -1395,6 +1441,7 @@ html.ios body.portrait #interface {
 	&[data-menu="bookmarks-help"] {
 		.content {
 			padding: 40px 70px 100px 70px;
+
 			p {
 				margin-bottom: 60px;
 				font-size: 0.9em;
@@ -1402,22 +1449,27 @@ html.ios body.portrait #interface {
 			}
 
 			@w: 147px;
+
 			.doubleThumb {
 				position: relative;
 				width: @w*2;
 				height: @w/@book-page-ratio;
 				margin: 0 auto;
+
 				.thumb {
 
 					&:before {
 						display: none;
 					}
+
 					&.left {
 						margin-right: @w;
 
 					}
+
 					&.right {
 						left: @w;
+
 						.img {
 							&:after {
 								left: auto;
@@ -1425,9 +1477,11 @@ html.ios body.portrait #interface {
 							}
 						}
 					}
+
 					a.bookmark {
 						pointer-events: none;
 					}
+
 					.img {
 						position: relative;
 						width: @w;
@@ -1511,6 +1565,7 @@ html.ios body.portrait #interface {
 						transition: opacity 500ms;
 						position: absolute;
 					}
+
 					img {
 						display: block;
 					}
@@ -1530,6 +1585,7 @@ html.ios body.portrait #interface {
 	.fonctions {
 		padding: 0 @menu-padding @menu-padding 0;
 		text-align: right;
+
 		a {
 			line-height: 12px;
 			border-radius: 2px;
@@ -1545,9 +1601,11 @@ html.ios body.portrait #interface {
 	&.fs {
 		.fonctions {
 			padding: 0 @menu-padding @menu-padding @menu-padding;
+
 			a {
 				display: block;
 				margin: 0 0 10px 0;
+
 				&:last-child {
 					margin: 0;
 				}
@@ -1558,6 +1616,7 @@ html.ios body.portrait #interface {
 	&[data-chapters] {
 		max-width: 320px;
 	}
+
 	&.animate {
 		-moz-transition: -moz-transform 600ms ease-out, transform 600ms ease-out;
 		-webkit-transition: -webkit-transform 600ms ease-out;
@@ -1565,6 +1624,7 @@ html.ios body.portrait #interface {
 		-ms-transition: -ms-transform 600ms ease-out, transform 600ms ease-out;
 		transition: transform 600ms ease-out;
 	}
+
 	.caption {
 		padding: 20px @menu-padding;
 		width: 100%;
@@ -1585,6 +1645,7 @@ html.ios body.portrait #interface {
 			line-height: 25px;
 			display: block;
 			cursor: pointer;
+
 			&.back {
 				position: absolute;
 				top: 0;
@@ -1630,6 +1691,7 @@ form input[type="text"], form input[type="email"] {
 		margin: auto;
 		text-align: left;
 	}
+
 	.doubleThumb, .padding {
 		display: inline-block;
 		padding: 10px 10px 25px 10px;
@@ -1651,6 +1713,7 @@ form input[type="text"], form input[type="email"] {
 		text-align: left;
 		width: 100%;
 		padding: 20px @padding 0;
+
 		.doubleThumb {
 			width: 100px;
 		}
@@ -1660,17 +1723,21 @@ form input[type="text"], form input[type="email"] {
 
 .doubleThumb {
 	height: @thumb-height;
+
 	&.left {
 		margin-right: 10px;
 	}
+
 	&.simple {
 		.overlay {
 			width: 100px;
 		}
+
 		&.left {
 			.hits {
 				left: -50px;
 			}
+
 			&.singlemode {
 				.hits {
 					left: 0px;
@@ -1709,6 +1776,7 @@ form input[type="text"], form input[type="email"] {
 		font-size: 12px;
 		height: 26px;
 		top: @hits-top;
+
 		&.yes {
 			padding: 5px;
 			border-radius: 1px;
@@ -1740,6 +1808,7 @@ form input[type="text"], form input[type="email"] {
 		background-blend-mode: normal, overlay;
 		background-repeat: no-repeat;
 	}
+
 	.number {
 		text-align: center;
 		display: block;
@@ -1751,20 +1820,26 @@ form input[type="text"], form input[type="email"] {
 		font-size: 14px;
 		line-height: 1;
 	}
+
 	&.right {
 		left: 110px;
 	}
+
 	&.simple {
 		width: 100px;
+
 		&.right {
 			margin-left: 100px;
 		}
 	}
+
 	&.left {
 		margin-right: 100px;
 	}
 
-	@shade-height: unit(@thumb-height+22, px);
+	@extrashadowheight: min(22, @thumb-height*0.2);
+	@shade-height: unit(@thumb-height+@extrashadowheight, px);
+
 	&:before {
 		position: absolute;
 		content: "";
@@ -1848,6 +1923,7 @@ ul.chapters.shareList a.level0 .svg-icon {
 	.portrait & .icon.afterSearch {
 		display: none;
 	}
+
 	.icon {
 		position: absolute;
 		top: 0px;
@@ -2008,6 +2084,7 @@ ul.chapters.shareList a.level0 .svg-icon {
 	left: 0px;
 	z-index: 30;
 	display: none;
+
 	> div {
 		position: absolute;
 		border-radius: 10px;
@@ -2015,6 +2092,7 @@ ul.chapters.shareList a.level0 .svg-icon {
 		font-size: 0.8rem;
 		background-color: @menu-background;
 		color: @menu-text;
+
 		p {
 			margin: 0 0 20px 0;
 		}
@@ -2072,6 +2150,7 @@ ul.chapters.shareList a.level0 .svg-icon {
 	.multimediaContainer {
 		padding: 0;
 		position: relative;
+
 		&:after {
 			content: '';
 			position: absolute;
@@ -2083,6 +2162,7 @@ ul.chapters.shareList a.level0 .svg-icon {
 			pointer-events: auto;
 		}
 	}
+
 	img.multimedia {
 		position: relative;
 		z-index: 1;
@@ -2090,6 +2170,7 @@ ul.chapters.shareList a.level0 .svg-icon {
 		height: auto;
 		display: block;
 	}
+
 	.text {
 		padding: 20px;
 		white-space: pre-line;
@@ -2098,6 +2179,7 @@ ul.chapters.shareList a.level0 .svg-icon {
 
 	&[data-menu="multimedia"] {
 		background: transparent;
+
 		&.fs {
 			background: @menu-background;
 		}
@@ -2107,6 +2189,7 @@ ul.chapters.shareList a.level0 .svg-icon {
 		position: absolute;
 		top: 0;
 		left: 0;
+
 		.link {
 			position: absolute;
 		}
@@ -2118,24 +2201,30 @@ ul.chapters.shareList a.level0 .svg-icon {
 ul.chapters {
 	list-style: none;
 	padding: 20px 0;
+
 	ul {
 		list-style: none;
 	}
+
 	> li {
 		clear: both;
 	}
 
 	li {
 		position: relative;
+
 		&[data-level="1"] + [data-level="0"] {
 			margin-top: 15px;
 		}
+
 		&[data-level="2"] + [data-level="1"] {
 			margin-top: 10px;
 		}
+
 		&[data-level="3"] + [data-level="2"] {
 			margin-top: 5px;
 		}
+
 		&.separator {
 			height: 20px;
 		}
@@ -2147,25 +2236,31 @@ ul.chapters {
 		text-align: left;
 		padding: 5px 32px;
 		transition: background-color 250ms;
+
 		.rtl & {
 			text-align: right;
 		}
+
 		&.level-1 {
 			font-family: @font;
 			font-weight: 400;
 			text-align: center;
+
 			.right {
 				display: none;
 			}
 		}
+
 		&.level0 {
 			font-family: @font;
 			font-weight: 400;
+
 			.right .puce {
 				margin: 2px 0 0 0;
 			}
 
 		}
+
 		&.level1 {
 			padding-left: 50px;
 
@@ -2175,6 +2270,7 @@ ul.chapters {
 			}
 
 		}
+
 		&.level2 {
 			padding-left: 80px;
 
@@ -2187,6 +2283,7 @@ ul.chapters {
 				margin: -2px 0 0 0;
 			}
 		}
+
 		.level3 {
 			padding-left: 110px;
 
@@ -2195,6 +2292,7 @@ ul.chapters {
 				padding-right: 110px;
 			}
 		}
+
 		> nav {
 			display: none;
 		}
@@ -2210,6 +2308,7 @@ ul.chapters {
 		}
 
 	}
+
 	.right {
 		right: 32px;
 		top: 5px;
@@ -2242,6 +2341,7 @@ ul.chapters {
 				width: 16px;
 				height: 16px;
 			}
+
 			border-radius: 1px;
 
 			&.noshadow {
@@ -2355,6 +2455,7 @@ ul.chapters {
 	z-index: 12;
 	pointer-events: none;
 	display: none;
+
 	canvas {
 		position: absolute;
 		top: 0;
@@ -2621,6 +2722,7 @@ ul.chapters {
 			top: unit(@tooltip-arrows-size*-1, px);
 		}
 	}
+
 	&[data-pos-y="s"] {
 		&:after {
 			border-top: @tooltip-arrows-size solid @tooltip-background;
@@ -2633,6 +2735,7 @@ ul.chapters {
 			left: 16px;
 		}
 	}
+
 	&[data-pos-x="e"] {
 		&:after {
 			right: 16px;
@@ -2650,6 +2753,7 @@ ul.chapters {
 	width: 100%;
 	padding: 20px 40px;
 	z-index: 20;
+
 	a.close {
 		position: absolute;
 		top: 0px;
@@ -2662,12 +2766,14 @@ ul.chapters {
 		width: 56px;
 		height: 56px;
 	}
+
 	p {
 		text-align: center;
 		color: #ffffff;
 		font-size: 15px;
 		margin: 0 auto;
 		max-width: 1100px;
+
 		a {
 			white-space: nowrap;
 			text-decoration: underline;
@@ -2696,14 +2802,17 @@ ul.chapters {
 		.zoomPopupWrapper:last-of-type .zoomPopupClose {
 			display: none;
 		}
+
 		.zoomPopupWrapper:first-of-type .zoomPopupClose {
 			display: block;
 		}
 	}
+
 	&.layout-side-by-side {
 		.zoomPopupWrapper:first-of-type .zoomPopupClose {
 			display: none;
 		}
+
 		.zoomPopupWrapper:last-of-type .zoomPopupClose {
 			display: block;
 		}
@@ -2740,6 +2849,7 @@ ul.chapters {
 		display: block;
 		z-index: 102;
 	}
+
 	.zoomPopupClose {
 		@zoom-close-button-size: 30px;
 
@@ -2814,6 +2924,7 @@ body > input {
 		.nav-fullscreen-exit {
 			display: inline-block;
 		}
+
 		.nav-fullscreen {
 			display: none;
 		}
@@ -2824,6 +2935,7 @@ body > input {
 	.tabs {
 		transition: opacity 400ms;
 		position: relative;
+
 		&.hide {
 			opacity: 0;
 			pointer-events: none;
@@ -2889,6 +3001,7 @@ body > input {
 	&.visible {
 		opacity: 1;
 		pointer-events: auto;
+
 		.edge & {
 			visibility: visible;
 		}
@@ -2920,6 +3033,7 @@ body > input {
 		margin-top: 5px;
 		font-family: @font;
 		font-size: 14px;
+
 		&.parsley-error {
 			border-color: #cc0000;
 		}
@@ -2983,6 +3097,7 @@ body > input {
 #pscanvas {
 	visibility: hidden;
 }
-#loadedcontents{
+
+#loadedcontents {
 	display: none;
 }
\ No newline at end of file
-- 
2.39.5