Skip to content

Commit b332618

Browse files
mazdakdevmazdakdev
committed
refactor(scripts): Move burger menu logic to external JS file
1 parent 5bf980d commit b332618

20 files changed

+671
-641
lines changed

‎javascript/script.js‎

Lines changed: 21 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,4 +7,24 @@
77
* https://esbuild.github.io/
88
*/
99

10-
alert("hi");
10+
document.addEventListener( 'DOMContentLoaded', function() {
11+
const burgerBtn = document.getElementById( 'burgerBtn' );
12+
13+
if ( burgerBtn ) {
14+
burgerBtn.addEventListener( 'click', function() {
15+
const status = document.getElementById( 'mobile' );
16+
const navStatus = document.getElementById( 'nav' );
17+
const body = document.getElementById( 'body' );
18+
19+
if ( ! status.classList.contains( 'navigation' ) && navStatus.classList.contains( 'hidden' ) ) {
20+
status.classList.add( 'navigation' );
21+
navStatus.classList.remove( 'hidden' );
22+
body.classList.add( 'overflow-hidden' );
23+
} else {
24+
status.classList.remove( 'navigation' );
25+
navStatus.classList.add( 'hidden' );
26+
body.classList.remove( 'overflow-hidden' );
27+
}
28+
} );
29+
}
30+
} );

‎theme/404.php‎

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
<?php
2+
23
/**
34
* The template for displaying 404 pages (not found)
45
*
@@ -9,14 +10,14 @@
910

1011
get_header();
1112
?>
12-
<div class="flex flex-col md:flex-row mt-8">
13-
<img class="md:h-64 md:w-64 w-52 h-52 animate__animated animate__headShake self-center" src="https://mazdak.dev/assets/images/404.png" />
13+
<div class="flex flex-col md:flex-row mt-8">
14+
<img class="md:h-64 md:w-64 w-52 h-52 animate__animated animate__headShake self-center" src="https://mazdak.dev/assets/images/404.png" />
1415

15-
<div class="self-center ml-4 text-center md:text-start">
16-
<strong class="text-4xl md:text-5xl text-gray-100">Page Not Found <i>!<i></strong>
17-
<div class="text-2xl text-gray-300">You've Got Lost.</div>
18-
</div>
19-
</div>
16+
<div class="self-center ml-4 text-center md:text-start">
17+
<strong class="text-4xl md:text-5xl text-gray-100">Page Not Found <i>!<i></strong>
18+
<div class="text-2xl text-gray-300">You've Got Lost.</div>
19+
</div>
20+
</div>
2021

2122
<?php
2223
get_footer();

‎theme/archive-snippets.php‎

Lines changed: 21 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -7,36 +7,35 @@
77
<h1 class="md:text-5xl text-4xl text-white md:mt-8 mt-16 "><strong>Code Snippets</strong></h1>
88
<h3 class="text-gray-400 mt-4">All of my tricky code snippets, Codes(words) are powerful !
99
</h3>
10-
11-
10+
11+
1212

1313
<div class="grid w-full grid-cols-2 gap-4 my-2 mt-8 ">
14-
<?php
15-
$post_query = new WP_Query([
16-
'post_type' => 'snippets',
17-
]);
18-
19-
if($post_query->have_posts() ) {
20-
while($post_query->have_posts() ) {
21-
$post_query->the_post();
14+
<?php
15+
$post_query = new WP_Query([
16+
'post_type' => 'snippets',
17+
]);
18+
19+
if ($post_query->have_posts()) {
20+
while ($post_query->have_posts()) {
21+
$post_query->the_post();
2222
?>
23-
<a href="<?php the_permalink(); ?>" class="border border-gray-800 hover:border-gray-700 rounded p-4 w-full bg-gray-900" to="/snippets/django">
24-
<img src="<?php the_post_thumbnail_url() ?>" class="rounded-full" loading="lazy" width="32" height="32">
25-
<h3 class="text-lg font-bold text-left mt-2 text-gray-100"> <?php the_excerpt(); ?></h3>
26-
<p class="mt-1 text-gray-400">
27-
<?php the_title(); ?>
28-
</p>
29-
</a>
30-
<?php
23+
<a href="<?php the_permalink(); ?>" class="border border-gray-800 hover:border-gray-700 rounded p-4 w-full bg-gray-900" to="/snippets/django">
24+
<img src="<?php the_post_thumbnail_url() ?>" class="rounded-full" loading="lazy" width="32" height="32">
25+
<h3 class="text-lg font-bold text-left mt-2 text-gray-100"> <?php the_excerpt(); ?></h3>
26+
<p class="mt-1 text-gray-400">
27+
<?php the_title(); ?>
28+
</p>
29+
</a>
30+
<?php
31+
}
3132
}
32-
}
33-
?>
33+
?>
3434
</div>
3535

3636

3737

3838
</div>
3939

4040
<?php
41-
get_footer(); ?>
42-
41+
get_footer(); ?>

‎theme/archive.php‎

Lines changed: 12 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
<?php
2+
23
/**
34
* The template for displaying archive pages
45
*
@@ -10,22 +11,22 @@
1011
get_header();
1112
?>
1213

13-
<section id="primary">
14-
<main id="main">
14+
<section id="primary">
15+
<main id="main">
1516

16-
<?php if ( have_posts() ) : ?>
17+
<?php if (have_posts()) : ?>
1718

1819
<header class="page-header">
19-
<?php the_archive_title( '<h1 class="page-title">', '</h1>' ); ?>
20+
<?php the_archive_title('<h1 class="page-title">', '</h1>'); ?>
2021
</header><!-- .page-header -->
2122

22-
<?php
23+
<?php
2324
// Start the Loop.
24-
while ( have_posts() ) :
25+
while (have_posts()) :
2526
the_post();
26-
get_template_part( 'template-parts/content/content', 'excerpt' );
27+
get_template_part('template-parts/content/content', 'excerpt');
2728

28-
// End the loop.
29+
// End the loop.
2930
endwhile;
3031

3132
// Previous/next page navigation.
@@ -34,12 +35,12 @@
3435
else :
3536

3637
// If no content, include the "No posts found" template.
37-
get_template_part( 'template-parts/content/content', 'none' );
38+
get_template_part('template-parts/content/content', 'none');
3839

3940
endif;
4041
?>
41-
</main><!-- #main -->
42-
</section><!-- #primary -->
42+
</main><!-- #main -->
43+
</section><!-- #primary -->
4344

4445
<?php
4546
get_footer();

‎theme/blog.php‎

Lines changed: 32 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -6,46 +6,45 @@
66
<div class="w-full md:mt-8 mt-8 prose-dark max-w-none text-gray-200">
77
<h1 class="text-5xl text-white md:mt-8 mt-16 "><strong>Blog</strong></h1>
88
<h3 class="text-gray-400 mt-4">A personal blog about my perception of everything that exists.</h3>
9-
10-
11-
9+
10+
11+
1212
<h2 class="text-4xl text-white mt-8 mb-8"><strong>All Posts</strong></h2>
1313

14-
<?php
15-
$post_query = new WP_Query([
16-
'post_type' => 'post',
17-
]);
14+
<?php
15+
$post_query = new WP_Query([
16+
'post_type' => 'post',
17+
]);
1818

19-
if($post_query->have_posts() ) {
20-
while($post_query->have_posts() ) {
21-
$post_query->the_post();
19+
if ($post_query->have_posts()) {
20+
while ($post_query->have_posts()) {
21+
$post_query->the_post();
2222
?>
23-
24-
25-
<a href="<?php the_permalink(); ?>" class="w-full">
26-
<div class="mb-8">
27-
<div class="flex flex-col justify-between md:flex-row">
28-
<h4 class="w-full mb-2 text-lg font-medium md:text-xl text-gray-100">
29-
<?php the_title(); ?>
30-
</h4>
31-
</div>
32-
<p class="text-gray-400">
33-
<?php
34-
35-
$excerpt = apply_filters( 'the_content', get_the_excerpt() );
36-
echo wp_trim_words( $excerpt, 30);
37-
?>
38-
</p>
39-
</div>
40-
</a>
4123

42-
<?php
24+
25+
<a href="<?php the_permalink(); ?>" class="w-full">
26+
<div class="mb-8">
27+
<div class="flex flex-col justify-between md:flex-row">
28+
<h4 class="w-full mb-2 text-lg font-medium md:text-xl text-gray-100">
29+
<?php the_title(); ?>
30+
</h4>
31+
</div>
32+
<p class="text-gray-400">
33+
<?php
34+
35+
$excerpt = apply_filters('the_content', get_the_excerpt());
36+
echo wp_trim_words($excerpt, 30);
37+
?>
38+
</p>
39+
</div>
40+
</a>
41+
42+
<?php
43+
}
4344
}
44-
}
45-
?>
45+
?>
4646

4747
</div>
4848

4949
<?php
50-
get_footer(); ?>
51-
50+
get_footer(); ?>

‎theme/comments.php‎

Lines changed: 29 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -3,31 +3,31 @@
33
@package sunsettheme
44
*/
55

