updated readme, started new home layout

js/scripts.js

@@ -146,8 +146,27 @@
 		if (isHome & !isMobile) {
 			$('html').css({ overflowY: "hidden" })
 
+			//wrapping for big-small difference
+			$('article:first-child').wrap('<div class="home-wrapper-big home-wrapper-1"></div>')
+			$('article:nth-child(2)').wrap('<div class="home-wrapper-big home-wrapper-2"></div>')
+			var wrapArticles = $("article").length - 2
+			var n = 0
+			for (let i = 0; i < wrapArticles; i++) {
+				var j = i + 3
+				if (i % 6 == 0) {
+					n++
+				}
+				$('article:nth-child(' + j + ')').addClass("home-thumbnail-small-" + n)
+			}
+			for (let i = 0; i < n; i++) {
+				var j = i + 3
+				var k = i+1
+				$(".home-thumbnail-small-" + k).wrapAll('<div class="home-wrapper-small home-wrapper-' + j + '"></div>')
+			}
 		}
 
+
+
 		/* ----------------------------- Snap on mobile ----------------------------- */
 
 		if (isHome & isMobile) {
@@ -179,7 +198,7 @@
 			}
 
 			// var offset = ($(nextelem).offset().left) - desktophomemargin
-			var offset = ($(nextelem).position().left) - desktophomemargin
+			var offset = ($(nextelem).position().left)
 			console.log("scrolling to: " + nextelem.attr("id") + " - offset: " + offset)
 			$('html, body').stop().animate({ scrollLeft: offset }, 800);
 			return nextelem;
@@ -208,11 +227,12 @@
 
 		//checking the current scroll location for refresh:
 		if (isHome & !isMobile) {
-			var articleWidth = $('article:first-child')[0].getBoundingClientRect().width
+			var selector = 'main>#content>div'
+			var articleWidth = $(selector + ':first-child')[0].getBoundingClientRect().width
 			var currscroll = $('html').scrollLeft()
 			var scrollnr = Math.floor(currscroll / articleWidth) + 1
-			currElem = $('article:nth-child(' + scrollnr + ')')
-			console.log(currElem.attr("id"))
+			currElem = $( selector + ':nth-child(' + scrollnr + ')')
+			// console.log(currElem.attr("id"))
 		}
 
 		var scrolltimer = false;