fix: restore ShareModal design

- The copy button works again to copy the URL.
- The copy button is now to the right of the input component (not below).
- Removed the fixed height on the buttons so they now match the height of the input text fields.

src/assets/oruga-tailwindcss.css

@@ -8,7 +8,7 @@ body {
 
 /* Button */
 .btn {
-  @apply font-bold py-2 px-4 bg-mbz-bluegreen hover:bg-mbz-bluegreen-600 text-white rounded h-10 outline-none focus:ring ring-offset-1 ring-offset-slate-50 ring-blue-300;
+  @apply font-bold py-2 px-4 bg-mbz-bluegreen hover:bg-mbz-bluegreen-600 text-white rounded outline-none focus:ring ring-offset-1 ring-offset-slate-50 ring-blue-300;
 }
 .btn:hover {
   @apply text-slate-200;

src/components/Share/ShareModal.vue

@@ -7,7 +7,7 @@
     <section class="flex">
       <div class="w-full">
         <slot></slot>
-        <o-field :label="inputLabel" label-for="url-text">
+        <o-field addons :label="inputLabel" label-for="url-text">
           <o-input id="url-text" ref="URLInput" :modelValue="url" expanded />
           <p class="control">
             <o-tooltip
@@ -159,10 +159,10 @@ const mastodonShare = computed((): string | undefined =>
   mastodonShareUrl(props.url, props.text)
 );
 
-const copyURL = (): void => {
-  URLInput.value?.$refs.inputRef.select();
-  document.execCommand("copy");
+const copyURL = async () => {
+  await navigator.clipboard.writeText(props.url);
   showCopiedTooltip.value = true;
+
   setTimeout(() => {
     showCopiedTooltip.value = false;
   }, 2000);