mirrors/mempool
1
0
Fork 0
mirror of https://github.com/mempool/mempool.git synced 2024-11-20 10:21:52 +01:00
Code Issues Projects Releases Wiki Activity

Sponsor page revamped

Browse Source
This commit is contained in:
softsimon 2022-04-05 21:00:36 +04:00
parent 6386f4c68a
commit 1a35c8ce42
No known key found for this signature in database
GPG Key ID: 488D7DCFB5A430D7
3 changed files with 45 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/app/app-routing.module.ts
View File

@ -156,10 +156,6 @@ let routes: Routes = [
children: [],
component: AddressComponent
},
{
path: 'sponsor',
component: SponsorComponent,
},
],
},
{
@ -442,6 +438,10 @@ let routes: Routes = [
path: 'status',
component: StatusViewComponent
},
{
path: 'sponsor',
component: SponsorComponent,
},
{
path: '**',
redirectTo: ''
@ -584,10 +584,6 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') {
path: 'trademark-policy',
component: TrademarkPolicyComponent
},
{
path: 'sponsor',
component: SponsorComponent,
},
],
},
{
@ -712,10 +708,6 @@ if (browserWindowEnv && browserWindowEnv.BASE_MODULE === 'liquid') {
path: 'trademark-policy',
component: TrademarkPolicyComponent
},
{
path: 'sponsor',
component: SponsorComponent,
},
],
},
{

12
frontend/src/app/components/sponsor/sponsor.component.html
View File

@ -1,5 +1,9 @@
<div class="container-xl sponsor-page">
<div class="container-xl">
<img [src]="'./resources/mempool-space-logo.png'" height="35" width="140" class="logo">
<div class="sponsor-page">
<h1 i18n="sponsor.title">Sponsor</h1>
<p *ngIf="!sponsorsEnabled; else sponsorForm">
@ -21,7 +25,7 @@
</div>
</div>
<div class="card" (click)="setSelection(0.01)" [class.shiny-border]="donationForm.get('selection').value === 0.01">
<div class="card middle-card" (click)="setSelection(0.01)" [class.shiny-border]="donationForm.get('selection').value === 0.01">
<div class="card-header">Community Sponsor</div>
<div class="card-body">
<h5 class="card-title">1M <span class="symbol">sats</span></h5>
@ -149,5 +153,5 @@
Order ID <span>{{ donationObj.id }}</span>
</div>
</div>
</div>
</div>

38
frontend/src/app/components/sponsor/sponsor.component.scss
View File

@ -15,8 +15,8 @@
}
.card {
width: 220px;
height: 200px;
width: 240px;
height: 220px;
background-color: #1d1f31;
border: 2px solid #1d1f31;
cursor: pointer;
@ -46,7 +46,9 @@
&:hover {
background-color: #5058926b;
border: 2px solid #505892;
transform: scale(1.11) translateY(-10px);
transform: scale(1.1) translateY(-10px);
margin-top: 70px;
.card-header {
background-color: #505892;
}
@ -54,7 +56,7 @@
}
.donation-form {
max-width: 240px;
max-width: 280px;
margin: auto;
button {
width: 100%;
@ -72,14 +74,28 @@
justify-content: center;
}
.middle-card {
width: 280px;
height: 260px;
margin-top: 40px;
&:hover {
margin-top: 50px;
}
}
.shiny-border {
background-color: #5058926b;
border: 2px solid #505892;
transform: scale(1.11) translateY(-10px);
transform: scale(1.1) translateY(-10px);
margin-top: 70px;
box-shadow: 0px 0px 100px #9858ff52;
.card-header {
background-color: #505892;
}
&.middle-card {
margin-top: 50px;
}
}
.input-group {
@ -106,4 +122,16 @@
margin-left: 10px;
}
}
}
.logo {
margin: 30px;
}
.card-body {
align-items: center;
display: flex;
justify-content: center;
flex-direction: column;
height: 100%;
}