public function with() {
+ // Fetch languages from Polylang
+ $languages = [];
+
+ if (function_exists('pll_the_languages')) {
+ $languages = pll_the_languages(['raw' => true]);
+ }
+
+
// To allow for better management of the URLs and titles when translating,
// header buttons are stored in a separate menu location. Due to the design,
// there should only be a maximum of 2 links so these are extracted here.
$button_1 = $cta_nav[0] ?? false;
$button_2 = $cta_nav[1] ?? false;
- return compact('button_1', 'button_2');
+ return compact('languages', 'button_1', 'button_2');
}
}
add_action('customize_preview_init', function () {
wp_enqueue_script('sage/customizer.js', asset('scripts/customizer.js'), ['customize-preview'], null, true);
});
+
+
+/**
+ * Polylang - copy content and title when creating translations of posts / pages
+ * Ref: https://junaidbhura.com/make-polylang-wordpress-plugin-copy-the-content-from-the-original-post/
+ */
+add_filter('default_content', function($content) {
+ // Polylang sets the 'from_post' parameter
+ if ( isset( $_GET['from_post'] ) ) {
+ $my_post = get_post( $_GET['from_post'] );
+ if ( $my_post )
+ return $my_post->post_content;
+ }
+
+ return $content;
+});
+
+add_filter('default_title', function($title) {
+ if ( isset( $_GET['from_post'] ) ) {
+ $my_post = get_post( $_GET['from_post'] );
+ if ( $my_post )
+ return $my_post->post_title;
+ }
+
+ return $title;
+});
"laravel-mix-purgecss": "^4.1.0",
"lost": "^8.3.1",
"mix-tailwindcss": "^1.0.2",
+ "mmenu-light": "^2.3.1",
"npm-run-all": "^4.1",
"purgecss-with-wordpress": "knowler/purgecss-with-wordpress#more-wp-generated-classes",
"rimraf": "^2.6",
--- /dev/null
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="30" height="20" viewBox="0 0 30 20" xml:space="preserve">
+ <path d="M20 20H.7c-.4 0-.7-.3-.7-.8 0-.4.3-.8.7-.8H20c.4 0 .7.3.7.8.1.5-.3.8-.7.8zM29.3 10.8H.7c-.4 0-.7-.4-.7-.8s.3-.8.7-.8h28.5c.4 0 .7.3.7.8s-.2.8-.6.8zM29.3 1.5H.7c-.4 0-.7-.3-.7-.7S.3 0 .7 0h28.5c.5 0 .8.3.8.8s-.3.7-.7.7z"/>
+</svg>
* External Dependencies
*/
import { router } from 'js-dom-router';
+import './menu';
/**
* DOM-based routing
--- /dev/null
+//=== MMenu Setup
+import MmenuLight from 'mmenu-light/bin/js/mmlight';
+import offcanvas from 'mmenu-light/bin/js/mmlight.offcanvas';
+
+MmenuLight.prototype.offcanvas = offcanvas;
+
+const menuID = 'mobile-menu';
+
+document.addEventListener(
+ 'DOMContentLoaded', () => {
+
+ buildMobileMenu();
+
+ let nav = document.getElementById(menuID);
+ window.mmenu = new MmenuLight(nav, { title: '' });
+ window.menu_breakpoint = 1349; // Note: this should match the menu CSS breakpoint in setup.styl!
+
+ mmenu.enable(`(max-width: ${menu_breakpoint}px)`);
+ mmenu.offcanvas({
+ position: 'right' // Todo: switch for Arabic, based on class or text direction?
+ });
+
+ document.querySelector(`a[href="#menu"]`)
+ .addEventListener('click', (event) => {
+ mmenu.open();
+ event.preventDefault();
+ event.stopPropagation();
+
+ if (null === document.querySelector('.mm--close')) {
+
+ nav.innerHTML = '<a class="mm--close"></a>' + nav.innerHTML;
+
+ document.querySelector('.mm--close').addEventListener('click', (event) => {
+ mmenu.close();
+ });
+
+ }
+ });
+});
+
+function buildMobileMenu() {
+ const menu = document.createElement('div');
+ const menuItems = document.querySelector('.main-menu');
+
+ // Todo: copy other items into mobile menu (secondary nav buttons, language switcher etc)
+ menu.appendChild(menuItems.cloneNode(true));
+
+ menu.setAttribute('id', menuID);
+ document.body.appendChild(menu);
+}
@import 'common/spacing'
@import 'common/animations'
+// MMenu base styles from NPM package
+@import '~mmenu-light/dist/mmenu-light.css'
+
// Extracted components or custom styles that can't be done with utilities
@import 'components/*'
@import 'widgets/*'
header.site
.header-slideshow-present &
- +above($breakpoint-menu)
+ //+above($breakpoint-menu)
+ +above(1000px)
position: absolute
top: 0
left: 0
width: 100%
background-color: transparent
z-index: 20
+
+.mobile-menu-trigger
+ +above($breakpoint-menu)
+ display: none
-<article @php(post_class())>
- <header>
- <h1 class="entry-title">
- {!! $title !!}
- </h1>
-
- @include('partials/entry-meta')
+<article @php(post_class('container px-2v pb-2v flex items-start'))>
+ <header class="post-featured-image" style="background-image: url({{ get_the_post_thumbnail_url() }})">
+ <div class="post-featured-image-sizer">{{-- Just here as a proportional sizer thanks to the padding --}}</div>
</header>
<div class="entry-content">
+ @include('partials/entry-meta')
+
+ <h1 class="plain my-4">
+ {!! $title !!}
+ </h1>
+
@php(the_content())
</div>
+ {{--
<footer>
{!! wp_link_pages(['echo' => 0, 'before' => '<nav class="page-nav"><p>' . __('Pages:', 'sage'), 'after' => '</p></nav>']) !!}
</footer>
+ --}}
- @php(comments_template())
+ {{--@php(comments_template())--}}
</article>
@if (has_nav_menu('primary_navigation'))
<nav class="nav-primary self-end">
- {!! wp_nav_menu(['theme_location' => 'primary_navigation', 'menu_class' => 'menu-list', 'echo' => false]) !!}
+ {!! wp_nav_menu(['theme_location' => 'primary_navigation', 'menu_class' => 'main-menu menu-list', 'echo' => false]) !!}
</nav>
+
+ <a href="#menu" class="mobile-menu-trigger mr-1v hover:text-pink">@svg('menu', 'fill-current')</a>
@endif
<div class="nav-secondary absolute top-0 right-0 flex items-center">
- {{-- TODO: Add real language switcher here --}}
<ul class="flex mr-2">
- <li><a href="#" class="mr-4 border-b-2 border-pink">FR</a></li>
- <li><a href="#" class="mr-4">EN</a></li>
- <li><a href="#" class="mr-4">AR</a></li>
- <li><a href="#" class="mr-4">RU</a></li>
+ @foreach ($languages as $lang)
+ <li class="mr-4">
+ <a href="{{ $lang['url'] }}" @if($lang['current_lang']) class="border-b-2 border-pink"@endif>
+ {{ $lang['slug'] }}
+ </a>
+ </li>
+ @endforeach
</ul>
@if ($button_1)
dependencies:
minimist "0.0.8"
+mmenu-light@^2.3.1:
+ version "2.3.1"
+ resolved "https://registry.yarnpkg.com/mmenu-light/-/mmenu-light-2.3.1.tgz#c472f0b8da92528c7e1957cd5b62ab7803c445d7"
+ integrity sha512-t9rC8F/JQbP4xpjX8avEpu7cLtq1hMeKtiMt0H8wHDC61sGQy42C46ojXdXbRA9Sgz202x2kqdKwLLMow4IC2g==
+
move-concurrently@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/move-concurrently/-/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"