From 646984531f6e3be6483c5342ead4ac915e22e63f Mon Sep 17 00:00:00 2001 From: BlancWu Date: Mon, 27 Sep 2021 18:52:49 +0800 Subject: [PATCH 1/2] Adaptive layout for music player. Signed-off-by: BlancWu --- .../src/main/js/default/pages/index/index.css | 16 +++++----------- 1 file changed, 5 insertions(+), 11 deletions(-) diff --git a/ability/JsDistributedMusicPlayer/entry/src/main/js/default/pages/index/index.css b/ability/JsDistributedMusicPlayer/entry/src/main/js/default/pages/index/index.css index e52d4fe108..c2d3ab7a56 100644 --- a/ability/JsDistributedMusicPlayer/entry/src/main/js/default/pages/index/index.css +++ b/ability/JsDistributedMusicPlayer/entry/src/main/js/default/pages/index/index.css @@ -17,7 +17,6 @@ width: 100%; height: 100%; flex-direction: column; - justify-content: space-between; align-items: center; background-image: url(common/media/bg_blurry.png); background-size: cover; @@ -27,27 +26,22 @@ } .title_section { - margin-top: 150px; - margin-bottom: 10px; + margin-top: 10%; flex-direction: row; justify-content: center; } .title { - height: 64px; font-size: 48px; color: #FFF; - margin-bottom: 10px; text-align: center; } .album_section { - width: 100%; - aspect-ratio: 1; + flex: 1 1px; + background-color: red; flex-direction: row; align-items: center; - margin-top: 25px; - margin-bottom: 25px; } .album_image { @@ -56,7 +50,7 @@ } .progress_section { - margin-bottom: 100px; + margin-bottom: 48px; flex-direction: column; } @@ -64,7 +58,6 @@ width: 100%; flex-direction: row; justify-content: space-between; - margin-bottom: 12px; } .progress_time { @@ -92,6 +85,7 @@ width: 100%; justify-content: space-between; flex-direction: row; + margin-bottom: 48px; } .control_button { -- Gitee From d1fca62cbf6203c2e7008a58a2775a8f8b1a7b7d Mon Sep 17 00:00:00 2001 From: BlancWu Date: Tue, 28 Sep 2021 16:10:30 +0800 Subject: [PATCH 2/2] Remove debug codes. Signed-off-by: BlancWu --- .../entry/src/main/js/default/pages/index/index.css | 1 - 1 file changed, 1 deletion(-) diff --git a/ability/JsDistributedMusicPlayer/entry/src/main/js/default/pages/index/index.css b/ability/JsDistributedMusicPlayer/entry/src/main/js/default/pages/index/index.css index c2d3ab7a56..381c2e5a0c 100644 --- a/ability/JsDistributedMusicPlayer/entry/src/main/js/default/pages/index/index.css +++ b/ability/JsDistributedMusicPlayer/entry/src/main/js/default/pages/index/index.css @@ -39,7 +39,6 @@ .album_section { flex: 1 1px; - background-color: red; flex-direction: row; align-items: center; } -- Gitee