chat_page (#438)

Co-authored-by: meaz <meaz@disroot.org>
Co-authored-by: meaz <meaz@no-reply@disroot.org>
Reviewed-on: #438
Reviewed-by: meaz <meaz@no-reply@disroot.org>
Co-authored-by: antilopa <antilopa@disroot.org>
Co-committed-by: antilopa <antilopa@disroot.org>

pages/chats/_calls/2col.en.md

@@ -0,0 +1,20 @@
+---
+title: Calls
+bgcolor: '#FFF'
+fontcolor: '#1F5C60'
+body_classes: modular
+wider_column: left
+---
+
+# Jitsi Calls
+### Audio/video conference calls.
+
+Disroot's Calls service is a videoconferencing software, powered by **Jitsi-Meet**. It provides you high quality video and audio conferences, with as many partners as you want. It also allows to stream your desktop or only some windows to other participants in the call.
+
+<a class="button button2" href="https://calls.disroot.org/">Start a conference</a>
+
+---
+
+<br><br>
+![jitsi_screenshot](jitsi.png?lightbox=1024)
+

pages/chats/_chat-intro/2col.en.md

@@ -0,0 +1,14 @@
+---
+title: Email
+bgcolor: '#1F5C60'
+fontcolor: '#FFF'
+body_classes: modular
+wider_column: right
+---
+
+<br><br><br>
+## Chat
+
+**Disroot** provides several different chat and conference services...
+
+---

pages/chats/_delta-chat/2col.en.md

@@ -0,0 +1,21 @@
+---
+title: Deltachat
+bgcolor: '#FFF'
+fontcolor: '#1F5C60'
+body_classes: modular
+wider_column: left
+---
+
+# Delta Chat
+
+### Messaging over e-mail. 
+
+Delta Chat is an end-to-end encrypted messaging app that works over e-mail. Message anyone with an e-mail addres even if they don't use Delta Chat.
+
+To know more about visit Delta Chat's [website](https://delta.chat).
+
+---
+
+<br>
+![deltachat_screenshot](deltachat_screen.png?lightbox=1024)
+

pages/chats/_mumble/2col.en.md

@@ -0,0 +1,20 @@
+---
+title: Audio
+bgcolor: '#FFF'
+fontcolor: '#1F5C60'
+body_classes: modular
+wider_column: right
+---
+
+<br>
+![mumble_screenshot](mumble_screen.png?lightbox=1024)
+
+---
+
+# Mumble.
+
+### Audio conference calls. 
+
+Mumble is a free, open source, low latency, high quality voice chat application. It was originally intended for gamers, but it can be use to organize audio conferences and meetings.
+
+<a class="button button1" href="https://mumble.disroot.org/">Connect</a>

pages/chats/_nextcloud-talk/2col.en.md

@@ -0,0 +1,21 @@
+---
+title: 'Talk'
+bgcolor: '#FFF'
+fontcolor: '#1F5C60'
+text_align: left
+wider_column: right
+---
+
+<br><br>
+![](en/call-in-action.png?lightbox=1024)
+
+---
+
+# Nextcloud Talk
+### Audio/video conference calls. 
+
+Securely communicate with your friends and family using rich audio and video from your browser. All calls are peer 2 peer.
+
+You can create a public link that you can share with people that don't have a **Nextcloud** account.
+
+<a class="button button2" href="https://cloud.disroot.org/apps/spreed/">Talk</a>

pages/chats/_xmpp/2col.en.md

@@ -0,0 +1,20 @@
+---
+title: XMPP
+bgcolor: '#FFF'
+fontcolor: '#1F5C60'
+body_classes: modular
+wider_column: left
+---
+
+# XMPP
+### Decentralized and Federated Instant Messaging.
+
+Communicate using an open and federated chat protocol, with the ability to encrypt your communication. With XMPP you are not bound to one service provider (e.g. Disroot server) but can freely communicate with contacts from other Xmpp/Jabber [servers](https://compliance.conversations.im/), just like you would communicate between different email servers.
+
+<a class="button button2" href="https://webchat.disroot.org">Chat</a>
+
+---
+
+<br>
+![xmpp_conversations_client](conversations.png?lightbox=1024)
+

pages/chats/chat-overview/services.en.md

@@ -0,0 +1,43 @@
+---
+title: Chat Overview
+section_id: chats
+bgcolor: '#FFF'
+fontcolor: '#555'
+text_align: left
+services:
+    -
+        title: XMPP Chat  
+        icon: xmpp.png
+        link: 'https://webchat.disroot.org'
+        text: "Decentralized instant messaging."
+        button: 'https://howto.disroot.org/en/tutorials/chat'
+        buttontext: "Learn more"
+    -
+        title: Nextcloud Talk
+        icon: cloud.png
+        link: 'https://cloud.disroot.org/apps/spreed/'
+        text: "??"
+        button: 'https://howto.disroot.org/en/tutorials/cloud/apps/talk/web'
+        buttontext: "Learn more"
+    -
+        title: 'Calls'
+        icon: calls.png
+        link: 'https://calls.disroot.org'
+        text: "A videoconferencing tool."
+        button: 'https://disroot.org/services/calls'
+        buttontext: "Learn more"
+    -
+        title: 'Audio'
+        icon: mumble.png
+        link: 'https://mumble.disroot.org'
+        text: "A low latency, high quality voice chat application."
+        button: 'https://howto.disroot.org/en/tutorials/office/mumble'
+        buttontext: "Learn more"
+    -
+        title: 'Delat chat'
+        icon: email.png
+        link: 'https://disroot.org/services/delta'
+        text: "??"
+        button: ''
+        buttontext: "Learn more"
+---

pages/chats/green-bar/fullbar.en.md

@@ -0,0 +1,8 @@
+---
+title: 'Green bar'
+bgcolor: '#8EB726'
+fontcolor: '#FFF'
+text_align: center
+---
+
+<br>

pages/chats/modular.en.md

@@ -0,0 +1,18 @@
+---
+title: Disroot Chats
+bgcolor: '#fff'
+content:
+    items: '@self.modular'
+    order:
+        by: default
+        dir: asc
+        custom:
+            - _chat-intro
+            - _xmpp
+            - _nextcloud-talk
+            - _calls
+            - _mumble
+            - _delta-chat
+body_classes: modular
+header_image: 'none'
+---