Просмотр исходного кода

style(Student): 替换作业提交按钮为自定义SVG图标

更新作业提交按钮样式,移除原有边框样式,使用自定义SVG图标替代原有图标,提升视觉一致性
lsc 1 день назад
Родитель
Сommit
ab5359766b
1 измененных файлов с 24 добавлено и 3 удалено
  1. 24 3
      src/views/Student/index.vue

+ 24 - 3
src/views/Student/index.vue

@@ -123,7 +123,26 @@
               </div>
               </div>
               <div class="slide-bottom-right" v-if="!isFullscreen">
               <div class="slide-bottom-right" v-if="!isFullscreen">
                 <Refresh class="tool-btn" v-tooltip="lang.ssRefresh" @click="handleRefreshPage" v-if="currentSlideHasIframe"/>
                 <Refresh class="tool-btn" v-tooltip="lang.ssRefresh" @click="handleRefreshPage" v-if="currentSlideHasIframe"/>
-                <UpTwo @click="handleHomeworkSubmit" v-if="currentSlideHasIframe && !currentSlideHasBilibiliVideo && !isSubmitting" class="tool-btn upBtn" v-tooltip="lang.ssSubmitHW"/>
+                <!-- <UpTwo @click="handleHomeworkSubmit" v-if="currentSlideHasIframe && !currentSlideHasBilibiliVideo && !isSubmitting" class="tool-btn upBtn" v-tooltip="lang.ssSubmitHW"/> -->
+                <svg @click="handleHomeworkSubmit" v-if="currentSlideHasIframe && !currentSlideHasBilibiliVideo && !isSubmitting" class="tool-btn upBtn" v-tooltip="lang.ssSubmitHW" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
+                  <!-- Document body -->
+                  <path d="M15 10 L15 90 Q15 95 20 95 L80 95 Q85 95 85 90 L85 35 L60 10 Z"
+                        fill="none" stroke="currentColor" stroke-width="6" stroke-linejoin="round" stroke-linecap="round"/>
+                  <!-- Folded corner -->
+                  <path d="M60 10 L60 35 L85 35"
+                        fill="none" stroke="currentColor" stroke-width="6" stroke-linejoin="round" stroke-linecap="round"/>
+                  <!-- Upload arrow shaft -->
+                  <line x1="50" y1="72" x2="50" y2="45"
+                        stroke="currentColor" stroke-width="6" stroke-linecap="round"/>
+                  <!-- Arrow head -->
+                  <polyline points="37,57 50,43 63,57"
+                        fill="none" stroke="currentColor" stroke-width="6" stroke-linejoin="round" stroke-linecap="round"/>
+                  <!-- Bottom lines -->
+                  <line x1="36" y1="80" x2="64" y2="80"
+                        stroke="currentColor" stroke-width="6" stroke-linecap="round"/>
+                  <line x1="36" y1="88" x2="64" y2="88"
+                        stroke="currentColor" stroke-width="6" stroke-linecap="round"/>
+                </svg>
                 <IconLoading v-else-if="currentSlideHasIframe && !currentSlideHasBilibiliVideo" class="tool-btn loading" v-tooltip="lang.ssSubmitting"></IconLoading>
                 <IconLoading v-else-if="currentSlideHasIframe && !currentSlideHasBilibiliVideo" class="tool-btn loading" v-tooltip="lang.ssSubmitting"></IconLoading>
                 <IconStopwatchStart v-if="props.type == '1' && courseDetail.userid == props.userid && isFollowModeActive" class="tool-btn" v-tooltip="lang.ssTimer" @click="timerlVisible = !timerlVisible"  />
                 <IconStopwatchStart v-if="props.type == '1' && courseDetail.userid == props.userid && isFollowModeActive" class="tool-btn" v-tooltip="lang.ssTimer" @click="timerlVisible = !timerlVisible"  />
                 <IconWrite v-if="isFollowModeActive && props.type == '1' && courseDetail.userid == props.userid" class="tool-btn" v-tooltip="lang.ssPenTool" @click="writingBoardToolVisible = true"  />
                 <IconWrite v-if="isFollowModeActive && props.type == '1' && courseDetail.userid == props.userid" class="tool-btn" v-tooltip="lang.ssPenTool" @click="writingBoardToolVisible = true"  />
@@ -4933,8 +4952,10 @@ const clearTimerState = () => {
       
       
   }
   }
   .upBtn{
   .upBtn{
-      border-bottom: 3px solid #fff;
-      padding-bottom: 3px;
+      // border-bottom: 3px solid #fff;
+      // padding-bottom: 3px;
+      width: 24px;
+      height: 24px;
 
 
       &:hover,
       &:hover,
       &.active {
       &.active {