Merge pull request #95 from TYPO3-Documentation/94-update-templates

94 update templates
TYPO3-Documentation · Nov 8, 2024 · f21714b · f21714b
2 parents 69dcc34 + d677370
commit f21714b
Show file tree

Hide file tree

Showing 9 changed files with 118 additions and 122 deletions.
diff --git a/.ddev/config.yaml b/.ddev/config.yaml
@@ -5,7 +5,7 @@ php_version: "8.2"
 webserver_type: nginx-fpm
 router_http_port: "80"
 router_https_port: "443"
-xdebug_enabled: trueent: [ ]
+xdebug_enabled: false
 additional_hostnames: []
 additional_fqdns: []
 use_dns_when_possible: true

diff --git a/config/services.yaml b/config/services.yaml
@@ -16,16 +16,16 @@ parameters:
     assets:
         css:
             header:
-                - 'https://typo3.azureedge.net/typo3documentation/theme/typo3-docs-theme/0.2.32/css/theme.css'
+                - 'https://typo3.azureedge.net/typo3documentation/theme/typo3-docs-theme/0.17.3/css/theme.css'
             footer:
         js:
             header:
                 -  'https://typo3.azureedge.net/typo3infrastructure/universe/dist/webcomponents-loader.js'
                 - 'https://typo3.azureedge.net/typo3infrastructure/universe/dist/typo3-universe.js'
             footer:
-                - 'https://typo3.azureedge.net/typo3documentation/theme/typo3-docs-theme/0.2.32/js/popper.min.js'
-                - 'https://typo3.azureedge.net/typo3documentation/theme/typo3-docs-theme/0.2.32/js/bootstrap.min.js'
-                - 'https://typo3.azureedge.net/typo3documentation/theme/typo3-docs-theme/0.2.32/js/theme.min.js'
+                - 'https://typo3.azureedge.net/typo3documentation/theme/typo3-docs-theme/0.17.3/js/popper.min.js'
+                - 'https://typo3.azureedge.net/typo3documentation/theme/typo3-docs-theme/0.17.3/js/bootstrap.min.js'
+                - 'https://typo3.azureedge.net/typo3documentation/theme/typo3-docs-theme/0.17.3/js/theme.min.js'
 
 services:
     # default configuration for services in *this* file

diff --git a/src/Twig/AppExtension.php b/src/Twig/AppExtension.php
@@ -29,6 +29,9 @@ public function getFunctions(): array
             new TwigFunction('aggregationBucket', $this->aggregationBucket(...), ['is_safe' => ['html']]),
             new TwigFunction('generateLinkWithout', $this->generateLinkWithout(...)),
             new TwigFunction('generateLinkWith', $this->generateLinkWith(...)),
+            new TwigFunction('getReportIssueLink', $this->getReportIssueLink(...)),
+            new TwigFunction('getHowToEditLink', $this->getHowToEditLink(...)),
+            new TwigFunction('getEditOnGitHubLink', $this->getEditOnGitHubLink(...)),
             new TwigFunction('getLabelForFilter', $this->getLabelForFilter(...)),
             new TwigFunction('sortVersions', VersionSorter::sortVersions(...)),
             new TwigFunction('filterVersions', VersionFilter::filterVersions(...)),
@@ -85,6 +88,21 @@ public function aggregationBucket(string $category, string $index, array $bucket
             . '</div>';
     }
 
