Merge branch 'version1219'

plugins/math/math.php

@@ -33,7 +33,7 @@ class Math extends Plugin
 
 		if($mathSettings['tool'] == 'katex')
 		{
-			$this->addJS('/math/public/katex.min.js');
+			$this->addJS('/math/public/katex.min.js'); 
 			$this->addJS('/math/public/auto-render.min.js');
 			$this->addCSS('/math/public/katex.min.css');
 
@@ -43,5 +43,14 @@ class Math extends Plugin
 				$this->addInlineJs('renderMathInElement(document.body);');
 			}
 		}
+
+		# add math to the blox editor configuration
+
+		$this->addEditorJS('/math/public/math.js');
+		$this->addSvgSymbol('<symbol id="icon-omega" viewBox="0 0 32 32">
+			<title>omega</title>
+			<path d="M22 28h8l2-4v8h-12v-6.694c4.097-1.765 7-6.161 7-11.306 0-6.701-4.925-11.946-11-11.946s-11 5.245-11 11.946c0 5.144 2.903 9.541 7 11.306v6.694h-12v-8l2 4h8v-1.018c-5.863-2.077-10-7.106-10-12.982 0-7.732 7.163-14 16-14s16 6.268 16 14c0 5.875-4.137 10.905-10 12.982v1.018z"></path>
+			</symbol>');
 	}
+
 }

plugins/math/math.yaml

@@ -1,5 +1,5 @@
 name: Math
-version: 1.0.2
+version: 1.1.0
 description: Adds support for katex and mathjax.
 author: Sebastian Schürmanns
 homepage: https://mathjax.org/

plugins/math/public/math.js

@@ -0,0 +1,54 @@
+determiner.math = function(block,lines,firstChar,secondChar,thirdChar){
+	if( (firstChar == '\\' && secondChar == '[') || (firstChar == '$' && secondChar == '$') )
+	{
+		return "math-component";
+	}
+	return false;
+};
+
+bloxFormats.math = { label: '<svg class="icon icon-omega"><use xlink:href="#icon-omega"></use></svg>', title: 'Math', component: 'math-component' };
+
+formatConfig.push('math');
+
+const mathComponent = Vue.component('math-component', {
+	props: ['compmarkdown', 'disabled'],
+	template: '<div>' + 
+				'<input type="hidden" ref="markdown" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown" />' +	
+				'<div class="contenttype"><svg class="icon icon-omega"><use xlink:href="#icon-omega"></use></svg></div>' +
+				'<textarea class="mdcontent" ref="markdown" v-model="mathblock" :disabled="disabled" @input="createmarkdown"></textarea>' + 
+				'</div>',
+	data: function(){
+		return {
+			mathblock: ''
+		}
+	},
+	mounted: function(){
+		this.$refs.markdown.focus();
+		if(this.compmarkdown)
+		{
+			var dollarMath = new RegExp(/^\$\$[\S\s]+\$\$$/m);
+			var bracketMath = new RegExp(/^\\\[[\S\s]+\\\]$/m);
+
+			if(dollarMath.test(this.compmarkdown) || bracketMath.test(this.compmarkdown))
+			{
+				var mathExpression = this.compmarkdown.substring(2,this.compmarkdown.length-2);
+				this.mathblock = mathExpression.trim(); 
+			}
+		}
+		this.$nextTick(function () {
+			autosize(document.querySelectorAll('textarea'));
+		});
+	},
+	methods: {
+		createmarkdown: function(event)
+		{
+			this.codeblock = event.target.value;
+			var codeblock = '$$\n' + event.target.value + '\n$$';
+			this.updatemarkdown(codeblock);
+		},
+		updatemarkdown: function(codeblock)
+		{
+			this.$emit('updatedMarkdown', codeblock);
+		},
+	},
+})

system/Assets.php

@@ -8,11 +8,14 @@ class Assets
 	
 	public function __construct($baseUrl)
 	{
-		$this->baseUrl		= $baseUrl;
-		$this->JS 			= array();
-		$this->CSS 			= array();
-		$this->inlineJS		= array();
-		$this->inlineCSS	= array();
+		$this->baseUrl			= $baseUrl;
+		$this->JS 				= array();
+		$this->CSS 				= array();
+		$this->inlineJS			= array();
+		$this->inlineCSS		= array();
+		$this->editorJS 		= array();
+		$this->editorInlineJS 	= array();
+		$this->svgSymbols		= array();
 	}
 	
 	public function addCSS($CSS)
@@ -75,6 +78,11 @@ class Assets
 		}
 	}
 
+	public function addSvgSymbol($symbol)
+	{
+		$this->svgSymbols[] = $symbol;
+	}
+
 	public function renderCSS()
 	{
 		return implode('', $this->CSS) . implode('', $this->inlineCSS);
@@ -85,6 +93,32 @@ class Assets
 		return implode('', $this->JS) . implode('', $this->inlineJS);
 	}
 
+	public function renderSvg()
+	{
+		return implode('', $this->svgSymbols);
+	}
+
+	# add JS to enhance the blox-editor in author area
+	public function addEditorJS($JS)
+	{
+		$JSfile = $this->getFileUrl($JS);
+		
+		if($JSfile)
+		{
+			$this->editorJS[] = '<script src="' . $JSfile . '"></script>';
+		}
+	}
+
+	public function addEditorInlineJS($JS)
+	{
+		$this->editorInlineJS[] = '<script>' . $JS . '</script>';
+	}
+
+	public function renderEditorJS()
+	{
+		return implode('', $this->editorJS) . implode('', $this->editorInlineJS);
+	}
+
 	/**
 	 * Checks, if a string is a valid internal or external ressource like js-file or css-file
 	 * @params $path string

system/Controllers/AuthController.php

@@ -11,7 +11,7 @@ use Typemill\Models\WriteYaml;
 
 class AuthController extends Controller
 {
-	
+	# redirect if visit /setup route
 	public function redirect(Request $request, Response $response)
 	{
 		if(isset($_SESSION['login']))
@@ -23,6 +23,7 @@ class AuthController extends Controller
 			return $response->withRedirect($this->c->router->pathFor('auth.show'));			
 		}
 	}
+
 	
 	/**
 	* show login form
@@ -125,7 +126,10 @@ class AuthController extends Controller
 					$yaml->updateYaml('settings/users', '.logins', $logins);					
 				}
 
-				return $response->withRedirect($this->c->router->pathFor('content.raw'));
+				$settings = $this->c->get('settings');
+				$editor = (isset($settings['editor']) && $settings['editor'] == 'visual') ? 'visual' : 'raw';
+				
+				return $response->withRedirect($this->c->router->pathFor('content.' . $editor));
 			}
 		}
 

system/Controllers/ContentApiController.php

@@ -180,7 +180,12 @@ class ContentApiController extends ContentController
 		$delete = $this->deleteContentFiles(['txt']);
 
 		# set redirect url to edit page
-		$url = $this->uri->getBaseUrl() . '/tm/content/' . $this->settings['editor'] . $this->item->urlRelWoF;
+
+		$url = $this->uri->getBaseUrl() . '/tm/content/' . $this->settings['editor'];
+		if(isset($this->item->urlRelWoF))
+		{
+			$url = $url . $this->item->urlRelWoF;
+		}
 
 		# remove the unpublished changes
 		$delete = $this->deleteContentFiles(['txt']);

system/Controllers/PageController.php

@@ -174,9 +174,22 @@ class PageController extends Controller
 			}
 		}
 		
-		$route = empty($args) && $settings['startpage'] ? '/cover.twig' : '/index.twig';
 
-		return $this->render($response, $route, array('navigation' => $structure, 'content' => $contentHTML, 'item' => $item, 'breadcrumb' => $breadcrumb, 'settings' => $settings, 'title' => $title, 'description' => $description, 'base_url' => $base_url, 'image' => $firstImage ));
+		$home = empty($args) ? true : false;
+		$theme = $settings['theme'];
+		$route = empty($args) && isset($settings['themes'][$theme]['cover']) ? '/cover.twig' : '/index.twig';
+
+		return $this->render($response, $route, [
+			'home'			=> $home,
+			'navigation' 	=> $structure, 
+			'content' 		=> $contentHTML, 
+			'item' 			=> $item, 
+			'breadcrumb' 	=> $breadcrumb, 
+			'settings' 		=> $settings, 
+			'title' 		=> $title, 
+			'description' 	=> $description, 
+			'base_url' 		=> $base_url, 
+			'image' 		=> $firstImage ]);
 	}
 
 	protected function getCachedStructure($cache)

system/Controllers/SettingsController.php

@@ -15,15 +15,16 @@ class SettingsController extends Controller
 	
 	public function showSettings($request, $response, $args)
 	{
-		$user		= new User();
-		$settings 	= $this->c->get('settings');
-		$copyright	= $this->getCopyright();
-		$languages	= $this->getLanguages();
-		$locale		= isset($_SERVER['HTTP_ACCEPT_LANGUAGE']) ? substr($_SERVER["HTTP_ACCEPT_LANGUAGE"],0,2) : 'en';
-		$users		= $user->getUsers();
-		$route 		= $request->getAttribute('route');
+		$user				= new User();
+		$settings 			= $this->c->get('settings');
+		$defaultSettings	= \Typemill\Settings::getDefaultSettings();
+		$copyright			= $this->getCopyright();
+		$languages			= $this->getLanguages();
+		$locale				= isset($_SERVER['HTTP_ACCEPT_LANGUAGE']) ? substr($_SERVER["HTTP_ACCEPT_LANGUAGE"],0,2) : 'en';
+		$users				= $user->getUsers();
+		$route 				= $request->getAttribute('route');
 		
-		return $this->render($response, 'settings/system.twig', array('settings' => $settings, 'copyright' => $copyright, 'languages' => $languages, 'locale' => $locale, 'users' => $users, 'route' => $route->getName() ));
+		return $this->render($response, 'settings/system.twig', array('settings' => $settings, 'copyright' => $copyright, 'languages' => $languages, 'locale' => $locale, 'formats' => $defaultSettings['formats'] ,'users' => $users, 'route' => $route->getName() ));
 	}
 	
 	public function saveSettings($request, $response, $args)
@@ -41,10 +42,11 @@ class SettingsController extends Controller
 				return $response->withRedirect($this->c->router->pathFor('settings.show'));				
 			}
 			
-			$settings 		= \Typemill\Settings::getUserSettings();
-			$params 		= $request->getParams();
-			$newSettings	= isset($params['settings']) ? $params['settings'] : false;
-			$validate		= new Validation();
+			$settings 			= \Typemill\Settings::getUserSettings();
+			$defaultSettings	= \Typemill\Settings::getDefaultSettings();
+			$params 			= $request->getParams();
+			$newSettings		= isset($params['settings']) ? $params['settings'] : false;
+			$validate			= new Validation();
 
 			if($newSettings)
 			{
@@ -55,13 +57,13 @@ class SettingsController extends Controller
 					'copyright' 	=> $newSettings['copyright'],
 					'year'			=> $newSettings['year'],
 					'language'		=> $newSettings['language'],
-					'startpage' 	=> isset($newSettings['startpage']) ? true : false,
 					'editor' 		=> $newSettings['editor'], 
+					'formats'		=> $newSettings['formats'],
 				);
 				
 				$copyright 			= $this->getCopyright();
 
-				$validate->settings($newSettings, $copyright, 'settings');
+				$validate->settings($newSettings, $copyright, $defaultSettings['formats'], 'settings');
 			}
 			else
 			{

system/Middleware/RedirectIfAuthenticated.php

@@ -10,16 +10,19 @@ class RedirectIfAuthenticated
 {		
 	protected $router;
 	
-	public function __construct(RouterInterface $router)
+	public function __construct(RouterInterface $router, $settings)
 	{
 		$this->router = $router;
+		$this->settings = $settings;
 	}
 
 	public function __invoke(Request $request, Response $response, $next)
 	{
+		$editor = (isset($this->settings['editor']) && $this->settings['editor'] == 'visual') ? 'visual' : 'raw';
+
 		if(isset($_SESSION['login']))
 		{
-			$response = $response->withRedirect($this->router->pathFor('content.raw'));
+			$response = $response->withRedirect($this->router->pathFor('content.' . $editor));
 		}
 		
 		return $next($request, $response);

system/Models/Validation.php

@@ -20,6 +20,13 @@ class Validation
 		Validator::langDir(__DIR__.'/../vendor/vlucas/valitron/lang'); // always set langDir before lang.
 		Validator::lang('en');
 
+		Validator::addRule('values_allowed', function($field, $value, array $params, array $fields) use ($user)
+		{
+			$badvalues = array_diff($value, $params[0]);
+			if(empty($badvalues)){ return true; }
+			return false;
+		}, 'invalid values');
+
 		Validator::addRule('userAvailable', function($field, $value, array $params, array $fields) use ($user)
 		{
 			$userdata = $user->getUser($value);
@@ -41,20 +48,6 @@ class Validation
 			return false;
 		}, 'wrong password');
 		
-		Validator::addRule('emailAvailable', function($field, $value, array $params, array $fields)
-		{
-			$email = 'testmail@gmail.com';
-			if($email){ return false; }
-			return true;
-		}, 'taken');
-
-		Validator::addRule('emailKnown', function($field, $value, array $params, array $fields)
-		{
-			$email = 'testmail@gmail.com';
-			if(!$email){ return false; }
-			return true;
-		}, 'unknown');
-
 		Validator::addRule('noSpecialChars', function($field, $value, array $params, array $fields)
 		{
 			$format = '/[!@#$%^&*()_+=\[\]{};\':"\\|,.<>\/?]/';
@@ -183,7 +176,7 @@ class Validation
 	* @return obj $v the validation object passed to a result method.
 	*/
 
-	public function settings(array $params, array $copyright, $name = false)
+	public function settings(array $params, array $copyright, array $formats, $name = false)
 	{
 		$v = new Validator($params);
 		
@@ -195,8 +188,9 @@ class Validation
 		$v->rule('integer', 'year');
 		$v->rule('length', 'year', 4);
 		$v->rule('in', 'editor', ['raw', 'visual']);
+		$v->rule('values_allowed', 'formats', $formats);
 		$v->rule('in', 'copyright', $copyright);
-		
+
 		return $this->validationResult($v, $name);
 	}
 

system/Plugin.php

@@ -15,7 +15,7 @@ abstract class Plugin implements EventSubscriberInterface
      * Constructor
      *
      */
-	 
+	
     public function __construct($container)
     {
 		$this->container 	= $container;
@@ -97,16 +97,31 @@ abstract class Plugin implements EventSubscriberInterface
 		$function = new \Twig_SimpleFunction($name, $function);
 		$this->container->view->getEnvironment()->addFunction($function);
 	}
-		
+
 	protected function addJS($JS)
 	{
 		$this->container->assets->addJS($JS);
 	}
 
+	protected function addEditorJS($JS)
+	{
+		$this->container->assets->addEditorJS($JS);
+	}
+
 	protected function addInlineJS($JS)
 	{
 		$this->container->assets->addInlineJS($JS);
 	}
+
+	protected function addSvgSymbol($symbol)
+	{
+		$this->container->assets->addSvgSymbol($symbol);
+	}
+
+	protected function addEditorInlineJS($JS)
+	{
+		$this->container->assets->addEditorInlineJS($JS);
+	}
 	
 	protected function addCSS($CSS)
 	{

system/Routes/Web.php

@@ -31,8 +31,8 @@ else
 $app->post('/tm/formpost', FormController::class . ':savePublicForm')->setName('form.save');
 
 $app->get('/tm', AuthController::class . ':redirect');
-$app->get('/tm/login', AuthController::class . ':show')->setName('auth.show')->add(new RedirectIfAuthenticated($container['router']));
-$app->post('/tm/login', AuthController::class . ':login')->setName('auth.login')->add(new RedirectIfAuthenticated($container['router']));
+$app->get('/tm/login', AuthController::class . ':show')->setName('auth.show')->add(new RedirectIfAuthenticated($container['router'], $container['settings']));
+$app->post('/tm/login', AuthController::class . ':login')->setName('auth.login')->add(new RedirectIfAuthenticated($container['router'], $container['settings']));
 $app->get('/tm/logout', AuthController::class . ':logout')->setName('auth.logout')->add(new RedirectIfUnauthenticated($container['router'], $container['flash']));
 
 $app->get('/tm/settings', SettingsController::class . ':showSettings')->setName('settings.show')->add(new RedirectIfNoAdmin($container['router'], $container['flash']));

system/Settings.php

@@ -15,7 +15,17 @@ class Settings
 		{
 			$settings 			= array_merge($defaultSettings, $userSettings);
 		}
-				
+
+		# We know the used theme now so create the theme path 
+		$settings['themePath'] = $settings['rootPath'] . $settings['themeFolder'] . DIRECTORY_SEPARATOR . $settings['theme'];
+
+		# if there are no theme settings yet (e.g. no setup yet) use default theme settings
+		if(!isset($settings['themes']))
+		{
+			$themeSettings = self::getObjectSettings('themes', $settings['theme']);
+			$settings['themes'][$settings['theme']] = isset($themeSettings['settings']) ? $themeSettings['settings'] : false;
+		}		
+
 		return array('settings' => $settings);
 	}
 	
@@ -32,14 +42,15 @@ class Settings
 			'language'								=> 'en',
 			'startpage'								=> true,
 			'rootPath'								=> $rootPath,
-			'theme'									=> ($theme = 'typemill'),
-			'themeFolder'							=> ($themeFolder = 'themes'),
+			'theme'									=> 'typemill',
+			'themeFolder'							=> 'themes',
 			'themeBasePath'							=> $rootPath,
-			'themePath'								=> $rootPath . $themeFolder . DIRECTORY_SEPARATOR . $theme,
+			'themePath'								=> '',
 			'settingsPath'							=> $rootPath . 'settings',
 			'userPath'								=> $rootPath . 'settings' . DIRECTORY_SEPARATOR . 'users',
 			'authorPath'							=> __DIR__ . DIRECTORY_SEPARATOR . 'author' . DIRECTORY_SEPARATOR,
-			'editor'								=> 'raw',
+			'editor'								=> 'visual',
+			'formats'								=> ['markdown', 'headline', 'ulist', 'olist', 'table', 'quote', 'image', 'video', 'toc', 'hr', 'definition', 'code'],
 			'contentFolder'							=> 'content',
 			'cache'									=> true,
 			'cachePath'								=> $rootPath . 'cache',
@@ -99,6 +110,7 @@ class Settings
 									'year' => false,
 									'theme' => false,
 									'editor' => false,
+									'formats' => false,
 									'setup' => false,
 									'welcome' => false,
 									'images' => false,

system/author/auth/login.twig

@@ -6,7 +6,7 @@
 	<div class="setupWrapper">
 		
 		<div class="setupContent">
-			<p><i class="icon-bookmark-empty"></i>Remember to bookmark this page</p>
+			<p><svg class="icon baseline icon-bookmark-o"><use xlink:href="#icon-bookmark-o"></use></svg>Remember to bookmark this page</p>
 		</div>
 		<div class="authformWrapper">
 			<form method="POST" action="{{ path_for("auth.login") }}" autocomplete="off">

system/author/auth/welcome.twig

@@ -11,7 +11,7 @@
 				<h1>Hurra!</h1>
 				<p>Your account has been created and you are logged in now.</p>
 				<p><strong>Next step:</strong> Visit the author panel and setup your new website. You can configure the system, choose themes and add plugins.</p>
-				<p><strong>New:</strong> With the first big community-contribution you can now discard your changes and set a page back to the published version.</p>
+				<p><strong>New:</strong> You never use code-examples on your pages? Then disable the code-button and adjust the whole format-bar of the editor exactly to your needs.</p>
 				<p><strong>Get help:</strong> If you have any questions, please consult the <a target="_blank" href="https://typemill.net/typemill"><i class="icon-link-ext"></i> docs</a> or open a new issue on <a target="_blank" href="https://github.com/typemill/typemill"><i class="icon-link-ext"></i> github</a>.</p>
 			</div>
 			<a class="button" href="{{ path_for('settings.show') }}">Configure your website</a>

system/author/css/fontello/LICENSE.txt

