init following page

src/application/controller/following.php

@@ -0,0 +1,22 @@
+<?php
+
+if (!isset($_SESSION['username'])) {
+
+  header('Location: ' . PROJECT_HOST . '/login', true, 302);
+}
+
+$metaTitle = _('Following | Twisterarmy Cloud');
+
+$followingUsersTotal = 0;
+$followingUsers      = [];
+
+foreach ((array) $_twister->getFollowing($_SESSION['username']) as $followingUserName) {
+
+  $followingUsers[] = [
+    'name' => $followingUserName
+  ];
+
+  $followingUsersTotal++;
+}
+
+require(PROJECT_DIR . '/application/view/following.phtml');

src/application/view/following.phtml

@@ -0,0 +1,34 @@
+<?php include(PROJECT_DIR . '/application/controller/common/header/user.php') ?>
+<div class="container">
+  <div class="main">
+    <div class="menu">
+      <a class="item" href="<?php echo PROJECT_HOST ?>" title="<?php echo _('Home') ?>">
+        <i class="bi bi-house"></i>
+      </a><a class="item active" href="following" title="<?php echo _('Following') ?>">
+        <i class="bi bi-person"></i>
+        <?php if ($followingUsersTotal) { ?>
+          <span><?php echo $followingUsersTotal ?></span>
+        <?php } ?>
+      </a><a class="item" href="bookmarks" title="<?php echo _('Bookmarks') ?>">
+        <i class="bi bi-bookmarks"></i>
+      </a><a class="item" href="mentions" title="<?php echo _('Mentions') ?>">
+        <i class="bi bi-at"></i>
+      </a><a class="item" href="messages" title="<?php echo _('Messages') ?>">
+        <i class="bi bi-envelope"></i>
+      </a><a class="item" href="settings" title="<?php echo _('Messages') ?>">
+        <i class="bi bi-gear"></i>
+      </a>
+    </div>
+    <div class="content">
+      <?php foreach ($followingUsers as $followingUser) { ?>
+        <div class="item">
+          @<?php echo $followingUser['name'] ?>
+        </div>
+      <?php } ?>
+    </div>
+  </div>
+  <div class="side"></div>
+</div>
+<div class="footer">
+  <?php include(PROJECT_DIR . '/application/controller/common/footer/user.php') ?>
+</div>

src/bootstrap.php

@@ -59,6 +59,9 @@ if (isset($_GET['_route_'])) {
       case 'logout':
         require(PROJECT_DIR . '/application/controller/logout.php');
       break;
+      case 'following':
+        require(PROJECT_DIR . '/application/controller/following.php');
+      break;
       case 'register':
         require(PROJECT_DIR . '/application/controller/register.php');
       break;

src/public/css/user.css

@@ -52,14 +52,19 @@ a:active {
   width: 70%
 }
 
+.container .main .menu {
+  margin-bottom: 6px
+}
+
 .container .main .menu .item {
   display: inline-block;
-  /* background: rgba(39, 46, 57, 0.28); */
-  background: rgba(101, 114, 134, 0.28);
+  background: rgba(39, 46, 57, 0.28);
+  /* background: rgba(101, 114, 134, 0.28); */
   border-radius: 3px;
   cursor: pointer;
   text-align: center;
-  padding: 8px 16px
+  padding: 8px 16px;
+  margin: 2px
 }
 
 .container .main .menu .item.active,
@@ -73,7 +78,7 @@ a:active {
 }
 
 .container .main .post {
-  margin: 8px 0;
+  margin-bottom: 10px;
   padding: 16px;
   background: #272E39;
   border-radius: 3px;
@@ -88,7 +93,8 @@ a:active {
   margin-bottom: 16px;
   font-family: Roboto-Regular, Sans-Serif, Verdana;
   font-size: 14px;
-  background: rgba(101, 114, 134, 0.28);
+  /*background: rgba(101, 114, 134, 0.28);*/
+  background: rgba(255, 255, 255, 0.18);
   color: #dfe8f4;
   outline: none
 
@@ -97,6 +103,7 @@ a:active {
 .container .main .post textarea:focus {
   height: 120px;
   /*background: rgb(79, 90, 107);*/
+  background: rgb(103, 112, 126);
 }
 
 .container .main .post button {
@@ -122,7 +129,9 @@ a:active {
 .container .main .content .item {
   padding: 16px;
   margin-bottom: 8px;
-  background: rgba(101, 114, 134, 0.28);
+  /*background: rgba(101, 114, 134, 0.28);*/
+  /*background: rgba(255, 254, 254, 0.04);*/
+  background: rgba(255, 255, 255, 0.18);
   border-radius: 3px;
   color: #dfe8f4
 }