From: Banana <banana@optimus.de>
Date: Sat, 3 Nov 2018 22:13:41 +0000 (+0100)
Subject: editing and new frontend
X-Git-Tag: 2.1-alpha-2019-0-29~23
X-Git-Url: http://91.132.146.200/gitweb/?a=commitdiff_plain;h=01a5b23c5de46c318b473dd0614ab85b58555430;p=insipid.git

editing and new frontend
---

diff --git a/TODO b/TODO
index 6a97293..e330346 100755
--- a/TODO
+++ b/TODO
@@ -8,4 +8,5 @@ TODO / Feature list
 + stats
 + private links
 + more "secure" user authentication
-++ multiple user accounts and stuff
\ No newline at end of file
+++ multiple user accounts and stuff
++ sorting
\ No newline at end of file
diff --git a/source/foundation-6.3.0-custom.zip b/source/foundation-6.3.0-custom.zip
deleted file mode 100644
index 14502ac..0000000
Binary files a/source/foundation-6.3.0-custom.zip and /dev/null differ
diff --git a/source/foundation-icons.zip b/source/foundation-icons.zip
deleted file mode 100644
index 898b2a0..0000000
Binary files a/source/foundation-icons.zip and /dev/null differ
diff --git a/source/foundation.info b/source/foundation.info
deleted file mode 100644
index 99ee314..0000000
--- a/source/foundation.info
+++ /dev/null
@@ -1 +0,0 @@
-Foundation with flex grid active
diff --git a/webroot/.gitignore b/webroot/.gitignore
index 4f4773f..77e477b 100644
--- a/webroot/.gitignore
+++ b/webroot/.gitignore
@@ -1 +1,2 @@
 config.php