@@ -1,48 +0,0 @@
-Font license info
-
-
-## Font Awesome
-
-   Copyright (C) 2016 by Dave Gandy
-
-   Author:    Dave Gandy
-   License:   SIL ()
-   Homepage:  http://fortawesome.github.com/Font-Awesome/
-
-
-## Entypo
-
-   Copyright (C) 2012 by Daniel Bruce
-
-   Author:    Daniel Bruce
-   License:   SIL (http://scripts.sil.org/OFL)
-   Homepage:  http://www.entypo.com
-
-
-## Modern Pictograms
-
-   Copyright (c) 2012 by John Caserta. All rights reserved.
-
-   Author:    John Caserta
-   License:   SIL (http://scripts.sil.org/OFL)
-   Homepage:  http://thedesignoffice.org/project/modern-pictograms/
-
-
-## Typicons
-
-   (c) Stephen Hutchings 2012
-
-   Author:    Stephen Hutchings
-   License:   SIL (http://scripts.sil.org/OFL)
-   Homepage:  http://typicons.com/
-
-
-## MFG Labs
-
-   Copyright (C) 2012 by Daniel Bruce
-
-   Author:    MFG Labs
-   License:   SIL (http://scripts.sil.org/OFL)
-   Homepage:  http://www.mfglabs.com/
-
-

system/author/css/fontello/README.txt

@@ -1,75 +0,0 @@
-This webfont is generated by http://fontello.com open source project.
-
-
-================================================================================
-Please, note, that you should obey original font licenses, used to make this
-webfont pack. Details available in LICENSE.txt file.
-
-- Usually, it's enough to publish content of LICENSE.txt file somewhere on your
-  site in "About" section.
-
-- If your project is open-source, usually, it will be ok to make LICENSE.txt
-  file publicly available in your repository.
-
-- Fonts, used in Fontello, don't require a clickable link on your site.
-  But any kind of additional authors crediting is welcome.
-================================================================================
-
-
-Comments on archive content
----------------------------
-
-- /font/* - fonts in different formats
-
-- /css/*  - different kinds of css, for all situations. Should be ok with 
-  twitter bootstrap. Also, you can skip <i> style and assign icon classes
-  directly to text elements, if you don't mind about IE7.
-
-- demo.html - demo file, to show your webfont content
-
-- LICENSE.txt - license info about source fonts, used to build your one.
-
-- config.json - keeps your settings. You can import it back into fontello
-  anytime, to continue your work
-
-
-Why so many CSS files ?
------------------------
-
-Because we like to fit all your needs :)
-
-- basic file, <your_font_name>.css - is usually enough, it contains @font-face
-  and character code definitions
-
-- *-ie7.css - if you need IE7 support, but still don't wish to put char codes
-  directly into html
-
-- *-codes.css and *-ie7-codes.css - if you like to use your own @font-face
-  rules, but still wish to benefit from css generation. That can be very
-  convenient for automated asset build systems. When you need to update font -
-  no need to manually edit files, just override old version with archive
-  content. See fontello source code for examples.
-
-- *-embedded.css - basic css file, but with embedded WOFF font, to avoid
-  CORS issues in Firefox and IE9+, when fonts are hosted on the separate domain.
-  We strongly recommend to resolve this issue by `Access-Control-Allow-Origin`
-  server headers. But if you ok with dirty hack - this file is for you. Note,
-  that data url moved to separate @font-face to avoid problems with <IE9, when
-  string is too long.
-
-- animate.css - use it to get ideas about spinner rotation animation.
-
-
-Attention for server setup
---------------------------
-
-You MUST setup server to reply with proper `mime-types` for font files -
-otherwise some browsers will fail to show fonts.
-
-Usually, `apache` already has necessary settings, but `nginx` and other
-webservers should be tuned. Here is list of mime types for our file extensions:
-
-- `application/vnd.ms-fontobject` - eot
-- `application/x-font-woff` - woff
-- `application/x-font-ttf` - ttf
-- `image/svg+xml` - svg

system/author/css/fontello/config.json

@@ -1,208 +0,0 @@
-{
-  "name": "",
-  "css_prefix_text": "icon-",
-  "css_use_suffix": false,
-  "hinting": true,
-  "units_per_em": 1000,
-  "ascent": 850,
-  "glyphs": [
-    {
-      "uid": "02cca871bb69da75e8ee286b7055832c",
-      "css": "bold",
-      "code": 59392,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "a8cb1c217f02b073db3670c061cc54d2",
-      "css": "italic",
-      "code": 59393,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "14017aae737730faeda4a6fd8fb3a5f0",
-      "css": "check",
-      "code": 59394,
-      "src": "entypo"
-    },
-    {
-      "uid": "c709da589c923ba3c2ad48d9fc563e93",
-      "css": "cancel",
-      "code": 59395,
-      "src": "entypo"
-    },
-    {
-      "uid": "381da2c2f7fd51f8de877c044d7f439d",
-      "css": "picture",
-      "code": 59396,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "5211af474d3a9848f67f945e2ccaf143",
-      "css": "cancel-1",
-      "code": 59397,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "44e04715aecbca7f266a17d5a7863c68",
-      "css": "plus",
-      "code": 59398,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "d7271d490b71df4311e32cdacae8b331",
-      "css": "home",
-      "code": 59399,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "0ddd3e8201ccc7d41f7b7c9d27eca6c1",
-      "css": "link",
-      "code": 59400,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "e99461abfef3923546da8d745372c995",
-      "css": "cog",
-      "code": 59401,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "8b9e6a8dd8f67f7c003ed8e7e5ee0857",
-      "css": "off",
-      "code": 59402,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "872d9516df93eb6b776cc4d94bd97dac",
-      "css": "video",
-      "code": 59403,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "eeec3208c90b7b48e804919d0d2d4a41",
-      "css": "upload",
-      "code": 59404,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "861ab06e455e2de3232ebef67d60d708",
-      "css": "minus",
-      "code": 59405,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "2qh229aneb95ds2afi7dbdsxz9jrbhcl",
-      "css": "colon",
-      "code": 59406,
-      "src": "modernpics"
-    },
-    {
-      "uid": "d2d6ab0dd4fb9365b1d5756380484bbb",
-      "css": "pi",
-      "code": 59407,
-      "src": "typicons"
-    },
-    {
-      "uid": "c5fd68d8253e605e7a78a0c75255b692",
-      "css": "math",
-      "code": 61466,
-      "src": "mfglabs"
-    },
-    {
-      "uid": "c819c6225685bae2eed1b8da13e629fa",
-      "css": "list-alt",
-      "code": 59408,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "d3b3f17bc3eb7cd809a07bbd4d178bee",
-      "css": "resize-vertical",
-      "code": 59409,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "6605ee6441bf499ffa3c63d3c7409471",
-      "css": "move",
-      "code": 61511,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "e15f0d620a7897e2035c18c80142f6d9",
-      "css": "link-ext",
-      "code": 61582,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "2f5ef6f6b7aaebc56458ab4e865beff5",
-      "css": "bookmark-empty",
-      "code": 61591,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "a2a74f5e7b7d9ba054897d8c795a326a",
-      "css": "list-bullet",
-      "code": 61642,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "f6766a8b042c2453a4e153af03294383",
-      "css": "list-numbered",
-      "code": 61643,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "8fb55fd696d9a0f58f3b27c1d8633750",
-      "css": "table",
-      "code": 61646,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "5408be43f7c42bccee419c6be53fdef5",
-      "css": "doc-text",
-      "code": 61686,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "ab95e1351ebaec5850101097cbf7097f",
-      "css": "quote-left",
-      "code": 61709,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "b091a8bd0fdade174951f17d936f51e4",
-      "css": "folder-empty",
-      "code": 61716,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "7034e4d22866af82bef811f52fb1ba46",
-      "css": "code",
-      "code": 61729,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "4e88371fb8857dacc1f66afe6314e426",
-      "css": "superscript",
-      "code": 61739,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "47a1f80457068fbeab69fdb83d7d0817",
-      "css": "youtube-play",
-      "code": 61802,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "0c708edd8fae2376b3370aa56d40cf9e",
-      "css": "header",
-      "code": 61916,
-      "src": "fontawesome"
-    },
-    {
-      "uid": "c5845105a87df2ee1999826d90622f6a",
-      "css": "paragraph",
-      "code": 61917,
-      "src": "fontawesome"
-    }
-  ]
-}

system/author/css/fontello/css/animation.css

@@ -1,85 +0,0 @@
-/*
-   Animation example, for spinners
-*/
-.animate-spin {
-  -moz-animation: spin 2s infinite linear;
-  -o-animation: spin 2s infinite linear;
-  -webkit-animation: spin 2s infinite linear;
-  animation: spin 2s infinite linear;
-  display: inline-block;
-}
-@-moz-keyframes spin {
-  0% {
-    -moz-transform: rotate(0deg);
-    -o-transform: rotate(0deg);
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg);
-  }
-
-  100% {
-    -moz-transform: rotate(359deg);
-    -o-transform: rotate(359deg);
-    -webkit-transform: rotate(359deg);
-    transform: rotate(359deg);
-  }
-}
-@-webkit-keyframes spin {
-  0% {
-    -moz-transform: rotate(0deg);
-    -o-transform: rotate(0deg);
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg);
-  }
-
-  100% {
-    -moz-transform: rotate(359deg);
-    -o-transform: rotate(359deg);
-    -webkit-transform: rotate(359deg);
-    transform: rotate(359deg);
-  }
-}
-@-o-keyframes spin {
-  0% {
-    -moz-transform: rotate(0deg);
-    -o-transform: rotate(0deg);
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg);
-  }
-
-  100% {
-    -moz-transform: rotate(359deg);
-    -o-transform: rotate(359deg);
-    -webkit-transform: rotate(359deg);
-    transform: rotate(359deg);
-  }
-}
-@-ms-keyframes spin {
-  0% {
-    -moz-transform: rotate(0deg);
-    -o-transform: rotate(0deg);
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg);
-  }
-
-  100% {
-    -moz-transform: rotate(359deg);
-    -o-transform: rotate(359deg);
-    -webkit-transform: rotate(359deg);
-    transform: rotate(359deg);
-  }
-}
-@keyframes spin {
-  0% {
-    -moz-transform: rotate(0deg);
-    -o-transform: rotate(0deg);
-    -webkit-transform: rotate(0deg);
-    transform: rotate(0deg);
-  }
-
-  100% {
-    -moz-transform: rotate(359deg);
-    -o-transform: rotate(359deg);
-    -webkit-transform: rotate(359deg);
-    transform: rotate(359deg);
-  }
-}

system/author/css/fontello/css/fontello-codes.css

@@ -1,34 +0,0 @@
-
-.icon-bold:before { content: '\e800'; } /* '' */
-.icon-italic:before { content: '\e801'; } /* '' */
-.icon-check:before { content: '\e802'; } /* '' */
-.icon-cancel:before { content: '\e803'; } /* '' */
-.icon-picture:before { content: '\e804'; } /* '' */
-.icon-cancel-1:before { content: '\e805'; } /* '' */
-.icon-plus:before { content: '\e806'; } /* '' */
-.icon-home:before { content: '\e807'; } /* '' */
-.icon-link:before { content: '\e808'; } /* '' */
-.icon-cog:before { content: '\e809'; } /* '' */
-.icon-off:before { content: '\e80a'; } /* '' */
-.icon-video:before { content: '\e80b'; } /* '' */
-.icon-upload:before { content: '\e80c'; } /* '' */
-.icon-minus:before { content: '\e80d'; } /* '' */
-.icon-colon:before { content: '\e80e'; } /* '' */
-.icon-pi:before { content: '\e80f'; } /* '' */
-.icon-list-alt:before { content: '\e810'; } /* '' */
-.icon-resize-vertical:before { content: '\e811'; } /* '' */
-.icon-math:before { content: '\f01a'; } /* '' */
-.icon-move:before { content: '\f047'; } /* '' */
-.icon-link-ext:before { content: '\f08e'; } /* '' */
-.icon-bookmark-empty:before { content: '\f097'; } /* '' */
-.icon-list-bullet:before { content: '\f0ca'; } /* '' */
-.icon-list-numbered:before { content: '\f0cb'; } /* '' */
-.icon-table:before { content: '\f0ce'; } /* '' */
-.icon-doc-text:before { content: '\f0f6'; } /* '' */
-.icon-quote-left:before { content: '\f10d'; } /* '' */
-.icon-folder-empty:before { content: '\f114'; } /* '' */
-.icon-code:before { content: '\f121'; } /* '' */
-.icon-superscript:before { content: '\f12b'; } /* '' */
-.icon-youtube-play:before { content: '\f16a'; } /* '' */
-.icon-header:before { content: '\f1dc'; } /* '' */
-.icon-paragraph:before { content: '\f1dd'; } /* '' */

system/author/css/fontello/css/fontello-ie7-codes.css

