Merge branch 'master' into marijn-settings
This commit is contained in:
@@ -123,6 +123,96 @@
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<div class="login_containerlogin">
|
||||
<button onclick="document.getElementById('id01').style.display='block'">Registreer</button>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<div id="id01" class="modal">
|
||||
<span onclick="document.getElementById('id01').style.display='none'"
|
||||
class="close" title="Close Modal">×</span>
|
||||
|
||||
<!-- Register Content -->
|
||||
<form class="modal-content animate" action="../profile.php" onsubmit="return passwordfunction()" method="post">
|
||||
<h2>Registreer je account</h2>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Naam</b></label>
|
||||
<input type="text" placeholder="Voer je naam in" name="name"
|
||||
pattern="[A-Za-z]{1,}" title="Moet alleen letters zijn" required>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Achternaam</b></label>
|
||||
<input type="text" placeholder="Voer je achternaam in" name="surname"
|
||||
pattern="[A-Za-z]{1,}" title="Moet alleen letters zijn" required>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Geboortedatum</b></label>
|
||||
<!-- These are the select elements we will target -->
|
||||
<select id="dobday" title="Voer een dag in" ></select>
|
||||
<select id="dobmonth" title="Voer een maand in" required></select>
|
||||
<select id="dobyear" title="Voer een jaar in" required></select>
|
||||
<!-- And here's the library being called! -->
|
||||
<script>
|
||||
$(document).ready(function() {
|
||||
$.dobPicker({
|
||||
daySelector: '#dobday',
|
||||
monthSelector: '#dobmonth',
|
||||
yearSelector: '#dobyear',
|
||||
dayDefault: 'Dag',
|
||||
monthDefault: 'Maand',
|
||||
yearDefault: 'Jaar',
|
||||
minimumAge: 12,
|
||||
maximumAge: 80
|
||||
});
|
||||
});
|
||||
</script>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Gebruikersnaam</b></label>
|
||||
<input type="text" placeholder="Voer je gebruikersnaam in" name="username"
|
||||
pattern=".{6,}" title="Moet meer dan 6 karakers zijn" required>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Wachtwoord</b></label>
|
||||
<input type="password" placeholder="Voer je wachtwoord in" name="password"
|
||||
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" id="password"
|
||||
title="Moet miniaal 1 cijfer, 1 hoofdletter en kleine letter hebben en minstens 8 of meer karakters zijn" required>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Herhaal wachtwoord</b></label>
|
||||
<input type="password" placeholder="Herhaal wachtwoord" name="confirmpassword"
|
||||
pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" id="confirmpassword"
|
||||
title="Herhaal wachtwoord" required>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Straatnaam</b></label>
|
||||
<input type="text" placeholder="Voer jouw straatnaam in" name="name"
|
||||
pattern="[A-Za-z]{1,}" title="Moet alleen letters zijn" required>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Straatnummer</b></label>
|
||||
<input type="text" placeholder="Voer jouw straatnummer in" name="name"
|
||||
pattern="[1-9][0-9]{0,}" title="Moet alleen nummers zijn" required>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<label><b>Email</b></label>
|
||||
<input type="email" placeholder="Voer je email in" id="email"
|
||||
title="Voer een geldige email in" required>
|
||||
</div>
|
||||
|
||||
<div class="login_containerregister">
|
||||
<input type="submit" value="Registreer je account" name="Submit" id="frm1_submit" />
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
@@ -132,10 +222,10 @@
|
||||
</html>
|
||||
|
||||
<script>
|
||||
// Get the modal
|
||||
var modal = document.getElementById('id01');
|
||||
// When the user clicks anywhere outside of the modal, close it
|
||||
window.onclick = function(event) {
|
||||
// Get the modal
|
||||
var modal = document.getElementById('id01');
|
||||
// When the user clicks anywhere outside of the modal, close it
|
||||
window.onclick = function(event) {
|
||||
if (event.target == modal) {
|
||||
modal.style.display = "none";
|
||||
}
|
||||
@@ -143,7 +233,7 @@ window.onclick = function(event) {
|
||||
</script>
|
||||
|
||||
<script>
|
||||
function passwordfunction() {
|
||||
function passwordfunction() {
|
||||
var password1 = document.getElementById("password").value;
|
||||
var password2 = document.getElementById("confirmpassword").value;
|
||||
var passwordmatching = true;
|
||||
@@ -155,5 +245,5 @@ function passwordfunction() {
|
||||
confirmpassword.setCustomValidity("Wachwoord match niet")
|
||||
}
|
||||
return passwordmatching;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -19,9 +19,7 @@
|
||||
|
||||
}
|
||||
.chat-recent, .chat-history {
|
||||
border-radius: 20px;
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
/* List of chats. */
|
||||
@@ -47,7 +45,7 @@
|
||||
.chat-history {
|
||||
overflow-y: auto;
|
||||
height: 100%;
|
||||
padding-bottom: 10px;
|
||||
padding: 0 0 10px 0;
|
||||
}
|
||||
|
||||
.chat-message {
|
||||
@@ -80,20 +78,35 @@
|
||||
/* Chat reply field */
|
||||
|
||||
.chat-field {
|
||||
padding: 15px;
|
||||
width: 100%;
|
||||
padding: 15px 0;
|
||||
display: table;
|
||||
}
|
||||
|
||||
.chat-field input {
|
||||
border-radius: 8px;
|
||||
.chat-field form {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.chat-field span {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.chat-field input[type="text"] {
|
||||
width: calc(100% - 80px);
|
||||
width: 100%;
|
||||
border-top-left-radius: 10px;
|
||||
border-bottom-left-radius: 10px;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
||||
}
|
||||
|
||||
.chat-field input[type="submit"] {
|
||||
width: auto;
|
||||
float: right;
|
||||
background-color: #845663;
|
||||
color: white;
|
||||
padding: 5px 10px;
|
||||
border-top-right-radius: 10px;
|
||||
border-bottom-right-radius: 10px;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
||||
}
|
||||
@@ -26,16 +26,13 @@ header {
|
||||
}
|
||||
|
||||
#header-search input[type="text"] {
|
||||
padding: 5px 10px;
|
||||
height: 19px;
|
||||
|
||||
border-top-left-radius: 3px;
|
||||
border-bottom-left-radius: 3px;
|
||||
}
|
||||
#header-search input[type="submit"] {
|
||||
margin: 0 0 0 -4px;
|
||||
padding: 5px;
|
||||
|
||||
#header-search input[type="submit"] {
|
||||
background: none;
|
||||
color: white;
|
||||
border-top-right-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
}
|
||||
|
||||
@@ -43,6 +43,7 @@ body {
|
||||
|
||||
.platform {
|
||||
padding: 20px;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 10px;
|
||||
background-color: #FFFFFF;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
||||
@@ -65,11 +66,6 @@ body {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
|
||||
input[type="text"] {
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
/* Move element down (clear), below floating elements */
|
||||
.clear {
|
||||
clear: both;
|
||||
@@ -106,6 +102,10 @@ h5 {
|
||||
font-size: 1.4em;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
@@ -115,6 +115,21 @@ a, a:link, a:visited, a:hover, a:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
button, input, select {
|
||||
width: auto;
|
||||
height: 32px;
|
||||
padding: 0 5px;
|
||||
|
||||
background: white;
|
||||
color: #3333333;
|
||||
|
||||
cursor: pointer;
|
||||
border: none;
|
||||
|
||||
font-family: Arial;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
/* Tables */
|
||||
table {
|
||||
border-spacing: 0;
|
||||
|
||||
3
website/styles/search.css
Normal file
3
website/styles/search.css
Normal file
@@ -0,0 +1,3 @@
|
||||
.search-form input {
|
||||
border-bottom: #845663 solid 1px;
|
||||
}
|
||||
@@ -1,7 +1,7 @@
|
||||
<div class="content">
|
||||
<div class="chat">
|
||||
<div class="chat-left">
|
||||
<nav class="chat-recent">
|
||||
<nav class="chat-recent platform">
|
||||
<h5>Chats</h5>
|
||||
<a href="#"><div class="chat-conversation">
|
||||
<img class="profile-picture" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTDnuRSeeyPve7KwDvJJ6OBzj3gyghwLcE2z9kZeYBOyZavh3mw">
|
||||
@@ -15,7 +15,7 @@
|
||||
</div>
|
||||
|
||||
<div class="chat-right">
|
||||
<div class="chat-history">
|
||||
<div class="chat-history platform">
|
||||
<div class="chat-message">
|
||||
<div class="chat-message-self">Hi!</div>
|
||||
</div>
|
||||
@@ -43,14 +43,16 @@
|
||||
</div>
|
||||
<div class="chat-field">
|
||||
<form method="post">
|
||||
<input type="submit"
|
||||
value="Verstuur"
|
||||
>
|
||||
<span>
|
||||
<input type="text"
|
||||
name="message"
|
||||
placeholder="Reageer..."
|
||||
required
|
||||
>
|
||||
<input type="submit"
|
||||
value="Verstuur"
|
||||
>
|
||||
</span>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -13,6 +13,7 @@
|
||||
@import url("styles/header.css");
|
||||
@import url("styles/menu.css");
|
||||
@import url("styles/footer.css");
|
||||
@import url("styles/search.css");
|
||||
@import url("styles/adminpanel.css");
|
||||
@import url("styles/chat.css");
|
||||
@import url("styles/settings.css");
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
</div>
|
||||
<div id="header-search">
|
||||
<form action="search.php" method="get">
|
||||
<input name="search" type="text" placeholder="search people, friends and pages" />
|
||||
<input name="search" type="text" placeholder="zoek naar van alles" />
|
||||
<input type="submit" value="Zoek"/>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user