Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[WIP] Update /id page #230

Draft
wants to merge 10 commits into
base: master
Choose a base branch
from
Draft

[WIP] Update /id page #230

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
8b54d57
update ID page (WIP)
cdeleeuwe Jan 31, 2021
51c095f
Add download berty block (WIP)
cdeleeuwe Jan 31, 2021
1c58499
change QR library and styling
cdeleeuwe Jan 31, 2021
4fce7d1
change subtitle & layout
cdeleeuwe Feb 1, 2021
13b24ca
change block order on mobile
cdeleeuwe Feb 1, 2021
7028805
move inline CSS to external .css file
cdeleeuwe Feb 1, 2021
2ed454c
Remove display_section_id shortcode
cdeleeuwe Feb 1, 2021
0b148fc
remove trailing whitespace
cdeleeuwe Feb 1, 2021
0609deb
make error block full height
cdeleeuwe Feb 1, 2021
57ab9be
disablble download button
cdeleeuwe Feb 1, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 47 additions & 0 deletions bertytech/assets/css/style.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -493,6 +493,18 @@ a.btn.btn-black {
background-color:$color-black;
}
}
&.btn-disabled {
filter: grayscale(1);
background-color: #efefef;
color: #b9b9b9;
cursor: default;
&:hover,
&:focus {
background-color: #efefef;
color: #b9b9b9;
pointer-events: none;
}
}
&:hover {
.hover-show {
display: inherit;
Expand All @@ -508,6 +520,7 @@ a.btn.btn-black {
display: inherit;
}
}

.btn-transparent{
color:#FFF;
background-color:transparent;
Expand Down Expand Up @@ -3822,3 +3835,37 @@ $table-first-column-width-mobile: 115px;
}
}
}

/* ID page */
.id-page {
.counter-badge {
width: 30px;
height: 30px;
background: red;
border-radius: 100%;
font-size: 19px;
font-weight: 900;
color: #fff;
padding-top: 3px;
position: relative;
left: 7px;
top: -15px;
}

.download-berty-block .berty-logo {
max-width: 200px;
}

.what-is-berty-block .icon {
height: 60px;
width: 80px;
margin: auto;
font-size: 35px;
margin-bottom: 15px;
}

.block-id-qrcode canvas {
max-width: 100%;
}
}

13 changes: 7 additions & 6 deletions bertytech/assets/js/main.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -68,14 +68,15 @@ $(function() {
//Check if there is QRCode to display on page
if ($('#id-qrcode').length) {
if (window.location.hash.length > 1) {
var qrcode = new QRCode("id-qrcode", {
text: "https://berty.tech/id#" + window.location.hash.substr(1),
const qrcode = new QRCodeStyling({
width: 290,
height: 290,
colorDark : "#000000",
colorLight : "#ffffff",
correctLevel : QRCode.CorrectLevel.L
});
data: "https://berty.tech/id#" + window.location.hash.substr(1),
qrOptions: { errorCorrectionLevel: "L" },
dotsOptions: { type: "dots", color: "#3f49ea" },
backgroundOptions: { color: "#ffffff" },
})
qrcode.append(document.getElementById("id-qrcode"));
$('#id-block-loader').remove();
$('#id-block-id').removeClass('display-none');

Expand Down
3 changes: 2 additions & 1 deletion bertytech/assets/js/qrcode.min.js
View file
Open in desktop

Large diffs are not rendered by default.

25 changes: 22 additions & 3 deletions bertytech/content/id.ar.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.cn.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.eo.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.es.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.fr.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Ouvrez l''application Berty sur votre téléphone et scannez ce code pour faire une demande de contact à <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.hi.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.id-id.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.pt.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
25 changes: 22 additions & 3 deletions bertytech/content/id.ru.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,25 @@
---
title:
subtitle: 'Open the Berty app on your phone and scan this code to make a contact request to <span class="c-name"></span>'
subtitle: You have received a Berty Request!
layout: id
what_is_berty:
title: What's Berty?
items:
- icon: /img/icon_private.svg
title: Private
body: 100% anonymous account no email - no phone number
- icon: fal fa-lock-alt
title: Secure
body: end-to-end encryption perfect forward secrecy
- icon: /img/icon_distributed.svg
title: Distributed
body: ...and decentralized peer-to-peer network
- icon: fab fa-github
title: Open source
body: read it, fork it, improve it join us on <a href="https://crpt.fyi/berty-discord" target="_blank" rel="noopener" aria-label="Discord">Discord</a>
button_text: More about Berty
download_berty:
title: Don't have Berty yet?
body: Berty is a privacy-first messaging app that works with or without internet access cellular data or trust in the network
button_text: Download Berty
---

{{< display_section_id >}}
Loading