From 57c3e7406f08bce251b8c2e2938076ff91187efa Mon Sep 17 00:00:00 2001
From: Genvictus <johannstarkmk42@gmail.com>
Date: Fri, 3 Nov 2023 22:42:24 +0700
Subject: [PATCH] rfc: move navbar as separate template
---
src/app/view/templates/navbar.php | 40 +++++++++++++++++++++++++++++
src/public/css/home.css | 42 -------------------------------
src/public/css/lib.css | 3 +++
src/public/css/shared.css | 41 ++++++++++++++++++++++++++++++
4 files changed, 84 insertions(+), 42 deletions(-)
create mode 100644 src/app/view/templates/navbar.php
create mode 100644 src/public/css/lib.css
create mode 100644 src/public/css/shared.css
diff --git a/src/app/view/templates/navbar.php b/src/app/view/templates/navbar.php
new file mode 100644
index 0000000..54f81ed
--- /dev/null
+++ b/src/app/view/templates/navbar.php
@@ -0,0 +1,40 @@
+<?php
+
+// require_once PROJECT_ROOT_PATH . "/public/templates/UserProfile.php";
+
+function Navbar()
+{
+// $userProfile = UserProfile();
+
+ $html = <<<"EOT"
+ <div class="layout">
+ <div class="layout__left-sidebar">
+ <div class="sidebar-menu">
+ <img src="/public/assets/Logo.png" class="brand" />
+ <a style="text-decoration:none" href="/">
+ <div class="sidebar-menu__item sidebar-menu__item--active">
+ <img src="/public/assets/home.svg" class="sidebar-menu__item-icon" />
+ Home
+ </div>
+ </a>
+ <a style="text-decoration:none" href="#">
+ <div class="sidebar-menu__item">
+ <img src="/public/assets/followed.jpg" class="sidebar-menu__item-icon" />
+ Followed
+ </div>
+ </a>
+ <a style="text-decoration:none" href="#">
+ <div class="sidebar-menu__item">
+ <img src="/public/assets/profile.svg" class="sidebar-menu__item-icon" />
+ Profile
+ </div>
+ </a>
+ </div>
+ </div>
+ <div id="list-post">
+ </div>
+ </div>
+ EOT;
+
+ return $html;
+}
diff --git a/src/public/css/home.css b/src/public/css/home.css
index b6051f5..eedc8e9 100644
--- a/src/public/css/home.css
+++ b/src/public/css/home.css
@@ -18,48 +18,6 @@ body{
/* max-width: 2200px; */
}
-.layout__right-sidebar {
- position: fixed;
- width: 350px;
-}
-
-.sidebar-menu {
- position: fixed;
-}
-
-.sidebar-menu__item {
- font-size: 19px;
- color: #0F141A;
- display: flex;
- align-items: center;
- font-weight: 700;
- padding: 10px;
-}
-
-.sidebar-menu__item:hover {
- background: rgba(29, 161, 242, 0.1);
- color: #1da0f2;
- border-radius: 20px;
- cursor: pointer;
-}
-
-.sidebar-menu__item:active {
- color: #1da0f2;
-}
-
-.sidebar-menu__item--active {
- color: #1da0f2;
-}
-
-.sidebar-menu__item-icon {
- height: 26px;
- margin-right: 20px;
-}
-
-.sidebar-menu__item--active .sidebar-menu__item-icon {
- filter: invert(67%) sepia(60%) saturate(4956%) hue-rotate(176deg) brightness(95%) contrast(99%);
-}
-
.post {
display: flex;
border-bottom: 1px solid #e6ecf0;
diff --git a/src/public/css/lib.css b/src/public/css/lib.css
new file mode 100644
index 0000000..3dae356
--- /dev/null
+++ b/src/public/css/lib.css
@@ -0,0 +1,3 @@
+.post-item {
+ width: 350px;
+}
\ No newline at end of file
diff --git a/src/public/css/shared.css b/src/public/css/shared.css
new file mode 100644
index 0000000..e9e1c93
--- /dev/null
+++ b/src/public/css/shared.css
@@ -0,0 +1,41 @@
+.layout__right-sidebar {
+ position: fixed;
+ width: 350px;
+}
+
+.sidebar-menu {
+ position: fixed;
+}
+
+.sidebar-menu__item {
+ font-size: 19px;
+ color: #0F141A;
+ display: flex;
+ align-items: center;
+ font-weight: 700;
+ padding: 10px;
+}
+
+.sidebar-menu__item:hover {
+ background: rgba(29, 161, 242, 0.1);
+ color: #1da0f2;
+ border-radius: 20px;
+ cursor: pointer;
+}
+
+.sidebar-menu__item:active {
+ color: #1da0f2;
+}
+
+.sidebar-menu__item--active {
+ color: #1da0f2;
+}
+
+.sidebar-menu__item-icon {
+ height: 26px;
+ margin-right: 20px;
+}
+
+.sidebar-menu__item--active .sidebar-menu__item-icon {
+ filter: invert(67%) sepia(60%) saturate(4956%) hue-rotate(176deg) brightness(95%) contrast(99%);
+}
\ No newline at end of file
--
GitLab