style: refine styles for changelog important sections in UpdateChangelogModal.vue

Author: CCA3370

src/components/UpdateChangelogModal.vue

@@ -234,25 +234,25 @@ async function openRelease() {
 }
 
 .markdown-content :deep(.changelog-important) {
-  margin: 0 0 1.5rem;
-  padding: 1rem 1.25rem;
-  border: 2px solid rgb(220 38 38);
-  border-radius: 1rem;
+  margin: 0 0 0.875rem;
+  padding: 0.6rem 0.75rem;
+  border: 1.5px solid rgb(220 38 38);
+  border-radius: 0.625rem;
   background: linear-gradient(135deg, rgb(254 242 242), rgb(255 247 237));
-  box-shadow: 0 12px 30px -20px rgb(220 38 38 / 0.65);
+  box-shadow: 0 6px 14px -16px rgb(220 38 38 / 0.38);
 }
 
 :root.dark .markdown-content :deep(.changelog-important) {
   border-color: rgb(248 113 113);
   background: linear-gradient(135deg, rgb(69 10 10), rgb(67 20 7));
-  box-shadow: 0 14px 34px -22px rgb(248 113 113 / 0.7);
+  box-shadow: 0 8px 18px -18px rgb(248 113 113 / 0.42);
 }
 
 .markdown-content :deep(.changelog-important-label) {
-  margin: 0 0 0.6rem;
-  font-size: 0.8rem;
+  margin: 0 0 0.28rem;
+  font-size: 0.62rem;
   font-weight: 800;
-  letter-spacing: 0.14em;
+  letter-spacing: 0.08em;
   text-transform: uppercase;
   color: rgb(185 28 28);
 }
@@ -262,9 +262,9 @@ async function openRelease() {
 }
 
 .markdown-content :deep(.changelog-important-title) {
-  margin: 0 0 0.6rem;
-  font-size: 1.7rem;
-  line-height: 1.15;
+  margin: 0 0 0.28rem;
+  font-size: 1.08rem;
+  line-height: 1.18;
   font-weight: 800;
   color: rgb(127 29 29);
 }
@@ -275,8 +275,8 @@ async function openRelease() {
 
 .markdown-content :deep(.changelog-important-body) {
   margin: 0;
-  font-size: 1rem;
-  line-height: 1.6;
+  font-size: 0.82rem;
+  line-height: 1.4;
   font-weight: 600;
   color: rgb(153 27 27);
 }