Start responsive design implementation
This commit brings a big update to the screen.css file, making the homepage + policy popup almost 100% responsive. Another added feature is in the left sidebar: the currently viewed paragraph's title is now highlighted.
This commit is contained in:
@@ -1,5 +1,8 @@
|
||||
let headers;
|
||||
let sidebarLinks;
|
||||
|
||||
$(document).ready(function () {
|
||||
const headers = $(".mind-post_content h2, .mind-post_content h3").toArray();
|
||||
headers = $(".mind-post_content h2, .mind-post_content h3").toArray();
|
||||
const sidebar = $("#mind-post_sidebar-left");
|
||||
|
||||
for (let i = 0; i < headers.length; i++) {
|
||||
@@ -12,5 +15,25 @@ $(document).ready(function () {
|
||||
const newLine = "<" + headerType + "> <a href=\"#" + headerId + "\">" + headerText + "</a> </" + headerType + ">";
|
||||
sidebar.append(newLine);
|
||||
}
|
||||
});
|
||||
|
||||
sidebarLinks = $("#mind-post_sidebar-left a").toArray();
|
||||
});
|
||||
$(function () {
|
||||
$(window).scroll(function () {
|
||||
let bottomScroll = $(window).scrollTop() + ($(window).height() / 2);
|
||||
let found = false;
|
||||
|
||||
for (let i = headers.length - 1; i >= 0; i--) {
|
||||
const currentHeader = headers[i];
|
||||
const currentSidebarLink = sidebarLinks[i];
|
||||
$(currentSidebarLink).removeClass("current");
|
||||
|
||||
const headerVPPosition = $(currentHeader).offset().top;
|
||||
|
||||
if (!found && bottomScroll > headerVPPosition) {
|
||||
$(currentSidebarLink).addClass("current");
|
||||
found = true;
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user