6-
if( post_password_required() ){
6+
if (post_password_required()) {
77
return;
88
}
99

1010
?>
1111

1212
<?php comment_form(); ?>
13-
<?php
14-
if( have_comments() ):
13+
<?php
14+
if (have_comments()):
1515
?>
1616
<hr class="my-8 h-px bg-gray-800 border-0 mt-12"> <?php endif; ?>
1717

1818

1919

2020
<div id="comments" class="comments-area">
21-
22-
<?php
23-
if( have_comments() ):
21+
22+
<?php
23+
if (have_comments()):
2424
//We have comments
2525
?>
26-
27-
<ol class="comment-list">
28-
29-
<?php
30-
26+
27+
<ol class="comment-list">
28+
29+
<?php
30+
3131
$args = array(
3232
'walker' => null,
3333
'max_depth' => '',
@@ -45,26 +45,26 @@
4545
'short_ping' => false,
4646
'echo' => true
4747
);
48-
49-
wp_list_comments( $args );
48+
49+
wp_list_comments($args);
50+
?>
51+
52+
</ol>
53+
54+
<?php
55+
if (!comments_open() && get_comments_number()):
5056
?>
51-
52-
</ol>
53-
54-
<?php
55-
if( !comments_open() && get_comments_number() ):
56-
?>
57-
58-
<p class="no-comments"><?php esc_html_e( 'Comments are closed.', 'sunsettheme' ); ?></p>
59-
60-
<?php
61-
endif;
62-
?>
63-
64-
<?php
57+
58+
<p class="no-comments"><?php esc_html_e('Comments are closed.', 'sunsettheme'); ?></p>
59+
60+
<?php
6561
endif;
62+
?>
63+
64+
<?php
65+
endif;
6666
?>
67-
6867

69-
68+
69+
7070
</div><!-- .comments-area -->

0 commit comments

Comments
 (0)