docs(variables): fix card alignment (#2084)

Relates to #736 

Fix alignment for variable value when preview is high.

Before:

![image](https://github.com/user-attachments/assets/85bec08a-cb05-42d4-b00d-d2a1fc1229de)

After:

![image](https://github.com/user-attachments/assets/5a809b59-c540-445f-8cb9-23ff2eda3a4f)

apps/docs/src/.vitepress/components/DesignVariableCard.vue

@@ -41,7 +41,7 @@ const handleCopy = async () => {
 
 <template>
   <div ref="wrapperRef" class="card vp-raw" :class="{ 'card--wide': props.wideName }">
-    <div>
+    <div class="card__wrapper">
       <div class="card__name">
         <slot name="name">
           <DesignVariable :name="props.name" :is-copied="isCopied" allow-copy @copy="handleCopy" />
@@ -76,6 +76,11 @@ const handleCopy = async () => {
     grid-template-columns: 1fr 1fr;
   }
 
+  &__wrapper {
+    display: flex;
+    flex-direction: column;
+  }
+
   &__name {
     display: flex;
     flex-direction: column;