Version 1.2.4: Fixes, Optimizations, Browser-Support

2025-01-17 05:18:19 +01:00 · 2018-09-22 07:08:19 +02:00 · 2018-09-22 07:08:19 +02:00 · 98dd62798c
commit 98dd62798c
parent c2baf33f63
45 changed files with 336 additions and 169 deletions
--- a/cache/lastCache.txt
+++ b/cache/lastCache.txt
@ -1 +1 @@
-1536875791
+1537543207
--- a/content/00-typemill/00-use
+++ b/content/00-typemill/00-use
@ -1,6 +1,6 @@
 # Use Cases

-Whenever you want to publish a finished text work as a website and if you like writing with Markdown, then TYPEMILL is a smart and lightweight solution. Possible use cases are ...
+Whenever you want to publish a finished text work as a website and if you like writing with Markdown, then TYPEMILL is a smart and lightweight solution. Possible use cases are …

 - a documentation
 - a manual
@ -16,6 +16,6 @@ Whenever you want to publish a finished text work as a website and if you like w

 If you want to create a blog, a wiki or a classic corporate website, please use a specialized CMS for that instead of TYPEMILL.

-TYPEMILL is under heavy developement and not finished right now. It has an admin panel for settings and a very basic editor for existing content. More options like delete or create new pages and manage your media-files will be added step by step in next weeks. Also  different output formats like mobi and ePup are on the roadmap, so stay tuned.
+TYPEMILL is under heavy developement and not finished right now. It has an admin panel for settings and a basic editor for existing content. More options like create new pages and manage your media-files will be added step by step in the next weeks. Also different output formats like mobi and ePup are on the roadmap, so stay tuned.

-You have to use a FTP-software like FileZilla until the basic editing features are ready. Check the roadmap for more informations.
+For now, you have to use a FTP-software like FileZilla until all basic editing features are ready. Check the roadmap for more informations.
--- a/content/00-typemill/01-features.md
+++ b/content/00-typemill/01-features.md
@ -22,4 +22,4 @@ This is, what **TYPEMILL does** for you:
 - It adds hierarchic numbers to your chapters and pages.
 - It generates a google sitemap, a last modified date and much more.

-Right now there is only a simple content editor that provides basic editing of existing pages. If you want to create new pages, then you have to use an offline markdown editor like Typora and a FTP software like FileZilla. These missing feature will be added in version 1.2.6.
+Right now there is only a simple content editor that provides basic editing of existing pages. If you want to create new pages, then you have to use an offline markdown editor like Typora and a FTP software like FileZilla.
--- a/content/00-typemill/02-roadmap.md
+++ b/content/00-typemill/02-roadmap.md
@ -10,18 +10,17 @@ Here are some **milestones** of the past:
 - Introduced plugins (v. 1.1.0)
 - Added an author panel for configurations (v. 1.1.3)
 - Added math support (mathjax/katex) (v. 1.1.5) 
- Added a basic content editor to change existing pages (v. 1.2.0)
+- Added a basic content editor to edit and delete existing pages (v. 1.2.0)
 - Added a draft management for pages (v. 1.2.2)
 - Re-order content pages with drag&drop (v. 1.2.3)

 And here is the **roadmap** for this year (2018):

- Editor: Create new pages (v. 1.2.3)
- Editor: Edit meta-information (v. 1.2.4)
- Editor: Markdown and HTML-preview (v. 1.2.5)
- Editor: Manage images and assets (v. 1.3.0)
+- Editor: Create new pages (v. 1.2.5)
+- Editor: Manage images and assets (v. 1.2.6)
+- Editor: Edit meta-information (v. 1.2.7)
 - Editor: Add formatting options (v. 1.3.0)
- Editor: Create a solution for direct preview or WYSIWYG (1.3.0)
+- Editor: WYSIWYG-Preview for markdown blocks (v. 1.3.0)
 - Editor: Create the best author- and writing experience you have ever seen (1.4.0)

 Other features with lower prio: 
--- a/content/01-getting
+++ b/content/01-getting
@ -12,4 +12,6 @@ What you don't need:
 - **A database** (TYPEMILL uses files, not a database)
 - **Technical skills** (TYPEMILL is easy to use for non-technical people)

-Almost any hosting package provides a webserver with php. If you ever hosted your own website, then chances are high, that you can run TYPEMILL there without any problems.
+Almost any hosting package provides a webserver with php. If you ever hosted your own website, then chances are high, that you can run TYPEMILL there without any problems.
+
+Typemill is developed with Firefox and tested with Chrome. Microsoft Edge and Safari do also work, but they are not deeply tested. The content editor of TYPEMILL does not work with Internet Explorer. However, IE has nearly no market share anymore, so do not use outdated software, please. 
--- a/started/02-installation.md
+++ b/started/02-installation.md
--- a/started/03-settings.md
+++ b/started/03-settings.md
--- a/started/04-update.md
+++ b/started/04-update.md
--- a/content/01-getting
+++ b/content/01-getting
@ -1,3 +1,3 @@
 # Getting Started

-Simply download TYPEMILL and immediately start publishing. TYPEMILL runs with **php5.6+** on most webservers. **No database** or any other additional technology is required.
+Simply download TYPEMILL and immediately start publishing. TYPEMILL runs with **php7+** on most webservers. **No database** or any other additional technology is required.
--- a/writers/00-quick
+++ b/writers/00-quick
@ -0,0 +1 @@
+["# Quick Start for Writers","You are a pro and don't want to read the whole manual? No problem, this is a quick overview:","- **Setup**: Login to your system and setup the system, the themes and the plugins in the author panel.\n- **Content**: Organize your content in folders and markdown files and put them in the `\\content` folder of TYPEMILL. \n- **Markdown**: Use the Markdown syntax for your content files. Markdown Extra (e.g. tables, footnotes) is supported, too.\n- **Naming conventions**: Use prefixes like `01-` or `aa_` to sort your folders and files.\n- **Index files**: Add an `index.md` file to a folder to create content for the folder itself.\n- **F5**: After some changes, use the `F5` key to refresh the navigation manually.\n- **Lean back** and let TYPEMILL create a nice website for you.","\nThe TYPEMILL system ships with this user manual in the content folder. Check how the files are written and how the folders are organized."]
--- a/writers/01-author
+++ b/writers/01-author
@ -19,10 +19,10 @@ In the **content area** of the author panel you can:
 There are several **limitations** right now:

 * You cannot use HTML, JavaScript or any other code in the editor, only markdown-syntax is allowed.
-* You cannot delete, create or reorder the pages right now (use FTP for this), but these features are on the way.
+* You cannot create new pages right now (use FTP for this), but these feature is on its way.
 * There is no media-management right now.

-The content editor has highest priority in the roadmap, so you can expect al lot of improvements in the next weeks.
+The content editor has highest priority in the roadmap, so you can expect a lot of improvements in the next weeks.

 ## Settings, Themes and Plugins

--- a/writers/02-naming
+++ b/writers/02-naming
--- a/writers/03-folder
+++ b/writers/03-folder
--- a/writers/04-mardown.md
+++ b/writers/04-mardown.md
--- a/content/index.md
+++ b/content/index.md
@ -1,5 +1,5 @@
 # Typemill

