Add favicon. Significantly modify layout and presentation of site by including flexbox for main content. Remove logo from index. Code whitespace updates on Sharing-SQLite

This commit is contained in:
James Eversole 2022-08-05 19:43:39 -05:00
parent 910859bce6
commit 1be99a44ff
6 changed files with 135 additions and 99 deletions

View File

@ -64,8 +64,7 @@ deleteExpiredSecret :: [SecretEntry] -> String -> IO Bool
deleteExpiredSecret [] _ = return False deleteExpiredSecret [] _ = return False
deleteExpiredSecret (sec : _) db = do deleteExpiredSecret (sec : _) db = do
time <- liftIO $ epochTime time <- liftIO $ epochTime
if ((date sec) + ((life sec) * 86400) < time) || if ((date sec) + ((life sec) * 86400) < time) || (views sec >= maxViews sec)
(views sec >= maxViews sec)
then deleteSec sec db then deleteSec sec db
else return False else return False
where where

View File

@ -9,6 +9,7 @@ html
color: #{colorOne} color: #{colorOne}
body body
margin: 3% 10% 0 10%
font-size: 20px font-size: 20px
text-align: left text-align: left
@ -16,12 +17,27 @@ h2
font-family: monaco, Consolas, monospace font-family: monaco, Consolas, monospace
text-transform: uppercase text-transform: uppercase
h3
margin: 0.25em 0 0.25em 0
p p
margin: 0.4em 0 0.4em 0 margin: 0.4em 0 0.4em 0
a a
color: #{colorThree} color: #{colorThree}
.title
margin: 0 auto 0 auto
font-size: 2em
color: #{colorThree}
.titleLink
all: unset
cursor: pointer
.title h1
margin: 0.1em 0 0.1em 0
.htmx-indicator .htmx-indicator
display: none display: none
@ -36,7 +52,10 @@ a
text-align: center text-align: center
.content .content
margin: 0 15% 0 15% display: flex
.column
flex: 50%
.emptyReq .emptyReq
height: 1% height: 1%
@ -49,10 +68,19 @@ a
border-style: none border-style: none
text-decoration: none text-decoration: none
.genButton
width: 40%
margin: 0 0 0.25em 0
padding: 0.75em 1.75em
background-color: #{colorThree}
color: #{colorTwo}
border-style: none
text-decoration: none
.mainInput .mainInput
font-weight: 400 font-weight: 400
font-size: 1em font-size: 1em
width: 50% max-width: 50%
outline: none outline: none
color: #{colorOne} color: #{colorOne}
background: #{colorTwo} background: #{colorTwo}
@ -102,38 +130,46 @@ a
color: #{colorThree} color: #{colorThree}
opacity: 0.5 opacity: 0.5
.pwResult .genResult
font-size: 1.5em
color: #{colorFour} color: #{colorFour}
.pwUtils .pwResult
width: 75% margin: 0 0 1em 0
font-size: 1.5em
.generators color: #{colorFour}
margin: 5% 0 0 0
.shareNew .shareNew
margin-bottom: 2em margin-bottom: 2em
.title .requestNew
font-size: 2em margin-top: 1em
color: #{colorOne}
text-decoration: none
.titleLink .requestedPw
all: unset max-width: 85%
cursor: pointer
.title h1 .resLink
margin: 0.1em 0 0.3em 0 font-size: 0.75em
.validForm
margin: 0.5em 0 0 0
@media only screen and (max-width : 768px) @media only screen and (max-width : 768px)
body body
text-align: center text-align: center
font-size: 16px font-size: 16px
.content
display: block
.mainButton
width: 80%
.genButton
width: 80%
.mainInput .mainInput
width: 95% width: 95%
max-width: 100%
text-align: center text-align: center
.numberInput .numberInput
@ -146,5 +182,8 @@ a
.title h1 .title h1
margin-bottom: 0 margin-bottom: 0
.pwUtils .requestedPw
max-width: 100%
.shareUtils
width: 100% width: 100%

