chore: refine demo

src/demo/examples/BarChart.vue

@@ -69,7 +69,7 @@ function refresh() {
           second{{ seconds > 1 ? "s" : "" }}...
         </small>
       </p>
-      <p>
+      <p class="actions">
         <button @click="refresh" :disabled="seconds > 0">Refresh</button>
       </p>
     </template>

src/demo/examples/ConnectChart.vue

@@ -45,7 +45,7 @@ watch(
       <v-chart :option="c2" group="radiance" autoresize />
     </template>
     <template #extra>
-      <p>
+      <p class="actions">
         <label>
           <input type="checkbox" v-model="connected" />
           Connected

src/demo/examples/GeoChart.vue

@@ -51,7 +51,7 @@ function convert() {
       style="background-color: #404a59"
     />
     <template #extra>
-      <p>
+      <p class="actions">
         <button @click="convert">Convert to image</button>
       </p>
       <aside class="modal" :class="{ open }" @click="open = false">

src/demo/examples/ManualChart.vue

@@ -105,7 +105,7 @@ function load() {
         You may use the <code>manual-update</code> prop for performance critical
         use cases.
       </p>
-      <p>
+      <p class="actions">
         <button :disabled="loaded" @click="load">Load</button>
       </p>
     </template>

src/demo/examples/PolarChart.vue

@@ -33,7 +33,7 @@ const theme = shallowRef("dark");
       :style="theme === 'dark' ? 'background-color: #100c2a' : ''"
     />
     <template #extra>
-      <p>
+      <p class="actions">
         Theme
         <select v-model="theme">
           <option :value="null">Default</option>

src/demo/examples/RadarChart.vue

@@ -22,7 +22,7 @@ const metricIndex = shallowRef(0);
   <v-example id="radar" title="Radar chart" desc="(with Pinia integration)">
     <v-chart :option="getRadarData(metricIndex)" autoresize />
     <template #extra>
-      <p>
+      <p class="actions">
         <select v-model="metricIndex">
           <option
             v-for="(metric, index) in metrics"