Merge pull request #38 from Relluem94s/RTB-27

RTB-33 add version to nav

index.php

@@ -1,7 +1,9 @@
 <?php
 require "shared/Tools.php";
+require "shared/functions/Functions.php";
 
 use Shared\Tools;
+use Shared\Functions\Functions;
 
 ?>
 
@@ -41,8 +43,9 @@
         <nav class="navbar fixed-top bg-dark">
             <a class="navbar-brand" target="_blank" title="Check out the Sourcecode" href="https://github.com/Relluem94s/RelluToolbox">
                 <img src="./shared/assets/img/rellutoolbox.svg" alt="Logo" class="d-inline-block align-text-top">
+                <span class="ms-5 badge bg-secondary">v<?php echo Functions::getVersion(); ?></span>
             </a>
-            <form class="d-flex" role="search">
+            <form class="search-form d-flex" role="search">
                 <input
                 class="form-control navSearch"
                 id="searchBox"

shared/Tools.php

@@ -5,8 +5,7 @@
 /**
  * Class for Tools
  */
-class Tools
-{
+class Tools {
 
     public static function getTool(
         $name,

shared/assets/css/Toolbox.css

@@ -48,130 +48,6 @@ input.empty {
     }
 }
 
-
-.floatingActionButton {
-  position: fixed;
-  bottom: 50px;
-  right: 50px;
-  transition: all ease-in-out 0.2s;
-  transform: translate(-50%, -50%);
-}
-
-.searchAnchor {
-  position: relative;
-  width: auto;
-  height: auto;
-}
-
-.searchSubmit {
-  opacity: 0;
-  width: 0px;
-}
-
-.searchBar {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  outline: none;
-  border: none;
-  background: #fff;
-  width: 50px;
-  height: 50px;
-  border-radius: 25px;
-  opacity: 0;
-  z-index: 5;
-  transition: all 0.2;
-  font-size: 1em;
-  padding: 5px
-}
-
-.searchBar:hover {
-  cursor: pointer;
-}
-
-.searchBar:focus {
-  width: 200px;
-  left: auto;
-  opacity: 1;
-  cursor: text;
-  transition: all 0.2;
-  padding-left: 25px;
-  padding-right: 70px;
-}
-
-.searchToggle {
-  position: absolute;
-  width: 60px;
-  height: 60px;
-  background: #48b3b1;
-  box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.603);
-  opacity: 1;
-  top: -4px;
-  left: -4px;
-  border-radius: 50%;
-  transition: all 0.2s;
-}
-
-.searchToggle:hover {
-  cursor: pointer;
-}
-
-.searchToggle::before {
-  content: "";
-  position: absolute;
-  margin: auto;
-  top: 22px;
-  right: 0;
-  bottom: 0;
-  left: 22px;
-  width: 12px;
-  height: 2px;
-  background: #fff;
-  transform: rotate(45deg);
-  transition: all 0.2s;
-}
-
-.searchToggle::after {
-  content: "";
-  position: absolute;
-  margin: auto;
-  top: -5px;
-  right: 0;
-  bottom: 0;
-  left: -5px;
-  width: 25px;
-  height: 25px;
-  border-radius: 50%;
-  border: 2px solid #fff;
-  transition: all 0.2s;
-}
-
-.searchBar:focus~.searchToggle {
-  right: 400px;
-  background: #48b3b1;
-  z-index: 6;
-  transition: all 0.2;
-}
-
-.searchBar:focus~.searchToggle::before {
-  top: 0;
-  left: 0;
-  width: 25px;
-}
-
-.searchBar:focus~.searchToggle::after {
-  top: 0;
-  left: 0;
-  width: 25px;
-  height: 2px;
-  border: none;
-  background: white;
-  border-radius: 0%;
-  transform: rotate(-45deg);
-}
-
 .navbar {
   padding-left: 10px;
   padding-top: 2px;
@@ -186,6 +62,11 @@ input.navSearch {
   text-align: center;
 }
 
+.search-form{
+  position:absolute;
+  left: 49%;
+}
+
 
 .cookieBanner {
   background-color: #212529;
@@ -221,4 +102,11 @@ input.navSearch {
 
 .navbar-brand img {
   height: 30px;
-}
+}
+
+.center {
+  position: absolute;
+  left: 0;
+  right: 0;
+  margin: auto;  
+}

shared/functions/Functions.php

@@ -5,6 +5,17 @@
 /**
  * Class for all reusable Functions
  */
-class Functions
-{
+class Functions {
+
+    public static function getVersion() :string{
+        $version = "";
+
+        $fileContent = file_get_contents("shared/package.json");
+
+        $packageJson = json_decode($fileContent);
+
+
+        return $packageJson->version;
+    }
+
 }

shared/functions/Helpers.php

@@ -5,6 +5,6 @@
 /**
  * Class for Helpers
  */
-class Helpers
-{
+class Helpers {
+
 }