-Modern Web Publishing For Writers.
-
-Typemill is a user-friendly and lightweight open source CMS for publishing text-works like prosa, lyrics, manuals, documentations, studies and more. Just download and start.
+**MODERN WEB PUBLISHING FOR WRITERS**
+ 
+*Typemill is a user-friendly and lightweight open source CMS for publishing text-works like prosa, lyrics, manuals, documentations, studies and more. Just download and start.*
--- a/plugins/cookieconsent/cookieconsent.yaml
+++ b/plugins/cookieconsent/cookieconsent.yaml
@ -1,5 +1,5 @@
 name: Cookie Consent
-version: 1.0.0
+version: 1.0.1
 description: Enables a cookie consent for websites
 author: Sebastian Schürmanns
 homepage: https://cookieconsent.insites.com/
@ -14,6 +14,7 @@ settings:
  position: 'bottom'
  message: 'This website uses cookies to ensure you get the best experience on our website.'
  link: 'Learn More'
+  href: 'https://cookiesandyou.com/'
  dismiss: 'Got It'

 forms:
@ -44,6 +45,12 @@ forms:
      placeholder: 'Message for cookie-popup'
      required: true

+    href:
+      type: url
+      label: Link to more informations
+      placeholder: 'https://cookiesandyou.com/'
+      required: true
+
    link:
      type: text
      label: Label for Link
--- a/plugins/cookieconsent/public/cookieconsent.min.css
+++ b/plugins/cookieconsent/public/cookieconsent.min.css
@ -1,6 +1,6 @@
 .cc-window{opacity:1;transition:opacity 1s ease}.cc-window.cc-invisible{opacity:0}.cc-animate.cc-revoke{transition:transform 1s ease}.cc-animate.cc-revoke.cc-top{transform:translateY(-2em)}.cc-animate.cc-revoke.cc-bottom{transform:translateY(2em)}.cc-animate.cc-revoke.cc-active.cc-bottom,.cc-animate.cc-revoke.cc-active.cc-top,.cc-revoke:hover{transform:translateY(0)}.cc-grower{max-height:0;overflow:hidden;transition:max-height 1s}
-.cc-link,.cc-revoke:hover{text-decoration:underline}.cc-revoke,.cc-window{position:fixed;overflow:hidden;box-sizing:border-box;font-family:Helvetica,Calibri,Arial,sans-serif;font-size:16px;line-height:1.5em;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}.cc-window.cc-static{position:static}.cc-window.cc-floating{padding:2em;max-width:24em;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner{padding:1em 1.8em;width:100%;-ms-flex-direction:row;flex-direction:row}.cc-revoke{padding:.5em}.cc-header{font-size:18px;font-weight:700}.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}.cc-link{opacity:.8;display:inline-block;padding:.2em}.cc-link:hover{opacity:1}.cc-link:active,.cc-link:visited{color:initial}.cc-btn{display:block;padding:.4em .8em;font-size:.9em;font-weight:700;border-width:2px;border-style:solid;text-align:center;white-space:nowrap}.cc-banner .cc-btn:last-child{min-width:140px}.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}.cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}.cc-close:focus,.cc-close:hover{opacity:1}
-.cc-revoke.cc-top{top:0;left:3em;border-bottom-left-radius:.5em;border-bottom-right-radius:.5em}.cc-revoke.cc-bottom{bottom:0;left:3em;border-top-left-radius:.5em;border-top-right-radius:.5em}.cc-revoke.cc-left{left:3em;right:unset}.cc-revoke.cc-right{right:3em;left:unset}.cc-top{top:1em}.cc-left{left:1em}.cc-right{right:1em}.cc-bottom{bottom:1em}.cc-floating>.cc-link{margin-bottom:1em}.cc-floating .cc-message{display:block;margin-bottom:1em}.cc-window.cc-floating .cc-compliance{-ms-flex:1;flex:1}.cc-window.cc-banner{-ms-flex-align:center;align-items:center}.cc-banner.cc-top{left:0;right:0;top:0}.cc-banner.cc-bottom{left:0;right:0;bottom:0}.cc-banner .cc-message{-ms-flex:1;flex:1}.cc-compliance{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:justify;align-content:space-between}.cc-compliance>.cc-btn{-ms-flex:1;flex:1}.cc-btn+.cc-btn{margin-left:.5em}
-@media print{.cc-revoke,.cc-window{display:none}}@media screen and (max-width:900px){.cc-btn{white-space:normal}}@media screen and (max-width:414px) and (orientation:portrait),screen and (max-width:736px) and (orientation:landscape){.cc-window.cc-top{top:0}.cc-window.cc-bottom{bottom:0}.cc-window.cc-banner,.cc-window.cc-left,.cc-window.cc-right{left:0;right:0}.cc-window.cc-banner{-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner .cc-compliance{-ms-flex:1;flex:1}.cc-window.cc-floating{max-width:none}.cc-window .cc-message{margin-bottom:1em}.cc-window.cc-banner{-ms-flex-align:unset;align-items:unset}}
+.cc-link,.cc-revoke:hover{text-decoration:underline}.cc-revoke,.cc-window{position:fixed;overflow:hidden;box-sizing:border-box;font-family:Helvetica,Calibri,Arial,sans-serif;font-size:16px;line-height:1.5em;display:-ms-flexbox;display:flex;-ms-flex-wrap:nowrap;flex-wrap:nowrap;z-index:9999}.cc-window.cc-static{position:static}.cc-window.cc-floating{padding:2em;max-width:24em;-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner{padding:1em 1.8em;width:100%;-ms-flex-direction:row;flex-direction:row}.cc-revoke{padding:.5em}.cc-header{font-size:18px;font-weight:700}.cc-btn,.cc-close,.cc-link,.cc-revoke{cursor:pointer}.cc-link{opacity:.8;display:inline-block;padding:.2em}.cc-link:hover{opacity:1}.cc-link:active,.cc-link:visited{color:initial}.cc-btn{display:block;padding:.4em .8em;font-size:.9em;font-weight:700;border-width:2px;border-style:solid;text-align:center;white-space:nowrap}.cc-highlight .cc-btn:first-child{background-color:transparent;border-color:transparent}.cc-highlight .cc-btn:first-child:focus,.cc-highlight .cc-btn:first-child:hover{background-color:transparent;text-decoration:underline}.cc-close{display:block;position:absolute;top:.5em;right:.5em;font-size:1.6em;opacity:.9;line-height:.75}.cc-close:focus,.cc-close:hover{opacity:1}
+.cc-revoke.cc-top{top:0;left:3em;border-bottom-left-radius:.5em;border-bottom-right-radius:.5em}.cc-revoke.cc-bottom{bottom:0;left:3em;border-top-left-radius:.5em;border-top-right-radius:.5em}.cc-revoke.cc-left{left:3em;right:unset}.cc-revoke.cc-right{right:3em;left:unset}.cc-top{top:1em}.cc-left{left:1em}.cc-right{right:1em}.cc-bottom{bottom:1em}.cc-floating>.cc-link{margin-bottom:1em}.cc-floating .cc-message{display:block;margin-bottom:1em}.cc-window.cc-floating .cc-compliance{-ms-flex:1 0 auto;flex:1 0 auto}.cc-window.cc-banner{-ms-flex-align:center;align-items:center}.cc-banner.cc-top{left:0;right:0;top:0}.cc-banner.cc-bottom{left:0;right:0;bottom:0}.cc-banner .cc-message{display:block;-ms-flex:1 1 auto;flex:1 1 auto;max-width:100%;margin-right:1em}.cc-compliance{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:justify;align-content:space-between}.cc-floating .cc-compliance>.cc-btn{-ms-flex:1;flex:1}.cc-btn+.cc-btn{margin-left:.5em}
+@media print{.cc-revoke,.cc-window{display:none}}@media screen and (max-width:900px){.cc-btn{white-space:normal}}@media screen and (max-width:414px) and (orientation:portrait),screen and (max-width:736px) and (orientation:landscape){.cc-window.cc-top{top:0}.cc-window.cc-bottom{bottom:0}.cc-window.cc-banner,.cc-window.cc-floating,.cc-window.cc-left,.cc-window.cc-right{left:0;right:0}.cc-window.cc-banner{-ms-flex-direction:column;flex-direction:column}.cc-window.cc-banner .cc-compliance{-ms-flex:1 1 auto;flex:1 1 auto}.cc-window.cc-floating{max-width:none}.cc-window .cc-message{margin-bottom:1em}.cc-window.cc-banner{-ms-flex-align:unset;align-items:unset}.cc-window.cc-banner .cc-message{margin-right:0}}
 .cc-floating.cc-theme-classic{padding:1.2em;border-radius:5px}.cc-floating.cc-type-info.cc-theme-classic .cc-compliance{text-align:center;display:inline;-ms-flex:none;flex:none}.cc-theme-classic .cc-btn{border-radius:5px}.cc-theme-classic .cc-btn:last-child{min-width:140px}.cc-floating.cc-type-info.cc-theme-classic .cc-btn{display:inline-block}
 .cc-theme-edgeless.cc-window{padding:0}.cc-floating.cc-theme-edgeless .cc-message{margin:2em 2em 1.5em}.cc-banner.cc-theme-edgeless .cc-btn{margin:0;padding:.8em 1.8em;height:100%}.cc-banner.cc-theme-edgeless .cc-message{margin-left:1em}.cc-floating.cc-theme-edgeless .cc-btn+.cc-btn{margin-left:0}
--- a/plugins/cookieconsent/public/cookieconsent.min.js
+++ b/plugins/cookieconsent/public/cookieconsent.min.js
--- a/plugins/cookieconsent/templates/cookieconsent.twig
+++ b/plugins/cookieconsent/templates/cookieconsent.twig
@ -15,7 +15,8 @@ window.addEventListener("load", function(){
 		"content": {
 			"message": "{{ settings.plugins.cookieconsent.message }}",
 			"dismiss": "{{ settings.plugins.cookieconsent.dismiss }}",
-			"link": "{{ settings.plugins.cookieconsent.link }}"
+			"link": "{{ settings.plugins.cookieconsent.link }}",
+			"href": "{{ settings.plugins.cookieconsent.href }}"
 		}
 	})
 });
--- a/system/Models/Write.php
+++ b/system/Models/Write.php
@ -82,13 +82,55 @@ class Write

 	public function moveElement($item, $folderPath, $index)
 	{
-		$result				= false;
+		$filetypes			= array('md', 'txt');
 		
+		# set new order as string
 		$newOrder			= ($index < 10) ? '0' . $index : $index;
+
+		# create new path with foldername or filename but without file-type
+		$newPath 			= $this->basePath . 'content' . $folderPath . DIRECTORY_SEPARATOR . $newOrder . '-' . $item->name;
 		
 		if($item->elementType == 'folder')
 		{
-			$newName		= $newOrder . '-' . $item->name;			
+			$oldPath = $this->basePath . 'content' . $item->path;
+			if(@rename($oldPath, $newPath))
+			{
+				return true;
+			}
+			return false;
+		}
+		
+		# create old path but without filetype
+		$oldPath		= substr($item->path, 0, strpos($item->path, "."));
+		$oldPath		= $this->basePath . 'content' . $oldPath;
+				
+		$result 		= true;
+		
+		foreach($filetypes as $filetype)
+		{
+			$oldFilePath = $oldPath . '.' . $filetype;
+			$newFilePath = $newPath . '.' . $filetype;
+			
+			#check if file with filetype exists and rename
+			if($oldFilePath != $newFilePath && file_exists($oldFilePath))
+			{
+				if(@rename($oldFilePath, $newFilePath))
+				{
+					$result = $result;
+				}
+				else
+				{
+					$result = false;
+				}
+			}
+		}
+
+		return $result;
+		
+		/*
+		if($item->elementType == 'folder')
+		{
+			$newName		= $newOrder . '-' . $item->name;
 		}
 		else
 		{
@ -97,12 +139,22 @@ class Write
 		
 		$oldPath			= $this->basePath . 'content' . $item->path;
 		$newPath 			= $this->basePath . 'content' . $folderPath . DIRECTORY_SEPARATOR . $newName;
-		
+
 		if(@rename($oldPath, $newPath))
 		{
 			$result = true;
 		}
 		
+		foreach($filetypes as $filetype)
+		{
+			#check if file exists
+			if(file_exists($oldPath))
+			{
+
+			}
+		}
+		
+		
 		# if it is a txt file, check, if there is a corresponding .md file and move it
 		if($result && $item->elementType == 'file' && $item->fileType == 'txt')
 		{
@ -124,5 +176,7 @@ class Write
 		}
 		
 		return $result;
+		*/
+		
 	}
 }
--- a/system/Settings.php
+++ b/system/Settings.php
@ -43,7 +43,7 @@ class Settings
 			'contentFolder'							=> 'content',
 			'cache'									=> true,
 			'cachePath'								=> $rootPath . 'cache',
-			'version'								=> '1.2.3',
+			'version'								=> '1.2.4',
 			'setup'									=> true,
 			'welcome'								=> true
 		];
