JakeHillion/storj
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

web/storagenode: add banner with info on storagenode payout changes

Browse Source 
Closes https://github.com/storj/storj/issues/5712

Change-Id: I037adb2af756d44f87e6f5ee38c0f9bd8033809d
This commit is contained in:
Clement Sam 2023-03-30 13:33:33 +00:00 committed by Clement Sam
parent 4db3d33d3e
commit 80fc7e94ec
2 changed files with 50 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

45
web/storagenode/src/app/components/SNOContentFilling.vue
View File

@ -4,6 +4,23 @@
<template>
<div class="info-area">
<SatelliteSelection />
<div class="info-area__announcement">
<LargeInfoIcon
class="info-area__announcement__image"
alt="Announcement image"
/>
<p class="info-area__announcement__info">
Please read the information on the
<a
class="info-area__announcement__info__link"
href="https://www.storj.io/s/storage-node-pricing-update-2023"
rel="noopener noreferrer"
target="_blank"
>
forum
</a> regarding the Storage Node payout changes.
</p>
</div>
<div v-if="isDisqualifiedInfoShown" class="info-area__disqualified-info">
<LargeDisqualificationIcon
class="info-area__disqualified-info__image"
@ -181,6 +198,7 @@ import WalletArea from '@/app/components/WalletArea.vue';
import LargeSuspensionIcon from '@/../static/images/largeSuspend.svg';
import LargeDisqualificationIcon from '@/../static/images/largeDisqualify.svg';
import LargeInfoIcon from '@/../static/images/LargeInfo.svg';
import BlueArrowRight from '@/../static/images/BlueArrowRight.svg';
// @vue/component
@ -199,6 +217,7 @@ import BlueArrowRight from '@/../static/images/BlueArrowRight.svg';
LargeDisqualificationIcon,
LargeSuspensionIcon,
BlueArrowRight,
LargeInfoIcon,
},
})
export default class SNOContentFilling extends Vue {
@ -487,6 +506,32 @@ export default class SNOContentFilling extends Vue {
}
}
&__announcement {
display: flex;
align-items: center;
padding: 20px 27px 20px 25px;
background-color: var(--block-background-color);
border-radius: 12px;
width: calc(100% - 52px);
margin-top: 17px;
color: var(--regular-text-color);
&__image {
min-height: 35px;
min-width: 38px;
margin-right: 17px;
}
&__info {
font-size: 14px;
line-height: 21px;
&__link {
color: var(--navigation-link-color);
}
}
}
&__title {
font-size: 18px;
line-height: 57px;

5
web/storagenode/static/images/LargeInfo.svg Normal file
View File

@ -0,0 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" width="40px" height="40px" viewBox="0 0 40 40" version="1.1">
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(35.294118%,40%,48.627451%);fill-opacity:1;" d="M 20 0 C 31.046875 0 40 8.953125 40 20 C 40 31.046875 31.046875 40 20 40 C 8.953125 40 0 31.046875 0 20 C 0 8.953125 8.953125 0 20 0 Z M 20 0 "/>
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 20 17.785156 C 18.777344 17.785156 17.777344 18.851562 17.777344 20.152344 L 17.777344 29.632812 C 17.777344 29.75 17.785156 29.878906 17.800781 29.996094 C 17.960938 31.125 18.886719 32 20 32 C 21.21875 32 22.21875 30.933594 22.21875 29.632812 L 22.21875 20.160156 C 22.21875 18.851562 21.21875 17.785156 20 17.785156 Z M 20 17.785156 "/>
<path style=" stroke:none;fill-rule:nonzero;fill:rgb(100%,100%,100%);fill-opacity:1;" d="M 20 15.476562 C 21.71875 15.476562 23.109375 14.085938 23.109375 12.367188 C 23.109375 10.644531 21.71875 9.257812 20 9.257812 C 18.277344 9.257812 16.890625 10.644531 16.890625 12.367188 C 16.882812 14.085938 18.273438 15.476562 20 15.476562 Z M 20 15.476562 "/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB