💄 首页UI调整

src/components/home/t-calendar-birth.vue

@@ -49,7 +49,7 @@ onBeforeMount(async () => {
   next.value = TSAvatarBirth.getNextAvatarBirth();
 });
 
-function toBirth(type: TGApp.Archive.Birth.RoleItem | true) {
+function toBirth(type: TGApp.Archive.Birth.RoleItem) {
   let dateStr;
   if (type === true) {
     const date = new Date();
@@ -59,7 +59,7 @@ function toBirth(type: TGApp.Archive.Birth.RoleItem | true) {
   } else {
     dateStr = type.role_birthday;
   }
-  if (type != true) {
+  if (type !== true) {
     router.push({ name: "留影叙佳期", params: { date: dateStr } });
     return;
   }
@@ -72,20 +72,23 @@ function toBirth(type: TGApp.Archive.Birth.RoleItem | true) {
 }
 
 function parseDesc(intro: string): string {
-  const dom = document.createElement("div");
-  dom.innerHTML = intro;
-  return dom.innerText;
+  const dom = new DOMParser().parseFromString(intro, "text/html");
+  return dom.body.textContent || "";
 }
 </script>
 <style lang="css" scoped>
 .tcb-container {
+  display: flex;
   width: 100%;
   height: 100%;
-  padding: 10px;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: flex-start;
+  padding: 5px;
   border-radius: 5px;
-  box-shadow: 0 0 5px inset var(--common-shadow-2);
+  box-shadow: 0 0 5px inset var(--common-shadow-1);
   overflow-y: auto;
-  row-gap: 10px;
+  row-gap: 5px;
 }
 
 .tcb-top-none,
@@ -93,13 +96,12 @@ function parseDesc(intro: string): string {
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-bottom: 10px;
 }
 
 .tcb-top-none img,
 .tcb-top-active img {
-  width: 50px;
-  height: 50px;
+  width: 40px;
+  height: 40px;
 }
 
 .tcb-top-active img.active {
@@ -108,8 +110,8 @@ function parseDesc(intro: string): string {
 }
 
 .tcb-top-active img.tcb-cur {
-  width: 50px;
-  height: 50px;
+  width: 40px;
+  height: 40px;
   border-radius: 50%;
   background: var(--common-shadow-1);
 }
@@ -122,7 +124,6 @@ function parseDesc(intro: string): string {
   justify-content: flex-start;
   padding: 5px;
   border-radius: 10px;
-  margin-top: 10px;
   background: var(--box-bg-1);
 }
 

src/components/home/t-homecard.vue

@@ -23,10 +23,10 @@ const props = defineProps<THomeCardProps>();
   position: relative;
   min-height: 100px;
   padding: 20px 10px 10px;
-  border: 1px solid var(--common-shadow-1);
+  border: 1px solid var(--common-shadow-2);
   border-radius: 5px;
   margin-top: 30px;
-  box-shadow: 5px 5px 10px var(--common-shadow-2);
+  box-shadow: 2px 2px 5px var(--common-shadow-1);
 }
 
 .thc-title,
@@ -38,8 +38,7 @@ const props = defineProps<THomeCardProps>();
   justify-content: center;
   padding: 0 10px;
   border-radius: 5px;
-  background: var(--box-bg-blue);
-  box-shadow: 0 0 5px var(--common-shadow-2);
+  background: var(--tgc-od-blue);
   font-family: var(--font-title);
 }
 

src/components/home/t-pool.vue

@@ -86,7 +86,7 @@ interface TPoolEmits {
 
 const emits = defineEmits<TPoolEmits>();
 
-function poolLastInterval(postId: number): TGApp.Plugins.Mys.Gacha.RenderCard | undefined {
+function poolLastInterval(postId: number): TGApp.Plugins.Mys.Gacha.RenderCard {
   const pool = poolCards.value.find((pool) => pool.postId === postId);
   if (!pool) return;
   if (poolTimeGet.value[postId] === "未开始") {
@@ -206,7 +206,7 @@ function getCBox(info: TGApp.App.Character.WikiBriefInfo): TItemBoxData {
     display: "inner",
     clickable: true,
     lt: `/icon/element/${info.element}元素.webp`,
-    ltSize: "20px",
+    ltSize: "15px",
     innerHeight: 20,
     innerIcon: `/icon/weapon/${info.weapon}.webp`,
     innerText: info.name,
@@ -258,7 +258,7 @@ onUnmounted(() => {
   width: 100%;
   border-radius: 5px;
   aspect-ratio: 69 / 32;
-  box-shadow: 0 5px 5px var(--common-shadow-4);
+  box-shadow: 2px 2px 5px var(--common-shadow-2);
 }
 
 .pool-cover {

src/components/home/t-position.vue

@@ -119,7 +119,7 @@ onUnmounted(() => {
   display: grid;
   margin-top: 10px;
   grid-gap: 20px;
-  grid-template-columns: repeat(auto-fill, minmax(calc(400px + 2rem), 1fr));
+  grid-template-columns: repeat(auto-fill, minmax(calc(400px + 2rem), 0.5fr));
 }
 
 .position-card {