rounded : better folder names

config.php

@@ -19,8 +19,8 @@ Please enjoy this free script!
 $thumbs_pr_page 		= "39"; //Number of thumbnails on a single page
 $gallery_width 			= "80%"; //Gallery width. Eg: "500px" or "70%"
 $backgroundcolor 		= "white"; //This provides a quick way to change your gallerys background to suit your website. Use either main colors like "black", "white", "yellow" etc. Or HEX colors, eg. "#AAAAAA"
-$templatefile 			= "squares"; //Template filename (must be placed in 'templates' folder)
+$templatefile 			= "rounded"; //Template filename (must be placed in 'templates' folder)
-$title 					= "MiniGal Nano test gallery"; // Text to be displayed in browser titlebar
+$title 					= "MiniBoardNano gallery"; // Text to be displayed in browser titlebar
 $author					= "John Doe";
 $folder_color 			= "black"; // Color of folder icons: blue / black / vista / purple / green / grey
 $sorting_folders		= "name"; // Sort folders by: [name][date]
@@ -39,5 +39,5 @@ $label_loading 			= "Loading..."; //Thumbnail loading text
 //ADVANCED SETTINGS
 $thumb_size 			= 320; //Thumbnail height/width (square thumbs). Changing this will most likely require manual altering of the template file to make it look properly! 
 $label_max_length 		= 40; //Maximum chars of a folder name that will be displayed on the folder thumbnail  
-$display_exif			= 0;
+$display_exif			= 0; //Take care, even if not diplayed EXIF are still readable for visitors. May be a good idea to erase EXIF datas...
 ?>

templates/rounded.html

@@ -12,110 +12,156 @@
 		<link rel="stylesheet" href="<% gallery_root %>css/mediaboxAdvWhite.css" type="text/css" media="screen" />
 
 	<style type="text/css">
-		html{
+html {
-			font-size: 62.5%;
+	font-size:62.5%;
-		}
+}
-		.clear{clear:both;}
-		body {
-			margin: 0;
-			padding: 0;
-			width: 100%;
-			font-size: 1.5rem;
-			font-family:Helvetica, Arial, sans-serif;
-			background: #3B3A37;
-			color: #FFF;
-		}
 
-		a {
+.clear {
-			color: #FFF;
+	clear:both;
-			font-weight: bold;
+}
-			text-decoration: none;
-		}
-		h1 {
-			font-family: Georgia, Lucida, serif;
-			font-style: italic;
-			margin: 20px 0 0 0;
 
-		}
+body {
-		h1 a{
+	width:100%;
-			color: #E63D24;	
+	margin:0;
-		}	
+	padding:0;
+	font-family:Helvetica,Arial,sans-serif;
+	font-size:1.5rem;
+	color:#FFF;
+	background:#3B3A37;
+}
 
-		body > header{
+a {
-			text-align: center;
+	text-decoration:none;
-			padding: 1px;
+	font-weight:bold;
-			margin-bottom: 15px;
+	color:#FFF;
-		}
+}
-		#container, #innerheader{
+
-			max-width: <% gallery_width %>;
+h1 {
-			margin: 0px auto;
+	margin:20px 0 0;
-		}
+	font-family:Georgia,Lucida,serif;
-		img {
+	font-style:italic;
-			border: none;
+}
-		}
+
-		nav {
+h1 a {
-			font-size: 1.3em;
+	color:#E63D24;
-			padding: 15px 0px;
+}
-		}
+
-		body > nav {
+body > header {
-			text-align: center;
+	margin-bottom:15px;
-		}
+	padding:1px;
-		#folder_comment
+	text-align:center;
-		{
+}
+
+#container,
+#innerheader {
+	margin:0 auto;
+	max-width:<% gallery_width %>;
+}
+
+img {
+	border:none;
+}
+
+nav {
+	padding:15px 0;
+	font-size:1.3em;
+}
+
+body > nav {
+	text-align:center;
+}
+
+#folder_comment {
 	margin-bottom:10px;
-		}
+}
-		#folder_comment a {
-			color: #FFCC11;
-			text-decoration: none;
-		}
 
-		#gallery {
+#folder_comment a {
-			list-style: none;
+	text-decoration:none;
-			margin: 0;
+	color:#FFCC11;
-			padding: 0;
+}
-		}
+
-		#gallery li, #gallery li img {
+#gallery {
-			border-radius: 4px;
+	margin:0;
-		}
+	padding:0;
-		#gallery li {
+	list-style:none;
-			float: left;
+}
-			position: relative;
+
-			margin: .5%;
+#gallery li,
-		}
+#gallery li img {
-		#gallery li img{
+	border-radius:4px;
-			width: 86%;
+}
-			margin: 0% 7%; 
+
+#gallery li {
+	float:left;
+	position:relative;
+	margin:.5%;
+}
+
+#gallery li img {
+	width:100%;
 	border-radius:100%;
-			-webkit-box-shadow:  0px 0px 2px -1px #000;
+	-webkit-box-shadow:0 0 2px -1px #000;
-			box-shadow:  0px 0px 2px -1px #000;
+	box-shadow:0 0 2px -1px #000;
-		}
+}
-		#gallery li:hover img {
 
-			-webkit-transition: all .3s ease;
+#gallery li:hover img {
-			-moz-transition: all .3s ease;
+	-webkit-box-shadow:0 0 5px 0 #000;
-			-ms-transition: all .3s ease;
+	box-shadow:0 0 5px 0 #000;
-			-o-transition: all .3s ease;
+	-webkit-transition:all .3s ease;
-			transition: all .3s ease;
+	-moz-transition:all .3s ease;
-			-webkit-box-shadow:  0px 0px 5px 0px #000;
+	-ms-transition:all .3s ease;
-			box-shadow:  0px 0px 5px 0px #000;
+	-o-transition:all .3s ease;
-		}
+	transition:all .3s ease;
-		#gallery em {
+}
-			text-align: center;
+
-			font-style: normal;
+#gallery em,
-			padding: 8px 0px;
+#gallery li:hover em {
-			display: block;
+	-webkit-transition:all .2s ease-in;
-			position: absolute;
+	-moz-transition:all .2s ease-in;
-			bottom:0px;
+	-ms-transition:all .2s ease-in;
-			width: 100%;
+	-o-transition:all .2s ease-in;
-		}
+	transition:all .2s ease-in;
-		footer {
+}
-			margin: 25px 0px;
+
-			text-align: center;
+#gallery em {
-		}
+	position:absolute;
-		footer a {
+	top:0;
-			text-decoration: none;
+	bottom:0;
-			color: #666;
+	zoom:1;
-		}
+	width:100%;
+	padding:40% 0;
+	border-radius:100%;
+	text-align:center;
+	font-family:Georgia,Lucida,serif;
+	font-size:2.5rem;
+	font-style:italic;
+	color:#FFF;
+	opacity:0;
+	background:rgba(0,0,0,.9);
+	filter:alpha(opacity=0);
+}
+
+#gallery li:hover em {
+	zoom:1;
+	opacity:1;
+	filter:alpha(opacity=1);
+}
+
+#gallery li:hover img {
+	zoom:1;
+	opacity:0;
+	filter:alpha(opacity=0);
+}
+
+footer {
+	margin:25px 0;
+	text-align:center;
+}
+
+footer a {
+	text-decoration:none;
+	color:#666;
+}
 
 		/*----responsive----*/
 		#gallery li {