From 481cff0f60cd31b2685b8ba11f91ce422c4e5d50 Mon Sep 17 00:00:00 2001
From: Dmitriy Novash <novashdima@gmail.com>
Date: Fri, 3 Jul 2020 11:20:51 +0300
Subject: [PATCH 1/7] Fix bug with adding subdirectories to archive

---
 src/ifmarchive.php | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/ifmarchive.php b/src/ifmarchive.php
index 2140606..b8e0871 100644
--- a/src/ifmarchive.php
+++ b/src/ifmarchive.php
@@ -32,14 +32,15 @@ class IFMArchive {
 			if ($f != '.' && $f != '..') {
 				$filePath = $folder . '/' . $f;
 				if (file_exists($filePath) && is_readable($filePath))
-					if (is_file($filePath))
+					if (is_file($filePath)) {
 						if (!is_callable($exclude_callback) || $exclude_callback($f))
 							$archive->addFile( $filePath, substr( $filePath, $offset ) );
-					elseif (is_dir($filePath))
+					} elseif (is_dir($filePath)) {
 						if (is_callable($exclude_callback))
 							self::addFolder($archive, $filePath, $offset, $exclude_callback);
 						else
 							self::addFolder($archive, $filePath, $offset);
+					}
 			}
 		}
 		closedir($handle);
