[TASK] Bring back module menu accordion arrows 15/25415/8
authorErnesto Baschny <ernst@cron-it.de>
Thu, 14 Nov 2013 22:57:03 +0000 (23:57 +0100)
committerGeorg Ringer <georg.ringer@gmail.com>
Tue, 19 Nov 2013 15:43:06 +0000 (16:43 +0100)
To visualize that the module groups can be expanded and collapsed, the UX
team decided that the arrows are required. This brings them back on the
right with a very light gray to avoid distractions.

Resolves: #53651
Releases: 6.2
Change-Id: Ie289b59dfb24077ed99964e7e944c8dfd443af59
Reviewed-on: https://review.typo3.org/25415
Reviewed-by: Jost Baron
Tested-by: Jost Baron
Reviewed-by: Wouter Wolters
Tested-by: Wouter Wolters
Reviewed-by: Georg Ringer
Tested-by: Georg Ringer
typo3/sysext/t3skin/Resources/Public/Css/visual/module_menu.css
typo3/sysext/t3skin/images/arrows/module-menu-down-gray.png [new file with mode: 0644]
typo3/sysext/t3skin/images/arrows/module-menu-down-gray@2x.png [new file with mode: 0644]
typo3/sysext/t3skin/images/arrows/module-menu-left-gray.png [new file with mode: 0644]
typo3/sysext/t3skin/images/arrows/module-menu-left-gray@2x.png [new file with mode: 0644]

index 7bcee62..8e39ab4 100644 (file)
@@ -78,6 +78,31 @@ Module menu
        text-transform: uppercase;
 }
 
+#typo3-menu li div.collapsed {
+       background-image: url('../../../../images/arrows/module-menu-left-gray.png');
+       background-position: right 23px top 7px;
+       background-position: 90% 50%\9; /* IE8 hack */
+       background-repeat: no-repeat;
+}
+
+#typo3-menu li div.expanded {
+       background-image: url('../../../../images/arrows/module-menu-down-gray.png');
+       background-position: right 22px top 9px;
+       background-position: 90% 50%\9; /* IE8 hack */
+       background-repeat: no-repeat;
+}
+
+@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
+       .backgroundsize #typo3-menu li div.collapsed {
+               background-image: url('../../../../images/arrows/module-menu-left-gray@2x.png');
+               background-size: 6px 7px;
+       }
+       .backgroundsize #typo3-menu li div.expanded {
+               background-image: url('../../../../images/arrows/module-menu-down-gray@2x.png');
+               background-size: 7px 6px;
+       }
+}
+
 #typo3-menu li ul li {
        cursor: pointer;
        font-weight: normal;
diff --git a/typo3/sysext/t3skin/images/arrows/module-menu-down-gray.png b/typo3/sysext/t3skin/images/arrows/module-menu-down-gray.png
new file mode 100644 (file)
index 0000000..8e27353
Binary files /dev/null and b/typo3/sysext/t3skin/images/arrows/module-menu-down-gray.png differ
diff --git a/typo3/sysext/t3skin/images/arrows/module-menu-down-gray@2x.png b/typo3/sysext/t3skin/images/arrows/module-menu-down-gray@2x.png
new file mode 100644 (file)
index 0000000..70780d4
Binary files /dev/null and b/typo3/sysext/t3skin/images/arrows/module-menu-down-gray@2x.png differ
diff --git a/typo3/sysext/t3skin/images/arrows/module-menu-left-gray.png b/typo3/sysext/t3skin/images/arrows/module-menu-left-gray.png
new file mode 100644 (file)
index 0000000..9760108
Binary files /dev/null and b/typo3/sysext/t3skin/images/arrows/module-menu-left-gray.png differ
diff --git a/typo3/sysext/t3skin/images/arrows/module-menu-left-gray@2x.png b/typo3/sysext/t3skin/images/arrows/module-menu-left-gray@2x.png
new file mode 100644 (file)
index 0000000..355fa32
Binary files /dev/null and b/typo3/sysext/t3skin/images/arrows/module-menu-left-gray@2x.png differ