[5.2] [Guided tours] Increase the width and adjust the height of the popup

[jgerman-bot]

New language relevant PR in upstream repo: joomla/joomla-cms#43810 Here are the upstream changes:

Click to expand the diff!

diff --git a/administrator/language/en-GB/guidedtours.joomla_welcome.ini b/administrator/language/en-GB/guidedtours.joomla_welcome.ini
index 812312a3c955..7b17609ae08c 100644
--- a/administrator/language/en-GB/guidedtours.joomla_welcome.ini
+++ b/administrator/language/en-GB/guidedtours.joomla_welcome.ini
@@ -4,4 +4,4 @@
 ; Note : All ini files need to be saved as UTF-8
 
 COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_TITLE="Welcome to Joomla!"
-COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_DESCRIPTION="<p>This tour will give you a quick overview of how to get started with Joomla!</p><p>You are in the Joomla Administrator area, also known as the "<strong>Backend</strong>". This is where you set up and manage your entire Joomla Site.</p><p><strong>Want to learn more?</strong></p><p>Let's start the tour and build your site with the power of Joomla!</p>"
+COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_DESCRIPTION="<p>This tour will give you a quick overview of how to get started with Joomla!</p><p>You are in the Joomla Administrator area, also known as the "<strong>Backend</strong>".<br>This is where you set up and manage your entire Joomla Site.</p><p><strong>Want to learn more?</strong></p><p>Let's start the tour and build your site with the power of Joomla!</p>"
diff --git a/administrator/language/en-GB/guidedtours.joomla_welcome_steps.ini b/administrator/language/en-GB/guidedtours.joomla_welcome_steps.ini
index a5b805c2ead6..0a5b571c79f7 100644
--- a/administrator/language/en-GB/guidedtours.joomla_welcome_steps.ini
+++ b/administrator/language/en-GB/guidedtours.joomla_welcome_steps.ini
@@ -7,7 +7,7 @@ COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_STEP_MENUS_TITLE="The Menu"
 COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_STEP_MENUS_DESCRIPTION="<p>The menu provides access to the Administrator management pages. Each section has a collection of pages for managing that particular aspect of Joomla, such as Content, Menus and Users.</p><p>The window pane icons link to individual dashboards for those sections. The System menu itself leads to a dashboard.</p>"
 
 COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_STEP_QUICKACCESS_TITLE="The Dashboard Panels"
-COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_STEP_QUICKACCESS_DESCRIPTION="<p>Dashboards provide quick access to frequently used pages via their icons.</p><p>Each dashboard panel is an Administrator module that can be customised via its Settings icon <span class=\"icon-cogs\" aria-hidden=\"true\"></span>. This allows you to configure your site dashboards to suit your own purposes.</p>"
+COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_STEP_QUICKACCESS_DESCRIPTION="<p>Dashboards provide quick access to frequently used pages via their icons.</p><p>Each dashboard panel is an Administrator module that can be customised via its Settings icon <span class=\"icon-cogs\" aria-hidden=\"true\"></span>.<br>This allows you to configure your site dashboards to suit your own purposes.</p>"
 
 COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_STEP_NOTIFICATIONS_TITLE="The Notifications Panel"
 COM_GUIDEDTOURS_TOUR_WELCOMETOJOOMLA_STEP_NOTIFICATIONS_DESCRIPTION="<p>The Notifications panel shows when updates are available for Joomla and other extensions. Outstanding Privacy Requests are also shown here.</p>"
diff --git a/build/media_source/plg_system_guidedtours/scss/guidedtours.scss b/build/media_source/plg_system_guidedtours/scss/guidedtours.scss
index 745ce31ed52c..d4f6b865e79e 100644
--- a/build/media_source/plg_system_guidedtours/scss/guidedtours.scss
+++ b/build/media_source/plg_system_guidedtours/scss/guidedtours.scss
@@ -5,6 +5,15 @@
 
 @import "../../../../node_modules/shepherd.js/dist/css/shepherd";
 
+.shepherd-element {
+  width: max-content;
+  max-width: min(600px, 90%);
+}
+
+.shepherd-element.shepherd-centered {
+  max-width: min(1200px, 90%);
+}
+
 .shepherd-modal-overlay-container.shepherd-modal-is-visible {
   opacity: .7;
 }
@@ -30,13 +39,16 @@
 }
 
 .shepherd-text {
-  padding: 1em;
+  max-height: calc(100vh - 240px);
+  padding: 1rem 1rem 0;
+  overflow-y: auto;
   line-height: 1.5em;
 }
 
 .shepherd-footer {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
+  padding: 1rem;
 }
 
 .shepherd-button-primary {

[zero-24]

PR: #3238