@@ -55,7 +56,7 @@ class IFMArchive {
 		if (!is_array($src))
 			$src = array($src);
 
-		file_put_contents("debug.ifm.log", var_export(is_callable($exclude_callback), true)."\n");
+		//file_put_contents("debug.ifm.log", var_export(is_callable($exclude_callback), true)."\n");
 
 		foreach ($src as $s)
 			if (is_dir($s))

From 3636b75d4af736043761aaf513573b3a251410e2 Mon Sep 17 00:00:00 2001
From: Anton Baranov <cryol@cryol.kiev.ua>
Date: Fri, 3 Jul 2020 12:24:53 +0300
Subject: [PATCH 2/7] Update compiler.php

---
 compiler.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/compiler.php b/compiler.php
index ea05a30..6101364 100755
--- a/compiler.php
+++ b/compiler.php
@@ -10,7 +10,7 @@ chdir( realpath( dirname( __FILE__ ) ) );
 
 // output files and common attrs
 define( "IFM_CDN",           true );
-define( "IFM_VERSION",       "<a href='https://github.com/misterunknown/ifm/tree/cryol-2.6.1' target=_blank>v2.6.1</a>" );
+define( "IFM_VERSION",       "<a href='https://github.com/misterunknown/ifm/tree/v2.6.1' target=_blank>v2.6.1</a>" );
 define( "IFM_RELEASE_DIR",   "dist/");
 define( "IFM_STANDALONE",    "ifm.php" );
 define( "IFM_STANDALONE_GZ", "ifm.min.php" );

From ffd00b450322a5b7d29c0ee3afa86cbb3ad0baf6 Mon Sep 17 00:00:00 2001
From: Anton Baranov <cryol@cryol.kiev.ua>
Date: Fri, 3 Jul 2020 12:28:56 +0300
Subject: [PATCH 3/7] Update compiler.php

---
 compiler.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/compiler.php b/compiler.php
index 6101364..398c4e8 100755
--- a/compiler.php
+++ b/compiler.php
@@ -9,7 +9,7 @@
 chdir( realpath( dirname( __FILE__ ) ) );
 
 // output files and common attrs
-define( "IFM_CDN",           true );
+define( "IFM_CDN",           false );
 define( "IFM_VERSION",       "<a href='https://github.com/misterunknown/ifm/tree/v2.6.1' target=_blank>v2.6.1</a>" );
 define( "IFM_RELEASE_DIR",   "dist/");
 define( "IFM_STANDALONE",    "ifm.php" );

From 11e3314ea1eead41bccaa6a02328875f68385288 Mon Sep 17 00:00:00 2001
From: Dmitriy Novash <novashdima@gmail.com>
Date: Wed, 8 Jul 2020 15:02:39 +0300
Subject: [PATCH 4/7] Add svg to images

---
 src/main.php | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/main.php b/src/main.php
index 6dd90c0..fb9e175 100644
--- a/src/main.php
+++ b/src/main.php
@@ -1178,7 +1178,7 @@ IFM_ASSETS
 		$type = strtolower($type);
 		switch( $type ) {
 			case "aac":	case "aiff": case "mid": case "mp3": case "wav": return 'icon icon-file-audio'; break;
-			case "ai": case "bmp": case "eps": case "tiff": case "gif": case "jpg": case "jpeg": case "png": case "psd": return 'icon icon-file-image'; break;
+			case "ai": case "bmp": case "eps": case "tiff": case "gif": case "jpg": case "jpeg": case "png": case "psd": case "svg": return 'icon icon-file-image'; break;
 			case "avi": case "flv": case "mp4": case "mpg": case "mkv": case "mpeg": case "webm": case "wmv": case "mov": return 'icon icon-file-video'; break;
 			case "c": case "cpp": case "css": case "dat": case "h": case "html": case "java": case "js": case "php": case "py": case "sql": case "xml": case "yml": return 'icon icon-file-code'; break;
 			case "doc": case "docx": case "odf": case "odt": case "rtf": return 'icon icon-file-word'; break;

From 4e7593cb9f351de3a630daafc5997ff9221efafe Mon Sep 17 00:00:00 2001
From: Dmitriy Novash <novashdima@gmail.com>
Date: Wed, 8 Jul 2020 15:03:31 +0300
Subject: [PATCH 5/7] Add background to popover for image with transparent
 background

---
 src/style.css | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/style.css b/src/style.css
index c8cc36e..85eb32a 100644
--- a/src/style.css
+++ b/src/style.css
@@ -6,7 +6,11 @@ body {
 a { cursor: pointer !important; }
 a.ifmitem:focus { outline: 0 }
 
-img.imgpreview { max-width: 100%; }
+img.imgpreview {
+    max-width: 100%;
+    background-repeat: repeat repeat;
+    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAAAAACoWZBhAAABI2lDQ1BJQ0MgcHJvZmlsZQAAKJGdkLFKw1AUhr9UsaXYSXEQhwyuBRHM5FIVgqAQYwWrU5qkWExiSFKKb+Cb6MN0EASfwCdQcPa/0cHBLF44/B+Hc/7/3gstOwnTcnkH0qwqXH8wuhxd2e032nTosksvCMt84HknNJ7PVyyjL33j1Tz351mJ4jKULlRZmBcVWPtiZ17lhlWs3w79Q/GD2I7SLBI/ibejNDJsdv00mYU/nuY2q3F2cW76qi1cjjnFw2bMjCkJFX1pps4RDntSl4KAe0pCaUKs3lwzFTeiUk4uB6KhSLdpyNus8zyljOUxlZdJuCOVp8nD/O/32sdZvWltLPKgCOrWkqo1mcD7I/RGsPYM3euGrM7vtzXMOPXMP9/4BdaxUFxWskm6AAAAAmJLR0QAy6Y7OAoAAAAJcEhZcwAALiMAAC4jAXilP3YAAAAiSURBVAjXY/zPwMDAcIaBgYGBiQEOCDJZzjAwMDCYkKoNAPmXAuEuYku0AAAAAElFTkSuQmCC");
+}
 
 div#content { width: 100%; height: 350px; } /* is for the ACE editor */
 

From ac0708ce0127fba0641777745e7a32411772793c Mon Sep 17 00:00:00 2001
From: Dmitriy Novash <novashdima@gmail.com>
Date: Wed, 8 Jul 2020 15:42:58 +0300
Subject: [PATCH 6/7] Add icons for "txt" "log" "json"

---
 src/main.php | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/main.php b/src/main.php
index fb9e175..42f11a9 100644
--- a/src/main.php
+++ b/src/main.php
@@ -1180,8 +1180,9 @@ IFM_ASSETS
 			case "aac":	case "aiff": case "mid": case "mp3": case "wav": return 'icon icon-file-audio'; break;
 			case "ai": case "bmp": case "eps": case "tiff": case "gif": case "jpg": case "jpeg": case "png": case "psd": case "svg": return 'icon icon-file-image'; break;
 			case "avi": case "flv": case "mp4": case "mpg": case "mkv": case "mpeg": case "webm": case "wmv": case "mov": return 'icon icon-file-video'; break;
-			case "c": case "cpp": case "css": case "dat": case "h": case "html": case "java": case "js": case "php": case "py": case "sql": case "xml": case "yml": return 'icon icon-file-code'; break;
+			case "c": case "cpp": case "css": case "dat": case "h": case "html": case "java": case "js": case "php": case "py": case "sql": case "xml": case "yml": case "json": return 'icon icon-file-code'; break;
 			case "doc": case "docx": case "odf": case "odt": case "rtf": return 'icon icon-file-word'; break;
+			case "txt": case "log": return 'icon icon-doc-text'; break;
 			case "ods": case "xls": case "xlsx": return 'icon icon-file-excel'; break;
 			case "odp": case "ppt": case "pptx": return 'icon icon-file-powerpoint'; break;
 			case "pdf": return 'icon icon-file-pdf'; break;

From 538e249aec0000ea2d9e468d373cbccfe525fa33 Mon Sep 17 00:00:00 2001
From: Anton Baranov <cryol@cryol.kiev.ua>
Date: Fri, 10 Jul 2020 05:34:00 +0300
Subject: [PATCH 7/7] Fixed auth error view, rewrite modals

---
 .gitattributes                              |   9 -
 compiler.php                                |   2 +-
 src/i18n/ru.json                            |   2 +-
 src/ifm.js                                  |   2 +
 src/ifmarchive.php                          |   7 +-
 src/main.php                                |  48 ++---
 src/style.css                               | 152 +++++++--------
 src/templates/app.html                      | 204 ++++++++++----------
 src/templates/login.html                    |   3 +
 src/templates/modal.ajaxrequest.html        |  35 +++-
 src/templates/modal.copymove.html           |   8 +-
 src/templates/modal.createarchive.html      |  10 +-
 src/templates/modal.createdir.html          |  10 +-
 src/templates/modal.extractfile.html        |  42 ++--
 src/templates/modal.file.html               |  14 +-
 src/templates/modal.file_editoroptions.html |  60 +++---
 src/templates/modal.remoteupload.html       |  29 ++-
 src/templates/modal.renamefile.html         |   8 +-
 src/templates/modal.search.html             |   6 +-
 src/templates/modal.uploadfile.html         |  18 +-
 20 files changed, 364 insertions(+), 305 deletions(-)
 delete mode 100644 .gitattributes

diff --git a/.gitattributes b/.gitattributes
deleted file mode 100644
index 9b00969..0000000
--- a/.gitattributes
+++ /dev/null
@@ -1,9 +0,0 @@
-dist/ifm.php        -diff
-dist/ifm.min.php    -diff
-dist/*              -diff
-src/includes/ace.js	-diff
-
-src             export-ignore
-compiler.php    export-ignore
-.gitignore      export-ignore
-.gitattributes  export-ignore
diff --git a/compiler.php b/compiler.php
index 398c4e8..c93547e 100755
--- a/compiler.php
+++ b/compiler.php
@@ -10,7 +10,7 @@ chdir( realpath( dirname( __FILE__ ) ) );
 
 // output files and common attrs
 define( "IFM_CDN",           false );
-define( "IFM_VERSION",       "<a href='https://github.com/misterunknown/ifm/tree/v2.6.1' target=_blank>v2.6.1</a>" );
+define( "IFM_VERSION",       "v2.6.2" );
 define( "IFM_RELEASE_DIR",   "dist/");
 define( "IFM_STANDALONE",    "ifm.php" );
 define( "IFM_STANDALONE_GZ", "ifm.min.php" );
diff --git a/src/i18n/ru.json b/src/i18n/ru.json
index f269c7d..b5b0756 100644
--- a/src/i18n/ru.json
+++ b/src/i18n/ru.json
@@ -101,7 +101,7 @@
     "toggle_nav": "Переключить вид",
     "upload": "Загрузить",
     "upload_drop": "Перетащите файлы для загрузки",
-    "upload_file": "Загрузить файла",
+    "upload_file": "Загрузить файл",
     "upload_remote": "Удаленная загрузка",
     "upload_remote_url": "Удаленная загрузка по URL",
     "username": "Имя пользователя",
diff --git a/src/ifm.js b/src/ifm.js
index d284552..0064d9f 100644
--- a/src/ifm.js
+++ b/src/ifm.js
@@ -1394,9 +1394,11 @@ function IFM(params) {
 					if( newFooter.style.maxHeight == '80%' ) {
 						newFooter.style.maxHeight = '6em';
 						newFooter.style.overflow = 'hidden';
+						newFooter.hidden = true;
 					} else {
 						newFooter.style.maxHeight = '80%';
 						newFooter.style.overflow = 'scroll';
+						newFooter.hidden = false;
 					}
 				}
 			});
diff --git a/src/ifmarchive.php b/src/ifmarchive.php
index b8e0871..2140606 100644
--- a/src/ifmarchive.php
+++ b/src/ifmarchive.php
@@ -32,15 +32,14 @@ class IFMArchive {
 			if ($f != '.' && $f != '..') {
 				$filePath = $folder . '/' . $f;
 				if (file_exists($filePath) && is_readable($filePath))
-					if (is_file($filePath)) {
+					if (is_file($filePath))
 						if (!is_callable($exclude_callback) || $exclude_callback($f))
 							$archive->addFile( $filePath, substr( $filePath, $offset ) );
-					} elseif (is_dir($filePath)) {
+					elseif (is_dir($filePath))
 						if (is_callable($exclude_callback))
 							self::addFolder($archive, $filePath, $offset, $exclude_callback);
 						else
 							self::addFolder($archive, $filePath, $offset);
-					}
 			}
 		}
 		closedir($handle);
@@ -56,7 +55,7 @@ class IFMArchive {
 		if (!is_array($src))
 			$src = array($src);
 
-		//file_put_contents("debug.ifm.log", var_export(is_callable($exclude_callback), true)."\n");
+		file_put_contents("debug.ifm.log", var_export(is_callable($exclude_callback), true)."\n");
 
 		foreach ($src as $s)
 			if (is_dir($s))
diff --git a/src/main.php b/src/main.php
index 42f11a9..c2e7da7 100644
--- a/src/main.php
+++ b/src/main.php
@@ -62,7 +62,7 @@ class IFM {
 	private $config = array();
 	private $templates = array();
 	private $i18n = array();
-	public $mode = "";
+	public $mode = "standalone";
 
 	public function __construct( $config=array() ) {
 
@@ -218,7 +218,7 @@ IFM_ASSETS
 				<title>IFM - improved file manager</title>
 				<meta charset="utf-8">
 				<meta http-equiv="X-UA-Compatible" content="IE=edge">
-				<meta name="viewport" content="width=device-width, initial-scale=1">';
+				<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">';
 		$this->getCSS();
 		print '</head><body>';
 	}
@@ -994,13 +994,16 @@ IFM_ASSETS
 
 		if( ! isset( $_SESSION['ifmauth'] ) || $_SESSION['ifmauth'] !== true ) {
 			$login_failed = false;
+			$login_message = "";
 			if( isset( $_POST["inputLogin"] ) && isset( $_POST["inputPassword"] ) ) {
-				if( $this->checkCredentials( $_POST["inputLogin"], $_POST["inputPassword"] ) ) {
+				$state = $this->checkCredentials( $_POST["inputLogin"], $_POST["inputPassword"] );
+				if($state['status']) {
 					$_SESSION['ifmauth'] = true;
 				}
 				else {
 					$_SESSION['ifmauth'] = false;
 					$login_failed = true;
+					$login_message = $state['message'];
 				}
 			}
 
@@ -1013,7 +1016,7 @@ IFM_ASSETS
 					else
 						$this->jsonResponse( array( "status"=>"ERROR", "message"=>"not authenticated" ) );
 				} else {
-					$this->loginForm($login_failed);
+					$this->loginForm($login_failed, $login_message);
 				}
 				return false;
 			}
@@ -1023,6 +1026,7 @@ IFM_ASSETS
 	}
 
 	private function checkCredentials( $user, $pass ) {
+		$authenticated = array("status" => false, "message" =>  "");
 		list( $src, $srcopt ) = explode( ";", $this->config['auth_source'], 2 );
 		switch( $src ) {
 			case "inline":
@@ -1035,12 +1039,11 @@ IFM_ASSETS
 					$htpasswd = new Htpasswd( $srcopt );
 					return $htpasswd->verify( $user, $pass );
 				} else {
-					trigger_error( "IFM: Fatal: Credential file does not exist or is not readable" );
-					return false;
+					// trigger_error( "IFM: Fatal: Credential file does not exist or is not readable" );
+					return $authenticated;
 				}
 				break;
 			case "ldap":
-				$authenticated = false;
 				$ldapopts = explode( ";", $srcopt );
 				if( count( $ldapopts ) === 3 ) {
 					list( $ldap_server, $rootdn, $ufilter ) = explode( ";", $srcopt );
@@ -1050,8 +1053,8 @@ IFM_ASSETS
 				}
 				$u = "uid=" . $user . "," . $rootdn;
 				if( ! $ds = ldap_connect( $ldap_server ) ) {
-					trigger_error( "Could not reach the ldap server.", E_USER_ERROR );
-					return false;
+					$authenticated['status'] = false;
+					$authenticated['message'] = "Could not reach the ldap server.";
 				}
 				ldap_set_option( $ds, LDAP_OPT_PROTOCOL_VERSION, 3 );
 				if( $ds ) {
@@ -1059,31 +1062,32 @@ IFM_ASSETS
 					if( $ldbind ) {
 						if( $ufilter ) {
 							if( ldap_count_entries( $ds, ldap_search( $ds, $rootdn, $ufilter ) ) > 0 ){
-								$authenticated = true;
+								$authenticated['status'] = true;
 							} else {
-								trigger_error( "User not allowed.", E_USER_ERROR );
-								$authenticated = false;
+								$authenticated['status'] = false;
+								$authenticated['message'] = "User not allowed.";
 							}
 						} else {
-							$authenticated = true;
+							$authenticated['status'] = true;
 						}
 					} else {
-						trigger_error( ldap_error( $ds ), E_USER_ERROR );
-						$authenticated = false;
+						$authenticated['status'] = false;
+						$authenticated['message'] = ldap_error( $ds );
 					}
 					ldap_unbind( $ds );
-				} else
-					$authenticated = false;
+				} else {
+					$authenticated['status'] = false;
+				}					
 				return $authenticated;
 				break;
 		}
-		return false;
+		return $authenticated;
 	}
 
-	private function loginForm($loginFailed=false) {
+	private function loginForm($loginFailed=false, $loginMessage) {
 		$err = "";
 		if( $loginFailed ) 
-			$err = '<div class="alert alert-primary" role="alert">'.$this->l['login_failed'].'</div>';
+			$err = '<div class="alert alert-danger" role="alert">'.$loginMessage.'</div>';
 		$this->getHTMLHeader();
 		$html = str_replace( "{{error}}", $err, $this->templates['login'] );
 		$html = str_replace( "{{i18n.username}}", $this->l['username'], $html );
@@ -1177,7 +1181,7 @@ IFM_ASSETS
 	private function getTypeIcon( $type ) {
 		$type = strtolower($type);
 		switch( $type ) {
-			case "aac":	case "aiff": case "mid": case "mp3": case "wav": return 'icon icon-file-audio'; break;
+			case "aac": case "aiff": case "mid": case "mp3": case "wav": return 'icon icon-file-audio'; break;
 			case "ai": case "bmp": case "eps": case "tiff": case "gif": case "jpg": case "jpeg": case "png": case "psd": case "svg": return 'icon icon-file-image'; break;
 			case "avi": case "flv": case "mp4": case "mpg": case "mkv": case "mpeg": case "webm": case "wmv": case "mov": return 'icon icon-file-video'; break;
 			case "c": case "cpp": case "css": case "dat": case "h": case "html": case "java": case "js": case "php": case "py": case "sql": case "xml": case "yml": case "json": return 'icon icon-file-code'; break;
@@ -1186,7 +1190,7 @@ IFM_ASSETS
 			case "ods": case "xls": case "xlsx": return 'icon icon-file-excel'; break;
 			case "odp": case "ppt": case "pptx": return 'icon icon-file-powerpoint'; break;
 			case "pdf": return 'icon icon-file-pdf'; break;
-			case "tgz":	case "zip": case "tar": case "tgz": case "tar.gz": case "tar.xz": case "tar.bz2": case "7z": case "rar": return 'icon icon-file-archive';
+			case "tgz": case "zip": case "tar": case "tgz": case "tar.gz": case "tar.xz": case "tar.bz2": case "7z": case "rar": return 'icon icon-file-archive';
 			default: return 'icon icon-doc';
 		}
 	}
diff --git a/src/style.css b/src/style.css
index 85eb32a..b65ba31 100644
--- a/src/style.css
+++ b/src/style.css
@@ -1,63 +1,63 @@
 body {
-    padding-top: 70px;
-    overflow-y: scroll !important;
+	padding-top: 70px;
+	overflow-y: scroll !important;
 }
 
 a { cursor: pointer !important; }
 a.ifmitem:focus { outline: 0 }
 
 img.imgpreview {
-    max-width: 100%;
-    background-repeat: repeat repeat;
-    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAAAAACoWZBhAAABI2lDQ1BJQ0MgcHJvZmlsZQAAKJGdkLFKw1AUhr9UsaXYSXEQhwyuBRHM5FIVgqAQYwWrU5qkWExiSFKKb+Cb6MN0EASfwCdQcPa/0cHBLF44/B+Hc/7/3gstOwnTcnkH0qwqXH8wuhxd2e032nTosksvCMt84HknNJ7PVyyjL33j1Tz351mJ4jKULlRZmBcVWPtiZ17lhlWs3w79Q/GD2I7SLBI/ibejNDJsdv00mYU/nuY2q3F2cW76qi1cjjnFw2bMjCkJFX1pps4RDntSl4KAe0pCaUKs3lwzFTeiUk4uB6KhSLdpyNus8zyljOUxlZdJuCOVp8nD/O/32sdZvWltLPKgCOrWkqo1mcD7I/RGsPYM3euGrM7vtzXMOPXMP9/4BdaxUFxWskm6AAAAAmJLR0QAy6Y7OAoAAAAJcEhZcwAALiMAAC4jAXilP3YAAAAiSURBVAjXY/zPwMDAcIaBgYGBiQEOCDJZzjAwMDCYkKoNAPmXAuEuYku0AAAAAElFTkSuQmCC");
+	max-width: 100%;
+	background-repeat: repeat repeat;
+	background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAAAAACoWZBhAAABI2lDQ1BJQ0MgcHJvZmlsZQAAKJGdkLFKw1AUhr9UsaXYSXEQhwyuBRHM5FIVgqAQYwWrU5qkWExiSFKKb+Cb6MN0EASfwCdQcPa/0cHBLF44/B+Hc/7/3gstOwnTcnkH0qwqXH8wuhxd2e032nTosksvCMt84HknNJ7PVyyjL33j1Tz351mJ4jKULlRZmBcVWPtiZ17lhlWs3w79Q/GD2I7SLBI/ibejNDJsdv00mYU/nuY2q3F2cW76qi1cjjnFw2bMjCkJFX1pps4RDntSl4KAe0pCaUKs3lwzFTeiUk4uB6KhSLdpyNus8zyljOUxlZdJuCOVp8nD/O/32sdZvWltLPKgCOrWkqo1mcD7I/RGsPYM3euGrM7vtzXMOPXMP9/4BdaxUFxWskm6AAAAAmJLR0QAy6Y7OAoAAAAJcEhZcwAALiMAAC4jAXilP3YAAAAiSURBVAjXY/zPwMDAcIaBgYGBiQEOCDJZzjAwMDCYkKoNAPmXAuEuYku0AAAAAElFTkSuQmCC");
 }
 
 div#content { width: 100%; height: 350px; } /* is for the ACE editor */
 
 label {
-    display: inline-block;
-    margin-bottom: .5rem;
-    font-weight: 700;
+	display: inline-block;
+	margin-bottom: .5rem;
+	font-weight: 700;
 }
 
 /* Make tables more compact (overwrites bootstrap default of 0.75rem) */
 .table td, .table th {
-    padding: 0.25rem;
+	padding: 0.25rem;
 }
 
 /* narrow navbar */
 .navbar {
-    padding: 0.3rem;
+	padding: 0.3rem;
 }
 
 /*
  * Icon size
  */
 .icon {
-    font-size: 14pt;
+	font-size: 14pt;
 }
 @media (max-width: 768px) {
-    .icon { font-size: 12pt; }
-    #filetable tr th.buttons { min-width: 85px !important; }
+	.icon { font-size: 12pt; }
+	#filetable tr th.buttons { min-width: 85px !important; }
 }
 
 /*
  * Filetable related settings
  */
 #filetable th {
-    border-top: 0;
+	border-top: 0;
 }
 #filetable td:nth-child(5), #filetable th:nth-child(5) {
-    text-align: center;
+	text-align: center;
 }
 #filetable td:nth-child(6), #filetable th:nth-child(6) {
-    text-align: center;
+	text-align: center;
 }
 #filetable tr td:last-child {
