dap-ps
/
discover
mirror of https://github.com/dap-ps/discover.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Fix Miscellaneous UI

This commit is contained in:
Onuwa Nnachi Isaac 2019-07-11 00:25:38 +01:00
parent 188759ffb2
commit 988b6193a1
10 changed files with 140 additions and 99 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/common/components/FeatureDapps/FeatureDapps.module.scss
View File

@ -25,6 +25,9 @@
flex-direction: column;
margin: 0 calculateRem(20) calculateRem(20) calculateRem(20);
text-decoration: none;
@media (min-width: 412px) {
min-width: 360px;
}
}
.bannerWrapper {

1
src/common/components/Modal/Modal.module.scss
View File

@ -45,6 +45,7 @@
background: #939ba1;
cursor: pointer;
transform: rotate(45deg);
z-index: 99;
}
}

2
src/modules/Alert/Alert.container.js
View File

@ -1,7 +1,7 @@
import { connect } from 'react-redux'
import Alert from './Alert'
import { hideAlertAction } from './Alert.reducer'
import { hideAction } from '../TransactionStatus/TransactionStatus.recuder'
import { hideAction } from '../TransactionStatus/TransactionStatus.reducer'
const mapStateToProps = state => state.alert
const mapDispatchToProps = dispatch => ({

1
src/modules/Categories/Categories.module.scss
View File

@ -36,7 +36,6 @@
padding: calculateRem(12);
margin: calculateRem(4);
cursor: pointer;
text-align: -webkit-center;
overflow: hidden;
display: flex;
flex-direction: column;

158
src/modules/HowToSubmit/HowToSubmit.jsx
View File

@ -37,83 +37,87 @@ class HowToSubmit extends React.Component {
{visible_how_to_submit && (
<>
<div className={styles.title}>How to submit a ÐApp</div>
<div className={styles.frame}>
<div className={styles.frameTitle}>Submit your ÐApp</div>
<ol>
<li>
Upload a name, url, description, category and image for your
DApp in the next step compulsory.
</li>
<li>
Stake the amount of SNT you want to rank your DApp optional.
</li>
<li>Hit “submit”.</li>
<li>
Our team will ensure that your DApp works well on mobile
devices and will then include it on the live site using the
information you provided in Step 1.
</li>
</ol>
</div>
<div className={styles.frame}>
<div className={styles.frameTitle}>Staking</div>
<p>
You need not stake anything to be included - your DApp just
won’t appear in the “Highest Ranked” section. If you do stake
SNT, your DApp will appear in that section immediately. The
DApp with the highest effective balance (that is, SNT staked
plus/minus votes cast for/against) ranks highest.
</p>
<p>
SNT you stake is locked in the Discover contract. You can, at
any time, withdraw a percentage of what you have staked. The
more you stake, the lower the percentage you can withdraw.
Withdrawals must be made from the same wallet as you submitted
with, so PLEASE SECURE THIS ADDRESS.
</p>
</div>
<div className={`${styles.frame} ${styles.withBorder}`}>
<ol>
<li>
Staking <strong>10 000 SNT</strong> returns a rate of{' '}
<strong>99.5%</strong>, so you can withdraw up to{' '}
<strong>9 950 SNT.</strong>
</li>
<li>
Staking <strong>1 000 000 SNT</strong> returns a rate of
50.99%, so you can withdraw up to{' '}
<strong>509 958 SNT.</strong>
</li>
</ol>
</div>
<div className={styles.frame}>
<p>
Furthermore, the operators of{' '}
<a href="https://dap.ps">https://dap.ps</a> reserve the right
to remove any DApp from the UI for reasons including, but not
limited to:
</p>
</div>
<div className={`${styles.frame} ${styles.withBorder}`}>
<ol>
<li>Malicious code injection</li>
<li>
Violation of{' '}
<a href="https://status.im/about/">Status' principles</a>
</li>
<li>Lack of usability (especially on mobile)</li>
<li>Vote manipulation.</li>
</ol>
</div>
<div className={styles.frame}>
<p>
Anyone is welcome to fork the software and implement different
UI choices for the same underlying contract. Note that
Discover is not affiliated with Status directly, we have
simply chosen to use SNT as a token of value, to abide by{' '}
<a href="https://status.im/about/">Status’ principles</a>, and
to take a mobile-first approach to development.
</p>
<div className={styles.howto}>
<div className={styles.frame}>
<div className={styles.frameTitle}>Submit your ÐApp</div>
<ol>
<li>
Upload a name, url, description, category and image for
your DApp in the next step compulsory.
</li>
<li>
Stake the amount of SNT you want to rank your DApp
optional.
</li>
<li>Hit “submit”.</li>
<li>
Our team will ensure that your DApp works well on mobile
devices and will then include it on the live site using
the information you provided in Step 1.
</li>
</ol>
</div>
<div className={styles.frame}>
<div className={styles.frameTitle}>Staking</div>
<p>
You need not stake anything to be included - your DApp just
won’t appear in the “Highest Ranked” section. If you do
stake SNT, your DApp will appear in that section
immediately. The DApp with the highest effective balance
(that is, SNT staked plus/minus votes cast for/against)
ranks highest.
</p>
<p>
SNT you stake is locked in the Discover contract. You can,
at any time, withdraw a percentage of what you have staked.
The more you stake, the lower the percentage you can
withdraw. Withdrawals must be made from the same wallet as
you submitted with, so PLEASE SECURE THIS ADDRESS.
</p>
</div>
<div className={`${styles.frame} ${styles.withBorder}`}>
<ol>
<li>
Staking <strong>10 000 SNT</strong> returns a rate of{' '}
<strong>99.5%</strong>, so you can withdraw up to{' '}
<strong>9 950 SNT.</strong>
</li>
<li>
Staking <strong>1 000 000 SNT</strong> returns a rate of
50.99%, so you can withdraw up to{' '}
<strong>509 958 SNT.</strong>
</li>
</ol>
</div>
<div className={styles.frame}>
<p>
Furthermore, the operators of{' '}
<a href="https://dap.ps">https://dap.ps</a> reserve the
right to remove any DApp from the UI for reasons including,
but not limited to:
</p>
</div>
<div className={`${styles.frame} ${styles.withBorder}`}>
<ol>
<li>Malicious code injection</li>
<li>
Violation of{' '}
<a href="https://status.im/about/">Status' principles</a>
</li>
<li>Lack of usability (especially on mobile)</li>
<li>Vote manipulation.</li>
</ol>
</div>
<div className={styles.frame}>
<p>
Anyone is welcome to fork the software and implement
different UI choices for the same underlying contract. Note
that Discover is not affiliated with Status directly, we
have simply chosen to use SNT as a token of value, to abide
by <a href="https://status.im/about/">Status’ principles</a>
, and to take a mobile-first approach to development.
</p>
</div>
</div>
</>
)}

14
src/modules/HowToSubmit/HowToSubmit.module.scss
View File

@ -9,14 +9,22 @@
}
.title {
line-height: 40px;
text-align: center;
letter-spacing: calculateRem(0.2);
text-transform: uppercase;
font-weight: 600;
font-size: 17px;
font-weight: 500;
font-size: calculateRem(16);
padding: calculateRem(10) 0;
position: sticky;
top: 0;
background: #fff;
border-bottom: 1px solid #f7f7f7;
}
.title + .howto {
padding-top: calculateRem(1);
}
a {
color: $link-color;
}

4
src/modules/Profile/Profile.jsx
View File

@ -71,7 +71,9 @@ const ProfileContent = ({
<div className={styles.ranking}>
<span className={styles.heading}>Ranking</span>
<div className={styles.rank}>
<div className={styles.rank_position_1}>
<div
className={[styles.rank_position_1, styles[category]].join(' ')}
>
<span className={styles.rank_position_span}>
{categoryPosition}
</span>

46
src/modules/Profile/Profile.module.scss
View File

@ -45,10 +45,6 @@ a {
cursor: pointer;
}
.category {
margin-bottom: calculateRem(20);
}
.heading {
color: $text-color;
font-size: calculateRem(13);
@ -64,14 +60,14 @@ a {
display: flex;
flex-direction: column;
align-items: center;
margin: calculateRem(40) auto;
margin: calculateRem(40) 0 0 0;
}
.button {
border-radius: 20px;
background-color: #4360df;
color: #ffffff;
margin: calculateRem(16) 0 calculateRem(24) 0;
margin: calculateRem(16) 0 calculateRem(16) 0;
padding: calculateRem(12) calculateRem(32);
}
@ -98,17 +94,17 @@ a {
.chat_image {
width: calculateRem(40);
height: calculateRem(40);
margin-top: calculateRem(20);
// margin-top: calculateRem(20);
border-radius: 20px;
}
.chat_link {
margin: calculateRem(25) calculateRem(10) 0;
margin: 0 0 0 calculateRem(10);
}
.chat_icon {
margin-left: calculateRem(-10);
margin-bottom: calculateRem(10);
margin-bottom: calculateRem(20);
}
.url {
@ -183,3 +179,35 @@ a {
}
}
}
.EXCHANGES {
background: $purple-bg;
}
.MARKETPLACES {
background: $orange-bg;
}
.OTHER {
background: $yellow-bg;
}
.MEDIA {
background: $yellow-bg;
}
.GAMES {
background: $pink-bg;
}
.COLLECTIBLES {
background: $blue-bg;
}
.SOCIAL_NETWORKS {
background: $green-bg;
}
.UTILITIES {
background: $red-bg;
}

5
src/modules/Submit/Submit.module.scss
View File

@ -122,8 +122,9 @@
}
}
input::placeholder {
color: $headline-color;
input::placeholder,
textarea::placeholder {
color: #939ba1;
}
.imgInfo {

5
src/modules/Vote/Vote.module.scss
View File

@ -53,11 +53,6 @@
.tabs button:first-child {
margin-right: 32px;
color: #44d058;
}
.tabs button:last-child {
color: #ff2d55;
}
.tabs button:after {