first version

theme/functions.php

@@ -7,7 +7,7 @@
  * @package Valier
  */
 
-if ( ! defined( 'VLR_VERSION' ) ) {
+if (!defined('VLR_VERSION')) {
 	/*
 	 * Set the theme’s version number.
 	 *
@@ -15,10 +15,10 @@ if ( ! defined( 'VLR_VERSION' ) ) {
 	 * to create your production build, the value below will be replaced in the
 	 * generated zip file with a timestamp, converted to base 36.
 	 */
-	define( 'VLR_VERSION', '0.1.0' );
+	define('VLR_VERSION', '0.1.0');
 }
 
-if ( ! defined( 'VLR_TYPOGRAPHY_CLASSES' ) ) {
+if (!defined('VLR_TYPOGRAPHY_CLASSES')) {
 	/*
 	 * Set Tailwind Typography classes for the front end, block editor and
 	 * classic editor using the constant below.
@@ -42,7 +42,7 @@ if ( ! defined( 'VLR_TYPOGRAPHY_CLASSES' ) ) {
 	);
 }
 
-if ( ! function_exists( 'vlr_setup' ) ) :
+if (!function_exists('vlr_setup')) :
 	/**
 	 * Sets up theme defaults and registers support for various WordPress features.
 	 *
@@ -50,17 +50,18 @@ if ( ! function_exists( 'vlr_setup' ) ) :
 	 * runs before the init hook. The init hook is too late for some features, such
 	 * as indicating support for post thumbnails.
 	 */
-	function vlr_setup() {
+	function vlr_setup()
+	{
 		/*
 		 * Make theme available for translation.
 		 * Translations can be filed in the /languages/ directory.
 		 * If you're building a theme based on Valier, use a find and replace
 		 * to change 'valier' to the name of your theme in all the template files.
 		 */
-		load_theme_textdomain( 'valier', get_template_directory() . '/languages' );
+		load_theme_textdomain('valier', get_template_directory() . '/languages');
 
 		// Add default posts and comments RSS feed links to head.
-		add_theme_support( 'automatic-feed-links' );
+		add_theme_support('automatic-feed-links');
 
 		/*
 		 * Let WordPress manage the document title.
@@ -68,20 +69,20 @@ if ( ! function_exists( 'vlr_setup' ) ) :
 		 * hard-coded <title> tag in the document head, and expect WordPress to
 		 * provide it for us.
 		 */
-		add_theme_support( 'title-tag' );
+		add_theme_support('title-tag');
 
 		/*
 		 * Enable support for Post Thumbnails on posts and pages.
 		 *
 		 * @link https://developer.wordpress.org/themes/functionality/featured-images-post-thumbnails/
 		 */
-		add_theme_support( 'post-thumbnails' );
+		add_theme_support('post-thumbnails');
 
 		// This theme uses wp_nav_menu() in two locations.
 		register_nav_menus(
 			array(
-				'menu-1' => __( 'Primary', 'valier' ),
-				'menu-2' => __( 'Footer Menu', 'valier' ),
+				'menu-primary' => __('Principal', 'valier'),
+				'menu-legal' => __('Legal', 'valier')
 			)
 		);
 
@@ -103,62 +104,73 @@ if ( ! function_exists( 'vlr_setup' ) ) :
 		);
 
 		// Add theme support for selective refresh for widgets.
-		add_theme_support( 'customize-selective-refresh-widgets' );
+		add_theme_support('customize-selective-refresh-widgets');
 
 		// Add support for editor styles.
-		add_theme_support( 'editor-styles' );
+		add_theme_support('editor-styles');
 
 		// Enqueue editor styles.
-		add_editor_style( 'style-editor.css' );
-		add_editor_style( 'style-editor-extra.css' );
+		add_editor_style('style-editor.css');
+		add_editor_style('style-editor-extra.css');
 
 		// Add support for responsive embedded content.
-		add_theme_support( 'responsive-embeds' );
+		add_theme_support('responsive-embeds');
 
+		// Add support for custom logo
+		add_theme_support('custom-logo');
+		add_theme_support('custom-header');
 		// Remove support for block templates.
-		remove_theme_support( 'block-templates' );
+		remove_theme_support('block-templates');
+
+		//hidden ACF
+		add_filter('acf/settings/show_admin', '__return_false');
 	}
 endif;
-add_action( 'after_setup_theme', 'vlr_setup' );
+add_action('after_setup_theme', 'vlr_setup');
 
 /**
  * Register widget area.
  *
  * @link https://developer.wordpress.org/themes/functionality/sidebars/#registering-a-sidebar
  */
-function vlr_widgets_init() {
+function vlr_widgets_init()
+{
 	register_sidebar(
 		array(
-			'name'          => __( 'Footer', 'valier' ),
-			'id'            => 'sidebar-1',
-			'description'   => __( 'Add widgets here to appear in your footer.', 'valier' ),
+			'name' => __('Pie', 'valier'),
+			'id' => 'footer-sidebar',
+			'description' => __('Añade los widgets para mostrarse en el pie', 'valier'),
 			'before_widget' => '<section id="%1$s" class="widget %2$s">',
-			'after_widget'  => '</section>',
-			'before_title'  => '<h2 class="widget-title">',
-			'after_title'   => '</h2>',
+			'after_widget' => '</section>',
+			'before_title' => '<h2 class="widget-title">',
+			'after_title' => '</h2>',
 		)
 	);
 }
-add_action( 'widgets_init', 'vlr_widgets_init' );
+
+add_action('widgets_init', 'vlr_widgets_init');
 
 /**
  * Enqueue scripts and styles.
  */
-function vlr_scripts() {
-	wp_enqueue_style( 'valier-style', get_stylesheet_uri(), array(), VLR_VERSION );
-	wp_enqueue_script( 'valier-script', get_template_directory_uri() . '/js/script.min.js', array(), VLR_VERSION, true );
+function vlr_scripts()
+{
+	wp_enqueue_style('valier-style', get_stylesheet_uri(), array(), VLR_VERSION);
+	wp_enqueue_script('valier-script', get_template_directory_uri() . '/js/script.min.js', array(), VLR_VERSION, true);
 
-	if ( is_singular() && comments_open() && get_option( 'thread_comments' ) ) {
-		wp_enqueue_script( 'comment-reply' );
+	if (is_singular() && comments_open() && get_option('thread_comments')) {
+		wp_enqueue_script('comment-reply');
 	}
 }
-add_action( 'wp_enqueue_scripts', 'vlr_scripts' );
+
+add_action('wp_enqueue_scripts', 'vlr_scripts');
 
 /**
  * Enqueue the block editor script.
  */
-function vlr_enqueue_block_editor_script() {
-	if ( is_admin() ) {
+function vlr_enqueue_block_editor_script()
+{
+	if (is_admin()) {
 		wp_enqueue_script(
 			'valier-editor',
 			get_template_directory_uri() . '/js/block-editor.min.js',
@@ -169,10 +181,11 @@ function vlr_enqueue_block_editor_script() {
 			VLR_VERSION,
 			true
 		);
-		wp_add_inline_script( 'valier-editor', "tailwindTypographyClasses = '" . esc_attr( VLR_TYPOGRAPHY_CLASSES ) . "'.split(' ');", 'before' );
+		wp_add_inline_script('valier-editor', "tailwindTypographyClasses = '" . esc_attr(VLR_TYPOGRAPHY_CLASSES) . "'.split(' ');", 'before');
 	}
 }
-add_action( 'enqueue_block_assets', 'vlr_enqueue_block_editor_script' );
+
+add_action('enqueue_block_assets', 'vlr_enqueue_block_editor_script');
 
 /**
  * Add the Tailwind Typography classes to TinyMCE.
@@ -180,11 +193,13 @@ add_action( 'enqueue_block_assets', 'vlr_enqueue_block_editor_script' );
  * @param array $settings TinyMCE settings.
  * @return array
  */
-function vlr_tinymce_add_class( $settings ) {
+function vlr_tinymce_add_class($settings)
+{
 	$settings['body_class'] = VLR_TYPOGRAPHY_CLASSES;
 	return $settings;
 }
-add_filter( 'tiny_mce_before_init', 'vlr_tinymce_add_class' );
+
+add_filter('tiny_mce_before_init', 'vlr_tinymce_add_class');
 
 /**
  * Custom template tags for this theme.

theme/template-parts/content/content-page.php

@@ -11,50 +11,17 @@
 
 <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
 
-	<header class="entry-header">
-		<?php
-		if ( ! is_front_page() ) {
-			the_title( '<h1 class="entry-title">', '</h1>' );
-		} else {
-			the_title( '<h2 class="entry-title">', '</h2>' );
-		}
-		?>
-	</header><!-- .entry-header -->
-
-	<?php vlr_post_thumbnail(); ?>
-
-	<div <?php vlr_content_class( 'entry-content' ); ?>>
+	<div <?php vlr_content_class('entry-content'); ?>>
 		<?php
 		the_content();
 
 		wp_link_pages(
 			array(
-				'before' => '<div>' . __( 'Pages:', 'valier' ),
-				'after'  => '</div>',
+				'before' => '<div>' . __('Pages:', 'valier'),
+				'after' => '</div>',
 			)
 		);
 		?>
 	</div><!-- .entry-content -->
 
-	<?php if ( get_edit_post_link() ) : ?>
-		<footer class="entry-footer">
-			<?php
-			edit_post_link(
-				sprintf(
-					wp_kses(
-						/* translators: %s: Name of current post. Only visible to screen readers. */
-						__( 'Edit <span class="sr-only">%s</span>', 'valier' ),
-						array(
-							'span' => array(
-								'class' => array(),
-							),
-						)
-					),
-					get_the_title()
-				)
-			);
-			?>
-		</footer><!-- .entry-footer -->
-	<?php endif; ?>
-
 </article><!-- #post-<?php the_ID(); ?> -->

theme/template-parts/layout/footer-content.php

@@ -9,44 +9,33 @@
 
 ?>
 
-<footer id="colophon">
-
-	<?php if ( is_active_sidebar( 'sidebar-1' ) ) : ?>
-		<aside role="complementary" aria-label="<?php esc_attr_e( 'Footer', 'valier' ); ?>">
-			<?php dynamic_sidebar( 'sidebar-1' ); ?>
+<footer style="background: url(<?= get_field('footer_image', 'option') ?>)">
+	<?php if (is_active_sidebar('footer-sidebar')) : ?>
+		<aside role="complementary" aria-label="<?php esc_attr_e('Footer', 'valier'); ?>" class="container mx-auto ">
+			<?php dynamic_sidebar('footer-sidebar'); ?>
 		</aside>
 	<?php endif; ?>
+	<div class="container mx-auto">
+		<a href="<?= get_field('linkedin_link', 'option') ?>" target="_blank"
+		   class="flex justify-center gap-3 items-end mb-2">
+			<img src="<?= get_field('abrevitura_de_linkedin', 'option') ?>" alt="Linkedin">
+			<img src="<?= get_field('logo_linkedin', 'option') ?>" alt="Linkedin">
 
-	<?php if ( has_nav_menu( 'menu-2' ) ) : ?>
-		<nav aria-label="<?php esc_attr_e( 'Footer Menu', 'valier' ); ?>">
+		</a>
+	</div>
+	<div class="bg-primary text-black py-2 has-playfair-font-family">
+		<div class="container mx-auto has-mini-font-size flex justify-center gap-3 italic">
+			<?= get_field('texto_legal', 'option') ?>
 			<?php
 			wp_nav_menu(
 				array(
-					'theme_location' => 'menu-2',
-					'menu_class'     => 'footer-menu',
-					'depth'          => 1,
+					'theme_location' => 'menu-legal',
+					'container' => false,
+					'menu_id' => 'menu-legal',
+					'items_wrap' => '<ul id="%1$s" class="%2$s flex justify-center gap-3" aria-label="submenu">%3$s</ul>',
 				)
 			);
 			?>
-		</nav>
-	<?php endif; ?>
-
-	<div>
-		<?php
-		$vlr_blog_info = get_bloginfo( 'name' );
-		if ( ! empty( $vlr_blog_info ) ) :
-			?>
-			<a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a>,
-			<?php
-		endif;
-
-		/* translators: 1: WordPress link, 2: WordPress. */
-		printf(
-			'<a href="%1$s">proudly powered by %2$s</a>.',
-			esc_url( __( 'https://wordpress.org/', 'valier' ) ),
-			'WordPress'
-		);
-		?>
+		</div>
 	</div>
-
-</footer><!-- #colophon -->
+</footer>

theme/template-parts/layout/header-content.php

@@ -7,41 +7,9 @@
  * @package Valier
  */
 
-?>
+if (is_front_page()) {
+	get_template_part('template-parts/layout/header', 'home');
+} else {
+	get_template_part('template-parts/layout/header', 'page');
+}
 
-<header id="masthead">
-
-	<div>
-		<?php
-		if ( is_front_page() ) :
-			?>
-			<h1><?php bloginfo( 'name' ); ?></h1>
-			<?php
-		else :
-			?>
-			<p><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></p>
-			<?php
-		endif;
-
-		$vlr_description = get_bloginfo( 'description', 'display' );
-		if ( $vlr_description || is_customize_preview() ) :
-			?>
-			<p><?php echo $vlr_description; // phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped ?></p>
-		<?php endif; ?>
-	</div>
-
-	<nav id="site-navigation" aria-label="<?php esc_attr_e( 'Main Navigation', 'valier' ); ?>">
-		<button aria-controls="primary-menu" aria-expanded="false"><?php esc_html_e( 'Primary Menu', 'valier' ); ?></button>
-
-		<?php
-		wp_nav_menu(
-			array(
-				'theme_location' => 'menu-1',
-				'menu_id'        => 'primary-menu',
-				'items_wrap'     => '<ul id="%1$s" class="%2$s" aria-label="submenu">%3$s</ul>',
-			)
-		);
-		?>
-	</nav><!-- #site-navigation -->
-
-</header><!-- #masthead -->

theme/template-parts/layout/header-home.php

@@ -0,0 +1,29 @@
+<header id="masthead" style="background-image: url(<?= get_header_image() ?>)" class="home">
+	<div class="video-container">
+		<video autoplay muted loop src="<?= get_field('video_header', 'option') ?>"></video>
+	</div>
+
+	<div class="header-cointainer">
+		<div class="container mx-auto flex justify-between self-start justify-self-start ">
+			<img src="<?= get_field('logo_home', 'option') ?>" alt="<?= get_bloginfo('name') ?>">
+			<nav id="site-navigation" aria-label="<?php esc_attr_e('Main Navigation', 'valier'); ?>"
+				 class="has-small-font-size uppercase has-cinzel-font-family flex items-center gap-6">
+				<?php
+				wp_nav_menu(
+					array(
+						'theme_location' => 'menu-primary',
+						'container' => false,
+						'menu_id' => 'menu-primary',
+						'items_wrap' => '<ul id="%1$s" class="%2$s flex justify-center gap-6 text-white " aria-label="submenu">%3$s</ul>',
+					)
+				);
+				?>
+				<a href="<?= get_field('linkedin_link', 'option') ?>" target="_blank">
+					<img src="<?= get_field('abrevitura_de_linkedin', 'option') ?>" alt="Linkedin" class="linkedin">
+				</a>
+			</nav>
+
+		</div>
+		<h1 class="self-start justify-self-center has-extreme-font-size has-white-color has-cinzel-font-family uppercase "><?= get_the_title() ?></h1>
+	</div>
+</header>

theme/template-parts/layout/header-page.php

@@ -0,0 +1,25 @@
+<header id="masthead">
+	<div class="bg-white py-6">
+		<div class="container mx-auto flex justify-between self-start justify-self-start ">
+			<?= get_custom_logo() ?>
+			<nav id="site-navigation" aria-label="<?php esc_attr_e('Main Navigation', 'valier'); ?>"
+				 class="has-small-font-size uppercase has-cinzel-font-family flex items-center gap-6 ">
+				<?php
+				wp_nav_menu(
+					array(
+						'theme_location' => 'menu-primary',
+						'container' => false,
+						'menu_id' => 'menu-primary',
+						'items_wrap' => '<ul id="%1$s" class="%2$s flex justify-center gap-6 " aria-label="submenu">%3$s</ul>',
+					)
+				);
+				?>
+				<a href="<?= get_field('linkedin_link', 'option') ?>" target="_blank">
+					<img src="<?= get_field('abrevitura_de_linkedin', 'option') ?>" alt="Linkedin" class="linkedin">
+				</a>
+			</nav>
+		</div>
+	</div>
+	<h1 class="self-start justify-self-center has-extreme-font-size has-white-color has-cinzel-font-family uppercase text-center py-10"
+		style="background-image: url(<?= get_the_post_thumbnail_url() ?>)"><?= get_the_title() ?></h1>
+</header>

theme/theme.json

@@ -1,39 +1,128 @@
 {
-	"$schema": "https://schemas.wp.org/trunk/theme.json",
+	"$schema": "https:\/\/schemas.wp.org\/trunk\/theme.json",
 	"version": 2,
 	"settings": {
+		"appearanceTools": true,
 		"color": {
 			"palette": [
 				{
 					"slug": "background",
-					"color": "#ffffff",
+					"color": "#ecedf0",
 					"name": "Background"
 				},
-				{
-					"slug": "foreground",
-					"color": "#404040",
-					"name": "Foreground"
-				},
 				{
 					"slug": "primary",
-					"color": "#b91c1c",
+					"color": "#b37b20",
 					"name": "Primary"
 				},
 				{
 					"slug": "secondary",
-					"color": "#15803d",
+					"color": "#002e4f",
 					"name": "Secondary"
 				},
 				{
 					"slug": "tertiary",
-					"color": "#0369a1",
+					"color": "#706f6f",
 					"name": "Tertiary"
 				}
 			]
 		},
+		"typography": {
+			"fontFamilies": [
+				{
+					"name": "Cinzel",
+					"slug": "cinzel",
+					"fontFamily": "\"Cinzel\", serif",
+					"fontFace": [
+						{
+							"fontFamily": "cinzel",
+							"fontWeight": "400 900",
+							"fontStyle": "normal",
+							"fontStretch": "normal",
+							"src": [
+								"file:./assets/fonts/Cinzel-VariableFont_wght.ttf"
+							]
+						}
+					]
+				},
+				{
+					"name": "Playfair",
+					"slug": "playfair",
+					"fontFamily": "\"Playfair Display\", serif",
+					"fontFace": [
+						{
+							"fontFamily": "playfair",
+							"fontWeight": "400 900",
+							"fontStyle": "normal",
+							"fontStretch": "normal",
+							"src": [
+								"file:./assets/fonts/PlayfairDisplay-VariableFont_wght.ttf"
+							]
+						}
+					]
+				}
+			],
+			"fontSizes": [
+				{
+					"slug": "mini",
+					"size": "0.77rem",
+					"name": "Pequeño"
+				},
+				{
+					"slug": "small",
+					"size": "0.88rem",
+					"name": "Pequeño"
+				},
+				{
+					"slug": "regular",
+					"size": "1rem",
+					"name": "Normal"
+				},
+				{
+					"slug": "big",
+					"size": "1.66rem",
+					"name": "Grande"
+				},
+				{
+					"slug": "extreme",
+					"size": "2.55rem",
+					"name": "Enorme"
+				}
+			]
+		},
+		"spacing": [
+			{
+				"units": [
+					"px",
+					"em",
+					"rem",
+					"vh",
+					"vw"
+				]
+			}
+		],
 		"layout": {
-			"contentSize": "40rem",
-			"wideSize": "60rem"
+			"contentSize": "840px",
+			"wideSize": "1100px"
+		},
+		"shadow": {
+			"presets": [
+				{
+					"name": "Small",
+					"slug": "sm",
+					"shadow": "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06)"
+				},
+				{
+					"name": "Medium",
+					"slug": "md",
+					"shadow": "0 4px  10px 0 rgba( 0, 0, 0, 0.3 )"
+				},
+				{
+					"name": "Large",
+					"slug": "lg",
+					"shadow": "0 8px  15px 0 rgba( 0, 0, 0, 0.3 )"
+				}
+			]
 		}
 	}
 }