-    text-align: right;
+	text-align: right;
 }
 #filetable td:last-child a:hover {
-    text-decoration: none;
+	text-decoration: none;
 }
 .td-permissions { width: 1px; }
 
@@ -80,53 +80,53 @@ div.ifminfo div.panel div.panel-body { padding: 0px !important; text-align:  cen
  * Footer / Task-Queue settings
  */
 footer {
-    position: fixed;
-    padding-top: 1em;
-    border-top: 1px;
-    background-color: #EEE;
-    bottom: 0;
-    width: 100%;
-    max-height: 6em;
-    overflow: hidden;
+	position: fixed;
+	padding-top: 1em;
+	border-top: 1px;
+	background-color: #EEE;
+	bottom: 0;
+	width: 100%;
+	max-height: 6em;
+	overflow: hidden;
 }
 
 #waitqueue .progress {
-    position: relative;
-    margin-bottom: 0;
+	position: relative;
+	margin-bottom: 0;
 }
 #waitqueue .progbarlabel {
-    position:absolute;
-    top: 0;
-    left: 10px;
-    font-weight: bold;
+	position:absolute;
+	top: 0;
+	left: 10px;
+	font-weight: bold;
 }
 
 /*
  * File drop overlay
  */
 #filedropoverlay {
-    display: none;
-    position: fixed;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    text-align: center;
-    color: #FFF;
-    background-color: lightblue;
-    filter: alpha(opacity=70);
-    -moz-opacity: 0.7;
-    opacity: 0.7;
-    z-index: 1000;
+	display: none;
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	text-align: center;
+	color: #FFF;
+	background-color: lightblue;
+	filter: alpha(opacity=70);
+	-moz-opacity: 0.7;
+	opacity: 0.7;
+	z-index: 1000;
 }
 
 #filedropoverlay h1 {
