fix table mobile and adress one line

This commit is contained in:
Phillip Lang Martinez 2022-08-24 16:21:04 +03:00
parent b83106d984
commit fa9765e510
2 changed files with 28 additions and 10 deletions

View File

@ -201,9 +201,9 @@ export const pageStyles = css`
.tableGrid { .tableGrid {
display: grid; display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax( grid-template-columns: minmax(0, 3fr) minmax(0, 1fr) minmax(
0, 0,
1fr 2fr
) minmax(0, 1fr); ) minmax(0, 1fr);
align-items: center; align-items: center;
gap: 5px; gap: 5px;
@ -214,6 +214,16 @@ export const pageStyles = css`
} }
.header {
align-self: flex-start;
}
.header p {
word-break: break-word ;
}
.grid-item { .grid-item {
text-align: center; text-align: center;
@ -331,6 +341,7 @@ export const pageStyles = css`
text-decoration: none; text-decoration: none;
margin: 0px; margin: 0px;
margin-right: 10px; margin-right: 10px;
word-break: break-word;
} }
.grid-item { .grid-item {

View File

@ -119,6 +119,7 @@ class SponsorshipList extends LitElement {
const address = const address =
window.parent.reduxStore.getState().app?.selectedAddress window.parent.reduxStore.getState().app?.selectedAddress
?.address ?.address
let rewardShares = await this.getRewardShareRelationship( let rewardShares = await this.getRewardShareRelationship(
address address
) )
@ -420,7 +421,7 @@ class SponsorshipList extends LitElement {
render() { render() {
console.log({sponsors: this.sponsorships})
return html` return html`
${ ${
this.isPageLoading this.isPageLoading
@ -452,17 +453,17 @@ class SponsorshipList extends LitElement {
<p>${translate("sponsorshipspage.schange1")}</p> <p>${translate("sponsorshipspage.schange1")}</p>
</div> </div>
<div class="tableGrid table-header"> <div class="tableGrid table-header">
<div class="grid-item"> <div class="grid-item header">
<p>${translate("sponsorshipspage.schange2")}</p> <p>${translate("sponsorshipspage.schange2")}</p>
</div> </div>
<div class="grid-item"> <div class="grid-item header">
<p>${translate("walletprofile.blocksminted")}</p> <p>${translate("walletprofile.blocksminted")}</p>
</div> </div>
<div class="grid-item"> <div class="grid-item header">
<p>${translate("becomeMinterPage.bchange17")}</p> <p>${translate("becomeMinterPage.bchange17")}</p>
</div> </div>
<div class="grid-item"> <div class="grid-item header">
</div> </div>
</div> </div>
@ -472,17 +473,23 @@ class SponsorshipList extends LitElement {
(sponsorship) => html` (sponsorship) => html`
<ul class="tableGrid"> <ul class="tableGrid">
<li class="grid-item"> <li class="grid-item">
<p class="grid-item-text">
Account Address
</p>
${sponsorship.address} ${sponsorship.address}
</li> </li>
<li class="grid-item"> <li class="grid-item">
<p class="grid-item-text">
Blocks Minted
</p>
${+sponsorship.blocksMinted + ${+sponsorship.blocksMinted +
+sponsorship.blocksMintedAdjustment} +sponsorship.blocksMintedAdjustment}
</li> </li>
<li class="grid-item"> <li class="grid-item">
<p class="grid-item-text">
Copy Sponsorship Key
</p>
<button-icon-copy <button-icon-copy
title="${translate( title="${translate(
"becomeMinterPage.bchange17" "becomeMinterPage.bchange17"