--- a/system/author/css/style.css
+++ b/system/author/css/style.css
@ -3,11 +3,21 @@
 **********************/

 a, a:link, a:visited, a:focus, a:hover, a:active, button, .button, input, .control-group, .sidebar-menu, .sidebar-menu--content, .menu-action, .button-arrow{
-	-webkit-transition: all 0.2s ease;
-	-moz-transition: all 0.2s ease;
-	-o-transition: all 0.2s ease;
-	-ms-transition: all 0.2s ease;
-	transition: all 0.2s ease;
+	-webkit-transition: color 0.2s ease;
+	-moz-transition: color 0.2s ease;
+	-o-transition: color 0.2s ease;
+	-ms-transition: color 0.2s ease;
+	transition: color 0.2s ease;
+	-webkit-transition: background-color 0.2s ease;
+	-moz-transition: background-color 0.2s ease;
+	-o-transition: background-color 0.2s ease;
+	-ms-transition: background-color 0.2s ease;
+	transition: border-color 0.2s ease;	
+	-webkit-transition: border-color 0.2s ease;
+	-moz-transition: border-color 0.2s ease;
+	-o-transition: border-color 0.2s ease;
+	-ms-transition: border-color 0.2s ease;
+	transition: border-color 0.2s ease;		
 }
 .navi-item a, .navi-item.folder a i, .navi-item.file a i{
 	-webkit-transition: all 0.1s ease;
@ -1185,6 +1195,7 @@ label .help, .label .help{
 	position: absolute;
 	background: #e0474c;
 	color: #fff;
+	font-size: 0.9em;
 	width: 100%;
 	left: 0;
 	top: -25px;
--- a/system/author/editor/editor.twig
+++ b/system/author/editor/editor.twig
@ -28,7 +28,7 @@
 					
 				<div class="buttonset" id="publishController" data-published="{{ item.published }}" data-drafted="{{ item.drafted }}">
 					<div v-if="errors.message" class="message error">${ errors.message }</div>
-					<button @click.prevent="saveDraft" :class="draftResult" :disabled="draftDisabled"><span class="desktop">Save&nbsp;</span>Draft</button><button @click.prevent="publishDraft" :class="publishResult" :disabled="publishDisabled">Publish</button>
+					<button @click.prevent="saveDraft" id="draft" :class="draftResult" :disabled="draftDisabled"><span class="desktop">Save&nbsp;</span>Draft</button><button @click.prevent="publishDraft" id="publish" :class="publishResult" :disabled="publishDisabled">Publish</button>
 					<div class="secondary">
 						<div class="secondary--block">
 							<button @click.prevent="depublishArticle" class="button--secondary button--secondary__hightlight" :disabled="publishStatus"><span class="desktop">${publishLabel}</span><span class="mobile">ON</span></button><button @click.prevent="showModal" class="button--secondary"><span class="desktop">delete</span><span class="mobile">X</mobile></button>
--- a/system/author/js/author.js
+++ b/system/author/js/author.js
@ -45,7 +45,7 @@
 		return xhr;
 	}
 	
-	function sendJson(callback, getPost, url, jsonData, cors = false)
+	function sendJson(callback, getPost, url, jsonData, cors)
 	{
 		if(cors)
 		{
--- a/system/author/js/vue-editor.js
+++ b/system/author/js/vue-editor.js
@ -25,7 +25,7 @@ let editor = new Vue({
 		publishStatus: document.getElementById("publishController").dataset.published ? false : true,
 		publishLabel: document.getElementById("publishController").dataset.published ? "online" : "offline",
 	},
-	mounted(){
+	mounted: function(){
 		autosize(document.querySelector('textarea'));
 	},
 	methods: {
@ -50,6 +50,12 @@ let editor = new Vue({

 			sendJson(function(response, httpStatus)
 			{
+				if(httpStatus == 400)
+				{
+					self.publishDisabled 	= false;
+					self.publishResult 		= "fail";
+					self.errors.message 	= "You are probably logged out. Please backup your changes, login and then try again."
+				}
 				if(response)
 				{					
 					var result = JSON.parse(response);
@ -107,6 +113,12 @@ let editor = new Vue({
 		},
 		depublishArticle: function(e){
 		
+			if(this.draftDisabled == false)
+			{
+				this.errors.message = 'Please save your changes as draft first.';
+				return;
+			}
+			
 			var self = this;
 			self.errors = {title: false, content: false, message: false};

--- a/system/author/js/vue-navi.js
+++ b/system/author/js/vue-navi.js
@ -3,23 +3,24 @@ const navcomponent = Vue.component('navigation', {
 	props: ['name', 'parent', 'active', 'filetype', 'element', 'folder', 'level', 'url', 'root', 'freeze'],
 	methods: {
 		checkMove : function(evt)
-		{
+		{			
 			if(evt.dragged.classList.contains('folder') && evt.from.parentNode.id != evt.to.parentNode.id)
 			{
 				return false;				
 			}
+			if(evt.dragged.firstChild.className == 'active' && !editor.draftDisabled)
+			{
+				editor.errors.message = "Please save your changes before you move the file";
+				return false;
+			}
 			return true;
 		},
-		onStart(evt)
+		onStart : function(evt)
 		{
 			/* delete error messages if exist */
-			var errorMessages = document.getElementById("navi-errors");
-			if(errorMessages)
-			{
-				errorMessages.parentNode.removeChild(errorMessages);
-			}
+			editor.errors.message = false;
 		},
-		onEnd(evt)
+		onEnd : function(evt)
 		{
 			var locator = {
 				'item_id': 			evt.item.id,
@ -57,12 +58,7 @@ const navcomponent = Vue.component('navigation', {
 					
 					if(result.errors)
 					{
-						var publishController 	= document.getElementById("publishController");
-						var errorMessage 		= document.createElement("div");
-						errorMessage.id			= "navi-errors";
-						errorMessage.className 	= "message error";
-						errorMessage.innerHTML	= result.errors;
-						publishController.insertBefore(errorMessage, publishController.childNodes[0]); 
+						editor.errors.message = result.errors;
 					}
 					if(result.url)
 					{
@ -111,7 +107,7 @@ const navcomponent = Vue.component('navigation', {
 let navi = new Vue({
 	el: "#navi",
 	components: {
-		navcomponent
+		'navcomponent': navcomponent,
 	},
 	data: {
 		title: "Navigation",
@ -121,10 +117,10 @@ let navi = new Vue({
 		modalWindow: "modal hide",		
 	},
 	methods:{
-		onStart(evt){
+		onStart: function(evt){
 			this.$refs.draggit[0].onStart(evt);			
 		},
-		onEnd(evt){
+		onEnd: function(evt){
 			this.$refs.draggit[0].onEnd(evt);
 		},
 		showModal: function(e){
--- a/system/author/partials/aside.twig
+++ b/system/author/partials/aside.twig
@ -3,16 +3,16 @@
 		<div id="mobile-menu" class="menu-action">Menu <span class="button-arrow"></span></div>
 		<h3>Settings</h3>
 		<ul class="menu-list margin-bottom">
-			<li class="menu-item"><a href="{{ path_for('settings.show') }}"{{ (route == 'settings.show') ? 'class="active"' : '' }}>System</a></li>
-			<li class="menu-item"><a href="{{ path_for('themes.show') }}"{{ (route == 'themes.show') ? 'class="active"' : '' }}>Themes</a></li>
-			<li class="menu-item"><a href="{{ path_for('plugins.show') }}"{{ (route == 'plugins.show') ? 'class="active"' : '' }}>Plugins</a></li>
+			<li class="menu-item"><a href="{{ path_for('settings.show') }}"{{ (route == 'settings.show') ? ' class="active"' : '' }}>System</a></li>
+			<li class="menu-item"><a href="{{ path_for('themes.show') }}"{{ (route == 'themes.show') ? ' class="active"' : '' }}>Themes</a></li>
+			<li class="menu-item"><a href="{{ path_for('plugins.show') }}"{{ (route == 'plugins.show') ? ' class="active"' : '' }}>Plugins</a></li>
 		</ul>
 		<h3>Users</h3>
 		<ul class="menu-list">
-			<li class="menu-item"><a href="{{ path_for('user.list') }}"{{ (route == 'user.list') ? 'class="active"' : '' }}>All users</a></li>
-			<li class="menu-item"><a href="{{ path_for('user.new') }}"{{  (route == 'user.new') ? 'class="active"' : '' }}>Create user</a></li>
+			<li class="menu-item"><a href="{{ path_for('user.list') }}"{{ (route == 'user.list') ? ' class="active"' : '' }}>All users</a></li>
+			<li class="menu-item"><a href="{{ path_for('user.new') }}"{{  (route == 'user.new') ? ' class="active"' : '' }}>Create user</a></li>
 			{% for user in users %}
-				<li class="menu-item"><a href="{{ path_for('user.show', {'username' : user }) }}"{{ (username == user) ? 'class="active"' : '' }}>{{ user }}</a></li>
+				<li class="menu-item"><a href="{{ path_for('user.show', {'username' : user }) }}"{{ (username == user) ? ' class="active"' : '' }}>{{ user }}</a></li>
 			{% endfor %}
 		</ul>
 	{% endif %}
--- a/themes/typemill/css/fontello/config.json
+++ b/themes/typemill/css/fontello/config.json
@ -12,12 +12,6 @@
      "code": 59392,
      "src": "fontawesome"
    },
-    {
-      "uid": "cc399e4597f157dcbf016be0b7407fea",
-      "css": "pinterest",
-      "code": 62001,
-      "src": "fontawesome"
-    },
    {
      "uid": "e9107949dd6c9e8ab2b29ae07156e38c",
      "css": "linkedin",
@ -25,9 +19,9 @@
      "src": "fontawesome"
    },
    {
-      "uid": "8e04c98c8f5ca0a035776e3001ad2638",
-      "css": "facebook",
-      "code": 61594,
+      "uid": "11ebb30e17efcd988a228ade5d3e8c74",
+      "css": "xing",
+      "code": 61800,
      "src": "fontawesome"
    },
    {
@ -43,9 +37,9 @@
      "src": "fontawesome"
    },
    {
-      "uid": "11ebb30e17efcd988a228ade5d3e8c74",
-      "css": "xing",
-      "code": 61800,
+      "uid": "8e04c98c8f5ca0a035776e3001ad2638",
+      "css": "facebook",
+      "code": 61594,
      "src": "fontawesome"
    },
    {
@ -59,6 +53,12 @@
      "css": "right-open-big",
      "code": 59394,
      "src": "entypo"
+    },
+    {
+      "uid": "91426c82d94428a33353e495418435e3",
+      "css": "share-1",
+      "code": 59395,
+      "src": "entypo"
    }
  ]
 }
--- a/themes/typemill/css/fontello/css/fontello-codes.css
+++ b/themes/typemill/css/fontello/css/fontello-codes.css
@ -2,9 +2,9 @@
 .icon-mail:before { content: '\e800'; } /* '' */
 .icon-left-open-big:before { content: '\e801'; } /* '' */
 .icon-right-open-big:before { content: '\e802'; } /* '' */
+.icon-share-1:before { content: '\e803'; } /* '' */
 .icon-twitter:before { content: '\f099'; } /* '' */
 .icon-facebook:before { content: '\f09a'; } /* '' */
 .icon-linkedin:before { content: '\f0e1'; } /* '' */
 .icon-xing:before { content: '\f168'; } /* '' */
-.icon-pinterest:before { content: '\f231'; } /* '' */
 .icon-whatsapp:before { content: '\f232'; } /* '' */
--- a/themes/typemill/css/fontello/css/fontello-embedded.css
+++ b/themes/typemill/css/fontello/css/fontello-embedded.css
--- a/themes/typemill/css/fontello/css/fontello-ie7-codes.css
+++ b/themes/typemill/css/fontello/css/fontello-ie7-codes.css
@ -2,9 +2,9 @@
 .icon-mail { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe800;&nbsp;'); }
 .icon-left-open-big { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe801;&nbsp;'); }
 .icon-right-open-big { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe802;&nbsp;'); }
+.icon-share-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe803;&nbsp;'); }
 .icon-twitter { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf099;&nbsp;'); }
 .icon-facebook { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09a;&nbsp;'); }
 .icon-linkedin { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e1;&nbsp;'); }
 .icon-xing { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf168;&nbsp;'); }
-.icon-pinterest { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf231;&nbsp;'); }
 .icon-whatsapp { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf232;&nbsp;'); }
--- a/themes/typemill/css/fontello/css/fontello-ie7.css
+++ b/themes/typemill/css/fontello/css/fontello-ie7.css
@ -13,9 +13,9 @@
 .icon-mail { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe800;&nbsp;'); }
 .icon-left-open-big { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe801;&nbsp;'); }
 .icon-right-open-big { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe802;&nbsp;'); }
+.icon-share-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xe803;&nbsp;'); }
 .icon-twitter { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf099;&nbsp;'); }
 .icon-facebook { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf09a;&nbsp;'); }
 .icon-linkedin { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf0e1;&nbsp;'); }
 .icon-xing { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf168;&nbsp;'); }
-.icon-pinterest { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf231;&nbsp;'); }
 .icon-whatsapp { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '&#xf232;&nbsp;'); }
--- a/themes/typemill/css/fontello/css/fontello.css
+++ b/themes/typemill/css/fontello/css/fontello.css
@ -1,11 +1,11 @@
@font-face {
  font-family: 'fontello';
-  src: url('../font/fontello.eot?12750869');
-  src: url('../font/fontello.eot?12750869#iefix') format('embedded-opentype'),
-       url('../font/fontello.woff2?12750869') format('woff2'),
-       url('../font/fontello.woff?12750869') format('woff'),
-       url('../font/fontello.ttf?12750869') format('truetype'),
-       url('../font/fontello.svg?12750869#fontello') format('svg');
+  src: url('../font/fontello.eot?45966989');
+  src: url('../font/fontello.eot?45966989#iefix') format('embedded-opentype'),
+       url('../font/fontello.woff2?45966989') format('woff2'),
+       url('../font/fontello.woff?45966989') format('woff'),
+       url('../font/fontello.ttf?45966989') format('truetype'),
+       url('../font/fontello.svg?45966989#fontello') format('svg');
  font-weight: normal;
  font-style: normal;
 }
@ -15,7 +15,7 @@
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
-    src: url('../font/fontello.svg?12750869#fontello') format('svg');
+    src: url('../font/fontello.svg?45966989#fontello') format('svg');
  }
 }
 */
@ -58,9 +58,9 @@
 .icon-mail:before { content: '\e800'; } /* '' */
 .icon-left-open-big:before { content: '\e801'; } /* '' */
 .icon-right-open-big:before { content: '\e802'; } /* '' */
+.icon-share-1:before { content: '\e803'; } /* '' */
 .icon-twitter:before { content: '\f099'; } /* '' */
 .icon-facebook:before { content: '\f09a'; } /* '' */
 .icon-linkedin:before { content: '\f0e1'; } /* '' */
 .icon-xing:before { content: '\f168'; } /* '' */
-.icon-pinterest:before { content: '\f231'; } /* '' */
 .icon-whatsapp:before { content: '\f232'; } /* '' */
--- a/themes/typemill/css/fontello/demo.html
+++ b/themes/typemill/css/fontello/demo.html
@ -229,11 +229,11 @@ body {
 }
@font-face {
      font-family: 'fontello';
-      src: url('./font/fontello.eot?21630130');
-      src: url('./font/fontello.eot?21630130#iefix') format('embedded-opentype'),
-           url('./font/fontello.woff?21630130') format('woff'),
-           url('./font/fontello.ttf?21630130') format('truetype'),
-           url('./font/fontello.svg?21630130#fontello') format('svg');
+      src: url('./font/fontello.eot?98470540');
+      src: url('./font/fontello.eot?98470540#iefix') format('embedded-opentype'),
+           url('./font/fontello.woff?98470540') format('woff'),
+           url('./font/fontello.ttf?98470540') format('truetype'),
+           url('./font/fontello.svg?98470540#fontello') format('svg');
      font-weight: normal;
      font-style: normal;
    }
@ -301,13 +301,13 @@ body {
        <div class="the-icons span3" title="Code: 0xe800"><i class="demo-icon icon-mail">&#xe800;</i> <span class="i-name">icon-mail</span><span class="i-code">0xe800</span></div>
        <div class="the-icons span3" title="Code: 0xe801"><i class="demo-icon icon-left-open-big">&#xe801;</i> <span class="i-name">icon-left-open-big</span><span class="i-code">0xe801</span></div>
        <div class="the-icons span3" title="Code: 0xe802"><i class="demo-icon icon-right-open-big">&#xe802;</i> <span class="i-name">icon-right-open-big</span><span class="i-code">0xe802</span></div>
-        <div class="the-icons span3" title="Code: 0xf099"><i class="demo-icon icon-twitter">&#xf099;</i> <span class="i-name">icon-twitter</span><span class="i-code">0xf099</span></div>
+        <div class="the-icons span3" title="Code: 0xe803"><i class="demo-icon icon-share-1">&#xe803;</i> <span class="i-name">icon-share-1</span><span class="i-code">0xe803</span></div>
      </div>
      <div class="row">
+        <div class="the-icons span3" title="Code: 0xf099"><i class="demo-icon icon-twitter">&#xf099;</i> <span class="i-name">icon-twitter</span><span class="i-code">0xf099</span></div>
        <div class="the-icons span3" title="Code: 0xf09a"><i class="demo-icon icon-facebook">&#xf09a;</i> <span class="i-name">icon-facebook</span><span class="i-code">0xf09a</span></div>
        <div class="the-icons span3" title="Code: 0xf0e1"><i class="demo-icon icon-linkedin">&#xf0e1;</i> <span class="i-name">icon-linkedin</span><span class="i-code">0xf0e1</span></div>
        <div class="the-icons span3" title="Code: 0xf168"><i class="demo-icon icon-xing">&#xf168;</i> <span class="i-name">icon-xing</span><span class="i-code">0xf168</span></div>
-        <div class="the-icons span3" title="Code: 0xf231"><i class="demo-icon icon-pinterest">&#xf231;</i> <span class="i-name">icon-pinterest</span><span class="i-code">0xf231</span></div>
      </div>
      <div class="row">
        <div class="the-icons span3" title="Code: 0xf232"><i class="demo-icon icon-whatsapp">&#xf232;</i> <span class="i-name">icon-whatsapp</span><span class="i-code">0xf232</span></div>
--- a/themes/typemill/css/fontello/font/fontello.eot
+++ b/themes/typemill/css/fontello/font/fontello.eot
--- a/themes/typemill/css/fontello/font/fontello.svg
+++ b/themes/typemill/css/fontello/font/fontello.svg
@ -12,6 +12,8 @@

 <glyph glyph-name="right-open-big" unicode="&#xe802;" d="M13-20l358 370-358 372q-26 26 0 48 26 26 48 0l392-394q24-26 0-50l-392-394q-22-26-48 0-26 22 0 48z" horiz-adv-x="465" />

+<glyph glyph-name="share-1" unicode="&#xe803;" d="M650 200q62 0 106-43t44-107q0-62-44-106t-106-44-106 44-44 106q0 6 1 14t1 12l-260 156q-42-32-92-32-62 0-106 44t-44 106 44 106 106 44q54 0 92-30l260 156q0 4-1 12t-1 12q0 62 44 106t106 44 106-43 44-107q0-62-44-106t-106-44q-52 0-90 32l-262-156q2-8 2-26 0-16-2-24l262-156q36 30 90 30z" horiz-adv-x="800" />
+
 <glyph glyph-name="twitter" unicode="&#xf099;" d="M904 622q-37-54-90-93 0-8 0-23 0-73-21-145t-64-139-103-117-144-82-181-30q-151 0-276 81 19-2 43-2 126 0 224 77-59 1-105 36t-64 89q19-3 34-3 24 0 48 6-63 13-104 62t-41 115v2q38-21 82-23-37 25-59 64t-22 86q0 49 25 91 68-83 164-133t208-55q-5 21-5 41 0 75 53 127t127 53q79 0 132-57 61 12 115 44-21-64-80-100 52 6 104 28z" horiz-adv-x="928.6" />

 <glyph glyph-name="facebook" unicode="&#xf09a;" d="M535 843v-147h-87q-48 0-65-20t-17-60v-106h164l-22-165h-142v-424h-171v424h-142v165h142v122q0 104 58 161t155 57q82 0 127-7z" horiz-adv-x="571.4" />
@ -20,8 +22,6 @@

 <glyph glyph-name="xing" unicode="&#xf168;" d="M333 478q-5-10-143-255-15-25-36-25h-134q-12 0-17 9t0 20l141 250q1 0 0 1l-90 156q-7 12 0 20 5 9 17 9h134q22 0 37-26z m450 358q6-9 0-21l-295-521v0l188-344q6-11 0-20-5-9-17-9h-134q-23 0-37 25l-189 348q10 18 296 525 14 25 36 25h135q12 0 17-8z" horiz-adv-x="785.7" />

-<glyph glyph-name="pinterest" unicode="&#xf231;" d="M0 517q0 60 21 113t58 93 85 69 103 44 113 14q88 0 164-37t123-108 47-160q0-54-10-105t-34-99-56-83-80-58-106-21q-38 0-75 18t-54 49q-5-22-15-63t-14-53-11-40-15-39-17-35-26-44-35-48l-7-3-5 6q-9 88-9 105 0 51 12 115t37 161 29 113q-18 36-18 94 0 47 29 87t74 41q34 0 53-23t19-57q0-37-24-106t-25-105q0-35 25-58t61-23q31 0 57 14t44 38 31 53 21 61 11 62 4 56q0 96-61 150t-160 54q-111 0-186-72t-75-183q0-25 7-48t15-36 15-26 7-17q0-15-8-40t-21-25q-1 0-9 1-29 9-51 31t-34 53-18 60-6 60z" horiz-adv-x="714.3" />
-
 <glyph glyph-name="whatsapp" unicode="&#xf232;" d="M550 307q7 0 54-25t50-30q1-2 1-8 0-18-9-42-9-22-40-37t-57-15q-32 0-106 35-55 25-95 66t-82 103q-41 60-40 108v5q2 50 41 88 14 12 29 12 4 0 10-1t11-1q11 0 15-3t8-16q5-11 19-49t14-41q0-12-19-33t-20-26q0-3 3-8 19-41 57-76 31-30 84-57 7-4 13-4 8 0 30 27t29 28z m-114-296q71 0 136 28t112 74 75 112 28 136-28 136-75 112-112 75-136 28-135-28-112-75-75-112-28-136q0-113 67-205l-44-130 135 43q88-58 192-58z m0 771q86 0 164-34t134-89 90-135 33-163-33-163-90-134-134-90-164-34q-108 0-203 53l-233-75 76 226q-60 99-60 217 0 86 33 163t90 135 134 89 163 34z" horiz-adv-x="857.1" />
 </font>
 </defs>
--- a/themes/typemill/css/fontello/font/fontello.ttf
+++ b/themes/typemill/css/fontello/font/fontello.ttf
--- a/themes/typemill/css/fontello/font/fontello.woff
+++ b/themes/typemill/css/fontello/font/fontello.woff
--- a/themes/typemill/css/fontello/font/fontello.woff2
+++ b/themes/typemill/css/fontello/font/fontello.woff2
--- a/themes/typemill/css/style.css
+++ b/themes/typemill/css/style.css
@ -2,7 +2,7 @@
 *  	TRANSITIONS		  *
 **********************/

-a, a:link, a:visited, a:focus, a:hover, a:active, button, .button{
+a, a:link, a:visited, a:focus, a:hover, a:active, button, .button, .share-link, .open .share-link{
 	-webkit-transition: all 0.2s ease;
 	-moz-transition: all 0.2s ease;
 	-o-transition: all 0.2s ease;
@ -587,54 +587,40 @@ li.h2, li.h3, li.h4, li.h5, li.h6
 }

 /************************
-*  		GitHub Ribbon	*
+*  		Share Buttons	*
 ************************/

-.share-box{
-	width:100%;
-	display: inline-block;
-	vertical-align:top;
-	box-sizing:border-box;
-	background: transparent;
-	overflow:hidden;
-	height: auto;
-}
-.share-button{
-	display:inline-block;
-	height: auto;
-	text-align: center;
-}
-.grid-1 .share-button{ width: 100%; }
-.grid-2 .share-button{ width: 49.7%; }
-.grid-3 .share-button{ width: 33.2%; }
-.grid-4 .share-button{ width: 24.9%; }
-.grid-5 .share-button{ width: 19.9%; }
-.grid-6 .share-button{ width: 16.5%; }
-.share-button a,.share-button a:link,.share-button a:visited{
-	display: block;
+.meta-info{
+	position: relative;
+	display: inline-block; 
 	width: 100%;
-	background: transparent;
+}
+.meta-info .share-icons{
+	position: absolute;
+	right: 0px;
+	display: inline-block;
+	background: #fff;
+}
+.meta-info .share-link, .meta-info .share-button{
+	display: inline-block;
+	text-align: right;
+}
+.meta-info .hide .share-link{
+	width: 0px;
+	opacity: 1;
+}
+.meta-info .hide .share-link a{
 	color: #fff;
-	font-size: 1.3em;
-	line-height: 1.7em;
 }
-.share-button.twitter a{
-	background:#C8E0EF;
+.meta-info .show .share-link{
+	width: 30px;
+	opacity: 1;
 }
-.share-button.twitter a:hover{
-	background:#1DA1F2;
+.share-link{
+	transition: width 0.25s ease out;
 }
-.share-button.facebook a{
-	background:#CDD3DE;
-}
-.share-button.facebook a:hover{
-	background: #3B5998;
-}
-.share-button.xing a{
-	background: #E8EBC3;
-}
-.share-button.xing a:hover{
-	background: #cfdc00;
+.share-icons .share-button{
+	cursor: pointer;
 }

 /* for test only */
@ -736,6 +722,9 @@ img.myClass{
 		width: 19%;
 		text-align: right;
 	}
+	.meta-info .show .share-link{
+		width: 40px;
+	}
 }
@media only screen and (min-width: 980px) {
 	header p{
--- a/themes/typemill/page.twig
+++ b/themes/typemill/page.twig
@ -5,17 +5,50 @@
 {% endif %}

 <h1>{{ title }}</h1>
-	
+
+{% if (settings.themes.typemill.socialPosition.top or settings.themes.typemill.modifiedPosition.top or settings.themes.typemill.authorPosition.top) %}	
+	<div class="meta-info">
+		{% if settings.themes.typemill.authorPosition.top %}
+			<small>{{ settings.themes.typemill.authorIntro }}: {{ settings.author }}</small>
+		{% endif %}
+		{% if settings.themes.typemill.modifiedPosition.top %}
+			<small>{{ settings.themes.typemill.modifiedText }}: {{ item.modified|date(settings.themes.typemill.modifiedFormat) }}</small>
+		{% endif %}
+		{% if settings.themes.typemill.socialPosition.top %}
+			<div id="share-icons" class="share-icons hide">
+				{% include 'partials/share.twig' with {'share' : settings.themes.typemill.socialButtons } %}
+				<div class="share-button" id="share-button">
+					<i class="icon-share-1"></i>
+				</div>
+			</div>
+		{% endif %}
+	</div>
+{% endif %}
+
 {{ content }}

-{% if settings.themes.typemill.modified %}
-	<p><small>{{ settings.themes.typemill.modifiedText }}: {{ item.modified|date(settings.themes.typemill.modifiedFormat) }}</small></p>
+
+{% if (settings.themes.typemill.socialPosition.bottom or settings.themes.typemill.modifiedPosition.bottom or settings.themes.typemill.authorPosition.bottom) %}	
+	<div class="meta-info">
+		{% if settings.themes.typemill.authorPosition.bottom %}
+			<small>{{ settings.themes.typemill.authorIntro }}: {{ settings.author }}</small>
+		{% endif %}
+		{% if settings.themes.typemill.modifiedPosition.bottom %}
+			<small>{{ settings.themes.typemill.modifiedText }}: {{ item.modified|date(settings.themes.typemill.modifiedFormat) }}</small>
+		{% endif %}
+		{% if settings.themes.typemill.socialPosition.bottom %}
+			<div id="share-icons-bottom" class="share-icons hide">
+				{% include 'partials/share.twig' with {'share' : settings.themes.typemill.socialButtons } %}
+				<div id="share-button-bottom" class="share-button">
+					<i class="icon-share-1"></i>
+				</div>
+			</div>
+		{% endif %}
+	</div>
 {% endif %}

-{% if settings.themes.typemill.social %}	
-	{% include 'partials/share.twig' with {'share' : settings.themes.typemill.socialbuttons } %}
-{% endif %}
-	
+
+
 {% if item.prevItem or item.nextItem %}

 	<div class="paging">
@ -27,4 +60,4 @@
 		{% endif %}
 	</div>

-{% endif %}	
+{% endif %}
--- a/themes/typemill/partials/footer.twig
+++ b/themes/typemill/partials/footer.twig
@ -5,4 +5,4 @@
    {% set copyrightYears = settings.year ~ ' - ' ~ nowYear %}
 {% endif %}

-<div class="copyrightLine"><p>{{ settings.copyright }} by {{ settings.author }}, {{ copyrightYears }}. All Rights Reserved. Built with <a href="http://typemill.net">TYPEMILL</a>.</p></div>
+<div class="copyrightLine"><p>{{ settings.copyright }} by {{ settings.author }}, {{ copyrightYears }}. All Rights Reserved. Built with <a href="https://typemill.net">TYPEMILL</a>.</p></div>
--- a/themes/typemill/partials/layout.twig
+++ b/themes/typemill/partials/layout.twig
@ -73,6 +73,40 @@
 						}
 					});
 				}
+				
+				var shareButton = document.getElementById("share-button");
+				var	shareIcons = document.getElementById("share-icons");
+					
+				if(shareButton)
+				{
+					shareButton.addEventListener("click", function(){
+						if(shareIcons.className == "share-icons show")
+						{
+							shareIcons.className = "share-icons hide";
+						}
+						else
+						{
+							shareIcons.className = "share-icons show";
+						}
+					});
+				}
+				
+				var shareButtonBottom = document.getElementById("share-button-bottom");
+				var	shareIconsBottom = document.getElementById("share-icons-bottom");
+
+				if(shareButtonBottom)
+				{
+					shareButtonBottom.addEventListener("click", function(){
+						if(shareIconsBottom.className == "share-icons show")
+						{
+							shareIconsBottom.className = "share-icons hide";
+						}
+						else
+						{
+							shareIconsBottom.className = "share-icons show";
+						}
+					});
+				}
 			</script>
 			
 			{{ assets.renderJS() }}
--- a/themes/typemill/partials/share.twig
+++ b/themes/typemill/partials/share.twig
@ -1,11 +1,15 @@
-	<div class="share-box grid-{{ share|length }}">
-		{% if share.twitter %}
-			<div class="share-button twitter">
+{% if share.twitter %}
+		<div class="share-link twitter">
 				<a href="https://twitter.com/intent/tweet?source=webclient&text='{{ title|url_encode }}:{{ description|url_encode }}&url={{ item.urlAbs }}" target="_blank"><i class="icon-twitter"></i></a>
-			</div>{% endif %}{% if share.facebook %}<div class="share-button facebook">
+		</div>{% endif %}{% if share.facebook %}<div class="share-link facebook">
 				<a href="https://facebook.com/sharer/sharer.php?u={{ item.urlAbs }}&t={{ title|url_encode }}" target="_blank"><i class="icon-facebook"></i></a>
-			</div>{% endif %}{% if share.xing %}<div class="share-button xing">
+		</div>{% endif %}{% if share.xing %}<div class="share-link xing">
 				<a href="https://www.xing.com/spi/shares/new?url={{ item.urlAbs }}" target="_blank"><i class="icon-xing"></i></a>
-			</div>
-		{% endif %}
-	</div>
+		</div>{% endif %}{% if share.linkedin %}<div class="share-link linkedin">
+				<a href="https://www.linkedin.com/shareArticle?mini=true&url={{ item.urlAbs }}&title={{ title|url_encode }}" target="_blank"><i class="icon-linkedin"></i></a>
+		</div>{% endif %}{% if share.whatsapp %}<div class="share-link whatsapp">
+				<a href="whatsapp://send?text={{ item.urlAbs }}" target="_blank"><i class="icon-whatsapp"></i></a>
+		</div>{% endif %}{% if share.mail %}<div class="share-link mail">
+				<a href="mailto:?subject={{ title|url_encode }}&amp;body={{ item.urlAbs }}" target="_blank"><i class="icon-mail"></i></a>
+		</div>
+{% endif %}
--- a/themes/typemill/typemill.yaml
+++ b/themes/typemill/typemill.yaml
@ -1,8 +1,8 @@
 name: Typemill Theme
-version: 1.0.9
+version: 1.1.0
 description: The standard theme for Typemill. Responsive, minimal and without any dependencies. It uses the system fonts Calibri and Helvetica. No JavaScript is used. 
 author: Sebastian Schürmanns
-homepage: http://typemill.net
+homepage: https://typemill.net
 licence: MIT

 settings:
@ -11,6 +11,7 @@ settings:
  modified: true
  modifiedText: 'Last updated'
  modifiedFormat: 'd.m.Y'
+  authorIntro: 'Author'

 forms:
  fields:
@ -27,14 +28,32 @@ forms:
      placeholder: Add Label for Start-Button
      required: true

+    fieldset0:
+      type: fieldset
+      legend: Author
+      fields:
+        authorPosition:
+          type: checkboxlist
+          label: Position of Author
+          options:
+            top: Top
+            bottom: Bottom
+
+        authorIntro:
+          type: text
+          label: Author Intro
+          placeholder: Author
+
    fieldset1:
      type: fieldset
      legend: Last Modified
      fields:
-        modified:
-          type: checkbox
-          label: Activate Last Modified
-          description: Show last modified date at the end of each page?
+        modifiedPosition:
+          type: checkboxlist
+          label: Position of Modified Text
+          options:
+            top: Top
+            bottom: Bottom

        modifiedText:
          type: text
@ -53,15 +72,20 @@ forms:
      type: fieldset
      legend: Share
      fields:
-        social:
-          type: checkbox
-          label: Activate Share
-          description: Activate Share Buttons On Page?
+        socialPosition:
+          type: checkboxlist
+          label: Position of Share-Buttons
+          options:
+            top: Top
+            bottom: Bottom

-        socialbuttons:
+        socialButtons:
          type: checkboxlist
          label: Select Share Buttons
          options:
            facebook: Facebook
            twitter: Twitter
-            xing: Xing
+            xing: Xing
+            linkedin: Linkedin
+            whatsapp: WhatsApp
+            mail: Mail
				`@ -0,0 +1 @@`
				["# Quick Start for Writers","You are a pro and don't want to read the whole manual? No problem, this is a quick overview:","- Setup: Login to your system and setup the system, the themes and the plugins in the author panel.\n- Content: Organize your content in folders and markdown files and put them in the `\\content` folder of TYPEMILL. \n- Markdown: Use the Markdown syntax for your content files. Markdown Extra (e.g. tables, footnotes) is supported, too.\n- Naming conventions: Use prefixes like `01-` or `aa_` to sort your folders and files.\n- Index files: Add an `index.md` file to a folder to create content for the folder itself.\n- F5: After some changes, use the `F5` key to refresh the navigation manually.\n- Lean back and let TYPEMILL create a nice website for you.","\nThe TYPEMILL system ships with this user manual in the content folder. Check how the files are written and how the folders are organized."]