Commit f27fb96a authored by Florent Torregrosa's avatar Florent Torregrosa Committed by Florent Torregrosa
Browse files

Issue #3292595 by Grimreaper: Bootstrap 5 : Components > Navbar

parent e2b7db5e

logo.svg

+1 −1
Original line number Diff line number Diff line 
<svg xmlns="http://www.w3.org/2000/svg" width="40px" height="32px"><defs><linearGradient id="bs-logo-a" x1="76.079" x2="523.48" y1="10.798" y2="365.945" gradientUnits="userSpaceOnUse"><stop stop-color="#9013fe"/><stop offset="1" stop-color="#6610f2"/></linearGradient><linearGradient id="bs-logo-b" x1="193.508" x2="293.514" y1="109.74" y2="278.872" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#f1e5fc"/></linearGradient><filter xmlns="http://www.w3.org/2000/svg" id="bs-logo-c" width="197" height="249" x="161.901" y="83.457" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="4"/><feGaussianBlur stdDeviation="8"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/><feBlend in2="BackgroundImageFix" result="effect1_dropShadow"/><feBlend in="SourceGraphic" in2="effect1_dropShadow" result="shape"/></filter></defs><path fill="url(#bs-logo-a)" d="M56.481 53.32C55.515 25.58 77.128 0 106.342 0h299.353c29.214 0 50.827 25.58 49.861 53.32-.928 26.647.277 61.165 8.964 89.31 8.715 28.232 23.411 46.077 47.48 48.37v26c-24.069 2.293-38.765 20.138-47.48 48.37-8.687 28.145-9.892 62.663-8.964 89.311.966 27.739-20.647 53.319-49.861 53.319H106.342c-29.214 0-50.827-25.58-49.86-53.319.927-26.648-.278-61.166-8.966-89.311C38.802 237.138 24.07 219.293 0 217v-26c24.069-2.293 38.802-20.138 47.516-48.37 8.688-28.145 9.893-62.663 8.965-89.31z"/><path fill="url(#bs-logo-b)" filter="url(#bs-logo-c)" stroke="#fff" d="M267.103 312.457c47.297 0 75.798-23.158 75.798-61.355 0-28.873-20.336-49.776-50.532-53.085v-1.203c22.185-3.609 39.594-24.211 39.594-47.219 0-32.783-25.882-54.138-65.322-54.138h-88.74v217h89.202zm-54.692-189.48h45.911c24.958 0 39.131 11.128 39.131 31.279 0 21.505-16.484 33.535-46.372 33.535h-38.67v-64.814zm0 161.961v-71.431h45.602c32.661 0 49.608 12.03 49.608 35.49 0 23.459-16.484 35.941-47.605 35.941h-47.605z"/></svg>
 
<svg xmlns="http://www.w3.org/2000/svg" width="512" height="408"><defs><linearGradient id="bs-logo-a" x1="76.079" x2="523.48" y1="10.798" y2="365.945" gradientUnits="userSpaceOnUse"><stop stop-color="#9013fe"/><stop offset="1" stop-color="#6610f2"/></linearGradient><linearGradient id="bs-logo-b" x1="193.508" x2="293.514" y1="109.74" y2="278.872" gradientUnits="userSpaceOnUse"><stop stop-color="#fff"/><stop offset="1" stop-color="#f1e5fc"/></linearGradient><filter xmlns="http://www.w3.org/2000/svg" id="bs-logo-c" width="197" height="249" x="161.901" y="83.457" color-interpolation-filters="sRGB" filterUnits="userSpaceOnUse"><feFlood flood-opacity="0" result="BackgroundImageFix"/><feColorMatrix in="SourceAlpha" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"/><feOffset dy="4"/><feGaussianBlur stdDeviation="8"/><feColorMatrix values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0"/><feBlend in2="BackgroundImageFix" result="effect1_dropShadow"/><feBlend in="SourceGraphic" in2="effect1_dropShadow" result="shape"/></filter></defs><path fill="url(#bs-logo-a)" d="M56.481 53.32C55.515 25.58 77.128 0 106.342 0h299.353c29.214 0 50.827 25.58 49.861 53.32-.928 26.647.277 61.165 8.964 89.31 8.715 28.232 23.411 46.077 47.48 48.37v26c-24.069 2.293-38.765 20.138-47.48 48.37-8.687 28.145-9.892 62.663-8.964 89.311.966 27.739-20.647 53.319-49.861 53.319H106.342c-29.214 0-50.827-25.58-49.86-53.319.927-26.648-.278-61.166-8.966-89.311C38.802 237.138 24.07 219.293 0 217v-26c24.069-2.293 38.802-20.138 47.516-48.37 8.688-28.145 9.893-62.663 8.965-89.31z"/><path fill="url(#bs-logo-b)" filter="url(#bs-logo-c)" stroke="#fff" d="M267.103 312.457c47.297 0 75.798-23.158 75.798-61.355 0-28.873-20.336-49.776-50.532-53.085v-1.203c22.185-3.609 39.594-24.211 39.594-47.219 0-32.783-25.882-54.138-65.322-54.138h-88.74v217h89.202zm-54.692-189.48h45.911c24.958 0 39.131 11.128 39.131 31.279 0 21.505-16.484 33.535-46.372 33.535h-38.67v-64.814zm0 161.961v-71.431h45.602c32.661 0 49.608 12.03 49.608 35.49 0 23.459-16.484 35.941-47.605 35.941h-47.605z"/></svg>

