Skip to content

Commit d397fe1

Browse files
committed
more styling and content updates
1 parent 8c6310d commit d397fe1

File tree

7 files changed

+255
-275
lines changed

7 files changed

+255
-275
lines changed

header.php

Lines changed: 111 additions & 110 deletions
Original file line numberDiff line numberDiff line change
@@ -1,110 +1,111 @@
1-
<?php
2-
3-
/**
4-
* The header for our theme
5-
*
6-
* This is the template that displays all of the <head> section and everything up until <div id="content">
7-
*
8-
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
9-
*
10-
* @package cjt
11-
*/
12-
13-
?>
14-
<!doctype html>
15-
<html <?php language_attributes(); ?>>
16-
17-
<head>
18-
<meta charset="<?php bloginfo('charset'); ?>">
19-
<meta name="viewport" content="width=device-width, initial-scale=1">
20-
<link rel="profile" href="https://gmpg.org/xfn/11">
21-
22-
<link rel="preconnect" href="https://fonts.googleapis.com">
23-
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
24-
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
25-
<?php wp_head(); ?>
26-
</head>
27-
28-
<body <?php body_class(); ?>>
29-
<?php wp_body_open(); ?>
30-
<div id="page" class="site">
31-
<a class="sr-only" href="#primary">
32-
<?php esc_html_e('Skip to content', 'cjt'); ?>
33-
</a>
34-
35-
<?php get_template_part('template-parts/components/component', 'announcement-bar'); ?>
36-
<header class="bg-white">
37-
<div class="mx-auto max-w-7xl md:p-5 py-2.5 px-5">
38-
<div class="flex items-center justify-between">
39-
<div class="flex-1 md:flex md:items-center md:gap-12">
40-
<a class="md:block hidden" href="<?= home_url(); ?>">
41-
<img src="<?= esc_url(get_template_directory_uri()); ?>/assets/images/logo.png" class="object-cover w-60" />
42-
</a>
43-
<a class="block md:hidden" href="<?= home_url(); ?>">
44-
<img src="<?= esc_url(get_template_directory_uri()); ?>/assets/images/logo-mobile.png" class="object-cover w-16" />
45-
</a>
46-
</div>
47-
48-
<div class="md:flex md:items-center gap-5">
49-
<nav aria-label="Global" class="hidden md:block">
50-
<?php
51-
wp_nav_menu(array(
52-
'menu_class' => 'menu',
53-
'menu_id' => 'nav-menu',
54-
));
55-
?>
56-
</nav>
57-
58-
<div class="flex items-center gap-4">
59-
<div class="sm:gap-4 md:flex hidden">
60-
<a class="rounded-md bg-brand-blue shadow-md lg:px-6 px-3 lg:text-lg text-sm lg:py-3.5 py-2 font-semibold text-white" href="<?php echo site_url('/pricing'); ?>">
61-
Get CJT PLUS
62-
</a>
63-
</div>
64-
65-
<div class="flex items-center md:hidden">
66-
<?php
67-
wp_nav_menu(array(
68-
'container' => 'nav',
69-
'container_class' => 'block md:hidden peer shadow-xl bg-white duration-300 transition-all translate-x-full fixed right-0 top-0 h-full w-[calc(100%-50px)] z-50',
70-
'container_aria_label' => 'Global',
71-
'menu_class' => 'block text-center py-20 px-5',
72-
'item_spacing' => 80,
73-
'add_li_class' => 'text-2xl py-2'
74-
));
75-
?>
76-
<button class="text-neutral-500 transition hidden peer-aria-hidden:block peer-aria-hidden:z-[100]" data-toggle-menu>
77-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#171717" class="size-8">
78-
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
79-
</svg>
80-
</button>
81-
<button class="text-neutral-800 rounded-full bg-neutral-100 transition peer-aria-hidden:hidden relative block -top-16 z-[100] p-1.5" data-toggle-menu>
82-
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-8 stroke-current">
83-
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
84-
</svg>
85-
</button>
86-
87-
</div>
88-
</div>
89-
</div>
90-
</div>
91-
</div>
92-
</header>
93-
94-
<script>
95-
document.addEventListener( 'DOMContentLoaded', () => {
96-
const toggleBtns = document.querySelectorAll( 'button[data-toggle-menu]' )
97-
const mobileMenu = toggleBtns[ 0 ].previousElementSibling
98-
mobileMenu.setAttribute( 'aria-hidden', 'true' )
99-
toggleBtns.forEach( btn => btn.addEventListener( 'click', () => {
100-
if ( mobileMenu.hasAttribute( 'aria-hidden' ) ) {
101-
mobileMenu.removeAttribute( 'aria-hidden' )
102-
document.documentElement.classList.add( 'overflow-hidden' )
103-
} else {
104-
document.documentElement.classList.remove( 'overflow-hidden' )
105-
mobileMenu.setAttribute( 'aria-hidden', 'true' )
106-
}
107-
mobileMenu.classList.toggle( 'translate-x-full' )
108-
} ) )
109-
} )
110-
</script>
1+
<?php
2+
3+
/**
4+
* The header for our theme
5+
*
6+
* This is the template that displays all of the <head> section and everything up until <div id="content">
7+
*
8+
* @link https://developer.wordpress.org/themes/basics/template-files/#template-partials
9+
*
10+
* @package cjt
11+
*/
12+
13+
?>
14+
<!doctype html>
15+
<html <?php language_attributes(); ?>>
16+
17+
<head>
18+
<meta charset="<?php bloginfo('charset'); ?>">
19+
<meta name="viewport" content="width=device-width, initial-scale=1">
20+
<link rel="profile" href="https://gmpg.org/xfn/11">
21+
22+
<link rel="preconnect" href="https://fonts.googleapis.com">
23+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
24+
<link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
25+
<link href="https://api.fontshare.com/v2/css?f[]=general-sans@300,400,500,600,700&display=swap" rel="stylesheet">
26+
<?php wp_head(); ?>
27+
</head>
28+
29+
<body <?php body_class('font-body'); ?>>
30+
<?php wp_body_open(); ?>
31+
<div id="page" class="site">
32+
<a class="sr-only" href="#primary">
33+
<?php esc_html_e('Skip to content', 'cjt'); ?>
34+
</a>
35+
36+
<!--<?php get_template_part('template-parts/components/component', 'announcement-bar'); ?>-->
37+
<header class="bg-white">
38+
<div class="mx-auto max-w-7xl md:p-5 py-2.5 px-5">
39+
<div class="flex items-center justify-between">
40+
<div class="flex-1 md:flex md:items-center md:gap-12">
41+
<a class="md:block hidden" href="<?= home_url(); ?>">
42+
<img src="<?= esc_url(get_template_directory_uri()); ?>/assets/images/logo.png" class="object-cover w-60" />
43+
</a>
44+
<a class="block md:hidden" href="<?= home_url(); ?>">
45+
<img src="<?= esc_url(get_template_directory_uri()); ?>/assets/images/logo-mobile.png" class="object-cover w-16" />
46+
</a>
47+
</div>
48+
49+
<div class="md:flex md:items-center gap-5">
50+
<nav aria-label="Global" class="hidden md:block">
51+
<?php
52+
wp_nav_menu(array(
53+
'menu_class' => 'menu',
54+
'menu_id' => 'nav-menu',
55+
));
56+
?>
57+
</nav>
58+
59+
<div class="flex items-center gap-4">
60+
<div class="sm:gap-4 md:flex hidden">
61+
<a class="rounded-md bg-brand-blue shadow-md lg:px-6 px-3 lg:text-lg text-sm lg:py-3.5 py-2 font-semibold text-white" href="<?php echo site_url('/pricing'); ?>">
62+
Get CJT PLUS
63+
</a>
64+
</div>
65+
66+
<div class="flex items-center md:hidden">
67+
<?php
68+
wp_nav_menu(array(
69+
'container' => 'nav',
70+
'container_class' => 'block md:hidden peer shadow-xl bg-white duration-300 transition-all translate-x-full fixed right-0 top-0 h-full w-[calc(100%-50px)] z-50',
71+
'container_aria_label' => 'Global',
72+
'menu_class' => 'block text-center py-20 px-5',
73+
'item_spacing' => 80,
74+
'add_li_class' => 'text-2xl py-2'
75+
));
76+
?>
77+
<button class="text-neutral-500 transition hidden peer-aria-hidden:block peer-aria-hidden:z-[100]" data-toggle-menu>
78+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="#171717" class="size-8">
79+
<path stroke-linecap="round" stroke-linejoin="round" d="M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5" />
80+
</svg>
81+
</button>
82+
<button class="text-neutral-800 rounded-full bg-neutral-100 transition peer-aria-hidden:hidden relative block -top-16 z-[100] p-1.5" data-toggle-menu>
83+
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="size-8 stroke-current">
84+
<path stroke-linecap="round" stroke-linejoin="round" d="M6 18 18 6M6 6l12 12" />
85+
</svg>
86+
</button>
87+
88+
</div>
89+
</div>
90+
</div>
91+
</div>
92+
</div>
93+
</header>
94+
95+
<script>
96+
document.addEventListener( 'DOMContentLoaded', () => {
97+
const toggleBtns = document.querySelectorAll( 'button[data-toggle-menu]' )
98+
const mobileMenu = toggleBtns[ 0 ].previousElementSibling
99+
mobileMenu.setAttribute( 'aria-hidden', 'true' )
100+
toggleBtns.forEach( btn => btn.addEventListener( 'click', () => {
101+
if ( mobileMenu.hasAttribute( 'aria-hidden' ) ) {
102+
mobileMenu.removeAttribute( 'aria-hidden' )
103+
document.documentElement.classList.add( 'overflow-hidden' )
104+
} else {
105+
document.documentElement.classList.remove( 'overflow-hidden' )
106+
mobileMenu.setAttribute( 'aria-hidden', 'true' )
107+
}
108+
mobileMenu.classList.toggle( 'translate-x-full' )
109+
} ) )
110+
} )
111+
</script>