+    public function getEditOnGitHubLink(): string
+    {
+        return 'https://github.com/TYPO3-Documentation/t3docs-search-indexer';
+    }
+
+    public function getHowToEditLink(): string
+    {
+        return 'https://docs.typo3.org/m/typo3/docs-how-to-document/main/en-us/Howto/EditOnGithub.html';
+    }
+
+    public function getReportIssueLink(): string
+    {
+        return 'https://github.com/TYPO3-Documentation/t3docs-search-indexer/issues/new';
+    }
+
     /**
      * @param      $in
      *

diff --git a/templates/layout/base.html.twig b/templates/layout/base.html.twig
@@ -53,7 +53,7 @@
 
     <div class="page-main">
         <div class="page-main-inner">
-            {% block navigation %}{% endblock %}
+            {% include 'partial/page_main/navigation.html.twig' %}
 
             <div class="page-main-content">
                 <div class="rst-content">

diff --git a/templates/partial/base/breadcrumbs.html.twig b/templates/partial/base/breadcrumbs.html.twig
@@ -1,20 +1,32 @@
-{#TODO: Replace hardcoded breadcrumbs with custom twig-function for generating breadcrumbs#}
+{%- set gitHubLink = getEditOnGitHubLink() -%}
+{%- set reportIssueLink = getReportIssueLink() -%}
+
+
 <div class="breadcrumb-bar" aria-label="breadcrumbs navigation" role="navigation">
     <ol class="breadcrumb">
         <li class="breadcrumb-item"><a href="/">Start</a></li>
         <li class="breadcrumb-item"><a href="#">Search results</a></li>
         {% if breadcrumb_title is defined %}
-        <li aria-current="page" class="breadcrumb-item active">
-            {{ breadcrumb_title }}
-        </li>
+            <li aria-current="page" class="breadcrumb-item active">
+                {{ breadcrumb_title }}
+            </li>
         {% endif %}
     </ol>
     <div class="breadcrumb-additions">
-        <a class="btn btn-sm btn-primary"
-           href="https://github.com/TYPO3-Documentation/t3docs-search-indexer/"
-           rel="nofollow noopener" target="_blank">
+        {%- if (reportIssueLink or gitHubLink) %}
+        {%- if reportIssueLink %}
+        <a class="btn btn-sm btn-light" href="{{ reportIssueLink }}"
+           id="btnReportIssue" rel="nofollow noopener" target="_blank">
+            <span class="btn-icon"><i class="fas fa-bug"></i></span>
+            <span class="btn-text">Report issue</span>
+        </a>
+        {% endif %}
+        {%- if gitHubLink %}
+        <a class="btn btn-sm btn-secondary" href="{{ gitHubLink }}" id="btnEditOnGitHub" rel="nofollow noopener" target="_blank">
             <span class="btn-icon"><span class="fab fa-github"></span></span>
             <span class="btn-text">Edit on GitHub</span>
         </a>
+        {% endif %}
+        {% endif %}
     </div>
 </div>
diff --git a/templates/partial/base/page_header.html.twig b/templates/partial/base/page_header.html.twig
@@ -1,26 +1,34 @@
 <div class="page-header">
     <div class="page-header-inner">
         <div class="row">
-            <div class="col-sm-3 col-md-4 col-lg-6">
+            <div class="col-md-2 col-lg-4">
                 <a class="logo" href="/" title="TYPO3 Documentation">
                     <img alt="TYPO3 Logo" class="logo-image"
                          height="130" src="https://typo3.azureedge.net/typo3documentation/theme/sphinx_typo3_theme/4.5.1/img/typo3-logo.svg" width="484"/>
                 </a>
             </div>
-            <div class="col-sm-9 col-md-8 col-lg-6">
-                <div role="search">
-                    <form id="rtd-search-form" class="wy-form" action="{{ path('searchresult') }}" method="get">
-                        <div class="input-group mb-3 mt-sm-3">
-                            <select class="form-select search__scope" id="searchscope" name="scope">
-                                <option value="">Search all</option>
-                                {% if searchScope is defined and searchScope is not empty %}
-                                    <option value="{{ searchScope|striptags|escape }}" selected="selected">Search current</option>
-                                {% endif %}
-                            </select>
-                            <input type="text" class="form-control shadow-none" name="q" autocomplete="off" placeholder="Search in TYPO3 documentation" id="searchinput" value="{% if q is defined %}{{ q }}{% endif %}">
-                            <button class="btn btn-primary" type="submit"><i class="fa fa-search"></i>&nbsp;<span class="d-none d-md-inline">Search</span></button>
-                        </div>
-                    </form>
+            <div class="col-md-10 col-lg-8">
+                <div class="menu-search-wrapper">
+                    <all-documentations-menu  data-override-url="https://t3docs-search-indexer.ddev.site/mainmenu.json"></all-documentations-menu>
+                    <search role="search">
+                        <form id="rtd-search-form" class="wy-form" action="{{ path('searchresult') }}" method="get">
+                            <div class="input-group mb-3 mt-sm-3">
+                                <select class="form-select search__scope" id="searchscope" name="scope">
+                                    <option value="">Search all</option>
+                                    {% if searchScope is defined and searchScope is not empty %}
+                                        <option value="{{ searchScope|striptags|escape }}" selected="selected">Search
+                                            current
+                                        </option>
+                                    {% endif %}
+                                </select>
+                                <input type="text" class="form-control shadow-none" name="q" autocomplete="off"
+                                       placeholder="Search in TYPO3 documentation" id="searchinput"
+                                       value="{% if q is defined %}{{ q }}{% endif %}">
+                                <button class="btn btn-light search__submit" type="submit"><i class="fa fa-search"></i>&nbsp;<span
+                                            class="d-none d-md-inline">Search</span></button>
+                            </div>
+                        </form>
+                    </search>
                 </div>
             </div>
         </div>

diff --git a/templates/partial/page_main/meta-menu.html.twig b/templates/partial/page_main/meta-menu.html.twig
@@ -0,0 +1,28 @@
+
+{%- set howtoEditButton = getHowToEditLink() -%}
+{%- set gitHubLink = getEditOnGitHubLink() -%}
+{%- set reportIssueLink = getReportIssueLink() -%}
+
+{%- if (reportIssueLink or howtoEditButton or gitHubLink)  %}
+<div aria-label="Meta navigation" class="main_menu  d-block d-lg-none" role="navigation">
+    <hr/>
+    <p class="caption">Contributors Corner</p>
+    <ul class="menu-level-1">
+        {%- if (reportIssueLink)  %}
+            <li><a href="{{ reportIssueLink }}" rel="nofollow noopener" target="_blank">
+                    Report issue
+                </a></li>
+        {% endif -%}
+        {%- if (howtoEditButton)  %}
+            <li><a href="{{ howtoEditButton }}" rel="nofollow noopener" target="_blank">
+                    How to edit
+            </a></li>
+        {% endif -%}
+        {%- if (gitHubLink)  %}
+            <li><a href="{{ gitHubLink }}" rel="nofollow noopener" target="_blank">
+                    Edit current document on GitHub
+            </a></li>
+        {% endif -%}
+    </ul>
+</div>
+{% endif -%}