View File

@ -1,29 +1,27 @@
<div #generators .generators> <div #generators .column>
<h2>Generators <h2>Generators
<p>Generated password: <h3 .genResult>#{genPw}
<h3>#{genPw} <button .genButton
<button .mainButton
hx-get="/gen" hx-get="/gen"
hx-target="#generators" hx-target="#generators"
hx-swap="outerHTML" hx-swap="outerHTML"
/> />
Generate New Password Generate New
<br /> <br />
<button .mainButton <button .genButton
hx-post="/new" hx-post="/new"
hx-target="#requestedPw" hx-target="#requestedPw"
hx-swap="outerHTML" hx-swap="outerHTML"
hx-include="[id='generators']" hx-include="[id='generators']"
*{hsGeneratedSharing} *{hsGeneratedSharing}
/> />
Share Generated Password Share Password
<img class="htmx-indicator" src="/loading.svg" /> <img class="htmx-indicator" src="/loading.svg" />
<br /> <div .validForm>
Valid for: Valid for:
<br /> <br />
<input .numberInput <input .numberInput
name="newSecDuration" name="newSecDuration"
type="number" type="number"

View File

@ -9,15 +9,13 @@ $doctype 5
<body> <body>
<div #logo .logo>
<img src="/purrlogo.png">
<div #content .content>
<div #title .title> <div #title .title>
<h1> <h1>
<a #titleLink .titleLink href="/">Purr <a #titleLink .titleLink href="/">Purr
<div #pwUtils .pwUtils> <div #content .content>
<div #shareUtils .column>
<h2>Sharing Tools <h2>Sharing Tools
$if (link == "/") $if (link == "/")
<div #requestedPw .requestedPw> <div #requestedPw .requestedPw>
@ -33,13 +31,14 @@ $doctype 5
Loading... <img class="htmx-indicator" src="/loading.svg" /> Loading... <img class="htmx-indicator" src="/loading.svg" />
<div #shareNew .shareNew> <div #shareNew .shareNew>
<h3>Share New Secret
<p> <p>
<input .mainInput <input .mainInput
name="newSec" name="newSec"
type="text" type="text"
placeholder="Enter a Secret to Share" placeholder="Enter a Secret to Share"
/> />
<br /> <div .validForm>
Valid for: Valid for:
<br /> <br />
<input .numberInput <input .numberInput
@ -68,6 +67,7 @@ $doctype 5
<img class="htmx-indicator" src="/loading.svg" /> <img class="htmx-indicator" src="/loading.svg" />
<div #requestNew .requestNew> <div #requestNew .requestNew>
<h3>Lookup
<p> <p>
<input .mainInput <input .mainInput
name="userLink" name="userLink"
@ -83,11 +83,11 @@ $doctype 5
Get Secret Get Secret
<img class="htmx-indicator" src="/loading.svg" /> <img class="htmx-indicator" src="/loading.svg" />
<div #generators .generators> <div #generators .column>
<h2>Generators <h2>Generators
<button .mainButton <button .mainButton
hx-get="/gen" hx-get="/gen"
hx-target="#generators" hx-target="#generators"
hx-swap="outerHTML" hx-swap="outerHTML"
/> />
Generate Password Load Generators

BIN
views/public/favicon.ico Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.2 KiB

View File

@ -1,7 +1,7 @@
<div #requestedPw .requestedPw> <div #requestedPw .requestedPw>
$maybe pw <- password $maybe pw <- password
<p>Here's the secret found at <a href="/pw/#{link}">/pw/#{link}</a>: <p .resLink>Here's the secret found at <a href="/pw/#{link}">/pw/#{link}</a>:
<h3 .pwResult>#{pw} <h3 .pwResult>#{pw}
<hr /> <hr />
$nothing $nothing
<h3>No secret found at <a href="/pw/#{link}">/pw/#{link}</a> <h3 .pwResult>No secret found at <a href="/pw/#{link}">/pw/#{link}</a>