kosmos/akkounts
8
1
Fork 0
Code Issues 22 Pull Requests 1 Actions Packages Releases 12 Activity

WIP Add service page for Chat
Some checks are pending
continuous-integration/drone/push Build is running
Details

Browse Source
This commit is contained in:
Râu Cao
2023-08-07 18:16:14 +02:00
parent f49aff262c
commit 1ea8b22a59
5 changed files with 117 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
app/views/services/chat/show.html.erb Normal file
View File

@@ -0,0 +1,98 @@
<%= render HeaderComponent.new(title: "Chat") %>
<%= render MainSimpleComponent.new do %>
<section>
<p class="mb-6">
Chat with anyone on the open Jabber network. Message people directly, or
join public channels or private rooms.
</p>
</section>
<section>
<h3>Your Chat Address</h3>
<p class="mb-6">
When you exchange contacts with people, give them your
address, or add them using their address:
</p>
<p data-controller="clipboard" class="flex gap-1 sm:w-2/5">
<input type="text" id="user_address" class="grow"
value=<%= current_user.address %> disabled="disabled"
data-clipboard-target="source" />
<button id="copy-user-address" class="btn-md btn-icon btn-outline shrink-0"
data-clipboard-target="trigger" data-action="clipboard#copy"
title="Copy to clipboard">
<span class="content-initial">
<%= render partial: "icons/copy", locals: { custom_class: "text-blue-600 h-4 w-4 inline" } %>
</span>
<span class="content-active hidden">
<%= render partial: "icons/check", locals: { custom_class: "text-blue-600 h-4 w-4 inline" } %>
</span>
</button>
</p>
</section>
<section>
<h3>Chat Apps</h3>
<p>
Use your Kosmos account with many different apps, and on any devices
you wish! When opening an app for the first time, just enter your
user address and password to log in.
</p>
</section>
<section>
<h3>Recommended Apps</h3>
<div data-controller="tabs"
data-tabs-active-tab="-mb-px border-gray-200 border-l border-t border-r rounded-t text-indigo-600 hover:text-indigo-600"
data-tabs-inactive-tab="text-gray-500 hover:text-gray-700">
<ul class="list-reset flex border-gray-200 border-b">
<li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change">
<a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
Web
</a>
</li>
<li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change">
<a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
Android
</a>
</li>
<li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change">
<a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
iOS
</a>
</li>
<li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change">
<a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
Linux
</a>
</li>
<li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change">
<a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
Windows
</a>
</li>
<li class="mr-2" data-tabs-target="tab" data-action="click->tabs#change">
<a href="#" class="bg-white inline-block py-2 px-4 font-semibold no-underline">
macOS
</a>
</li>
</ul>
<div class="hidden" data-tabs-target="panel">
Web
</div>
<div class="hidden" data-tabs-target="panel">
Android
</div>
<div class="hidden" data-tabs-target="panel">
iOS
</div>
<div class="hidden" data-tabs-target="panel">
Linux
</div>
<div class="hidden" data-tabs-target="panel">
Windows
</div>
<div class="hidden" data-tabs-target="panel">
macOS
</div>
</div>
</section>
<% end %>