fixed mail UI for redesign

This commit is contained in:
Kevin Froman 2019-07-09 22:17:56 -05:00
parent b822a74c53
commit 52c7ba860d
3 changed files with 85 additions and 55 deletions

View File

@ -11,6 +11,7 @@
<link rel='shortcut icon' type='image/ico' href='/shared/images/favicon.ico'>
<link rel='stylesheet' href='/shared/main/bulma.min.css'>
<link rel="stylesheet" href="/shared/main/styles-new.css">
<link rel="stylesheet" href="/shared/mail.css">
</head>
<body>
@ -50,7 +51,7 @@
Mail
</h1>
<h2 class="subtitle">
Send email style messages to persons
Send email style messages
</h2>
</div>
<div class="column is-7">
@ -81,46 +82,12 @@
</section>
<br>
<!--Start of content-->
<div class="container">
<div class="tabs" id="tabBtns">
<ul>
<li class="is-active">
<a>
<span>Inbox</span>
</a>
</li>
<li>
<a>
<span>Sent</span>
</a>
</li>
<li>
<a>
<span>Compose</span>
</a>
</li>
</ul>
</div>
</div>
<div id="infoOverlay" class='overlay'>
</div>
<div class='content'>
<div class='mailPing'>
API server either shutdown, has disabled mail, or has experienced a bug.
</div>
<div id='threads' class='threads'>
<div id='threadPlaceholder'>Nothing here yet 😞</div>
</div>
<div id='messageDisplay' class='overlay'>
<div class='overlayContent'>
<span class='closeOverlay' overlay='messageDisplay'></span>
<div>
From: <input type='text' id='fromUser' readonly> Signature: <span id='sigValid'></span> <span
id='addUnknownContact'><button>Add to Contacts</button></span>
id='addUnknownContact'><button class='button is-primary'>Add to Contacts</button></span>
</div>
<div class='break-up'>
Subject: <span id='subjectView'></span>
@ -154,6 +121,38 @@
</form>
</div>
</div>
<!--Start of content-->
<div class="container">
<div class="tabs" id="tabBtns">
<ul>
<li class="is-active">
<a>
<span>Inbox</span>
</a>
</li>
<li>
<a>
<span>Sent</span>
</a>
</li>
<li>
<a>
<span>Compose</span>
</a>
</li>
</ul>
</div>
<div class='content'>
<div class='mailPing'>
API server either shutdown, has disabled mail, or has experienced a bug.
</div>
<div id='threads' class='threads'>
<div id='threadPlaceholder'>Nothing here yet 😞</div>
</div>
</div>
</div>
<div id="infoOverlay" class='overlay'>
</div>
<script src='/shared/misc.js'></script>
<script src='/mail/mail.js'></script>

View File

@ -182,7 +182,7 @@ function loadInboxEntries(bHash){
}
entry.setAttribute('data-nameSet', true)
if (senderInput.value == ''){
senderInput.value = resp['meta']['signer']
senderInput.value = resp['meta']['signer'] || 'Anonymous'
entry.setAttribute('data-nameSet', false)
}
bHashDisplay.innerText = bHash.substring(0, 10)
@ -190,8 +190,7 @@ function loadInboxEntries(bHash){
entry.setAttribute('data-pubkey', resp['meta']['signer'])
senderInput.readOnly = true
dateStr.innerText = humanDate.substring(0, humanDate.indexOf('('))
deleteBtn.innerText = 'X'
deleteBtn.classList.add('dangerBtn', 'deleteBtn')
deleteBtn.classList.add('delete', 'deleteBtn')
if (metadata['subject'] === undefined || metadata['subject'] === null) {
subjectLine.innerText = '()'
}
@ -268,8 +267,7 @@ function getSentbox(){
var preview = document.createElement('span')
var deleteBtn = document.createElement('button')
var message = resp[i]['message']
deleteBtn.classList.add('deleteBtn', 'dangerBtn')
deleteBtn.innerText = 'X'
deleteBtn.classList.add('deleteBtn', 'delete')
toEl.readOnly = true
sentDate.innerText = humanDate.substring(0, humanDate.indexOf('('))
if (resp[i]['name'] == null || resp[i]['name'].toLowerCase() == 'anonymous'){
@ -279,6 +277,7 @@ function getSentbox(){
toEl.value = resp[i]['name']
}
preview.innerText = '(' + resp[i]['subject'] + ')'
entry.classList.add('sentboxList')
entry.setAttribute('data-hash', resp[i]['hash'])
entry.appendChild(deleteBtn)
entry.appendChild(toLabel)

View File

@ -0,0 +1,32 @@
.threadEntry{
margin-bottom: 2%;
}
.threadEntry button{
margin-right: 1%;
}
.threadEntry span, .sentboxList span{
padding-left: 1%;
}
.overlayContent{
background-color: lightgray;
border: 3px solid black;
border-radius: 3px;
color: black;
font-family: Verdana, Geneva, Tahoma, sans-serif;
min-height: 100%;
padding: 1em;
margin: 1em;
}
#draftText{
margin-top: 1em;
margin-bottom: 1em;
display: block;
width: 50%;
height: 75%;
min-width: 2%;
min-height: 5%;
background: white;
color: black;
}