neosubhamoy/neosubhamoy-portfolio
1
1
Fork 0
mirror of https://github.com/neosubhamoy/neosubhamoy-portfolio.git synced 2025-12-19 19:23:02 +05:30
Code Issues Wiki Activity

(refactor): separated js configs for components in /assets/js/

Browse Source
This commit is contained in:
Subhamoy Biswas
2023-11-04 21:00:48 +05:30
parent 6835a31b27
commit 2df9b5c29c
4 changed files with 36 additions and 53 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
htdocs/assets/js/floatingbar-config.js Normal file
View File

@@ -0,0 +1,18 @@
//---controls the bottom floating bar behaviour
let lastScrollTop = 0;
window.addEventListener("scroll", function () {
const st = window.pageYOffset || document.documentElement.scrollTop;
if (st > lastScrollTop) {
// Scrolling down
document.getElementById("floating-bar").classList.add("floatingbar-slide-down");
document.getElementById("floating-bar").classList.remove("floatingbar-slide-up");
} else {
// Scrolling up
document.getElementById("floating-bar").classList.remove("floatingbar-slide-down");
document.getElementById("floating-bar").classList.add("floatingbar-slide-up");
}
lastScrollTop = st <= 0 ? 0 : st;
});

4
htdocs/assets/js/preloader-config.js Normal file
View File

@@ -0,0 +1,4 @@
//---controls the page preloader behaviour
window.addEventListener("load", function(){
$('#preloader').addClass('hidden');
});

39
htdocs/assets/style.css
View File

@@ -575,10 +575,6 @@ video {
left: 3.2rem;
}
.left-\[50vw\] {
left: 50vw;
}
.right-0 {
right: 0px;
}
@@ -1374,28 +1370,11 @@ video {
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0px_0px_30px\] {
--tw-shadow: 0px 0px 30px;
--tw-shadow-colored: 0px 0px 30px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-\[0px_0px_20px\] {
--tw-shadow: 0px 0px 20px;
--tw-shadow-colored: 0px 0px 20px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.shadow-accent_primary {
--tw-shadow-color: #38BDF8;
--tw-shadow: var(--tw-shadow-colored);
}
.shadow-accent_primary_extratransparent {
--tw-shadow-color: rgba(56, 189, 248, 0.15);
--tw-shadow: var(--tw-shadow-colored);
}
.shadow-accent_primary_transparent {
--tw-shadow-color: rgba(56, 189, 248, 0.30);
--tw-shadow: var(--tw-shadow-colored);
@@ -1485,16 +1464,21 @@ video {
color: rgb(255 255 255 / var(--tw-text-opacity));
}
.hover\:shadow-\[0px_0px_30px\]:hover {
--tw-shadow: 0px 0px 30px;
--tw-shadow-colored: 0px 0px 30px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-lg:hover {
--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.hover\:shadow-\[0px_0px_30px\]:hover {
--tw-shadow: 0px 0px 30px;
--tw-shadow-colored: 0px 0px 30px var(--tw-shadow-color);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
.hover\:shadow-accent_primary_extratransparent:hover {
--tw-shadow-color: rgba(56, 189, 248, 0.15);
--tw-shadow: var(--tw-shadow-colored);
}
.hover\:shadow-accent_primary_transparent:hover {
@@ -1507,11 +1491,6 @@ video {
--tw-shadow: var(--tw-shadow-colored);
}
.hover\:shadow-accent_primary_extratransparent:hover {
--tw-shadow-color: rgba(56, 189, 248, 0.15);
--tw-shadow: var(--tw-shadow-colored);
}
.group:hover .group-hover\:flex {
display: flex;
}

28
htdocs/index.php
View File

@@ -219,11 +219,10 @@ require './core/query_functions.php';
</div>
</div>
<?php require 'assets/_footer.php';?>
<script>
window.addEventListener("load", function(){
$('#preloader').addClass('hidden');
});
<script type="text/javascript" src="./assets/js/preloader-config.js"></script>
<script type="text/javascript" src="./assets/js/floatingbar-config.js"></script>
<script type="text/javascript">
//---hello textbox (hero-section) config
const texts = ["Namaste! 🙏", "Hello! 👋", "Konnichiwa! 😄", "Anyeonghaseyo! 😊", "Hola! 😃", "Bonjour! 😄", "Zdravstvuyte! 🙂", "Marhabaan! 😊", "Olá! 😃", "Salve! 🤠"];
const textContainer = document.getElementById("helloContainer");
@@ -238,6 +237,7 @@ require './core/query_functions.php';
}
animateText();
//---about me card hover animation config
const handleOnMouseMove = e => {
const { currentTarget: target } = e;
const rect = target.getBoundingClientRect(),
@@ -251,24 +251,6 @@ require './core/query_functions.php';
for(const card of document.querySelectorAll(".aboutcontainer")){
card.onmousemove = e => handleOnMouseMove(e);
}
let lastScrollTop = 0;
window.addEventListener("scroll", function () {
const st = window.pageYOffset || document.documentElement.scrollTop;
if (st > lastScrollTop) {
// Scrolling down
document.getElementById("floating-bar").classList.add("floatingbar-slide-down");
document.getElementById("floating-bar").classList.remove("floatingbar-slide-up");
} else {
// Scrolling up
document.getElementById("floating-bar").classList.remove("floatingbar-slide-down");
document.getElementById("floating-bar").classList.add("floatingbar-slide-up");
}
lastScrollTop = st <= 0 ? 0 : st;
});
</script>
</body>
</html>