mirror of
https://github.com/btcpayserver/btcpayserver.git
synced 2025-02-22 06:21:44 +01:00
Footer: Improve responsive display (#4163)
Enhancement in addition to #4160.
This commit is contained in:
parent
0306635a45
commit
4a5fd08e51
3 changed files with 31 additions and 41 deletions
|
@ -2,39 +2,37 @@
|
|||
@inject BTCPayServer.Services.BTCPayServerEnvironment _env
|
||||
|
||||
<footer class="btcpay-footer">
|
||||
<div class="container">
|
||||
<div class="d-flex flex-wrap flex-column justify-content-between flex-xl-row py-2">
|
||||
<div class="d-flex flex-wrap justify-content-center justify-content-xl-start mb-3 mb-xl-0">
|
||||
<a href="https://github.com/btcpayserver/btcpayserver" class="d-flex align-items-center m-3 m-sm-0 me-sm-4" target="_blank" rel="noreferrer noopener">
|
||||
<vc:icon symbol="github"/>
|
||||
<span style="margin-left:.4rem">Github</span>
|
||||
</a>
|
||||
<a href="https://chat.btcpayserver.org/" class="d-flex align-items-center m-3 m-sm-0 me-sm-4" target="_blank" rel="noreferrer noopener">
|
||||
<vc:icon symbol="mattermost"/>
|
||||
<span style="margin-left:.4rem">Mattermost</span>
|
||||
</a>
|
||||
<a href="https://twitter.com/BtcpayServer" class="d-flex align-items-center m-3 m-sm-0 me-sm-4" target="_blank" rel="noreferrer noopener">
|
||||
<vc:icon symbol="twitter"/>
|
||||
<span style="margin-left:.4rem">Twitter</span>
|
||||
</a>
|
||||
<a href="https://t.me/btcpayserver" class="d-flex align-items-center m-3 m-sm-0" target="_blank" rel="noreferrer noopener">
|
||||
<vc:icon symbol="telegram"/>
|
||||
<span style="margin-left:.4rem">Telegram</span>
|
||||
</a>
|
||||
@if (!string.IsNullOrEmpty(_env.OnionUrl) && !Context.Request.IsOnion())
|
||||
{
|
||||
<a href="@_env.OnionUrl" class="d-flex align-items-center m-3 m-sm-0 ms-sm-4" target="_onion" rel="noreferrer noopener" role="button" data-clipboard="@_env.OnionUrl" style="min-width:9em;">
|
||||
<vc:icon symbol="onion"/>
|
||||
<span style="margin-left:.4rem" data-clipboard-confirm="Copied URL ✔">Copy Tor URL</span>
|
||||
</a>
|
||||
}
|
||||
</div>
|
||||
@if (User.Identity.IsAuthenticated)
|
||||
<div class="d-flex flex-wrap flex-column justify-content-between flex-xl-row gap-3">
|
||||
<div class="d-flex flex-wrap justify-content-center justify-content-xl-start gap-4">
|
||||
<a href="https://github.com/btcpayserver/btcpayserver" class="d-flex align-items-center" target="_blank" rel="noreferrer noopener">
|
||||
<vc:icon symbol="github"/>
|
||||
<span style="margin-left:.4rem">Github</span>
|
||||
</a>
|
||||
<a href="https://chat.btcpayserver.org/" class="d-flex align-items-center" target="_blank" rel="noreferrer noopener">
|
||||
<vc:icon symbol="mattermost"/>
|
||||
<span style="margin-left:.4rem">Mattermost</span>
|
||||
</a>
|
||||
<a href="https://twitter.com/BtcpayServer" class="d-flex align-items-center" target="_blank" rel="noreferrer noopener">
|
||||
<vc:icon symbol="twitter"/>
|
||||
<span style="margin-left:.4rem">Twitter</span>
|
||||
</a>
|
||||
<a href="https://t.me/btcpayserver" class="d-flex align-items-center" target="_blank" rel="noreferrer noopener">
|
||||
<vc:icon symbol="telegram"/>
|
||||
<span style="margin-left:.4rem">Telegram</span>
|
||||
</a>
|
||||
@if (!string.IsNullOrEmpty(_env.OnionUrl) && !Context.Request.IsOnion())
|
||||
{
|
||||
<div class="text-center">
|
||||
@_env.ToString()
|
||||
</div>
|
||||
<a href="@_env.OnionUrl" class="d-flex align-items-center" target="_onion" rel="noreferrer noopener" role="button" data-clipboard="@_env.OnionUrl" style="min-width:9em;">
|
||||
<vc:icon symbol="onion"/>
|
||||
<span style="margin-left:.4rem" data-clipboard-confirm="Copied URL ✔">Copy Tor URL</span>
|
||||
</a>
|
||||
}
|
||||
</div>
|
||||
@if (User.Identity.IsAuthenticated)
|
||||
{
|
||||
<div class="text-center">
|
||||
@_env.ToString()
|
||||
</div>
|
||||
}
|
||||
</div>
|
||||
</footer>
|
||||
|
|
|
@ -8,10 +8,8 @@
|
|||
<partial name="LayoutHead" />
|
||||
@await RenderSectionAsync("PageHeadContent", false)
|
||||
<style>
|
||||
.btcpay-footer { max-width: 600px; margin-left: auto; margin-right: auto; }
|
||||
.btcpay-footer .flex-xl-row { flex-direction: column !important; }
|
||||
.btcpay-footer .justify-content-xl-start { justify-content: center !important; }
|
||||
.btcpay-footer .mb-xl-0 { margin-bottom: 0.5rem !important; }
|
||||
</style>
|
||||
</head>
|
||||
<body class="d-flex flex-column min-vh-100">
|
||||
|
|
|
@ -372,7 +372,7 @@
|
|||
.btcpay-footer {
|
||||
font-size: var(--btcpay-font-size-s);
|
||||
overflow: hidden;
|
||||
padding: .5em 0;
|
||||
padding: 0 var(--content-padding-horizontal) 1rem;
|
||||
color: var(--btcpay-footer-text);
|
||||
background: var(--btcpay-footer-bg);
|
||||
}
|
||||
|
@ -613,16 +613,10 @@
|
|||
max-width: calc(100vw - var(--sidebar-width) - (2 * var(--btcpay-space-xl)) - 1rem); /* 1rem for scrollbar */
|
||||
}
|
||||
|
||||
#mainContent > section,
|
||||
.btcpay-footer > .container {
|
||||
#mainContent > section {
|
||||
margin: 0;
|
||||
max-width: none;
|
||||
}
|
||||
|
||||
.btcpay-footer {
|
||||
padding-left: var(--btcpay-space-xl);
|
||||
padding-right: var(--btcpay-space-xl);
|
||||
}
|
||||
|
||||
#SectionNav .nav {
|
||||
margin-top: calc(var(--btcpay-space-m) * -1);
|
||||
|
|
Loading…
Add table
Reference in a new issue