@@ -1,34 +0,0 @@
-
-.icon-bold { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-italic { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-check { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-cancel { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-picture { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-cancel-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-plus { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-home { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-link { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-cog { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-off { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-video { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-upload { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-minus { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-colon { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-pi { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-list-alt { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-resize-vertical { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-math { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-move { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-link-ext { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-bookmark-empty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-list-bullet { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-list-numbered { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-table { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-doc-text { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-quote-left { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-folder-empty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-code { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-superscript { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-youtube-play { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-header { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-paragraph { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }

system/author/css/fontello/css/fontello-ie7.css

@@ -1,45 +0,0 @@
-[class^="icon-"], [class*=" icon-"] {
-  font-family: 'fontello';
-  font-style: normal;
-  font-weight: normal;
- 
-  /* fix buttons height */
-  line-height: 1em;
- 
-  /* you can be more comfortable with increased icons size */
-  /* font-size: 120%; */
-}
- 
-.icon-bold { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-italic { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-check { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-cancel { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-picture { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-cancel-1 { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-plus { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-home { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-link { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-cog { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-off { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-video { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-upload { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-minus { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-colon { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-pi { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-list-alt { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-resize-vertical { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-math { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-move { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-link-ext { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-bookmark-empty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-list-bullet { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-list-numbered { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-table { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-doc-text { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-quote-left { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-folder-empty { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-code { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-superscript { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-youtube-play { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-header { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }
-.icon-paragraph { *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = ' '); }

system/author/css/fontello/css/fontello.css

@@ -1,90 +0,0 @@
-@font-face {
-  font-family: 'fontello';
-  src: url('../font/fontello.eot?37804068');
-  src: url('../font/fontello.eot?37804068#iefix') format('embedded-opentype'),
-       url('../font/fontello.woff2?37804068') format('woff2'),
-       url('../font/fontello.woff?37804068') format('woff'),
-       url('../font/fontello.ttf?37804068') format('truetype'),
-       url('../font/fontello.svg?37804068#fontello') format('svg');
-  font-weight: normal;
-  font-style: normal;
-}
-/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
-/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
-/*
-@media screen and (-webkit-min-device-pixel-ratio:0) {
-  @font-face {
-    font-family: 'fontello';
-    src: url('../font/fontello.svg?37804068#fontello') format('svg');
-  }
-}
-*/
- 
- [class^="icon-"]:before, [class*=" icon-"]:before {
-  font-family: "fontello";
-  font-style: normal;
-  font-weight: normal;
-  speak: none;
- 
-  display: inline-block;
-  text-decoration: inherit;
-  width: 1em;
-  margin-right: .2em;
-  text-align: center;
-  /* opacity: .8; */
- 
-  /* For safety - reset parent styles, that can break glyph codes*/
-  font-variant: normal;
-  text-transform: none;
- 
-  /* fix buttons height, for twitter bootstrap */
-  line-height: 1em;
- 
-  /* Animation center compensation - margins should be symmetric */
-  /* remove if not needed */
-  margin-left: .2em;
- 
-  /* you can be more comfortable with increased icons size */
-  /* font-size: 120%; */
- 
-  /* Font smoothing. That was taken from TWBS */
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
- 
-  /* Uncomment for 3D effect */
-  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
-}
- 
-.icon-bold:before { content: '\e800'; } /* '' */
-.icon-italic:before { content: '\e801'; } /* '' */
-.icon-check:before { content: '\e802'; } /* '' */
-.icon-cancel:before { content: '\e803'; } /* '' */
-.icon-picture:before { content: '\e804'; } /* '' */
-.icon-cancel-1:before { content: '\e805'; } /* '' */
-.icon-plus:before { content: '\e806'; } /* '' */
-.icon-home:before { content: '\e807'; } /* '' */
-.icon-link:before { content: '\e808'; } /* '' */
-.icon-cog:before { content: '\e809'; } /* '' */
-.icon-off:before { content: '\e80a'; } /* '' */
-.icon-video:before { content: '\e80b'; } /* '' */
-.icon-upload:before { content: '\e80c'; } /* '' */
-.icon-minus:before { content: '\e80d'; } /* '' */
-.icon-colon:before { content: '\e80e'; } /* '' */
-.icon-pi:before { content: '\e80f'; } /* '' */
-.icon-list-alt:before { content: '\e810'; } /* '' */
-.icon-resize-vertical:before { content: '\e811'; } /* '' */
-.icon-math:before { content: '\f01a'; } /* '' */
-.icon-move:before { content: '\f047'; } /* '' */
-.icon-link-ext:before { content: '\f08e'; } /* '' */
-.icon-bookmark-empty:before { content: '\f097'; } /* '' */
-.icon-list-bullet:before { content: '\f0ca'; } /* '' */
-.icon-list-numbered:before { content: '\f0cb'; } /* '' */
-.icon-table:before { content: '\f0ce'; } /* '' */
-.icon-doc-text:before { content: '\f0f6'; } /* '' */
-.icon-quote-left:before { content: '\f10d'; } /* '' */
-.icon-folder-empty:before { content: '\f114'; } /* '' */
-.icon-code:before { content: '\f121'; } /* '' */
-.icon-superscript:before { content: '\f12b'; } /* '' */
-.icon-youtube-play:before { content: '\f16a'; } /* '' */
-.icon-header:before { content: '\f1dc'; } /* '' */
-.icon-paragraph:before { content: '\f1dd'; } /* '' */

system/author/css/fontello/demo.html

@@ -1,354 +0,0 @@
-<!DOCTYPE html>
-<html>
-  <head><!--[if lt IE 9]><script language="javascript" type="text/javascript" src="//html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
-    <meta charset="UTF-8"><style>/*
- * Bootstrap v2.2.1
- *
- * Copyright 2012 Twitter, Inc
- * Licensed under the Apache License v2.0
- * http://www.apache.org/licenses/LICENSE-2.0
- *
- * Designed and built with all the love in the world @twitter by @mdo and @fat.
- */
-.clearfix {
-  *zoom: 1;
-}
-.clearfix:before,
-.clearfix:after {
-  display: table;
-  content: "";
-  line-height: 0;
-}
-.clearfix:after {
-  clear: both;
-}
-html {
-  font-size: 100%;
-  -webkit-text-size-adjust: 100%;
-  -ms-text-size-adjust: 100%;
-}
-a:focus {
-  outline: thin dotted #333;
-  outline: 5px auto -webkit-focus-ring-color;
-  outline-offset: -2px;
-}
-a:hover,
-a:active {
-  outline: 0;
-}
-button,
-input,
-select,
-textarea {
-  margin: 0;
-  font-size: 100%;
-  vertical-align: middle;
-}
-button,
-input {
-  *overflow: visible;
-  line-height: normal;
-}
-button::-moz-focus-inner,
-input::-moz-focus-inner {
-  padding: 0;
-  border: 0;
-}
-body {
-  margin: 0;
-  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
-  font-size: 14px;
-  line-height: 20px;
-  color: #333;
-  background-color: #fff;
-}
-a {
-  color: #08c;
-  text-decoration: none;
-}
-a:hover {
-  color: #005580;
-  text-decoration: underline;
-}
-.row {
-  margin-left: -20px;
-  *zoom: 1;
-}
-.row:before,
-.row:after {
-  display: table;
-  content: "";
-  line-height: 0;
-}
-.row:after {
-  clear: both;
-}
-[class*="span"] {
-  float: left;
-  min-height: 1px;
-  margin-left: 20px;
-}
-.container,
-.navbar-static-top .container,
-.navbar-fixed-top .container,
-.navbar-fixed-bottom .container {
-  width: 940px;
-}
-.span12 {
-  width: 940px;
-}
-.span11 {
-  width: 860px;
-}
-.span10 {
-  width: 780px;
-}
-.span9 {
-  width: 700px;
-}
-.span8 {
-  width: 620px;
-}
-.span7 {
-  width: 540px;
-}
-.span6 {
-  width: 460px;
-}
-.span5 {
-  width: 380px;
-}
-.span4 {
-  width: 300px;
-}
-.span3 {
-  width: 220px;
-}
-.span2 {
-  width: 140px;
-}
-.span1 {
-  width: 60px;
-}
-[class*="span"].pull-right,
-.row-fluid [class*="span"].pull-right {
-  float: right;
-}
-.container {
-  margin-right: auto;
-  margin-left: auto;
-  *zoom: 1;
-}
-.container:before,
-.container:after {
-  display: table;
-  content: "";
-  line-height: 0;
-}
-.container:after {
-  clear: both;
-}
-p {
-  margin: 0 0 10px;
-}
-.lead {
-  margin-bottom: 20px;
-  font-size: 21px;
-  font-weight: 200;
-  line-height: 30px;
-}
-small {
-  font-size: 85%;
-}
-h1 {
-  margin: 10px 0;
-  font-family: inherit;
-  font-weight: bold;
-  line-height: 20px;
-  color: inherit;
-  text-rendering: optimizelegibility;
-}
-h1 small {
-  font-weight: normal;
-  line-height: 1;
-  color: #999;
-}
-h1 {
-  line-height: 40px;
-}
-h1 {
-  font-size: 38.5px;
-}
-h1 small {
-  font-size: 24.5px;
-}
-body {
-  margin-top: 90px;
-}
-.header {
-  position: fixed;
-  top: 0;
-  left: 50%;
-  margin-left: -480px;
-  background-color: #fff;
-  border-bottom: 1px solid #ddd;
-  padding-top: 10px;
-  z-index: 10;
-}
-.footer {
-  color: #ddd;
-  font-size: 12px;
-  text-align: center;
-  margin-top: 20px;
-}
-.footer a {
-  color: #ccc;
-  text-decoration: underline;
-}
-.the-icons {
-  font-size: 14px;
-  line-height: 24px;
-}
-.switch {
-  position: absolute;
-  right: 0;
-  bottom: 10px;
-  color: #666;
-}
-.switch input {
-  margin-right: 0.3em;
-}
-.codesOn .i-name {
-  display: none;
-}
-.codesOn .i-code {
-  display: inline;
-}
-.i-code {
-  display: none;
-}
-@font-face {
-      font-family: 'fontello';
-      src: url('./font/fontello.eot?79192306');
-      src: url('./font/fontello.eot?79192306#iefix') format('embedded-opentype'),
-           url('./font/fontello.woff?79192306') format('woff'),
-           url('./font/fontello.ttf?79192306') format('truetype'),
-           url('./font/fontello.svg?79192306#fontello') format('svg');
-      font-weight: normal;
-      font-style: normal;
-    }
-     
-     
-    .demo-icon
-    {
-      font-family: "fontello";
-      font-style: normal;
-      font-weight: normal;
-      speak: none;
-     
-      display: inline-block;
-      text-decoration: inherit;
-      width: 1em;
-      margin-right: .2em;
-      text-align: center;
-      /* opacity: .8; */
-     
-      /* For safety - reset parent styles, that can break glyph codes*/
-      font-variant: normal;
-      text-transform: none;
-     
-      /* fix buttons height, for twitter bootstrap */
-      line-height: 1em;
-     
-      /* Animation center compensation - margins should be symmetric */
-      /* remove if not needed */
-      margin-left: .2em;
-     
-      /* You can be more comfortable with increased icons size */
-      /* font-size: 120%; */
-     
-      /* Font smoothing. That was taken from TWBS */
-      -webkit-font-smoothing: antialiased;
-      -moz-osx-font-smoothing: grayscale;
-     
-      /* Uncomment for 3D effect */
-      /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
-    }
-     </style>
-    <link rel="stylesheet" href="css/animation.css"><!--[if IE 7]><link rel="stylesheet" href="css/" + font.fontname + "-ie7.css"><![endif]-->
-    <script>
-      function toggleCodes(on) {
-        var obj = document.getElementById('icons');
-      
-        if (on) {
-          obj.className += ' codesOn';
-        } else {
-          obj.className = obj.className.replace(' codesOn', '');
-        }
-      }
-      
-    </script>
-  </head>
-  <body>
-    <div class="container header">
-      <h1>fontello <small>font demo</small></h1>
-      <label class="switch">
-        <input type="checkbox" onclick="toggleCodes(this.checked)">show codes
-      </label>
-    </div>
-    <div class="container" id="icons">
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xe800"><i class="demo-icon icon-bold">&#xe800;</i> <span class="i-name">icon-bold</span><span class="i-code">0xe800</span></div>
-        <div class="the-icons span3" title="Code: 0xe801"><i class="demo-icon icon-italic">&#xe801;</i> <span class="i-name">icon-italic</span><span class="i-code">0xe801</span></div>
-        <div class="the-icons span3" title="Code: 0xe802"><i class="demo-icon icon-check">&#xe802;</i> <span class="i-name">icon-check</span><span class="i-code">0xe802</span></div>
-        <div class="the-icons span3" title="Code: 0xe803"><i class="demo-icon icon-cancel">&#xe803;</i> <span class="i-name">icon-cancel</span><span class="i-code">0xe803</span></div>
-      </div>
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xe804"><i class="demo-icon icon-picture">&#xe804;</i> <span class="i-name">icon-picture</span><span class="i-code">0xe804</span></div>
-        <div class="the-icons span3" title="Code: 0xe805"><i class="demo-icon icon-cancel-1">&#xe805;</i> <span class="i-name">icon-cancel-1</span><span class="i-code">0xe805</span></div>
-        <div class="the-icons span3" title="Code: 0xe806"><i class="demo-icon icon-plus">&#xe806;</i> <span class="i-name">icon-plus</span><span class="i-code">0xe806</span></div>
-        <div class="the-icons span3" title="Code: 0xe807"><i class="demo-icon icon-home">&#xe807;</i> <span class="i-name">icon-home</span><span class="i-code">0xe807</span></div>
-      </div>
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xe808"><i class="demo-icon icon-link">&#xe808;</i> <span class="i-name">icon-link</span><span class="i-code">0xe808</span></div>
-        <div class="the-icons span3" title="Code: 0xe809"><i class="demo-icon icon-cog">&#xe809;</i> <span class="i-name">icon-cog</span><span class="i-code">0xe809</span></div>
-        <div class="the-icons span3" title="Code: 0xe80a"><i class="demo-icon icon-off">&#xe80a;</i> <span class="i-name">icon-off</span><span class="i-code">0xe80a</span></div>
-        <div class="the-icons span3" title="Code: 0xe80b"><i class="demo-icon icon-video">&#xe80b;</i> <span class="i-name">icon-video</span><span class="i-code">0xe80b</span></div>
-      </div>
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xe80c"><i class="demo-icon icon-upload">&#xe80c;</i> <span class="i-name">icon-upload</span><span class="i-code">0xe80c</span></div>
-        <div class="the-icons span3" title="Code: 0xe80d"><i class="demo-icon icon-minus">&#xe80d;</i> <span class="i-name">icon-minus</span><span class="i-code">0xe80d</span></div>
-        <div class="the-icons span3" title="Code: 0xe80e"><i class="demo-icon icon-colon">&#xe80e;</i> <span class="i-name">icon-colon</span><span class="i-code">0xe80e</span></div>
-        <div class="the-icons span3" title="Code: 0xe80f"><i class="demo-icon icon-pi">&#xe80f;</i> <span class="i-name">icon-pi</span><span class="i-code">0xe80f</span></div>
-      </div>
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xe810"><i class="demo-icon icon-list-alt">&#xe810;</i> <span class="i-name">icon-list-alt</span><span class="i-code">0xe810</span></div>
-        <div class="the-icons span3" title="Code: 0xe811"><i class="demo-icon icon-resize-vertical">&#xe811;</i> <span class="i-name">icon-resize-vertical</span><span class="i-code">0xe811</span></div>
-        <div class="the-icons span3" title="Code: 0xf01a"><i class="demo-icon icon-math">&#xf01a;</i> <span class="i-name">icon-math</span><span class="i-code">0xf01a</span></div>
-        <div class="the-icons span3" title="Code: 0xf047"><i class="demo-icon icon-move">&#xf047;</i> <span class="i-name">icon-move</span><span class="i-code">0xf047</span></div>
-      </div>
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xf08e"><i class="demo-icon icon-link-ext">&#xf08e;</i> <span class="i-name">icon-link-ext</span><span class="i-code">0xf08e</span></div>
-        <div class="the-icons span3" title="Code: 0xf097"><i class="demo-icon icon-bookmark-empty">&#xf097;</i> <span class="i-name">icon-bookmark-empty</span><span class="i-code">0xf097</span></div>
-        <div class="the-icons span3" title="Code: 0xf0ca"><i class="demo-icon icon-list-bullet">&#xf0ca;</i> <span class="i-name">icon-list-bullet</span><span class="i-code">0xf0ca</span></div>
-        <div class="the-icons span3" title="Code: 0xf0cb"><i class="demo-icon icon-list-numbered">&#xf0cb;</i> <span class="i-name">icon-list-numbered</span><span class="i-code">0xf0cb</span></div>
-      </div>
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xf0ce"><i class="demo-icon icon-table">&#xf0ce;</i> <span class="i-name">icon-table</span><span class="i-code">0xf0ce</span></div>
-        <div class="the-icons span3" title="Code: 0xf0f6"><i class="demo-icon icon-doc-text">&#xf0f6;</i> <span class="i-name">icon-doc-text</span><span class="i-code">0xf0f6</span></div>
-        <div class="the-icons span3" title="Code: 0xf10d"><i class="demo-icon icon-quote-left">&#xf10d;</i> <span class="i-name">icon-quote-left</span><span class="i-code">0xf10d</span></div>
-        <div class="the-icons span3" title="Code: 0xf114"><i class="demo-icon icon-folder-empty">&#xf114;</i> <span class="i-name">icon-folder-empty</span><span class="i-code">0xf114</span></div>
-      </div>
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xf121"><i class="demo-icon icon-code">&#xf121;</i> <span class="i-name">icon-code</span><span class="i-code">0xf121</span></div>
-        <div class="the-icons span3" title="Code: 0xf12b"><i class="demo-icon icon-superscript">&#xf12b;</i> <span class="i-name">icon-superscript</span><span class="i-code">0xf12b</span></div>
-        <div class="the-icons span3" title="Code: 0xf16a"><i class="demo-icon icon-youtube-play">&#xf16a;</i> <span class="i-name">icon-youtube-play</span><span class="i-code">0xf16a</span></div>
-        <div class="the-icons span3" title="Code: 0xf1dc"><i class="demo-icon icon-header">&#xf1dc;</i> <span class="i-name">icon-header</span><span class="i-code">0xf1dc</span></div>
-      </div>
-      <div class="row">
-        <div class="the-icons span3" title="Code: 0xf1dd"><i class="demo-icon icon-paragraph">&#xf1dd;</i> <span class="i-name">icon-paragraph</span><span class="i-code">0xf1dd</span></div>
-      </div>
-    </div>
-    <div class="container footer">Generated by <a href="http://fontello.com">fontello.com</a></div>
-  </body>
-</html>

system/author/css/fontello/font/fontello.svg

@@ -1,76 +0,0 @@
-<?xml version="1.0" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg xmlns="http://www.w3.org/2000/svg">
-<metadata>Copyright (C) 2019 by original authors @ fontello.com</metadata>
-<defs>
-<font id="fontello" horiz-adv-x="1000" >
-<font-face font-family="fontello" font-weight="400" font-stretch="normal" units-per-em="1000" ascent="850" descent="-150" />
-<missing-glyph horiz-adv-x="1000" />
-<glyph glyph-name="bold" unicode="&#xe800;" d="M310 1q41-18 78-18 210 0 210 187 0 64-23 101-15 24-34 41t-38 26-45 14-47 6-53 1q-40 0-56-6 0-29 0-88t-1-88q0-5 0-38t0-54 2-47 7-37z m-8 417q23-4 61-4 46 0 80 7t61 25 42 50 14 79q0 39-16 68t-45 46-60 24-69 8q-28 0-73-7 0-28 3-84t2-85q0-15 0-45t-1-44q0-26 1-38z m-302-497l1 53q9 2 48 9t59 15q4 7 7 15t4 19 4 18 1 21 0 19v36q0 548-12 572-2 5-12 8t-25 6-28 4-27 3-17 2l-2 46q55 1 190 6t208 6q13 0 38-1t38 0q39 0 76-7t72-24 60-39 41-59 16-76q0-29-9-54t-22-40-36-32-41-25-47-22q86-20 144-75t57-138q0-56-20-101t-52-72-77-48-91-27-98-8q-25 0-74 2t-74 1q-59 0-171-6t-129-7z" horiz-adv-x="785.7" />
-
-<glyph glyph-name="italic" unicode="&#xe801;" d="M0-78l10 48q12 4 34 9t40 11 33 13q16 19 23 56 1 4 35 162t63 303 29 165v14q-13 8-30 11t-39 4-32 3l10 58q19-1 67-4t84-4 67-1q27 0 55 1t68 4 54 4q-2-22-10-50-17-6-57-16t-60-19q-5-10-8-23t-5-23-4-25-4-24q-15-82-49-234t-43-198q-1-5-7-32t-11-51-9-46-4-32l1-10q9-3 103-18-2-24-9-55-6 0-18-1t-18-1q-16 0-49 6t-48 6q-77 1-115 1-28 0-79-5t-68-7z" horiz-adv-x="571.4" />
-
-<glyph glyph-name="check" unicode="&#xe802;" d="M249 0q-34 0-56 28l-180 236q-16 24-12 52t26 46 51 14 47-28l118-154 296 474q16 24 43 30t53-8q24-16 30-43t-8-53l-350-560q-20-32-56-32z" horiz-adv-x="667" />
-
-<glyph glyph-name="cancel" unicode="&#xe803;" d="M452 194q18-18 18-43t-18-43q-18-16-43-16t-43 16l-132 152-132-152q-18-16-43-16t-43 16q-16 18-16 43t16 43l138 156-138 158q-16 18-16 43t16 43q18 16 43 16t43-16l132-152 132 152q18 16 43 16t43-16q18-18 18-43t-18-43l-138-158z" horiz-adv-x="470" />
-
-<glyph glyph-name="picture" unicode="&#xe804;" d="M357 529q0-45-31-76t-76-32-76 32-31 76 31 76 76 31 76-31 31-76z m572-215v-250h-786v107l178 179 90-89 285 285z m53 393h-893q-7 0-12-5t-6-13v-678q0-7 6-13t12-5h893q7 0 13 5t5 13v678q0 8-5 13t-13 5z m89-18v-678q0-37-26-63t-63-27h-893q-36 0-63 27t-26 63v678q0 37 26 63t63 27h893q37 0 63-27t26-63z" horiz-adv-x="1071.4" />
-
-<glyph glyph-name="cancel-1" unicode="&#xe805;" d="M724 112q0-22-15-38l-76-76q-16-15-38-15t-38 15l-164 165-164-165q-16-15-38-15t-38 15l-76 76q-16 16-16 38t16 38l164 164-164 164q-16 16-16 38t16 38l76 76q16 16 38 16t38-16l164-164 164 164q16 16 38 16t38-16l76-76q15-15 15-38t-15-38l-164-164 164-164q15-15 15-38z" horiz-adv-x="785.7" />
-
-<glyph glyph-name="plus" unicode="&#xe806;" d="M786 439v-107q0-22-16-38t-38-15h-232v-233q0-22-16-37t-38-16h-107q-22 0-38 16t-15 37v233h-232q-23 0-38 15t-16 38v107q0 23 16 38t38 16h232v232q0 22 15 38t38 16h107q23 0 38-16t16-38v-232h232q23 0 38-16t16-38z" horiz-adv-x="785.7" />
-
-<glyph glyph-name="home" unicode="&#xe807;" d="M786 296v-267q0-15-11-25t-25-11h-214v214h-143v-214h-214q-15 0-25 11t-11 25v267q0 1 0 2t0 2l321 264 321-264q1-1 1-4z m124 39l-34-41q-5-5-12-6h-2q-7 0-12 3l-386 322-386-322q-7-4-13-3-7 1-12 6l-35 41q-4 6-3 13t6 12l401 334q18 15 42 15t43-15l136-113v108q0 8 5 13t13 5h107q8 0 13-5t5-13v-227l122-102q6-4 6-12t-4-13z" horiz-adv-x="928.6" />
-
-<glyph glyph-name="link" unicode="&#xe808;" d="M813 171q0 23-16 38l-116 116q-16 16-38 16-24 0-40-18 1-1 10-10t12-12 9-11 7-14 2-15q0-23-16-38t-38-16q-8 0-15 2t-14 7-11 9-12 12-10 10q-19-17-19-40 0-23 16-38l115-116q15-15 38-15 22 0 38 15l82 81q16 16 16 37z m-393 394q0 22-15 38l-115 115q-16 16-38 16-22 0-38-15l-82-82q-16-15-16-37 0-22 16-38l116-116q15-15 38-15 23 0 40 17-2 2-11 11t-12 12-8 10-7 14-2 16q0 22 15 38t38 15q9 0 16-2t14-7 11-8 12-12 10-11q18 17 18 41z m500-394q0-66-48-113l-82-81q-46-47-113-47-68 0-114 48l-115 115q-46 47-46 114 0 68 49 116l-49 49q-48-49-116-49-67 0-114 47l-116 116q-47 47-47 114t47 113l82 82q47 46 114 46 67 0 114-47l115-116q46-46 46-113 0-69-49-117l49-49q48 49 116 49 67 0 114-47l116-116q47-47 47-114z" horiz-adv-x="928.6" />
-
-<glyph glyph-name="cog" unicode="&#xe809;" d="M571 350q0 59-41 101t-101 42-101-42-42-101 42-101 101-42 101 42 41 101z m286 61v-124q0-7-4-13t-11-7l-104-16q-10-30-21-51 19-27 59-77 6-6 6-13t-5-13q-15-21-55-61t-53-39q-7 0-14 5l-77 60q-25-13-51-21-9-76-16-104-4-16-20-16h-124q-8 0-14 5t-6 12l-16 103q-27 9-50 21l-79-60q-6-5-14-5-8 0-14 6-70 64-92 94-4 5-4 13 0 6 5 12 8 12 28 37t30 40q-15 28-23 55l-102 15q-7 1-11 7t-5 13v124q0 7 5 13t10 7l104 16q8 25 22 51-23 32-60 77-6 7-6 14 0 5 5 12 15 20 55 60t53 40q7 0 15-5l77-60q24 13 50 21 9 76 17 104 3 16 20 16h124q7 0 13-5t7-12l15-103q28-9 51-20l79 59q5 5 13 5 7 0 14-5 72-67 92-95 4-5 4-12 0-7-4-13-9-12-29-37t-30-40q15-28 23-54l102-16q7-1 12-7t4-13z" horiz-adv-x="857.1" />
-
-<glyph glyph-name="off" unicode="&#xe80a;" d="M857 350q0-87-34-166t-91-137-137-92-166-34-167 34-136 92-92 137-34 166q0 102 45 191t126 151q24 18 54 14t46-28q18-23 14-53t-28-47q-54-41-84-101t-30-127q0-58 23-111t61-91 91-61 111-23 110 23 92 61 61 91 22 111q0 68-30 127t-84 101q-23 18-28 47t14 53q17 24 47 28t53-14q81-61 126-151t45-191z m-357 429v-358q0-29-21-50t-50-21-51 21-21 50v358q0 29 21 50t51 21 50-21 21-50z" horiz-adv-x="857.1" />
-
-<glyph glyph-name="video" unicode="&#xe80b;" d="M214-43v72q0 14-10 25t-25 10h-72q-14 0-25-10t-11-25v-72q0-14 11-25t25-11h72q14 0 25 11t10 25z m0 214v72q0 14-10 25t-25 11h-72q-14 0-25-11t-11-25v-72q0-14 11-25t25-10h72q14 0 25 10t10 25z m0 215v71q0 15-10 25t-25 11h-72q-14 0-25-11t-11-25v-71q0-15 11-25t25-11h72q14 0 25 11t10 25z m572-429v286q0 14-11 25t-25 11h-429q-14 0-25-11t-10-25v-286q0-14 10-25t25-11h429q15 0 25 11t11 25z m-572 643v71q0 15-10 26t-25 10h-72q-14 0-25-10t-11-26v-71q0-14 11-25t25-11h72q14 0 25 11t10 25z m786-643v72q0 14-11 25t-25 10h-71q-15 0-25-10t-11-25v-72q0-14 11-25t25-11h71q15 0 25 11t11 25z m-214 429v285q0 15-11 26t-25 10h-429q-14 0-25-10t-10-26v-285q0-15 10-25t25-11h429q15 0 25 11t11 25z m214-215v72q0 14-11 25t-25 11h-71q-15 0-25-11t-11-25v-72q0-14 11-25t25-10h71q15 0 25 10t11 25z m0 215v71q0 15-11 25t-25 11h-71q-15 0-25-11t-11-25v-71q0-15 11-25t25-11h71q15 0 25 11t11 25z m0 214v71q0 15-11 26t-25 10h-71q-15 0-25-10t-11-26v-71q0-14 11-25t25-11h71q15 0 25 11t11 25z m71 89v-750q0-37-26-63t-63-26h-893q-36 0-63 26t-26 63v750q0 37 26 63t63 27h893q37 0 63-27t26-63z" horiz-adv-x="1071.4" />
-
-<glyph glyph-name="upload" unicode="&#xe80c;" d="M714 29q0 14-10 25t-25 10-25-10-11-25 11-25 25-11 25 11 10 25z m143 0q0 14-10 25t-26 10-25-10-10-25 10-25 25-11 26 11 10 25z m72 125v-179q0-22-16-38t-38-16h-821q-23 0-38 16t-16 38v179q0 22 16 38t38 15h238q12-31 39-51t62-20h143q34 0 61 20t40 51h238q22 0 38-15t16-38z m-182 361q-9-22-33-22h-143v-250q0-15-10-25t-25-11h-143q-15 0-25 11t-11 25v250h-143q-23 0-33 22-9 22 8 39l250 250q10 10 25 10t25-10l250-250q18-17 8-39z" horiz-adv-x="928.6" />
-
-<glyph glyph-name="minus" unicode="&#xe80d;" d="M786 439v-107q0-22-16-38t-38-15h-678q-23 0-38 15t-16 38v107q0 23 16 38t38 16h678q23 0 38-16t16-38z" horiz-adv-x="785.7" />
-
-<glyph glyph-name="colon" unicode="&#xe80e;" d="M0 526c0 53 43 97 98 97 53 0 97-44 97-97 0-55-44-98-97-98-55 0-98 43-98 98z m0-352c0 54 43 98 98 98 53 0 97-44 97-98 0-55-44-97-97-97-55 0-98 42-98 97z" horiz-adv-x="195" />
-
-<glyph glyph-name="pi" unicode="&#xe80f;" d="M714 557q15-15 15-37t-15-37q-58-58-141-74l0-292q0-22-15-37t-37-16-37 16-15 37l0 292q-84 16-141 74-30 30-68 41l0-407q0-22-15-37t-36-16-37 16-16 37l0 407q-37-11-67-41-15-15-37-15t-37 15-15 37 15 37q80 80 193 80t193-80q50-50 120-50t119 50q15 15 37 15t37-15z" horiz-adv-x="729" />
-
-<glyph glyph-name="list-alt" unicode="&#xe810;" d="M214 189v-35q0-8-5-13t-13-5h-35q-7 0-13 5t-5 13v35q0 8 5 13t13 5h35q8 0 13-5t5-13z m0 143v-36q0-7-5-12t-13-5h-35q-7 0-13 5t-5 12v36q0 7 5 13t13 5h35q8 0 13-5t5-13z m0 143v-36q0-7-5-12t-13-6h-35q-7 0-13 6t-5 12v36q0 7 5 13t13 5h35q8 0 13-5t5-13z m643-286v-35q0-8-5-13t-13-5h-535q-8 0-13 5t-5 13v35q0 8 5 13t13 5h535q8 0 13-5t5-13z m0 143v-36q0-7-5-12t-13-5h-535q-8 0-13 5t-5 12v36q0 7 5 13t13 5h535q8 0 13-5t5-13z m0 143v-36q0-7-5-12t-13-6h-535q-8 0-13 6t-5 12v36q0 7 5 13t13 5h535q8 0 13-5t5-13z m72-393v464q0 8-6 13t-12 5h-822q-7 0-12-5t-6-13v-464q0-7 6-12t12-6h822q7 0 12 6t6 12z m71 607v-607q0-37-26-63t-63-26h-822q-36 0-63 26t-26 63v607q0 37 26 63t63 27h822q37 0 63-27t26-63z" horiz-adv-x="1000" />
-
-<glyph glyph-name="resize-vertical" unicode="&#xe811;" d="M393 671q0-14-11-25t-25-10h-71v-572h71q15 0 25-10t11-25-11-25l-143-143q-10-11-25-11t-25 11l-143 143q-10 10-10 25t10 25 25 10h72v572h-72q-14 0-25 10t-10 25 10 26l143 142q11 11 25 11t25-11l143-142q11-11 11-26z" horiz-adv-x="428.6" />
-
-<glyph glyph-name="math" unicode="&#xf01a;" d="M0 472q0 31 24 54t57 22h215l164-249 89 519h306q34 0 58-22t24-54-24-55-58-22h-170l-136-784-343 516h-125q-33 0-57 22t-24 53z" horiz-adv-x="937.5" />
-
-<glyph glyph-name="move" unicode="&#xf047;" d="M1000 350q0-14-11-25l-142-143q-11-11-26-11t-25 11-10 25v72h-215v-215h72q14 0 25-10t11-25-11-25l-143-143q-10-11-25-11t-25 11l-143 143q-11 10-11 25t11 25 25 10h72v215h-215v-72q0-14-10-25t-25-11-25 11l-143 143q-11 11-11 25t11 25l143 143q10 11 25 11t25-11 10-25v-72h215v215h-72q-14 0-25 10t-11 25 11 26l143 142q11 11 25 11t25-11l143-142q11-11 11-26t-11-25-25-10h-72v-215h215v72q0 14 10 25t25 11 26-11l142-143q11-10 11-25z" horiz-adv-x="1000" />
-
-<glyph glyph-name="link-ext" unicode="&#xf08e;" d="M786 332v-178q0-67-47-114t-114-47h-464q-67 0-114 47t-47 114v464q0 66 47 113t114 48h393q7 0 12-5t5-13v-36q0-8-5-13t-12-5h-393q-37 0-63-26t-27-63v-464q0-37 27-63t63-27h464q37 0 63 27t26 63v178q0 8 5 13t13 5h36q8 0 13-5t5-13z m214 482v-285q0-15-11-25t-25-11-25 11l-98 98-364-364q-5-6-13-6t-12 6l-64 64q-6 5-6 12t6 13l364 364-98 98q-11 11-11 25t11 25 25 11h285q15 0 25-11t11-25z" horiz-adv-x="1000" />
-
-<glyph glyph-name="bookmark-empty" unicode="&#xf097;" d="M643 707h-572v-693l237 227 49 47 50-47 236-227v693z m7 72q12 0 24-5 19-8 29-23t11-35v-719q0-19-11-35t-29-23q-10-4-24-4-27 0-47 18l-246 236-246-236q-20-19-46-19-13 0-25 5-18 7-29 23t-11 35v719q0 19 11 35t29 23q12 5 25 5h585z" horiz-adv-x="714.3" />
-
-<glyph glyph-name="list-bullet" unicode="&#xf0ca;" d="M214 64q0-44-31-76t-76-31-76 31-31 76 31 76 76 31 76-31 31-76z m0 286q0-45-31-76t-76-31-76 31-31 76 31 76 76 31 76-31 31-76z m786-232v-107q0-7-5-13t-13-5h-678q-8 0-13 5t-5 13v107q0 7 5 12t13 6h678q7 0 13-6t5-12z m-786 518q0-45-31-76t-76-31-76 31-31 76 31 76 76 31 76-31 31-76z m786-232v-108q0-7-5-12t-13-5h-678q-8 0-13 5t-5 12v108q0 7 5 12t13 5h678q7 0 13-5t5-12z m0 285v-107q0-7-5-12t-13-6h-678q-8 0-13 6t-5 12v107q0 8 5 13t13 5h678q7 0 13-5t5-13z" horiz-adv-x="1000" />
-
-<glyph glyph-name="list-numbered" unicode="&#xf0cb;" d="M213-54q0-45-31-70t-75-26q-60 0-96 37l31 49q28-25 60-25 16 0 28 8t12 24q0 35-59 31l-14 31q4 6 18 24t24 31 20 21v1q-9 0-27-1t-27 0v-30h-59v85h186v-49l-53-65q28-6 45-27t17-49z m1 350v-89h-202q-4 20-4 30 0 29 14 52t31 38 37 27 31 24 14 25q0 14-9 22t-22 7q-25 0-45-32l-47 33q13 28 40 44t59 16q40 0 68-23t28-63q0-28-19-51t-42-36-42-28-20-30h71v34h59z m786-178v-107q0-7-5-13t-13-5h-678q-8 0-13 5t-5 13v107q0 8 5 13t13 5h678q7 0 13-6t5-12z m-786 502v-56h-187v56h60q0 22 0 67t1 68v7h-1q-5-10-28-30l-40 42 76 71h59v-225h60z m786-216v-108q0-7-5-12t-13-5h-678q-8 0-13 5t-5 12v108q0 7 5 12t13 5h678q7 0 13-5t5-12z m0 285v-107q0-7-5-12t-13-6h-678q-8 0-13 6t-5 12v107q0 8 5 13t13 5h678q7 0 13-5t5-13z" horiz-adv-x="1000" />
-
-<glyph glyph-name="table" unicode="&#xf0ce;" d="M286 82v107q0 8-5 13t-13 5h-179q-7 0-12-5t-6-13v-107q0-8 6-13t12-5h179q8 0 13 5t5 13z m0 214v108q0 7-5 12t-13 5h-179q-7 0-12-5t-6-12v-108q0-7 6-12t12-5h179q8 0 13 5t5 12z m285-214v107q0 8-5 13t-12 5h-179q-8 0-13-5t-5-13v-107q0-8 5-13t13-5h179q7 0 12 5t5 13z m-285 429v107q0 8-5 13t-13 5h-179q-7 0-12-5t-6-13v-107q0-8 6-13t12-5h179q8 0 13 5t5 13z m285-215v108q0 7-5 12t-12 5h-179q-8 0-13-5t-5-12v-108q0-7 5-12t13-5h179q7 0 12 5t5 12z m286-214v107q0 8-5 13t-13 5h-178q-8 0-13-5t-5-13v-107q0-8 5-13t13-5h178q8 0 13 5t5 13z m-286 429v107q0 8-5 13t-12 5h-179q-8 0-13-5t-5-13v-107q0-8 5-13t13-5h179q7 0 12 5t5 13z m286-215v108q0 7-5 12t-13 5h-178q-8 0-13-5t-5-12v-108q0-7 5-12t13-5h178q8 0 13 5t5 12z m0 215v107q0 8-5 13t-13 5h-178q-8 0-13-5t-5-13v-107q0-8 5-13t13-5h178q8 0 13 5t5 13z m72 178v-607q0-37-27-63t-63-26h-750q-36 0-63 26t-26 63v607q0 37 26 63t63 27h750q37 0 63-27t27-63z" horiz-adv-x="928.6" />
-
-<glyph glyph-name="doc-text" unicode="&#xf0f6;" d="M819 638q16-16 27-42t11-50v-642q0-23-15-38t-38-16h-750q-23 0-38 16t-16 38v892q0 23 16 38t38 16h500q22 0 49-11t42-27z m-248 136v-210h210q-5 17-12 23l-175 175q-6 7-23 12z m215-853v572h-232q-23 0-38 16t-16 37v233h-429v-858h715z m-572 483q0 7 5 12t13 5h393q8 0 13-5t5-12v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36z m411-125q8 0 13-5t5-13v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36q0 8 5 13t13 5h393z m0-143q8 0 13-5t5-13v-36q0-8-5-13t-13-5h-393q-8 0-13 5t-5 13v36q0 8 5 13t13 5h393z" horiz-adv-x="857.1" />
-
-<glyph glyph-name="quote-left" unicode="&#xf10d;" d="M429 314v-214q0-45-32-76t-76-31h-214q-44 0-76 31t-31 76v393q0 58 23 111t61 91 91 61 111 23h35q15 0 26-11t10-25v-72q0-14-10-25t-26-10h-35q-59 0-101-42t-42-101v-18q0-22 16-38t37-16h125q45 0 76-31t32-76z m500 0v-214q0-45-32-76t-76-31h-214q-44 0-76 31t-31 76v393q0 58 23 111t61 91 91 61 111 23h35q15 0 26-11t10-25v-72q0-14-10-25t-26-10h-35q-59 0-101-42t-42-101v-18q0-22 16-38t37-16h125q45 0 76-31t32-76z" horiz-adv-x="928.6" />
-
-<glyph glyph-name="folder-empty" unicode="&#xf114;" d="M857 118v393q0 22-15 38t-38 15h-393q-23 0-38 16t-16 38v36q0 22-15 38t-38 15h-179q-22 0-38-15t-16-38v-536q0-22 16-38t38-16h679q22 0 38 16t15 38z m72 393v-393q0-51-37-88t-88-37h-679q-51 0-88 37t-37 88v536q0 51 37 88t88 37h179q51 0 88-37t37-88v-18h375q51 0 88-37t37-88z" horiz-adv-x="928.6" />
-
-<glyph glyph-name="code" unicode="&#xf121;" d="M344 69l-28-28q-5-5-12-5t-13 5l-260 261q-6 5-6 12t6 13l260 260q5 6 13 6t12-6l28-28q6-5 6-13t-6-12l-219-220 219-219q6-6 6-13t-6-13z m330 596l-208-721q-2-7-9-11t-13-1l-34 9q-8 3-11 9t-2 14l209 720q2 8 8 11t13 2l35-10q7-2 11-9t1-13z m367-363l-260-261q-6-5-13-5t-13 5l-28 28q-5 6-5 13t5 13l219 219-219 220q-5 5-5 12t5 13l28 28q6 6 13 6t13-6l260-260q5-5 5-13t-5-12z" horiz-adv-x="1071.4" />
-
-<glyph glyph-name="superscript" unicode="&#xf12b;" d="M501 86v-93h-139l-89 141-13 23q-4 5-6 12h-2q0-2-1-4t-2-4-2-4q-5-11-14-25l-86-139h-144v93h71l110 162-103 152h-76v94h154l77-127q1-2 13-24 4-5 6-11h2q1 5 6 11l14 24 78 127h143v-94h-69l-103-149 114-165h61z m355 379v-115h-287l-1 15q-3 16-3 26 0 36 15 65t36 48 47 37 47 30 36 30 15 36q0 21-17 35t-39 13q-29 0-54-21-8-6-20-22l-59 52q15 20 35 37 47 36 105 36 61 0 99-33t38-89q0-31-13-57t-35-43-45-33-46-28-37-28-17-36h130v45h70z" horiz-adv-x="857.1" />
-
-<glyph glyph-name="youtube-play" unicode="&#xf16a;" d="M397 221l270 139-270 141v-280z m103 481q94 0 181-3t128-5l41-2q0 0 9-1t13-2 13-2 16-5 16-7 17-11 16-15q4-3 9-10t16-33 15-56q4-36 7-76t3-64v-98q1-81-10-162-4-30-14-55t-18-35l-8-9q-7-8-16-15t-17-10-16-7-16-5-13-2-13-2-9-1q-140-11-350-11-115 2-201 4t-111 4l-28 3-20 2q-20 3-30 5t-29 12-31 23q-4 3-9 10t-16 33-15 56q-4 36-7 76t-3 64v98q-1 81 10 162 4 31 14 55t18 35l8 9q8 9 16 15t17 11 16 7 16 5 13 2 13 2 9 1q140 10 350 10z" horiz-adv-x="1000" />
-
-<glyph glyph-name="header" unicode="&#xf1dc;" d="M939-79q-25 0-74 2t-75 2q-24 0-73-2t-74-2q-13 0-21 12t-7 25q0 18 9 26t22 9 29 4 25 9q18 11 18 78l0 218q0 12-1 17-7 3-28 3h-376q-22 0-29-3 0-5 0-17l-1-207q0-79 21-91 9-6 26-8t32-2 25-8 11-26q0-14-6-26t-21-13q-26 0-78 2t-77 2q-24 0-71-2t-71-2q-13 0-20 12t-7 25q0 17 9 25t20 10 26 4 24 9q18 13 18 80l-1 31v454q0 2 1 15t0 20-1 21-2 24-4 20-6 18-9 10q-8 5-25 7t-29 1-23 7-10 26q0 14 6 26t20 13q26 0 78-2t77-2q23 0 71 2t70 2q14 0 21-13t7-26q0-17-9-25t-22-8-27-2-24-7q-20-12-20-90l1-178q0-12 0-18 7-2 22-2h390q14 0 21 2 1 6 1 18l0 178q0 78-19 90-10 6-33 7t-37 7-14 28q0 14 7 26t21 13q24 0 74-2t73-2q24 0 72 2t72 2q14 0 21-13t7-26q0-17-10-25t-22-8-29-2-24-7q-20-13-20-90l1-526q0-66 19-78 9-6 25-8t30-2 23-9 10-25q0-14-6-26t-20-13z" horiz-adv-x="1000" />
-
-<glyph glyph-name="paragraph" unicode="&#xf1dd;" d="M713 745v-41q0-16-10-34t-24-18q-28 0-30-1-14-3-18-17-1-6-1-36v-643q0-14-11-24t-24-10h-60q-14 0-24 10t-10 24v680h-80v-680q0-14-9-24t-25-10h-60q-14 0-24 10t-10 24v277q-82 7-137 33-70 33-107 100-36 65-36 145 0 92 50 159 49 66 116 89 62 21 233 21h267q14 0 24-10t10-24z" horiz-adv-x="714.3" />
-</font>
-</defs>
-</svg>

system/author/css/style.css

@@ -19,7 +19,11 @@ a, a:link, a:visited, a:focus, a:hover, a:active, button, .button, input, .contr
 	-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{
+.navi-item a, 
+.navi-item.file a .iconwrapper,
+.navi-item.folder a .iconwrapper,
+.navi-item.file a .movewrapper,
+.navi-item.folder a .movewrapper{
 	-webkit-transition: all 0.1s ease;
 	-moz-transition: all 0.1s ease;
 	-o-transition: all 0.1s ease;
@@ -131,9 +135,10 @@ aside.sidebar{
 .navi-items a:hover, .navi-items a:focus, .navi-items a:active, .navi-items a.active{
 	border-bottom: 3px solid #66b0a3;
 }
-.navi-items i{
-	color: #ddd;
+.navi-items .icon{
+	color: #ccc;
 }
+
 .navi-items span{
 	display: none;
 }
@@ -208,16 +213,16 @@ li.menu-item{
 	padding: 0px;
 	position: relative;
 }
-.navi-item i.icon-doc-text, 
-.navi-item i.icon-folder-empty, 
-.navi-item i.icon-home, 
-.navi-item i.icon-plus{
+.navi-item .iconwrapper{
 	display: inline-block;
 	position: absolute;
 	top: 0px;
 	background: transparent;
 	color: #ccc;
 	padding: 7px 2px 7px;
+	left: -24px;
+	width: 20px;
+	height: 16px;
 }
 .navi-item .status{
 	position: absolute;
@@ -232,17 +237,15 @@ li.menu-item{
 	background:#66b0a3;
 }
 .status.modified{
-/*	background: #FFD700; */
 	background: #FFA500;
 }
 .status.unpublished{
 	background:#cc4146;
 }
-.navi-item i.icon-resize-full-alt,
-.navi-item i.icon-move {
+.navi-item .movewrapper {
 	position: absolute;
-	right: 5px;
-	top: 7px;
+	right: 4px;
+	top: 4px;
 	color: #f9f8f6;
 	color: #444;
 	background: transparent;
@@ -263,9 +266,9 @@ li.menu-item{
 .navi-item.file a{
 	font-weight: 300;
 }
-.navi-item a:focus, .navi-item a:focus i,
-.navi-item a:hover, .navi-item a:hover i,
-.navi-item a.active, .navi-item a.active i{
+.navi-item a:focus,
+.navi-item a:hover, 
+.navi-item a.active{
 	background:#66b0a3;
 	color: #fff;
 }
@@ -800,7 +803,6 @@ fieldset.card{
 }
 .card img{
 	width: 100%;
-	border: 1px solid #f9f8f6; 
 	background: #f9f8f6; 
 }
 .cardInner{
@@ -1442,10 +1444,13 @@ label .help, .label .help{
 	border-radius: 2px;
 	font-size: 0.9em;
 }
-.blox-buttons button.edit:hover{
+.blox-buttons button.edit{
 	background: #70c1b3;
 	color: #eee;
 }
+.blox-buttons button.edit:hover{
+	background: #4D978A;
+}
 .blox-buttons button.cancel:hover{
 	background: #e0474c;
 	color: #eee;
@@ -1471,7 +1476,7 @@ label .help, .label .help{
 	color: #fff;
 	width: 20px;
 	height: 20px;
-	line-height: 20px;
+	line-height: 25px;
 	text-align: center;
 	padding: 0px;
 	margin: 1px;
@@ -1582,6 +1587,30 @@ button.hdown:hover,button.hdown:focus,button.hdown:active{
 
 
 /* .format-bar at the bottom of the page */
+
+/********************
+* 	SVG ICONS 		*
+********************/
+
+.icon {
+  display: inline-block;
+  width: 1em;
+  height: 1em;
+  stroke-width: 0;
+  stroke: currentColor;
+  fill: currentColor;
+}
+.icon.baseline{
+  top: 0.125em;
+  position: relative;	
+}
+.icon-file-text-o {
+  width: 0.8571428571428571em;
+}
+.icon-bookmark-o {
+  width: 0.7142857142857142em;
+  margin-right: 10px;
+}
 .format-bar .hidden{
 	display: none;
 }
@@ -1643,8 +1672,8 @@ button.hdown:hover,button.hdown:focus,button.hdown:active{
   opacity: 0.3;
 }
 button.format-item{
-	margin: 2px 0;
-	padding: 5px;
+	margin: 2px;
+	padding: 12px 5px;
 	background: #f9f8f6;
 	border: 1px solid #eee;
 	color: #444;
@@ -1707,8 +1736,10 @@ button.format-item.close:hover{
 	border-top: 6px solid #333;
 }
 .inlineFormatItem {  
-	color: #FFF;  
+	color: #FFF;
 	cursor: pointer;
+	font-size: 0.9em;
+	padding: 3px;
 }
 .inlineFormatItem:hover {  
 	color: #1199ff;
@@ -1862,7 +1893,8 @@ button.format-item.close:hover{
 	padding: 20px 20px 0 20px;
 	box-sizing: border-box;
 }
-.definitionRow .icon-colon{
+.definitionRow .icon-arrows-v,
+.definitionRow .icon-dots-two-vertical{
 	display: inline-block;
 	margin-top: 15px;
 }
@@ -1889,15 +1921,15 @@ button.delDL{
 	border: 0px;
 	background: transparent;
 }
-button.addDL i,
-button.delDL i{
-	width: 20px;
+button.addDL .icon-plus,
+button.delDL .icon-minus{
+	width: 10px;
+	height: 10px;
 	border-radius: 1px;
 	text-align: center;
 	color:#f9f8f6;
-	padding: 2px 0 0;
-	line-height: 20px;
-	height: 20px;
+	padding: 2px 1px 1px;
+	line-height: 10px;
 }
 button.addDL{
 	margin: 20px;
@@ -1914,9 +1946,17 @@ button.delDL i{
 button.delDL i:hover{
 	background: #cc4146;
 }
-i.icon-resize-vertical{
+.definitionList .icon-arrows-v{
 	color: #ddd;
 }
+.definitionList .icon-plus{
+	background: #66b0a3;
+	width: 10px;
+	height: 10px;
+}
+.definitionList .icon-minus{
+	background: #e0474c;
+}
 .blox ul, .blox ol{ 
 	padding-left: 0px;
 	margin-left: 18px;
@@ -2235,9 +2275,6 @@ footer a:focus, footer a:hover, footer a:active
 	span.level-3{ padding-left: 35px; }
 	span.level-4{ padding-left: 50px; }
 	span.level-5{ padding-left: 65px; }
-	.navi-item i.icon-doc-text, .navi-item i.icon-folder-empty, .navi-item i.icon-home, .navi-item i.icon-plus{
-		left: -24px;
-	}	
 	fieldset.plugin{
 		width: 49.5%;
 	}
@@ -2291,16 +2328,25 @@ footer a:focus, footer a:hover, footer a:active
 	.navi-item .status{
 		left: -30px;
 	}	
-	.navi-item a i.icon-move, .navi-item a:link i.icon-move, .navi-item a:visited i.icon-move{
+	.navi-item a .movewrapper, 
+	.navi-item a:link .movewrapper, 
+	.navi-item a:visited .movewrapper{
 		color: #f9f8f6;
 		background: transparent;
 	}
-	.navi-item a:focus, .navi-item a:focus i, .navi-item a:focus i.icon-move,
-	.navi-item a:hover, .navi-item a:hover i, .navi-item a:hover i.icon-move,
-	.navi-item a.active, .navi-item a.active i, .navi-item a.active i.icon-move{
+	.navi-item a:focus, 
+	.navi-item a:focus .iconwrapper, 
+	.navi-item a:focus .movewrapper, 
+	.navi-item a:hover, 
+	.navi-item a:hover .iconwrapper, 
+	.navi-item a:hover .movewrapper, 
+	.navi-item a.active, 
+	.navi-item a.active .iconwrapper,
+	.navi-item a.active .movewrapper
+	{
 		background:#fff;
 		color: #444;
-	}	
+	}
 	.navi-items span{
 		display: inline;
 	}	

system/author/editor/editor-blox.twig

@@ -2,9 +2,9 @@
 {% block title %}Visual Content Editor{% endblock %}
 
 {% block content %}
-	
+
 	<div class="formWrapper">
-		
+
 		<section id="blox">
 			
 			<div class="blox-body">
@@ -32,40 +32,22 @@
 						<content-block :body="true" v-for="(block, index) in html" v-if="index !== 0">
 							<div v-if="block" class="blox" :key="block.id" @click.prevent="setData( $event )" :data-id="index" :id="'blox-' + index" v-html="block.html"></div>
 							<div v-else class="format-bar blox" @click.prevent="clearData( $event )" :data-id="index" :id="'blox-' + index">
-								<button class="format-item" @click.prevent="setData( $event, 'markdown-component' )" :data-id="index" :id="'blox-' + index" title="paragraph"><i class="icon-paragraph"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'headline-component' )" :data-id="index" :id="'blox-' + index" title="headline"><i class="icon-header"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'ulist-component' )" :data-id="index" :id="'blox-' + index" title="bullet list"><i class="icon-list-bullet"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'olist-component' )" :data-id="index" :id="'blox-' + index" title="numbered list"><i class="icon-list-numbered"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'image-component' )" :data-id="index" :id="'blox-' + index" title="image"><i class="icon-picture"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'video-component' )" :data-id="index" :id="'blox-' + index" title="youtube"><i class="icon-youtube-play"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'table-component' )" :data-id="index" :id="'blox-' + index" title="table"><i class="icon-table"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'quote-component' )" :data-id="index" :id="'blox-' + index" title="quote"><i class="icon-quote-left"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'definition-component' )" :data-id="index" :id="'blox-' + index" title="definition list"><i class="icon-colon"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'toc-component' )" :data-id="index" :id="'blox-' + index" title="table of contents"><i class="icon-list-alt"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'hr-component' )" :data-id="index" :id="'blox-' + index" title="horizontal line"><i class="icon-minus"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'code-component' )" :data-id="index" :id="'blox-' + index" title="code block"><i class="icon-code"></i></button>
-								<button class="format-item" @click.prevent="setData( $event, 'math-component' )" :data-id="index" :id="'blox-' + index" title="math block"><i class="icon-math"></i></button>
+
+								<button v-for="button in formats" class="format-item"  @click.prevent="setData( $event, button.component )" :data-id="index" :id="'blox-' + index" :title="button.title" v-html="button.label"></button>
+
 							</div>
 						</content-block>
 					</draggable>
 				</div>
 	
 				<div class="format-bar">
+
 					<content-block :body="false">
-						<button class="format-item" @click.prevent="setData( $event, 'markdown-component' )" data-id="99999" id="blox-99999" title="paragraph"><i class="icon-paragraph"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'headline-component' )" data-id="99999" id="blox-99999" title="headline"><i class="icon-header"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'ulist-component' )" data-id="99999" id="blox-99999" title="bullet list"><i class="icon-list-bullet"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'olist-component' )" data-id="99999" id="blox-99999" title="numbered list"><i class="icon-list-numbered"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'image-component' )" data-id="99999" id="blox-99999" title="image"><i class="icon-picture"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'video-component' )" data-id="99999" id="blox-99999" title="youtube"><i class="icon-youtube-play"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'table-component' )" data-id="99999" id="blox-99999" title="table"><i class="icon-table"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'quote-component' )" data-id="99999" id="blox-99999" title="quote"><i class="icon-quote-left"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'definition-component' )" data-id="99999" id="blox-99999" title="definition list"><i class="icon-colon"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'toc-component' )" data-id="99999" id="blox-99999" title="table of contents"><i class="icon-list-alt"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'hr-component' )" data-id="99999" id="blox-99999" title="horizontal line"><i class="icon-minus"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'code-component' )" data-id="99999" id="blox-99999" title="code block"><i class="icon-code"></i></button>
-						<button class="format-item" @click.prevent="setData( $event, 'math-component' )" data-id="99999" id="blox-99999" title="math"><i class="icon-math"></i></button>
+
+						<button v-for="button in formats" class="format-item"  @click.prevent="setData( $event, button.component )" data-id="99999" id="blox-99999" :title="button.title" v-html="button.label"></button>
+					
 					</content-block>
+
 				</div>
 				
 			</div>

system/author/editor/publish-controller.twig

@@ -7,7 +7,7 @@
 		<button @click.prevent="showModal('delete')" class="button--secondary danger"><span class="desktop">delete</span><span class="mobile">X</span></button>
 		<a v-if="visual" href="{{ base_url }}/tm/content/raw{{item.urlRelWoF}}" class="button--secondary"><span class="desktop">raw mode</span><span class="mobile">raw</span></a>
 		<a v-if="raw" href="{{ base_url }}/tm/content/visual{{item.urlRelWoF}}" class="button--secondary"><span class="desktop">visual mode</span><span class="mobile">visual</span></a>
-		<a target="_blank" class="button--secondary" href="{{ item.urlAbs }}"><i class="icon-link-ext"></i></a>
+		<a target="_blank" class="button--secondary" href="{{ item.urlAbs }}"><svg class="icon baseline icon-external-link"><use xlink:href="#icon-external-link"></use></svg></a>
 	</div>
 	<transition name="fade">
 		<div v-if="modalWindow" id="modalWindow" class="modalWindow">
@@ -21,7 +21,7 @@
 				<div v-if="modalType == 'discard'">
 					<h2>Discard Changes</h2>
 					<p>Do you want to discard your changes and set the content back to the live version?</p>
-					<button @click.prevent="discardDraft" class="large fullwidth" :class="discardResult" :disabled="publishDisabled">Discard Changes</button>				
+					<button @click.prevent="discardDraft" class="large fullwidth" :class="discardResult" :disabled="publishDisabled">Discard Changes</button>
 				</div>
 			</div>
 		</div>

system/author/js/vue-blox-config.js

@@ -0,0 +1,74 @@
+let determiner = {
+
+	olist: function(block,lines,firstChar,secondChar,thirdChar){
+		if(block.match(/^\d+\./))
+		{ 
+			return "olist-component";
+		}
+		return false;
+	},
+	definition: function(block,lines,firstChar,secondChar,thirdChar){
+		if(lines.length > 1 && lines[1].substr(0,2) == ': ')
+		{
+			return "definition-component";
+		}
+		return false;
+	},
+	table: function(block,lines,firstChar,secondChar,thirdChar){
+		if(lines.length > 2 && lines[0].indexOf('|') != -1 && /[\-\|: ]{3,}$/.test(lines[1]))
+		{
+			return "table-component";
+		}
+		return false;
+	},
+	quote: function(block,lines,firstChar,secondChar,thirdChar){
+		if(firstChar == '>')
+		{
+			return "quote-component";
+		}
+		return false;
+	},
+	headline: function(block,lines,firstChar,secondChar,thirdChar){
+		if(firstChar == '#')
+		{
+			return "headline-component";
+		}
+		return false;
+	},
+	image: function(block,lines,firstChar,secondChar,thirdChar){
+		if( (firstChar == '!' && secondChar == '[') || (firstChar == '[' && secondChar == '!' && thirdChar == '[') )
+		{
+			return "image-component";
+		}
+		return false;
+	},
+	code: function(block,lines,firstChar,secondChar,thirdChar){
+		if( firstChar == '`' && secondChar == '`' && thirdChar == '`')
+		{
+			return "code-component";
+		}
+		return false;
+	},
+	ulist: function(block,lines,firstChar,secondChar,thirdChar){
+		if( (firstChar == '*' || firstChar == '-' || firstChar == '+') && secondChar == ' ')
+		{
+			return "ulist-component";
+		}
+		return false;
+	}
+}
+
+let bloxFormats = {
+			markdown: { label: '<svg class="icon icon-pilcrow"><use xlink:href="#icon-pilcrow"></use></svg>', title: 'Paragraph', component: 'markdown-component' },
+			headline: { label: '<svg class="icon icon-header"><use xlink:href="#icon-header"></use></svg>', title: 'Headline', component: 'headline-component' },
+			ulist: { label: '<svg class="icon icon-list2"><use xlink:href="#icon-list2"></use></svg>', title: 'Bullet List', component: 'ulist-component' },
+			olist: { label: '<svg class="icon icon-list-numbered"><use xlink:href="#icon-list-numbered"></use></svg>', title: 'Numbered List', component: 'olist-component' },
+			table: { label: '<svg class="icon icon-table2"><use xlink:href="#icon-table2"></use></svg>', title: 'Table', component: 'table-component' },
+			quote: { label: '<svg class="icon icon-quotes-left"><use xlink:href="#icon-quotes-left"></use></svg>', title: 'Quote', component: 'quote-component' },
+			image: { label: '<svg class="icon icon-image"><use xlink:href="#icon-image"></use></svg>', title: 'Image', component: 'image-component' },
+			video: { label: '<svg class="icon icon-play"><use xlink:href="#icon-play"></use></svg>', title: 'Video', component: 'video-component' },
+			toc: { label: '<svg class="icon icon-list-alt"><use xlink:href="#icon-list-alt"></use></svg>', title: 'Table of Contents', component: 'toc-component' },
+			hr: { label: '<svg class="icon icon-pagebreak"><use xlink:href="#icon-pagebreak"></use></svg>', title: 'Horizontal Line', component: 'hr-component' },
+			definition: { label: '<svg class="icon icon-dots-two-vertical"><use xlink:href="#icon-dots-two-vertical"></use></svg>', title: 'Definition List', component: 'definition-component' },
+			code: { label: '<svg class="icon icon-embed"><use xlink:href="#icon-embed"></use></svg>', title: 'Code', component: 'code-component' },
+};

system/author/js/vue-blox.js

@@ -6,8 +6,8 @@ const contentComponent = Vue.component('content-block', {
 				'<div v-if="newblock" class="newblock-info">Choose a content-type <button class="newblock-close" @click.prevent="closeNewBlock($event)">close</button></div>' +	
 				'<div class="blox-wrapper" :class="{ editactive: edit }">' +
 				 '<div class="sideaction" v-if="body">' + 
-				  '<button class="add" :disabled="disabled" title="add content-block" @click.prevent="addNewBlock($event)"><i class="icon-plus"></i></button>' +
-				  '<button class="delete" :disabled="disabled" title="delete content-block" @click.prevent="deleteBlock($event)"><i class="icon-cancel-1"></i></button>' +
+				  '<button class="add" :disabled="disabled" title="add content-block" @click.prevent="addNewBlock($event)"><svg class="icon icon-plus"><use xlink:href="#icon-plus"></use></svg></button>' +
+				  '<button class="delete" :disabled="disabled" title="delete content-block" @click.prevent="deleteBlock($event)"><svg class="icon icon-close"><use xlink:href="#icon-close"></use></svg></button>' +
 				 '</div>' + 
 				 '<div class="background-helper" @keyup.enter="submitBlock" @click="getData">' +
 				  '<div class="component" ref="component">' +
@@ -396,15 +396,15 @@ const inlineFormatsComponent = Vue.component('inline-formats', {
 	template: '<div><div :style="{ left: `${x}px`, top: `${y}px` }" @mousedown.prevent="" v-show="showInlineFormat" id="formatBar" class="inlineFormatBar">' + 
 				  '<div  v-if="link">' + 
 				      '<input v-model="url" @keyup.13="formatLink" ref="urlinput" class="urlinput" type="text" placeholder="insert url">' + 
-					  '<span class="inlineFormatItem inlineFormatLink" @mousedown.prevent="formatLink"><i class="icon-check"></i></span>' + 
-					  '<span class="inlineFormatItem inlineFormatLink" @mousedown.prevent="closeLink"><i class="icon-cancel"></i></span>' + 
+					  '<span class="inlineFormatItem inlineFormatLink" @mousedown.prevent="formatLink"><svg class="icon icon-check"><use xlink:href="#icon-check"></use></svg></span>' + 
+					  '<span class="inlineFormatItem inlineFormatLink" @mousedown.prevent="closeLink"><svg class="icon icon-cross"><use xlink:href="#icon-cross"></use></svg></i></span>' + 
 				  '</div>' +
 				  '<div v-else>' +
-					  '<span class="inlineFormatItem" @mousedown.prevent="formatBold"><i class="icon-bold"></i></span>' + 
-					  '<span class="inlineFormatItem" @mousedown.prevent="formatItalic"><i class="icon-italic"></i></span>' + 
-					  '<span class="inlineFormatItem" @mousedown.prevent="openLink"><i class="icon-link"></i></span>' + 
-					  '<span class="inlineFormatItem" @mousedown.prevent="formatCode"><i class="icon-code"></i></span>' + 
-					  '<span class="inlineFormatItem" @mousedown.prevent="formatMath"><i class="icon-pi"></i></span>' +
+					  '<span class="inlineFormatItem" @mousedown.prevent="formatBold"><svg class="icon icon-bold"><use xlink:href="#icon-bold"></use></svg></span>' + 
+					  '<span class="inlineFormatItem" @mousedown.prevent="formatItalic"><svg class="icon icon-italic"><use xlink:href="#icon-italic"></use></svg></span>' + 
+					  '<span class="inlineFormatItem" @mousedown.prevent="openLink"><svg class="icon icon-link"><use xlink:href="#icon-link"></use></svg></span>' + 
+					  '<span v-if="code" class="inlineFormatItem" @mousedown.prevent="formatCode"><svg class="icon icon-embed"><use xlink:href="#icon-embed"></use></svg></span>' + 
+					  '<span v-if="math" class="inlineFormatItem" @mousedown.prevent="formatMath"><svg class="icon icon-omega"><use xlink:href="#icon-omega"></use></svg></span>' +
 				   '</div>' + 
 				'</div><slot></slot></div>',
 	data: function(){
@@ -420,7 +420,9 @@ const inlineFormatsComponent = Vue.component('inline-formats', {
      		endPos: false,
      		showInlineFormat: false,
      		link: false,
-     		url: ''
+     		url: '',
+     		code: (formatConfig.indexOf("code") > -1) ? true : false,
+     		math: (formatConfig.indexOf("math") > -1) ? true : false,
      	}
 	},
 	mounted: function() {
@@ -433,7 +435,7 @@ const inlineFormatsComponent = Vue.component('inline-formats', {
 		window.removeEventListener('mousedown', this.onMousedown)
 	},
 	computed: {
-		highlightableEl () {    
+		highlightableEl: function () {    
 			return this.$slots.default[0].elm  
 		}
 	},
@@ -568,7 +570,7 @@ const titleComponent = Vue.component('title-component', {
 const markdownComponent = Vue.component('markdown-component', {
 	props: ['compmarkdown', 'disabled'],
 	template: '<div>' + 
-				'<div class="contenttype"><i class="icon-paragraph"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-pilcrow"><use xlink:href="#icon-pilcrow"></use></svg></div>' +
 				'<inline-formats>' +
 					'<textarea id="activeEdit" class="mdcontent" ref="markdown" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown(event.target.value)"></textarea>' + 
 			  	'</inline-formats>' +
@@ -588,7 +590,7 @@ const markdownComponent = Vue.component('markdown-component', {
 const hrComponent = Vue.component('hr-component', {
 	props: ['compmarkdown', 'disabled'],
 	template: '<div>' + 
-				'<div class="contenttype"><i class="icon-paragraph"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-pilcrow"><use xlink:href="#icon-pilcrow"></use></svg></div>' +
 				'<textarea class="mdcontent" ref="markdown" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown">---</textarea>' +
 				'</div>',
 	mounted: function(){
@@ -607,7 +609,7 @@ const hrComponent = Vue.component('hr-component', {
 const tocComponent = Vue.component('toc-component', {
 	props: ['compmarkdown', 'disabled'],
 	template: '<div>' + 
-				'<div class="contenttype"><i class="icon-paragraph"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-list-alt"><use xlink:href="#icon-list-alt"></use></svg></div>' +
 				'<textarea class="mdcontent" ref="markdown" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown">---</textarea>' +
 				'</div>',
 	mounted: function(){
@@ -627,7 +629,7 @@ const codeComponent = Vue.component('code-component', {
 	props: ['compmarkdown', 'disabled'],
 	template: '<div>' + 
 				'<input type="hidden" ref="markdown" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown" />' +	
-				'<div class="contenttype"><i class="icon-code"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-embed"><use xlink:href="#icon-embed"></use></svg></div>' +
 				'<textarea class="mdcontent" ref="markdown" v-model="codeblock" :disabled="disabled" @input="createmarkdown"></textarea>' + 
 				'</div>',
 	data: function(){
@@ -668,7 +670,7 @@ const quoteComponent = Vue.component('quote-component', {
 	props: ['compmarkdown', 'disabled'],
 	template: '<div>' + 
 				'<input type="hidden" ref="markdown" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown" />' +	
-				'<div class="contenttype"><i class="icon-quote-left"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-quotes-left"><use xlink:href="#icon-quotes-left"></use></svg></div>' +
 				'<inline-formats>' +
 					'<textarea class="mdcontent" ref="markdown" v-model="quote" :disabled="disabled" @input="updatemarkdown(event.target.value)"></textarea>' + 
 				'</inline-formats>' +
@@ -703,7 +705,7 @@ const quoteComponent = Vue.component('quote-component', {
 const ulistComponent = Vue.component('ulist-component', {
 	props: ['compmarkdown', 'disabled'],
 	template: '<div>' + 
-				'<div class="contenttype"><i class="icon-list-bullet"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-list2"><use xlink:href="#icon-list2"></use></svg></div>' +
 				'<inline-formats>' +
 					'<textarea class="mdcontent" ref="markdown" v-model="compmarkdown" :disabled="disabled" @input="updatemarkdown(event.target.value)"></textarea>' + 
 				'</inline-formats>' +
@@ -751,7 +753,7 @@ const ulistComponent = Vue.component('ulist-component', {
 const olistComponent = Vue.component('olist-component', {
 	props: ['compmarkdown', 'disabled'],
 	template: '<div>' + 
-				'<div class="contenttype"><i class="icon-list-numbered"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-list-numbered"><use xlink:href="#icon-list-numbered"></use></svg></div>' +
 				'<inline-formats>' +
 					'<textarea class="mdcontent" ref="markdown" v-model="compmarkdown" :disabled="disabled" @input="updatemarkdown(event.target.value)"></textarea>' + 
 				'</inline-formats>' +
@@ -777,7 +779,7 @@ const olistComponent = Vue.component('olist-component', {
 const headlineComponent = Vue.component('headline-component', { 
 	props: ['compmarkdown', 'disabled'],
 	template: '<div>' + 
-				'<div class="contenttype"><i class="icon-header"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-header"><use xlink:href="#icon-header"></use></svg></div>' +
 				'<button class="hdown" @click.prevent="headlinedown" v-html="level"></button>' +
 				'<input class="mdcontent" :class="hlevel" type="text" ref="markdown" v-model="compmarkdown" :disabled="disabled" @input="updatemarkdown">' +
 				'</div>',
@@ -869,7 +871,7 @@ const tableComponent = Vue.component('table-component', {
 		}
 	},
 	template: '<div ref="table" :key="tablekey">' + 
-				'<div class="contenttype"><i class="icon-table"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-table2"><use xlink:href="#icon-table2"></use></svg></div>' +
 				'<table ref="markdown">' +
 					'<colgroup>' +
 						'<col v-for="col in table[0]">' +
@@ -1071,17 +1073,17 @@ const definitionComponent = Vue.component('definition-component', {
 		}
 	},
 	template: '<div class="definitionList">' +
-				'<div class="contenttype"><i class="icon-colon"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-dots-two-vertical"><use xlink:href="#icon-dots-two-vertical"></use></svg></div>' +
 				'<draggable v-model="definitionList" :animation="150" @end="moveDefinition">' +
   			    '<div class="definitionRow" v-for="(definition, dindex) in definitionList" :key="definition.id">' +
-						'<i class="icon-resize-vertical"></i>' +
+						'<svg class="icon icon-arrows-v"><use xlink:href="#icon-arrows-v"></use></svg>' +
 						'<input type="text" class="definitionTerm" placeholder="term" :value="definition.term" :disabled="disabled" @input="updateterm($event,dindex)" @blur="updateMarkdown">' +
-		  		  '<i class="icon-colon"></i>' + 
+		  		  '<svg class="icon icon-dots-two-vertical"><use xlink:href="#icon-dots-two-vertical"></use></svg>' + 
 	  			  '<textarea class="definitionDescription" placeholder="description" v-html="definition.description" :disabled="disabled" @input="updatedescription($event, dindex)" @blur="updateMarkdown"></textarea>' +
-					  '<button class="delDL" @click.prevent="deleteDefinition(dindex)"><i class="icon-minus"></i></button>' +
+					  '<button class="delDL" @click.prevent="deleteDefinition(dindex)"><svg class="icon icon-minus"><use xlink:href="#icon-minus"></use></svg></button>' +
 				  '</div>' +
 				'</draggable>' +
-				'<button class="addDL" @click.prevent="addDefinition()"><i class="icon-plus"></i> add definition</button>' +
+				'<button class="addDL" @click.prevent="addDefinition()"><svg class="icon icon-plus"><use xlink:href="#icon-plus"></use></svg> add definition</button>' +
 				'<div v-if="load" class="loadwrapper"><span class="load"></span></div>' +
 				'</div>',
 	mounted: function(){
@@ -1147,53 +1149,11 @@ const definitionComponent = Vue.component('definition-component', {
 	},
 })
 
-const mathComponent = Vue.component('math-component', {
-	props: ['compmarkdown', 'disabled'],
-	template: '<div>' + 
-				'<input type="hidden" ref="markdown" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown" />' +	
-				'<div class="contenttype"><i class="icon-math"></i></div>' +
-				'<textarea class="mdcontent" ref="markdown" v-model="mathblock" :disabled="disabled" @input="createmarkdown"></textarea>' + 
-				'</div>',
-	data: function(){
-		return {
-			mathblock: ''
-		}
-	},
-	mounted: function(){
-		this.$refs.markdown.focus();
-		if(this.compmarkdown)
-		{
-			var dollarMath = new RegExp(/^\$\$[\S\s]+\$\$$/m);
-			var bracketMath = new RegExp(/^\\\[[\S\s]+\\\]$/m);
-
-			if(dollarMath.test(this.compmarkdown) || bracketMath.test(this.compmarkdown))
-			{
-				var mathExpression = this.compmarkdown.substring(2,this.compmarkdown.length-2);
-				this.mathblock = mathExpression.trim(); 
-			}
-		}
-		this.$nextTick(function () {
-			autosize(document.querySelectorAll('textarea'));
-		});
-	},
-	methods: {
-		createmarkdown: function(event)
-		{
-			this.codeblock = event.target.value;
-			var codeblock = '$$\n' + event.target.value + '\n$$';
-			this.updatemarkdown(codeblock);
-		},
-		updatemarkdown: function(codeblock)
-		{
-			this.$emit('updatedMarkdown', codeblock);
-		},
-	},
-})
 
 const videoComponent = Vue.component('video-component', {
 	props: ['compmarkdown', 'disabled', 'load'],
 	template: '<div class="video dropbox">' +
-				'<div class="contenttype"><i class="icon-youtube-play"></i></div>' +
+				'<div class="contenttype"><svg class="icon icon-play"><use xlink:href="#icon-play"></use></svg></div>' +
 				'<label for="video">Link to video: </label><input type="url" ref="markdown" placeholder="https://www.youtube.com/watch?v=" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown">' +
 				'<div v-if="load" class="loadwrapper"><span class="load"></span></div>' +
 				'</div>',
@@ -1211,7 +1171,7 @@ const imageComponent = Vue.component('image-component', {
 				'<input type="hidden" ref="markdown" :value="compmarkdown" :disabled="disabled" @input="updatemarkdown" />' +
 				'<input type="file" name="image" accept="image/*" class="input-file" @change="onFileChange( $event )" /> ' +
 				'<p>drag a picture or click to select</p>' +
-				'<div class="contenttype"><i class="icon-picture"></i></div>' +	
+				'<div class="contenttype"><svg class="icon icon-image"><use xlink:href="#icon-image"></use></svg></div>' +	
 				'<img class="uploadPreview" :src="imgpreview" />' +
 				'<div v-if="load" class="loadwrapper"><span class="load"></span></div>' +
 				'<div class="imgmeta" v-if="imgmeta">' +
@@ -1500,78 +1460,20 @@ let componentList = {
 }
 */
 
+let activeFormats = [];
 
-let determiner = {
-
-	olist: function(block,lines,firstChar,secondChar,thirdChar){
-		if(block.match(/^\d+\./))
-		{ 
-			return "olist-component";
-		}
-		return false;
-	},
-	definition: function(block,lines,firstChar,secondChar,thirdChar){
-		if(lines.length > 1 && lines[1].substr(0,2) == ': ')
-		{
-			return "definition-component";
-		}
-		return false;
-	},
-	table: function(block,lines,firstChar,secondChar,thirdChar){
-		if(lines.length > 2 && lines[0].indexOf('|') != -1 && /[\-\|: ]{3,}$/.test(lines[1]))
-		{
-			return "table-component";
-		}
-		return false;
-	},
-	quote: function(block,lines,firstChar,secondChar,thirdChar){
-		if(firstChar == '>')
-		{
-			return "quote-component";
-		}
-		return false;
-	},
-	headline: function(block,lines,firstChar,secondChar,thirdChar){
-		if(firstChar == '#')
-		{
-			return "headline-component";
-		}
-		return false;
-	},
-	image: function(block,lines,firstChar,secondChar,thirdChar){
-		if( (firstChar == '!' && secondChar == '[') || (firstChar == '[' && secondChar == '!' && thirdChar == '[') )
-		{
-			return "image-component";
-		}
-		return false;
-	},
-	math: function(block,lines,firstChar,secondChar,thirdChar){
-		if( (firstChar == '\\' && secondChar == '[') || ( firstChar == '$' && secondChar == '$$' ) )
-		{
-			return "math-component";
-		}
-		return false;
-	},
-	code: function(block,lines,firstChar,secondChar,thirdChar){
-		if( firstChar == '`' && secondChar == '`' && thirdChar == '`')
-		{
-			return "code-component";
-		}
-		return false;
-	},
-	ulist: function(block,lines,firstChar,secondChar,thirdChar){
-		if( (firstChar == '*' || firstChar == '-' || firstChar == '+') && secondChar == ' ')
-		{
-			return "ulist-component";
-		}
-		return false;
+for(var i = 0; i < formatConfig.length; i++)
+{
+	if(bloxFormats[formatConfig[i]] !== undefined)
+	{
+		activeFormats.push(bloxFormats[formatConfig[i]]);
 	}
 }
 
 let editor = new Vue({
     delimiters: ['${', '}'],
 	el: '#blox',
-//	components: componentList,
+/*	components: componentList, */
 	data: {
 		root: document.getElementById("main").dataset.url,
 		html: false,
@@ -1587,6 +1489,7 @@ let editor = new Vue({
 		draftDisabled: true,
 		bloxOverlay: false,
 		sortdisabled: false,
+		formats: activeFormats
 	},
 	mounted: function(){
 
@@ -1649,10 +1552,11 @@ let editor = new Vue({
 					self.markdown = result.data;
 					
 					/* make math plugin working */
+					
 					if (typeof renderMathInElement === "function") { 
 						self.$nextTick(function () {
-							renderMathInElement(document.body);
-						});		
+							renderMathInElement(document.getElementById("blox"));
+						});
 					}
 
 					/* check for youtube videos */

system/author/js/vue-navi.js

@@ -21,7 +21,7 @@ const navcomponent = Vue.component('navigation', {
 			return true;
 		},
 		onStart : function(evt)
-		{
+		{		
 			/* delete error messages if exist */
 			publishController.errors.message = false;
 		},
@@ -38,7 +38,7 @@ const navcomponent = Vue.component('navigation', {
 				'csrf_name': 		document.getElementById("csrf_name").value,
 				'csrf_value':		document.getElementById("csrf_value").value,				
 			};
-						
+
 			if(locator.parent_id_from == locator.parent_id_to && locator.index_old == locator.index_new)
 			{
 				return
@@ -91,13 +91,24 @@ const navcomponent = Vue.component('navigation', {
 		{
 			if(elementtype == 'file')
 			{
-				return 'icon-doc-text ' + filetype
+				return '#icon-file-text-o';
 			}
 			if(elementtype == 'folder')
 			{
-				return 'icon-folder-empty ' + filetype
+				return '#icon-folder-o';
 			}
 		},
+		getIconClass : function(elementtype, filetype)
+		{
+			if(elementtype == 'file')
+			{
+				return 'icon-file-text-o ' + filetype;
+			}
+			if(elementtype == 'folder')
+			{
+				return 'icon-folder-o ' + filetype;
+			}
+		},		
 		checkActive : function(active,parent)
 		{
 			if(active && !parent)

system/author/layouts/layout.twig

@@ -21,7 +21,28 @@
 		<link rel="stylesheet" href="{{ base_url }}/system/author/css/style.css?20191111" />
 		<link rel="stylesheet" href="{{ base_url }}/system/author/css/color-picker.min.css" />
 	</head>
-	<body>	
+	<body>
+		<svg style="position: absolute; width: 0; height: 0; overflow: hidden" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+			<defs>
+				<symbol id="icon-external-link" viewBox="0 0 28 28">
+					<title>external-link</title>
+					<path d="M22 14.5v5c0 2.484-2.016 4.5-4.5 4.5h-13c-2.484 0-4.5-2.016-4.5-4.5v-13c0-2.484 2.016-4.5 4.5-4.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-1.375 0-2.5 1.125-2.5 2.5v13c0 1.375 1.125 2.5 2.5 2.5h13c1.375 0 2.5-1.125 2.5-2.5v-5c0-0.281 0.219-0.5 0.5-0.5h1c0.281 0 0.5 0.219 0.5 0.5zM28 1v8c0 0.547-0.453 1-1 1-0.266 0-0.516-0.109-0.703-0.297l-2.75-2.75-10.187 10.187c-0.094 0.094-0.234 0.156-0.359 0.156s-0.266-0.063-0.359-0.156l-1.781-1.781c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266 0.156-0.359l10.187-10.187-2.75-2.75c-0.187-0.187-0.297-0.438-0.297-0.703 0-0.547 0.453-1 1-1h8c0.547 0 1 0.453 1 1z"></path>
+				</symbol>
+				<symbol id="icon-file-text-o" viewBox="0 0 24 28">
+					<title>text-file</title>
+					<path d="M22.937 5.938c0.578 0.578 1.062 1.734 1.062 2.562v18c0 0.828-0.672 1.5-1.5 1.5h-21c-0.828 0-1.5-0.672-1.5-1.5v-25c0-0.828 0.672-1.5 1.5-1.5h14c0.828 0 1.984 0.484 2.562 1.062zM16 2.125v5.875h5.875c-0.094-0.266-0.234-0.531-0.344-0.641l-4.891-4.891c-0.109-0.109-0.375-0.25-0.641-0.344zM22 26v-16h-6.5c-0.828 0-1.5-0.672-1.5-1.5v-6.5h-12v24h20zM6 12.5c0-0.281 0.219-0.5 0.5-0.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1zM17.5 16c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11zM17.5 20c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11z"></path>
+				</symbol>
+				<symbol id="icon-cog" viewBox="0 0 24 28">
+					<title>cog</title>
+					<path d="M16 14c0-2.203-1.797-4-4-4s-4 1.797-4 4 1.797 4 4 4 4-1.797 4-4zM24 12.297v3.469c0 0.234-0.187 0.516-0.438 0.562l-2.891 0.438c-0.172 0.5-0.359 0.969-0.609 1.422 0.531 0.766 1.094 1.453 1.672 2.156 0.094 0.109 0.156 0.25 0.156 0.391s-0.047 0.25-0.141 0.359c-0.375 0.5-2.484 2.797-3.016 2.797-0.141 0-0.281-0.063-0.406-0.141l-2.156-1.687c-0.453 0.234-0.938 0.438-1.422 0.594-0.109 0.953-0.203 1.969-0.453 2.906-0.063 0.25-0.281 0.438-0.562 0.438h-3.469c-0.281 0-0.531-0.203-0.562-0.469l-0.438-2.875c-0.484-0.156-0.953-0.344-1.406-0.578l-2.203 1.672c-0.109 0.094-0.25 0.141-0.391 0.141s-0.281-0.063-0.391-0.172c-0.828-0.75-1.922-1.719-2.578-2.625-0.078-0.109-0.109-0.234-0.109-0.359 0-0.141 0.047-0.25 0.125-0.359 0.531-0.719 1.109-1.406 1.641-2.141-0.266-0.5-0.484-1.016-0.641-1.547l-2.859-0.422c-0.266-0.047-0.453-0.297-0.453-0.562v-3.469c0-0.234 0.187-0.516 0.422-0.562l2.906-0.438c0.156-0.5 0.359-0.969 0.609-1.437-0.531-0.75-1.094-1.453-1.672-2.156-0.094-0.109-0.156-0.234-0.156-0.375s0.063-0.25 0.141-0.359c0.375-0.516 2.484-2.797 3.016-2.797 0.141 0 0.281 0.063 0.406 0.156l2.156 1.672c0.453-0.234 0.938-0.438 1.422-0.594 0.109-0.953 0.203-1.969 0.453-2.906 0.063-0.25 0.281-0.438 0.562-0.438h3.469c0.281 0 0.531 0.203 0.562 0.469l0.438 2.875c0.484 0.156 0.953 0.344 1.406 0.578l2.219-1.672c0.094-0.094 0.234-0.141 0.375-0.141s0.281 0.063 0.391 0.156c0.828 0.766 1.922 1.734 2.578 2.656 0.078 0.094 0.109 0.219 0.109 0.344 0 0.141-0.047 0.25-0.125 0.359-0.531 0.719-1.109 1.406-1.641 2.141 0.266 0.5 0.484 1.016 0.641 1.531l2.859 0.438c0.266 0.047 0.453 0.297 0.453 0.562z"></path>
+				</symbol>
+				<symbol id="icon-power-off" viewBox="0 0 24 28">
+					<title>power-off</title>
+					<path d="M24 14c0 6.609-5.391 12-12 12s-12-5.391-12-12c0-3.797 1.75-7.297 4.797-9.578 0.891-0.672 2.141-0.5 2.797 0.391 0.672 0.875 0.484 2.141-0.391 2.797-2.031 1.531-3.203 3.859-3.203 6.391 0 4.406 3.594 8 8 8s8-3.594 8-8c0-2.531-1.172-4.859-3.203-6.391-0.875-0.656-1.062-1.922-0.391-2.797 0.656-0.891 1.922-1.062 2.797-0.391 3.047 2.281 4.797 5.781 4.797 9.578zM14 2v10c0 1.094-0.906 2-2 2s-2-0.906-2-2v-10c0-1.094 0.906-2 2-2s2 0.906 2 2z"></path>
+				</symbol>
+			</defs>
+		</svg>
+		
 		<header class="main-header">
 			{% include 'partials/navi.twig' %}
 		</header>

system/author/layouts/layoutAuth.twig

@@ -22,7 +22,33 @@
 		<link rel="stylesheet" href="{{ base_url }}/system/author/css/style.css?20191111" />
 		<link rel="stylesheet" href="{{ base_url }}/system/author/css/color-picker.min.css" />
 	</head>
-	<body>	
+	<body>
+		<svg style="position: absolute; width: 0; height: 0; overflow: hidden" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+			<defs>
+				<symbol id="icon-external-link" viewBox="0 0 28 28">
+					<title>external-link</title>
+					<path d="M22 14.5v5c0 2.484-2.016 4.5-4.5 4.5h-13c-2.484 0-4.5-2.016-4.5-4.5v-13c0-2.484 2.016-4.5 4.5-4.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-1.375 0-2.5 1.125-2.5 2.5v13c0 1.375 1.125 2.5 2.5 2.5h13c1.375 0 2.5-1.125 2.5-2.5v-5c0-0.281 0.219-0.5 0.5-0.5h1c0.281 0 0.5 0.219 0.5 0.5zM28 1v8c0 0.547-0.453 1-1 1-0.266 0-0.516-0.109-0.703-0.297l-2.75-2.75-10.187 10.187c-0.094 0.094-0.234 0.156-0.359 0.156s-0.266-0.063-0.359-0.156l-1.781-1.781c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266 0.156-0.359l10.187-10.187-2.75-2.75c-0.187-0.187-0.297-0.438-0.297-0.703 0-0.547 0.453-1 1-1h8c0.547 0 1 0.453 1 1z"></path>
+				</symbol>
+				<symbol id="icon-file-text-o" viewBox="0 0 24 28">
+					<title>text-file</title>
+					<path d="M22.937 5.938c0.578 0.578 1.062 1.734 1.062 2.562v18c0 0.828-0.672 1.5-1.5 1.5h-21c-0.828 0-1.5-0.672-1.5-1.5v-25c0-0.828 0.672-1.5 1.5-1.5h14c0.828 0 1.984 0.484 2.562 1.062zM16 2.125v5.875h5.875c-0.094-0.266-0.234-0.531-0.344-0.641l-4.891-4.891c-0.109-0.109-0.375-0.25-0.641-0.344zM22 26v-16h-6.5c-0.828 0-1.5-0.672-1.5-1.5v-6.5h-12v24h20zM6 12.5c0-0.281 0.219-0.5 0.5-0.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1zM17.5 16c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11zM17.5 20c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11z"></path>
+				</symbol>
+				<symbol id="icon-cog" viewBox="0 0 24 28">
+					<title>cog</title>
+					<path d="M16 14c0-2.203-1.797-4-4-4s-4 1.797-4 4 1.797 4 4 4 4-1.797 4-4zM24 12.297v3.469c0 0.234-0.187 0.516-0.438 0.562l-2.891 0.438c-0.172 0.5-0.359 0.969-0.609 1.422 0.531 0.766 1.094 1.453 1.672 2.156 0.094 0.109 0.156 0.25 0.156 0.391s-0.047 0.25-0.141 0.359c-0.375 0.5-2.484 2.797-3.016 2.797-0.141 0-0.281-0.063-0.406-0.141l-2.156-1.687c-0.453 0.234-0.938 0.438-1.422 0.594-0.109 0.953-0.203 1.969-0.453 2.906-0.063 0.25-0.281 0.438-0.562 0.438h-3.469c-0.281 0-0.531-0.203-0.562-0.469l-0.438-2.875c-0.484-0.156-0.953-0.344-1.406-0.578l-2.203 1.672c-0.109 0.094-0.25 0.141-0.391 0.141s-0.281-0.063-0.391-0.172c-0.828-0.75-1.922-1.719-2.578-2.625-0.078-0.109-0.109-0.234-0.109-0.359 0-0.141 0.047-0.25 0.125-0.359 0.531-0.719 1.109-1.406 1.641-2.141-0.266-0.5-0.484-1.016-0.641-1.547l-2.859-0.422c-0.266-0.047-0.453-0.297-0.453-0.562v-3.469c0-0.234 0.187-0.516 0.422-0.562l2.906-0.438c0.156-0.5 0.359-0.969 0.609-1.437-0.531-0.75-1.094-1.453-1.672-2.156-0.094-0.109-0.156-0.234-0.156-0.375s0.063-0.25 0.141-0.359c0.375-0.516 2.484-2.797 3.016-2.797 0.141 0 0.281 0.063 0.406 0.156l2.156 1.672c0.453-0.234 0.938-0.438 1.422-0.594 0.109-0.953 0.203-1.969 0.453-2.906 0.063-0.25 0.281-0.438 0.562-0.438h3.469c0.281 0 0.531 0.203 0.562 0.469l0.438 2.875c0.484 0.156 0.953 0.344 1.406 0.578l2.219-1.672c0.094-0.094 0.234-0.141 0.375-0.141s0.281 0.063 0.391 0.156c0.828 0.766 1.922 1.734 2.578 2.656 0.078 0.094 0.109 0.219 0.109 0.344 0 0.141-0.047 0.25-0.125 0.359-0.531 0.719-1.109 1.406-1.641 2.141 0.266 0.5 0.484 1.016 0.641 1.531l2.859 0.438c0.266 0.047 0.453 0.297 0.453 0.562z"></path>
+				</symbol>
+				<symbol id="icon-power-off" viewBox="0 0 24 28">
+					<title>power-off</title>
+					<path d="M24 14c0 6.609-5.391 12-12 12s-12-5.391-12-12c0-3.797 1.75-7.297 4.797-9.578 0.891-0.672 2.141-0.5 2.797 0.391 0.672 0.875 0.484 2.141-0.391 2.797-2.031 1.531-3.203 3.859-3.203 6.391 0 4.406 3.594 8 8 8s8-3.594 8-8c0-2.531-1.172-4.859-3.203-6.391-0.875-0.656-1.062-1.922-0.391-2.797 0.656-0.891 1.922-1.062 2.797-0.391 3.047 2.281 4.797 5.781 4.797 9.578zM14 2v10c0 1.094-0.906 2-2 2s-2-0.906-2-2v-10c0-1.094 0.906-2 2-2s2 0.906 2 2z"></path>
+				</symbol>
+				<symbol id="icon-bookmark-o" viewBox="0 0 20 28">
+					<title>bookmark-o</title>
+					<path d="M18 4h-16v19.406l8-7.672 1.391 1.328 6.609 6.344v-19.406zM18.188 2c0.234 0 0.469 0.047 0.688 0.141 0.688 0.266 1.125 0.906 1.125 1.609v20.141c0 0.703-0.438 1.344-1.125 1.609-0.219 0.094-0.453 0.125-0.688 0.125-0.484 0-0.938-0.172-1.297-0.5l-6.891-6.625-6.891 6.625c-0.359 0.328-0.812 0.516-1.297 0.516-0.234 0-0.469-0.047-0.688-0.141-0.688-0.266-1.125-0.906-1.125-1.609v-20.141c0-0.703 0.438-1.344 1.125-1.609 0.219-0.094 0.453-0.141 0.688-0.141h16.375z"></path>
+				</symbol>				
+			</defs>
+		</svg>
+
+
 		{% include 'partials/flash.twig' %}
 		<div class="main">
 			

system/author/layouts/layoutBlank.twig

@@ -20,7 +20,28 @@
 		<link rel="stylesheet" href="{{ base_url }}/system/author/css/normalize.css" />
 		<link rel="stylesheet" href="{{ base_url }}/system/author/css/style.css?20191111" />
 	</head>
-	<body>	
+	<body>
+		<svg style="position: absolute; width: 0; height: 0; overflow: hidden" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+			<defs>
+				<symbol id="icon-external-link" viewBox="0 0 28 28">
+					<title>external-link</title>
+					<path d="M22 14.5v5c0 2.484-2.016 4.5-4.5 4.5h-13c-2.484 0-4.5-2.016-4.5-4.5v-13c0-2.484 2.016-4.5 4.5-4.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-1.375 0-2.5 1.125-2.5 2.5v13c0 1.375 1.125 2.5 2.5 2.5h13c1.375 0 2.5-1.125 2.5-2.5v-5c0-0.281 0.219-0.5 0.5-0.5h1c0.281 0 0.5 0.219 0.5 0.5zM28 1v8c0 0.547-0.453 1-1 1-0.266 0-0.516-0.109-0.703-0.297l-2.75-2.75-10.187 10.187c-0.094 0.094-0.234 0.156-0.359 0.156s-0.266-0.063-0.359-0.156l-1.781-1.781c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266 0.156-0.359l10.187-10.187-2.75-2.75c-0.187-0.187-0.297-0.438-0.297-0.703 0-0.547 0.453-1 1-1h8c0.547 0 1 0.453 1 1z"></path>
+				</symbol>
+				<symbol id="icon-file-text-o" viewBox="0 0 24 28">
+					<title>text-file</title>
+					<path d="M22.937 5.938c0.578 0.578 1.062 1.734 1.062 2.562v18c0 0.828-0.672 1.5-1.5 1.5h-21c-0.828 0-1.5-0.672-1.5-1.5v-25c0-0.828 0.672-1.5 1.5-1.5h14c0.828 0 1.984 0.484 2.562 1.062zM16 2.125v5.875h5.875c-0.094-0.266-0.234-0.531-0.344-0.641l-4.891-4.891c-0.109-0.109-0.375-0.25-0.641-0.344zM22 26v-16h-6.5c-0.828 0-1.5-0.672-1.5-1.5v-6.5h-12v24h20zM6 12.5c0-0.281 0.219-0.5 0.5-0.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1zM17.5 16c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11zM17.5 20c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11z"></path>
+				</symbol>
+				<symbol id="icon-cog" viewBox="0 0 24 28">
+					<title>cog</title>
+					<path d="M16 14c0-2.203-1.797-4-4-4s-4 1.797-4 4 1.797 4 4 4 4-1.797 4-4zM24 12.297v3.469c0 0.234-0.187 0.516-0.438 0.562l-2.891 0.438c-0.172 0.5-0.359 0.969-0.609 1.422 0.531 0.766 1.094 1.453 1.672 2.156 0.094 0.109 0.156 0.25 0.156 0.391s-0.047 0.25-0.141 0.359c-0.375 0.5-2.484 2.797-3.016 2.797-0.141 0-0.281-0.063-0.406-0.141l-2.156-1.687c-0.453 0.234-0.938 0.438-1.422 0.594-0.109 0.953-0.203 1.969-0.453 2.906-0.063 0.25-0.281 0.438-0.562 0.438h-3.469c-0.281 0-0.531-0.203-0.562-0.469l-0.438-2.875c-0.484-0.156-0.953-0.344-1.406-0.578l-2.203 1.672c-0.109 0.094-0.25 0.141-0.391 0.141s-0.281-0.063-0.391-0.172c-0.828-0.75-1.922-1.719-2.578-2.625-0.078-0.109-0.109-0.234-0.109-0.359 0-0.141 0.047-0.25 0.125-0.359 0.531-0.719 1.109-1.406 1.641-2.141-0.266-0.5-0.484-1.016-0.641-1.547l-2.859-0.422c-0.266-0.047-0.453-0.297-0.453-0.562v-3.469c0-0.234 0.187-0.516 0.422-0.562l2.906-0.438c0.156-0.5 0.359-0.969 0.609-1.437-0.531-0.75-1.094-1.453-1.672-2.156-0.094-0.109-0.156-0.234-0.156-0.375s0.063-0.25 0.141-0.359c0.375-0.516 2.484-2.797 3.016-2.797 0.141 0 0.281 0.063 0.406 0.156l2.156 1.672c0.453-0.234 0.938-0.438 1.422-0.594 0.109-0.953 0.203-1.969 0.453-2.906 0.063-0.25 0.281-0.438 0.562-0.438h3.469c0.281 0 0.531 0.203 0.562 0.469l0.438 2.875c0.484 0.156 0.953 0.344 1.406 0.578l2.219-1.672c0.094-0.094 0.234-0.141 0.375-0.141s0.281 0.063 0.391 0.156c0.828 0.766 1.922 1.734 2.578 2.656 0.078 0.094 0.109 0.219 0.109 0.344 0 0.141-0.047 0.25-0.125 0.359-0.531 0.719-1.109 1.406-1.641 2.141 0.266 0.5 0.484 1.016 0.641 1.531l2.859 0.438c0.266 0.047 0.453 0.297 0.453 0.562z"></path>
+				</symbol>
+				<symbol id="icon-power-off" viewBox="0 0 24 28">
+					<title>power-off</title>
+					<path d="M24 14c0 6.609-5.391 12-12 12s-12-5.391-12-12c0-3.797 1.75-7.297 4.797-9.578 0.891-0.672 2.141-0.5 2.797 0.391 0.672 0.875 0.484 2.141-0.391 2.797-2.031 1.531-3.203 3.859-3.203 6.391 0 4.406 3.594 8 8 8s8-3.594 8-8c0-2.531-1.172-4.859-3.203-6.391-0.875-0.656-1.062-1.922-0.391-2.797 0.656-0.891 1.922-1.062 2.797-0.391 3.047 2.281 4.797 5.781 4.797 9.578zM14 2v10c0 1.094-0.906 2-2 2s-2-0.906-2-2v-10c0-1.094 0.906-2 2-2s2 0.906 2 2z"></path>
+				</symbol>
+			</defs>
+		</svg>
+		
 		<header class="main-header">
 			{% include 'partials/navi.twig' %}
 		</header>

system/author/layouts/layoutBlox.twig

@@ -25,7 +25,129 @@
 		{{ assets.renderCSS() }}
 
 	</head>
-	<body>	
+	<body>
+		<svg style="position: absolute; width: 0; height: 0; overflow: hidden" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+			<defs>
+
+				<symbol id="icon-external-link" viewBox="0 0 28 28">
+					<title>external-link</title>
+					<path d="M22 14.5v5c0 2.484-2.016 4.5-4.5 4.5h-13c-2.484 0-4.5-2.016-4.5-4.5v-13c0-2.484 2.016-4.5 4.5-4.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-1.375 0-2.5 1.125-2.5 2.5v13c0 1.375 1.125 2.5 2.5 2.5h13c1.375 0 2.5-1.125 2.5-2.5v-5c0-0.281 0.219-0.5 0.5-0.5h1c0.281 0 0.5 0.219 0.5 0.5zM28 1v8c0 0.547-0.453 1-1 1-0.266 0-0.516-0.109-0.703-0.297l-2.75-2.75-10.187 10.187c-0.094 0.094-0.234 0.156-0.359 0.156s-0.266-0.063-0.359-0.156l-1.781-1.781c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266 0.156-0.359l10.187-10.187-2.75-2.75c-0.187-0.187-0.297-0.438-0.297-0.703 0-0.547 0.453-1 1-1h8c0.547 0 1 0.453 1 1z"></path>
+				</symbol>
+				<symbol id="icon-file-text-o" viewBox="0 0 24 28">
+					<title>text-file</title>
+					<path d="M22.937 5.938c0.578 0.578 1.062 1.734 1.062 2.562v18c0 0.828-0.672 1.5-1.5 1.5h-21c-0.828 0-1.5-0.672-1.5-1.5v-25c0-0.828 0.672-1.5 1.5-1.5h14c0.828 0 1.984 0.484 2.562 1.062zM16 2.125v5.875h5.875c-0.094-0.266-0.234-0.531-0.344-0.641l-4.891-4.891c-0.109-0.109-0.375-0.25-0.641-0.344zM22 26v-16h-6.5c-0.828 0-1.5-0.672-1.5-1.5v-6.5h-12v24h20zM6 12.5c0-0.281 0.219-0.5 0.5-0.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1zM17.5 16c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11zM17.5 20c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11z"></path>
+				</symbol>
+				<symbol id="icon-cog" viewBox="0 0 24 28">
+					<title>cog</title>
+					<path d="M16 14c0-2.203-1.797-4-4-4s-4 1.797-4 4 1.797 4 4 4 4-1.797 4-4zM24 12.297v3.469c0 0.234-0.187 0.516-0.438 0.562l-2.891 0.438c-0.172 0.5-0.359 0.969-0.609 1.422 0.531 0.766 1.094 1.453 1.672 2.156 0.094 0.109 0.156 0.25 0.156 0.391s-0.047 0.25-0.141 0.359c-0.375 0.5-2.484 2.797-3.016 2.797-0.141 0-0.281-0.063-0.406-0.141l-2.156-1.687c-0.453 0.234-0.938 0.438-1.422 0.594-0.109 0.953-0.203 1.969-0.453 2.906-0.063 0.25-0.281 0.438-0.562 0.438h-3.469c-0.281 0-0.531-0.203-0.562-0.469l-0.438-2.875c-0.484-0.156-0.953-0.344-1.406-0.578l-2.203 1.672c-0.109 0.094-0.25 0.141-0.391 0.141s-0.281-0.063-0.391-0.172c-0.828-0.75-1.922-1.719-2.578-2.625-0.078-0.109-0.109-0.234-0.109-0.359 0-0.141 0.047-0.25 0.125-0.359 0.531-0.719 1.109-1.406 1.641-2.141-0.266-0.5-0.484-1.016-0.641-1.547l-2.859-0.422c-0.266-0.047-0.453-0.297-0.453-0.562v-3.469c0-0.234 0.187-0.516 0.422-0.562l2.906-0.438c0.156-0.5 0.359-0.969 0.609-1.437-0.531-0.75-1.094-1.453-1.672-2.156-0.094-0.109-0.156-0.234-0.156-0.375s0.063-0.25 0.141-0.359c0.375-0.516 2.484-2.797 3.016-2.797 0.141 0 0.281 0.063 0.406 0.156l2.156 1.672c0.453-0.234 0.938-0.438 1.422-0.594 0.109-0.953 0.203-1.969 0.453-2.906 0.063-0.25 0.281-0.438 0.562-0.438h3.469c0.281 0 0.531 0.203 0.562 0.469l0.438 2.875c0.484 0.156 0.953 0.344 1.406 0.578l2.219-1.672c0.094-0.094 0.234-0.141 0.375-0.141s0.281 0.063 0.391 0.156c0.828 0.766 1.922 1.734 2.578 2.656 0.078 0.094 0.109 0.219 0.109 0.344 0 0.141-0.047 0.25-0.125 0.359-0.531 0.719-1.109 1.406-1.641 2.141 0.266 0.5 0.484 1.016 0.641 1.531l2.859 0.438c0.266 0.047 0.453 0.297 0.453 0.562z"></path>
+				</symbol>
+				<symbol id="icon-power-off" viewBox="0 0 24 28">
+					<title>power-off</title>
+					<path d="M24 14c0 6.609-5.391 12-12 12s-12-5.391-12-12c0-3.797 1.75-7.297 4.797-9.578 0.891-0.672 2.141-0.5 2.797 0.391 0.672 0.875 0.484 2.141-0.391 2.797-2.031 1.531-3.203 3.859-3.203 6.391 0 4.406 3.594 8 8 8s8-3.594 8-8c0-2.531-1.172-4.859-3.203-6.391-0.875-0.656-1.062-1.922-0.391-2.797 0.656-0.891 1.922-1.062 2.797-0.391 3.047 2.281 4.797 5.781 4.797 9.578zM14 2v10c0 1.094-0.906 2-2 2s-2-0.906-2-2v-10c0-1.094 0.906-2 2-2s2 0.906 2 2z"></path>
+				</symbol>
+				
+				<symbol id="icon-minus" viewBox="0 0 22 28">
+					<title>delete</title>
+					<path d="M22 11.5v3c0 0.828-0.672 1.5-1.5 1.5h-19c-0.828 0-1.5-0.672-1.5-1.5v-3c0-0.828 0.672-1.5 1.5-1.5h19c0.828 0 1.5 0.672 1.5 1.5z"></path>
+				</symbol>
+				<symbol id="icon-plus" viewBox="0 0 22 28">
+					<title>add</title>
+					<path d="M22 11.5v3c0 0.828-0.672 1.5-1.5 1.5h-6.5v6.5c0 0.828-0.672 1.5-1.5 1.5h-3c-0.828 0-1.5-0.672-1.5-1.5v-6.5h-6.5c-0.828 0-1.5-0.672-1.5-1.5v-3c0-0.828 0.672-1.5 1.5-1.5h6.5v-6.5c0-0.828 0.672-1.5 1.5-1.5h3c0.828 0 1.5 0.672 1.5 1.5v6.5h6.5c0.828 0 1.5 0.672 1.5 1.5z"></path>
+				</symbol>
+				<symbol id="icon-close" viewBox="0 0 22 28">
+					<title>delete/close</title>
+					<path d="M20.281 20.656c0 0.391-0.156 0.781-0.438 1.062l-2.125 2.125c-0.281 0.281-0.672 0.438-1.062 0.438s-0.781-0.156-1.062-0.438l-4.594-4.594-4.594 4.594c-0.281 0.281-0.672 0.438-1.062 0.438s-0.781-0.156-1.062-0.438l-2.125-2.125c-0.281-0.281-0.438-0.672-0.438-1.062s0.156-0.781 0.438-1.062l4.594-4.594-4.594-4.594c-0.281-0.281-0.438-0.672-0.438-1.062s0.156-0.781 0.438-1.062l2.125-2.125c0.281-0.281 0.672-0.438 1.062-0.438s0.781 0.156 1.062 0.438l4.594 4.594 4.594-4.594c0.281-0.281 0.672-0.438 1.062-0.438s0.781 0.156 1.062 0.438l2.125 2.125c0.281 0.281 0.438 0.672 0.438 1.062s-0.156 0.781-0.438 1.062l-4.594 4.594 4.594 4.594c0.281 0.281 0.438 0.672 0.438 1.062z"></path>
+				</symbol>
+				<symbol id="icon-home" viewBox="0 0 26 28">
+					<title>home</title>
+					<path d="M22 15.5v7.5c0 0.547-0.453 1-1 1h-6v-6h-4v6h-6c-0.547 0-1-0.453-1-1v-7.5c0-0.031 0.016-0.063 0.016-0.094l8.984-7.406 8.984 7.406c0.016 0.031 0.016 0.063 0.016 0.094zM25.484 14.422l-0.969 1.156c-0.078 0.094-0.203 0.156-0.328 0.172h-0.047c-0.125 0-0.234-0.031-0.328-0.109l-10.813-9.016-10.813 9.016c-0.109 0.078-0.234 0.125-0.375 0.109-0.125-0.016-0.25-0.078-0.328-0.172l-0.969-1.156c-0.172-0.203-0.141-0.531 0.063-0.703l11.234-9.359c0.656-0.547 1.719-0.547 2.375 0l3.813 3.187v-3.047c0-0.281 0.219-0.5 0.5-0.5h3c0.281 0 0.5 0.219 0.5 0.5v6.375l3.422 2.844c0.203 0.172 0.234 0.5 0.063 0.703z"></path>
+				</symbol>
+				<symbol id="icon-arrows-v" viewBox="0 0 12 28">
+					<title>move vertical</title>
+					<path d="M11 5c0 0.547-0.453 1-1 1h-2v16h2c0.547 0 1 0.453 1 1 0 0.266-0.109 0.516-0.297 0.703l-4 4c-0.187 0.187-0.438 0.297-0.703 0.297s-0.516-0.109-0.703-0.297l-4-4c-0.187-0.187-0.297-0.438-0.297-0.703 0-0.547 0.453-1 1-1h2v-16h-2c-0.547 0-1-0.453-1-1 0-0.266 0.109-0.516 0.297-0.703l4-4c0.187-0.187 0.438-0.297 0.703-0.297s0.516 0.109 0.703 0.297l4 4c0.187 0.187 0.297 0.438 0.297 0.703z"></path>
+				</symbol>
+				<symbol id="icon-folder-o" viewBox="0 0 26 28">
+					<title>folder</title>
+					<path d="M24 20.5v-11c0-0.828-0.672-1.5-1.5-1.5h-11c-0.828 0-1.5-0.672-1.5-1.5v-1c0-0.828-0.672-1.5-1.5-1.5h-5c-0.828 0-1.5 0.672-1.5 1.5v15c0 0.828 0.672 1.5 1.5 1.5h19c0.828 0 1.5-0.672 1.5-1.5zM26 9.5v11c0 1.922-1.578 3.5-3.5 3.5h-19c-1.922 0-3.5-1.578-3.5-3.5v-15c0-1.922 1.578-3.5 3.5-3.5h5c1.922 0 3.5 1.578 3.5 3.5v0.5h10.5c1.922 0 3.5 1.578 3.5 3.5z"></path>
+				</symbol>
+
+				
+				<symbol id="icon-image" viewBox="0 0 32 32">
+					<title>image</title>
+					<path d="M29.996 4c0.001 0.001 0.003 0.002 0.004 0.004v23.993c-0.001 0.001-0.002 0.003-0.004 0.004h-27.993c-0.001-0.001-0.003-0.002-0.004-0.004v-23.993c0.001-0.001 0.002-0.003 0.004-0.004h27.993zM30 2h-28c-1.1 0-2 0.9-2 2v24c0 1.1 0.9 2 2 2h28c1.1 0 2-0.9 2-2v-24c0-1.1-0.9-2-2-2v0z"></path>
+					<path d="M26 9c0 1.657-1.343 3-3 3s-3-1.343-3-3 1.343-3 3-3 3 1.343 3 3z"></path>
+					<path d="M28 26h-24v-4l7-12 8 10h2l7-6z"></path>
+				</symbol>
+				<symbol id="icon-play" viewBox="0 0 32 32">
+					<title>video</title>
+					<path d="M30.662 5.003c-4.488-0.645-9.448-1.003-14.662-1.003s-10.174 0.358-14.662 1.003c-0.86 3.366-1.338 7.086-1.338 10.997s0.477 7.63 1.338 10.997c4.489 0.645 9.448 1.003 14.662 1.003s10.174-0.358 14.662-1.003c0.86-3.366 1.338-7.086 1.338-10.997s-0.477-7.63-1.338-10.997zM12 22v-12l10 6-10 6z"></path>
+				</symbol>
+				<symbol id="icon-quotes-left" viewBox="0 0 32 32">
+					<title>quotes</title>
+					<path d="M7.031 14c3.866 0 7 3.134 7 7s-3.134 7-7 7-7-3.134-7-7l-0.031-1c0-7.732 6.268-14 14-14v4c-2.671 0-5.182 1.040-7.071 2.929-0.364 0.364-0.695 0.751-0.995 1.157 0.357-0.056 0.724-0.086 1.097-0.086zM25.031 14c3.866 0 7 3.134 7 7s-3.134 7-7 7-7-3.134-7-7l-0.031-1c0-7.732 6.268-14 14-14v4c-2.671 0-5.182 1.040-7.071 2.929-0.364 0.364-0.695 0.751-0.995 1.157 0.358-0.056 0.724-0.086 1.097-0.086z"></path>
+				</symbol>
+				<symbol id="icon-list-numbered" viewBox="0 0 32 32">
+					<title>numbered list</title>
+					<path d="M12 26h20v4h-20zM12 14h20v4h-20zM12 2h20v4h-20zM6 0v8h-2v-6h-2v-2zM4 16.438v1.563h4v2h-6v-4.563l4-1.875v-1.563h-4v-2h6v4.563zM8 22v10h-6v-2h4v-2h-4v-2h4v-2h-4v-2z"></path>
+				</symbol>
+				<symbol id="icon-list2" viewBox="0 0 32 32">
+					<title>bullet list</title>
+					<path d="M12 2h20v4h-20v-4zM12 14h20v4h-20v-4zM12 26h20v4h-20v-4zM0 4c0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.209-1.791 4-4 4s-4-1.791-4-4zM0 16c0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.209-1.791 4-4 4s-4-1.791-4-4zM0 28c0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.209-1.791 4-4 4s-4-1.791-4-4z"></path>
+				</symbol>
+				<symbol id="icon-link" viewBox="0 0 32 32">
+					<title>link</title>
+					<path d="M13.757 19.868c-0.416 0-0.832-0.159-1.149-0.476-2.973-2.973-2.973-7.81 0-10.783l6-6c1.44-1.44 3.355-2.233 5.392-2.233s3.951 0.793 5.392 2.233c2.973 2.973 2.973 7.81 0 10.783l-2.743 2.743c-0.635 0.635-1.663 0.635-2.298 0s-0.635-1.663 0-2.298l2.743-2.743c1.706-1.706 1.706-4.481 0-6.187-0.826-0.826-1.925-1.281-3.094-1.281s-2.267 0.455-3.094 1.281l-6 6c-1.706 1.706-1.706 4.481 0 6.187 0.635 0.635 0.635 1.663 0 2.298-0.317 0.317-0.733 0.476-1.149 0.476z"></path>
+					<path d="M8 31.625c-2.037 0-3.952-0.793-5.392-2.233-2.973-2.973-2.973-7.81 0-10.783l2.743-2.743c0.635-0.635 1.664-0.635 2.298 0s0.635 1.663 0 2.298l-2.743 2.743c-1.706 1.706-1.706 4.481 0 6.187 0.826 0.826 1.925 1.281 3.094 1.281s2.267-0.455 3.094-1.281l6-6c1.706-1.706 1.706-4.481 0-6.187-0.635-0.635-0.635-1.663 0-2.298s1.663-0.635 2.298 0c2.973 2.973 2.973 7.81 0 10.783l-6 6c-1.44 1.44-3.355 2.233-5.392 2.233z"></path>
+				</symbol>
+				<symbol id="icon-bold" viewBox="0 0 32 32">
+					<title>bold</title>
+					<path d="M22.121 15.145c1.172-1.392 1.879-3.188 1.879-5.145 0-4.411-3.589-8-8-8h-10v28h12c4.411 0 8-3.589 8-8 0-2.905-1.556-5.453-3.879-6.855zM12 6h3.172c1.749 0 3.172 1.794 3.172 4s-1.423 4-3.172 4h-3.172v-8zM16.969 26h-4.969v-8h4.969c1.827 0 3.313 1.794 3.313 4s-1.486 4-3.313 4z"></path>
+				</symbol>
+				<symbol id="icon-italic" viewBox="0 0 32 32">
+					<title>italic</title>
+					<path d="M28 2v2h-4l-10 24h4v2h-14v-2h4l10-24h-4v-2z"></path>
+				</symbol>
+				<symbol id="icon-pagebreak" viewBox="0 0 32 32">
+					<title>horizontal line</title>
+					<path d="M8 12v-12h24v12h-2v-10h-20v10zM32 18v14h-24v-14h2v12h20v-12zM16 14h4v2h-4zM10 14h4v2h-4zM22 14h4v2h-4zM28 14h4v2h-4zM0 9l6 6-6 6z"></path>
+				</symbol>
+				<symbol id="icon-table2" viewBox="0 0 32 32">
+					<title>table</title>
+					<path d="M0 2v28h32v-28h-32zM12 20v-6h8v6h-8zM20 22v6h-8v-6h8zM20 6v6h-8v-6h8zM10 6v6h-8v-6h8zM2 14h8v6h-8v-6zM22 14h8v6h-8v-6zM22 12v-6h8v6h-8zM2 22h8v6h-8v-6zM22 28v-6h8v6h-8z"></path>
+				</symbol>
+				<symbol id="icon-pilcrow" viewBox="0 0 32 32">
+					<title>paragraph</title>
+					<path d="M12 0h16v4h-4v28h-4v-28h-4v28h-4v-16c-4.418 0-8-3.582-8-8s3.582-8 8-8z"></path>
+				</symbol>
+				<symbol id="icon-embed" viewBox="0 0 32 32">
+					<title>code</title>
+					<path d="M18 23l3 3 10-10-10-10-3 3 7 7z"></path>
+					<path d="M14 9l-3-3-10 10 10 10 3-3-7-7z"></path>
+				</symbol>
+				<symbol id="icon-header" viewBox="0 0 28 28">
+					<title>headline</title>
+					<path d="M26.281 26c-1.375 0-2.766-0.109-4.156-0.109-1.375 0-2.75 0.109-4.125 0.109-0.531 0-0.781-0.578-0.781-1.031 0-1.391 1.563-0.797 2.375-1.328 0.516-0.328 0.516-1.641 0.516-2.188l-0.016-6.109c0-0.172 0-0.328-0.016-0.484-0.25-0.078-0.531-0.063-0.781-0.063h-10.547c-0.266 0-0.547-0.016-0.797 0.063-0.016 0.156-0.016 0.313-0.016 0.484l-0.016 5.797c0 0.594 0 2.219 0.578 2.562 0.812 0.5 2.656-0.203 2.656 1.203 0 0.469-0.219 1.094-0.766 1.094-1.453 0-2.906-0.109-4.344-0.109-1.328 0-2.656 0.109-3.984 0.109-0.516 0-0.75-0.594-0.75-1.031 0-1.359 1.437-0.797 2.203-1.328 0.5-0.344 0.516-1.687 0.516-2.234l-0.016-0.891v-12.703c0-0.75 0.109-3.156-0.594-3.578-0.781-0.484-2.453 0.266-2.453-1.141 0-0.453 0.203-1.094 0.75-1.094 1.437 0 2.891 0.109 4.328 0.109 1.313 0 2.641-0.109 3.953-0.109 0.562 0 0.781 0.625 0.781 1.094 0 1.344-1.547 0.688-2.312 1.172-0.547 0.328-0.547 1.937-0.547 2.5l0.016 5c0 0.172 0 0.328 0.016 0.5 0.203 0.047 0.406 0.047 0.609 0.047h10.922c0.187 0 0.391 0 0.594-0.047 0.016-0.172 0.016-0.328 0.016-0.5l0.016-5c0-0.578 0-2.172-0.547-2.5-0.781-0.469-2.344 0.156-2.344-1.172 0-0.469 0.219-1.094 0.781-1.094 1.375 0 2.75 0.109 4.125 0.109 1.344 0 2.688-0.109 4.031-0.109 0.562 0 0.781 0.625 0.781 1.094 0 1.359-1.609 0.672-2.391 1.156-0.531 0.344-0.547 1.953-0.547 2.516l0.016 14.734c0 0.516 0.031 1.875 0.531 2.188 0.797 0.5 2.484-0.141 2.484 1.219 0 0.453-0.203 1.094-0.75 1.094z"></path>
+				</symbol>
+				<symbol id="icon-list-alt" viewBox="0 0 28 28">
+					<title>table of contents</title>
+					<path d="M6 18.5v1c0 0.266-0.234 0.5-0.5 0.5h-1c-0.266 0-0.5-0.234-0.5-0.5v-1c0-0.266 0.234-0.5 0.5-0.5h1c0.266 0 0.5 0.234 0.5 0.5zM6 14.5v1c0 0.266-0.234 0.5-0.5 0.5h-1c-0.266 0-0.5-0.234-0.5-0.5v-1c0-0.266 0.234-0.5 0.5-0.5h1c0.266 0 0.5 0.234 0.5 0.5zM6 10.5v1c0 0.266-0.234 0.5-0.5 0.5h-1c-0.266 0-0.5-0.234-0.5-0.5v-1c0-0.266 0.234-0.5 0.5-0.5h1c0.266 0 0.5 0.234 0.5 0.5zM24 18.5v1c0 0.266-0.234 0.5-0.5 0.5h-15c-0.266 0-0.5-0.234-0.5-0.5v-1c0-0.266 0.234-0.5 0.5-0.5h15c0.266 0 0.5 0.234 0.5 0.5zM24 14.5v1c0 0.266-0.234 0.5-0.5 0.5h-15c-0.266 0-0.5-0.234-0.5-0.5v-1c0-0.266 0.234-0.5 0.5-0.5h15c0.266 0 0.5 0.234 0.5 0.5zM24 10.5v1c0 0.266-0.234 0.5-0.5 0.5h-15c-0.266 0-0.5-0.234-0.5-0.5v-1c0-0.266 0.234-0.5 0.5-0.5h15c0.266 0 0.5 0.234 0.5 0.5zM26 21.5v-13c0-0.266-0.234-0.5-0.5-0.5h-23c-0.266 0-0.5 0.234-0.5 0.5v13c0 0.266 0.234 0.5 0.5 0.5h23c0.266 0 0.5-0.234 0.5-0.5zM28 4.5v17c0 1.375-1.125 2.5-2.5 2.5h-23c-1.375 0-2.5-1.125-2.5-2.5v-17c0-1.375 1.125-2.5 2.5-2.5h23c1.375 0 2.5 1.125 2.5 2.5z"></path>
+				</symbol>
+				<symbol id="icon-dots-two-vertical" viewBox="0 0 20 20">
+					<title>definition</title>
+					<path d="M10.001 8.2c1.215 0 2.199-0.986 2.199-2.2s-0.984-2.2-2.199-2.2c-1.215 0-2.201 0.985-2.201 2.2s0.986 2.2 2.201 2.2zM10.001 11.8c-1.215 0-2.201 0.985-2.201 2.2s0.986 2.2 2.201 2.2c1.215 0 2.199-0.985 2.199-2.2s-0.984-2.2-2.199-2.2z"></path>
+				</symbol>
+				<symbol id="icon-check" viewBox="0 0 20 20">
+					<title>check</title>
+					<path d="M8.294 16.998c-0.435 0-0.847-0.203-1.111-0.553l-3.573-4.721c-0.465-0.613-0.344-1.486 0.27-1.951 0.615-0.467 1.488-0.344 1.953 0.27l2.351 3.104 5.911-9.492c0.407-0.652 1.267-0.852 1.921-0.445s0.854 1.266 0.446 1.92l-6.984 11.21c-0.242 0.391-0.661 0.635-1.12 0.656-0.022 0.002-0.042 0.002-0.064 0.002z"></path>
+				</symbol>
+				<symbol id="icon-cross" viewBox="0 0 20 20">
+					<title>cross</title>
+					<path d="M14.348 14.849c-0.469 0.469-1.229 0.469-1.697 0l-2.651-3.030-2.651 3.029c-0.469 0.469-1.229 0.469-1.697 0-0.469-0.469-0.469-1.229 0-1.697l2.758-3.15-2.759-3.152c-0.469-0.469-0.469-1.228 0-1.697s1.228-0.469 1.697 0l2.652 3.031 2.651-3.031c0.469-0.469 1.228-0.469 1.697 0s0.469 1.229 0 1.697l-2.758 3.152 2.758 3.15c0.469 0.469 0.469 1.229 0 1.698z"></path>
+				</symbol>
+				{{ assets.renderSvg() }}
+			</defs>
+		</svg>
+
 		<header class="main-header">
 			{% include 'partials/navi.twig' %}
 		</header>
@@ -45,6 +167,13 @@
 		<script src="{{ base_url }}/system/author/js/vuedraggable.umd.min.js?20191111"></script>
 		<script src="{{ base_url }}/system/author/js/author.js?20191111"></script>
 		<script src="{{ base_url }}/system/author/js/vue-publishcontroller.js?20191111"></script>
+		<script src="{{ base_url }}/system/author/js/vue-blox-config.js?20191111"></script>
+		<script>
+			let formatConfig = {{ settings.formats|json_encode() }};
+		</script>
+
+		{{ assets.renderEditorJS() }}
+
 		<script src="{{ base_url }}/system/author/js/vue-blox.js?20191111"></script>
 		<script src="{{ base_url }}/system/author/js/vue-navi.js?20191111"></script>
 		<script src="{{ base_url }}/system/author/js/lazy-video.js?2019111"></script>

system/author/layouts/layoutEditor.twig

@@ -22,7 +22,28 @@
 		<link rel="stylesheet" href="{{ base_url }}/system/author/css/style.css?20191111" />
 		<link rel="stylesheet" href="{{ base_url }}/system/author/css/color-picker.min.css" />
 	</head>
-	<body>	
+	<body>
+		<svg style="position: absolute; width: 0; height: 0; overflow: hidden" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+			<defs>
+				<symbol id="icon-external-link" viewBox="0 0 28 28">
+					<title>external-link</title>
+					<path d="M22 14.5v5c0 2.484-2.016 4.5-4.5 4.5h-13c-2.484 0-4.5-2.016-4.5-4.5v-13c0-2.484 2.016-4.5 4.5-4.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-1.375 0-2.5 1.125-2.5 2.5v13c0 1.375 1.125 2.5 2.5 2.5h13c1.375 0 2.5-1.125 2.5-2.5v-5c0-0.281 0.219-0.5 0.5-0.5h1c0.281 0 0.5 0.219 0.5 0.5zM28 1v8c0 0.547-0.453 1-1 1-0.266 0-0.516-0.109-0.703-0.297l-2.75-2.75-10.187 10.187c-0.094 0.094-0.234 0.156-0.359 0.156s-0.266-0.063-0.359-0.156l-1.781-1.781c-0.094-0.094-0.156-0.234-0.156-0.359s0.063-0.266 0.156-0.359l10.187-10.187-2.75-2.75c-0.187-0.187-0.297-0.438-0.297-0.703 0-0.547 0.453-1 1-1h8c0.547 0 1 0.453 1 1z"></path>
+				</symbol>
+				<symbol id="icon-file-text-o" viewBox="0 0 24 28">
+					<title>text-file</title>
+					<path d="M22.937 5.938c0.578 0.578 1.062 1.734 1.062 2.562v18c0 0.828-0.672 1.5-1.5 1.5h-21c-0.828 0-1.5-0.672-1.5-1.5v-25c0-0.828 0.672-1.5 1.5-1.5h14c0.828 0 1.984 0.484 2.562 1.062zM16 2.125v5.875h5.875c-0.094-0.266-0.234-0.531-0.344-0.641l-4.891-4.891c-0.109-0.109-0.375-0.25-0.641-0.344zM22 26v-16h-6.5c-0.828 0-1.5-0.672-1.5-1.5v-6.5h-12v24h20zM6 12.5c0-0.281 0.219-0.5 0.5-0.5h11c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1zM17.5 16c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11zM17.5 20c0.281 0 0.5 0.219 0.5 0.5v1c0 0.281-0.219 0.5-0.5 0.5h-11c-0.281 0-0.5-0.219-0.5-0.5v-1c0-0.281 0.219-0.5 0.5-0.5h11z"></path>
+				</symbol>
+				<symbol id="icon-cog" viewBox="0 0 24 28">
+					<title>cog</title>
+					<path d="M16 14c0-2.203-1.797-4-4-4s-4 1.797-4 4 1.797 4 4 4 4-1.797 4-4zM24 12.297v3.469c0 0.234-0.187 0.516-0.438 0.562l-2.891 0.438c-0.172 0.5-0.359 0.969-0.609 1.422 0.531 0.766 1.094 1.453 1.672 2.156 0.094 0.109 0.156 0.25 0.156 0.391s-0.047 0.25-0.141 0.359c-0.375 0.5-2.484 2.797-3.016 2.797-0.141 0-0.281-0.063-0.406-0.141l-2.156-1.687c-0.453 0.234-0.938 0.438-1.422 0.594-0.109 0.953-0.203 1.969-0.453 2.906-0.063 0.25-0.281 0.438-0.562 0.438h-3.469c-0.281 0-0.531-0.203-0.562-0.469l-0.438-2.875c-0.484-0.156-0.953-0.344-1.406-0.578l-2.203 1.672c-0.109 0.094-0.25 0.141-0.391 0.141s-0.281-0.063-0.391-0.172c-0.828-0.75-1.922-1.719-2.578-2.625-0.078-0.109-0.109-0.234-0.109-0.359 0-0.141 0.047-0.25 0.125-0.359 0.531-0.719 1.109-1.406 1.641-2.141-0.266-0.5-0.484-1.016-0.641-1.547l-2.859-0.422c-0.266-0.047-0.453-0.297-0.453-0.562v-3.469c0-0.234 0.187-0.516 0.422-0.562l2.906-0.438c0.156-0.5 0.359-0.969 0.609-1.437-0.531-0.75-1.094-1.453-1.672-2.156-0.094-0.109-0.156-0.234-0.156-0.375s0.063-0.25 0.141-0.359c0.375-0.516 2.484-2.797 3.016-2.797 0.141 0 0.281 0.063 0.406 0.156l2.156 1.672c0.453-0.234 0.938-0.438 1.422-0.594 0.109-0.953 0.203-1.969 0.453-2.906 0.063-0.25 0.281-0.438 0.562-0.438h3.469c0.281 0 0.531 0.203 0.562 0.469l0.438 2.875c0.484 0.156 0.953 0.344 1.406 0.578l2.219-1.672c0.094-0.094 0.234-0.141 0.375-0.141s0.281 0.063 0.391 0.156c0.828 0.766 1.922 1.734 2.578 2.656 0.078 0.094 0.109 0.219 0.109 0.344 0 0.141-0.047 0.25-0.125 0.359-0.531 0.719-1.109 1.406-1.641 2.141 0.266 0.5 0.484 1.016 0.641 1.531l2.859 0.438c0.266 0.047 0.453 0.297 0.453 0.562z"></path>
+				</symbol>
+				<symbol id="icon-power-off" viewBox="0 0 24 28">
+					<title>power-off</title>
+					<path d="M24 14c0 6.609-5.391 12-12 12s-12-5.391-12-12c0-3.797 1.75-7.297 4.797-9.578 0.891-0.672 2.141-0.5 2.797 0.391 0.672 0.875 0.484 2.141-0.391 2.797-2.031 1.531-3.203 3.859-3.203 6.391 0 4.406 3.594 8 8 8s8-3.594 8-8c0-2.531-1.172-4.859-3.203-6.391-0.875-0.656-1.062-1.922-0.391-2.797 0.656-0.891 1.922-1.062 2.797-0.391 3.047 2.281 4.797 5.781 4.797 9.578zM14 2v10c0 1.094-0.906 2-2 2s-2-0.906-2-2v-10c0-1.094 0.906-2 2-2s2 0.906 2 2z"></path>
+				</symbol>
+			</defs>
+		</svg>
+
 		<header class="main-header">
 			{% include 'partials/navi.twig' %}
 		</header>

system/author/partials/editorNavi.twig

@@ -5,15 +5,38 @@
 		<div class="navi-list">
 			<div class="navi-item folder">
 				<div class="status" :class="homepage.status"></div>
-				<a href="{{ base_url }}/tm/content/{{ settings.editor }}" :class="homepage.active"><i class="icon-home"></i><span class="level-1">Homepage</span></a>
+				<a href="{{ base_url }}/tm/content/{{ settings.editor }}" :class="homepage.active"><span><span class="iconwrapper"><svg class="icon icon-plus"><use xlink:href="#icon-plus"></use></svg></span><span class="level-1">Homepage</span></a>
 			</div>
 		</div>
-		<draggable :element="'ul'" class="navi-list" :list="items" @start="onStart" @end="onEnd" :options="{group:{ name:'folder'}, animation: 150, 'disabled': freeze }">
-			<navigation ref="draggit" v-for="item in items" :freeze="freeze" :name="item.name" :active="item.active" :parent="item.activeParent" :level="item.keyPath" :root="root" :url="item.urlRelWoF" v-bind:id="item.keyPath" :key="item.keyPath" :elementtype="item.elementType" :filetype="item.fileType" :status="item.status" :folder="item.folderContent"></navigation>
+		<draggable class="navi-list"
+			@start="onStart" 
+			@end="onEnd" 
+			tag="ul" 
+			:list="items" 
+			group="folder" 
+			animation="150" 
+			:disabled="freeze">
+			<navigation 
+				v-for="item in items" 
+				ref="draggit" 
+				:freeze="freeze" 
+				:name="item.name" 
+				:active="item.active" 
+				:parent="item.activeParent" 
+				:level="item.keyPath" 
+				:root="root" 
+				:url="item.urlRelWoF" 
+				:id="item.keyPath" 
+				:key="item.keyPath" 
+				:elementtype="item.elementType" 
+				:filetype="item.fileType" 
+				:status="item.status" 
+				:folder="item.folderContent"
+			></navigation>
 		</draggable>
 		<ul class="navi-list addBaseFolder">
 			<li class="navi-item file">
-				<i class="icon-plus"></i>
+				<span class="iconwrapper"><svg class="icon icon-plus"><use xlink:href="#icon-plus"></use></svg></span>
 				<div class="addNaviForm">
 					<input type="text" v-model="folderName" />
 					<button class="fullWidth" @click="addFolder">add folder to base level</button>
@@ -27,11 +50,49 @@
 	<template id="navigation-template">
 		<li class="navi-item" :class="elementtype">
 			<div class="status" :class="status"></div>
-			<a v-bind:href="getUrl(root, url)" :class="checkActive(active,parent)"><i :class="getIcon(elementtype, filetype)"></i><span :class="getLevel(level)">{{ name }}</span><i class="icon-move"></i></a>
-			<draggable v-if="folder" :element="'ul'" class="navi-list" :list="folder" :move="checkMove" @start="onStart" @end="onEnd" :options="{group:{ name:'file'}, animation: 150, 'disabled': freeze }">
-				<navigation ref="draggit" v-for="item in folder" :freeze="freeze" :name="item.name" :active="item.active" :parent="item.activeParent" :level="item.keyPath" :url="item.urlRelWoF" :root="root" v-bind:id="item.keyPath" :key="item.keyPath" :filetype="item.fileType" :status="item.status" :elementtype="item.elementType" :folder="item.folderContent"></navigation>
+			<a v-bind:href="getUrl(root, url)" :class="checkActive(active,parent)"><span class="iconwrapper"><svg class="icon" :class="getIconClass(elementtype, filetype)"><use :xlink:href="getIcon(elementtype, filetype)"></use></svg></span><span :class="getLevel(level)">{{ name }}</span><span class="movewrapper"><span class="movewrapper"><svg class="icon icon-arrows-v"><use xlink:href="#icon-arrows-v"></use></svg></span></a>
+			<draggable v-if="folder" class="navi-list" tag="ul" 
+				@start="onStart" 
+				@end="onEnd" 
+				:list="folder" 
+				:move="checkMove"
+				group="file" 
+				animation="150" 
+				:disabled="freeze">				
+				<navigation 
+					v-for="item in folder"
+					ref="draggit" 
+					:freeze="freeze" 
+					:name="item.name" 
+					:active="item.active" 
+					:parent="item.activeParent" 
+					:level="item.keyPath" 
+					:url="item.urlRelWoF" 
+					:root="root" 
+					:id="item.keyPath" 
+					:key="item.keyPath" 
+					:filetype="item.fileType" 
+					:status="item.status" 
+					:elementtype="item.elementType" 
+					:folder="item.folderContent"
+				></navigation>
 			</draggable>
-			<ul v-if="folder" class="navi-list"><li class="navi-item file"><i class="icon-plus"></i><span :class="getLevel(level + '.0')" class="addNaviItem"><a class="addNaviLink" href="#" @click.prevent="toggleForm">add item</a></span><transition name="fade"><div v-if="showForm" class="addNaviForm"><input v-model="newItem"><button class="b-left" @click="addFile('file')">add file</button><button class="b-right" @click="addFile('folder')">add folder</button></div></transition></li></ul>
+			<ul v-if="folder" class="navi-list">
+				<li class="navi-item file">
+					<span class="iconwrapper">
+						<svg class="icon icon-plus"><use xlink:href="#icon-plus"></use></svg>
+					</span>
+					<span :class="getLevel(level + '.0')" class="addNaviItem">
+						<a class="addNaviLink" href="#" @click.prevent="toggleForm">add item</a>
+					</span>
+					<transition name="fade">
+						<div v-if="showForm" class="addNaviForm">
+							<input v-model="newItem">
+							<button class="b-left" @click="addFile('file')">add file</button><button class="b-right" @click="addFile('folder')">add folder</button>
+						</div>
+					</transition>
+				</li>
+			</ul>
 		</li>
 	</template>
 {% endverbatim %}

system/author/partials/navi.twig

@@ -3,13 +3,13 @@
 		<a href="{{ base_url }}/tm/content/{{ settings.editor }}">Typemill</a>
 	</div>
 	<ul class="navi-items">
-		<li><a href="{{ base_url }}/tm/content/{{ settings.editor }}"{{ navigation ? ' class="active"' : '' }}><i class="icon-doc-text"></i><span class="nav-label"> Content</span></a></li><li>
+		<li><a href="{{ base_url }}/tm/content/{{ settings.editor }}"{{ navigation ? ' class="active"' : '' }}><svg class="icon baseline icon-file-text-o"><use xlink:href="#icon-file-text-o"></use></svg><span class="nav-label"> Content</span></a></li><li>
 			{% if is_role('administrator') %}
-				<a href="{{ path_for('settings.show') }}"{{ users ? ' class="active"' : '' }}><i class="icon-cog"></i><span class="nav-label">  Settings</span></a></li><li>
+				<a href="{{ path_for('settings.show') }}"{{ users ? ' class="active"' : '' }}><svg class="icon baseline icon-cog"><use xlink:href="#icon-cog"></use></svg><span class="nav-label">  Settings</span></a></li><li>
 			{% else %}
-				<a href="{{ path_for('user.show', {'username' : get_username() }) }}"{{ users ? ' class="active"' : '' }}><i class="icon-cog"></i><span class="nav-label">  Account</span></a></li><li>			
+				<a href="{{ path_for('user.show', {'username' : get_username() }) }}"{{ users ? ' class="active"' : '' }}><svg class="icon icon-cog baseline"><use xlink:href="#icon-cog, gear"></use></svg><span class="nav-label">  Account</span></a></li><li>			
 			{% endif %}
-			<a href="{{ base_url }}"><i class="icon-link-ext"></i><span class="nav-label"> View Site</span></a></li><li>
-			<a href="{{ path_for('auth.logout') }}"><i class="icon-off"></i><span class="nav-label">  Logout</span></a></li>
+			<a href="{{ base_url }}"><svg class="icon baseline icon-external-link"><use xlink:href="#icon-external-link"></use></svg><span class="nav-label"> View Site</span></a></li><li>
+			<a href="{{ path_for('auth.logout') }}"><svg class="icon baseline icon-power-off"><use xlink:href="#icon-power-off"></use></svg><span class="nav-label">  Logout</span></a></li>
 	</ul>
 </nav>

system/author/settings/system.twig

@@ -63,12 +63,6 @@
 					</div><div class="medium">
 						<label for="settings[sitemap]">Google Sitemap <small>(Readonly)</small></label>
 						<input type="text" name="settings[sitemap]" id="sitemap" readonly value="{{ base_url }}/cache/sitemap.xml" />
-					</div><div class="medium">
-						<span class="label">Startpage</span>
-						<label class="control-group">Startpage is designed as landing-page.
-							<input name="settings[startpage]" type="checkbox" id="startpage"{{ startpage ? ' checked' : '' }}>
-							<span class="checkmark"></span>
-						</label>
 					</div>
 					<hr>
 					<header class="headline">
@@ -76,18 +70,29 @@
 					</header>
 					<div class="medium{{ errors.settings.editor ? ' error' : '' }}">
 						<label for="settings[editor]">Standard Editor Mode *</label>
-						<label class="control-group">Raw Markdown
-							<input name="settings[editor]" value="raw" type="radio" {% if (old.settings.editor == "raw") or (settings.editor == "raw") %} checked {% endif %}>
+						<label class="control-group">Visual Markdown Editor
+							<input name="settings[editor]" value="visual" type="radio" {% if (old.settings.editor == "visual") or (settings.editor == "visual") %} checked {% endif %}>
 							<span class="radiomark"></span>
 						</label>
-						<label class="control-group">Visual Markdown
-							<input name="settings[editor]" value="visual" type="radio" {% if (old.settings.editor == "visual") or (settings.editor == "visual") %} checked {% endif %}>
+						<label class="control-group">Raw Markdown Editor
+							<input name="settings[editor]" value="raw" type="radio" {% if (old.settings.editor == "raw") or (settings.editor == "raw") %} checked {% endif %}>
 							<span class="radiomark"></span>
 						</label>
 						{% if errors.settings.editor %}
 							<span class="error">{{ errors.settings.editor | first }}</span>
 						{% endif %}
-					</div>							
+					</div>
+					<div class="medium{{ errors.settings.editor ? ' error' : '' }}">
+						<label>Visual Editor: The Format Buttons</label>
+						{% for format in formats %}
+
+							<label class="control-group">{{ format }}
+								<input name="settings[formats][]" value="{{ format }}" type="checkbox" {% if format in settings.formats %} checked {% endif %}>
+								<span class="checkmark"></span>
+							</label>
+
+						{% endfor %}
+					</div>					
 				</fieldset>
 			</section>
 			<input type="submit" value="Save All Settings" />

system/system.php

@@ -50,14 +50,14 @@ $container = $app->getContainer();
 * LOAD & UPDATE PLUGINS *
 ************************/
 
-$plugins 				= new Typemill\Plugins();
-$pluginNames		= $plugins->load();
+$plugins 		= new Typemill\Plugins();
+$pluginNames	= $plugins->load();
 $pluginSettings = $routes = $middleware	= array();
 
 foreach($pluginNames as $pluginName)
 {
 	$className	= $pluginName['className'];
-	$name				= $pluginName['name'];
+	$name		= $pluginName['name'];
 		
 	# check if plugin is in the settings already
 	if(isset($settings['settings']['plugins'][$name]))
@@ -80,7 +80,7 @@ foreach($pluginNames as $pluginName)
 	# if the plugin is activated, add routes/middleware and add plugin as event subscriber
 	if($pluginSettings[$name]['active'])
 	{
-		$routes 			= $plugins->getNewRoutes($className, $routes);
+		$routes 		= $plugins->getNewRoutes($className, $routes);
 		$middleware		= $plugins->getNewMiddleware($className, $middleware);
 		
 		$dispatcher->addSubscriber(new $className($container));

themes/typemill/css/style.css

@@ -479,17 +479,16 @@ footer p{
 *  	CONTENT ELEMENTS	*
 ************************/
 
-pre,code{
-	white-space: pre;
-}
 code{
 	display: inline-block;
 	padding: 0 0.5em;
 	font-size: 0.8em; 
 	line-height: 1.4em;	
 	border-radius: 3px;	
+	word-break: break-all;
 }
 pre{
+	white-space: pre;
 	padding: 10px;
 	display: block;	
 	max-width: 100%;

themes/typemill/typemill.yaml

@@ -1,5 +1,5 @@
 name: Typemill Theme
-version: 1.1.7
+version: 1.1.8
 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: https://typemill.net
@@ -8,6 +8,7 @@ licence: MIT
 settings:
   chapter: Chapter
   start: Start
+  cover: true
   modified: true
   modifiedText: 'Last updated'
   modifiedFormat: 'd.m.Y'
@@ -19,20 +20,25 @@ settings:
 forms:
   fields:
 
-    chapter:
-      type: text
-      label: Text For Chapter
-      placeholder: Add Name for Chapter
+    cover:
+      type: checkbox
+      label: Different Design for Startpage
+      checkboxlabel: Activate Special Startpage-Design
 
     start:
       type: text
-      label: Label For Start Button
+      label: Label for Start Button
       placeholder: Add Label for Start-Button
       required: true
 
+    chapter:
+      type: text
+      label: Label for Chapter
+      placeholder: Add Name for Chapter
+
     chapnum:
       type: checkbox
-      label: Chapter Numbers
+      label: Show Chapter Numbers
       checkboxlabel: Count chapters in navigation?
 
     fieldset0: