[BUGFIX] Install Tool: Improve UX for foldout sections 55/23755/2
authorMarkus Klein <klein.t3@mfc-linz.at>
Wed, 11 Sep 2013 15:44:48 +0000 (17:44 +0200)
committerJigal van Hemert <jigal.van.hemert@typo3.org>
Wed, 11 Sep 2013 18:18:20 +0000 (20:18 +0200)
Change the cursor and add an arrow for foldout sections
in the Install Tool.

Resolves: #49188
Releases: 6.2
Change-Id: Iaf8f17b420f0716a23b5a6d8d4ebbbaa815a9143
Reviewed-on: https://review.typo3.org/23755
Reviewed-by: Wouter Wolters
Tested-by: Wouter Wolters
Reviewed-by: Jigal van Hemert
Tested-by: Jigal van Hemert
typo3/sysext/install/Resources/Public/Images/Icon/arrowdown.png [new file with mode: 0644]
typo3/sysext/install/Resources/Public/Images/Icon/arrowright.png [new file with mode: 0644]
typo3/sysext/install/Resources/Public/Javascript/Install.js
typo3/sysext/install/Resources/Public/Stylesheets/Action/Common/Install.css

diff --git a/typo3/sysext/install/Resources/Public/Images/Icon/arrowdown.png b/typo3/sysext/install/Resources/Public/Images/Icon/arrowdown.png
new file mode 100644 (file)
index 0000000..d273a2a
Binary files /dev/null and b/typo3/sysext/install/Resources/Public/Images/Icon/arrowdown.png differ
diff --git a/typo3/sysext/install/Resources/Public/Images/Icon/arrowright.png b/typo3/sysext/install/Resources/Public/Images/Icon/arrowright.png
new file mode 100644 (file)
index 0000000..cec4484
Binary files /dev/null and b/typo3/sysext/install/Resources/Public/Images/Icon/arrowright.png differ
index a5c3827..0065820 100755 (executable)
@@ -34,7 +34,9 @@ $(document).ready(function() {
 
        // Toggle open/close
        $('.toggleButton').on('click', function() {
-               $(this).closest('.toggleGroup').find('.toggleData').toggle();
+               $toggleGroup = $(this).closest('.toggleGroup');
+               $toggleGroup.toggleClass('expanded');
+               $toggleGroup.find('.toggleData').toggle();
        });
 
        // Simple password strength indicator
index 1ee279e..56539b9 100755 (executable)
@@ -402,6 +402,15 @@ button span.t3-install-form-button-icon-negative {
        color: #111 !important;
 }
 
+#t3-install-box-body .toggleButton {
+    background: url('../../../Images/Icon/arrowright.png') no-repeat;
+    padding-left: 20px;
+    cursor: pointer;
+}
+#t3-install-box-body .expanded .toggleButton {
+    background-image: url('../../../Images/Icon/arrowdown.png');
+}
+
 .t3-install-tool-configuration-radio {
        float: none;
 }