index.php

Lines changed: 59 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -1,59 +1,59 @@
1-
<?php
2-
/**
3-
* The main template file
4-
*
5-
* This is the most generic template file in a WordPress theme
6-
* and one of the two required files for a theme (the other being style.css).
7-
* It is used to display a page when nothing more specific matches a query.
8-
* E.g., it puts together the home page when no home.php file exists.
9-
*
10-
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/
11-
*
12-
* @package cjt
13-
*/
14-
15-
get_header();
16-
?>
17-
18-
<main id="primary" class="site-main">
19-
20-
<?php
21-
if (have_posts()) :
22-
23-
if (is_home() && ! is_front_page()) :
24-
?>
25-
<header>
26-
<h1 class="page-title screen-reader-text">
27-
<?php single_post_title(); ?>
28-
</h1>
29-
</header>
30-
<?php
31-
endif;
32-
33-
/* Start the Loop */
34-
while (have_posts()) :
35-
the_post();
36-
37-
/*
38-
* Include the Post-Type-specific template for the content.
39-
* If you want to override this in a child theme, then include a file
40-
* called content-___.php (where ___ is the Post Type name) and that will be used instead.
41-
*/
42-
get_template_part('template-parts/content', get_post_type());
43-
44-
endwhile;
45-
46-
the_posts_navigation();
47-
48-
else :
49-
50-
get_template_part('template-parts/content', 'none');
51-
52-
endif;
53-
?>
54-
55-
</main><!-- #main -->
56-
57-
<?php
58-
get_sidebar();
59-
get_footer();
1+
<?php
2+
/**
3+
* The main template file
4+
*
5+
* This is the most generic template file in a WordPress theme
6+
* and one of the two required files for a theme (the other being style.css).
7+
* It is used to display a page when nothing more specific matches a query.
8+
* E.g., it puts together the home page when no home.php file exists.
9+
*
10+
* @link https://developer.wordpress.org/themes/basics/template-hierarchy/
11+
*
12+
* @package cjt
13+
*/
14+
15+
get_header();
16+
?>
17+
18+
<main id="primary" class="font-body">
19+
20+
<?php
21+
if (have_posts()) :
22+
23+
if (is_home() && ! is_front_page()) :
24+
?>
25+
<header>
26+
<h1 class="page-title screen-reader-text">
27+
<?php single_post_title(); ?>
28+
</h1>
29+
</header>
30+
<?php
31+
endif;
32+
33+
/* Start the Loop */
34+
while (have_posts()) :
35+
the_post();
36+
37+
/*
38+
* Include the Post-Type-specific template for the content.
39+
* If you want to override this in a child theme, then include a file
40+
* called content-___.php (where ___ is the Post Type name) and that will be used instead.
41+
*/
42+
get_template_part('template-parts/content', get_post_type());
43+
44+
endwhile;
45+
46+
the_posts_navigation();
47+
48+
else :
49+
50+
get_template_part('template-parts/content', 'none');
51+
52+
endif;
53+
?>
54+
55+
</main><!-- #main -->
56+
57+
<?php
58+
get_sidebar();
59+
get_footer();

page-home.php

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,7 @@
1919
get_template_part('template-parts/sections/section', 'hero');
2020
get_template_part('template-parts/sections/section', 'cards');
2121
get_template_part('template-parts/sections/section', 'reasons');
22-
get_template_part('template-parts/sections/section', 'features');
22+
//get_template_part('template-parts/sections/section', 'features');
2323
get_template_part('template-parts/sections/section', 'free-reasons');
2424
get_template_part('template-parts/sections/section', 'social-proof');
2525
get_template_part('template-parts/sections/section', 'testimonials');

0 commit comments

Comments
 (0)