Commit 38e8fbaa authored by liujiangnan's avatar liujiangnan

feat

parent d9682a2b
.thumbnail-container{position:absolute;bottom:-150px;left:0;right:0;height:140px;background-color:#505050e6;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:#ffffff4d;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:#ffffff1a}.thumbnail-item .page-number{position:absolute;bottom:5px;left:50%;transform:translate(-50%);background-color:#000000b3;color:#fff;padding:2px 8px;border-radius:10px;font-size:12px}.thumbnail-list::-webkit-scrollbar{height:8px}.thumbnail-list::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}.thumbnail-list::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.thumbnail-list::-webkit-scrollbar-thumb:hover{background:#ffffff80}.error-message[data-v-13144342]{display:flex;justify-content:center;align-items:center;height:100%;font-size:16px;color:#666}.page-buttons-container[data-v-13144342]{position:absolute;bottom:20px;right:20px;display:flex;gap:15px;z-index:1000}.page-button[data-v-13144342]{width:50px;height:50px;background-color:#50505099;border-radius:25px;border:1px solid rgba(255,255,255,.3);color:#ffffffe6;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-13144342]:hover{background-color:#3c3c3ccc;transform:scale(1.1)}.page-button[data-v-13144342]:active{transform:scale(.95)}.arrow[data-v-13144342]{border:solid white;border-width:0 2px 2px 0;display:inline-block;padding:4px}.left[data-v-13144342]{transform:rotate(135deg);margin-left:4px}.right[data-v-13144342]{transform:rotate(-45deg);margin-right:4px}.menu-icon[data-v-13144342]{width:18px;height:14px;position:relative;border-top:2px solid white;border-bottom:2px solid white}.menu-icon[data-v-13144342]:before{content:"";position:absolute;top:50%;left:0;width:100%;height:2px;background-color:#fff;transform:translateY(-50%)}.thumbnail-container[data-v-13144342]{position:fixed;bottom:-150px;left:0;right:0;height:140px;background-color:#505050e6;transition:bottom .3s ease;z-index:999}.thumbnail-container.show[data-v-13144342]{bottom:0}.thumbnail-list[data-v-13144342]{display:flex;overflow-x:auto;padding:10px;gap:10px;height:100%}.thumbnail-item[data-v-13144342]{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-13144342]{width:100%;height:100%;object-fit:cover;border-radius:4px;border:2px solid transparent;transition:all .2s ease}.thumbnail-item.active[data-v-13144342]{background-color:#ffffff4d;transform:scale(1.05);box-shadow:0 0 10px #ffffff80}.thumbnail-item.active img[data-v-13144342]{border-color:#fff}.thumbnail-item .page-number[data-v-13144342]{position:absolute;bottom:5px;left:50%;transform:translate(-50%);background-color:#000000b3;color:#fff;padding:2px 8px;border-radius:10px;font-size:12px}.thumbnail-item[data-v-13144342]:hover:not(.active){transform:scale(1.05);background-color:#ffffff1a}.thumbnail-list[data-v-13144342]::-webkit-scrollbar{height:8px}.thumbnail-list[data-v-13144342]::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}.thumbnail-list[data-v-13144342]::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.thumbnail-list[data-v-13144342]::-webkit-scrollbar-thumb:hover{background:#ffffff80}
.thumbnail-container{position:fixed;bottom:-150px;left:0;right:0;height:140px;background-color:#505050e6;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:#ffffff4d;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:#ffffff1a}.thumbnail-item .page-number{position:absolute;bottom:5px;left:50%;transform:translate(-50%);background-color:#000000b3;color:#fff;padding:2px 8px;border-radius:10px;font-size:12px}.thumbnail-list::-webkit-scrollbar{height:8px}.thumbnail-list::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}.thumbnail-list::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.thumbnail-list::-webkit-scrollbar-thumb:hover{background:#ffffff80}.error-message[data-v-f9602698]{display:flex;justify-content:center;align-items:center;height:100%;font-size:16px;color:#666}.page-buttons-container[data-v-f9602698]{position:fixed;bottom:20px;right:20px;display:flex;gap:15px;z-index:1000}.page-button[data-v-f9602698]{width:50px;height:50px;background-color:#50505099;border-radius:25px;border:1px solid rgba(255,255,255,.3);color:#ffffffe6;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-f9602698]:hover{background-color:#3c3c3ccc;transform:scale(1.1)}.page-button[data-v-f9602698]:active{transform:scale(.95)}.arrow[data-v-f9602698]{border:solid white;border-width:0 2px 2px 0;display:inline-block;padding:4px}.left[data-v-f9602698]{transform:rotate(135deg);margin-left:4px}.right[data-v-f9602698]{transform:rotate(-45deg);margin-right:4px}.menu-icon[data-v-f9602698]{width:18px;height:14px;position:relative;border-top:2px solid white;border-bottom:2px solid white}.menu-icon[data-v-f9602698]:before{content:"";position:absolute;top:50%;left:0;width:100%;height:2px;background-color:#fff;transform:translateY(-50%)}.thumbnail-container[data-v-f9602698]{position:fixed;bottom:-150px;left:0;right:0;height:140px;background-color:#505050e6;transition:bottom .3s ease;z-index:999}.thumbnail-container.show[data-v-f9602698]{bottom:0}.thumbnail-list[data-v-f9602698]{display:flex;overflow-x:auto;padding:10px;gap:10px;height:100%}.thumbnail-item[data-v-f9602698]{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-f9602698]{width:100%;height:100%;object-fit:cover;border-radius:4px;border:2px solid transparent;transition:all .2s ease}.thumbnail-item.active[data-v-f9602698]{background-color:#ffffff4d;transform:scale(1.05);box-shadow:0 0 10px #ffffff80}.thumbnail-item.active img[data-v-f9602698]{border-color:#fff}.thumbnail-item .page-number[data-v-f9602698]{position:absolute;bottom:5px;left:50%;transform:translate(-50%);background-color:#000000b3;color:#fff;padding:2px 8px;border-radius:10px;font-size:12px}.thumbnail-item[data-v-f9602698]:hover:not(.active){transform:scale(1.05);background-color:#ffffff1a}.thumbnail-list[data-v-f9602698]::-webkit-scrollbar{height:8px}.thumbnail-list[data-v-f9602698]::-webkit-scrollbar-track{background:#0000001a;border-radius:4px}.thumbnail-list[data-v-f9602698]::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:4px}.thumbnail-list[data-v-f9602698]::-webkit-scrollbar-thumb:hover{background:#ffffff80}
...@@ -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-LG8DS8SY.js"></script> <script type="module" crossorigin src="assets/index-CQZYGyzW.js"></script>
<link rel="stylesheet" crossorigin href="assets/index-DxwsA9db.css"> <link rel="stylesheet" crossorigin href="assets/index-BEMBr7N-.css">
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>
......
...@@ -209,7 +209,7 @@ const getProxiedUrl = (url) => { ...@@ -209,7 +209,7 @@ const getProxiedUrl = (url) => {
</template> </template>
<template <template
v-if="url.indexOf(`.ppt`) > 0 || url.indexOf(`.PPT`) > 0 || url.indexOf(`.pptx`) > 0 || url.indexOf(`.PPTX`) > 0"> v-if="url.indexOf(`.ppt`) > 0 || url.indexOf(`.PPT`) > 0 || url.indexOf(`.pptx`) > 0 || url.indexOf(`.PPTX`) > 0">
<div style="height: 100vh; position: relative;"> <div style="height: 100vh; position: relative; overflow: hidden;">
<div v-if="showErrorMsg" class="error-message"> <div v-if="showErrorMsg" class="error-message">
课件正在生成中,请过一会儿再尝试 课件正在生成中,请过一会儿再尝试
</div> </div>
...@@ -247,7 +247,7 @@ const getProxiedUrl = (url) => { ...@@ -247,7 +247,7 @@ const getProxiedUrl = (url) => {
.page-buttons-container { .page-buttons-container {
/* 固定在右下角 */ /* 固定在右下角 */
position: fixed; position: absolute;
bottom: 20px; bottom: 20px;
right: 20px; right: 20px;
......
/* 缩略图容器样式 */ /* 缩略图容器样式 */
.thumbnail-container { .thumbnail-container {
position: fixed; position: absolute;
bottom: -150px; bottom: -150px;
left: 0; left: 0;
right: 0; right: 0;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment