Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
P
play_office
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
template admin
play_office
Commits
4d6dd087
Commit
4d6dd087
authored
Nov 12, 2024
by
liujiangnan
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 全功能PPT
parent
caae00fd
Changes
6
Expand all
Show whitespace changes
Inline
Side-by-side
Showing
6 changed files
with
405 additions
and
60 deletions
+405
-60
index-B3npc05E.css
play/assets/index-B3npc05E.css
+0
-1
index-D5frsKoS.css
play/assets/index-D5frsKoS.css
+1
-0
index-D6v_bxeY.js
play/assets/index-D6v_bxeY.js
+16
-13
index.html
play/index.html
+2
-2
App.vue
vue-proj/vue-project/src/App.vue
+296
-44
thumbnail.css
vue-proj/vue-project/src/assets/thumbnail.css
+90
-0
No files found.
play/assets/index-B3npc05E.css
deleted
100644 → 0
View file @
caae00fd
.error-message
[
data-v-123e5f17
]
{
display
:
flex
;
justify-content
:
center
;
align-items
:
center
;
height
:
100%
;
font-size
:
16px
;
color
:
#666
}
.page-buttons
[
data-v-123e5f17
]
{
position
:
fixed
;
right
:
20px
;
bottom
:
20px
;
z-index
:
1000
;
display
:
flex
;
gap
:
10px
}
.arrow-button
[
data-v-123e5f17
]
{
width
:
40px
;
height
:
40px
;
border-radius
:
50%
;
border
:
none
;
background-color
:
#409eff
;
cursor
:
pointer
;
display
:
flex
;
align-items
:
center
;
justify-content
:
center
;
transition
:
all
.3s
}
.arrow-button
[
data-v-123e5f17
]
:hover
{
background-color
:
#66b1ff
}
.arrow-button
[
data-v-123e5f17
]
:disabled
{
background-color
:
#c0c4cc
;
cursor
:
not-allowed
}
.arrow
[
data-v-123e5f17
]
{
border
:
solid
white
;
border-width
:
0
2px
2px
0
;
display
:
inline-block
;
padding
:
4px
}
.left
[
data-v-123e5f17
]
{
transform
:
rotate
(
135deg
);
margin-left
:
4px
}
.right
[
data-v-123e5f17
]
{
transform
:
rotate
(
-45deg
);
margin-right
:
4px
}
play/assets/index-D5frsKoS.css
0 → 100644
View file @
4d6dd087
.thumbnail-container
{
position
:
fixed
;
bottom
:
-150px
;
left
:
0
;
right
:
0
;
height
:
140px
;
background-color
:
#505050
e6
;
transition
:
bottom
.3s
ease
;
z-index
:
999
}
.thumbnail-container.show
{
bottom
:
0
}
.thumbnail-list
{
display
:
flex
;
overflow-x
:
auto
;
padding
:
10px
;
gap
:
10px
;
height
:
100%
}
.thumbnail-item
{
flex
:
0
0
auto
;
width
:
160px
;
height
:
120px
;
position
:
relative
;
cursor
:
pointer
;
transition
:
all
.2s
ease
;
padding
:
2px
;
border-radius
:
4px
;
background-color
:
transparent
}
.thumbnail-item
img
{
width
:
100%
;
height
:
100%
;
object-fit
:
cover
;
border-radius
:
4px
;
border
:
2px
solid
transparent
;
transition
:
all
.2s
ease
}
.thumbnail-item.active
{
background-color
:
#ffffff4
d
;
transform
:
scale
(
1.05
);
box-shadow
:
0
0
10px
#ffffff80
}
.thumbnail-item.active
img
{
border-color
:
#fff
}
.thumbnail-item
:hover:not
(
.active
)
{
transform
:
scale
(
1.05
);
background-color
:
#ffffff1
a
}
.thumbnail-item
.page-number
{
position
:
absolute
;
bottom
:
5px
;
left
:
50%
;
transform
:
translate
(
-50%
);
background-color
:
#000000
b3
;
color
:
#fff
;
padding
:
2px
8px
;
border-radius
:
10px
;
font-size
:
12px
}
.thumbnail-list
::-webkit-scrollbar
{
height
:
8px
}
.thumbnail-list
::-webkit-scrollbar-track
{
background
:
#0000001
a
;
border-radius
:
4px
}
.thumbnail-list
::-webkit-scrollbar-thumb
{
background
:
#ffffff4
d
;
border-radius
:
4px
}
.thumbnail-list
::-webkit-scrollbar-thumb:hover
{
background
:
#ffffff80
}
.error-message
[
data-v-5e90ea40
]
{
display
:
flex
;
justify-content
:
center
;
align-items
:
center
;
height
:
100%
;
font-size
:
16px
;
color
:
#666
}
.page-buttons-container
[
data-v-5e90ea40
]
{
position
:
fixed
;
bottom
:
20px
;
right
:
20px
;
display
:
flex
;
gap
:
15px
;
z-index
:
1000
}
.page-button
[
data-v-5e90ea40
]
{
width
:
50px
;
height
:
50px
;
background-color
:
#50505099
;
border-radius
:
25px
;
border
:
1px
solid
rgba
(
255
,
255
,
255
,
.3
);
color
:
#ffffff
e6
;
font-size
:
24px
;
display
:
flex
;
align-items
:
center
;
justify-content
:
center
;
cursor
:
pointer
;
transition
:
all
.3s
ease
;
box-shadow
:
0
2px
6px
#00000026
}
.page-button
[
data-v-5e90ea40
]
:hover
{
background-color
:
#3c3c3c
cc
;
transform
:
scale
(
1.1
)}
.page-button
[
data-v-5e90ea40
]
:active
{
transform
:
scale
(
.95
)}
.arrow
[
data-v-5e90ea40
]
{
border
:
solid
white
;
border-width
:
0
2px
2px
0
;
display
:
inline-block
;
padding
:
4px
}
.left
[
data-v-5e90ea40
]
{
transform
:
rotate
(
135deg
);
margin-left
:
4px
}
.right
[
data-v-5e90ea40
]
{
transform
:
rotate
(
-45deg
);
margin-right
:
4px
}
.menu-icon
[
data-v-5e90ea40
]
{
width
:
18px
;
height
:
14px
;
position
:
relative
;
border-top
:
2px
solid
white
;
border-bottom
:
2px
solid
white
}
.menu-icon
[
data-v-5e90ea40
]
:before
{
content
:
""
;
position
:
absolute
;
top
:
50%
;
left
:
0
;
width
:
100%
;
height
:
2px
;
background-color
:
#fff
;
transform
:
translateY
(
-50%
)}
.thumbnail-container
[
data-v-5e90ea40
]
{
position
:
fixed
;
bottom
:
-150px
;
left
:
0
;
right
:
0
;
height
:
140px
;
background-color
:
#505050
e6
;
transition
:
bottom
.3s
ease
;
z-index
:
999
}
.thumbnail-container.show
[
data-v-5e90ea40
]
{
bottom
:
0
}
.thumbnail-list
[
data-v-5e90ea40
]
{
display
:
flex
;
overflow-x
:
auto
;
padding
:
10px
;
gap
:
10px
;
height
:
100%
}
.thumbnail-item
[
data-v-5e90ea40
]
{
flex
:
0
0
auto
;
width
:
100px
;
height
:
120px
;
position
:
relative
;
cursor
:
pointer
;
transition
:
all
.2s
ease
;
padding
:
2px
;
border-radius
:
4px
}
.thumbnail-item
img
[
data-v-5e90ea40
]
{
width
:
100%
;
height
:
100%
;
object-fit
:
cover
;
border-radius
:
4px
;
border
:
2px
solid
transparent
;
transition
:
all
.2s
ease
}
.thumbnail-item.active
[
data-v-5e90ea40
]
{
background-color
:
#ffffff4
d
;
transform
:
scale
(
1.05
);
box-shadow
:
0
0
10px
#ffffff80
}
.thumbnail-item.active
img
[
data-v-5e90ea40
]
{
border-color
:
#fff
}
.thumbnail-item
.page-number
[
data-v-5e90ea40
]
{
position
:
absolute
;
bottom
:
5px
;
left
:
50%
;
transform
:
translate
(
-50%
);
background-color
:
#000000
b3
;
color
:
#fff
;
padding
:
2px
8px
;
border-radius
:
10px
;
font-size
:
12px
}
.thumbnail-item
[
data-v-5e90ea40
]
:hover:not
(
.active
)
{
transform
:
scale
(
1.05
);
background-color
:
#ffffff1
a
}
.thumbnail-list
[
data-v-5e90ea40
]
::-webkit-scrollbar
{
height
:
8px
}
.thumbnail-list
[
data-v-5e90ea40
]
::-webkit-scrollbar-track
{
background
:
#0000001
a
;
border-radius
:
4px
}
.thumbnail-list
[
data-v-5e90ea40
]
::-webkit-scrollbar-thumb
{
background
:
#ffffff4
d
;
border-radius
:
4px
}
.thumbnail-list
[
data-v-5e90ea40
]
::-webkit-scrollbar-thumb:hover
{
background
:
#ffffff80
}
play/assets/index-
B3XZ3Y4E
.js
→
play/assets/index-
D6v_bxeY
.js
View file @
4d6dd087
This diff is collapsed.
Click to expand it.
play/index.html
View file @
4d6dd087
...
@@ -4,8 +4,8 @@
...
@@ -4,8 +4,8 @@
<meta
charset=
"UTF-8"
>
<meta
charset=
"UTF-8"
>
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<meta
name=
"viewport"
content=
"width=device-width, initial-scale=1.0"
>
<script
type=
"text/javascript"
src=
"//staging-teach.cdn.ireadabc.com/h5template/h5-static-lib/js/air.js"
></script>
<script
type=
"text/javascript"
src=
"//staging-teach.cdn.ireadabc.com/h5template/h5-static-lib/js/air.js"
></script>
<script
type=
"module"
crossorigin
src=
"assets/index-
B3XZ3Y4E
.js"
></script>
<script
type=
"module"
crossorigin
src=
"assets/index-
D6v_bxeY
.js"
></script>
<link
rel=
"stylesheet"
crossorigin
href=
"assets/index-
B3npc05E
.css"
>
<link
rel=
"stylesheet"
crossorigin
href=
"assets/index-
D5frsKoS
.css"
>
</head>
</head>
<body>
<body>
<div
id=
"app"
></div>
<div
id=
"app"
></div>
...
...
vue-proj/vue-project/src/App.vue
View file @
4d6dd087
This diff is collapsed.
Click to expand it.
vue-proj/vue-project/src/assets/thumbnail.css
0 → 100644
View file @
4d6dd087
/* 缩略图容器样式 */
.thumbnail-container
{
position
:
fixed
;
bottom
:
-150px
;
left
:
0
;
right
:
0
;
height
:
140px
;
background-color
:
rgba
(
80
,
80
,
80
,
0.9
);
transition
:
bottom
0.3s
ease
;
z-index
:
999
;
}
.thumbnail-container.show
{
bottom
:
0
;
}
.thumbnail-list
{
display
:
flex
;
overflow-x
:
auto
;
padding
:
10px
;
gap
:
10px
;
height
:
100%
;
}
.thumbnail-item
{
flex
:
0
0
auto
;
width
:
160px
;
height
:
120px
;
position
:
relative
;
cursor
:
pointer
;
transition
:
all
0.2s
ease
;
padding
:
2px
;
border-radius
:
4px
;
background-color
:
transparent
;
}
.thumbnail-item
img
{
width
:
100%
;
height
:
100%
;
object-fit
:
cover
;
border-radius
:
4px
;
border
:
2px
solid
transparent
;
transition
:
all
0.2s
ease
;
}
.thumbnail-item.active
{
background-color
:
rgba
(
255
,
255
,
255
,
0.3
);
transform
:
scale
(
1.05
);
box-shadow
:
0
0
10px
rgba
(
255
,
255
,
255
,
0.5
);
}
.thumbnail-item.active
img
{
border-color
:
#fff
;
}
.thumbnail-item
:hover:not
(
.active
)
{
transform
:
scale
(
1.05
);
background-color
:
rgba
(
255
,
255
,
255
,
0.1
);
}
.thumbnail-item
.page-number
{
position
:
absolute
;
bottom
:
5px
;
left
:
50%
;
transform
:
translateX
(
-50%
);
background-color
:
rgba
(
0
,
0
,
0
,
0.7
);
color
:
white
;
padding
:
2px
8px
;
border-radius
:
10px
;
font-size
:
12px
;
}
/* 滚动条样式 */
.thumbnail-list
::-webkit-scrollbar
{
height
:
8px
;
}
.thumbnail-list
::-webkit-scrollbar-track
{
background
:
rgba
(
0
,
0
,
0
,
0.1
);
border-radius
:
4px
;
}
.thumbnail-list
::-webkit-scrollbar-thumb
{
background
:
rgba
(
255
,
255
,
255
,
0.3
);
border-radius
:
4px
;
}
.thumbnail-list
::-webkit-scrollbar-thumb:hover
{
background
:
rgba
(
255
,
255
,
255
,
0.5
);
}
\ No newline at end of file
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment