更新：我的订单兼容多种商品订单（电子书、课程、vip）显示

style/tailwind.css

@@ -8,6 +8,8 @@
     --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
       "Courier New", monospace;
     --color-red-500: oklch(63.7% 0.237 25.331);
+    --color-white: #fff;
+    --spacing: 0.25rem;
     --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
     --default-transition-duration: 150ms;
     --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
@@ -203,6 +205,30 @@
       max-width: 96rem;
     }
   }
+  .\!ml-2 {
+    margin-left: calc(var(--spacing) * 2) !important;
+  }
+  .\!ml-12 {
+    margin-left: calc(var(--spacing) * 12) !important;
+  }
+  .\!ml-\[10px\] {
+    margin-left: 10px !important;
+  }
+  .ml-1 {
+    margin-left: calc(var(--spacing) * 1);
+  }
+  .ml-1\! {
+    margin-left: calc(var(--spacing) * 1) !important;
+  }
+  .ml-2 {
+    margin-left: calc(var(--spacing) * 2);
+  }
+  .ml-2\.5\! {
+    margin-left: calc(var(--spacing) * 2.5) !important;
+  }
+  .ml-12 {
+    margin-left: calc(var(--spacing) * 12);
+  }
   .block {
     display: block;
   }
@@ -236,6 +262,9 @@
   .flex-shrink {
     flex-shrink: 1;
   }
+  .border-collapse {
+    border-collapse: collapse;
+  }
   .transform {
     transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
   }
@@ -249,6 +278,9 @@
     border-style: var(--tw-border-style);
     border-width: 1px;
   }
+  .bg-\[\#e55f18\] {
+    background-color: #e55f18;
+  }
   .bg-\[blue\] {
     background-color: blue;
   }
@@ -258,6 +290,9 @@
   .bg-\[transparent\] {
     background-color: transparent;
   }
+  .bg-red-500 {
+    background-color: var(--color-red-500);
+  }
   .pt-\[40px\] {
     padding-top: 40px;
   }
@@ -273,6 +308,9 @@
   .text-\[red\] {
     color: red;
   }
+  .text-white {
+    color: var(--color-white);
+  }
   .lowercase {
     text-transform: lowercase;
   }
@@ -283,6 +321,9 @@
     --tw-ordinal: ordinal;
     font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
   }
+  .underline {
+    text-decoration-line: underline;
+  }
   .ring {
     --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
     box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);