From 813201a8235fc8ed379e6521cee03499dad19027 Mon Sep 17 00:00:00 2001 From: Adam Kudrna Date: Tue, 1 Oct 2024 16:58:07 +0200 Subject: [PATCH] Docs(web-twig): Add theme switcher to the demo app #DS-1479 --- .../templates/layout/base.html.twig | 31 ++++++++++++++++++- .../templates/layout/default.html.twig | 2 +- .../templates/partials/header.html.twig | 8 +++++ .../partials/themeSwitcher.html.twig | 15 +++++++++ 4 files changed, 54 insertions(+), 2 deletions(-) create mode 100644 apps/web-twig-demo/templates/partials/themeSwitcher.html.twig diff --git a/apps/web-twig-demo/templates/layout/base.html.twig b/apps/web-twig-demo/templates/layout/base.html.twig index 0aeea3ac1a..cbd428e590 100644 --- a/apps/web-twig-demo/templates/layout/base.html.twig +++ b/apps/web-twig-demo/templates/layout/base.html.twig @@ -21,11 +21,40 @@ {# As we also use this demo for visual testing we need to block render until the font is loaded. #} + + {% set themes = [ + { + id: 'light-default', + name: 'Light default', + }, + { + id: 'light-on-brand', + name: 'Light on brand', + }, + ] %} + + {{ encore_entry_link_tags('app') }} {{ encore_entry_script_tags('app') }} - + {% block body %}{% endblock %} diff --git a/apps/web-twig-demo/templates/layout/default.html.twig b/apps/web-twig-demo/templates/layout/default.html.twig index 787c85564e..90630d90a4 100644 --- a/apps/web-twig-demo/templates/layout/default.html.twig +++ b/apps/web-twig-demo/templates/layout/default.html.twig @@ -20,7 +20,7 @@ {%- endset %} {% block header %} - {% include 'partials/header.html.twig' %} + {% include 'partials/header.html.twig' with { themes } only %} {% include 'partials/cover.html.twig' with { isUnstable, parentPageName, parentPageUrl, title } only %} {% endblock %} diff --git a/apps/web-twig-demo/templates/partials/header.html.twig b/apps/web-twig-demo/templates/partials/header.html.twig index b8279bfa87..7eb20f9188 100644 --- a/apps/web-twig-demo/templates/partials/header.html.twig +++ b/apps/web-twig-demo/templates/partials/header.html.twig @@ -23,6 +23,10 @@ + + {% include "partials/themeSwitcher.html.twig" with { isLabelHidden: true, themes } only %} + + @@ -45,4 +49,8 @@ + + {% include "partials/themeSwitcher.html.twig" with { themes } only %} + + diff --git a/apps/web-twig-demo/templates/partials/themeSwitcher.html.twig b/apps/web-twig-demo/templates/partials/themeSwitcher.html.twig new file mode 100644 index 0000000000..225b827b63 --- /dev/null +++ b/apps/web-twig-demo/templates/partials/themeSwitcher.html.twig @@ -0,0 +1,15 @@ +{% set inputProps = { autocomplete: 'off' } %} + +