+error.log
diff --git a/webroot/lib/category.class.php b/webroot/lib/category.class.php
index a8f44dd..be4b5ad 100644
--- a/webroot/lib/category.class.php
+++ b/webroot/lib/category.class.php
@@ -48,6 +48,7 @@ class Category {
      * @param string $string
      */
     public function initbystring($string) {
+        $this->id = false;
         if(!empty($string)) {
             $queryStr = "SELECT id FROM `".DB_PREFIX."_category`
                             WHERE `name` = '".$this->DB->real_escape_string($string)."'";
diff --git a/webroot/lib/link.class.php b/webroot/lib/link.class.php
index 20b869c..7f1db08 100644
--- a/webroot/lib/link.class.php
+++ b/webroot/lib/link.class.php
@@ -3,7 +3,7 @@
  * Insipid
  * Personal web-bookmark-system
  *
- * Copyright 2016-2017 Johannes Keßler
+ * Copyright 2016-2018 Johannes Keßler
  *
  * Development starting from 2011: Johannes Keßler
  * https://www.bananas-playground.net/projekt/insipid/
@@ -34,10 +34,10 @@ class Link {
     private $DB;
 
     /**
-     * the current loaded tag by DB id
-     * @var int
+     * the current loaded link data
+     * @var array
      */
-    private $id;
+    private $_data;
 
     public function __construct($databaseConnectionObject) {
         $this->DB = $databaseConnectionObject;
@@ -51,6 +51,8 @@ class Link {
     public function load($hash) {
         $ret = false;
 
+        $this->_data = array();
+
         if(!empty($hash)) {
             $queryStr = "SELECT * FROM `".DB_PREFIX."_link`
                             WHERE `hash` = '".$this->DB->real_escape_string($hash)."'";
@@ -58,24 +60,101 @@ class Link {
             if(!empty($query) && $query->num_rows == 1) {
                 $ret = $query->fetch_assoc();
 
-                $this->id = $ret['hash'];
+                $this->_data = $ret;
 
                 # add stuff
-                $ret['tags'] = $this->_tags();
-                $ret['categories'] = $this->_categories();
+                $this->_tags();
+                $this->_categories();
             }
         }
 
+        return $this->_data;
+    }
+
+    public function getData($key=false) {
+        $ret = $this->_data;
+
+        if(!empty($key) && isset($this->_data[$key])) {
+            $ret = $this->_data[$key];
+        }
+
         return $ret;
     }
 
-    public function create($data) {}
+    /**
+     * reload the current id from DB
+     */
+    public function reload() {
+        $this->load($this->_data['hash']);
+    }
+
+    /**
+     * create a new link with the given data
+     * @param array $data
+     */
+    public function create($data) {
+    }
+
+    /**
+     * update the current loaded link with the given data
+     * @param array $data
+     * @return boolean|int
+     */
+    public function update($data) {
+
+        $ret = false;
+
+        if(isset($data['title']) && !empty($data['title'])) {
+
+            # categories and tag stuff
+            $catArr = Summoner::prepareTagOrCategoryStr($data['category']);
+            $tagArr = Summoner::prepareTagOrCategoryStr($data['tag']);
+
+            $search = $data['title'];
+            $search .= ' '.$data['description'];
+            $search .= ' '.implode(" ",$tagArr);
+            $search .= ' '.implode(" ",$catArr);
+
+            $queryStr = "UPDATE `".DB_PREFIX."_link` SET
+                            `status` = '".$this->DB->real_escape_string($data['private'])."',
+                            `description` = '".$this->DB->real_escape_string($data['description'])."',
+                            `title` = '".$this->DB->real_escape_string($data['title'])."',
+                            `image` = '".$this->DB->real_escape_string($data['image'])."',
+                            `search` = '".$this->DB->real_escape_string($search)."'
+                          WHERE `hash` = '".$this->DB->real_escape_string($this->_data['hash'])."'";
+
+            $query = $this->DB->query($queryStr);
+
+            $catObj = new Category($this->DB);
+            $tagObj = new Tag($this->DB);
+            // clean the relations first
+            $this->_removeTagRelation(false);
+            $this->_removeCategoryRelation(false);
+
+            if(!empty($catArr)) {
+                foreach($catArr as $c) {
+                    $catObj->initbystring($c);
+                    $catObj->setRelation($this->_data['id']);
+                }
+            }
+            if(!empty($tagArr)) {
+                foreach($tagArr as $t) {
+                    $tagObj->initbystring($t);
+                    $tagObj->setRelation($this->_data['id']);
+                }
+            }
+
+            $ret = true;
+        }
+
+        return $ret;
+    }
 
     /**
      * check if the given URL exists in the DB
-     * if so return the id. If not, return false
+     * if so return the hash. If not, return false
      * @param string $link
-     * @return boolean|int
+     * @return string
      */
     public function exists($link) {
         $ret = false;
@@ -100,16 +179,21 @@ class Link {
     private function _tags() {
         $ret = array();
 
-        if(!empty($this->id)) {
+        if(!empty($this->_data['hash'])) {
             $queryStr = "SELECT DISTINCT(tag) FROM `".DB_PREFIX."_combined`
-                            WHERE `hash` = '".$this->DB->real_escape_string($this->id)."'";
+                            WHERE `hash` = '".$this->DB->real_escape_string($this->_data['hash'])."'";
             $query = $this->DB->query($queryStr);
             if(!empty($query) && $query->num_rows > 0) {
-                $ret = $query->fetch_all(MYSQLI_ASSOC);
+                while($result = $query->fetch_assoc()) {
+                    if($result['tag'] !== NULL) {
+                        $ret[] = $result['tag'];
+                    }
+                }
+
             }
         }
 
-        return $ret;
+        $this->_data['tags'] = $ret;
     }
 
     /**
@@ -119,16 +203,64 @@ class Link {
     private function _categories() {
         $ret = array();
 
-        if(!empty($this->id)) {
+        if(!empty($this->_data['hash'])) {
             $queryStr = "SELECT DISTINCT(category) FROM `".DB_PREFIX."_combined`
-                            WHERE `hash` = '".$this->DB->real_escape_string($this->id)."'";
+                            WHERE `hash` = '".$this->DB->real_escape_string($this->_data['hash'])."'";
             $query = $this->DB->query($queryStr);
             if(!empty($query) && $query->num_rows > 0) {
-                $ret = $query->fetch_all(MYSQLI_ASSOC);
+            while($result = $query->fetch_assoc()) {
+                    if($result['category'] !== NULL) {
+                        $ret[] = $result['category'];
+                    }
+                }
             }
         }
 
-        return $ret;
+        $this->_data['categories'] = $ret;
+    }
+
+    /**
+     * remove all or given tag relation to the current loaded link
+     * @param mixed $tagid
+     */
+    private function _removeTagRelation($tagid) {
+        if(!empty($this->_data['id'])) {
+            $queryStr = false;
+            if($tagid === false) {
+                $queryStr = "DELETE FROM `".DB_PREFIX."_tagrelation`
+                            WHERE `linkid` = '".$this->DB->real_escape_string($this->_data['id'])."'";
+            }
+            elseif(is_numeric($tagid)) {
+                $queryStr = "DELETE FROM `".DB_PREFIX."_tagrelation`
+                            WHERE `linkid` = '".$this->DB->real_escape_string($this->_data['id'])."'
+                                AND `tagid` = '".$this->DB->real_escape_string($tagid)."'";
+            }
+            if(!empty($queryStr)) {
+                $this->DB->query($queryStr);
+            }
+        }
+    }
+
+    /**
+     * remove all or given category relation to the current loaded link
+     * @param mixed $categoryid
+     */
+    private function _removeCategoryRelation($categoryid) {
+        if(!empty($this->_data['id'])) {
+            $queryStr = false;
+            if($categoryid === false) {
+                $queryStr = "DELETE FROM `".DB_PREFIX."_categoryrelation`
+                            WHERE `linkid` = '".$this->DB->real_escape_string($this->_data['id'])."'";
+            }
+            elseif(is_numeric($categoryid)) {
+                $queryStr = "DELETE FROM `".DB_PREFIX."_categoryrelation`
+                            WHERE `linkid` = '".$this->DB->real_escape_string($this->_data['id'])."'
+                                AND `categoryid` = '".$this->DB->real_escape_string($categoryid)."'";
+            }
+            if(!empty($queryStr)) {
+                $this->DB->query($queryStr);
+            }
+        }
     }
 }
  ?>
\ No newline at end of file
diff --git a/webroot/lib/tag.class.php b/webroot/lib/tag.class.php
index 060b297..ccf4eae 100644
--- a/webroot/lib/tag.class.php
+++ b/webroot/lib/tag.class.php
@@ -48,6 +48,7 @@ class Tag {
      * @param string $string
      */
     public function initbystring($string) {
+        $this->id = false;
         if(!empty($string)) {
             $queryStr = "SELECT id FROM `".DB_PREFIX."_tag`
                             WHERE `name` = '".$this->DB->real_escape_string($string)."'";
diff --git a/webroot/view/editlink.inc.php b/webroot/view/editlink.inc.php
index 3d1b422..6d58f13 100644
--- a/webroot/view/editlink.inc.php
+++ b/webroot/view/editlink.inc.php
@@ -3,7 +3,7 @@
  * Insipid
  * Personal web-bookmark-system
  *
- * Copyright 2016-2017 Johannes Keßler
+ * Copyright 2016-2018 Johannes Keßler
  *
  * Development starting from 2011: Johannes Keßler
  * https://www.bananas-playground.net/projekt/insipid/
@@ -40,26 +40,62 @@ if(isset($_GET['id']) && !empty($_GET['id'])) {
 }
 
 $linkObj = new Link($DB);
-$link = $linkObj->load($_id);
-if(empty($link)) {
+$linkObj->load($_id);
+$linkData = $linkObj->getData();
+if(empty($linkData)) {
     header("HTTP/1.0 404 Not Found");
 }
 
-$formData = $link;
-# prepate the tag edit string
+if(isset($_POST['data']) && !empty($_POST['data']) && isset($_POST['editlink'])) {
+    $fData = $_POST['data'];
+
+    $formData['private'] = 2;
+    if(isset($fData['private'])) {
+        $formData['private'] = 1;
+    }
+
+    $formData['description'] = trim($fData['description']);
+    $formData['title'] = trim($fData['title']);
+    $formData['image'] = trim($fData['image']);
+    $formData['category'] = trim($fData['category']);
+    $formData['tag'] = trim($fData['tag']);
+
+    if(!empty($formData['title'])) {
+        $update = $linkObj->update($formData);
+
+        if($update === true) {
+            $submitFeedback['message'] = 'Link updated successfully.';
+            $submitFeedback['status'] = 'success';
+            // update link info
+            $linkObj->reload();
+            $linkData = $linkObj->getData();
+        }
+        else {
+            $submitFeedback['message'] = 'Something went wrong...';
+            $submitFeedback['status'] = 'error';
+        }
+    }
+    else {
+        $submitFeedback['message'] = 'Please provide a title.';
+        $submitFeedback['status'] = 'error';
+    }
+}
+
+$formData = $linkData;
+# prepate the tag string
 $formData['tag'] = '';
-if(!empty($link['tags'])) {
-    foreach($link['tags'] as $entry) {
-        $formData['tag'] .= $entry['tag'].',';
+if(!empty($linkData['tags'])) {
+    foreach($linkData['tags'] as $k=>$v) {
+        $formData['tag'] .= $v.',';
     }
     $formData['tag'] = trim($formData['tag']," ,");
 }
 
 # prepate the category string
 $formData['category'] = '';
-if(!empty($link['categories'])) {
-    foreach($link['categories'] as $entry) {
-        $formData['category'] .= $entry['category'].',';
+if(!empty($linkData['categories'])) {
+    foreach($linkData['categories'] as $k=>$v) {
+        $formData['category'] .= $v.',';
     }
     $formData['category'] = trim($formData['category']," ,");
 }
diff --git a/webroot/view/editlink.php b/webroot/view/editlink.php
index 0d0c34c..dd69138 100644
--- a/webroot/view/editlink.php
+++ b/webroot/view/editlink.php
@@ -3,7 +3,7 @@
  * Insipid
  * Personal web-bookmark-system
  *
- * Copyright 2016-2017 Johannes Keßler
+ * Copyright 2016-2018 Johannes Keßler
  *
  * Development starting from 2011: Johannes Keßler
  * https://www.bananas-playground.net/projekt/insipid/
@@ -27,128 +27,147 @@
  */
 ?>
 
-<?php if(empty($link)) { ?>
-<div class="callout alert">
-	<h5>Error</h5>
-	<p>Something went wrong...</p>
-</div>
+<section class="section">
+<?php if(empty($linkData)) { ?>
+    <div class="columns">
+    	<div class="column">
+    		<div class="notification is-danger">
+    			<h5>Error</h5>
+    			<p>Something went wrong...</p>
+    		</div>
+    	</div>
+    </div>
 <?php } ?>
-
 <?php if(!empty($submitFeedback)) { ?>
-<div class="row">
-	<div class="large-12 columns">
+	<div class="columns">
+		<div class="column">
 <?php if($submitFeedback['status'] == "error") { ?>
-		<div class="callout alert">
-			<h5>Error</h5>
-			<p><?php echo $submitFeedback['message']; ?></p>
-		</div>
+    		<div class="notification is-danger">
+    			<h5>Error</h5>
+    			<p><?php echo $submitFeedback['message']; ?></p>
+    		</div>
 <?php } else { ?>
-		<div class="callout success">
-			<h5>Success</h5>
-			<p><?php echo $submitFeedback['message']; ?></p>
-		</div>
+    		<div class="notification is-success">
+    			<h5>Success</h5>
+    			<p><?php echo $submitFeedback['message']; ?></p>
+    		</div>
 <?php } ?>
+		</div>
 	</div>
-</div>
 <?php } ?>
 
-<div class="row">
-	<div class="large-12 columns">
-		<h1 class="text-center"><?php echo $link['title']; ?></h1>
-	</div>
-</div>
-<div class="row expanded">
-	<div class="large-12 columns">
-		<p class="text-right"><a href="index.php" title="... back to home" class="tiny button"><i class="fi-home"></i></a></p>
-	</div>
-</div>
-
-<form method="post">
-	<div class="row">
-    	<div class="small-12 medium-2 columns">
-    		<p>Date added:</p>
-    	</div>
-    	<div class="small-12 medium-10 columns">
-    		<p><?php echo $link['created']; ?></p>
-    	</div>
-    </div>
-    <div class="row">
-    	<div class="small-12 medium-2 columns">
-    		<p>Title:</p>
-    	</div>
-    	<div class="small-12 medium-10 columns">
-    		<input type="text" name="data[title]" value="<?php echo Summoner::ifset($formData, 'title'); ?>" />
-    	</div>
-    </div>
-    <div class="row">
-    	<div class="small-12 medium-2 columns">
-    		<p>Description:</p>
-    	</div>
-    	<div class="small-12 medium-10 columns">
-    		<input type="text" name="data[description]" value="<?php echo Summoner::ifset($formData, 'description'); ?>" />
-    	</div>
-    </div>
-    <div class="row">
-    	<div class="small-12 medium-2 columns">
-    		<p>URL:</p>
-    	</div>
-    	<div class="small-12 medium-10 columns">
-    		<p><?php echo $link['link']; ?></p>
-    	</div>
-    </div>
-    <div class="row">
-    	<div class="small-12 medium-2 columns">
-    		<p>
-    			Image:<br />
-    			<small>If provided</small>
+	<div class="columns">
+    	<div class="column">
+    		<p class="has-text-right">
+    			<a href="index.php" title="... back to home" class="button">
+    				<i class="icon ion-md-home"></i>
+    			</a>
     		</p>
     	</div>
-    	<div class="small-12 medium-10 columns">
-    		<p>
-    			<img class="linkthumbnail" src="<?php echo $link['image']; ?>" alt="Image if provided">
-    		</p>
-    		<input type="text" name="data[image]" value="<?php echo Summoner::ifset($formData, 'image'); ?>" />
-    	</div>
     </div>
 
-    <div class="row">
-    	<div class="small-12 medium-2 columns">
-    		<p>Tags:</p>
-    	</div>
-    	<div class="small-12 medium-10 columns">
-    	    <input type="text" name="data[tag]" list="taglist"
-				class="flexdatalist" data-min-length='1' multiple='multiple'
-				value="<?php echo Summoner::ifset($formData, 'tag'); ?>" />
-			<datalist id="taglist">
-			<?php foreach($existingTags as $t) { ?>
-				<option value="<?php echo $t['name']; ?>">
-			<?php } ?>
-            </datalist>
-            <br />
-    	</div>
-    </div>
-    <div class="row">
-    	<div class="small-12 medium-2 columns">
-    		<p>Category:</p>
-    	</div>
-    	<div class="small-12 medium-10 columns">
-    	    <input type="text" name="data[category]" list="categorylist"
-				class="flexdatalist" data-min-length='1' multiple='multiple'
-				value="<?php echo Summoner::ifset($formData, 'category'); ?>" />
-			<datalist id="categorylist">
-			<?php foreach($existingCategories as $c) { ?>
-				<option value="<?php echo $c['name']; ?>">
-			<?php } ?>
-            </datalist>
-            <br />
-    	</div>
-    </div>
-    <div class="row">
-    	<div class="large-8 columns">
-    		<input type="checkbox" name="data[private]" value="1" <?php if(Summoner::ifset($formData, 'private')) echo "checked"; ?> /><label>Private</label>
-    	</div>
-    	<div class="large-4 columns text-right" >
-    		<input type="submit" class="button" name="editlink" value="Update">
-    	</div>
-    </div>
-</form>
+	<div class="columns">
+    	<div class="column">
+			<h1 class="is-size-2"><?php echo $linkData['title']; ?></h1>
+		</div>
+	</div>
+</section>
+
+<section class="section">
+
+    <form method="post">
+    	<div class="columns">
+        	<div class="column is-one-quarter">
+        		<p>Date added:</p>
+        	</div>
+        	<div class="column">
+        		<p><?php echo $linkData['created']; ?></p>
+        	</div>
+        </div>
+        <div class="columns">
+        	<div class="column is-one-quarter">
+        		<p>Title:</p>
+        	</div>
+        	<div class="column">
+        		<input class="input" type="text" name="data[title]" value="<?php echo Summoner::ifset($formData, 'title'); ?>" />
+        	</div>
+        </div>
+        <div class="columns">
+        	<div class="column is-one-quarter">
+        		<p>Description:</p>
+        	</div>
+        	<div class="column">
+        		<input class="input" type="text" name="data[description]" value="<?php echo Summoner::ifset($formData, 'description'); ?>" />
+        	</div>
+        </div>
+        <div class="columns">
+        	<div class="column is-one-quarter">
+        		<p>URL:</p>
+        	</div>
+        	<div class="column">
+        		<p><?php echo $linkData['link']; ?></p>
+        	</div>
+        </div>
+        <div class="columns">
+        	<div class="column is-one-quarter">
+        		<p>
+        			Image: (<small>If provided</small>)
+        		</p>
+        	</div>
+        	<div class="column">
+        		<p>
+        			<img class="linkthumbnail" src="<?php echo $linkData['image']; ?>" alt="Image if provided...">
+        		</p>
+        		<input class="input" type="text" name="data[image]" value="<?php echo Summoner::ifset($formData, 'image'); ?>" />
+        	</div>
+        </div>
+
+        <div class="columns">
+        	<div class="column is-one-quarter">
+        		<p>Tags:</p>
+        	</div>
+        	<div class="column">
+        	    <input type="text" name="data[tag]" list="taglist"
+    				class="flexdatalist input" multiple='multiple'
+    				data-min-length="0" data-cache="0" data-selection-required='true'
+    				data-toggle-selected="true"
+    				value="<?php echo Summoner::ifset($formData, 'tag'); ?>" />
+    			<datalist id="taglist">
+    			<?php foreach($existingTags as $t) { ?>
+    				<option value="<?php echo $t['name']; ?>"><?php echo $t['name']; ?></option>
+    			<?php } ?>
+                </datalist>
+        	</div>
+        </div>
+        <div class="columns">
+        	<div class="column is-one-quarter">
+        		<p>Category:</p>
+        	</div>
+        	<div class="column">
+        	    <input type="text" name="data[category]" list="categorylist"
+    				class="flexdatalist input" multiple='multiple'
+    				data-min-length="0" data-cache="0" data-selection-required='true'
+    				data-toggle-selected="true"
+    				value="<?php echo Summoner::ifset($formData, 'category'); ?>" />
+    			<datalist id="categorylist">
+    			<?php foreach($existingCategories as $c) { ?>
+    				<option value="<?php echo $c['name']; ?>"><?php echo $c['name']; ?></option>
+    			<?php } ?>
+                </datalist>
+        	</div>
+        </div>
+        <div class="columns">
+        	<div class="column is-half">
+        		<label>Private</label>
+        		<input class="checkbox" type="checkbox" name="data[private]" value="1" <?php if(Summoner::ifset($formData, 'private')) echo "checked"; ?> />
+        	</div>
+        	<div class="column is-half">
+        		<input type="submit" class="button is-primary" name="editlink" value="Update">
+        	</div>
+        </div>
+    </form>
+</section>
+
+<link rel="stylesheet" href="asset/css/jquery.flexdatalist.min.css">
+<script type="text/javascript" src="asset/js/jquery.min.js"></script>
+<script type="text/javascript" src="asset/js/jquery.flexdatalist.min.js"></script>
diff --git a/webroot/view/home.php b/webroot/view/home.php
index 23a90f2..3bf73b4 100644
--- a/webroot/view/home.php
+++ b/webroot/view/home.php
@@ -152,7 +152,8 @@
         		<label class="label">Category</label>
         		<div class="control">
         			<input type="text" name="data[category]" list="categorylist"
-        				class="flexdatalist input" data-min-length='1' multiple='multiple'
+        				class="flexdatalist input" multiple='multiple'
+        				data-min-length="0" data-cache="0"
         				value="<?php echo Summoner::ifset($formData, 'category'); ?>" />
         			<datalist id="categorylist">
     				<?php foreach($existingCategories as $c) { ?>
@@ -165,7 +166,8 @@
         		<label class="label">Tag</label>
         		<div class="control">
         			<input type="text" name="data[tag]" list="taglist"
-        				class="flexdatalist input" data-min-length='1' multiple='multiple'
+        				class="flexdatalist input" multiple='multiple'
+        				data-min-length="0" data-cache="0"
         				value="<?php echo Summoner::ifset($formData, 'tag'); ?>" />
         			<datalist id="taglist">
         			<?php foreach($existingTags as $t) { ?>
diff --git a/webroot/view/linkinfo.inc.php b/webroot/view/linkinfo.inc.php
index cbb9637..ab36e2e 100644
--- a/webroot/view/linkinfo.inc.php
+++ b/webroot/view/linkinfo.inc.php
@@ -38,7 +38,7 @@ if(isset($_GET['id']) && !empty($_GET['id'])) {
 }
 
 $linkObj = new Link($DB);
-$link = $linkObj->load($_id);
-if(empty($link)) {
+$linkData = $linkObj->load($_id);
+if(empty($linkData)) {
     header("HTTP/1.0 404 Not Found");
 }
\ No newline at end of file
diff --git a/webroot/view/linkinfo.php b/webroot/view/linkinfo.php
index 3428e4c..364f90f 100644
--- a/webroot/view/linkinfo.php
+++ b/webroot/view/linkinfo.php
@@ -27,7 +27,7 @@
  */
 ?>
 
-<?php if(empty($link)) { ?>
+<?php if(empty($linkData)) { ?>
 <section class="section">
     <div class="columns">
     	<div class="column">
@@ -53,7 +53,7 @@
 
 	<div class="columns">
     	<div class="column">
-			<h1 class="is-size-2"><?php echo $link['title']; ?></h1>
+			<h1 class="is-size-2"><?php echo $linkData['title']; ?></h1>
 		</div>
 	</div>
 </section>
@@ -64,7 +64,7 @@
 			<p>Title:</p>
 		</div>
 		<div class="column is-two-third">
-			<p><?php echo $link['title']; ?></p>
+			<p><?php echo $linkData['title']; ?></p>
 		</div>
 	</div>
 	<div class="columns">
@@ -72,7 +72,7 @@
     		<p>Description:</p>
     	</div>
     	<div class="column is-two-third">
-    		<p><?php echo $link['description']; ?></p>
+    		<p><?php echo $linkData['description']; ?></p>
     	</div>
     </div>
     <div class="columns">
@@ -80,7 +80,7 @@
     		<p>URL:</p>
     	</div>
     	<div class="column is-two-third">
-    		<p><a href="<?php echo $link['link']; ?>" target="_blank"><?php echo $link['link']; ?></a></p>
+    		<p><a href="<?php echo $linkData['link']; ?>" target="_blank"><?php echo $linkData['link']; ?></a></p>
     	</div>
     </div>
     <div class="columns">
@@ -91,7 +91,7 @@
     	</div>
     	<div class="column is-two-third">
     		<p>
-    			<img class="linkthumbnail" src="<?php echo $link['image']; ?>" alt="Image if provided">
+    			<img class="linkthumbnail" src="<?php echo $linkData['image']; ?>" alt="Image if provided...">
     		</p>
     	</div>
     </div>
@@ -100,7 +100,7 @@
     		<p>Date added:</p>
     	</div>
     	<div class="column is-two-third">
-    		<p><?php echo $link['created']; ?></p>
+    		<p><?php echo $linkData['created']; ?></p>
     	</div>
     </div>
     <div class="columns">
@@ -109,12 +109,12 @@
     	</div>
     	<div class="column is-two-third">
     		<?php
-                if(!empty($link['tags'])) {
-    		      foreach($link['tags'] as $v) {
+                if(!empty($linkData['tags'])) {
+    		      foreach($linkData['tags'] as $k=>$v) {
             ?>
             	<a href="index.php?p=overview&m=tag&id=<?php echo urlencode($v['tag']); ?>" class="button is-small">
             		<span class="icon"><i class="ion-md-pricetag"></i></span>
-            		<span><?php echo $v['tag']; ?></span>
+            		<span><?php echo $v; ?></span>
             	</a>
             <?php
     		      }
@@ -128,12 +128,12 @@
     	</div>
     	<div class="column is-two-third">
     		<?php
-                if(!empty($link['categories'])) {
-    		      foreach($link['categories'] as $v) {
+                if(!empty($linkData['categories'])) {
+    		      foreach($linkData['categories'] as $k=>$v) {
             ?>
             	<a href="index.php?p=overview&m=category&id=<?php echo urlencode($v['category']); ?>" class="button is-small">
             		<span class="icon"><i class="ion-md-list"></i></span>
-            		<span><?php echo $v['category']; ?></span>
+            		<span><?php echo $v; ?></span>
             	</a>
             <?php
     		      }
@@ -143,7 +143,7 @@
     </div>
     <div class="columns">
     	<div class="column">
-            <a href="index.php?p=editlink&id=<?php echo $link['hash']; ?>" class="button is-small is-danger">
+            <a href="index.php?p=editlink&id=<?php echo $linkData['hash']; ?>" class="button is-small is-danger">
             	<span class="icon">
             		<i class="ion-md-create"></i>
             	</span>
diff --git a/webroot/view/overview.inc.php b/webroot/view/overview.inc.php
index 0ba9a0a..f9850c1 100644
--- a/webroot/view/overview.inc.php
+++ b/webroot/view/overview.inc.php
@@ -47,26 +47,26 @@ switch($_requestMode) {
         if(!empty($_id)) {
             $linkCollection = $Management->linksByTagString($_id,false);
             if(!empty($linkCollection)) {
-                $subHeadline = $linkCollection[0]['tag'];
+                $subHeadline = $linkCollection[0]['tag'].' <i class="ion-md-pricetag"></i>';
             }
         }
         else {
             # show all the tags we have
             $tagCollection = $Management->tags();
-            $subHeadline = 'All the tags <i class="fi-price-tag"></i>';
+            $subHeadline = 'All the tags <i class="ion-md-pricetag"></i>';
         }
     break;
     case 'category':
         if(!empty($_id)) {
             $linkCollection = $Management->linksByCategoryString($_id,false);
             if(!empty($linkCollection)) {
-                $subHeadline = $linkCollection[0]['category'];
+                $subHeadline = $linkCollection[0]['category'].' <i class="ion-md-list"></i>';
             }
         }
         else {
             # show all the categories we have
             $categoryCollection = $Management->categories();
-            $subHeadline = 'All the categories <i class="fi-ticket"></i>';
+            $subHeadline = 'All the categories <i class="ion-md-list"></i>';
         }
     break;
     case 'all':
diff --git a/webroot/view/overview.php b/webroot/view/overview.php
index 97e0875..c688ac8 100644
--- a/webroot/view/overview.php
+++ b/webroot/view/overview.php
@@ -3,7 +3,7 @@
  * Insipid
  * Personal web-bookmark-system
  *
- * Copyright 2016-2017 Johannes Keßler
+ * Copyright 2016-2018 Johannes Keßler
  *
  * Development starting from 2011: Johannes Keßler
  * https://www.bananas-playground.net/projekt/insipid/
@@ -48,83 +48,44 @@
 		<div class="column">
     		<h1 class="is-size-1">All of your links</h1>
     		<?php if(!empty($subHeadline)) { ?>
-    		<h2 class="is-size-2"><i class="icon ion-md-list"></i> <?php echo $subHeadline; ?></h2>
+    		<h2 class="is-size-2"><?php echo $subHeadline; ?></h2>
     		<?php } ?>
 		</div>
 	</div>
 </section>
 
-<section class="section">
-	<div class="columns is-multiline">
-		<div class="column is-one-quarter">
-            <div class="box">
-              <article class="media">
-                <div class="media-left">
-                  <figure class="image is-64x64">
-                    <img src="https://bulma.io/images/placeholders/128x128.png" alt="Image">
-                  </figure>
-                </div>
-                <div class="media-content">
-                  <div class="content">
-                    <p>
-                      <strong>John Smith</strong> <small>@johnsmith</small> <small>31m</small>
-                      <br>
-                      Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean efficitur sit amet massa fringilla egestas. Nullam condimentum luctus turpis.
-                    </p>
-                  </div>
-                  <nav class="level is-mobile">
-                    <div class="level-left">
-                      <a class="level-item" aria-label="reply">
-                        <span class="icon is-small">
-                          <i class="fas fa-reply" aria-hidden="true"></i>
-                        </span>
-                      </a>
-                      <a class="level-item" aria-label="retweet">
-                        <span class="icon is-small">
-                          <i class="fas fa-retweet" aria-hidden="true"></i>
-                        </span>
-                      </a>
-                      <a class="level-item" aria-label="like">
-                        <span class="icon is-small">
-                          <i class="fas fa-heart" aria-hidden="true"></i>
-                        </span>
-                      </a>
-                    </div>
-                  </nav>
-                </div>
-              </article>
-            </div>
-		</div>
-</section>
-
 <section class="section">
 <?php if(!empty($linkCollection)) { ?>
 <div class="columns is-multiline">
 <?php foreach ($linkCollection as $link) { ?>
 	<div class="column is-one-quarter">
-		<div class="columns">
-			<div class="column">
+		<div class="card">
+			<div class="card-image">
     		<?php if(!empty($link['image'])) { ?>
+    			<figure class="image is-4by3">
           		<a href="<?php echo $link['link']; ?>" target="_blank">
-            	<img class="linkthumbnail" src= "<?php echo $link['image']; ?>">
+            	<img class="" src= "<?php echo $link['image']; ?>">
             	</a>
+            	</figure>
     		<?php } ?>
-    		</div>
-          	<div class="column">
-	            <h4><a href="<?php echo $link['link']; ?>" target="_blank"><?php echo $link['title']; ?></a></h4>
-    	        <p><?php echo $link['description']; ?></p>
-    	        <p>
-    	        	<a href="<?php echo $link['link']; ?>" target="_blank" class="small button">Visit link</a>
-    	        	<a href="index.php?p=linkinfo&id=<?php echo $link['hash']; ?>" class="small button">More details</a>
-    	        </p>
-    	  	</div>
+			</div>
+			<div class="card-content">
+				<div class="content">
+    	            <h4><a href="<?php echo $link['link']; ?>" target="_blank"><?php echo $link['title']; ?></a></h4>
+        	        <p><?php echo $link['description']; ?></p>
+				</div>
+  			</div>
+  			<footer class="card-footer">
+				<a href="<?php echo $link['link']; ?>" target="_blank" class="card-footer-item">Visit link</a>
+				<a href="index.php?p=linkinfo&id=<?php echo $link['hash']; ?>" class="card-footer-item">More details</a>
+			</footer>
         </div>
 	</div>
 <?php } ?>
 </div>
 <?php } if(!empty($tagCollection)) { ?>
-<div class="row">
-	<div class="large-12 columns">
+<div class="columns">
+	<div class="column">
 		<ul>
 		<?php foreach ($tagCollection as $t) { ?>
 			<li><a href="index.php?p=overview&m=tag&id=<?php echo urlencode($t['name']); ?>"><?php echo $t['name']; ?></a></li>
@@ -133,8 +94,8 @@
 	</div>
 </div>
 <?php } if(!empty($categoryCollection)) { ?>
-<div class="row">
-	<div class="large-12 columns">
+<div class="columns">
+	<div class="column">
 		<ul>
 		<?php foreach ($categoryCollection as $c) { ?>
 			<li><a href="index.php?p=overview&m=category&id=<?php echo urlencode($c['name']); ?>"><?php echo $c['name']; ?></a></li>