This commit is contained in:
parent
a2889705ed
commit
4f2b35ccb9
GPG Key ID:
9F88009D31D99C72
@ -3,9 +3,9 @@
|
||||
@apply leading-none
|
||||
}
|
||||
|
||||
h1, h2, h3 {
|
||||
@apply font-light;
|
||||
}
|
||||
/* h1, h2, h3 { */
|
||||
/* @apply font-light; */
|
||||
/* } */
|
||||
|
||||
h1 {
|
||||
@apply text-3xl uppercase;
|
||||
|
||||
@ -1,6 +1,22 @@
|
||||
@import "variables";
|
||||
@import "mediaqueries";
|
||||
|
||||
body {
|
||||
background: linear-gradient(35deg, rgba(255,0,255,0.2) 0, rgba(13,79,153,0.8) 100%),
|
||||
url('/img/bg-1.jpg');
|
||||
background-size: cover;
|
||||
background-attachment: fixed;
|
||||
}
|
||||
|
||||
.ks-site-icon {
|
||||
svg {
|
||||
display: inline-block;
|
||||
height: 1.875rem;
|
||||
vertical-align: top;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
#wrapper {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
@ -23,17 +39,6 @@
|
||||
span.project-name {
|
||||
display: none;
|
||||
}
|
||||
|
||||
span.icon {
|
||||
svg {
|
||||
display: inline-block;
|
||||
height: 1.875rem;
|
||||
vertical-align: top;
|
||||
width: auto;
|
||||
}
|
||||
|
||||
margin-right: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
p.current-user {
|
||||
@ -94,19 +99,6 @@ body#admin-panel {
|
||||
}
|
||||
|
||||
main {
|
||||
width: $content-width;
|
||||
max-width: $content-max-width;
|
||||
margin: 4rem auto 6rem auto;
|
||||
text-align: left;
|
||||
|
||||
@include media-max(medium) {
|
||||
max-width: 90%;
|
||||
}
|
||||
|
||||
@include media-max(small) {
|
||||
margin: 3rem auto;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: 1.5rem;
|
||||
margin-bottom: 1rem;
|
||||
@ -126,10 +118,6 @@ main {
|
||||
|
||||
section {
|
||||
margin-bottom: 3rem;
|
||||
|
||||
h2 {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
table {
|
||||
|
||||
@ -2,4 +2,12 @@ module ApplicationHelper
|
||||
def sats_to_btc(sats)
|
||||
sats.to_f / 100000000
|
||||
end
|
||||
|
||||
def main_nav_class(current_section, link_to_section)
|
||||
if current_section == link_to_section
|
||||
"bg-gray-900/50 text-white px-3 py-2 rounded-md text-sm font-medium"
|
||||
else
|
||||
"text-gray-300 hover:bg-gray-900/30 hover:text-white px-3 py-2 rounded-md text-sm font-medium"
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
5
app/views/components/_header.html.erb
Normal file
5
app/views/components/_header.html.erb
Normal file
@ -0,0 +1,5 @@
|
||||
<header class="py-10">
|
||||
<div class="max-w-6xl mx-auto px-4 sm:px-6 lg:px-8">
|
||||
<h1 class="text-3xl font-bold text-white"><%= page_title %></h1>
|
||||
</div>
|
||||
</header>
|
||||
@ -1,58 +1,63 @@
|
||||
<section>
|
||||
<h2>Services</h2>
|
||||
<p>
|
||||
Your Kosmos account and password currently give you access to these
|
||||
services:
|
||||
</p>
|
||||
<div class="grid services mt-12">
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Chat", "https://wiki.kosmos.org/Services:Chat", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Chat rooms and instant messaging (XMPP/Jabber)
|
||||
<%= render partial: "components/header", locals: { page_title: "Services" } %>
|
||||
|
||||
<main class="w-full max-w-6xl mx-auto pb-12 px-4 sm:px-6 lg:px-8">
|
||||
<div class="bg-white rounded-lg shadow px-6 py-12 sm:px-12">
|
||||
<section>
|
||||
<p>
|
||||
Your Kosmos account and password currently give you access to these
|
||||
services:
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Discourse", "https://community.kosmos.org", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Kosmos community forums and user support/help site
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<span class="text-yellow-500">🗲</span>
|
||||
<%= link_to "Lightning Wallet", wallet_path, class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Send and receive sats over the Bitcoin Lightning Network
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Wiki", "https://wiki.kosmos.org", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Kosmos documentation and knowledge base
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Gitea", "https://gitea.kosmos.org", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Code hosting and collaboration for software projects
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Drone CI", "https://drone.kosmos.org", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Continuous integration for software projects on Gitea
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid services mt-12">
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Chat", "https://wiki.kosmos.org/Services:Chat", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Chat rooms and instant messaging (XMPP/Jabber)
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Discourse", "https://community.kosmos.org", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Kosmos community forums and user support/help site
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<span class="text-yellow-500">🗲</span>
|
||||
<%= link_to "Lightning Wallet", wallet_path, class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Send and receive sats over the Bitcoin Lightning Network
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Wiki", "https://wiki.kosmos.org", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Kosmos documentation and knowledge base
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Gitea", "https://gitea.kosmos.org", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Code hosting and collaboration for software projects
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
<h3 class="mb-3.5">
|
||||
<%= link_to "Drone CI", "https://drone.kosmos.org", class: "ks-text-link" %>
|
||||
</h3>
|
||||
<p class="text-gray-500">
|
||||
Continuous integration for software projects on Gitea
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
@ -1,41 +1,46 @@
|
||||
<section>
|
||||
<h2>Donations</h2>
|
||||
<p>
|
||||
Your financial contributions to the development and
|
||||
upkeep of Kosmos software and services.
|
||||
</p>
|
||||
</section>
|
||||
<%= render partial: "components/header", locals: { page_title: "Donations" } %>
|
||||
|
||||
<section>
|
||||
<% if @donations.any? %>
|
||||
<ul class="donations list-none">
|
||||
<% @donations.each do |donation| %>
|
||||
<li class="mb-8 grid gap-y-2 gap-x-8 grid-cols-2 items-center">
|
||||
<h3 class="mb-0">
|
||||
<%= donation.paid_at.strftime("%B %d, %Y") %>
|
||||
</h3>
|
||||
<p class="row-span-2 font-mono text-right mb-0">
|
||||
<span class="text-xl">
|
||||
<%= number_with_delimiter donation.amount_sats %> sats
|
||||
</span>
|
||||
<br>
|
||||
<span class="text-sm text-gray-500">
|
||||
(~ <%= number_to_currency donation.amount_eur / 100, unit: "" %> EUR)
|
||||
</span>
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<% if donation.public_name.present? %>
|
||||
Public name: <%= donation.public_name %>
|
||||
<% else %>
|
||||
Anonymous
|
||||
<% end %>
|
||||
</p>
|
||||
</li>
|
||||
<main class="w-full max-w-6xl mx-auto pb-12 px-4 sm:px-6 lg:px-8">
|
||||
<div class="bg-white rounded-lg shadow px-6 py-12 sm:px-12">
|
||||
<section>
|
||||
<p>
|
||||
Your financial contributions to the development and upkeep of Kosmos
|
||||
software and services.
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<% if @donations.any? %>
|
||||
<ul class="donations list-none">
|
||||
<% @donations.each do |donation| %>
|
||||
<li class="mb-8 grid gap-y-2 gap-x-8 grid-cols-2 items-center">
|
||||
<h3 class="mb-0">
|
||||
<%= donation.paid_at.strftime("%B %d, %Y") %>
|
||||
</h3>
|
||||
<p class="row-span-2 font-mono text-right mb-0">
|
||||
<span class="text-xl">
|
||||
<%= number_with_delimiter donation.amount_sats %> sats
|
||||
</span>
|
||||
<br>
|
||||
<span class="text-sm text-gray-500">
|
||||
(~ <%= number_to_currency donation.amount_eur / 100, unit: "" %> EUR)
|
||||
</span>
|
||||
</p>
|
||||
<p class="mb-0">
|
||||
<% if donation.public_name.present? %>
|
||||
Public name: <%= donation.public_name %>
|
||||
<% else %>
|
||||
Anonymous
|
||||
<% end %>
|
||||
</p>
|
||||
</li>
|
||||
<% end %>
|
||||
</ul>
|
||||
<% else %>
|
||||
<p>
|
||||
No donations to show.
|
||||
</p>
|
||||
<% end %>
|
||||
</ul>
|
||||
<% else %>
|
||||
<p>
|
||||
No donations to show.
|
||||
</p>
|
||||
<% end %>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@ -1,56 +1,61 @@
|
||||
<section>
|
||||
<h2>Invitations</h2>
|
||||
<% if @invitations_unused.any? %>
|
||||
<p>
|
||||
Invite your friends to a Kosmos account by sharing an invitation URL with them:
|
||||
</p>
|
||||
<% end %>
|
||||
</section>
|
||||
<%= render partial: "components/header", locals: { page_title: "Invitations" } %>
|
||||
|
||||
<section>
|
||||
<% if @invitations_unused.any? %>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>URL</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<% @invitations_unused.each do |invitation| %>
|
||||
<tr>
|
||||
<td><%= invitation_url(invitation.token) %></td>
|
||||
</tr>
|
||||
<% end %>
|
||||
</tbody>
|
||||
</table>
|
||||
<% else %>
|
||||
<p>
|
||||
You do not have any invitations to give away yet. All good
|
||||
things come in time.
|
||||
</p>
|
||||
<% end %>
|
||||
</section>
|
||||
<main class="w-full max-w-6xl mx-auto pb-12 px-4 sm:px-6 lg:px-8">
|
||||
<div class="bg-white rounded-lg shadow px-6 py-12 sm:px-12">
|
||||
<section>
|
||||
<% if @invitations_unused.any? %>
|
||||
<p>
|
||||
Invite your friends to a Kosmos account by sharing an invitation URL with them:
|
||||
</p>
|
||||
<% end %>
|
||||
</section>
|
||||
|
||||
<% if @invitations_used.any? %>
|
||||
<section>
|
||||
<h3>Accepted Invitations</h3>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="hide-small">ID</th>
|
||||
<th>Accepted</th>
|
||||
<th>Invited user</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<% @invitations_used.each do |invitation| %>
|
||||
<tr>
|
||||
<td class="hide-small"><%= invitation.token %></td>
|
||||
<td><%= invitation.used_at.strftime("%Y-%m-%d") %></td>
|
||||
<td><%= User.find(invitation.invited_user_id).address %></td>
|
||||
</tr>
|
||||
<% end %>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
<% end %>
|
||||
<section>
|
||||
<% if @invitations_unused.any? %>
|
||||
<table>
|
||||
<thead>
|
||||
<tr class="text-left">
|
||||
<th>URL</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<% @invitations_unused.each do |invitation| %>
|
||||
<tr>
|
||||
<td class="font-mono"><%= invitation_url(invitation.token) %></td>
|
||||
</tr>
|
||||
<% end %>
|
||||
</tbody>
|
||||
</table>
|
||||
<% else %>
|
||||
<p>
|
||||
You do not have any invitations to give away yet. All good
|
||||
things come in time.
|
||||
</p>
|
||||
<% end %>
|
||||
</section>
|
||||
|
||||
<% if @invitations_used.any? %>
|
||||
<section>
|
||||
<h3>Accepted Invitations</h3>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="hide-small">ID</th>
|
||||
<th>Accepted</th>
|
||||
<th>Invited user</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<% @invitations_used.each do |invitation| %>
|
||||
<tr>
|
||||
<td class="hide-small"><%= invitation.token %></td>
|
||||
<td><%= invitation.used_at.strftime("%Y-%m-%d") %></td>
|
||||
<td><%= User.find(invitation.invited_user_id).address %></td>
|
||||
</tr>
|
||||
<% end %>
|
||||
</tbody>
|
||||
</table>
|
||||
</section>
|
||||
<% end %>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@ -11,29 +11,68 @@
|
||||
<%= javascript_importmap_tags %>
|
||||
</head>
|
||||
<body>
|
||||
<div class="">
|
||||
<nav class="">
|
||||
<div class="max-w-6xl mx-auto sm:px-6 lg:px-8">
|
||||
<div class="border-b border-gray-200/10">
|
||||
<div class="flex items-center justify-between h-16 px-4 sm:px-0">
|
||||
<div class="flex items-center">
|
||||
<div class="ks-site-icon flex-shrink-0">
|
||||
<%= render partial: "shared/icons/comet" %>
|
||||
<!-- <img class="h-8 w-8" src="https://tailwindui.com/img/logos/workflow-mark-indigo-500.svg" alt="Workflow"> -->
|
||||
</div>
|
||||
<div class="hidden md:block">
|
||||
<div class="ml-10 flex items-baseline space-x-4">
|
||||
<%= render partial: 'shared/main_nav' %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="hidden md:block">
|
||||
<%= render partial: 'shared/header_account' %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Mobile menu, show/hide based on menu state. -->
|
||||
<div class="border-b border-gray-700 md:hidden" id="mobile-menu">
|
||||
<div class="pt-4 pb-3 border-t border-gray-700">
|
||||
<div class="flex items-center px-5">
|
||||
<div class="flex-shrink-0">
|
||||
<img class="h-10 w-10 rounded-full" src="" alt="">
|
||||
</div>
|
||||
<div class="ml-3">
|
||||
<div class="text-base font-medium leading-none text-white">Tom Cook</div>
|
||||
<div class="text-sm font-medium leading-none text-gray-400">tom@example.com</div>
|
||||
</div>
|
||||
<button type="button" class="ml-auto bg-gray-800 flex-shrink-0 p-1 text-gray-400 rounded-full hover:text-white focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-offset-gray-800 focus:ring-white">
|
||||
<span class="sr-only">View notifications</span>
|
||||
<!-- Heroicon name: outline/bell -->
|
||||
<svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" aria-hidden="true">
|
||||
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 17h5l-1.405-1.405A2.032 2.032 0 0118 14.158V11a6.002 6.002 0 00-4-5.659V5a2 2 0 10-4 0v.341C7.67 6.165 6 8.388 6 11v3.159c0 .538-.214 1.055-.595 1.436L4 17h5m6 0v1a3 3 0 11-6 0v-1m6 0H9" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
<div class="mt-3 px-2 space-y-1">
|
||||
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-gray-400 hover:text-white hover:bg-gray-700">Your Profile</a>
|
||||
|
||||
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-gray-400 hover:text-white hover:bg-gray-700">Settings</a>
|
||||
|
||||
<a href="#" class="block px-3 py-2 rounded-md text-base font-medium text-gray-400 hover:text-white hover:bg-gray-700">Sign out</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<%= yield %>
|
||||
</div>
|
||||
|
||||
<div id="wrapper">
|
||||
<header>
|
||||
<h1>
|
||||
<span class ="icon"><%= render partial: "shared/icons/comet" %></span>
|
||||
<span class ="project-name">Kosmos</span>
|
||||
<span class ="site-name">Account</span>
|
||||
</h1>
|
||||
<%= render partial: 'shared/header_account' %>
|
||||
</header>
|
||||
|
||||
<% if user_signed_in? && current_user.confirmed? %>
|
||||
<%= render partial: 'shared/main_nav' %>
|
||||
<% end %>
|
||||
|
||||
<% flash.each do |type, msg| %>
|
||||
<div class="flash-msg <%= type %>">
|
||||
<p><%= msg %></p>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<main>
|
||||
<%= yield %>
|
||||
</main>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -1,12 +1,18 @@
|
||||
<section>
|
||||
<h2>Security</h2>
|
||||
</section>
|
||||
<%= render partial: "components/header", locals: { page_title: "Account" } %>
|
||||
|
||||
<section>
|
||||
<h3>Password change</h3>
|
||||
<p>
|
||||
<%= form_with(url: settings_reset_password_path, method: :post) do %>
|
||||
<%= submit_tag("Send me a password reset link", class: 'btn-md btn-gray') %>
|
||||
<% end %>
|
||||
</p>
|
||||
</section>
|
||||
<main class="w-full max-w-6xl mx-auto pb-12 px-4 sm:px-6 lg:px-8">
|
||||
<div class="bg-white rounded-lg shadow px-6 py-12 sm:px-12">
|
||||
<section>
|
||||
<h2>Security</h2>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>Password change</h3>
|
||||
<p>
|
||||
<%= form_with(url: settings_reset_password_path, method: :post) do %>
|
||||
<%= submit_tag("Send me a password reset link", class: 'btn-md btn-gray') %>
|
||||
<% end %>
|
||||
</p>
|
||||
</section>
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@ -1,6 +1,10 @@
|
||||
<% if user_signed_in? %>
|
||||
<p class="current-user mt-8">
|
||||
Signed in as <strong class="text-white font-normal"><%= current_user.cn %>@kosmos.org</strong>.
|
||||
<%= link_to "Log out", destroy_user_session_path, class: 'underline' %>
|
||||
</p>
|
||||
<div class="flex items-baseline space-x-4 text-gray-200/80 text-sm font-medium">
|
||||
<span>
|
||||
Signed in as <strong class="text-white font-normal"><%= current_user.cn %>@kosmos.org</strong>
|
||||
</span>
|
||||
<span>
|
||||
<%= link_to "Log out", destroy_user_session_path, class: 'underline hover:text-white' %>
|
||||
</span>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
@ -1,26 +1,10 @@
|
||||
<nav id="main-nav">
|
||||
<div class="wrapper">
|
||||
<ul class="pages">
|
||||
<li>
|
||||
<%= link_to "Services", root_path,
|
||||
class: @current_section == :dashboard ? "active" : nil %>
|
||||
</li>
|
||||
<li>
|
||||
<%= link_to "Invitations", invitations_path,
|
||||
class: @current_section == :invitations ? "active" : nil %>
|
||||
</li>
|
||||
<li>
|
||||
<%= link_to "Donations", donations_path,
|
||||
class: @current_section == :contributions ? "active" : nil %>
|
||||
</li>
|
||||
<li>
|
||||
<%= link_to "Wallet", wallet_path,
|
||||
class: @current_section == :wallet ? "active" : nil %>
|
||||
</li>
|
||||
<li>
|
||||
<%= link_to "Security", security_path,
|
||||
class: @current_section == :security ? "active" : nil %>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
<%= link_to "Services", root_path,
|
||||
class: main_nav_class(@current_section, :dashboard) %>
|
||||
<%= link_to "Invitations", invitations_path,
|
||||
class: main_nav_class(@current_section, :invitations) %>
|
||||
<%= link_to "Donations", donations_path,
|
||||
class: main_nav_class(@current_section, :contributions) %>
|
||||
<%= link_to "Wallet", wallet_path,
|
||||
class: main_nav_class(@current_section, :wallet) %>
|
||||
<%= link_to "Account", security_path,
|
||||
class: main_nav_class(@current_section, :security) %>
|
||||
|
||||
@ -1,87 +1,92 @@
|
||||
<section class="w-full grid grid-cols-1 md:grid-cols-12 md:mb-0">
|
||||
<div class="md:col-span-8">
|
||||
<h2>Wallet</h2>
|
||||
<p>
|
||||
Send and receive sats via the Bitcoin Lightning Network.
|
||||
</p>
|
||||
</div>
|
||||
<div class="md:col-span-4 mt-4 md:mt-0">
|
||||
<p class="font-mono md:text-right mb-0 p-4 border border-gray-300 rounded-lg overflow-hidden">
|
||||
<% if @balance %>
|
||||
<span class="text-xl"><%= number_with_delimiter @balance %> sats</span><br>
|
||||
<span class="text-sm text-gray-500">Available balance</span>
|
||||
<% else %>
|
||||
<span class="text-xl">n/a sats</span><br>
|
||||
<span class="text-sm text-gray-500">Balance unavailable</span>
|
||||
<% end %>
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
<%= render partial: "components/header", locals: { page_title: "Wallet" } %>
|
||||
|
||||
<section>
|
||||
<h3>Lightning Address</h3>
|
||||
<p>
|
||||
Your Kosmos user address is also a
|
||||
<a class="ks-text-link" href="https://lightningaddress.com/" target="_blank">Lightning Address</a>!
|
||||
The easiest way to receive sats is by just giving out your address:
|
||||
</p>
|
||||
<p>
|
||||
<strong><%= current_user.address %></strong>
|
||||
</p>
|
||||
</section>
|
||||
<main class="w-full max-w-6xl mx-auto pb-12 px-4 sm:px-6 lg:px-8">
|
||||
<div class="bg-white rounded-lg shadow px-6 py-12 sm:px-12">
|
||||
<section class="w-full grid grid-cols-1 md:grid-cols-12 md:mb-0">
|
||||
<div class="md:col-span-8">
|
||||
<p>
|
||||
Send and receive sats via the Bitcoin Lightning Network.
|
||||
</p>
|
||||
</div>
|
||||
<div class="md:col-span-4 mt-4 md:mt-0">
|
||||
<p class="font-mono md:text-right mb-0 p-4 border border-gray-300 rounded-lg overflow-hidden">
|
||||
<% if @balance %>
|
||||
<span class="text-xl"><%= number_with_delimiter @balance %> sats</span><br>
|
||||
<span class="text-sm text-gray-500">Available balance</span>
|
||||
<% else %>
|
||||
<span class="text-xl">n/a sats</span><br>
|
||||
<span class="text-sm text-gray-500">Balance unavailable</span>
|
||||
<% end %>
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>Wallet Apps</h3>
|
||||
<p>
|
||||
You can connect various wallet apps to your Kosmos account. This allows
|
||||
you to both receive and send sats. Any wallet that supports
|
||||
<a href="https://bluewallet.io/lndhub/" class="ks-text-link" target="_blank">LNDHub</a>
|
||||
accounts should be able to add/import your account using our setup
|
||||
code/URL:
|
||||
</p>
|
||||
<p class="my-6 text-center md:text-left">
|
||||
<button id="copy-setup-code" class="btn-md btn-blue">Copy setup code/URL</button>
|
||||
<span class="mx-2 my-2 md:my-0 block md:inline">or</span>
|
||||
<button id="show-setup-code" class="btn-md btn-blue">Show setup QR code</button>
|
||||
<button id="hide-setup-code" class="btn-md btn-blue hidden">Hide setup QR code</button>
|
||||
</p>
|
||||
<p id="setup-code" class="hidden my-10 w-full text-center">
|
||||
<%= raw @svg %>
|
||||
</p>
|
||||
</section>
|
||||
<section>
|
||||
<h3>Lightning Address</h3>
|
||||
<p>
|
||||
Your Kosmos user address is also a
|
||||
<a class="ks-text-link" href="https://lightningaddress.com/" target="_blank">Lightning Address</a>!
|
||||
The easiest way to receive sats is by just giving out your address:
|
||||
</p>
|
||||
<p>
|
||||
<strong><%= current_user.address %></strong>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>Recommended Apps</h3>
|
||||
<div class="w-full grid grid-cols-1 gap-y-4 md:grid-cols-12
|
||||
md:gap-y-6 md:gap-x-4 md:items-center">
|
||||
<h4 class="md:col-span-3">
|
||||
<a href="https://bluewallet.io" class="ks-text-link text-xl"
|
||||
title="Blue Wallet" target="_blank">
|
||||
<%= image_tag("/img/logos/bluewallet.svg", class: 'h-16') %>
|
||||
</a>
|
||||
</h4>
|
||||
<p class="md:col-span-4 mb-0 text-gray-500">
|
||||
Android / iOS / macOS
|
||||
</p>
|
||||
<p class="md:col-span-5 mb-0">
|
||||
When adding a wallet, choose "Import wallet" on the bottom of the screen,
|
||||
then scan the setup QR code.
|
||||
</p>
|
||||
<h4 class="md:col-span-3">
|
||||
<a href="https://getalby.com/" class="ks-text-link text-xl"
|
||||
title="Alby" target="_blank">
|
||||
<%= image_tag("/img/logos/alby.svg", class: 'h-16') %>
|
||||
</a>
|
||||
</h4>
|
||||
<p class="md:col-span-4 mb-0 text-gray-500">
|
||||
Firefox / Chrome (Opera, Brave, Chromium-based browsers)
|
||||
</p>
|
||||
<p class="md:col-span-5 mb-0">
|
||||
Choose "LNDHub (Bluewallet)" in the connect dialog and paste the setup
|
||||
URL in the "LNDHub Export URI" field.
|
||||
</p>
|
||||
<section>
|
||||
<h3>Wallet Apps</h3>
|
||||
<p>
|
||||
You can connect various wallet apps to your Kosmos account. This allows
|
||||
you to both receive and send sats. Any wallet that supports
|
||||
<a href="https://bluewallet.io/lndhub/" class="ks-text-link" target="_blank">LNDHub</a>
|
||||
accounts should be able to add/import your account using our setup
|
||||
code/URL:
|
||||
</p>
|
||||
<p class="my-6 text-center md:text-left">
|
||||
<button id="copy-setup-code" class="btn-md btn-blue">Copy setup code/URL</button>
|
||||
<span class="mx-2 my-2 md:my-0 block md:inline">or</span>
|
||||
<button id="show-setup-code" class="btn-md btn-blue">Show setup QR code</button>
|
||||
<button id="hide-setup-code" class="btn-md btn-blue hidden">Hide setup QR code</button>
|
||||
</p>
|
||||
<p id="setup-code" class="hidden my-10 w-full text-center">
|
||||
<%= raw @svg %>
|
||||
</p>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h3>Recommended Apps</h3>
|
||||
<div class="w-full grid grid-cols-1 gap-y-4 md:grid-cols-12
|
||||
md:gap-y-6 md:gap-x-4 md:items-center">
|
||||
<h4 class="md:col-span-3">
|
||||
<a href="https://bluewallet.io" class="ks-text-link text-xl"
|
||||
title="Blue Wallet" target="_blank">
|
||||
<%= image_tag("/img/logos/bluewallet.svg", class: 'h-16') %>
|
||||
</a>
|
||||
</h4>
|
||||
<p class="md:col-span-4 mb-0 text-gray-500">
|
||||
Android / iOS / macOS
|
||||
</p>
|
||||
<p class="md:col-span-5 mb-0">
|
||||
When adding a wallet, choose "Import wallet" on the bottom of the screen,
|
||||
then scan the setup QR code.
|
||||
</p>
|
||||
<h4 class="md:col-span-3">
|
||||
<a href="https://getalby.com/" class="ks-text-link text-xl"
|
||||
title="Alby" target="_blank">
|
||||
<%= image_tag("/img/logos/alby.svg", class: 'h-16') %>
|
||||
</a>
|
||||
</h4>
|
||||
<p class="md:col-span-4 mb-0 text-gray-500">
|
||||
Firefox / Chrome (Opera, Brave, Chromium-based browsers)
|
||||
</p>
|
||||
<p class="md:col-span-5 mb-0">
|
||||
Choose "LNDHub (Bluewallet)" in the connect dialog and paste the setup
|
||||
URL in the "LNDHub Export URI" field.
|
||||
</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
</section>
|
||||
</main>
|
||||
|
||||
<script type="text/javascript">
|
||||
(function () {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user