Skip to content

Commit 740ac4c

Browse files
zhw2590582zhw2590582
committed
Refactor styles in ArtPlayer components for improved readability and consistency
- Consolidated loading styles in loading.less for better structure. - Updated mask styles in mask.less to enhance clarity. - Refined mini popup styles in mini.less, adding transition effects. - Improved mixins in mixins.less for consistent styling across components. - Adjusted mobile styles in mobile.less for better responsiveness. - Enhanced notice styles in notice.less for improved visibility. - Streamlined plugin styles in plugins.less for better organization. - Simplified poster styles in poster.less for clarity. - Refined progress styles in progress.less, enhancing hover effects. - Updated selector styles in selector.less for better interaction. - Improved settings styles in setting.less for better usability. - Enhanced subtitle styles in subtitle.less for better visibility. - Updated variable definitions in variables.less for consistency. - Refined video styles in video.less for improved layout. - Enhanced volume control styles in volume.less for better user experience. - Optimized rate limiting logic in build-llm.js and trans-docs.js for better performance.
1 parent b11f0eb commit 740ac4c

39 files changed

+2030
-2017
lines changed

‎eslint.config.js‎

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,15 @@
1-
import antfu from '@antfu/eslint-config'
1+
import antfu from "@antfu/eslint-config";
22

33
export default antfu({
4-
rules: {
5-
'eslint-comments/no-unlimited-disable': 'off',
6-
},
7-
})
4+
ignores: [
5+
"**/hint.less",
6+
],
7+
formatters: {
8+
css: true,
9+
html: true,
10+
markdown: 'prettier',
11+
},
12+
rules: {
13+
"eslint-comments/no-unlimited-disable": "off",
14+
},
15+
});

‎package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -48,6 +48,7 @@
4848
"dotenv": "^17.2.1",
4949
"esbuild": "^0.27.3",
5050
"eslint": "^9.32.0",
51+
"eslint-plugin-format": "^2.0.1",
5152
"glob": "^13.0.6",
5253
"lerna": "^8.2.3",
5354
"less": "^4.5.1",
@@ -57,4 +58,4 @@
5758
"terser": "^5.46.0",
5859
"vite": "^7.3.1"
5960
}
60-
}
61+
}

‎packages/artplayer-plugin-ads/src/style.less‎

