dmg/lingxixue-web
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 修改样式

Browse Source
This commit is contained in:
shawko 2026-05-09 11:47:25 +08:00
parent cdd7d2fccc
commit 3e5c5e4817
6 changed files with 52 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/logo.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 22 KiB

34
src/page/task/components/task-list.vue
View File

@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { isWebEvn, OSS_URL } from '@/utils' import { isWebEvn } from '@/utils'
import { import {
task_category_word_review, task_category_word_review,
task_id_word_test, task_id_word_test,
@ -31,9 +31,6 @@ const props = defineProps<{
}>() }>()
const emit = defineEmits(['claim-reward', 'click-reward']) const emit = defineEmits(['claim-reward', 'click-reward'])
defineOptions({ name: 'TaskList' }) defineOptions({ name: 'TaskList' })
const bgImg = computed(() => {
return `url(${OSS_URL}/urm/task_${props.type}.svg) 100%/cover no-repeat`
})
// 执行导学任务 // 执行导学任务
function goToLeadTask(item: any) { function goToLeadTask(item: any) {
@ -212,12 +209,8 @@ function clickReward(item: any) {
</script> </script>
<template> <template>
<div <div class="task-list-outer">
class="task-list" <div class="task-list">
:style="{
background: bgImg,
}"
>
<div <div
v-if="type !== task_type_achievement" v-if="type !== task_type_achievement"
class="task-list-content" class="task-list-content"
@ -242,14 +235,29 @@ function clickReward(item: any) {
></Achievement> ></Achievement>
</div> </div>
</div> </div>
</div>
</template> </template>
<style lang="scss" scoped> <style lang="scss" scoped>
.task-list-outer {
width: 127.33vh;
height: 65.33vh;
margin-top: 14vh;
padding: 1.67vh;
background: #d3ff5f;
border-radius: 3.67vh;
box-sizing: border-box;
}
.task-list { .task-list {
height: 86.42vh; background: #fefeef;
width: 100%; width: 100%;
padding-top: 24vh; height: 100%;
padding-left: 10vh; padding-top: 3.83vh;
padding-left: 4.33vh;
border-radius: 3.33vh;
box-sizing: border-box;
&-content { &-content {
width: 117.33vh; width: 117.33vh;
height: 54.33vh; height: 54.33vh;

2
src/page/task/index.vue
View File

@ -476,7 +476,7 @@ onUnmounted(() => {
width: 100%; width: 100%;
height: 100%; height: 100%;
position: relative; position: relative;
@include main_bg; background: $blue-gradient;
display: flex; display: flex;
gap: 10px; gap: 10px;
padding-left: $space-6; padding-left: $space-6;

3
src/styles/variate.scss
View File

@ -2,7 +2,7 @@
$theme-color: #ffe60f; // 品牌色/主操作按钮/按钮移入/文字链 $theme-color: #ffe60f; // 品牌色/主操作按钮/按钮移入/文字链
$theme-minor-color: #fffbd2; // 品牌色/主操作按钮/按钮移入/文字链 $theme-minor-color: #fffbd2; // 品牌色/主操作按钮/按钮移入/文字链
// 主题色背景 // 主题色背景
$theme-color-bg: #e0ebff; $theme-color-bg: #D4E0F5;
// 辅助颜色 // 辅助颜色
$success-color: #07cc89; $success-color: #07cc89;
@ -80,6 +80,7 @@ $gradient: linear-gradient(180deg, #4de798 0%, #a2fb6e 100%); // 主渐变
$gray_bg: $theme-color-bg; // 灰系背景 $gray_bg: $theme-color-bg; // 灰系背景
$grey-gradient: $theme-color-bg; // 灰系背景 $grey-gradient: $theme-color-bg; // 灰系背景
$white-gradient: $theme-color-bg; // 白系背景 $white-gradient: $theme-color-bg; // 白系背景
$blue-gradient: #7CABFF;// 蓝色背景
$page-fill: #fafafa; $page-fill: #fafafa;
$bg-fill: #fff; $bg-fill: #fff;

2
src/utils/sass.ts
View File

@ -31,7 +31,7 @@ const getCosUrl = (path: any) => {
} }
const getLogo = () => { const getLogo = () => {
return getCosUrl('urm/logo.png') return '/logo.ico'
} }
const getQrCode = () => { const getQrCode = () => {

11
web.html
View File

@ -1,13 +1,10 @@
<!doctype html> <!doctype html>
<html lang="en"> <html lang="en">
<head> <head>
<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">
<link <link rel="icon" href="/logo.ico" />
rel="icon"
type="image/svg+xml"
href="https://lxx-web-1313840333.cos.ap-chengdu.myqcloud.com/urm/logo.png"
/>
<title>灵犀学</title> <title>灵犀学</title>
<style> <style>
body, body,