.. include:: /Includes.rst.txt

.. _migration_6.2.11:

=============================
Upgrade from 6.2.10 to 6.2.11
=============================

This document will only cover **breaking changes**, that could happen while
overriding the Bootstrap Package.

**Table of Contents:**

.. contents::
   :backlinks: top
   :class: compact-list
   :depth: 1
   :local:



Support multilevel tree in subnavigation
========================================

Frontend output of the submenu has changed and the 3rd level is now displayed
by default. You will need to adapt this change if you are not using the theme
that comes with the Bootstrap Package.

Before
------

**Markup**

.. code-block:: html

    <div class="hidden-print hidden-xs hidden-sm" role="complementary">
        <nav class="list-group">
            <a class="list-group-item active" href="#">Link 1</a>
            <a class="list-group-item active" href="#">Link 2</a>
        </nav>
    </div>

After
------

**Markup**

.. code-block:: html

    <nav class="hidden-print hidden-xs hidden-sm" role="complementary">
        <ul class="nav nav-sidebar">
            <li><a href="#">Link 1</a></li>
            <li class="active">
                <a href="#">Link 2</a>
                <ul>
                    <li class="active"><a href="#">Link 2.1">Link 2.1</a></li>
                    <li><a href="#">Link 2.2">Link 2.2</a></li>
                </ul>
            </li>
        </ul>
    </nav>




Drop version number for jQuery in filename
==========================================

Previously we appended the version number to the jQuery filename, this has lead
to missing jQuery versions if files were moved outside the bootstrap_package.
We are not removing the version number to prevent jQuery is missing, this makes
it also more easy to maintain in the build process. Check your TypoScript setup
for possible overrides.

Before
------

**TypoScript Setup**

.. code-block:: typoscript

    page.includeJSFooterLibs {
        jquery = {$page.includePath.javascript}Libs/jquery-x.xx.xx.min.js
    }

After
------

**TypoScript Setup**

.. code-block:: typoscript

    page.includeJSFooterLibs {
        jquery = {$page.includePath.javascript}Libs/jquery.min.js
    }




Use default Bootstrap markup for navigation toggle
==================================================

In previous builds Glyphicon icons were used to represent the toggle state of
the main menu for smaller screen sizes. Also the toggle js was always loaded in
within the main.js javascript file from the Bootstrap Package. This has lead to
problems when the icon font was changed or the main javascript file was
externally overriden.

Instead of adapting the custom markup to your theme the default bootstrap markup
is now in use, so its working now also out of the box also if the custom theme
from the Bootstrap Package is not included. The toggle state is now solved via
a CSS class toggle and a bit of custom css in the Bootstrap Package theme. The
JavaScript toggle functionality has been move into a single file so it can be
easily turned of if you do not need it.

Before
------

**Markup**

.. code-block:: html

    <button class="navbar-toggle navbar-toggle-menu" type="button" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="glyphicon glyphicon-list"></span>
        <span class="sr-only">Toggle navigation</span>
    </button>

After
------

**Markup**

.. code-block:: html

    <button class="navbar-toggle collapsed" type="button" data-toggle="collapse" data-target=".navbar-collapse">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
    </button>

**TypoScript Setup**

.. code-block:: typoscript

    page.includeJSFooterlibs {
        #### Toggle collapsed CSS class on the navbar toggle button
        bootstrap_navbartoggle = {$page.includePath.javascript}Libs/bootstrap.navbartoggle.min.js
    }




Custom Lightbox JavaScript has been moved
=========================================

In order to make the package more modular we removed the main.js file in favor
of single files for each functionality so it can be added or removed more easily.

After
------

**TypoScript Setup**

.. code-block:: typoscript

    page.includeJSFooterlibs {
        #### Basic lightbox implementation for bootstrap
        bootstrap_lightbox = {$page.includePath.javascript}Libs/bootstrap.lightbox.min.js
    }




LESS files have been moved private to public
============================================

The resources folder in TYPO3 extensions is protected by default that made it
impossible to make real usage of CSS SourceMaps. The files have been moved to
Resources/Public, please ensure that your update your references to these files.

Before
------

.. code-block:: html

    EXT:bootstrap_package/Resources/Private/Less/

After
------

.. code-block:: html

    EXT:bootstrap_package/Resources/Public/Less/




Corrected calculation of relative paths in build in LESS parser
===============================================================

Calculation of relative paths in less should now be resolved correctly.
The wired relative paths you have to set before will no longer be working and
you need to set the constants now relative from the LESS file that is parsed.

Before
------

**TypoScript Constants**

.. code-block:: typoscript

    plugin.bootstrap_package {
        settings.less {
            icon-font-path = "../../../../../typo3conf/ext/bootstrap_package/Resources/Public/Fonts/"
        }
    }

After
-----

**TypoScript Constants**

.. code-block:: typoscript

    plugin.bootstrap_package {
        settings.less {
            icon-font-path = "../../Fonts/"
        }
    }




Template Fallbacks
==================

We enabled fallbacks for page templates, so you can extend the package without
the need to copy all the templates if you want to change parts of the templates.

Before
------

**TypoScript Setup**

.. code-block:: typoscript

    page.10 {
        file.stdWrap.cObject = CASE
        file.stdWrap.cObject {

            key.data = levelfield:-1, backend_layout_next_level, slide
            key.override.field = backend_layout

            bootstrap_package__default_clean = TEXT
            bootstrap_package__default_clean.value = {$page.fluidtemplate.templateRootPath}DefaultClean.html
            bootstrap_package__default_clean.insertData = 1

            ...

        }
        partialRootPath = {$page.fluidtemplate.partialRootPath}
        layoutRootPath = {$page.fluidtemplate.layoutRootPath}
    }

After
-----

**TypoScript Setup**

.. code-block:: typoscript

    page.10 {
        templateName = TEXT
        templateName.stdWrap.cObject = CASE
        templateName.stdWrap.cObject {

            key.data = levelfield:-1, backend_layout_next_level, slide
            key.override.field = backend_layout

            bootstrap_package__default_clean = TEXT
            bootstrap_package__default_clean.value = DefaultClean

            ...

        }
        templateRootPaths {
            0 = EXT:bootstrap_package/Resources/Private/Templates/Page/
            1 = {$page.fluidtemplate.templateRootPath}
        }
        partialRootPaths {
            0 = EXT:bootstrap_package/Resources/Private/Partials/Page/
            1 = {$page.fluidtemplate.partialRootPath}
        }
        layoutRootPaths {
            0 = EXT:bootstrap_package/Resources/Private/Layouts/Page/
            1 = {$page.fluidtemplate.layoutRootPath}
        }
    }




Deprecated fallbacks
====================

Fallbacks for deprecated backendlayout keys have been removed,
use the alternatives instead.

**Removed Templates**

.. code-block:: bash

    bootstrap_package__default_subnavigation
    bootstrap_package__default_subnavigation_2_columns

**Alternatives Templates**

.. code-block:: bash

    bootstrap_package__default_subnavigation_right
    bootstrap_package__default_subnavigation_right_2_columns




Support for EXT:THEMES removed
==============================

Through lack of resources we removed the support for ext:themes.
It is not planned to support ext:themes in the future again.