-
+| File / Folder | Description |
+| ------------------- | ---------------------------------------------------------- |
+| `assets` | CSS, Javascript, images, data, icons |
+| `config` | Application configuration |
+| `inc` | Snippets to share among pages |
+| `public` | Files that can be directly accessed via HTTP/HTTPS |
+| `package.json` | List the packages the project depends on |
+| `package-lock.json` | Keep track of the exact version of every package installed |
## Technologies used
-\* HTML
-
-\* CSS
-
-\* JS
-
-\* PHP
-
-## Project delivery
-
-To deliver this project you must follow the steps indicated in the document:
-
-- [Submitting a solution](https://www.notion.so/Submitting-a-solution-524dab1a71dd4b96903f26385e24cdb6)
+- PHP
+- Javascript
+- HTML
+- CSS
-- You must include the project documentation in PDF format.
-- You must include a presentation in PDF format explaining:
- - Comparison of the original design (Wireframe) with the final result of the project
- - Comparison of the use case diagram with the actions that the user can finally perform
- - Comparison of the original use case diagram with the final user actions
- - What lessons you’ve learned during this project
- - What problems have you encountered when developing this project?
- - How you have organized and distributed the tasks
+## Author
+- [@Gonzalo](https://github.com/gonzalogarahuetes)
+- [@Jaime](https://github.com/jaimealcalde)
+- [@Salvador](https://github.com/SalvaBandicoot)
+- [@tam](https://github.com/tamtran2885)
## Resources
diff --git a/assets/css/editing-modal.css b/assets/css/editing-modal.css
new file mode 100644
index 00000000..48f28a01
--- /dev/null
+++ b/assets/css/editing-modal.css
@@ -0,0 +1,106 @@
+/*---------------------------------EDITING MODAL-------------------------------------*/
+
+.editing__modal {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 1rem;
+ background: rgba(0, 0, 0, 0.8);
+ cursor: pointer;
+ visibility: hidden;
+ opacity: 0;
+ transition: all 0.35s ease-in;
+}
+.editing__modal.is-visible {
+ visibility: visible;
+ opacity: 1;
+}
+
+.modal-dialog {
+ position: relative;
+ max-width: 800px;
+ max-height: 80vh;
+ border-radius: 5px;
+ background: white;
+ overflow: auto;
+ cursor: default;
+}
+
+.modal-dialog > * {
+ padding: 1rem;
+}
+
+.modal-footer {
+ background: lightblue;
+ text-align: center;
+}
+
+.modal__title {
+ color: rgba(0, 136, 169, 1);
+ margin-left: 1rem;
+}
+
+.modal-header {
+ background: lightblue;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ font-size: 1.25rem;
+}
+
+[data-animation="slideInOutLeft"] .modal-dialog {
+ opacity: 0;
+ transform: translateX(-100%);
+ transition: all 0.5s var(--bounceEasing);
+}
+
+[data-animation="slideInOutLeft"].is-visible .modal-dialog {
+ opacity: 1;
+ transform: none;
+ transition-delay: 0.2s;
+}
+
+.close-modal {
+ padding: 0.5rem;
+ border-radius: 50%;
+ border: none;
+ color: white;
+ background-color: rgba(0, 136, 169, 1);
+ font-size: 0.5rem;
+}
+
+.close-modal:hover {
+ background-color: rgba(0, 136, 169, 0.7);
+ cursor: pointer;
+}
+
+.modal__input {
+ padding: 1rem;
+ font-size: 1.5;
+ border: 2px solid rgba(0, 136, 169, 1);
+ border-radius: 0.3rem;
+ margin: 0.5rem 0.5rem 0 0;
+}
+
+.modal__input:focus {
+ background-color: lightblue;
+}
+
+.modal__btn {
+ color: white;
+ padding: 1rem;
+ border-radius: 0.3rem;
+ border: none;
+ background-color: rgba(0, 136, 169, 1);
+ margin: 0.5rem 0.5rem;
+ cursor: pointer;
+}
+
+.modal__btn:hover {
+ background-color: rgba(0, 136, 169, 0.7);
+}
diff --git a/assets/css/header.css b/assets/css/header.css
new file mode 100644
index 00000000..fa08283c
--- /dev/null
+++ b/assets/css/header.css
@@ -0,0 +1,46 @@
+.header {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ padding: 10px 20px;
+ background: lightblue;
+}
+
+.header__logout {
+ background-color: white;
+ border-radius: 1rem;
+ border: 1.5px solid rgba(0, 136, 169, 1);
+ margin-right: 1rem;
+ padding: 0.5rem 1rem;
+ text-decoration: none;
+ color: rgba(0, 136, 169, 1);
+}
+
+.header__logout:hover {
+ background-color: rgba(0, 136, 169, 1);
+ border: 1.5px solid white;
+ color: white;
+ box-shadow: 5px 10px 18px rgba(0, 136, 169, 0.5);
+}
+
+.header__search {
+ font-size: 16px;
+ padding: 0.5em 1rem;
+ background-color: #fff;
+ border: 1px solid rgba(0, 136, 169, 1);
+ border-radius: 1rem;
+ width: 200px;
+ margin: 15px 0;
+}
+
+.header__search::placeholder {
+ color: rgba(0, 136, 169, 1);
+}
+
+.header__search:focus {
+ outline: none;
+ background-color: rgba(0, 136, 169, 1);
+ border: 1.5px solid white;
+ color: white;
+ box-shadow: 5px 10px 18px rgba(0, 136, 169, 0.5);
+}
diff --git a/assets/css/login.css b/assets/css/login.css
new file mode 100644
index 00000000..84145d9d
--- /dev/null
+++ b/assets/css/login.css
@@ -0,0 +1,129 @@
+/*----------------------------------------LOGIN---------------------------------------*/
+
+.darkbg {
+ display: flex;
+ flex-direction: column;
+ gap: 2rem;
+ text-align: center;
+ height: 100vh;
+ width: 100vw;
+ background-image: url("../img/dark-background-images-5561-5821-hd-wallpapers.jpg");
+ background-repeat: no-repeat;
+ padding: 3rem;
+}
+
+.login__div {
+ background-color: white;
+ margin: auto;
+ width: 35%;
+ padding: 2rem;
+ border-radius: 0.3rem;
+ border: 1.5px solid rgba(0, 136, 169, 1);
+ box-shadow: 5px 10px 18px rgba(0, 136, 169, 0.5);
+}
+
+.login {
+ display: flex;
+ flex-direction: column;
+ gap: 1.3rem;
+ text-align: center;
+}
+
+.login__input {
+ outline: none;
+ padding: 0.5rem;
+ border-radius: 0.3rem;
+ background-color: lightblue;
+ color: black;
+ font-size: 1.2rem;
+}
+
+.login__input:focus {
+ background-color: rgba(0, 136, 169, 1);
+ color: white;
+}
+
+.login__input::placeholder {
+ color: rgba(0, 136, 169, 1);
+}
+
+.login__btn {
+ cursor: pointer;
+ padding: 0.5rem;
+ border-radius: 0.3rem;
+ font-size: 1.5rem;
+ background-color: rgba(0, 136, 169, 1);
+ color: white;
+}
+
+.login__btn:hover {
+ background-color: rgba(0, 136, 169, 0.6);
+}
+
+.login__title {
+ color: white;
+ font-size: 4rem;
+ margin: auto;
+ text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff,
+ 0 0 42px rgba(0, 136, 169, 1), 0 0 82px rgba(0, 136, 169, 1),
+ 0 0 92px rgba(0, 136, 169, 1), 0 0 102px rgba(0, 136, 169, 1),
+ 0 0 151px rgba(0, 136, 169, 1);
+}
+
+.login__subtitle {
+ color: white;
+ font-size: 2rem;
+}
+
+.login__notlogged {
+ color: white;
+ font-size: 1.5rem;
+}
+
+.signup {
+ text-decoration: none;
+ color: lightblue;
+}
+
+.signup:hover {
+ text-shadow: 0 0 7px #fff, 0 0 10px #fff, 0 0 21px #fff,
+ 0 0 42px rgba(0, 136, 169, 1), 0 0 82px rgba(0, 136, 169, 1),
+ 0 0 92px rgba(0, 136, 169, 1), 0 0 102px rgba(0, 136, 169, 1),
+ 0 0 151px rgba(0, 136, 169, 1);
+}
+
+.login__error {
+ margin: auto;
+ padding: 0.75rem;
+ width: 35%;
+ border: 1px solid rgba(241, 6, 6, 0.81);
+ background-color: rgba(220, 17, 1, 0.16);
+ box-shadow: 0px 0px 2px #ff0303;
+ color: #ff0303;
+ text-shadow: 2px 1px #00040a;
+ transition: 0.5s;
+ font-size: 1.2rem;
+}
+
+.login__error:hover {
+ background-color: rgba(220, 17, 1, 0.33);
+ transition: 0.5s;
+}
+
+.login__info {
+ margin: auto;
+ padding: 0.75rem;
+ width: 35%;
+ font-size: 1.2rem;
+ border: 1px solid rgba(36, 241, 6, 0.46);
+ background-color: rgba(7, 149, 66, 0.12156862745098039);
+ box-shadow: 0px 0px 2px #259c08;
+ color: #0ad406;
+ text-shadow: 2px 1px #00040a;
+ transition: 0.5s;
+}
+
+.login__info:hover {
+ background-color: rgba(7, 149, 66, 0.35);
+ transition: 0.5s;
+}
diff --git a/assets/css/main.css b/assets/css/main.css
new file mode 100644
index 00000000..4854cb9e
--- /dev/null
+++ b/assets/css/main.css
@@ -0,0 +1,55 @@
+.main {
+ display: flex;
+}
+
+.explorer {
+ width: 20%;
+ padding: 0px 20px;
+}
+
+.explorer input {
+ font-size: 16px;
+ width: 150px;
+ margin: 15px 0;
+}
+
+.new-folder {
+ color: white;
+ width: 150px;
+ padding: 9px 25px;
+ background-color: rgba(0, 136, 169, 1);
+ border: none;
+ border-radius: 10px;
+ font-size: 16px;
+ transition: all 0.3s ease 0s;
+ cursor: pointer;
+}
+
+.new-folder:hover {
+ background-color: rgba(0, 136, 169, 0.8);
+}
+
+.explorer__folders {
+ margin-top: 15px;
+}
+
+.explorer__folders-root {
+ display: flex;
+ align-items: center;
+}
+
+.display_folder-title {
+ margin-left: 20px;
+ display: flex;
+ align-items: center;
+ margin: 5px 10px;
+}
+
+.main__anchor {
+ text-decoration: none;
+ color: rgba(0, 136, 169, 1);
+}
+
+.main__anchor:hover {
+ color: rgba(0, 136, 169, 0.7);
+}
diff --git a/assets/css/middle.css b/assets/css/middle.css
new file mode 100644
index 00000000..c79a661f
--- /dev/null
+++ b/assets/css/middle.css
@@ -0,0 +1,64 @@
+.content {
+ width: 60%;
+ padding: 0px 5px;
+ margin-top: 10px;
+ margin-bottom: 10px;
+}
+
+.content__guide {
+ width: 100%;
+ display: flex;
+ justify-content: space-between;
+ border-bottom: 1px solid #8b8a8b;
+ padding-bottom: 10px;
+}
+
+.content__guide p {
+ font-size: 20px;
+}
+
+.guide__p-right {
+ width: 45%;
+ display: grid;
+ grid-template-columns: 1.5fr 1.5fr 1fr;
+}
+
+.guide_upload {
+ cursor: pointer;
+ transition: all 0.3s ease 0s;
+ border-radius: 10px;
+ background-color: #dbd0c0;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+.guide_upload:hover {
+ opacity: 0.8;
+}
+
+.content__folder {
+ border-bottom: 1px solid #8b8a8b;
+ padding-bottom: 5px;
+ display: flex;
+ align-items: center;
+ margin-top: 5px;
+ margin-bottom: 10px;
+}
+
+.content__folder-title {
+ font-size: 20px;
+ text-decoration: none;
+ color: rgba(0, 136, 169, 1);
+}
+
+.content__folder-title:hover {
+ color: rgba(0, 136, 169, 0.7);
+}
+
+.display_folder {
+ display: grid;
+ grid-template-columns: 0.2fr 2.2fr 0.8fr 1fr;
+ align-items: center;
+ padding: 10px 0px;
+}
diff --git a/assets/css/modal-content.css b/assets/css/modal-content.css
new file mode 100644
index 00000000..d2f02f93
--- /dev/null
+++ b/assets/css/modal-content.css
@@ -0,0 +1,48 @@
+.close {
+ color: #ffffff;
+ float: right;
+ font-size: 40px;
+ font-weight: bold;
+ max-height: 10%;
+ max-width: 10%;
+ margin-left: 4%;
+ margin-right: 3%;
+ margin-top: 2%;
+ margin-bottom: 0;
+}
+
+.close:hover,
+.close:focus {
+ color: #000;
+ text-decoration: none;
+ cursor: pointer;
+}
+
+.modal {
+ display: none; /* Hidden by default */
+ position: fixed; /* Stay in place */
+ z-index: 1; /* Sit on top */
+ margin: auto;
+ left: 0;
+ right: 0;
+ top: 0;
+ bottom: 0;
+ width: 95%; /* Full width */
+ height: 95%; /* Full height */
+ overflow: auto; /* Enable scroll if needed */
+ background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */
+ text-align: center;
+}
+
+.modal-content {
+ width: 90%;
+ height: 90%;
+ max-width: 980px;
+ max-height: 980px;
+ margin-left: 10%;
+ margin-right: 10%;
+}
+
+.modal__button3 {
+ background-color: red;
+}
diff --git a/assets/css/modal-upload.css b/assets/css/modal-upload.css
new file mode 100644
index 00000000..2bad1c0c
--- /dev/null
+++ b/assets/css/modal-upload.css
@@ -0,0 +1,52 @@
+.modal__file {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ display: none;
+ background: rgba(0, 0, 0, 0.8);
+ color: black;
+ transition: opacity 100ms ease-in;
+}
+
+.modal__content-file {
+ max-width: 400px;
+ width: 90%;
+ position: relative;
+ margin: 10% auto;
+ padding: 20px;
+ border-radius: 3px;
+ background: #fcee6d;
+}
+
+.modal__close-file {
+ position: absolute;
+ top: 0.5rem;
+ right: 0.5rem;
+ background-color: transparent;
+ border: none;
+ cursor: pointer;
+ transition: all 0.5s;
+}
+
+.modal__close-file:hover {
+ transform: scale(1.5);
+ color: #626972;
+}
+
+.button--small {
+ min-width: 4.5rem;
+ min-height: 2rem;
+ margin: 0.8rem;
+ background: #3498db;
+ border-radius: 28px;
+ font-family: Arial;
+ color: #ffffff;
+ text-decoration: none;
+}
+
+.button--small:hover {
+ background: #3cb0fd;
+ text-decoration: none;
+}
diff --git a/assets/css/others.css b/assets/css/others.css
new file mode 100644
index 00000000..263da6cc
--- /dev/null
+++ b/assets/css/others.css
@@ -0,0 +1,21 @@
+.fileIcon {
+ width: 30px;
+ margin-right: 10px;
+}
+
+.fileIcon-small {
+ width: 35px;
+ padding: 5px;
+ cursor: pointer;
+}
+
+.fileIcon-medium {
+ width: 25px;
+ padding: 3px;
+ cursor: pointer;
+}
+
+.fileIcon-large {
+ width: 3rem;
+ margin-left: 1rem;
+}
diff --git a/assets/css/right-bar.css b/assets/css/right-bar.css
new file mode 100644
index 00000000..874f0231
--- /dev/null
+++ b/assets/css/right-bar.css
@@ -0,0 +1,84 @@
+.details {
+ padding: 0.5rem 1rem;
+ width: 20%;
+}
+
+.details__header {
+ display: flex;
+ flex-wrap: wrap;
+ padding: 30px 20px;
+ border-bottom: 1px solid #8b8a8b;
+ align-items: center;
+}
+
+.details__header p {
+ margin-right: 20px;
+}
+
+.details__content {
+ margin-top: 20px;
+ padding: 15px;
+}
+
+.details__content p {
+ margin: 5px 0px;
+ padding: 10px;
+}
+
+.details__flex {
+ display: flex;
+ justify-content: space-between;
+}
+
+.details__btn--edit {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ padding: 0.3rem;
+ background-color: lightblue;
+ border-radius: 50%;
+ border: 1.5px solid rgba(0, 136, 169, 1);
+ margin: 0 1rem;
+}
+
+.details__btn--edit:hover {
+ background-color: rgba(0, 136, 169, 1);
+ border: 1.5px solid lightblue;
+}
+
+.details__btn--delete {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ cursor: pointer;
+ padding: 0.3rem;
+ background-color: lightblue;
+ border-radius: 50%;
+ border: 1.5px solid rgba(0, 136, 169, 1);
+}
+
+.details__btn--delete:hover {
+ background-color: rgba(0, 136, 169, 1);
+ border: 1.5px solid lightblue;
+}
+
+.details__preview {
+ cursor: pointer;
+ font-size: 1.2rem;
+ background-color: white;
+ width: 100%;
+ border-radius: 1rem;
+ border: 1.5px solid rgba(0, 136, 169, 1);
+ margin-right: 1rem;
+ padding: 0.5rem 1rem;
+ text-decoration: none;
+ color: rgba(0, 136, 169, 1);
+}
+
+.details__preview:hover {
+ background-color: rgba(0, 136, 169, 1);
+ border: 1.5px solid white;
+ color: white;
+ box-shadow: 5px 10px 18px rgba(0, 136, 169, 0.5);
+}
diff --git a/assets/css/styles.css b/assets/css/styles.css
new file mode 100644
index 00000000..47f9db18
--- /dev/null
+++ b/assets/css/styles.css
@@ -0,0 +1,24 @@
+@import url("../../assets/css/modal-content.css");
+@import url("../assets/css/login.css");
+@import url("../../assets/css/editing-modal.css");
+@import url("../../assets/css/header.css");
+@import url("../../assets/css/right-bar.css");
+@import url("../../assets/css/others.css");
+@import url("../../assets/css/middle.css");
+@import url("../../assets/css/main.css");
+@import url("../../assets/css/modal-upload.css");
+
+@import url("https://fonts.googleapis.com/css2?family=Mukta&display=swap");
+
+* {
+ box-sizing: border-box;
+ margin: 0;
+ padding: 0;
+}
+
+body {
+ margin: 0;
+ padding: 0;
+ overflow: scroll;
+ font-family: "Mukta", sans-serif;
+}
diff --git a/assets/data/users.json b/assets/data/users.json
new file mode 100644
index 00000000..fd0ac1a4
--- /dev/null
+++ b/assets/data/users.json
@@ -0,0 +1,17 @@
+[
+ {
+ "username": "ggarahuetes",
+ "email": "gonzaloarahuetes@gmail.com",
+ "password": "123123"
+ },
+ {
+ "username": "username",
+ "email": "username@gmail.com",
+ "password": "123456"
+ },
+ {
+ "username": "tamtran",
+ "email": "tamtran@gmail.com",
+ "password": "123456"
+ }
+]
\ No newline at end of file
diff --git a/assets/icons/bug.svg b/assets/icons/bug.svg
new file mode 100644
index 00000000..79fa5757
--- /dev/null
+++ b/assets/icons/bug.svg
@@ -0,0 +1,50 @@
+
+
+
diff --git a/assets/icons/cloudup.svg b/assets/icons/cloudup.svg
new file mode 100644
index 00000000..66fd8c64
--- /dev/null
+++ b/assets/icons/cloudup.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/assets/icons/delete.svg b/assets/icons/delete.svg
new file mode 100644
index 00000000..5ff675fe
--- /dev/null
+++ b/assets/icons/delete.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/assets/icons/edit.svg b/assets/icons/edit.svg
new file mode 100644
index 00000000..aab4339b
--- /dev/null
+++ b/assets/icons/edit.svg
@@ -0,0 +1,48 @@
+
+
+
+
diff --git a/assets/img/dark-background-images-5561-5821-hd-wallpapers.jpg b/assets/img/dark-background-images-5561-5821-hd-wallpapers.jpg
new file mode 100644
index 00000000..a0b6914f
Binary files /dev/null and b/assets/img/dark-background-images-5561-5821-hd-wallpapers.jpg differ
diff --git a/assets/js/functions.js b/assets/js/functions.js
new file mode 100644
index 00000000..0d60f3a6
--- /dev/null
+++ b/assets/js/functions.js
@@ -0,0 +1,17 @@
+// Display and close file modal
+const uploadFile = document.getElementById("btn__upload");
+const modalFile = document.getElementById("modal__file");
+const modalFileClose = document.querySelector("#button-close-file");
+const closeModalFileBtn = document.querySelector("#cancel-modal-file");
+
+uploadFile.addEventListener("click", openFileModal);
+modalFileClose.addEventListener("click", closeFileModal);
+closeModalFileBtn.addEventListener("click", closeFileModal);
+
+function openFileModal() {
+ modalFile.style.display = "block";
+}
+
+function closeFileModal() {
+ modalFile.style.display = "none";
+}
diff --git a/assets/js/modal-content.js b/assets/js/modal-content.js
new file mode 100644
index 00000000..5f084d9d
--- /dev/null
+++ b/assets/js/modal-content.js
@@ -0,0 +1,14 @@
+var buttonShow = document.getElementById("btn-show");
+var buttonHidde = document.getElementById("btn-hidde");
+var modal = document.getElementById("modal");
+
+buttonShow.addEventListener("click", show);
+buttonHidde.addEventListener("click", hidde);
+
+function show() {
+ modal.style.display = "block";
+}
+
+function hidde() {
+ modal.style.display = "none";
+}
\ No newline at end of file
diff --git a/assets/js/modal_triggers.js b/assets/js/modal_triggers.js
new file mode 100644
index 00000000..fae7596f
--- /dev/null
+++ b/assets/js/modal_triggers.js
@@ -0,0 +1,32 @@
+const openEl = document.querySelector("[data-open]");
+const closeEl = document.querySelector("[data-close]");
+const isVisible = "is-visible";
+
+openEl.addEventListener("click", function () {
+ const modalId = this.dataset.open;
+ document.getElementById(modalId).classList.add(isVisible);
+});
+
+closeEl.addEventListener("click", function () {
+ this.parentElement.parentElement.parentElement.classList.remove(isVisible);
+});
+
+document.addEventListener("click", (e) => {
+ if (e.target == document.querySelector(".editing__modal.is-visible")) {
+ document
+ .querySelector(".editing__modal.is-visible")
+ .classList.remove(isVisible);
+ }
+});
+
+document.addEventListener("keyup", (e) => {
+ // if we press the ESC
+ if (
+ e.key == "Escape" &&
+ document.querySelector(".editing__modal.is-visible")
+ ) {
+ document
+ .querySelector(".editing__modal.is-visible")
+ .classList.remove(isVisible);
+ }
+});
diff --git a/config/app.php b/config/app.php
new file mode 100644
index 00000000..c53e4a38
--- /dev/null
+++ b/config/app.php
@@ -0,0 +1,5 @@
+
+
+
+
+
+
+
+ 
+
+ 
+
+
+
+
+
+
+
+ Name
+
+
+ Size
+Modified
+ +
+
+
+
+
+
+ ![](./Icons/" . ($type ? $type : )
+
+ " . ($name ? $name : '') . "
+ + +
+
+
+ ";
+ }
+
+ if (isset($_SESSION["fileInfoTrash"]) && isset($_SESSION["fileInfoTrash"])) {
+ $currentUserPathTrash = $_SESSION["fileInfoTrash"]["path"];
+ $nameTrash = $_SESSION["fileInfoTrash"]["name"];
+ $typeTrash = strtoupper($_SESSION["fileInfoTrash"]["type"]);
+ $sizeTrash = $_SESSION["fileInfoTrash"]["size"];
+ $modifiedTrash = $_SESSION["fileInfoTrash"]["modified"];
+ $createdTrash = $_SESSION["fileInfoTrash"]["created"];
+ $shortNameTrash = $_SESSION["fileInfoTrash"]["shortName"];
+ echo "
+
+
+ Type:
+" . ($type ? $type : '') . "
+
+
+ Size:
+" . ($size ? $size : '') . "
+
+
+ Modified:
+" . ($modified ? $modified : '') . "
+
+
+ Created:
+" . ($created ? $created : '') . "
+
+ ![](./Icons/" . ($typeTrash ? $typeTrash : )
+
+ " . ($nameTrash ? $nameTrash : '') . "
+ +
+
+
+
+
+ Type:
+" . ($typeTrash ? $typeTrash : '') . "
+
+
+ Size:
+" . ($sizeTrash ? $sizeTrash : '') . "
+
+
+ Modified:
+" . ($modifiedTrash ? $modifiedTrash : '') . "
+
+
+ Created:
+" . ($createdTrash ? $createdTrash : '') . "
+
+
+
+
+
+
+
+
+
+
+