-    border-radius: 5px;
-    color: #000;
-    position:relative;
-    top:50%;
-    font-size: 6em;
-    pointer-events: none;
+	border-radius: 5px;
+	color: #000;
+	position:relative;
+	top:50%;
+	font-size: 6em;
+	pointer-events: none;
 }
 
 
@@ -134,8 +134,8 @@ footer {
  * Datatables related settings
  */
 table.dataTable thead th {
-    position: relative;
-    background-image: none !important;
+	position: relative;
+	background-image: none !important;
 }
 
 /* remove original sort icons */
@@ -144,50 +144,50 @@ table.dataTable thead .sorting_asc:before,
 table.dataTable thead .sorting_desc:before,
 table.dataTable thead .sorting_asc_disabled:before,
 table.dataTable thead .sorting_desc_disabled:before {
-    right: 0 !important;
-    content: "" !important;
+	right: 0 !important;
+	content: "" !important;
 }
 /* custom sort icons */
 table.dataTable thead th.sorting:after,
 table.dataTable thead th.sorting_asc:after,
 table.dataTable thead th.sorting_desc:after {
-    position: absolute;
-    top: 6px;
-    right: 8px;
-    display: block;
-    font-family: fontello;
-    font-size: 0.8em;
-    opacity: 1;
-    color: #000;
+	position: absolute;
+	top: 6px;
+	right: 8px;
+	display: block;
+	font-family: fontello;
+	font-size: 0.8em;
+	opacity: 1;
+	color: #000;
 }
 table.dataTable thead th.sorting:after {
-    content: "\F0DC";
-    color: #ddd;
+	content: "\F0DC";
+	color: #ddd;
 }
 table.dataTable thead th.sorting_asc:after {
-    content: "\f0de";
+	content: "\f0de";
 }
 table.dataTable thead th.sorting_desc:after {
-    content: "\f0dd";
+	content: "\f0dd";
 }
 
 /*
  * Modal related settings
  */
 #copyMoveTree {
-    max-height: 80vh;
-    overflow: auto;
+	max-height: 80vh;
+	overflow: auto;
 }
 
 @media (min-width: 576px) {
-    .modal-dialog {
-        max-width: 600px;
-        margin: 1.75rem auto;
-    }
+	.modal-dialog {
+		max-width: 600px;
+		margin: 1.75rem auto;
+	}
 }
 
 @media (min-width: 992px) {
-    .modal-lg, .modal-xl {
-        max-width: 800px;
-    }
+	.modal-lg, .modal-xl {
+		max-width: 800px;
+	}
 }