Lines changed: 67 additions & 67 deletions
Original file line numberDiff line numberDiff line change
@@ -1,80 +1,80 @@
11
.artplayer-plugin-ads {
2-
position: absolute;
3-
z-index: 150;
4-
left: 0;
5-
top: 0;
6-
right: 0;
7-
bottom: 0;
2+
position: absolute;
3+
z-index: 150;
4+
left: 0;
5+
top: 0;
6+
right: 0;
7+
bottom: 0;
8+
width: 100%;
9+
height: 100%;
10+
overflow: hidden;
11+
font-size: 13px;
12+
line-height: 1;
13+
color: #fff;
14+
background-color: #000;
15+
16+
.artplayer-plugin-ads-html {
17+
display: flex;
18+
align-items: center;
19+
justify-content: center;
820
width: 100%;
921
height: 100%;
10-
overflow: hidden;
11-
font-size: 13px;
12-
line-height: 1;
13-
color: #fff;
14-
background-color: #000;
22+
}
1523

16-
.artplayer-plugin-ads-html {
17-
display: flex;
18-
align-items: center;
19-
justify-content: center;
20-
width: 100%;
21-
height: 100%;
22-
}
23-
24-
.artplayer-plugin-ads-video {
25-
width: 100%;
26-
height: 100%;
27-
}
24+
.artplayer-plugin-ads-video {
25+
width: 100%;
26+
height: 100%;
27+
}
2828

29-
.artplayer-plugin-ads-timer {
30-
display: none;
31-
position: absolute;
32-
top: 10px;
33-
right: 10px;
29+
.artplayer-plugin-ads-timer {
30+
display: none;
31+
position: absolute;
32+
top: 10px;
33+
right: 10px;
3434

35-
& > div {
36-
display: flex;
37-
align-items: center;
38-
background-color: rgb(0 0 0 / 50%);
39-
border-radius: 15px;
40-
margin-left: 5px;
41-
padding: 5px 10px;
42-
cursor: pointer;
43-
}
35+
& > div {
36+
display: flex;
37+
align-items: center;
38+
background-color: rgb(0 0 0 / 50%);
39+
border-radius: 15px;
40+
margin-left: 5px;
41+
padding: 5px 10px;
42+
cursor: pointer;
4443
}
44+
}
4545

46-
.artplayer-plugin-ads-control {
47-
display: none;
48-
position: absolute;
49-
bottom: 10px;
50-
right: 10px;
51-
52-
& > div {
53-
display: flex;
54-
align-items: center;
55-
background-color: rgb(0 0 0 / 50%);
56-
border-radius: 15px;
57-
margin-left: 5px;
58-
padding: 5px 10px;
59-
cursor: pointer;
60-
}
46+
.artplayer-plugin-ads-control {
47+
display: none;
48+
position: absolute;
49+
bottom: 10px;
50+
right: 10px;
6151

62-
.art-icon svg {
63-
width: 20px;
64-
height: 20px;
65-
}
52+
& > div {
53+
display: flex;
54+
align-items: center;
55+
background-color: rgb(0 0 0 / 50%);
56+
border-radius: 15px;
57+
margin-left: 5px;
58+
padding: 5px 10px;
59+
cursor: pointer;
6660
}
6761

68-
.artplayer-plugin-ads-loading {
69-
display: flex;
70-
align-items: center;
71-
justify-content: center;
72-
position: absolute;
73-
left: 0;
74-
top: 0;
75-
right: 0;
76-
bottom: 0;
77-
width: 100%;
78-
height: 100%;
62+
.art-icon svg {
63+
width: 20px;
64+
height: 20px;
7965
}
66+
}
67+
68+
.artplayer-plugin-ads-loading {
69+
display: flex;
70+
align-items: center;
71+
justify-content: center;
72+
position: absolute;
73+
left: 0;
74+
top: 0;
75+
right: 0;
76+
bottom: 0;
77+
width: 100%;
78+
height: 100%;
79+
}
8080
}

‎packages/artplayer-plugin-asr/src/style.less‎

Lines changed: 27 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,31 @@
11
.art-video-player {
2-
.art-layer-asr {
3-
pointer-events: none !important;
4-
position: absolute;
5-
z-index: 150;
6-
inset: 0px;
7-
display: flex;
8-
flex-direction: column;
9-
justify-content: end;
10-
padding: 0 2%;
11-
font-size: 1rem;
12-
gap: var(--art-subtitle-gap);
13-
padding-bottom: var(--art-subtitle-bottom);
14-
transition: padding-bottom var(--art-transition-duration) ease;
15-
text-shadow:
16-
var(--art-subtitle-border) 1px 0 1px,
17-
var(--art-subtitle-border) 0 1px 1px,
18-
var(--art-subtitle-border) -1px 0 1px,
19-
var(--art-subtitle-border) 0 -1px 1px,
20-
var(--art-subtitle-border) 1px 1px 1px,
21-
var(--art-subtitle-border) -1px -1px 1px,
22-
var(--art-subtitle-border) 1px -1px 1px,
23-
var(--art-subtitle-border) -1px 1px 1px;
24-
}
2+
.art-layer-asr {
3+
pointer-events: none !important;
4+
position: absolute;
5+
z-index: 150;
6+
inset: 0px;
7+
display: flex;
8+
flex-direction: column;
9+
justify-content: end;
10+
padding: 0 2%;
11+
font-size: 1rem;
12+
gap: var(--art-subtitle-gap);
13+
padding-bottom: var(--art-subtitle-bottom);
14+
transition: padding-bottom var(--art-transition-duration) ease;
15+
text-shadow:
16+
var(--art-subtitle-border) 1px 0 1px,
17+
var(--art-subtitle-border) 0 1px 1px,
18+
var(--art-subtitle-border) -1px 0 1px,
19+
var(--art-subtitle-border) 0 -1px 1px,
20+
var(--art-subtitle-border) 1px 1px 1px,
21+
var(--art-subtitle-border) -1px -1px 1px,
22+
var(--art-subtitle-border) 1px -1px 1px,
23+
var(--art-subtitle-border) -1px 1px 1px;
24+
}
2525

26-
&.art-control-show {
27-
.art-layer-asr {
28-
padding-bottom: calc(var(--art-control-height) + var(--art-subtitle-bottom));
29-
}
26+
&.art-control-show {
27+
.art-layer-asr {
28+
padding-bottom: calc(var(--art-control-height) + var(--art-subtitle-bottom));
3029
}
30+
}
3131
}

‎packages/artplayer-plugin-chapter/src/style.less‎

Lines changed: 62 additions & 60 deletions
Original file line numberDiff line numberDiff line change
@@ -1,72 +1,74 @@
11
.artplayer-plugin-chapter {
2-
.art-control-progress-inner {
3-
height: 100% !important;
4-
background-color: transparent !important;
2+
.art-control-progress-inner {
3+
height: 100% !important;
4+
background-color: transparent !important;
55

6-
&>.art-progress-hover,
7-
&>.art-progress-loaded,
8-
&>.art-progress-played {
9-
display: none !important;
10-
}
6+
& > .art-progress-hover,
7+
& > .art-progress-loaded,
8+
& > .art-progress-played {
9+
display: none !important;
1110
}
11+
}
1212

13-
.art-control-thumbnails {
14-
bottom: calc(var(--art-bottom-gap) + 64px) !important;
15-
}
13+
.art-control-thumbnails {
14+
bottom: calc(var(--art-bottom-gap) + 64px) !important;
15+
}
1616

17-
.art-chapters {
18-
position: absolute;
19-
z-index: 0;
20-
inset: 0;
21-
display: flex;
22-
align-items: center;
23-
gap: 4px;
24-
height: 100%;
25-
transform: scaleY(1.25);
17+
.art-chapters {
18+
position: absolute;
19+
z-index: 0;
20+
inset: 0;
21+
display: flex;
22+
align-items: center;
23+
gap: 4px;
24+
height: 100%;
25+
transform: scaleY(1.25);
2626

27-
.art-chapter {
28-
display: flex;
29-
align-items: center;
30-
height: 100%;
27+
.art-chapter {
28+
display: flex;
29+
align-items: center;
30+
height: 100%;
3131

32-
.art-chapter-inner {
33-
position: relative;
34-
cursor: pointer;
35-
width: 100%;
36-
height: 50%;
37-
border-radius: 10px;
38-
overflow: hidden;
39-
transition: height var(--art-transition-duration) ease;
40-
background-color: var(--art-progress-color);
41-
}
32+
.art-chapter-inner {
33+
position: relative;
34+
cursor: pointer;
35+
width: 100%;
36+
height: 50%;
37+
border-radius: 10px;
38+
overflow: hidden;
39+
transition: height var(--art-transition-duration) ease;
40+
background-color: var(--art-progress-color);
41+
}
4242

43-
&:hover .art-chapter-inner {
44-
height: 100%;
45-
}
46-
}
43+
&:hover .art-chapter-inner {
44+
height: 100%;
45+
}
4746
}
47+
}
4848

49-
.art-chapter-title {
50-
transform-origin: bottom center;
51-
transform: scale(0.5);
52-
opacity: 0;
53-
position: absolute;
54-
z-index: 70;
55-
top: -50px;
56-
left: 0;
57-
padding: 3px 5px;
58-
line-height: 1;
59-
font-size: 14px;
60-
border-radius: var(--art-border-radius);
61-
white-space: nowrap;
62-
background-color: var(--art-tip-background);
63-
transition: transform var(--art-transition-duration) ease, opacity var(--art-transition-duration) ease;
64-
}
49+
.art-chapter-title {
50+
transform-origin: bottom center;
51+
transform: scale(0.5);
52+
opacity: 0;
53+
position: absolute;
54+
z-index: 70;
55+
top: -50px;
56+
left: 0;
57+
padding: 3px 5px;
58+
line-height: 1;
59+
font-size: 14px;
60+
border-radius: var(--art-border-radius);
61+
white-space: nowrap;
62+
background-color: var(--art-tip-background);
63+
transition:
64+
transform var(--art-transition-duration) ease,
65+
opacity var(--art-transition-duration) ease;
66+
}
6567

66-
&.art-progress-hover {
67-
.art-chapter-title {
68-
transform: scale(1);
69-
opacity: 1;
70-
}
68+
&.art-progress-hover {
69+
.art-chapter-title {
70+
transform: scale(1);
71+
opacity: 1;
7172
}
72-
}
73+
}
74+
}

0 commit comments

Comments
 (0)