added export layout

This commit is contained in:
Krehan Tim 2018-10-29 08:45:49 +01:00
parent acb0f6c01c
commit 00eeaa4dd4
3 changed files with 37 additions and 9 deletions

View file

@ -1,6 +1,5 @@
<link rel="stylesheet" href="/style/settings.css"> <link rel="stylesheet" href="/style/settings.css">
<h1>Settings</h1> <h1>Settings</h1>
<h2>User</h2>
<?php <?php
include $_SESSION["docroot"].'/php/connect.php'; include $_SESSION["docroot"].'/php/connect.php';
$token = $_COOKIE["token"]; $token = $_COOKIE["token"];
@ -9,7 +8,8 @@
$user = $result->fetch_assoc(); $user = $result->fetch_assoc();
?> ?>
<div class="settings"> <div class="settings">
<div class="userprofile-pane"> <h2>User</h2>
<div class="userprofile-pane pane">
<div class="userprofile"> <div class="userprofile">
<span><font class="attribute">Benutzername</font><input class="change-attribute-input" type="text" name="username" value="<?php echo $user["username"]; ?>"></span> <span><font class="attribute">Benutzername</font><input class="change-attribute-input" type="text" name="username" value="<?php echo $user["username"]; ?>"></span>
<span><font class="attribute">Email</font><input class="change-attribute-input" type="text" name="username" value="<?php echo $user["email"]; ?>"></span> <span><font class="attribute">Email</font><input class="change-attribute-input" type="text" name="username" value="<?php echo $user["email"]; ?>"></span>
@ -17,4 +17,9 @@
</div> </div>
<button class="button" id="saveButton">Speichern</button> <button class="button" id="saveButton">Speichern</button>
</div> </div>
<div class="import-export-pane">
<h2>Import / Export</h2>
<p>Hiermit werden alle Rezepte und sich zurzeit auf der Shoppingliste befindlichen Einträge als Download zur Verfügung gestellt. Diese Datei kann dann an anderer Stelle wieder Importiert werden, oder als Backup abgespeichert werden.</p>
<button type="button" name="button" class="button">Export</button>
</div>
</div> </div>

View file

@ -26,6 +26,15 @@ h2 {
width: 80%; width: 80%;
} }
h3 {
font-size: 1.5em;
text-align: left;
margin-top: .5em;
padding-bottom: .5em;
border-bottom: 1px solid grey;
width: 75%;
}
.even { .even {
background-color: #565656; background-color: #565656;
} }

View file

@ -1,12 +1,26 @@
.userprofile { .settings {
width: 30em;
max-width: 90%;
margin: 0 auto;
display: flex; display: flex;
justify-content: flex-start;
flex-direction: column; flex-direction: column;
flex-wrap: wrap;
}
.pane {
border: 1px solid grey; border: 1px solid grey;
border-radius: 5px; border-radius: 5px;
background-color: #ddd; background-color: #ddd;
margin: 1em;
min-width: max-content;
max-width: 50%;
}
.userprofile-pane {
display: flex;
flex-direction: column;
justify-content: flex-start;
}
.userprofile {
width: 22em;
display: flex;
flex-direction: column;
} }
.userprofile span { .userprofile span {
display: flex; display: flex;
@ -18,13 +32,13 @@
padding: 1em; padding: 1em;
} }
.change-attribute-input { .change-attribute-input {
text-indent: 1em;
color: grey;
} }
.value { .value {
padding: 1em; padding: 1em;
} }
#saveButton { #saveButton {
align-self: flex-end;
margin: 1em; margin: 1em;
width: min-content;
float: right;
} }