Sorting on the left, the rest on the right

2 files changed, 44 insertions, 46 deletions

diff --git a/css/gallerybutton.css b/css/gallerybutton.css
index daa1a5be..5e77db86 100644
--- a/css/gallerybutton.css
+++ b/css/gallerybutton.css
@@ -1,4 +1,7 @@
 /* Gallery buttons design  */
+#controls .left {
+	float: left;
+}
 
 #controls .button.view-switcher {
 	float: right;
@@ -31,6 +34,7 @@
 	border-radius: 0 3px 3px 0;
 }
 
+#share-button img,
 .button.left-switch-button img,
 .button.right-switch-button img {
 	vertical-align: -3px;
@@ -59,15 +63,6 @@
 	color: #111;
 }
 
-#share-button img,
-.button.left-switch-button img,
-.button.right-switch-button img {
-	vertical-align: -3px;
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
-	filter: alpha(opacity=60);
-	opacity: 0.6;
-}
-
 /* Original Flip CSS by David Walsh
 http://davidwalsh.name/css-flip*/
 
diff --git a/templates/part.content.php b/templates/part.content.php
index 9a9fec36..5df15dec 100644
--- a/templates/part.content.php
+++ b/templates/part.content.php
@@ -43,47 +43,32 @@ style(
 ?>
 <div id="controls">
 	<div id='breadcrumbs'></div>
-	<!-- toggle for opening the current album as file list -->
-	<div class="button view-switcher right-switch-button disabled-button">
-		<img class="svg" src="<?php print_unescaped(
-			image_path('core', 'actions/toggle-pictures.svg')
-		); ?>" alt="<?php p($l->t('Picture view')); ?>"/>
-	</div>
-	<div id="filelist-button" class="button view-switcher left-switch-button inactive-button">
-		<img class="svg" src="<?php print_unescaped(
-			image_path('core', 'actions/toggle-filelist.svg')
-		); ?>" alt="<?php p($l->t('File list')); ?>"/>
-	</div>
-	<div id="sort-date-button" class="button sorting right-switch-button">
-		<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')); ?>"/>
+	<!-- sorting buttons -->
+	<div class="left">
+		<div id="sort-date-button" class="button sorting right-switch-button">
+			<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>
-	<div id="sort-name-button" class="button sorting left-switch-button">
-		<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 id="sort-name-button" class="button sorting left-switch-button">
+			<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>
 	</div>
+	<!-- toggle for opening the current album as file list -->
 	<span class="right">
-		<div id="album-info-button" class="button">
-			<span class="ribbon black"></span>
-			<img class="svg" src="<?php print_unescaped(
-				image_path('core', 'actions/info.svg')
-			); ?>" alt="<?php p($l->t('Album information')); ?>"/>
-		</div>
-		<div class="album-info-content markdown-body"></div>
-	</span>
-	<span class="right">
+		<!-- sharing button -->
 		<div id="share-button" class="button">
 			<img class="svg" src="<?php print_unescaped(
 				image_path('core', 'actions/share.svg')
@@ -92,6 +77,24 @@ style(
 		<a class="share" data-item-type="folder" data-item=""
 		   title="<?php p($l->t("Share")); ?>"
 		   data-possible-permissions="31"></a>
+		<!-- info button -->
+		<div id="album-info-button" class="button">
+			<span class="ribbon black"></span>
+			<img class="svg" src="<?php print_unescaped(
+				image_path('core', 'actions/info.svg')
+			); ?>" alt="<?php p($l->t('Album information')); ?>"/>
+		</div>
+		<div class="album-info-content markdown-body"></div>
+	<div class="button view-switcher right-switch-button disabled-button">
+		<img class="svg" src="<?php print_unescaped(
+			image_path('core', 'actions/toggle-pictures.svg')
+		); ?>" alt="<?php p($l->t('Picture view')); ?>"/>
+	</div>
+	<div id="filelist-button" class="button view-switcher left-switch-button inactive-button">
+		<img class="svg" src="<?php print_unescaped(
+			image_path('core', 'actions/toggle-filelist.svg')
+		); ?>" alt="<?php p($l->t('File list')); ?>"/>
+	</div>
 	</span>
 </div>
 <div id="gallery" class="hascontrols"></div>