<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>
Onionr
</title>
<link rel='shortcut icon' type='image/ico' href='/shared/images/favicon.ico'>
<link rel='stylesheet' href='/shared/style/modal.css'>
<link rel='stylesheet' href='/shared/main/style.css'>
<link rel='stylesheet' href='/friends/style.css'>
</head>
<body>
<div id="friendInfo" class='overlay'>
<div class='overlayContent'>
<span class='closeOverlay' overlay='friendInfo'></span>
<div>Name: <span id='friendName'></span></div>
<label>Public Key: <input id='friendPubkey' type='text' readonly></label>
<button id='defriend' class='warnBtn'>Unfriend</button>
</div>
</div>
<div class='content'>
<img class='logo' src='/shared/images/onionr-icon.png' alt='onionr logo'>
<span class='logoText'>Onionr Friends</span>
<br><br>
<a href='/' class='idLink'>Home</a>
<h2>Friend Manager</h2>
<form id='addFriend' action='/' method='POST'>
<label>Friend ID: <input type='text' name='addKey' placeholder='public key/ID' minlength="56" maxlength="56" required></label>
<label>Set Alias: <input type='text' name='data' placeholder='what to call them'></label>
<input type='submit' value='Add Friend' class='successBtn'>
</form>
<h2>Friend List:</h2>
Click name to view info<br><br>
<div id='friendList'>
</div>
</div>
<script src='/shared/misc.js'></script>
<script src='/friends/friends.js'></script>
</body>
</html>