Don't overflow the controls in weird ways on mobile

This commit is contained in:
Tristan Daniël Maat 2022-08-13 23:31:36 +01:00
parent 63f24aaedd
commit ad8d09745e
Signed by: tlater
GPG key ID: 49670FD774E43268

View file

@ -10,8 +10,8 @@ function Controls() {
if (title.name === "Journey" && title.artist === "Mseq") { if (title.name === "Journey" && title.artist === "Mseq") {
titleLine = ( titleLine = (
<div className="notification is-primary"> <div className="level-item is-size-7-mobile is-flex-shrink-1">
<div className="level-item"> <div>
<a href="http://dig.ccmixter.org/files/Mseq/54702"> <a href="http://dig.ccmixter.org/files/Mseq/54702">
Journey Journey
</a> </a>
@ -28,12 +28,12 @@ function Controls() {
return ( return (
<div className="notification is-primary"> <div className="notification is-primary">
<div className="level"> <div className="level is-mobile">
<div className="level-left"> <div className="level-left is-flex-shrink-1">
<Indicator /> <Indicator />
{titleLine} {titleLine}
</div> </div>
<div className="level-right"> <div className="level-right is-hidden-mobile">
<div className="level-item">{title.artist}</div> <div className="level-item">{title.artist}</div>
</div> </div>
</div> </div>