Tweak small screen scaling
This commit is contained in:
42
src/app.rs
42
src/app.rs
@ -142,6 +142,27 @@ pub fn view(model: &Model) -> Vec<Node<Msg>> {
|
||||
],
|
||||
div![
|
||||
C![C.song_gizmos],
|
||||
match &song.genre {
|
||||
Some(genre) => div![
|
||||
C![C.gizmo, C.note_icon, C.tooltip],
|
||||
span![C![C.tooltiptext], genre],
|
||||
],
|
||||
None => empty![],
|
||||
},
|
||||
match &song.language {
|
||||
Some(language) => div![
|
||||
C![C.gizmo, C.flag_icon, C.tooltip],
|
||||
span![C![C.tooltiptext], language],
|
||||
],
|
||||
None => empty![],
|
||||
},
|
||||
IF![song.video.is_some() => div![
|
||||
C![C.gizmo, C.video_icon, C.tooltip],
|
||||
span![
|
||||
C![C.tooltiptext],
|
||||
"Musikvideo",
|
||||
],
|
||||
]],
|
||||
match (&song.duet_singer_1, &song.duet_singer_2) {
|
||||
(Some(p1), Some(p2)) => div![
|
||||
C![C.gizmo, C.duet_icon, C.tooltip],
|
||||
@ -156,27 +177,6 @@ pub fn view(model: &Model) -> Vec<Node<Msg>> {
|
||||
],
|
||||
_ => empty![],
|
||||
},
|
||||
IF![song.video.is_some() => div![
|
||||
C![C.gizmo, C.video_icon, C.tooltip],
|
||||
span![
|
||||
C![C.tooltiptext],
|
||||
"Musikvideo",
|
||||
],
|
||||
]],
|
||||
match &song.language {
|
||||
Some(language) => div![
|
||||
C![C.gizmo, C.flag_icon, C.tooltip],
|
||||
span![C![C.tooltiptext], language],
|
||||
],
|
||||
None => empty![],
|
||||
},
|
||||
match &song.genre {
|
||||
Some(genre) => div![
|
||||
C![C.gizmo, C.note_icon, C.tooltip],
|
||||
span![C![C.tooltiptext], genre],
|
||||
],
|
||||
None => empty![],
|
||||
},
|
||||
],
|
||||
]
|
||||
};
|
||||
|
||||
@ -133,6 +133,7 @@ body {
|
||||
-webkit-box-flex: 1;
|
||||
-ms-flex: 1;
|
||||
flex: 1;
|
||||
flex-basis: max-content;
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
@ -161,11 +162,18 @@ body {
|
||||
.song_gizmos {
|
||||
flex-grow: 0;
|
||||
flex-shrink: 1;
|
||||
padding-top: 1.5em;
|
||||
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
flex-wrap: wrap;
|
||||
|
||||
padding-top: 1em;
|
||||
padding-bottom: 1em;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
|
||||
.song_gizmos div {
|
||||
margin-right: 1em;
|
||||
margin: 0.5em;
|
||||
}
|
||||
|
||||
.gizmo {
|
||||
|
||||
Reference in New Issue
Block a user