ion/Melo
1
0
Fork 0
Code Issues Pull Requests Actions 11 Packages Projects Releases Wiki Activity

新增播放详情页

Browse Source
This commit is contained in:
lyswhut
2020-04-28 13:33:55 +08:00
parent db04b0c285
commit 346fa2c004
15 changed files with 935 additions and 82 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/renderer/assets/styles/variables.less
+39
View File
@@ -46,14 +46,17 @@
@color-player-progress-bar1: darken(@color-theme_2, 12%);
@color-player-progress-bar2: lighten(@color-theme, 12%);
@color-player-status-text: lighten(@color-theme_2-font, 10%);
@color-player-detail-play-btn: lighten(@color-theme, 7%);
@color-tab-btn-background: fadeout(lighten(@color-theme, 10%), 80%);
@color-tab-btn-background-hover: @color-theme_2-hover;
@color-tab-border-top: fadeout(lighten(@color-theme, 5%), 50%);
@color-tab-border-bottom: lighten(@color-theme, 5%);
@color-hideBtn: #3bc2b2;
@color-minBtn: #85c43b;
@color-maxBtn: #e7aa36;
@color-closeBtn: #ea6e4d;
@color-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-minBtn-hover: fadeout(@color-minBtn, 10%);
@color-maxBtn-hover: fadeout(@color-maxBtn, 10%);
@color-closeBtn-hover: fadeout(@color-closeBtn, 10%);
@@ -101,13 +104,16 @@
@color-green-player-progress-bar1: darken(@color-green-theme_2, 12%);
@color-green-player-progress-bar2: lighten(@color-green-theme, 12%);
@color-green-player-status-text: lighten(@color-green-theme_2-font, 10%);
@color-green-player-detail-play-btn: lighten(@color-green-theme, 7%);
@color-green-tab-btn-background: fadeout(lighten(@color-green-theme, 10%), 80%);
@color-green-tab-btn-background-hover: @color-green-theme_2-hover;
@color-green-tab-border-top: fadeout(lighten(@color-green-theme, 5%), 50%);
@color-green-tab-border-bottom: lighten(@color-green-theme, 5%);
@color-green-hideBtn: #3bc2b2;
@color-green-minBtn: #85c43b;
@color-green-maxBtn: #e7aa36;
@color-green-closeBtn: #ea6e4d;
@color-green-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-green-minBtn-hover: fadeout(@color-green-minBtn, 10%);
@color-green-maxBtn-hover: fadeout(@color-green-maxBtn, 10%);
@color-green-closeBtn-hover: fadeout(@color-green-closeBtn, 10%);
@@ -151,13 +157,16 @@
@color-yellow-player-progress-bar1: darken(@color-yellow-theme_2, 12%);
@color-yellow-player-progress-bar2: lighten(@color-yellow-theme, 2%);
@color-yellow-player-status-text: lighten(@color-yellow-theme_2-font, 10%);
@color-yellow-player-detail-play-btn: lighten(@color-yellow-theme, 7%);
@color-yellow-tab-btn-background: fadeout(lighten(@color-yellow-theme, 10%), 70%);
@color-yellow-tab-btn-background-hover: @color-yellow-theme_2-hover;
@color-yellow-tab-border-top: fadeout(lighten(@color-yellow-theme, 5%), 40%);
@color-yellow-tab-border-bottom: @color-yellow-theme;
@color-yellow-hideBtn: #3bc2b2;
@color-yellow-minBtn: #85c43b;
@color-yellow-maxBtn: #e7aa36;
@color-yellow-closeBtn: #ea6e4d;
@color-yellow-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-yellow-minBtn-hover: fadeout(@color-yellow-minBtn, 10%);
@color-yellow-maxBtn-hover: fadeout(@color-yellow-maxBtn, 10%);
@color-yellow-closeBtn-hover: fadeout(@color-yellow-closeBtn, 10%);
@@ -200,13 +209,16 @@
@color-orange-player-progress-bar1: darken(@color-orange-theme_2, 12%);
@color-orange-player-progress-bar2: lighten(@color-orange-theme, 12%);
@color-orange-player-status-text: lighten(@color-orange-theme_2-font, 10%);
@color-orange-player-detail-play-btn: lighten(@color-orange-theme, 7%);
@color-orange-tab-btn-background: fadeout(lighten(@color-orange-theme, 10%), 80%);
@color-orange-tab-btn-background-hover: @color-orange-theme_2-hover;
@color-orange-tab-border-top: fadeout(lighten(@color-orange-theme, 5%), 50%);
@color-orange-tab-border-bottom: lighten(@color-orange-theme, 5%);
@color-orange-hideBtn: #3bc2b2;
@color-orange-minBtn: #85c43b;
@color-orange-maxBtn: #e7aa36;
@color-orange-closeBtn: #ea6e4d;
@color-orange-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-orange-minBtn-hover: fadeout(@color-orange-minBtn, 10%);
@color-orange-maxBtn-hover: fadeout(@color-orange-maxBtn, 10%);
@color-orange-closeBtn-hover: fadeout(@color-orange-closeBtn, 10%);
@@ -249,13 +261,16 @@
@color-blue-player-progress-bar1: darken(@color-blue-theme_2, 12%);
@color-blue-player-progress-bar2: lighten(@color-blue-theme, 12%);
@color-blue-player-status-text: lighten(@color-blue-theme_2-font, 10%);
@color-blue-player-detail-play-btn: lighten(@color-blue-theme, 7%);
@color-blue-tab-btn-background: fadeout(lighten(@color-blue-theme, 10%), 80%);
@color-blue-tab-btn-background-hover: @color-blue-theme_2-hover;
@color-blue-tab-border-top: fadeout(lighten(@color-blue-theme, 5%), 50%);
@color-blue-tab-border-bottom: lighten(@color-blue-theme, 5%);
@color-blue-hideBtn: #3bc2b2;
@color-blue-minBtn: #85c43b;
@color-blue-maxBtn: #e7aa36;
@color-blue-closeBtn: #ea6e4d;
@color-blue-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-blue-minBtn-hover: fadeout(@color-blue-minBtn, 10%);
@color-blue-maxBtn-hover: fadeout(@color-blue-maxBtn, 10%);
@color-blue-closeBtn-hover: fadeout(@color-blue-closeBtn, 10%);
@@ -298,15 +313,18 @@
@color-red-player-progress-bar1: darken(@color-red-theme_2, 12%);
@color-red-player-progress-bar2: lighten(@color-red-theme, 12%);
@color-red-player-status-text: lighten(@color-red-theme_2-font, 10%);
@color-red-player-detail-play-btn: lighten(@color-red-theme, 7%);
@color-red-tab-border-top: fadeout(lighten(@color-red-theme, 25%), 70%);
@color-red-tab-border-bottom: lighten(@color-red-theme, 35%);
@color-red-tab-btn-background: fadeout(lighten(@color-red-theme, 10%), 80%);
@color-red-tab-btn-background-hover: @color-red-theme_2-hover;
@color-red-tab-border-top: fadeout(lighten(@color-red-theme, 5%), 50%);
@color-red-tab-border-bottom: lighten(@color-red-theme, 5%);
@color-red-hideBtn: #3bc2b2;
@color-red-minBtn: #85c43b;
@color-red-maxBtn: #e7aa36;
@color-red-closeBtn: #ea6e4d;
@color-red-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-red-minBtn-hover: fadeout(@color-red-minBtn, 10%);
@color-red-maxBtn-hover: fadeout(@color-red-maxBtn, 10%);
@color-red-closeBtn-hover: fadeout(@color-red-closeBtn, 10%);
@@ -349,13 +367,16 @@
@color-pink-player-progress-bar1: darken(@color-pink-theme_2, 12%);
@color-pink-player-progress-bar2: lighten(@color-pink-theme, 2%);
@color-pink-player-status-text: lighten(@color-pink-theme_2-font, 10%);
@color-pink-player-detail-play-btn: lighten(@color-pink-theme, 7%);
@color-pink-tab-btn-background: fadeout(lighten(@color-pink-theme, 10%), 70%);
@color-pink-tab-btn-background-hover: @color-pink-theme_2-hover;
@color-pink-tab-border-top: fadeout(lighten(@color-pink-theme, 5%), 40%);
@color-pink-tab-border-bottom: @color-pink-theme;
@color-pink-hideBtn: #3bc2b2;
@color-pink-minBtn: #85c43b;
@color-pink-maxBtn: #e7aa36;
@color-pink-closeBtn: #ea6e4d;
@color-pink-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-pink-minBtn-hover: fadeout(@color-pink-minBtn, 10%);
@color-pink-maxBtn-hover: fadeout(@color-pink-maxBtn, 10%);
@color-pink-closeBtn-hover: fadeout(@color-pink-closeBtn, 10%);
@@ -398,13 +419,16 @@
@color-purple-player-progress-bar1: darken(@color-purple-theme_2, 12%);
@color-purple-player-progress-bar2: lighten(@color-purple-theme, 12%);
@color-purple-player-status-text: lighten(@color-purple-theme_2-font, 10%);
@color-purple-player-detail-play-btn: lighten(@color-purple-theme, 7%);
@color-purple-tab-btn-background: fadeout(lighten(@color-purple-theme, 10%), 80%);
@color-purple-tab-btn-background-hover: @color-purple-theme_2-hover;
@color-purple-tab-border-top: fadeout(lighten(@color-purple-theme, 5%), 50%);
@color-purple-tab-border-bottom: lighten(@color-purple-theme, 5%);
@color-purple-hideBtn: #3bc2b2;
@color-purple-minBtn: #85c43b;
@color-purple-maxBtn: #e7aa36;
@color-purple-closeBtn: #ea6e4d;
@color-purple-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-purple-minBtn-hover: fadeout(@color-purple-minBtn, 10%);
@color-purple-maxBtn-hover: fadeout(@color-purple-maxBtn, 10%);
@color-purple-closeBtn-hover: fadeout(@color-purple-closeBtn, 10%);
@@ -447,13 +471,16 @@
@color-grey-player-progress-bar1: darken(@color-grey-theme_2, 12%);
@color-grey-player-progress-bar2: lighten(@color-grey-theme, 12%);
@color-grey-player-status-text: lighten(@color-grey-theme_2-font, 10%);
@color-grey-player-detail-play-btn: lighten(@color-grey-theme, 7%);
@color-grey-tab-btn-background: fadeout(lighten(@color-grey-theme, 10%), 80%);
@color-grey-tab-btn-background-hover: @color-grey-theme_2-hover;
@color-grey-tab-border-top: fadeout(lighten(@color-grey-theme, 5%), 50%);
@color-grey-tab-border-bottom: lighten(@color-grey-theme, 5%);
@color-grey-hideBtn: #3bc2b2;
@color-grey-minBtn: #85c43b;
@color-grey-maxBtn: #e7aa36;
@color-grey-closeBtn: #ea6e4d;
@color-grey-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-grey-minBtn-hover: fadeout(@color-grey-minBtn, 10%);
@color-grey-maxBtn-hover: fadeout(@color-grey-maxBtn, 10%);
@color-grey-closeBtn-hover: fadeout(@color-grey-closeBtn, 10%);
@@ -497,15 +524,18 @@
@color-ming-player-progress-bar1: darken(@color-ming-theme_2, 12%);
@color-ming-player-progress-bar2: lighten(@color-ming-theme, 12%);
@color-ming-player-status-text: lighten(@color-ming-theme_2-font, 10%);
@color-ming-player-detail-play-btn: lighten(@color-ming-theme, 10%);
@color-ming-tab-border-top: fadeout(lighten(@color-ming-theme, 25%), 70%);
@color-ming-tab-border-bottom: lighten(@color-ming-theme, 35%);
@color-ming-tab-btn-background: fadeout(lighten(@color-ming-theme, 10%), 80%);
@color-ming-tab-btn-background-hover: @color-ming-theme_2-hover;
@color-ming-tab-border-top: fadeout(lighten(@color-ming-theme, 5%), 50%);
@color-ming-tab-border-bottom: lighten(@color-ming-theme, 5%);
@color-ming-hideBtn: #3bc2b2;
@color-ming-minBtn: #85c43b;
@color-ming-maxBtn: #e7aa36;
@color-ming-closeBtn: #ea6e4d;
@color-ming-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-ming-minBtn-hover: fadeout(@color-ming-minBtn, 10%);
@color-ming-maxBtn-hover: fadeout(@color-ming-maxBtn, 10%);
@color-ming-closeBtn-hover: fadeout(@color-ming-closeBtn, 10%);
@@ -548,13 +578,16 @@
@color-mid_autumn-player-progress-bar1: darken(@color-mid_autumn-theme_2, 12%);
@color-mid_autumn-player-progress-bar2: lighten(@color-mid_autumn-theme, 12%);
@color-mid_autumn-player-status-text: lighten(@color-mid_autumn-theme_2-font, 10%);
@color-mid_autumn-player-detail-play-btn: lighten(@color-mid_autumn-theme, 7%);
@color-mid_autumn-tab-btn-background: fadeout(lighten(@color-mid_autumn-theme, 10%), 80%);
@color-mid_autumn-tab-btn-background-hover: @color-mid_autumn-theme_2-hover;
@color-mid_autumn-tab-border-top: fadeout(lighten(@color-mid_autumn-theme, 5%), 50%);
@color-mid_autumn-tab-border-bottom: lighten(@color-mid_autumn-theme, 5%);
@color-mid_autumn-hideBtn: #3bc2b2;
@color-mid_autumn-minBtn: #85c43b;
@color-mid_autumn-maxBtn: #e7aa36;
@color-mid_autumn-closeBtn: #ea6e4d;
@color-mid_autumn-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-mid_autumn-minBtn-hover: fadeout(@color-mid_autumn-minBtn, 10%);
@color-mid_autumn-maxBtn-hover: fadeout(@color-mid_autumn-maxBtn, 10%);
@color-mid_autumn-closeBtn-hover: fadeout(@color-mid_autumn-closeBtn, 10%);
@@ -597,13 +630,16 @@
@color-naruto-player-progress-bar1: darken(@color-naruto-theme_2, 12%);
@color-naruto-player-progress-bar2: lighten(@color-naruto-theme, 12%);
@color-naruto-player-status-text: lighten(@color-naruto-theme_2-font, 10%);
@color-naruto-player-detail-play-btn: lighten(@color-naruto-theme, 7%);
@color-naruto-tab-btn-background: fadeout(lighten(@color-naruto-theme, 10%), 80%);
@color-naruto-tab-btn-background-hover: @color-naruto-theme_2-hover;
@color-naruto-tab-border-top: fadeout(lighten(@color-naruto-theme, 5%), 50%);
@color-naruto-tab-border-bottom: lighten(@color-naruto-theme, 5%);
@color-naruto-hideBtn: #3bc2b2;
@color-naruto-minBtn: #85c43b;
@color-naruto-maxBtn: #e7aa36;
@color-naruto-closeBtn: #ea6e4d;
@color-naruto-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-naruto-minBtn-hover: fadeout(@color-naruto-minBtn, 10%);
@color-naruto-maxBtn-hover: fadeout(@color-naruto-maxBtn, 10%);
@color-naruto-closeBtn-hover: fadeout(@color-naruto-closeBtn, 10%);
@@ -646,13 +682,16 @@
@color-happy_new_year-player-progress-bar1: darken(@color-happy_new_year-theme_2, 12%);
@color-happy_new_year-player-progress-bar2: lighten(@color-happy_new_year-theme, 9%);
@color-happy_new_year-player-status-text: lighten(@color-happy_new_year-theme_2-font, 10%);
@color-happy_new_year-player-detail-play-btn: lighten(@color-happy_new_year-theme, 7%);
@color-happy_new_year-tab-btn-background: fadeout(lighten(@color-happy_new_year-theme, 10%), 80%);
@color-happy_new_year-tab-btn-background-hover: @color-happy_new_year-theme_2-hover;
@color-happy_new_year-tab-border-top: fadeout(lighten(@color-happy_new_year-theme, 5%), 50%);
@color-happy_new_year-tab-border-bottom: lighten(@color-happy_new_year-theme, 5%);
@color-happy_new_year-hideBtn: #64a130;
@color-happy_new_year-minBtn: #c4943b;
@color-happy_new_year-maxBtn: #e7aa36;
@color-happy_new_year-closeBtn: #ea6e4d;
@color-happy_new_year-hideBtn-hover: fadeout(@color-hideBtn, 10%);
@color-happy_new_year-minBtn-hover: fadeout(@color-happy_new_year-minBtn, 10%);
@color-happy_new_year-maxBtn-hover: fadeout(@color-happy_new_year-maxBtn, 10%);
@color-happy_new_year-closeBtn-hover: fadeout(@color-happy_new_year-closeBtn, 10%);