Init

2022-09-27 08:52:44 +00:00 · 2022-09-27 08:52:44 +00:00 · ecc5e66446
commit ecc5e66446
39 changed files with 8722 additions and 0 deletions
--- a/.gitattributes
+++ b/.gitattributes
@ -0,0 +1,2 @@
+.gitattributes export-ignore
+/.github/ export-ignore
--- a/.github/FUNDING.yml
+++ b/.github/FUNDING.yml
@ -0,0 +1,4 @@
+# These are supported funding model platforms
+
+github: jeffreyvr
+custom: ['https://vanrossum.dev/donate']
--- a/.gitignore
+++ b/.gitignore
@ -0,0 +1,3 @@
+/node_modules
+/.idea
+/.vscode
--- a/404.php
+++ b/404.php
@ -0,0 +1,24 @@
+<!DOCTYPE html>
+<html <?php language_attributes(); ?> class="no-js">
+<head>
+	<meta charset="<?php bloginfo( 'charset' ); ?>">
+	<meta name="viewport" content="width=device-width">
+	<link rel="profile" href="http://gmpg.org/xfn/11">
+
+	<?php wp_head(); ?>
+</head>
+<body class="antialiased">
+	<div class="md:flex min-h-screen">
+		<div class="w-full md:w-1/2 flex items-center justify-center">
+			<div class="max-w-sm m-8">
+				<div class="text-5xl md:text-15xl text-gray-800 border-primary border-b">404</div>
+				<div class="w-16 h-1 bg-purple-light my-3 md:my-6"></div>
+				<p class="text-gray-800 text-2xl md:text-3xl font-light mb-8"><?php _e( 'Sorry, the page you are looking for could not be found.', 'tailpress' ); ?></p>
+				<a href="<?php echo get_bloginfo( 'url' ); ?>" class="bg-primary px-4 py-2 rounded text-white">
+					<?php _e( 'Go Home', 'tailpress' ); ?>
+				</a>
+			</div>
+		</div>
+	</div>
+</body>
+</html>
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -0,0 +1,103 @@
+# Changelog
+
+All notable changes to TailPress will be documented in this file.
+
+## Unreleased
+
+## 3.1.0
+- Tailwind font sizes are now set as defined in `theme.json`.
+- Breakpoints now based on WordPress defaults (https://developer.wordpress.org/block-editor/reference-guides/packages/packages-viewport/#usage).
+- Providing `w-content`, `max-w-content`, `w-wide` and `max-w-wide` utility classes.
+- Content width is now actually the width as defined in `theme.json`.
+- Fixing align wide, width as defined in `theme.json`.
+- Updating Tailwind CSS to version 3.1.0.
+- Fix issues package.json scripts on Windows.
+
+## 3.0.0 - 2021-12-14
+
+- Updating Tailwind to 3.0.0.
+
+### TailPress installer
+
+- The TailPress installer (^0.2.0) now allows you to use Laravel Mix instead of esbuild by setting --compiler=mix.
+- You may now also set dbname, dbuser, dbpass and dbhost.
+
+## 2.0.0 - 2021-09-03
+
+- Switching to Tailwind CLI and esbuild instead of LaraveL Mix.
+- Removing `theme` subdirectory setup as it is no longer needed with the new build setup.
+- Removing `TailPress` class and it's functions (`tailpress()->get_header()` etc.) throughout the theme.
+- New `tailpress_asset` function to get the URL of an asset (previously `tailpress_mix`).
+- `tailpress_asset` function thaty appends a `time` parameter if [wp_get_environment_type()](https://developer.wordpress.org/reference/functions/wp_get_environment_type/) does not return `production` for cache busting (instead of the previously used versioned assets through `mix-manifest.json`).
+- Update screenshot.png.
+- Remove `block-editor.css`, only use `editor-style.css`.
+- Moving `editor-style.css` from root to `css` directory.
+- Update readme.
+
+## 1.0.0 - 2021-08-25
+
+- Replace `tailpress.json` with `theme.json` as used by WordPress core.
+- Move template files into `theme` subdirectory.
+- Move tailwind plugin to a [separate repository](https://github.com/jeffreyvr/tailwindcss-tailpress).
+- Update readme and adding section on using installer.
+
+## 0.1.0 - 2021-06-17
+
+- No longer depending on jQuery.
+- Fixes text color classes for the Block Editor.
+- Use safelist.txt to prevent WP classes from being purged.
+- Readme changes.
+- MIT License.
+
+## 0.0.9 - 2021-04-05
+
+- Updating to Tailwind CSS v2.1 which includes the JIT engine in core among other things.
+
+## 0.0.8 - 2021-03-23
+
+- Using TailwindCSS JIT for way faster compiling.
+- Updated readme.
+- Fix loading styling in block editor.
+- Check if mix-manifest.json file exists to prevent warning message.
+
+## 0.0.7 - 2021-02-15
+
+- Adding the option to apply submenu_class to the wp_nav_menu args.
+- Adding the option to apply classes on li_class and submenu_class on specific depths, like: li_class_0.
+
+### 0.0.6 - 2021-02-08
+
+- Fixes issue on Windows.
+
+## 0.0.5 - 2020-12-24
+
+- Set selectors on single line since this seems to cause issues (nested CSS) with production build (#241a612).
+
+## 0.0.4 - 2020-12-23
+
+- Add nested CSS support for PostCSS.
+- Minor readme changes.
+
+## 0.0.3 - 2020-12-22
+
+- Update Laravel Mix from version 5^ to 6^.
+- Removing Laravel Mix Tailwind, defining plugins within webpack.mix.js instead.
+- Switching from Sass to PostCSS for faster compiling.
+- Moved TailPress colors and font size settings to tailpress.json file.
+- Use tailpress.json to populate editor-color-palette and editor-font-sizes theme support automatically.
+- New screenshot.
+- Update readme.
+- Other minor fixes and improvements.
+
+## 0.0.2 - 2020-11-24
+
+- Adding basic support for the block editor Gutenberg by generating alignment, font size and color classes.
+Contains four theme colors out of the box, being primary, secondary, dark and light. This is adjustable of course.
+- Loading a editor-style.css.
+- Removing double slashes on resulting manifest asset URLs.
+- Modified template files to have a better starting point (including horizontal main navigation, footer always at the bottom for short pages).
+- Added a basic 404 page template.
+
+## 0.0.1 - 2020-11-19
+
+- Init release.
--- a/21
+++ b/21
@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) Jeffrey van Rossum <jeffrey@vanrossum.dev>
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
--- a/README.MD
+++ b/README.MD
@ -0,0 +1,101 @@
+<p><img src="http://tailpress.io/images/tailpress100.svg" width="260" alt="TailPress"></p>
+
+[![GitHub release](https://img.shields.io/github/release/jeffreyvr/tailpress?include_prereleases=&sort=semver)](https://github.com/jeffreyvr/tailpress/releases/)
+[![License](https://img.shields.io/badge/License-MIT-blue)](#license)
+[![issues - tailpress](https://img.shields.io/github/issues/jeffreyvr/tailpress)](https://github.com/jeffreyvr/tailpress/issues)
+
+# Introduction
+
+TailPress is a minimal boilerplate theme for WordPress using [Tailwind CSS](https://tailwindcss.com/).
+
+## Getting started
+
+### Using the installer
+
+You can get started using the installer (using composer):
+
+```bash
+composer global require jeffreyvanrossum/tailpress-installer
+
+tailpress new example-theme
+```
+
+*If you haven't already, make sure to place the `~/.composer/vendor/bin` directory in your `PATH` so the tailpress executable is found when you run the tailpress command in your terminal.*
+
+You can optionally set the theme name.
+
+```bash
+tailpress new example-theme --name="Example Theme"
+```
+
+By default, TailPress uses esbuild and Tailwind's CLI for compiling. Rather use Laravel Mix?
+
+```bash
+tailpress new example-theme --compiler="mix"
+```
+
+You can also initialize a new Git repository (branch defaults to `main`):
+
+```bash
+tailpress new example-theme --name="Example Theme" --git --branch="main"
+```
+
+Once your theme is ready, don't forget to cd into the directory.
+
+You will be asked if you would like to have WordPress installed as well. Keep in mind that you still need a local development environment for PHP and MySQL.
+
+### Regular method
+
+* Clone repo `git clone https://github.com/jeffreyvr/tailpress.git && cd tailpress`
+* Run `rm -rf .git` to remove git (or `rmdir .git` for Windows)
+* Run `npm install`
+* Run `npm run watch` to start developing
+
+### General
+
+TailPress uses the [Tailwind CLI](https://tailwindcss.com/docs/installation#using-tailwind-cli), [PostCSS](https://postcss.org) and [esbuild](https://esbuild.github.io).
+
+You will find the editable CSS and Javascript files within the `/resources` folder.
+
+Before you use your theme in production, make sure you run `npm run production`.
+
+## NPM Scripts
+
+There are several NPM scripts available. You'll find the full list in the `package.json` file under "scripts". A script is executed through the terminal by running `npm run script-name`.
+
+| Script     | Description                                                                    |
+|------------|--------------------------------------------------------------------------------|
+| production | Creates a production (minified) build of app.js, app.css and editor-style.css. |
+| dev        | Creates a development build of app.js, app.css and editor-style.css.           |
+| watch      | Runs several watch scripts concurrently.                                       |
+| watch-sync | Runs several watch scripts concurrently and starts `browser-sync`.             |
+
+## Block editor support
+
+TailPress comes with support for the [block editor](https://wordpress.org/support/article/wordpress-editor/).
+
+A basic setup for `theme.json` is included. This also means that you need to at least use WordPress 5.8. If you wan't to support earlier WordPress versions, you can use an [older version](https://github.com/jeffreyvr/tailpress/tree/0.1.1) of TailPress instead.
+
+CSS-classes for alignment (full, wide etc.) are generated automatically. You can opt-out on this by removing the plugin from the `tailwind.config.js` file.
+
+To make the editing experience within the block editor more in line with the front end styling, a `editor-style.css` is generated.
+
+### Define theme colors and font sizes
+
+Several colors and font sizes are defined from the beginning. You can modify them in `theme.json`.
+
+## Links
+
+* [TailPress website](https://tailpress.io)
+* [Screencasts](https://www.youtube.com/playlist?list=PL6GBdOp044SHIOSCZejodwr1HcYsC43wG)
+* [Tailwind CSS Documentation](https://tailwindcss.com/docs)
+* [Esbuild Documentation](https://esbuild.github.io)
+
+## Contributors
+
+* [Jeffrey van Rossum](https://github.com/jeffreyvr)
+* [All contributors](https://github.com/jeffreyvr/tailpress/graphs/contributors)
+
+## License
+
+MIT. Please see the [License File](/LICENSE) for more information.
--- a/comments.php
+++ b/comments.php
@ -0,0 +1,74 @@
+<?php
+/**
+ * If the current post is protected by a password and
+ * the visitor has not yet entered the password we will
+ * return early without loading the comments.
+ */
+if ( post_password_required() ) {
+	return;
+}
+?>
+
+<div id="comments" class="comments-area my-8">
+
+	<?php if ( have_comments() ) : ?>
+		<h2 class="comments-title">
+			<?php
+				printf(
+					_nx( 'One comment', '%1$s comments', get_comments_number(), 'comments title', 'tailpress' ),
+					number_format_i18n( get_comments_number() ),
+					get_the_title()
+				);
+			?>
+		</h2>
+
+		<ol class="comment-list">
+			<?php
+				wp_list_comments(
+					array(
+						'style'       => 'ol',
+						'short_ping'  => true,
+						'avatar_size' => 56,
+					)
+				);
+			?>
+		</ol>
+
+	<?php endif; ?>
+
+	<?php if ( get_comment_pages_count() > 1 && get_option( 'page_comments' ) ) : ?>
+
+		<nav class="comment-navigation" id="comment-nav-above">
+
+			<h1 class="screen-reader-text"><?php esc_html_e( 'Comment navigation', 'tailpress' ); ?></h1>
+
+			<?php if ( get_previous_comments_link() ) { ?>
+					<div class="nav-previous">
+						<?php previous_comments_link( __( '&larr; Older Comments', 'tailpress' ) ); ?>
+					</div>
+			<?php } ?>
+
+			<?php if ( get_next_comments_link() ) { ?>
+				<div class="nav-next">
+					<?php next_comments_link( __( 'Newer Comments &rarr;', 'tailpress' ) ); ?>
+				</div>
+			<?php } ?>
+
+		</nav><!-- #comment-nav-above -->
+
+	<?php endif; ?>
+
+	<?php if ( ! comments_open() && get_comments_number() && post_type_supports( get_post_type(), 'comments' ) ) : ?>
+		<p class="no-comments"><?php esc_html_e( 'Comments are closed.', 'tailpress' ); ?></p>
+	<?php endif; ?>
+
+	<?php
+	comment_form(
+		array(
+			'class_submit'  => 'bg-primary text-white cursor-pointer rounded font-bold py-2 px-4',
+			'comment_field' => '<textarea id="comment" name="comment" class="bg-gray-200 w-full py-2 px-3" aria-required="true"></textarea>',
+		)
+	);
+	?>
+
+</div>
--- a/css/app.css
+++ b/css/app.css
--- a/css/editor-style.css
+++ b/css/editor-style.css
@ -0,0 +1,587 @@
+.container {
+  width: 100%;
+  padding-right: 1rem;
+  padding-left: 1rem
+}
+
+@media (min-width: 480px) {
+  .container {
+    max-width: 480px
+  }
+}
+
+@media (min-width: 600px) {
+  .container {
+    max-width: 600px;
+    padding-right: 2rem;
+    padding-left: 2rem
+  }
+}
+
+@media (min-width: 782px) {
+  .container {
+    max-width: 782px
+  }
+}
+
+@media (min-width: 960px) {
+  .container {
+    max-width: 960px;
+    padding-right: 0rem;
+    padding-left: 0rem
+  }
+}
+
+@media (min-width: 1280px) {
+  .container {
+    max-width: 1280px
+  }
+}
+
+@media (min-width: 1440px) {
+  .container {
+    max-width: 1440px
+  }
+}
+
+.m-8 {
+  margin: 2rem
+}
+
+.my-3 {
+  margin-top: 0.75rem;
+  margin-bottom: 0.75rem
+}
+
+.my-8 {
+  margin-top: 2rem;
+  margin-bottom: 2rem
+}
+
+.mx-auto {
+  margin-left: auto;
+  margin-right: auto
+}
+
+.my-12 {
+  margin-top: 3rem;
+  margin-bottom: 3rem
+}
+
+.my-4 {
+  margin-top: 1rem;
+  margin-bottom: 1rem
+}
+
+.mb-8 {
+  margin-bottom: 2rem
+}
+
+.mt-4 {
+  margin-top: 1rem
+}
+
+.mb-10 {
+  margin-bottom: 2.5rem
+}
+
+.mb-4 {
+  margin-bottom: 1rem
+}
+
+.mb-1 {
+  margin-bottom: 0.25rem
+}
+
+.mb-12 {
+  margin-bottom: 3rem
+}
+
+.inline-block {
+  display: inline-block
+}
+
+.flex {
+  display: flex
+}
+
+.hidden {
+  display: none
+}
+
+.h-1 {
+  height: 0.25rem
+}
+
+.h-6 {
+  height: 1.5rem
+}
+
+.min-h-screen {
+  min-height: 100vh
+}
+
+.w-full {
+  width: 100%
+}
+
+.w-16 {
+  width: 4rem
+}
+
+.w-6 {
+  width: 1.5rem
+}
+
+.max-w-sm {
+  max-width: 24rem
+}
+
+.max-w-screen-lg {
+  max-width: 960px
+}
+
+.flex-none {
+  flex: none
+}
+
+.flex-grow {
+  flex-grow: 1
+}
+
+.cursor-pointer {
+  cursor: pointer
+}
+
+.list-disc {
+  list-style-type: disc
+}
+
+.list-decimal {
+  list-style-type: decimal
+}
+
+.flex-col {
+  flex-direction: column
+}
+
+.items-center {
+  align-items: center
+}
+
+.justify-center {
+  justify-content: center
+}
+
+.justify-between {
+  justify-content: space-between
+}
+
+.rounded {
+  border-radius: 0.25rem
+}
+
+.rounded-xl {
+  border-radius: 0.75rem
+}
+
+.border {
+  border-width: 1px
+}
+
+.border-b {
+  border-bottom-width: 1px
+}
+
+.border-primary {
+  --tw-border-opacity: 1;
+  border-color: rgb(14 165 233 / var(--tw-border-opacity))
+}
+
+.border-transparent {
+  border-color: transparent
+}
+
+.bg-primary {
+  --tw-bg-opacity: 1;
+  background-color: rgb(14 165 233 / var(--tw-bg-opacity))
+}
+
+.bg-gray-200 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(229 231 235 / var(--tw-bg-opacity))
+}
+
+.bg-gray-50 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(249 250 251 / var(--tw-bg-opacity))
+}
+
+.bg-white {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity))
+}
+
+.bg-gray-100 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(243 244 246 / var(--tw-bg-opacity))
+}
+
+.bg-gray-900 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(17 24 39 / var(--tw-bg-opacity))
+}
+
+.p-4 {
+  padding: 1rem
+}
+
+.px-4 {
+  padding-left: 1rem;
+  padding-right: 1rem
+}
+
+.py-2 {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem
+}
+
+.px-3 {
+  padding-left: 0.75rem;
+  padding-right: 0.75rem
+}
+
+.py-12 {
+  padding-top: 3rem;
+  padding-bottom: 3rem
+}
+
+.py-6 {
+  padding-top: 1.5rem;
+  padding-bottom: 1.5rem
+}
+
+.py-3 {
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem
+}
+
+.px-6 {
+  padding-left: 1.5rem;
+  padding-right: 1.5rem
+}
+
+.pb-12 {
+  padding-bottom: 3rem
+}
+
+.text-center {
+  text-align: center
+}
+
+.text-5xl {
+  font-size: 3rem;
+  line-height: 1
+}
+
+.text-2xl {
+  font-size: 1.5rem;
+  line-height: 2rem
+}
+
+.text-lg {
+  font-size: 1.125rem;
+  line-height: 1.75rem
+}
+
+.text-sm {
+  font-size: 0.875rem;
+  line-height: 1.25rem
+}
+
+.text-3xl {
+  font-size: 1.875rem;
+  line-height: 2.25rem
+}
+
+.font-light {
+  font-weight: 300
+}
+
+.font-bold {
+  font-weight: 700
+}
+
+.font-extrabold {
+  font-weight: 800
+}
+
+.font-medium {
+  font-weight: 500
+}
+
+.font-semibold {
+  font-weight: 600
+}
+
+.uppercase {
+  text-transform: uppercase
+}
+
+.leading-6 {
+  line-height: 1.5rem
+}
+
+.leading-tight {
+  line-height: 1.25
+}
+
+.tracking-tight {
+  letter-spacing: -0.025em
+}
+
+.text-gray-800 {
+  --tw-text-opacity: 1;
+  color: rgb(31 41 55 / var(--tw-text-opacity))
+}
+
+.text-white {
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity))
+}
+
+.text-gray-500 {
+  --tw-text-opacity: 1;
+  color: rgb(107 114 128 / var(--tw-text-opacity))
+}
+
+.text-gray-900 {
+  --tw-text-opacity: 1;
+  color: rgb(17 24 39 / var(--tw-text-opacity))
+}
+
+.text-gray-600 {
+  --tw-text-opacity: 1;
+  color: rgb(75 85 99 / var(--tw-text-opacity))
+}
+
+.text-secondary {
+  --tw-text-opacity: 1;
+  color: rgb(20 184 166 / var(--tw-text-opacity))
+}
+
+.text-primary {
+  --tw-text-opacity: 1;
+  color: rgb(14 165 233 / var(--tw-text-opacity))
+}
+
+.text-gray-700 {
+  --tw-text-opacity: 1;
+  color: rgb(55 65 81 / var(--tw-text-opacity))
+}
+
+.text-blue-500 {
+  --tw-text-opacity: 1;
+  color: rgb(59 130 246 / var(--tw-text-opacity))
+}
+
+.underline {
+  -webkit-text-decoration-line: underline;
+          text-decoration-line: underline
+}
+
+.antialiased {
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale
+}
+
+.transition-colors {
+  transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms
+}
+
+.duration-200 {
+  transition-duration: 200ms
+}
+
+.alignfull {
+  margin: 2rem calc(50% - 50vw) !important;
+  max-width: 100vw !important;
+  width: 100vw
+}
+
+.alignwide {
+  margin: 2rem 0;
+  max-width: 1280px !important
+}
+
+.alignnone {
+  margin-left: 0px;
+  margin-right: 0px;
+  height: auto;
+  max-width: 100%
+}
+
+.aligncenter {
+  margin: 0.5rem auto;
+  display: block
+}
+
+@media (min-width: 600px) {
+  .alignleft:not(.wp-block-button) {
+    margin-right: 0.5rem;
+    float: left
+  }
+
+  .alignright:not(.wp-block-button) {
+    margin-left: 0.5rem;
+    float: right
+  }
+
+  .wp-block-button.alignleft a {
+    float: left;
+    margin-right: 1rem
+  }
+
+  .wp-block-button.alignright a {
+    float: right;
+    margin-left: 1rem
+  }
+}
+
+.wp-caption {
+  display: inline-block
+}
+
+.wp-caption img {
+  margin-bottom: 0.5rem;
+  line-height: 1
+}
+
+.wp-caption-text {
+  font-size: 0.875rem;
+  color: #4b5563
+}
+
+body {
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"
+}
+
+.wp-block {
+  max-width: 1280px
+}
+
+.wp-block[data-align=wide] {
+  max-width: 1280px
+}
+
+.wp-block[data-align=full] {
+  max-width: 100%
+}
+
+.focus\:outline-none:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px
+}
+
+.focus\:ring-2:focus {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000)
+}
+
+.focus\:ring-gray-900:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(17 24 39 / var(--tw-ring-opacity))
+}
+
+.focus\:ring-offset-2:focus {
+  --tw-ring-offset-width: 2px
+}
+
+.focus\:ring-offset-white:focus {
+  --tw-ring-offset-color: #fff
+}
+
+@media (min-width: 600px) {
+  .sm\:w-auto {
+    width: auto
+  }
+}
+
+@media (min-width: 782px) {
+  .md\:my-6 {
+    margin-top: 1.5rem;
+    margin-bottom: 1.5rem
+  }
+
+  .md\:flex {
+    display: flex
+  }
+
+  .md\:w-1\/2 {
+    width: 50%
+  }
+
+  .md\:text-3xl {
+    font-size: 1.875rem;
+    line-height: 2.25rem
+  }
+}
+
+@media (min-width: 960px) {
+  .lg\:-mx-4 {
+    margin-left: -1rem;
+    margin-right: -1rem
+  }
+
+  .lg\:mx-4 {
+    margin-left: 1rem;
+    margin-right: 1rem
+  }
+
+  .lg\:mt-0 {
+    margin-top: 0px
+  }
+
+  .lg\:block {
+    display: block
+  }
+
+  .lg\:flex {
+    display: flex
+  }
+
+  .lg\:hidden {
+    display: none
+  }
+
+  .lg\:items-center {
+    align-items: center
+  }
+
+  .lg\:justify-between {
+    justify-content: space-between
+  }
+
+  .lg\:bg-transparent {
+    background-color: transparent
+  }
+
+  .lg\:p-0 {
+    padding: 0px
+  }
+
+  .lg\:text-7xl {
+    font-size: 4.5rem;
+    line-height: 1
+  }
+
+  .lg\:text-5xl {
+    font-size: 3rem;
+    line-height: 1
+  }
+}
--- a/footer.php
+++ b/footer.php
@ -0,0 +1,23 @@
+
+</main>
+
+<?php do_action( 'tailpress_content_end' ); ?>
+
+</div>
+
+<?php do_action( 'tailpress_content_after' ); ?>
+
+<footer id="colophon" class="site-footer bg-gray-50 py-12" role="contentinfo">
+	<?php do_action( 'tailpress_footer' ); ?>
+
+	<div class="container mx-auto text-center text-gray-500">
+		&copy; <?php echo date_i18n( 'Y' );?> - <?php echo get_bloginfo( 'name' );?>
+	</div>
+</footer>
+
+</div>
+
+<?php wp_footer(); ?>
+
+</body>
+</html>
--- a/front-page.php
+++ b/front-page.php
@ -0,0 +1,17 @@
+<?php get_header(); ?>
+
+
+	<?php if ( have_posts() ) : ?>
+		<?php
+		while ( have_posts() ) :
+			the_post();
+			the_content();
+			?>
+
+
+		<?php endwhile; ?>
+
+	<?php endif; ?>
+
+<?php
+get_footer();
--- a/functions.php
+++ b/functions.php
@ -0,0 +1,126 @@
+<?php
+
+/**
+ * Theme setup.
+ */
+function tailpress_setup() {
+
+// ##### Setup 🡒 Navigation
+
+	register_nav_menus(
+		array(
+			'primary' => __( 'Primary Menu', 'tailpress' ),
+		)
+	);
+
+// ##### Setup 🡒 Ajout des themes supports
+
+	 add_theme_support(
+		'html5',
+		array(
+			'search-form',
+			'comment-form',
+			'comment-list',
+			'gallery',
+			'caption',
+		)
+	);
+	add_theme_support( 'title-tag' );
+  add_theme_support( 'custom-logo' );
+	add_theme_support( 'post-thumbnails' );
+
+	add_theme_support( 'align-wide' );
+	add_theme_support( 'wp-block-styles' );
+
+	add_theme_support( 'editor-styles' );
+	add_editor_style( 'css/editor-style.css' );
+}
+
+add_action( 'after_setup_theme', 'tailpress_setup' );
+
+
+// ##### Enqueue Theme assets 🡒 Front
+
+function tailpress_enqueue_scripts() {
+	$theme = wp_get_theme();
+
+	wp_enqueue_style( 'tailpress', tailpress_asset( 'css/app.css' ), array(), $theme->get( 'Version' ) );
+	wp_enqueue_script( 'tailpress', tailpress_asset( 'js/app.js' ), array(), $theme->get( 'Version' ) );
+}
+
+
+// ##### Enqueue Theme assets 🡒 Back
+
+function enqueue_gutenberg_back_styles() {
+	// wp_enqueue_style( 'tailpress_back', tailpress_asset( 'css/app.css' ), array() );
+}
+add_action( 'enqueue_block_editor_assets', 'enqueue_gutenberg_back_styles' );
+
+
+add_action( 'wp_enqueue_scripts', 'tailpress_enqueue_scripts' );
+
+/**
+ * Get asset path.
+ *
+ * @param string  $path Path to asset.
+ *
+ * @return string
+ */
+function tailpress_asset( $path ) {
+	if ( wp_get_environment_type() === 'production' ) {
+		return get_stylesheet_directory_uri() . '/' . $path;
+	}
+
+	return add_query_arg( 'time', time(),  get_stylesheet_directory_uri() . '/' . $path );
+}
+
+/**
+ * Adds option 'li_class' to 'wp_nav_menu'.
+ *
+ * @param string  $classes String of classes.
+ * @param mixed   $item The curren item.
+ * @param WP_Term $args Holds the nav menu arguments.
+ *
+ * @return array
+ */
+function tailpress_nav_menu_add_li_class( $classes, $item, $args, $depth ) {
+	if ( isset( $args->li_class ) ) {
+		$classes[] = $args->li_class;
+	}
+
+	if ( isset( $args->{"li_class_$depth"} ) ) {
+		$classes[] = $args->{"li_class_$depth"};
+	}
+
+	return $classes;
+}
+
+add_filter( 'nav_menu_css_class', 'tailpress_nav_menu_add_li_class', 10, 4 );
+
+/**
+ * Adds option 'submenu_class' to 'wp_nav_menu'.
+ *
+ * @param string  $classes String of classes.
+ * @param mixed   $item The curren item.
+ * @param WP_Term $args Holds the nav menu arguments.
+ *
+ * @return array
+ */
+function tailpress_nav_menu_add_submenu_class( $classes, $args, $depth ) {
+	if ( isset( $args->submenu_class ) ) {
+		$classes[] = $args->submenu_class;
+	}
+
+	if ( isset( $args->{"submenu_class_$depth"} ) ) {
+		$classes[] = $args->{"submenu_class_$depth"};
+	}
+
+	return $classes;
+}
+
+add_filter( 'nav_menu_submenu_css_class', 'tailpress_nav_menu_add_submenu_class', 10, 3 );
+
+
+// require_once( __DIR__ . '/includes/errorlog.php');
+require_once( __DIR__ . '/includes/blocks.php');
+// require_once( __DIR__ . '/includes/logos.php');
--- a/header.php
+++ b/header.php
@ -0,0 +1,79 @@
+<!DOCTYPE html>
+<html <?php language_attributes(); ?>>
+<head>
+	<meta charset="<?php bloginfo( 'charset' ); ?>">
+	<meta name="viewport" content="width=device-width">
+	<link rel="profile" href="http://gmpg.org/xfn/11">
+	<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>">
+
+	<?php wp_head(); ?>
+</head>
+
+<body <?php body_class( 'bg-white text-gray-900 antialiased' ); ?>>
+
+<?php do_action( 'tailpress_site_before' ); ?>
+
+<div id="page" class="min-h-screen flex flex-col">
+
+	<?php do_action( 'tailpress_header' ); ?>
+
+	<header>
+
+		<div class="mx-auto container">
+			<div class="lg:flex lg:justify-between lg:items-center border-b py-6">
+				<div class="flex justify-between items-center">
+					<div>
+						<?php if ( has_custom_logo() ) { ?>
+                            <?php the_custom_logo(); ?>
+						<?php } else { ?>
+							<a href="<?php echo get_bloginfo( 'url' ); ?>" class="font-extrabold text-lg uppercase">
+								<?php echo get_bloginfo( 'name' ); ?>
+							</a>
+
+							<p class="text-sm font-light text-gray-600">
+								<?php echo get_bloginfo( 'description' ); ?>
+							</p>
+
+						<?php } ?>
+					</div>
+
+					<div class="lg:hidden">
+						<a href="#" aria-label="Toggle navigation" id="primary-menu-toggle">
+							<svg viewBox="0 0 20 20" class="inline-block w-6 h-6" version="1.1"
+								 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+								<g stroke="none" stroke-width="1" fill="currentColor" fill-rule="evenodd">
+									<g id="icon-shape">
+										<path d="M0,3 L20,3 L20,5 L0,5 L0,3 Z M0,9 L20,9 L20,11 L0,11 L0,9 Z M0,15 L20,15 L20,17 L0,17 L0,15 Z"
+											  id="Combined-Shape"></path>
+									</g>
+								</g>
+							</svg>
+						</a>
+					</div>
+				</div>
+
+				<?php
+				wp_nav_menu(
+					array(
+						'container_id'    => 'primary-menu',
+						'container_class' => 'hidden bg-gray-100 mt-4 p-4 lg:mt-0 lg:p-0 lg:bg-transparent lg:block',
+						'menu_class'      => 'lg:flex lg:-mx-4',
+						'theme_location'  => 'primary',
+						'li_class'        => 'lg:mx-4',
+						'fallback_cb'     => false,
+					)
+				);
+				?>
+			</div>
+		</div>
+	</header>
+
+	<div id="content" class="site-content flex-grow">
+
+		<?php if ( is_front_page() ) { ?>
+		
+		<?php } ?>
+
+		<?php do_action( 'tailpress_content_start' ); ?>
+
+		<main>
--- a/includes/blocks.php
+++ b/includes/blocks.php
@ -0,0 +1,85 @@
+<?php
+
+
+// ##### Blocks Category 🡒 Déclaration de la catégorie de blocks custom 
+function client_add_block_categories( $categories ) {
+	return array_merge(
+
+			[
+					[
+							'slug'  => 'client_blocks',
+							'title' => __( 'Mon titre ', 'client-blocks' ),
+							'icon'  => 'heart',
+					],
+			],
+			$categories
+	);
+}
+add_action( 'block_categories', 'client_add_block_categories', 10, 2 );
+
+
+// ##### Blocks 🡒 Déclaration des blocks acf custom
+
+function acf_custom_client_blocks_init()
+{
+	if (function_exists('acf_register_block_type')) {
+
+		// ##### Home 🡒 Hero Section
+		acf_register_block_type(array(
+			'name'              => 'home_section',
+			'title'             => __("Home — Section d'accueil"),
+			'description'       => __("Brique de vidéo pour la section d'acccueil"),
+			'render_template'   => 'template-parts/blocks/home/home_hero/home_hero.php',
+			'category'          => 'client_blocks',
+			'multiple' => false,
+			'mode' => 'auto',
+			'align' => 'full',
+			'icon'  => 'schedule',
+			'supports'			=> array(
+				'multiple' => false,
+				'align' => ['full'],
+				'jsx' => true
+			),
+			// 'enqueue_style' => get_template_directory_uri() . '/template-parts/blocks/testimonial/testimonial.css',
+			// 'enqueue_script' => get_template_directory_uri() . '/template-parts/blocks/testimonial/testimonial.js',
+			// 'enqueue_assets' => function(){
+			// 	wp_enqueue_script( 'latest_articles_js', get_stylesheet_directory_uri() . '/template-parts/blocks/home/latest_articles/latest_articles.js');
+			// },
+
+		));
+
+		// ##### Home 🡒 Latest Articles
+		acf_register_block_type(array(
+			'name'              => 'latest_articles',
+			'title'             => __("Home — Derniers Articles"),
+			'description'       => __("Brique pour afficher les derniers articles publiés sur le site"),
+			'render_template'   => 'template-parts/blocks/home/latest_articles/latest_articles.php',
+			'category'          => 'client_blocks',
+			'multiple' => false,
+			'mode' => 'auto',
+			'align' => 'wide',
+			'icon'  => 'schedule',
+			// 'enqueue_style' => get_template_directory_uri() . '/template-parts/blocks/testimonial/testimonial.css',
+			// 'enqueue_script' => get_template_directory_uri() . '/template-parts/blocks/testimonial/testimonial.js',
+			// 'enqueue_assets' => function(){
+			// 	wp_enqueue_script( 'latest_articles_js', get_stylesheet_directory_uri() . '/template-parts/blocks/home/latest_articles/latest_articles.js');
+			// },
+
+		));
+	
+	}
+}
+add_action('acf/init', 'acf_custom_client_blocks_init');
+
+
+// ##### Blocks style 🡒 Re-enqueue d'un style dans l'éditeur
+
+
+// function block_newsfeed_add_editor_styles() {
+//     add_editor_style( get_stylesheet_directory_uri() . '/template-parts/blocks/editor.css' );
+// }
+// add_action( 'admin_init', 'block_newsfeed_add_editor_styles' );
+
+
+
+?>
--- a/includes/errorlog.php
+++ b/includes/errorlog.php
@ -0,0 +1,19 @@
+<?php
+
+// #################################
+// FUNCTION ERROR LOG
+// #################################
+
+
+// Error log
+if (!function_exists('write_log')) {
+	function write_log($log) {
+		if (true === WP_DEBUG) {
+			if (is_array($log) || is_object($log)) {
+				error_log(print_r($log, true));
+			} else {
+				error_log($log);
+			}
+		}
+	}
+}
--- a/includes/logos.php
+++ b/includes/logos.php
@ -0,0 +1,20 @@
+<?php 
+
+// #############################
+// AJOUT D'UN ESPACE LOGO CUSTOM
+// #############################
+
+function add_logo_customizer_settings($wp_customize) {
+	$wp_customize->add_setting('logo_semlex_dark');
+
+	// Add a control to upload the hover logo
+	$wp_customize->add_control(new WP_Customize_Image_Control($wp_customize, 'logo_semlex_dark', array(
+			'label' => 'Logo Semlex Sombre',
+			'section' => 'title_tagline', //this is the section where the custom-logo from WordPress is
+			'settings' => 'logo_semlex_dark',
+			'priority' => 8 // show it just below the custom-logo
+	)));
+}
+
+add_action('customize_register', 'add_logo_customizer_settings');
+
--- a/includes/shortcuts/shortcuts.php
+++ b/includes/shortcuts/shortcuts.php
@ -0,0 +1,84 @@
+<?php 
+
+// ##### Template parts 🡒 Get templates parts 
+
+	get_template_part( 'template-parts/blocks/the-file', null,
+			array(
+				'ID'=>$my_post_id,
+			)
+	);
+
+/** ------------------------------
+			 QUERIES
+------------------------------*/
+
+// ##### Query 🡒 Get posts
+
+$args = array('fields' => 'ids');
+$posts = get_posts($args);
+
+
+// ##### Query 🡒 Recent posts 
+
+$posts = wp_get_recent_posts([
+	'numberposts' => 4 ,
+	'post_status' => 'publish'
+]);
+
+
+// ##### Query 🡒 With Metaqueries
+$args = array(
+	'post_type'=>'activities',
+	'post_status' => array( 'publish', 'future' ),
+	'numberposts' => '3',
+	'meta_key' => 'date',
+	'orderby'			=> 'meta_value',
+	'order'				=> 'ASC',
+	// ######## Main
+	'meta_query'	=> array(
+		 array(
+			 'key'		=> 'date',
+			 'value' => $today,
+			 'compare' => '>='
+			)
+		)
+);
+
+$recent_activites = wp_get_recent_posts($args);
+
+// ##### Query 🡒 Wordpress Global  Query Loop 
+
+$args = array('posts_per_page' => 6,'post_type'   => 'post');
+$the_query = new WP_Query( $args );
+
+
+if ( $the_query->have_posts() ) {
+	echo '<ul>';
+	while ( $the_query->have_posts() ) {
+		$the_query->the_post();
+		echo '<li>' . get_the_title() . '</li>';
+	}
+	echo '</ul>';
+} else {
+	// no posts found
+}
+/* Restore original Post Data */
+wp_reset_postdata();
+
+/** ------------------------------
+		POST DATES
+------------------------------*/
+$post_date = date_i18n('j F Y', strtotime($post['post_date']));
+
+
+/** ------------------------------
+		URL
+------------------------------*/
+
+// ##### URL 🡒 Home Url 
+ echo home_url('/admission/');
+
+// ##### URL 🡒 Site Url 
+ echo site_url('/admission/', 'https');
+
+
--- a/index.php
+++ b/index.php
@ -0,0 +1,20 @@
+<?php get_header(); ?>
+
+<div class="container mx-auto my-8">
+
+	<?php if ( have_posts() ) : ?>
+		<?php
+		while ( have_posts() ) :
+			the_post();
+			?>
+
+			<?php get_template_part( 'template-parts/content', get_post_format() ); ?>
+
+		<?php endwhile; ?>
+
+	<?php endif; ?>
+
+</div>
+
+<?php
+get_footer();
--- a/js/app.js
+++ b/js/app.js
@ -0,0 +1,10 @@
+(() => {
+  // resources/js/app.js
+  window.addEventListener("load", function() {
+    let main_navigation = document.querySelector("#primary-menu");
+    document.querySelector("#primary-menu-toggle").addEventListener("click", function(e) {
+      e.preventDefault();
+      main_navigation.classList.toggle("hidden");
+    });
+  });
+})();
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -0,0 +1,43 @@
+{
+	"name": "tailpress",
+	"version": "3.0.0",
+	"description": "Boilerplate WordPress theme with Tailwind CSS.",
+	"author": "Jeffrey van Rossum",
+	"repository": {
+		"type": "git",
+		"url": "https://github.com/jeffreyvr/tailpress"
+	},
+	"theme_uri": "https://github.com/jeffreyvr/tailpress",
+	"author_uri": "https://vanrossum.dev",
+	"text_domain": "tailpress",
+	"license": "MIT",
+	"scripts": {
+		"production:css-app": "cross-env NODE_ENV=development tailwindcss -i ./resources/css/app.css -o ./css/app.css --postcss --minify",
+		"production:css-editor": "cross-env NODE_ENV=development tailwindcss -i ./resources/css/editor-style.css -o ./css/editor-style.css --postcss --minify",
+		"production:js": "cross-env NODE_ENV=development ./node_modules/.bin/esbuild ./resources/js/app.js --bundle --outfile=./js/app.js --minify",
+		"dev:css-app": "cross-env NODE_ENV=development tailwindcss -i ./resources/css/app.css -o ./css/app.css --postcss",
+		"dev:css-editor": "cross-env NODE_ENV=development tailwindcss -i ./resources/css/editor-style.css -o ./css/editor-style.css --postcss",
+		"dev:js": "cross-env NODE_ENV=development ./node_modules/.bin/esbuild ./resources/js/app.js --bundle --outfile=./js/app.js",
+		"watch:css-app": "cross-env NODE_ENV=development tailwindcss -i ./resources/css/app.css -o ./css/app.css --postcss --watch",
+		"watch:css-editor": "cross-env NODE_ENV=development tailwindcss -i ./resources/css/editor-style.css -o ./css/editor-style.css --postcss --watch",
+		"watch:js": "cross-env NODE_ENV=development ./node_modules/.bin/esbuild ./resources/js/app.js --bundle --outfile=./js/app.js --watch",
+		"production": "cross-env NODE_ENV=production concurrently \"npm run production:css-app\" \"npm run production:css-editor\" \"npm run production:js\"",
+		"dev": "cross-env NODE_ENV=development concurrently \"npm run dev:css-app\" \"npm run dev:css-editor\" \"npm run dev:js\"",
+		"watch": "cross-env NODE_ENV=development concurrently \"npm run watch:css-app\" \"npm run watch:css-editor\" \"npm run watch:js\"",
+		"browser-sync": "cross-env NODE_ENV=development browser-sync start --proxy \"tailpress.test\" --host=\"tailpress.test\" --no-inject-changes --files=\"./\"",
+		"watch-sync": "cross-env NODE_ENV=development concurrently \"npm run browser-sync\" \"npm run watch\""
+	},
+	"devDependencies": {
+		"@jeffreyvr/tailwindcss-tailpress": "^2.0.0",
+		"autoprefixer": "^10.4.0",
+		"browser-sync": "^2.26.14",
+		"concurrently": "^6.2.1",
+		"cross-env": "^6.0.3",
+		"esbuild": "^0.12.24",
+		"postcss": "^8.4.4",
+		"postcss-import": "^14.0.0",
+		"postcss-nested-ancestors": "^2.0.0",
+		"resolve-url-loader": "^3.1.2",
+		"tailwindcss": "^3.1.0"
+	}
+}
--- a/postcss.config.js
+++ b/postcss.config.js
@ -0,0 +1,8 @@
+module.exports = {
+    plugins: [
+        require('postcss-nested-ancestors'),
+        require('postcss-import'),
+        require('tailwindcss/nesting'),
+        require('tailwindcss')
+    ]
+}
--- a/resources/css/app.css
+++ b/resources/css/app.css
@ -0,0 +1,5 @@
+@import "tailwindcss/base";
+@import "tailwindcss/components";
+@import "tailwindcss/utilities";
+
+@import "custom.css";
--- a/resources/css/custom.css
+++ b/resources/css/custom.css
@ -0,0 +1,45 @@
+article>*:not(.entry-content),
+.entry-content>* {
+    @apply mx-auto max-w-content;
+}
+
+.entry-content,
+.block-editor-block-list__layout {
+    h1 {
+        @apply text-2xl;
+    }
+
+    h2 {
+        @apply text-xl;
+    }
+
+    h3 {
+        @apply text-lg;
+    }
+
+    p,
+    ul,
+    ol {
+        a {
+            @apply text-blue-500 underline;
+
+            &:hover {
+                @apply no-underline;
+            }
+        }
+
+        @apply mb-8;
+    }
+
+    ul:not(.block-editor-block-variation-picker__variations) {
+        li {
+            @apply list-disc list-inside;
+        }
+    }
+
+    ol {
+        li {
+            @apply list-decimal list-inside;
+        }
+    }
+}
--- a/resources/css/editor-style.css
+++ b/resources/css/editor-style.css
@ -0,0 +1,18 @@
+@import "tailwindcss/components";
+@import "tailwindcss/utilities";
+
+body {
+    @apply font-sans;
+}
+
+.wp-block{
+    @apply max-w-screen-xl;
+}
+
+.wp-block[data-align=wide] {
+    @apply max-w-screen-xl;
+}
+
+.wp-block[data-align=full] {
+    @apply max-w-full;
+}
--- a/resources/js/app.js
+++ b/resources/js/app.js
@ -0,0 +1,8 @@
+// Navigation toggle
+window.addEventListener('load', function () {
+      let main_navigation = document.querySelector('#primary-menu');
+      document.querySelector('#primary-menu-toggle').addEventListener('click', function (e) {
+            e.preventDefault();
+            main_navigation.classList.toggle('hidden');
+      });
+});
--- a/safelist.txt
+++ b/safelist.txt
@ -0,0 +1,8 @@
+alignfull
+alignwide
+alignnone
+aligncenter
+alignright
+wp-block-button
+wp-caption
+wp-caption-text
--- a/screenshot.png
+++ b/screenshot.png
--- a/single.php
+++ b/single.php
@ -0,0 +1,28 @@
+<?php get_header(); ?>
+
+	<div class="container my-8 mx-auto">
+
+	<?php if ( have_posts() ) : ?>
+
+		<?php
+		while ( have_posts() ) :
+			the_post();
+			?>
+
+			<?php get_template_part( 'template-parts/content', 'single' ); ?>
+
+			<?php
+			// If comments are open or we have at least one comment, load up the comment template.
+			if ( comments_open() || get_comments_number() ) :
+				comments_template();
+			endif;
+			?>
+
+		<?php endwhile; ?>
+
+	<?php endif; ?>
+
+	</div>
+
+<?php
+get_footer();
--- a/style.css
+++ b/style.css
@ -0,0 +1,7 @@
+/*
+Theme Name: Deligraph
+Author: Deligraph
+Author URI: https://deligraph.com/
+Version: 1.0.0
+
+*/
--- a/tailwind.config.js
+++ b/tailwind.config.js
@ -0,0 +1,36 @@
+const theme = require('./theme.json');
+const tailpress = require("@jeffreyvr/tailwindcss-tailpress");
+
+module.exports = {
+    content: [
+        './*.php',
+        './**/*.php',
+        './resources/css/*.css',
+        './resources/js/*.js',
+        './safelist.txt'
+    ],
+    theme: {
+        container: {
+            padding: {
+                DEFAULT: '1rem',
+                sm: '2rem',
+                lg: '0rem'
+            },
+        },
+        extend: {
+            colors: tailpress.colorMapper(tailpress.theme('settings.color.palette', theme)),
+            fontSize: tailpress.fontSizeMapper(tailpress.theme('settings.typography.fontSizes', theme))
+        },
+        screens: {
+            'xs': '480px',
+            'sm': '600px',
+            'md': '782px',
+            'lg': tailpress.theme('settings.layout.contentSize', theme),
+            'xl': tailpress.theme('settings.layout.wideSize', theme),
+            '2xl': '1440px'
+        }
+    },
+    plugins: [
+        tailpress.tailwind
+    ]
+};
--- a/template-parts/blocks/home/home_hero/home_hero.css
+++ b/template-parts/blocks/home/home_hero/home_hero.css
@ -0,0 +1,42 @@
+.video_hero{
+		@apply bg-primary;
+		height: 100vh;
+		min-height: 650px;
+		position: relative;
+		 
+		video{
+			width: 100%;
+			height: 100%;
+			object-fit: cover;
+			position: absolute;
+		}
+		.hero_content{
+			opacity: 0.9999;
+			display: flex;
+			flex-direction: column;
+			align-items: center;
+			justify-content: center;
+			height: 100%;
+			
+			h1 {
+				font-family: "Causten";
+				font-weight: 700;
+				font-size: 50px;
+				line-height: 50px;
+				max-width: 700px;
+				text-transform: uppercase;
+				
+			}
+			p{
+				@apply max-w-md;
+				padding: 40px 0;
+				text-align:center;
+			}
+			a{
+				border: 1px solid white;
+				padding: 10px 40px;
+				border-radius: 28px;
+			}
+		}
+	
+}
--- a/template-parts/blocks/home/home_hero/home_hero.php
+++ b/template-parts/blocks/home/home_hero/home_hero.php
@ -0,0 +1,18 @@
+<?php 
+$home_video_hero = get_field('home_video_hero');
+
+?>
+
+<section class="video_hero header_top">
+			<video class="test" autoplay muted loop playsinline ?>">
+					<source src="<?php echo get_template_directory_uri() . '/resources/video/Semlex_Homecover_hero.mp4' ?>" type="video/mp4">
+				Your browser does not support the video tag.
+			</video>
+			<div class="hero_content">
+
+				<h1 class="text-center text-white"><?php echo $home_video_hero['main_title'] ?></h1>
+				<p class="text-center text-white" ><?php echo $home_video_hero['text'] ?></p>
+				<a class="text-center mx-auto w-fit text-white"  href=""><?php echo $home_video_hero['button']['title'] ?></a>
+			</div>
+</section>
+
--- a/template-parts/blocks/home/latest_articles/latest_articles.js
+++ b/template-parts/blocks/home/latest_articles/latest_articles.js
--- a/template-parts/blocks/home/latest_articles/latest_articles.php
+++ b/template-parts/blocks/home/latest_articles/latest_articles.php
@ -0,0 +1,35 @@
+<?php 
+//  $latest_posts_details = get_field('latest_posts_details');
+?>
+
+<section class="section_latest_news">
+		<h2 class="section_title">Lastest Articles</h2>
+
+		<div class="articles_container">
+				<?php
+
+				$recent_posts = wp_get_recent_posts(array(
+						'numberposts' => 4, // Number of recent posts thumbnails to display
+						'post_status' => 'publish' // Show only the published posts
+				));
+
+
+				foreach ($recent_posts as $key => $post) {
+							$post_date = date_i18n('j F Y', strtotime($post['post_date']));
+						?>
+							<div class="article_card">
+								<?php echo get_the_post_thumbnail( $post['ID'], 'full',array('class' => 'article_thumbnail') ); ?>
+								<div class="card_inner">
+									<h4 class="post_date"> <?php echo $post_date ?> </h4>
+									<h3 class="post_title"><?php echo $post['post_title'] ?></h3>
+									<p><?php echo $post['post_excerpt'] ?></p>
+								</div>
+									
+							</div>
+						<?php
+				}
+
+				?>
+		</div>
+
+</section>
--- a/template-parts/content-single.php
+++ b/template-parts/content-single.php
@ -0,0 +1,25 @@
+<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
+
+	<header class="entry-header mb-4">
+		<?php the_title( sprintf( '<h1 class="entry-title text-2xl lg:text-5xl font-extrabold leading-tight mb-1"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h1>' ); ?>
+		<time datetime="<?php echo get_the_date( 'c' ); ?>" itemprop="datePublished" class="text-sm text-gray-700"><?php echo get_the_date(); ?></time>
+	</header>
+
+	<div class="entry-content">
+		<?php the_content(); ?>
+
+		<?php
+			wp_link_pages(
+				array(
+					'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'tailpress' ) . '</span>',
+					'after'       => '</div>',
+					'link_before' => '<span>',
+					'link_after'  => '</span>',
+					'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'tailpress' ) . ' </span>%',
+					'separator'   => '<span class="screen-reader-text">, </span>',
+				)
+			);
+		?>
+	</div>
+
+</article>
--- a/template-parts/content.php
+++ b/template-parts/content.php
@ -0,0 +1,41 @@
+<article id="post-<?php the_ID(); ?>" <?php post_class( 'mb-12' ); ?>>
+
+	<header class="entry-header mb-4">
+		<?php the_title( sprintf( '<h2 class="entry-title text-2xl md:text-3xl font-extrabold leading-tight mb-1"><a href="%s" rel="bookmark">', esc_url( get_permalink() ) ), '</a></h2>' ); ?>
+		<time datetime="<?php echo get_the_date( 'c' ); ?>" itemprop="datePublished" class="text-sm text-gray-700"><?php echo get_the_date(); ?></time>
+	</header>
+
+	<?php if ( is_search() || is_archive() ) : ?>
+
+		<div class="entry-summary">
+			<?php the_excerpt(); ?>
+		</div>
+
+	<?php else : ?>
+
+		<div class="entry-content">
+			<?php
+			/* translators: %s: Name of current post */
+			the_content(
+				sprintf(
+					__( 'Continue reading %s', 'tailpress' ),
+					the_title( '<span class="screen-reader-text">"', '"</span>', false )
+				)
+			);
+
+			wp_link_pages(
+				array(
+					'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'tailpress' ) . '</span>',
+					'after'       => '</div>',
+					'link_before' => '<span>',
+					'link_after'  => '</span>',
+					'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'tailpress' ) . ' </span>%',
+					'separator'   => '<span class="screen-reader-text">, </span>',
+				)
+			);
+			?>
+		</div>
+
+	<?php endif; ?>
+
+</article>
--- a/theme.json
+++ b/theme.json
@ -0,0 +1,67 @@
+{
+  "version": 1,
+  "settings": {
+    "layout": {
+      "contentSize": "960px",
+      "wideSize": "1280px"
+    },
+    "color": {
+      "palette": [
+        {
+          "name": "Primary",
+          "slug": "primary",
+          "color": "#0EA5E9"
+        },
+        {
+          "name": "Secondary",
+          "slug": "secondary",
+          "color": "#14B8A6"
+        },
+        {
+          "name": "Dark",
+          "slug": "dark",
+          "color": "#1F2937"
+        },
+        {
+          "name": "Light",
+          "slug": "light",
+          "color": "#F9FAFB"
+        }
+      ]
+    },
+    "typography": {
+      "fontSizes": [
+        {
+          "name": "Small",
+          "slug": "small",
+          "size": "0.875rem"
+        },
+        {
+          "slug": "regular",
+          "name": "Regular",
+          "size": "1.5rem"
+        },
+        {
+          "slug": "large",
+          "name": "Large",
+          "size": "1.125rem"
+        },
+        {
+          "slug": "xl",
+          "name": "XL",
+          "size": "1.25rem"
+        },
+        {
+          "slug": "xxl",
+          "name": "2XL",
+          "size": "1.5rem"
+        },
+        {
+          "slug": "xxxl",
+          "name": "3XL",
+          "size": "1.875rem"
+        }
+      ]
+    }
+  }
+}