diff options
author | arkascha <github@christian-reiner.info> | 2013-04-29 17:35:57 +0400 |
---|---|---|
committer | arkascha <github@christian-reiner.info> | 2013-04-29 17:35:57 +0400 |
commit | 4e84ab1b65e49e5e39c24ea80f61455652f7e1e9 (patch) | |
tree | d7662c483a90344150d32f05d2554f489f0c68c7 /fluxx_compensator | |
parent | 317e77eaf7bbc31f17bcb4b030fac122343a0070 (diff) |
fluxx_compensator: Some performance optiomizations to css rules.
Diffstat (limited to 'fluxx_compensator')
-rw-r--r-- | fluxx_compensator/css/dynamic.css | 42 | ||||
-rw-r--r-- | fluxx_compensator/css/fluxx.css | 6 | ||||
-rw-r--r-- | fluxx_compensator/css/transitions.css | 17 |
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; } |