chat-fe: fix unreadnotice position on mobile

This commit is contained in:
Liam Fitzgerald 2020-04-21 16:54:56 +10:00
parent 0fc12b1456
commit 2cec3c4e90
2 changed files with 10 additions and 3 deletions

View File

@ -173,6 +173,10 @@ h2 {
color: #7ea899;
}
.unread-notice {
top: 48px;
}
/* responsive */
@media all and (max-width: 34.375em) {
@ -191,6 +195,9 @@ h2 {
.embed-container {
padding-bottom: 56.25%;
}
.unread-notice {
top: 96px;
}
}
@media all and (min-width: 34.375em) and (max-width: 46.875em) {

View File

@ -17,8 +17,8 @@ export class UnreadNotice extends Component {
return (
<div
style={{ left: "0px", top: "48px" }}
className="pa4 w-100 absolute z-1"
style={{ left: "0px" }}
className="pa4 w-100 absolute z-1 unread-notice"
>
<div className="ba b--green2 green2 bg-white bg-gray0-d flex items-center pa2 f9 justify-between br1">
<p className="lh-copy db">
@ -30,7 +30,7 @@ export class UnreadNotice extends Component {
)}
<span className="green3">{timestamp}</span>
</p>
<div onClick={onRead} className="inter b--green2 pointer">
<div onClick={onRead} className="ml4 inter b--green2 pointer tr lh-copy">
Mark as Read
</div>
</div>