small fixes

js/scripts.js

@@ -14,12 +14,26 @@
 
 		const vw = $(window).width()
 		const wow = window.outerWidth
-		// console.log(vw, wow)
+		const wiw = window.innerWidth
+		const bw = $('body').width()
+
+		const wih = window.innerHeight
+		const vh = $(window).height()
+
 
-		const bottomScrollHeight = window.innerHeight - $(window).height()
 		const desktophomemargin = $(".header-1")[0].getBoundingClientRect().width
 
 
+		const cssWidths = {
+			vw: vw,
+			wow: wow,
+			wiw: wiw,
+			bw: bw,
+			desktophomemargin: desktophomemargin
+		}
+		console.log(cssWidths)
+
+
 		/* --------------------------- css values to vars --------------------------- */
 		//isMobile
 		const isMobile = (_ => {
@@ -61,15 +75,21 @@
 			}
 		})()
 
+		const bottomScrollHeight = (_ => {
+			if (wih / vh > 1.5) {
+				return 0
+			} else {
+				let bs = wih - vh
+				return bs
+			}
+		})()
+
+
 
 		/* ========================================================================== */
 		/*                                  FUNCTIONS                                 */
 		/* ========================================================================== */
 
-		var focusSearch = function () {
-
-			$(".search-bar input").focus()
-		}
 
 		var rotateMenuButton = function () {
 			if ($(".menubutton button").hasClass("rotated")) {
@@ -95,10 +115,33 @@
 		/*                                   SEARCH                                   */
 		/* ========================================================================== */
 
+		// on mobile add to sidebar:
 		if (isMobile) {
 			$(".search-bar").prependTo("#sidebar-wrapper")
 		}
 
+		//clicking on desktop
+		if (!isMobile) {
+			$(".search-box button").click(function (e) {
+				// e.preventDefault()
+				var bar = $(this).next(".search-bar")
+				if (bar.hasClass("opensearch")) {
+					//if search is opened close:
+					bar.stop().animate({ width: "0" }, 400, function () {
+						bar.hide().removeClass("opensearch")
+					})
+				} else {
+					//if it's closed open:
+					bar.show().stop().animate({ width: wiw - (desktophomemargin * 3) }, 400, function () {
+						bar.addClass("opensearch")
+						$(".search-input").focus()
+					})
+					// console.log("calc(100% - " + (desktophomemargin * 2) + "px)")
+				}
+
+			})
+		}
+
 		/* ========================================================================== */
 		/*                                    MENU                                    */
 		/* ========================================================================== */
@@ -143,28 +186,6 @@
 
 		});
 
-		/* --------------------------------- Search --------------------------------- */
-
-		if (!isMobile) {
-			$(".search-box button").click(function (e) {
-				// e.preventDefault()
-				var bar = $(this).next(".search-bar")
-				if (bar.hasClass("opensearch")) {
-					//if search is opened close:
-					bar.stop().animate({ width: "0" }, 400, function () {
-						bar.hide().removeClass("opensearch")
-					})
-				} else {
-					//if it's closed open:
-					bar.show().stop().animate({ width: "50vw" }, 400, function () {
-						bar.addClass("opensearch")
-						$(".search-input").focus()
-					})
-				}
-
-			})
-		}
-
 
 		/* -------------------------------------------------------------------------- */
 		/*                               HOME & ARCHIVES                              */
@@ -229,8 +250,9 @@
 				}
 
 				//add bottom scrollbar to div on bottom:
-				$(".home-wrapper-big .metadata").css({ bottom: bottomScrollHeight })
-
+				if (bottomScrollHeight > 0) {
+					$(".home-wrapper-big .metadata").css({ bottom: bottomScrollHeight })
+				}
 			}//isHome || isArchive end
 		}// !isMobile end
 
@@ -485,7 +507,7 @@
 		/* ------------------------------ hover on home ----------------------------- */
 
 		//hover on big articles
-		$(".home-big h2, .home-big .thumbnailwrapper").hover(function () {
+		$(".home-big h2 a").hover(function () {
 			let cc = $(this)
 			let cArticle = cc.parents("article")
 			let cMetadata = cArticle.children(".metadata")
@@ -603,16 +625,16 @@
 			let itemClass = findClassByStart(tagClass, 'tag')
 
 			// add wrapper div
-			$(".sub-wrapper").append('<div id="' + itemId + '" class="bedo-sub-wrapper ' + itemClass + '"></div>')
+			// $(".sub-wrapper").append('<div id="' + itemId + '" class="bedo-sub-wrapper ' + itemClass + '"></div>')
 
 			// add tag title
-			$(this).children("a").clone().appendTo(".sub-wrapper #" + itemId)
+			// $(this).children("a").clone().appendTo(".sub-wrapper #" + itemId)
 
 			//add sub text
-			$(this).children("span").appendTo(".sub-wrapper #" + itemId)
+			// $(this).children("span").appendTo(".sub-wrapper #" + itemId)
 
 			//add circle
-			$(".sub-wrapper #" + itemId + " span").append('<div class="circle">')
+			// $(".sub-wrapper #" + itemId + " span").append('<div class="circle">')
 		})
 
 		//wrap each letter to spans