diff --git a/src/templates/app.html b/src/templates/app.html
index 92b39db..c59aa8a 100644
--- a/src/templates/app.html
+++ b/src/templates/app.html
@@ -1,108 +1,108 @@
 <nav class="navbar navbar-expand-lg navbar-dark 
-    {{^config.inline}}
-    fixed-top
-    {{/config.inline}} bg-dark">
-    <div class="container">
-    <a class="navbar-brand" href="#">IFM</a>
-    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="true" aria-label="{{i18n.toggle_nav}}">
-        <span class="navbar-toggler-icon"></span>
-    </button>
-    <div class="collapse navbar-collapse" id="navbarCollapse">
-        <div class="navbar-nav mr-auto">
-            <form class="form-inline mt-2 mt-md-0">
-                <div class="input-group">
-                    <div class="input-group-prepend">
-                        <span class="input-group-text" id="currentDirLabel">{{i18n.path_content}} {{showpath}}</span>
-                    </div>
-                    <input class="form-control" id="currentDir" aria-describedby="currentDirLabel" type="text">
-                </div>      
-            </form>
-        </div>
-        <ul class="navbar-nav">
-            {{#config.showrefresh}}
-            <li class="nav-item">
-                <a id="refresh" class="nav-link"><span title="{{i18n.refresh}}" class="icon icon-arrows-cw" href="#"></span> <span class="d-inline d-sm-none">{{i18n.refresh}}</span></a>
-            </li>
-            {{/config.showrefresh}}
-            {{#config.search}}
-            <li class="nav-item">
-                <a id="search" class="nav-link"><span title="{{i18n.search}}" class="icon icon-search" href="#"></span> <span class="d-inline d-sm-none">{{i18n.search}}</span></a>
-            </li>
-            {{/config.search}}
-            {{#config.upload}}
-            <li class="nav-item">
-                <a id="upload" class="nav-link"><span title="{{i18n.upload}}" class="icon icon-upload" href="#"></span> <span class="d-inline d-sm-none">{{i18n.upload}}</span></a>
-            </li>
-            {{/config.upload}}
-            {{#config.createfile}}
-            <li class="nav-item">
-                <a id="createFile" class="nav-link"><span title="{{i18n.file_new}}" class="icon icon-doc-inv" href="#"></span> <span class="d-inline d-sm-none">{{i18n.file_new}}</span></a>
-            </li>
-            {{/config.createfile}}
-            {{#config.createdir}}
-            <li class="nav-item">
-                <a id="createDir" class="nav-link"><span title="{{i18n.folder_new}}" class="icon icon-folder" href="#"></span> <span class="d-inline d-sm-none">{{i18n.folder_new}}</span></a>
-            </li>
-            {{/config.createdir}}
-            <li class="nav-item dropdown">
-                <a class="nav-link dropdown-toggle" href="#" id="menu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></a>
-                <div class="dropdown-menu" aria-labelledby="menu">
-                    {{#config.remoteupload}}
-                    <a class="dropdown-item" href="#" id="buttonRemoteUpload"><span class="icon icon-upload-cloud"></span> {{i18n.upload_remote}}</a>
-                    {{/config.remoteupload}}
-                    {{#config.ajaxrequest}}
-                    <a class="dropdown-item" href="#" id="buttonAjaxRequest"><span class="icon icon-link-ext"></span> {{i18n.ajax_request}}</a>
-                    {{/config.ajaxrequest}}
-                    {{#config.auth}}
-                    <a class="dropdown-item" href="?api=logout" id="buttonLogout"><span class="icon icon-logout"></span> {{i18n.logout}}</a>
-                    {{/config.auth}}
-                </div>
-            </li>
-        </ul>
-    </div>
-    </div>
+	{{^config.inline}}
+	fixed-top
+	{{/config.inline}} bg-dark">
+	<div class="container">
+		<a class="navbar-brand" href="#">IFM</a>
+		<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="true" aria-label="{{i18n.toggle_nav}}">
+			<span class="navbar-toggler-icon"></span>
+		</button>
+		<div class="collapse navbar-collapse" id="navbarCollapse">
+			<div class="navbar-nav mr-auto">
+				<form class="form-inline mt-2 mt-md-0">
+					<div class="input-group">
+						<div class="input-group-prepend">
+							<span class="input-group-text" id="currentDirLabel">{{i18n.path_content}} {{showpath}}</span>
+						</div>
+						<input class="form-control" id="currentDir" aria-describedby="currentDirLabel" type="text">
+					</div>      
+				</form>
+			</div>
+			<ul class="navbar-nav">
+				{{#config.showrefresh}}
+				<li class="nav-item">
+					<a id="refresh" class="nav-link"><span title="{{i18n.refresh}}" class="icon icon-arrows-cw" href="#"></span> <span class="d-inline d-sm-none">{{i18n.refresh}}</span></a>
+				</li>
+				{{/config.showrefresh}}
+				{{#config.search}}
+				<li class="nav-item">
+					<a id="search" class="nav-link"><span title="{{i18n.search}}" class="icon icon-search" href="#"></span> <span class="d-inline d-sm-none">{{i18n.search}}</span></a>
+				</li>
+				{{/config.search}}
+				{{#config.upload}}
+				<li class="nav-item">
+					<a id="upload" class="nav-link"><span title="{{i18n.upload}}" class="icon icon-upload" href="#"></span> <span class="d-inline d-sm-none">{{i18n.upload}}</span></a>
+				</li>
+				{{/config.upload}}
+				{{#config.createfile}}
+				<li class="nav-item">
+					<a id="createFile" class="nav-link"><span title="{{i18n.file_new}}" class="icon icon-doc-inv" href="#"></span> <span class="d-inline d-sm-none">{{i18n.file_new}}</span></a>
+				</li>
+				{{/config.createfile}}
+				{{#config.createdir}}
+				<li class="nav-item">
+					<a id="createDir" class="nav-link"><span title="{{i18n.folder_new}}" class="icon icon-folder" href="#"></span> <span class="d-inline d-sm-none">{{i18n.folder_new}}</span></a>
+				</li>
+				{{/config.createdir}}
+				<li class="nav-item dropdown">
+					<a class="nav-link dropdown-toggle" href="#" id="menu" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"></a>
+					<div class="dropdown-menu" aria-labelledby="menu">
+						{{#config.remoteupload}}
+						<a class="dropdown-item" href="#" id="buttonRemoteUpload"><span class="icon icon-upload-cloud"></span> {{i18n.upload_remote}}</a>
+						{{/config.remoteupload}}
+						{{#config.ajaxrequest}}
+						<a class="dropdown-item" href="#" id="buttonAjaxRequest"><span class="icon icon-link-ext"></span> {{i18n.ajax_request}}</a>
+						{{/config.ajaxrequest}}
+						{{#config.auth}}
+						<a class="dropdown-item" href="?api=logout" id="buttonLogout"><span class="icon icon-logout"></span> {{i18n.logout}}</a>
+						{{/config.auth}}
+					</div>
+				</li>
+			</ul>
+		</div>
+	</div>
 </nav>
 <div id="filedropoverlay">
-    <h1>{{i18n.upload_drop}}</h1>
+	<h1>{{i18n.upload_drop}}</h1>
 </div>
 <main role="main">
-    <div class="container">
-        <table id="filetable" class="table">
-            <thead>
-                <tr>
-                    <th class="th-meta hidden" data-visible="false"></th>
-                    <th class="th-filename">{{i18n.filename}}</th>
-                    {{#config.download}}
-                    <th class="th-download"></th>
-                    {{/config.download}}
-                    {{#config.showlastmodified}}
-                    <th class="th-lastmod">{{i18n.last_modified}}</th>
-                    {{/config.showlastmodified}}
-                    {{#config.showfilesize}}
-                    <th class="th-size">{{i18n.size}}</th>
-                    {{/config.showfilesize}}
-                    {{#config.showpermissions}}
-                    <th class="th-permissions d-none d-md-table-cell">{{i18n.permissions}}</th>
-                    {{/config.showpermissions}}
-                    {{#config.showowner}}
-                    <th class="th-owner d-none d-lg-table-cell">{{i18n.owner}}</th>
-                    {{/config.showowner}}
-                    {{#config.showgroup}}
-                    <th class="th-group d-none d-xl-table-cell">{{i18n.group}}</th>
-                    {{/config.showgroup}}
-                    <th class="th-buttons buttons"></th>
-                </tr>
-            </thead>
-            <tbody>
-            </tbody>
-        </table>        
-    </div>
-    <div class="container">
-        <div class="card ifminfo">
-            <div class="card-body p-2">
-                <div style="float:left; padding-left: 10px;">{{i18n.footer}} IFM_VERSION</div>
-                <a style="float:right; padding-right: 10px;" href="http://github.com/misterunknown/ifm">{{i18n.github}}</a>
-            </div>
-        </div>
-    </div>
+	<div class="container">
+		<table id="filetable" class="table">
+			<thead>
+				<tr>
+					<th class="th-meta hidden" data-visible="false"></th>
+					<th class="th-filename">{{i18n.filename}}</th>
+					{{#config.download}}
+					<th class="th-download"></th>
+					{{/config.download}}
+					{{#config.showlastmodified}}
+					<th class="th-lastmod">{{i18n.last_modified}}</th>
+					{{/config.showlastmodified}}
+					{{#config.showfilesize}}
+					<th class="th-size">{{i18n.size}}</th>
+					{{/config.showfilesize}}
+					{{#config.showpermissions}}
+					<th class="th-permissions d-none d-md-table-cell">{{i18n.permissions}}</th>
+					{{/config.showpermissions}}
+					{{#config.showowner}}
+					<th class="th-owner d-none d-lg-table-cell">{{i18n.owner}}</th>
+					{{/config.showowner}}
+					{{#config.showgroup}}
+					<th class="th-group d-none d-xl-table-cell">{{i18n.group}}</th>
+					{{/config.showgroup}}
+					<th class="th-buttons buttons"></th>
+				</tr>
+			</thead>
+			<tbody>
+			</tbody>
+		</table>        
+	</div>
+	<div class="container">
+		<div class="card ifminfo">
+			<div class="card-body p-2">
+				<div style="float:left; padding-left: 10px;">{{i18n.footer}} <a href='https://github.com/misterunknown/ifm/tree/IFM_VERSION' target=_blank>IFM_VERSION</a></div>
+				<a style="float:right; padding-right: 10px;" href="http://github.com/misterunknown/ifm" target="_blank">{{i18n.github}}</a>
+			</div>
+		</div>
+	</div>
 </main>
diff --git a/src/templates/login.html b/src/templates/login.html
index 89c0d32..4a93494 100644
--- a/src/templates/login.html
+++ b/src/templates/login.html
@@ -107,6 +107,7 @@ body {
   <div class="text-center mb-4">
   	<h1 class="h3 mb-3 font-weight-normal">IFM {{i18n.login}}</h1>
   </div>
+  {{error}}
   <div class="form-label-group">
     <input type="text" name="inputLogin" id="inputLogin" class="form-control" placeholder="{{i18n.username}}" required="" autofocus="">
     <label for="inputLogin">{{i18n.username}}</label>
@@ -115,6 +116,8 @@ body {
     <input type="password" name="inputPassword" id="inputPassword" class="form-control" placeholder="{{i18n.password}}" required="">
     <label for="inputPassword">{{i18n.password}}</label>
   </div>
+  <div class="alert alert-danger d-none" role="alert"></div>
+   
   <button class="btn btn-lg btn-primary btn-block" type="submit">{{i18n.login}}</button>
   
 </form>
\ No newline at end of file
diff --git a/src/templates/modal.ajaxrequest.html b/src/templates/modal.ajaxrequest.html
index a4707b6..59567c2 100644
--- a/src/templates/modal.ajaxrequest.html
+++ b/src/templates/modal.ajaxrequest.html
@@ -1,16 +1,31 @@
 <form id="formAjaxRequest">
 <div class="modal-body">
 	<fieldset>
-		<label>URL</label><br>
-		<input class="form-control" type="text" id="ajaxurl" required><br>
-		<label>{{i18n.data}}</label><br>
-		<textarea class="form-control" id="ajaxdata"></textarea><br>
-		<label>{{i18n.method}}</label><br>
-		<input type="radio" name="arMethod" value="GET">GET</input><input type="radio" name="arMethod" value="POST" checked="checked">POST</input><br>
+		<div class="form-group">
+			<label for="ajaxurl">URL</label>
+			<input class="form-control" type="url" id="ajaxurl" required>
+		</div>
+		<div class="form-group">
+			<label for="ajaxdata">{{i18n.data}}</label>
+			<textarea class="form-control" id="ajaxdata"></textarea>
+		</div>
+		<div class="form-group">
+			<legend>{{i18n.method}}</legend>
+			<div class="form-check form-check-inline">
+				<input class="form-check-input" type="radio" id="radioget" name="arMethod" value="GET">
+				<label class="form-check-label" for="radioget">GET</label>
+			</div>
+			<div class="form-check form-check-inline">
+				<input class="form-check-input" type="radio" id="radiopost" name="arMethod" value="POST" checked="checked">
+				<label class="form-check-label" for="radiopost">POST</label>
+			</div>
+		</div>
 		<button type="button" class="btn btn-success" id="buttonRequest">{{i18n.request}}</button>
-		<button type="button" class="btn btn-secondary" id="buttonClose">{{i18n.cancel}}</button><br>
-		<label>{{i18n.response}}</label><br>
-		<textarea class="form-control" id="ajaxresponse"></textarea>
+		<button type="button" class="btn btn-danger" id="buttonClose">{{i18n.cancel}}</button>
+		<div class="form-group">
+			<label for="ajaxresponse">{{i18n.response}}</label>
+			<textarea class="form-control" id="ajaxresponse"></textarea>
+		</div>
 	</fieldset>
-</form>
 </div>
+</form>
diff --git a/src/templates/modal.copymove.html b/src/templates/modal.copymove.html
index 0faeb4d..8a50312 100644
--- a/src/templates/modal.copymove.html
+++ b/src/templates/modal.copymove.html
@@ -1,13 +1,15 @@
 <form id="formCopyMove">
 <fieldset>
 	<div class="modal-body">
-		<label>{{i18n.select_destination}}:</label>
-		<div id="copyMoveTree"><div class="text-center"><span class="icon icon-spin5 animate-spin"></span></div></div>
+		<div class="form-group">
+			<label for="copyMoveTree">{{i18n.select_destination}}:</label>
+			<div id="copyMoveTree"><div class="text-center"><span class="icon icon-spin5 animate-spin"></span></div></div>
+		</div>
 	</div>
 	<div class="modal-footer">
 		<button type="button" class="btn btn-secondary" id="copyButton">{{i18n.copy}}</button>
 		<button type="button" class="btn btn-secondary" id="moveButton">{{i18n.move}}</button>
-		<button type="button" class="btn btn-secondary" id="cancelButton">{{i18n.cancel}}</button>
+		<button type="button" class="btn btn-danger" id="cancelButton">{{i18n.cancel}}</button>
 	</div>
 </fieldset>
 </form>
diff --git a/src/templates/modal.createarchive.html b/src/templates/modal.createarchive.html
index 43e1300..20c4d65 100644
--- a/src/templates/modal.createarchive.html
+++ b/src/templates/modal.createarchive.html
@@ -1,12 +1,14 @@
 <form id="formCreateArchive">
 <div class="modal-body">
 	<fieldset>
-		<label>{{i18n.archivename}}:</label>
-		<input class="form-control" type="text" name="archivename" value="" />
+		<div class="form-group">
+			<label for="archivename">{{i18n.archivename}}:</label>
+			<input id="archivename" class="form-control" type="text" name="archivename" value="" />
+		</div>
 	</fieldset>
 </div>
 <div class="modal-footer">
-	<button type="button" class="btn btn-secondary" id="buttonSave">{{i18n.save}}</button>
-	<button type="button" class="btn btn-secondary" id="buttonCancel">{{i18n.cancel}}</button>
+	<button type="button" class="btn btn-success" id="buttonSave">{{i18n.save}}</button>
+	<button type="button" class="btn btn-danger" id="buttonCancel">{{i18n.cancel}}</button>
 </div>
 </form>
diff --git a/src/templates/modal.createdir.html b/src/templates/modal.createdir.html
index e379b8a..b5e771c 100644
--- a/src/templates/modal.createdir.html
+++ b/src/templates/modal.createdir.html
@@ -1,12 +1,14 @@
 <form id="formCreateDir">
 <div class="modal-body">
 	<fieldset>
-		<label>{{i18n.directoryname}}:</label>
-		<input class="form-control" type="text" name="dirname" value="" />
+		<div class="form-group">
+			<label for="dirname">{{i18n.directoryname}}:</label>
+			<input class="form-control" id="dirname" type="text" name="dirname" value="" />
+		</div>
 	</fieldset>
 </div>
 <div class="modal-footer">
-	<button type="button" class="btn btn-secondary" id="buttonSave">{{i18n.save}}</button>
-	<button type="button" class="btn btn-secondary" id="buttonCancel">{{i18n.cancel}}</button>
+	<button type="button" class="btn btn-success" id="buttonSave">{{i18n.save}}</button>
+	<button type="button" class="btn btn-danger" id="buttonCancel">{{i18n.cancel}}</button>
 </div>
 </form>
diff --git a/src/templates/modal.extractfile.html b/src/templates/modal.extractfile.html
index a357ff8..ec3c0dd 100644
--- a/src/templates/modal.extractfile.html
+++ b/src/templates/modal.extractfile.html
@@ -1,29 +1,37 @@
 <form id="formExtractFile">
 <div class="modal-body">
 	<fieldset>
-		<label>{{i18n.extract_filename}} {{filename}}:</label>
-		<div class="input-group">
-			<div class="input-group-prepend">
-				<span class="input-group-text"><input type="radio" name="extractTargetLocation" value="./" checked="checked"></span>
+		<div class="form-group">
+			<label>{{i18n.extract_filename}} {{filename}}:</label>
+			<div class="input-group">
+				<div class="input-group-prepend">
+					<div class="input-group-text">
+						<input type="radio" name="extractTargetLocation" value="./" checked="checked">
+					</div>
+				</div>
+				<input class="form-control" type="text" placeholder="./" readonly>
 			</div>
-			<span class="form-control">./</span>
-		</div>
-		<div class="input-group">
-			<div class="input-group-prepend">
-				<span class="input-group-text"><input type="radio" name="extractTargetLocation" value="./{{destination}}"></span>
+			<div class="input-group">
+				<div class="input-group-prepend">
+					<div class="input-group-text">
+						<input type="radio" name="extractTargetLocation" value="./{{destination}}">
+					</div>
+				</div>
+				<input class="form-control" type="text" placeholder="./{{destination}}" readonly>
 			</div>
-			<span class="form-control">./{{destination}}</span>
-		</div>
-		<div class="input-group">
-			<div class="input-group-prepend">
-				<span class="input-group-text"><input type="radio" name="extractTargetLocation" value="custom"></span>
+			<div class="input-group">
+				<div class="input-group-prepend">
+					<div class="input-group-text">
+						<input type="radio" name="extractTargetLocation" value="custom">
+					</div>
+				</div>
+				<input id="extractCustomLocation" type="text" class="form-control" placeholder="custom location" value="">
 			</div>
-			<input id="extractCustomLocation" type="text" class="form-control" placeholder="custom location" value="">
 		</div>
 	</fieldset>
 </div>
 <div class="modal-footer">
-	<button type="button" class="btn btn-secondary" id="buttonExtract">{{i18n.extract}}</button>
-	<button type="button" class="btn btn-secondary" id="buttonCancel">{{i18n.cancel}}</button>
+	<button type="button" class="btn btn-primary" id="buttonExtract">{{i18n.extract}}</button>
+	<button type="button" class="btn btn-danger" id="buttonCancel">{{i18n.cancel}}</button>
 </div>
 </form>
diff --git a/src/templates/modal.file.html b/src/templates/modal.file.html
index 97bd066..a0c4918 100644
--- a/src/templates/modal.file.html
+++ b/src/templates/modal.file.html
@@ -1,15 +1,17 @@
 <form id="formFile">
 <div class="modal-body">
 	<fieldset>
-		<label>{{i18n.filename}}:</label>
-		<input type="text" class="form-control" name="filename" value="{{filename}}"><br>
-		<div id="content" name="content"></div><br>
+		<div class="form-group">
+			<label for="filename">{{i18n.filename}}:</label>
+			<input type="text" class="form-control" name="filename" id="filename" value="{{filename}}">
+		</div>
+		<div class="form-group" id="content" name="content"></div>
 		<button type="button" class="btn btn-secondary" id="editoroptions">{{i18n.editor_options}}</button>
 	</fieldset>
 </div>
 <div class="modal-footer">
-	<button type="button" id="buttonSave" class="btn btn-secondary">{{i18n.save}}</button>
-	<button type="button" id="buttonSaveNotClose" class="btn btn-secondary">{{i18n.save_wo_close}}</button>
-	<button type="button" id="buttonClose" class="btn btn-secondary">{{i18n.close}}</button>
+	<button type="button" id="buttonSave" class="btn btn-primary">{{i18n.save}}</button>
+	<button type="button" id="buttonSaveNotClose" class="btn btn-success">{{i18n.save_wo_close}}</button>
+	<button type="button" id="buttonClose" class="btn btn-danger">{{i18n.close}}</button>
 </div>
 </form>
diff --git a/src/templates/modal.file_editoroptions.html b/src/templates/modal.file_editoroptions.html
index de4ef78..b1e724a 100644
--- a/src/templates/modal.file_editoroptions.html
+++ b/src/templates/modal.file_editoroptions.html
@@ -1,27 +1,33 @@
-<div>
-<div class="form-check p-0">
-<input type="checkbox" id="editor-wordwrap" 
-    {{#wordwrap}}
-    checked="checked"
-    {{/wordwrap}}
->
-<label class="form-check-label" for="editor-wordwrap">{{i18n.word_wrap}}</label>
-</div>
-<div class="form-check">
-<input class="form-check-input" type="checkbox" id="editor-softtabs"
-    {{#softtabs}}
-    checked="checked"
-    {{/softtabs}}
->
-<label class="form-check-label" for="editor-softtabs">{{i18n.soft_tabs}}</label>
-</div>
-<div class="input-group">
-    <div class="input-group-prepend"><span class="input-group-text">{{i18n.tab_size}}</span></div><input class="form-control" type="text" size="2" id="editor-tabsize" title="{{i18n.tab_size}}" value="{{tabsize}}"></div>
-{{#ace_includes}}
-<select class="form-control selectpicker" data-toggle="dropdown" data-live-search="true" data-size="15" id="editor-syntax">
-	{{#modes}}
-	<option value="ace/mode/{{.}}" {{{ace_mode_selected}}}>{{.}}</option>
-	{{/modes}}
-</select>
-{{/ace_includes}}
-</div>
+<form>
+	<div class="form-group">
+		<div class="form-check">
+			<input class="form-check-input" type="checkbox" id="editor-wordwrap" 
+				{{#wordwrap}}
+				checked="checked"
+				{{/wordwrap}}
+			>
+			<label class="form-check-label" for="editor-wordwrap">{{i18n.word_wrap}}</label>
+		</div>
+		<div class="form-check">
+			<input class="form-check-input" type="checkbox" id="editor-softtabs"
+				{{#softtabs}}
+				checked="checked"
+				{{/softtabs}}
+			>
+			<label class="form-check-label" for="editor-softtabs">{{i18n.soft_tabs}}</label>
+		</div>
+	</div>
+	<div class="input-group">
+		<div class="input-group-prepend">
+			<span class="input-group-text" id="editor-tabsize-label">{{i18n.tab_size}}</span>
+		</div>
+		<input class="form-control" type="number" min="1" max="9" maxlength="1" id="editor-tabsize" title="{{i18n.tab_size}}" value="{{tabsize}}" aria-describedby="editor-tabsize-label">
+	</div>
+	{{#ace_includes}}
+	<select class="form-control selectpicker" data-toggle="dropdown" data-live-search="true" data-size="15" id="editor-syntax">
+		{{#modes}}
+		<option value="ace/mode/{{.}}" {{{ace_mode_selected}}}>{{.}}</option>
+		{{/modes}}
+	</select>
+	{{/ace_includes}}
+</form>
diff --git a/src/templates/modal.remoteupload.html b/src/templates/modal.remoteupload.html
index 6dce924..62cce7f 100644
--- a/src/templates/modal.remoteupload.html
+++ b/src/templates/modal.remoteupload.html
@@ -1,16 +1,29 @@
 <form id="formRemoteUpload">
 <div class="modal-body">
 	<fieldset>
-		<label>{{i18n.upload_remote_url}}</label><br>
-		<input class="form-control" type="text" id="url" name="url" required><br>
-		<label>{{i18n.filename}}</label>
-		<input class="form-control" type="text" id="filename" name="filename" required><br>
-		<label>{{i18n.method}}</label>
-		<input type="radio" name="method" value="curl" checked="checked">cURL<input type="radio" name="method" value="file">file</input><br>
+		<div class="form-group">
+			<label for="url">{{i18n.upload_remote_url}}</label>
+			<input class="form-control" type="url" id="url" name="url" required>
+		</div>
+		<div class="form-group">
+			<label for="filename">{{i18n.filename}}</label>
+			<input class="form-control" type="text" id="filename" name="filename" required>
+		</div>
+		<div class="form-group">
+			<legend>{{i18n.method}}</legend>
+			<div class="form-check form-check-inline">
+				<input class="form-check-input" type="radio" id="radiocurl" name="method" value="curl" checked="checked">
+				<label class="form-check-label" for="radiocurl">cURL</label>
+			</div>
+			<div class="form-check form-check-inline">
+				<input class="form-check-input" type="radio" id="radiofile" name="method" value="file">
+				<label class="form-check-label" for="radiofile">file</label>
+			</div>
+		</div>
 	</fieldset>
 </div>
 <div class="modal-footer">
-	<button type="button" class="btn btn-secondary" id="buttonUpload">{{i18n.upload}}</button>
-	<button type="button" class="btn btn-secondary" id="buttonCancel">{{i18n.cancel}}</button>
+	<button type="button" class="btn btn-primary" id="buttonUpload">{{i18n.upload}}</button>
+	<button type="button" class="btn btn-danger" id="buttonCancel">{{i18n.cancel}}</button>
 </div>
 </form>
diff --git a/src/templates/modal.renamefile.html b/src/templates/modal.renamefile.html
index dd19d43..0940500 100644
--- a/src/templates/modal.renamefile.html
+++ b/src/templates/modal.renamefile.html
@@ -1,12 +1,14 @@
 <form id="formRenameFile">
 <div class="modal-body">
 	<fieldset>
-		<label>{{i18n.rename_filename}} {{filename}}:</label>
-		<input class="form-control" type="text" name="newname" value="" /><br>
+		<div class="form-group">
+			<label for="newname">{{i18n.rename_filename}} {{filename}}:</label>
+			<input id="newname" class="form-control" type="text" name="newname" value="" />
+		</div>
 	</fieldset>
 </div>
 <div class="modal-footer">
 	<button type="button" class="btn btn-secondary" id="buttonRename">{{i18n.file_rename}}</button>
-	<button type="button" class="btn btn-secondary" id="buttonCancel">{{i18n.cancel}} </button>
+	<button type="button" class="btn btn-danger" id="buttonCancel">{{i18n.cancel}} </button>
 </div>
 </form>
diff --git a/src/templates/modal.search.html b/src/templates/modal.search.html
index 5fe4643..974efc9 100644
--- a/src/templates/modal.search.html
+++ b/src/templates/modal.search.html
@@ -1,8 +1,10 @@
 <form id="searchForm">
 <div class="modal-body">
 	<fieldset>
-		<label>{{i18n.search_pattern}}:</label>
-		<input type="text" class="form-control" id="searchPattern" name="pattern" autocomplete="off" value="{{lastSearch}}"><br>
+		<div class="form-group">
+			<label for="searchPattern">{{i18n.search_pattern}}:</label>
+			<input type="search" class="form-control" id="searchPattern" name="pattern" autocomplete="off" value="{{lastSearch}}">
+		</div>
 		<table id="searchResults" class="table">
 		</table>
 	</fieldset>
diff --git a/src/templates/modal.uploadfile.html b/src/templates/modal.uploadfile.html
index e349501..088d24a 100644
--- a/src/templates/modal.uploadfile.html
+++ b/src/templates/modal.uploadfile.html
@@ -1,14 +1,20 @@
 <form id="formUploadFile">
 <div class="modal-body">
 	<fieldset>
-		<label>{{i18n.upload_file}}</label><br>
-		<input class="form-control-file" type="file" name="files" multiple><br>
-		<label>{{i18n.filename_new}}</label>
-		<input class="form-control" type="text" name="newfilename"><br>
+		<div class="form-group">
+			<div class="custom-file">
+				<label class="custom-file-label" for="fileselect">{{i18n.upload_file}}</label>
+				<input class="custom-file-input" type="file" name="files" id="fileselect" multiple>
+			</div>
+		</div>
+		<div class="form-group">
+			<label for="filename">{{i18n.filename_new}}</label>
+			<input class="form-control" type="text" name="newfilename" id="filename">
+		</div>
 	</fieldset>
 </div>
 <div class="modal-footer">
-	<button class="btn btn-secondary" id="buttonUpload">{{i18n.upload}}</button>
-	<button class="btn btn-secondary" id="buttonCancel">{{i18n.cancel}}</button>
+	<button class="btn btn-primary" id="buttonUpload">{{i18n.upload}}</button>
+	<button class="btn btn-danger" id="buttonCancel">{{i18n.cancel}}</button>
 </div>
 </form>