src/HookHandler/PreprocessPatternNavbar.php

+39 −0
Original line number Diff line number Diff line
@@ -5,12 +5,21 @@ declare(strict_types = 1); 
namespace Drupal\ui_suite_bootstrap\HookHandler;



use Drupal\Component\Utility\Html;

use Drupal\Core\Render\Element;



/**

 * Handle variables needed for the pattern.

 */

class PreprocessPatternNavbar {



  /**

   * Pattern fields where render elements will be injected.

   */

  public const REGIONS_FIELDS = [

    'navigation',

    'navigation_collapsible',

  ];



  /**

   * Handle variables needed for the pattern.

   *
@@ -19,6 +28,36 @@ class PreprocessPatternNavbar { 
   */

  public function preprocess(array &$variables): void {

    $variables['navbar_id'] = Html::getUniqueId('bootstrap-navbar');



    if (substr($variables['variant'], 0, 4) === 'dark') {

      foreach (self::REGIONS_FIELDS as $region) {

        if (isset($variables[$region])) {

          $this->addDarkSetting($variables[$region]);

        }

      }

    }

  }



  /**

   * Add dark setting to navbar_nav pattern.

   *

   * @param array $item

   *   The render element to parse.

   */

  protected function addDarkSetting(array &$item): void {

    if (isset($item['#type']) &&

      in_array($item['#type'], ['pattern', 'pattern_preview']) &&

      $item['#id'] == 'navbar_nav'

    ) {

      $item['#dark'] = TRUE;

      // Stop recursion when a navbar_nav is found, no need to enter in it.

      return;

    }



    $children = Element::children($item);

    foreach ($children as $key) {

      $this->addDarkSetting($item[$key]);

    }

  }



}

src/HookHandler/PreprocessPatternNavbarNav.php

0 → 100644
+83 −0
Original line number Diff line number Diff line 
<?php



declare(strict_types = 1);



namespace Drupal\ui_suite_bootstrap\HookHandler;



use Drupal\Core\Url;



/**

 * Handle variables needed for the pattern.

 */

class PreprocessPatternNavbarNav {



  /**

   * Handle variables needed for the pattern.

   *

   * @param array $variables

   *   The preprocessed variables.

   */

  public function preprocess(array &$variables): void {

    foreach ($variables['items'] as &$item) {

      if (!($item['url'] instanceof Url)) {

        $item['url'] = Url::fromUri($item['url']);

      }



      // Add 'nav-link' class.

      $item['url']->mergeOptions(['attributes' => [

        'class' => [

          'nav-link',

        ],

      ]]);



      // Add 'dropdown-item' patterns to below links.

      if (isset($item['below']) && !empty($item['below'])) {

        foreach ($item['below'] as &$sub_level_item) {

          if (!($sub_level_item['url'] instanceof Url)) {

            $sub_level_item['url'] = Url::fromUri($sub_level_item['url']);

          }



          if ($sub_level_item['url']->isRouted() && $sub_level_item['url']->getRouteName() === '<nolink>') {

            $sub_level_item_attributes = $sub_level_item['url']->getOption('attributes');

            // Divider.

            if (isset($sub_level_item_attributes['class']) && in_array('dropdown-divider', $sub_level_item_attributes['class'])) {

              $sub_level_item = [

                '#type' => 'pattern',

                '#id' => 'dropdown_item',

                '#variant' => 'dropdown_divider',

              ];

            }

            // Header.

            elseif (isset($sub_level_item_attributes['class']) && in_array('dropdown-header', $sub_level_item_attributes['class'])) {

              $sub_level_item = [

                '#type' => 'pattern',

                '#id' => 'dropdown_item',

                '#variant' => 'dropdown_header',

                '#content' => $sub_level_item['title'],

              ];

            }

            // Text only.

            else {

              $sub_level_item = [

                '#type' => 'pattern',

                '#id' => 'dropdown_item',

                '#variant' => 'dropdown_item_text',

                '#content' => $sub_level_item['title'],

              ];

            }

          }

          else {

            $sub_level_item = [

              '#type' => 'pattern',

              '#id' => 'button',

              '#variant' => 'dropdown_item',

              '#label' => $sub_level_item['title'],

              '#url' => $sub_level_item['url']->toString(),

            ];

          }

        }

      }

    }

  }



}

templates/overrides/menu/menu--account.html.twig

+0 −15
Original line number Diff line number Diff line
@@ -18,18 +18,3 @@ 
 */

#}

{% extends "menu.html.twig" %}
 
{%

  set classes = [

    'menu',

    'menu--' ~ menu_name|clean_class,

    'nav',

    'navbar-nav',

    'navbar-right',

  ]

%}

{%

  set dropdown_classes = [

  'dropdown-menu',

  'dropdown-menu-right',

]

%}

templates/overrides/menu/menu--main.html.twig

+0 −8
Original line number Diff line number Diff line
@@ -18,11 +18,3 @@ 
 */

#}

{% extends "menu.html.twig" %}
 
{%

  set classes = [

    'menu',

    'menu--' ~ menu_name|clean_class,

    'nav',

    'navbar-nav',

  ]

%}