style(notice): replace scoped CSS with inline Tailwind classes

remove unused scoped CSS styles from both the notice page and notice message component, and replace all existing class-based styling with inline Tailwind utilities

src/pages/home/components/NoticeMessage/index.vue

@@ -11,7 +11,7 @@
             <span class="text-[#0CCD58] text-[10px] text-[500]">
               {{ t("home.notice.publishedAt") }}{{ item.effectiveStartTime }}
             </span>
-            <span class="text-[#0CCD58] text-[10px] text-[500] underline-text">
+            <span class="text-[#0CCD58] text-[10px] text-[500] underline decoration-[#0CCD58]">
               {{ t("home.notice.detail") }}
             </span>
           </div>
@@ -21,8 +21,10 @@
   </div>
 
   <div v-else-if="tipsMessage">
-    <div class="noMessage">
-      <span class="noMessage-text text-[#0CCD58] text-[12px] text-[600]">
+    <div
+      class="mt-[8px] inline-flex box-border w-fit max-w-full rounded-[8px] border border-[#C7D2FE] bg-[#EBEFFF] px-[12px] py-[4px] shadow-[0px_1px_2px_0px_rgba(0,0,0,0.05)]">
+      <span
+        class="text-[#0CCD58] text-[12px] text-[600] leading-[18px] whitespace-normal [overflow-wrap:break-word] break-all">
         {{ tipsMessage }}
       </span>
     </div>
@@ -80,30 +82,3 @@ const clickItem = (item) => {
 }
 
 </script>
-
-<style lang="scss" scoped>
-.underline-text {
-  text-decoration: underline;
-  text-decoration-color: #0CCD58;
-}
-
-.noMessage {
-  display: inline-flex;
-  margin-top: 8px;
-  padding: 4px 12px;
-  background: #EBEFFF;
-  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.05);
-  border-radius: 8px;
-  border: 1px solid #C7D2FE;
-  width: fit-content;
-  max-width: 100%;
-  box-sizing: border-box;
-}
-
-.noMessage-text {
-  line-height: 18px;
-  white-space: normal;
-  overflow-wrap: break-word;
-  word-break: break-all;
-}
-</style>

src/pages/notice/index.vue

@@ -13,7 +13,8 @@
         <div class="pt-[16px] px-[12px] pb-[24px] ">
           <div class="text-[#171717] text-[16px] font-semibold">{{ detailTitle }}</div>
 
-          <div v-if="publishTime" class="notice-time-tag flex flex-row items-center mt-[16px]">
+          <div v-if="publishTime"
+            class="mt-[16px] inline-flex h-[28px] flex-row items-center rounded-[14px] border border-[#d6dde8] bg-[linear-gradient(180deg,#f4f7fb_0%,#e9eef6_100%)] px-[12px] py-[6px]">
             <uni-icons type="clock" size="18" color="#5A6780" />
             <span class="text-[#171717] text-[12px] font-semibold ml-[8px]">{{ t("home.notice.publishedAt") }}{{
               publishTime }}</span>
@@ -83,15 +84,3 @@ watch(
 );
 
 </script>
-
-<style lang="scss" scoped>
-.notice-time-tag {
-  display: inline-flex;
-  height: 28px;
-  padding: 6px 12px;
-  background: linear-gradient(180deg, #f4f7fb 0%, #e9eef6 100%);
-  border: 1px solid #d6dde8;
-  border-radius: 14px;
-  box-sizing: border-box;
-}
-</style>