diff --git a/static/styles.css b/static/styles.css index 1020b99..9943a19 100644 --- a/static/styles.css +++ b/static/styles.css @@ -44,7 +44,7 @@ body { min-height: 100vh; margin: 0; padding: 1.6rem 0 0; - line-height: 1.6rem; + line-height: 1.4rem; font-family: sans-serif; color: var(--grey-900); } @@ -109,11 +109,6 @@ footer { } .container { - width: 100%; - max-width: 1440px; - margin: 0 auto; -} -.narrow { width: 100%; max-width: 720px; margin: 0 auto; @@ -127,7 +122,7 @@ section.profile p, .demo p { .card { margin: 0 0 1.6rem; - padding: 0 1.6rem; + padding: 0 1.2rem; background-color: #fff; background-color: var(--purple-50); border: 2px solid var(--purple-200); @@ -152,7 +147,6 @@ section.profile p, .demo p { .card--small-profile { display: flex; flex-direction: column; - padding-top: 1rem; text-align: center; } .card--small-profile-dummy { @@ -164,10 +158,14 @@ section.profile p, .demo p { } .card--small-profile p { margin-top: 0; +} +.card--small-profile p span.fingerprint { + display: inline-block; + width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; - + font-size: 0.8rem; } #profileName { font-size: 1.6rem; @@ -180,13 +178,10 @@ section.profile p, .demo p { .hcards { display: grid; - grid-gap: 1.6rem; - grid-template-columns: repeat(auto-fit, minmax(256px, 1fr)); + grid-gap: 1.2rem; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); margin-bottom: 1.6rem; } -.hcards--features { - text-align: center; -} .hcards .card { margin: 0; } diff --git a/views/index.pug b/views/index.pug index 1ea41c7..6878992 100644 --- a/views/index.pug +++ b/views/index.pug @@ -7,7 +7,7 @@ block js script(type='application/javascript' defer src='/static/scripts.js' charset='utf-8') block content - .demo.narrow + .demo kx-claim.kx-item(data-claim= demoData data-skip="true") details summary @@ -32,22 +32,21 @@ block content else p Proof link: not accessible from browser - .narrow - #search.form-wrapper.card - h2#searchTitle Generate a profile - form(action="post") - label#searchQuery(for="query") Query for fingerprint or email identifier - input#query(type="search" name="query" required placeholder="3637202523e7c1309ab79e99ef2dc5827b445f4b, test@doip.rocks" aria-labelledby="searchTitle searchQuery") + #search.form-wrapper.card + h2#searchTitle Generate a profile + form(action="post") + label#searchQuery(for="query") Query for fingerprint or email identifier + input#query(type="search" name="query" required placeholder="3637202523e7c1309ab79e99ef2dc5827b445f4b, test@doip.rocks" aria-labelledby="searchTitle searchQuery") - fieldset(role="radiogroup").radio-wrapper - legend Protocol - input#protocol-hkp(type="radio" name="protocol" value="hkp" checked="true") - label(for="protocol-hkp") HKP - input#protocol-wkd(type="radio" name="protocol" value="wkd") - label(for="protocol-wkd") WKD - input#protocol-sig(type="radio" name="protocol" value="sig") - label(for="protocol-sig") Signature - input(type="submit" value="Generate profile") + fieldset(role="radiogroup").radio-wrapper + legend Protocol + input#protocol-hkp(type="radio" name="protocol" value="hkp" checked="true") + label(for="protocol-hkp") HKP + input#protocol-wkd(type="radio" name="protocol" value="wkd") + label(for="protocol-wkd") WKD + input#protocol-sig(type="radio" name="protocol" value="sig") + label(for="protocol-sig") Signature + input(type="submit" value="Generate profile") if highlights.length > 0 h2 Highlights @@ -68,44 +67,57 @@ block content - n++ h2 About Keyoxide - .hcards.hcards--features.hcards--max-3 + .hcards.hcards--features .card h3 Online identity - p Establish an identity by verifiably linking your online accounts. - a(href='/about#basic') Read more + p Establish an identity by verifiably linking your online accounts. .card h3 Decentralized - p No central server or database. Control how your data is stored and accessed. - a(href='/about#decentralized') Read more + p No central server or database. Control how your data is stored and accessed. .card h3 Privacy - p No data is collected. Your data is yours and yours only. - a(href='/privacy') Read more + p No data is collected. Your data is yours and yours only. .card h3 Cryptography - p Your online identity verifiably signed with widely-used OpenPGP. - a(href='/about#cryptography') Read more + p Your online identity verifiably signed with widely-used OpenPGP. .card h3 Open Source - p All Keyoxide projects are licensed under AGPL-3.0-or-later. - a(href='/about#open-source') Read more + p All Keyoxide projects are licensed under AGPL-3.0-or-later. .card h3 Transparent funding - p Funded by donations. Keyoxide stands against VC and surveillance capitalism. - a(href='/about#funding-and-the-flow-of-money') Read more + p Funded by donations. Keyoxide stands against VC and surveillance capitalism. + + h2 Community + .card + p + | Discussion of the Keyoxide project happens primarily on the + a(href="https://matrix.to/#/#keyoxide:matrix.org") #keyoxide matrix channel + | . There is also the + a(href="https://lists.sr.ht/~yarmo/keyoxide-devel") keyoxide-devel mailing list + | . + p + | Bug reports and feature requests can be submitted on the + a(href="https://codeberg.org/keyoxide/keyoxide-web/issues") source code issue tracker + | or the + a(href="https://lists.sr.ht/~yarmo/keyoxide-devel") keyoxide-devel mailing list + | . + p + | The project is also present on the fediverse as + a(href="https://fosstodon.org/@keyoxide") @keyoxide@fosstodon.org + | . + h2 Fund the project - .narrow - .card - p - | The development of Keyoxide and the Decentralized OpenPGP Identity Proofs ecosystem is entirely funded by donations. - p - | The Keyoxide project was awarded a NGI Zero grant from the - a(href='https://nlnet.nl/') NLnet Foundation - | . - p - | We rely on your support to keep working on secure online identity and fight Big Tech's grasp on the internet. - p - a.button.button--liberapay(href='https://liberapay.com/Keyoxide/') - i(class='fa fa-liberapay' aria-hidden='true') - | Donate via Liberapay + .card + p + | The development of Keyoxide and the Decentralized OpenPGP Identity Proofs ecosystem is entirely funded by donations. + p + | The Keyoxide project was awarded a NGI Zero grant from the + a(href='https://nlnet.nl/') NLnet Foundation + | . + p + | We rely on your support to keep working on Big Tech-independent secure online identity. + p + a.button.button--liberapay(href='https://liberapay.com/Keyoxide/') + i(class='fa fa-liberapay' aria-hidden='true') + | Donate via Liberapay \ No newline at end of file diff --git a/views/partials/footer.pug b/views/partials/footer.pug index 78db8ec..a965ab7 100644 --- a/views/partials/footer.pug +++ b/views/partials/footer.pug @@ -11,20 +11,18 @@ footer h1 Keyoxide project a(href="https://keyoxide.org") Keyoxide.org br - a(href="https://blog.keyoxide.org") Keyoxide blog - br a(href="https://docs.keyoxide.org") Keyoxide docs br - a(href="https://fosstodon.org/@keyoxide") Keyoxide on Fediverse + a(href="https://blog.keyoxide.org") Keyoxide blog br - a(href="https://keytoidentity.foundation") Key to Identity Foundation + a(href="https://keytoidentity.foundation") KeyToIdentity Foundation div h1 Development a(href="https://codeberg.org/keyoxide/") Source code br - a(href="https://drone.keyoxide.org/keyoxide/web") CI/CD + a(href="https://doip.rocks") doip.rocks br - a(href="https://js.doip.rocks") doip.js + a(href="https://ariadne.id") ariadne.id - p.copyright © 2021 Keyoxide project contributors + p.copyright © 2021 Keyoxide project contributors \ No newline at end of file