fluxx_compensator: Some performance optiomizations to css rules.

3 files changed, 29 insertions, 36 deletions

diff --git a/fluxx_compensator/css/dynamic.css b/fluxx_compensator/css/dynamic.css
index 8cbdfc87b..761879e0d 100644
--- a/fluxx_compensator/css/dynamic.css
+++ b/fluxx_compensator/css/dynamic.css
@@ -28,16 +28,10 @@
  * @author Christian Reiner
  */
 
-/* some general static modifications required due to strange OC base definitions */
-html.fluxx-state-H-hidden {}
-html.fluxx-state-N-hidden {}
-html.fluxx-state-H-shown {}
-html.fluxx-state-N-shown {}
-
 /* some general mode specific modifications */
 
 /* navigation hidden: move left and add a more impressive shadow as a hint */
-html.fluxx-state-N-hidden body > nav > #navigation {
+html.fluxx-state-N-hidden #navigation {
 	left: -64px;
 	box-shadow: 0 0 20px rgba(0, 0, 0, .5), inset 0 -2px 10px #222;
 	-o-box-shadow: 0 0 20px rgba(0, 0, 0, .5), inset 0 -2px 10px #222;
@@ -47,15 +41,15 @@ html.fluxx-state-N-hidden body > nav > #navigation {
 	-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .5), inset 0 -2px 10px #222;
 }
 /* move content to the left when navigation is hidden */
-html.fluxx-state-N-hidden body #content-wrapper {
+html.fluxx-state-N-hidden #content-wrapper {
 	padding-left: 0;
 }
-html.fluxx-state-N-hidden body #controls {
+html.fluxx-state-N-hidden #controls {
 	padding-right: 6px;
 }
 
 /* header hidden: move up and show more impressive shadow as a hint */
-html.fluxx-state-H-hidden body > header > #header {
+html.fluxx-state-H-hidden #header {
 	top: -45px !important;
 	box-shadow: 0 0 20px rgba(0, 0, 0, .5), inset 0 -2px 10px #222 !important;
 	-o-box-shadow: 0 0 20px rgba(0, 0, 0, .5), inset 0 -2px 10px #222 !important;
@@ -64,44 +58,44 @@ html.fluxx-state-H-hidden body > header > #header {
 	-khtml-box-shadow: 0 0 20px rgba(0, 0, 0, .5), inset 0 -2px 10px #222 !important;
 	-webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .5), inset 0 -2px 10px #222 !important;
 }
-/* move content up to top when header is hidden */
-html.fluxx-state-H-hidden body > nav > #navigation {
+/* move stuff up to top when header is hidden */
+html.fluxx-state-H-hidden #navigation {
 	padding-top: 0;
 }
-html.fluxx-state-H-hidden body > nav > #navigation .fluxx-handle {
+html.fluxx-state-H-hidden #navigation .fluxx-handle {
 	margin-top: -45px;
 }
-html.fluxx-state-H-hidden body #content-wrapper {
+html.fluxx-state-H-hidden #content-wrapper {
 	padding-top: 0px;
 }
 
 /* below some specific app dependent settings to compensate for exotic in-app styles */
 
 /* no _known_ mode detected, so _guess_ */
-html.fluxx-modeless body { }
+html.fluxx-modeless { }
 
 /* 'bookarks' app */
 html.fluxx-mode-bookmarks { }
-html.fluxx-mode-bookmarks.fluxx-state-N-hidden body #content #firstrun { left: 280px; }
+html.fluxx-mode-bookmarks.fluxx-state-N-hidden #firstrun { left: 280px; }
 
 /* 'calendar' app */
-html.fluxx-mode-calendar body { }
+html.fluxx-mode-calendar { }
 
 /* 'contacts' app */
-html.fluxx-mode-contacts body { }
-html.fluxx-mode-contacts.fluxx-state-N-hidden body #content #contactsheader { left: 280px; }
+html.fluxx-mode-contacts { }
+html.fluxx-mode-contacts.fluxx-state-N-hidden #contactsheader { left: 280px; }
 
 /* 'files' app */
-html.fluxx-mode-files body { }
+html.fluxx-mode-files { }
 
 /* 'gallery' app */
-html.fluxx-mode-gallery body { }
+html.fluxx-mode-gallery { }
 
 /* 'media' app */
-html.fluxx-mode-media body { }
+html.fluxx-mode-media { }
 
 /* 'notes' app */
-html.fluxx-mode-notes body { }
+html.fluxx-mode-notes { }
 
 /* 'shorty' app */
-html.fluxx-mode-shorty body { }
+html.fluxx-mode-shorty { }
diff --git a/fluxx_compensator/css/fluxx.css b/fluxx_compensator/css/fluxx.css
index 6cc148381..5683cf069 100644
--- a/fluxx_compensator/css/fluxx.css
+++ b/fluxx_compensator/css/fluxx.css
@@ -105,9 +105,11 @@ html .fluxx-handle.fluxx-vertical img {
 }
 
 /* switch cursor to a 'move' indication during move mode */
-html.fluxx-handle-move-H, html.fluxx-handle-move-H * {
+html.fluxx-handle-move-H, 
+html.fluxx-handle-move-H img {
 	cursor: col-resize !important;
 }
-html.fluxx-handle-move-N, html.fluxx-handle-move-N * {
+html.fluxx-handle-move-N, 
+html.fluxx-handle-move-N img {
 	cursor: row-resize !important;
 }
diff --git a/fluxx_compensator/css/transitions.css b/fluxx_compensator/css/transitions.css
index 993dd692f..c8c09c654 100644
--- a/fluxx_compensator/css/transitions.css
+++ b/fluxx_compensator/css/transitions.css
@@ -29,16 +29,13 @@
  */
 
 /* animate the fluxx handles themselves */
-html body .fluxx-handle,
-html body .fluxx-handle * {
-	transition:all 300ms;-o-transition:all 300ms;-ms-transition:all 300ms;-moz-transition:all 300ms;-khtml-transition:all 300ms;-webkit-transition:all 300ms;
-}
-/* animate general layout elements */
-html body > header > #header,
-html body > nav > #navigation,
-html body > nav > #navigation #settings,
-html body #content-wrapper,
-html body #controls {
+.fluxx-handle,
+.fluxx-handle img,
+#header,
+#navigation,
+#navigation #settings,
+#content-wrapper,
+#controls {
 	transition:all 300ms;-o-transition:all 300ms;-ms-transition:all 300ms;-moz-transition:all 300ms;-khtml-transition:all 300ms;-webkit-transition:all 300ms;
 }