diff options
author | Olivier Paroz <github@oparoz.com> | 2015-06-25 21:37:59 +0300 |
---|---|---|
committer | Olivier Paroz <github@oparoz.com> | 2015-09-15 17:55:28 +0300 |
commit | 4acd294da3bb4694b5209d7dbf6e32307949ac3b (patch) | |
tree | f88b792cf937866ebdf9b3b803972167cd98b0ea /templates | |
parent | f743188645f840b049101b64793471435a6b2112 (diff) |
Add flip effect to sorting buttons
We can't use CSS3 because of IE
Diffstat (limited to 'templates')
-rw-r--r-- | templates/part.content.php | 22 | ||||
-rw-r--r-- | templates/public.php | 22 |
2 files changed, 32 insertions, 12 deletions
diff --git a/templates/part.content.php b/templates/part.content.php index fd1155b1..9a9fec36 100644 --- a/templates/part.content.php +++ b/templates/part.content.php @@ -55,14 +55,24 @@ style( ); ?>" alt="<?php p($l->t('File list')); ?>"/> </div> <div id="sort-date-button" class="button sorting right-switch-button"> - <img class="svg" src="<?php print_unescaped( - image_path($_['appName'], 'dateasc.svg') - ); ?>" alt="<?php p($l->t('Sort by date')); ?>"/> + <div class="flipper"> + <img class="svg asc front" src="<?php print_unescaped( + image_path($_['appName'], 'dateasc.svg') + ); ?>" alt="<?php p($l->t('Sort by date')); ?>"/> + <img class="svg des back" src="<?php print_unescaped( + image_path($_['appName'], 'datedes.svg') + ); ?>" alt="<?php p($l->t('Sort by date')); ?>"/> + </div> </div> <div id="sort-name-button" class="button sorting left-switch-button"> - <img class="svg" src="<?php print_unescaped( - image_path($_['appName'], 'nameasc.svg') - ); ?>" alt="<?php p($l->t('Sort by name')); ?>"/> + <div class="flipper"> + <img class="svg asc front" src="<?php print_unescaped( + image_path($_['appName'], 'nameasc.svg') + ); ?>" alt="<?php p($l->t('Sort by name')); ?>"/> + <img class="svg des back" src="<?php print_unescaped( + image_path($_['appName'], 'namedes.svg') + ); ?>" alt="<?php p($l->t('Sort by name')); ?>"/> + </div> </div> <span class="right"> <div id="album-info-button" class="button"> diff --git a/templates/public.php b/templates/public.php index 728be169..3da03e98 100644 --- a/templates/public.php +++ b/templates/public.php @@ -117,14 +117,24 @@ style( ); ?>" alt="<?php p($l->t('File list')); ?>"/> </div> <div id="sort-date-button" class="button sorting right-switch-button"> - <img class="svg" src="<?php print_unescaped( - image_path($_['appName'], 'dateasc.svg') - ); ?>" alt="<?php p($l->t('Sort by date')); ?>"/> + <div class="flipper"> + <img class="svg asc front" src="<?php print_unescaped( + image_path($_['appName'], 'dateasc.svg') + ); ?>" alt="<?php p($l->t('Sort by date')); ?>"/> + <img class="svg des back" src="<?php print_unescaped( + image_path($_['appName'], 'datedes.svg') + ); ?>" alt="<?php p($l->t('Sort by date')); ?>"/> + </div> </div> <div id="sort-name-button" class="button sorting left-switch-button"> - <img class="svg" src="<?php print_unescaped( - image_path($_['appName'], 'nameasc.svg') - ); ?>" alt="<?php p($l->t('Sort by name')); ?>"/> + <div class="flipper"> + <img class="svg asc front" src="<?php print_unescaped( + image_path($_['appName'], 'nameasc.svg') + ); ?>" alt="<?php p($l->t('Sort by name')); ?>"/> + <img class="svg des back" src="<?php print_unescaped( + image_path($_['appName'], 'namedes.svg') + ); ?>" alt="<?php p($l->t('Sort by name')); ?>"/> + </div> </div> <span class="right"> <div id="album-info-button" class="button"> |