diff --git a/customize.dist/images/bkcontact.jpg b/customize.dist/images/bkcontact.jpg
new file mode 100644
index 000000000..dde71bae0
Binary files /dev/null and b/customize.dist/images/bkcontact.jpg differ
diff --git a/customize.dist/images/email.svg b/customize.dist/images/email.svg
new file mode 100644
index 000000000..e2e566e6e
--- /dev/null
+++ b/customize.dist/images/email.svg
@@ -0,0 +1,25 @@
+
+
+
diff --git a/customize.dist/images/github.svg b/customize.dist/images/github.svg
new file mode 100644
index 000000000..16cd68786
--- /dev/null
+++ b/customize.dist/images/github.svg
@@ -0,0 +1,22 @@
+
+
+
diff --git a/customize.dist/images/irc.svg b/customize.dist/images/irc.svg
new file mode 100644
index 000000000..58a9e707d
--- /dev/null
+++ b/customize.dist/images/irc.svg
@@ -0,0 +1,30 @@
+
+
+
diff --git a/customize.dist/images/issue.svg b/customize.dist/images/issue.svg
new file mode 100644
index 000000000..27d5276c7
--- /dev/null
+++ b/customize.dist/images/issue.svg
@@ -0,0 +1,19 @@
+
+
+
diff --git a/customize.dist/images/sayhi.svg b/customize.dist/images/sayhi.svg
new file mode 100644
index 000000000..22c7463cb
--- /dev/null
+++ b/customize.dist/images/sayhi.svg
@@ -0,0 +1,17 @@
+
+
+
diff --git a/customize.dist/images/twitter.svg b/customize.dist/images/twitter.svg
new file mode 100644
index 000000000..bed259b76
--- /dev/null
+++ b/customize.dist/images/twitter.svg
@@ -0,0 +1,17 @@
+
+
+
diff --git a/customize.dist/pages.js b/customize.dist/pages.js
index 0261c839f..605d9501f 100644
--- a/customize.dist/pages.js
+++ b/customize.dist/pages.js
@@ -280,9 +280,53 @@ define([
Pages['/contact.html'] = function () {
return h('div#cp-main', [
infopageTopbar(),
+ h('div.container-fluid.cp-contdet',
+ h('row.col-12.col-sm-12',
+ h('h1.text-center', Msg.contact )
+ ),
+ ),
h('div.container.cp-container', [
- h('center', h('h1', Msg.contact)),
- setHTML(h('p'), Msg.main_about_p2)
+ setHTML(h('p'), Msg.main_about_p2),
+ h('div.row.cp-iconCont',
+ h('div.col-4.col-sm-2',
+ setHTML(h('p'), Msg.main_about_p21),
+ ),
+ h('div.col-4.col-sm-2',
+ h('a.card', {href : "#"},
+ h('div.card-body',
+ setHTML(h('p'), Msg.main_about_p22),
+ )
+ )
+ ),
+ h('div.col-4.col-sm-2',
+ h('a.card',
+ h('div.card-body',
+ setHTML(h('p'), Msg.main_about_p21),
+ )
+ )
+ ),
+ h('div.col-4.col-sm-2',
+ h('a.card',
+ h('div.card-body',
+ setHTML(h('p'), Msg.main_about_p21),
+ )
+ )
+ ),
+ h('div.col-4.col-sm-2',
+ h('div.card',
+ h('div.card-body',
+ setHTML(h('p'), Msg.main_about_p21),
+ )
+ )
+ ),
+ h('div.col-4.col-sm-2',
+ h('div.card',
+ h('div.card-body',
+ setHTML(h('p'), Msg.main_about_p21),
+ )
+ )
+ ),
+ )
]),
infopageFooter(),
]);
diff --git a/customize.dist/src/less2/pages/page-contact.less b/customize.dist/src/less2/pages/page-contact.less
index 56a60022c..3ece76eca 100644
--- a/customize.dist/src/less2/pages/page-contact.less
+++ b/customize.dist/src/less2/pages/page-contact.less
@@ -7,3 +7,51 @@
.fa {
padding-right: 0.25em;
}
+#cp-main {
+ background-color: #fff;
+}
+.cp-container {
+ background: #fff;
+ .cp-iconCont{
+ div {
+ .card {
+ padding: 3.5em 1em 1em 1em;
+ box-shadow: 0 5px 15px rgba(69,145,196, 0.3);
+ border-color: #fff;
+ text-align: center;
+ &:hover, &:focus {
+ text-decoration: none;
+ box-shadow: 0 2px 4px rgba(69, 145, 196, 0.6);
+ }
+ }
+ &:nth-child(2) {
+ .card {
+ background-image: url(/customize/images/twitter.svg);
+ background-repeat: no-repeat;
+ background-position: 50% 10%;
+ background-size: 3rem;
+ }
+ }
+ &:nth-child(3) {
+ .card {
+ background-image: url(/customize/images/issue.svg);
+ background-repeat: no-repeat;
+ background-position: 50% 10%;
+ background-size: 3rem;
+ }
+ }
+ }
+ }
+}
+.cp-contdet {
+ padding-top: 3em;
+ padding-bottom: 3em;
+ background-image: url(/customize/images/bkcontact.jpg);
+ background-size: cover;
+ background-repeat: no-repeat;
+ background-position: center;
+ h1 {
+ font-weight: 700;
+ color: #fff;
+ }
+}
diff --git a/customize.dist/translations/messages.js b/customize.dist/translations/messages.js
index 661254f5d..83dbc54ea 100644
--- a/customize.dist/translations/messages.js
+++ b/customize.dist/translations/messages.js
@@ -515,7 +515,9 @@ define(function () {
out.main_howitworks_p1 = 'CryptPad uses a variant of the Operational transformation algorithm which is able to find distributed consensus using a Nakamoto Blockchain, a construct popularized by Bitcoin. This way the algorithm can avoid the need for a central server to resolve Operational Transform Edit Conflicts and without the need for resolving conflicts, the server can be kept unaware of the content which is being edited on the pad.';
// contact.html
- out.main_about_p2 = 'If you have any questions or comments, feel free to reach out! You can tweet us, open an issue on GitHub. Come say hi on our Matrix channel or IRC (#cryptpad on irc.freenode.net), or send us an email.';
+ out.main_about_p2 = 'If you have any questions or comments, feel free to reach out!
You can tweet us, open an issue on GitHub. Come say hi on our Matrix channel or IRC (#cryptpad on irc.freenode.net), or send us an email.';
+ out.main_about_p21 = 'You can';
+ out.main_about_p22 = 'Tweet us';
out.main_info = "