commit 422691e546cf1e46fbeeacfa1ad8647e620155d9
parent 2fe1255a65c6f610fd468559fe4254817fc14ade
Author: LennartSchroot <[email protected]>
Date: Mon, 3 Jul 2023 17:06:23 +0200
laatste meuk
Diffstat:
6 files changed, 401 insertions(+), 14 deletions(-)
diff --git a/.idea/workspace.xml b/.idea/workspace.xml
@@ -5,10 +5,12 @@
</component>
<component name="ChangeListManager">
<list default="true" id="f1ac0514-5d96-49e8-8c16-ecccecd1bbe1" name="Changes" comment="">
+ <change afterPath="$PROJECT_DIR$/css/user.css" afterDir="false" />
<change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
- <change beforePath="$PROJECT_DIR$/Lollipop/Router.php" beforeDir="false" afterPath="$PROJECT_DIR$/Lollipop/Router.php" afterDir="false" />
- <change beforePath="$PROJECT_DIR$/js/panda.js" beforeDir="false" afterPath="$PROJECT_DIR$/js/panda.js" afterDir="false" />
- <change beforePath="$PROJECT_DIR$/routing/login.php" beforeDir="false" afterPath="$PROJECT_DIR$/routing/login.php" afterDir="false" />
+ <change beforePath="$PROJECT_DIR$/css/map.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/map.css" afterDir="false" />
+ <change beforePath="$PROJECT_DIR$/index.php" beforeDir="false" afterPath="$PROJECT_DIR$/index.php" afterDir="false" />
+ <change beforePath="$PROJECT_DIR$/views/map.html" beforeDir="false" afterPath="$PROJECT_DIR$/views/map.html" afterDir="false" />
+ <change beforePath="$PROJECT_DIR$/views/user.html" beforeDir="false" afterPath="$PROJECT_DIR$/views/user.html" afterDir="false" />
</list>
<option name="SHOW_DIALOG" value="false" />
<option name="HIGHLIGHT_CONFLICTS" value="true" />
@@ -62,6 +64,7 @@
<workItem from="1688384956857" duration="828000" />
<workItem from="1688387080412" duration="1016000" />
<workItem from="1688388326819" duration="2118000" />
+ <workItem from="1688391588811" duration="3329000" />
</task>
<servers />
</component>
diff --git a/css/map.css b/css/map.css
@@ -162,4 +162,92 @@ nav ul li:first-child {
body, html {
height: 100%;
+}
+
+nav {
+ background-color: #333333;
+ width: 100%;
+ height: 15vw;
+ display: flex;
+ align-items: center;
+}
+
+nav ul {
+ margin: 0;
+ padding: 0;
+ width: 100%;
+ height: 15vw;
+ display: flex;
+ list-style-type: none;
+ align-items: center;
+}
+
+nav li {
+ font-weight: bold;
+ font-size: 4vw;
+ margin-right: 3vw;
+}
+
+nav ul li a {
+ color: #fff;
+ text-decoration: none;
+ padding: 0;
+}
+
+nav ul li a.active {
+ pointer-events: none;
+ color: gray;
+}
+
+nav ul li:first-child {
+ margin-right: auto;
+}
+
+.img-big-logo {
+ display: none;
+}
+
+.img-small-logo,
+.img-big-logo {
+ height: 15vw;
+ width: auto;
+ vertical-align: middle;
+}
+
+@media (min-width: 400px) {
+ nav {
+ height: 60px;
+ }
+
+ nav ul {
+ height: 60px;
+ }
+
+ nav li {
+ font-size: 16px;
+ margin-right: 12px;
+ }
+
+ .img-small-logo,
+ .img-big-logo {
+ height: 60px;
+ }
+}
+
+@media (min-width: 700px) {
+ .img-big-logo {
+ display: block;
+ }
+
+ .img-small-logo {
+ display: none;
+ }
+
+ nav ul li:first-child {
+ margin-right: 0;
+ }
+
+ nav ul li:nth-child(2) {
+ margin-right: auto;
+ }
}
\ No newline at end of file
diff --git a/css/user.css b/css/user.css
@@ -0,0 +1,289 @@
+body {
+ background-color: #BCCFB0;
+ color: #333333;
+ font-family: Roboto, sans-serif;
+ margin: 0;
+ padding: 0;
+}
+
+a {
+ color: white;
+ font-family: Roboto, sans-serif;
+}
+
+/*NAVBAR*/
+nav {
+ background-color: #333333;
+ width: 100%;
+ height: 15vw;
+ display: flex;
+ align-items: center;
+}
+
+nav ul {
+ margin: 0;
+ padding: 0;
+ width: 100%;
+ height: 15vw;
+ display: flex;
+ list-style-type: none;
+ align-items: center;
+}
+
+nav li {
+ font-weight: bold;
+ font-size: 4vw;
+ margin-right: 3vw;
+}
+
+nav ul li a {
+ color: #fff;
+ text-decoration: none;
+ padding: 0;
+}
+
+nav ul li a.active {
+ pointer-events: none;
+ color: gray;
+}
+
+nav ul li:first-child {
+ margin-right: auto;
+}
+
+.img-big-logo {
+ display: none;
+}
+
+.img-small-logo,
+.img-big-logo {
+ height: 15vw;
+ width: auto;
+ vertical-align: middle;
+}
+table {
+ border-collapse: collapse;
+ box-shadow: 0 0 10px #333333;
+ color: white;
+}
+
+th, td {
+ background-color: #333333;
+ padding: 8px;
+ text-align: left;
+ border-bottom: 1px solid #ddd;
+}
+
+th {
+ background-color: gray;
+ font-weight: bold;
+}
+
+tr:hover {
+ background-color: #444444;
+}
+
+.block1 {
+ display: flex;
+ width: 90vw;
+ height: auto;
+ margin: 5vw auto 5vw;
+ justify-content: space-between;
+ background-color: #BCCFB0;
+ color: white;
+ border-radius: 4px;
+}
+
+.container {
+ box-shadow: 0 0 10px rgba(51, 51, 51, 0.2);
+ margin: 20px auto;
+ max-width: 90vw;
+ text-align: center;
+}
+
+input[type="checkbox"] {
+ width: auto;
+ margin: 1vw 1vw;
+}
+.content {
+ font-size: 1.2vw;
+ height: auto;
+ width: auto;
+ align-items: center;
+ justify-content: center;
+}
+
+.form-group{
+ max-width: 90%;
+}
+
+.col-md-6{
+ width: 90vw;
+}
+
+.title {
+ margin-bottom: 30px;
+}
+
+.title h1 {
+ font-size: 8vw;
+ margin: 20px;
+}
+
+.title h4 {
+ font-size: 4vw;
+ margin: 10px;
+}
+
+.card {
+ border: none;
+ border-radius: 4px;
+ margin-bottom: 20px;
+}
+
+.card-header {
+ background-color: #333333;
+ color: white;
+ font-weight: bold;
+ font-size: 4vw;
+ padding: 10px;
+}
+
+.card-body {
+ padding: 20px;
+}
+
+.form-group {
+ margin-bottom: 20px;
+}
+
+label {
+ font-weight: bold;
+ font-size: 4vw;
+}
+
+input{
+ width: 85%;
+ padding: 10px;
+ font-size: 4vw;
+ border-radius: 4px;
+ border: 1px solid #ccc;
+}
+
+input[type="submit"] {
+ font-size: 4vw;
+ padding: 10px 20px;
+ background-color: #333333;
+ color: white;
+ border: none;
+ border-radius: 4px;
+ cursor: pointer;
+ margin: 1vw 1vw;
+}
+
+input[type="submit"]:hover {
+ background-color: #222222;
+}
+
+.row.justify-content-center {
+ text-align: center;
+}
+
+.row.justify-content-center > div {
+ display: inline-block;
+}
+
+.row.justify-content-center > div:not(:first-child) {
+ margin-left: 10px;
+}
+
+@media (min-width: 400px) {
+ /*NAVBAR*/
+ nav {
+ height: 60px;
+ }
+
+ nav ul {
+ height: 60px;
+ }
+
+ nav li {
+ font-size: 16px;
+ margin-right: 12px;
+ }
+ .img-small-logo,
+ .img-big-logo {
+ height: 60px;
+ }
+ .title h1 {
+ font-size: 32px;
+ margin: 20px;
+ }
+
+ .title h4 {
+ font-size: 16px;
+ margin: 10px;
+ }
+
+ .card-header {
+ font-size: 16px;
+ padding: 10px;
+ }
+
+ input {
+ font-size: 16px;
+ }
+
+ input[type="submit"] {
+ font-size: 16px;
+ padding: 10px 20px;
+ }
+}
+
+@media (min-width: 700px) {
+ .img-big-logo {
+ display: block;
+ }
+
+ .img-small-logo {
+ display: none;
+ }
+
+ nav ul li:first-child {
+ margin-right: 0;
+ }
+
+ nav ul li:nth-child(2) {
+ margin-right: auto;
+ }
+ .container {
+ max-width: 90vw;
+ }
+
+ .title h1 {
+ font-size: 50px;
+ }
+
+ .title h4 {
+ font-size: 20px;
+ }
+
+ .card-header {
+ font-size: 20px;
+ }
+
+ input {
+ font-size: 20px;
+ }
+
+ input[type="submit"] {
+ font-size: 20px;
+ padding: 10px 20px;
+ }
+ label{
+ font-size: 1.5vw;
+ }
+ .col-md-6{
+ width: 40vw;
+ }
+}
diff --git a/index.php b/index.php
@@ -133,6 +133,7 @@ $router->addRoute(['GET'], '/css/dashboard.css', "css/dashboard.css");
$router->addRoute(['GET'], '/css/login.css', "css/login.css");
$router->addRoute(['GET'], '/css/hdata.css', "css/hdata.css");
$router->addRoute(['GET'], '/css/map.css', "css/map.css");
+$router->addRoute(['GET'], '/css/user.css', "css/user.css");
$router->addRoute(['GET'], '/img/big-logo.png', "img/big-logo.png");
$router->addRoute(['GET'], '/img/small_logo.png', "img/small_logo.png");
diff --git a/views/map.html b/views/map.html
@@ -2,6 +2,7 @@
<html lang="en">
<head>
<meta charset="UTF-8">
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.4/jquery.min.js"></script>
<title>Map</title>
<link rel="stylesheet" type="text/css" href="/css/dashboard.css"/>
diff --git a/views/user.html b/views/user.html
@@ -1,7 +1,7 @@
<!DOCTYPE html>
<html lang="eng">
<title>Add User</title>
- <link rel="stylesheet" href="/css/login.css">
+ <link rel="stylesheet" href="/css/user.css">
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body>
@@ -17,15 +17,20 @@
<li><a href="/logout">Logout</a></li>
</ul>
</nav>
- <div class ="card">
- {{$form}}
- {{$response}}
- </div>
- <div class="card">
- {{$search}}
- </div>
- <div class ="form-group">
- {{$table}}
- </div>
+ <div class="container">
+ <div class="card-header"></div>
+ <div class ="card">
+ {{$form}}
+ {{$response}}
+ </div>
+ <div class="card">
+ {{$search}}
+ </div>
+ </div>
+ <div class="block1">
+ <div class="content">
+ {{$table}}
+ </div>
+ </div>
</body>
</html>
\ No newline at end of file
