Link underlines for @channel + claim address + lbry url

This commit is contained in:
Minesh Mitha 2018-10-21 22:38:27 +01:00
parent 034bedac10
commit a188adc311
3 changed files with 16 additions and 5 deletions

View file

@ -73,7 +73,7 @@
padding-right: 40px;
}
&:last-child {
padding-left: 40px;
padding-left: 60px;
border-left: 1px solid #9095a54d;
}
}
@ -88,7 +88,7 @@
width: 360px;
}
.asset-information {
width: 341px;
width: 320px;
}
}

View file

@ -59,3 +59,14 @@ a, a:visited {
}
}
.link--hover {
display: inline-block;
padding-bottom: 2px;
border-bottom: 1px solid transparent;
transition: all 0.2s ease;
&:hover {
border-bottom: 1px solid $brand-color;
}
}

View file

@ -32,7 +32,7 @@ class AssetInfo extends React.Component {
}
content={
<span className='text'>
<Link className='link--brand' to={`/${channelName}:${certificateId}`}>{channelName}</Link>
<Link className='link--brand link--hover' to={`/${channelName}:${certificateId}`}>{channelName}</Link>
</span>
}
/>
@ -129,7 +129,7 @@ class AssetInfo extends React.Component {
<div className='asset-footer'>
<Row>
<p>
Hosted via the <a className={'link--brand'} href={'https://lbry.io/get'} target={'_blank'}>LBRY</a> blockchain
Hosted via the <a className={'link--brand link--hover'} href={'https://lbry.io/get'} target={'_blank'}>LBRY</a> blockchain
</p>
</Row>
<div className='claim-address'>
@ -138,7 +138,7 @@ class AssetInfo extends React.Component {
<Label value={'Claim Address'} />
}
content={
<a className={'link--brand'} href={'https://lbry.io/get'} target={'_blank'}>Place Claim Address Here</a>
<a className={'link--brand link--hover'} href={'https://lbry.io/get'} target={'_blank'}>Place Claim Address Here</a>
}
/>
</div>