@@ -11,14 +11,22 @@ document.addEventListener('DOMContentLoaded', function() {
1111
1212 // Apply the current theme
1313 function applyTheme ( theme ) {
14- if ( theme === 'dark' ) {
15- body . setAttribute ( 'data-theme' , 'dark' ) ;
16- themeIcon . className = 'fas fa-moon' ;
17- localStorage . setItem ( 'theme' , 'dark' ) ;
18- } else {
19- body . removeAttribute ( 'data-theme' ) ;
20- themeIcon . className = 'fas fa-sun' ;
21- localStorage . setItem ( 'theme' , 'light' ) ;
14+ try {
15+ if ( theme === 'dark' ) {
16+ body . setAttribute ( 'data-theme' , 'dark' ) ;
17+ if ( themeIcon ) {
18+ themeIcon . className = 'fas fa-moon' ;
19+ }
20+ localStorage . setItem ( 'theme' , 'dark' ) ;
21+ } else {
22+ body . removeAttribute ( 'data-theme' ) ;
23+ if ( themeIcon ) {
24+ themeIcon . className = 'fas fa-sun' ;
25+ }
26+ localStorage . setItem ( 'theme' , 'light' ) ;
27+ }
28+ } catch ( error ) {
29+ console . warn ( 'Theme application error:' , error ) ;
2230 }
2331 }
2432
@@ -28,9 +36,13 @@ document.addEventListener('DOMContentLoaded', function() {
2836 // Theme toggle click handler
2937 if ( themeToggle ) {
3038 themeToggle . addEventListener ( 'click' , function ( ) {
31- const currentTheme = localStorage . getItem ( 'theme' ) || 'light' ;
32- const newTheme = currentTheme === 'light' ? 'dark' : 'light' ;
33- applyTheme ( newTheme ) ;
39+ try {
40+ const currentTheme = localStorage . getItem ( 'theme' ) || 'light' ;
41+ const newTheme = currentTheme === 'light' ? 'dark' : 'light' ;
42+ applyTheme ( newTheme ) ;
43+ } catch ( error ) {
44+ console . warn ( 'Theme toggle error:' , error ) ;
45+ }
3446 } ) ;
3547 }
3648
@@ -40,56 +52,70 @@ document.addEventListener('DOMContentLoaded', function() {
4052 if ( backToTopButton ) {
4153 // Show button when scrolling down
4254 window . addEventListener ( 'scroll' , function ( ) {
43- if ( window . pageYOffset > 300 ) {
44- backToTopButton . classList . add ( 'show' ) ;
45- } else {
46- backToTopButton . classList . remove ( 'show' ) ;
55+ try {
56+ if ( window . pageYOffset > 300 ) {
57+ backToTopButton . classList . add ( 'show' ) ;
58+ } else {
59+ backToTopButton . classList . remove ( 'show' ) ;
60+ }
61+ } catch ( error ) {
62+ console . warn ( 'Scroll handler error:' , error ) ;
4763 }
4864 } ) ;
4965
5066 // Scroll to top when clicked
5167 backToTopButton . addEventListener ( 'click' , function ( ) {
52- window . scrollTo ( {
53- top : 0 ,
54- behavior : 'smooth'
55- } ) ;
68+ try {
69+ window . scrollTo ( {
70+ top : 0 ,
71+ behavior : 'smooth'
72+ } ) ;
73+ } catch ( error ) {
74+ console . warn ( 'Scroll to top error:' , error ) ;
75+ // Fallback for older browsers
76+ window . scrollTo ( 0 , 0 ) ;
77+ }
5678 } ) ;
5779 }
5880
5981 // Smooth scrolling for anchor links
6082 document . querySelectorAll ( 'a[href^="#"]' ) . forEach ( anchor => {
6183 anchor . addEventListener ( 'click' , function ( e ) {
62- e . preventDefault ( ) ;
63- const target = document . querySelector ( this . getAttribute ( 'href' ) ) ;
64- if ( target ) {
65- target . scrollIntoView ( {
66- behavior : 'smooth' ,
67- block : 'start'
68- } ) ;
84+ try {
85+ e . preventDefault ( ) ;
86+ const target = document . querySelector ( this . getAttribute ( 'href' ) ) ;
87+ if ( target ) {
88+ target . scrollIntoView ( {
89+ behavior : 'smooth' ,
90+ block : 'start'
91+ } ) ;
92+ }
93+ } catch ( error ) {
94+ console . warn ( 'Smooth scroll error:' , error ) ;
6995 }
7096 } ) ;
7197 } ) ;
7298
73- // Add fade-in animation to content
74- const observerOptions = {
75- threshold : 0.1 ,
76- } ;
77-
78- const observer = new IntersectionObserver ( ( entries , observer ) => {
79- entries . forEach ( entry => {
80- if ( entry . isIntersecting ) {
81- entry . target . style . opacity = '1' ;
82- entry . target . style . transform = 'translateY(0)' ;
83- observer . unobserve ( entry . target ) ;
84- }
85- } ) ;
86- } , observerOptions ) ;
99+ // Simple fade-in animation without IntersectionObserver for better compatibility
100+ function addFadeInAnimation ( ) {
101+ try {
102+ const elements = document . querySelectorAll ( '.content-wrapper, .card, .alert' ) ;
103+ elements . forEach ( ( el , index ) => {
104+ el . style . opacity = '0' ;
105+ el . style . transform = 'translateY(20px)' ;
106+ el . style . transition = 'opacity 0.6s ease, transform 0.6s ease' ;
107+
108+ // Use setTimeout instead of IntersectionObserver for better compatibility
109+ setTimeout ( ( ) => {
110+ el . style . opacity = '1' ;
111+ el . style . transform = 'translateY(0)' ;
112+ } , index * 100 ) ; // Stagger animations
113+ } ) ;
114+ } catch ( error ) {
115+ console . warn ( 'Animation error:' , error ) ;
116+ }
117+ }
87118
88- // Observe content elements
89- document . querySelectorAll ( '.content-wrapper, .card, .alert' ) . forEach ( el => {
90- el . style . opacity = '0' ;
91- el . style . transform = 'translateY(20px)' ;
92- el . style . transition = 'opacity 0.6s ease, transform 0.6s ease' ;
93- observer . observe ( el ) ;
94- } ) ;
95- } ) ;
119+ // Add fade-in animation after a short delay
120+ setTimeout ( addFadeInAnimation , 100 ) ;
121+ } ) ;
0 commit comments