Fix scrolling + hovering effect on feed posts

src/components/projectPost.vue

@@ -55,6 +55,9 @@
 			drillMainIcon() {
 				return this.mouseOverDrill?'drill-message':'marker';
 			},
+			drillSubIcon() {
+				return this.mouseOverDrill?null:'footprint';
+			},
 			anchorLink() {
 				return '#'+[this.hash.page, this.project.currProject.codename, this.options.type, this.options.id].join(this.consts.hash_sep);
 			},
@@ -186,12 +189,12 @@
 		</div>
 		<div class="body">
 			<div v-if="options.type == 'message'" class="body-box">
-				<div class="drill" @click.prevent="panMapToMarker" @mouseenter="onMouseEnter" @mouseleave="onMouseLeave">
+				<div class="drill" @click.prevent="panMapToMarker" @pointerenter="onMouseEnter" @pointerleave="onMouseLeave">
 					<span v-if="options.weather_icon && options.weather_icon!='unknown'" class="weather clickable" :title="lang.get('weather.'+options.weather_icon)">
 						<spotIcon :icon="options.weather_icon" :text="Math.round(options.weather_temp)+'°C'" text-classes="temperature" />
 					</span>
 					<img class="staticmap clickable" :title="lang.get('media.click_zoom')" :src="options.static_img_url" />
-					<spotIconStack :mainClasses="'message drill-icon'" :iconMain="drillMainIcon" iconSub="footprint" :icon-sub-transform="'rotate-270'" />
+					<spotIconStack mainClasses="message drill-icon" :iconMain="drillMainIcon" :iconSub="drillSubIcon" icon-sub-transform="rotate-270" />
 					<div class="comment" @click.stop>
 						<p v-if="!isMobile()">
 							<spotIcon :icon="'coords'" margin="right" size="lg" />

src/components/spotIconStack.vue

@@ -45,7 +45,7 @@ export default {
 	<span :class="mainClass">
 		<FontAwesomeLayers>
 			<spotIcon :icon="iconMain" :classes="iconMainClass" :transform="iconMainTransform" />
-			<spotIcon :icon="iconSub" :classes="iconSubClass" :transform="iconSubTransformValue" />
+			<spotIcon v-if="iconSub" :icon="iconSub" :classes="iconSubClass" :transform="iconSubTransformValue" />
 		</FontAwesomeLayers>
 	</span>
 </template>

src/styles/_mobile.scss

@@ -19,11 +19,12 @@
 		#title {
 			text-align: center;
 			width: 100%;
+			transition: none;
 		}
 
 		&.with-feed, &.with-settings {
 			#title {
-				max-width: calc(100vw - var.$block-spacing - #{$panel-actual-width} - (var.$button-width + var.$block-spacing * 2) * 2);
+				max-width: calc(100vw - var.$block-spacing - (var.$button-width + 2 * var.$block-spacing) * 2);
 			}
 
 			#submap {

src/styles/_page.project.feed.scss

@@ -154,28 +154,8 @@
 					}
 				}
 
-				.drill {
-
-					.drill-icon {
-
-						.drill-hover-icon {
-							display: none;
-							filter: drop-shadow(0px 1px 1px color.$over-img-shadow);
-						}
-					}
-
-					&:hover {
-						.sub {
-							display: none;
-						}
-						.drill-hover-icon {
-							color: color.$message-flashy;
-						}
-					}
-
-					.comment {
-						background: color.$message-bg-light;
-					}
+				.comment {
+					background: color.$message-bg-light;
 				}
 
 				.weather {
@@ -261,7 +241,6 @@
 							}
 
 							.drill-icon {
-
 								.drill-image {
 									color: transparent;
 								}