refactor: unraid ui cleanup and migration (#998)

Co-authored-by: Eli Bosley <ekbosley@gmail.com>
Co-authored-by: Pujit Mehrotra <pujit@lime-technology.com>
Co-authored-by: mdatelle <mike@datelle.net>
Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>
Co-authored-by: Zack Spear <zackspear@users.noreply.github.com>

web/components/UpdateOs.ce.vue

@@ -15,15 +15,12 @@ else
   echo "Third party plugins found - PLEASE CHECK YOUR UNRAID NOTIFICATIONS AND WAIT FOR THE MESSAGE THAT IT IS SAFE TO REBOOT!"
 fi
  */
-import { storeToRefs } from 'pinia';
-import { useI18n } from 'vue-i18n';
-
+import { BrandLoading, PageContainer } from '@unraid/ui';
 import { WEBGUI_TOOLS_UPDATE } from '~/helpers/urls';
 import { useAccountStore } from '~/store/account';
 import { useServerStore } from '~/store/server';
-
-import 'tailwindcss/tailwind.css';
-import '~/assets/main.css';
+import { storeToRefs } from 'pinia';
+import { useI18n } from 'vue-i18n';
 
 const { t } = useI18n();
 
@@ -46,7 +43,9 @@ const subtitle = computed(() => {
 });
 
 /** when we're not prompting for reboot /Tools/Update will automatically send the user to account.unraid.net/server/update-os */
-const showLoader = computed(() => window.location.pathname === WEBGUI_TOOLS_UPDATE.pathname && rebootType.value === '');
+const showLoader = computed(
+  () => window.location.pathname === WEBGUI_TOOLS_UPDATE.pathname && rebootType.value === ''
+);
 
 onBeforeMount(() => {
   if (showLoader.value) {
@@ -57,7 +56,7 @@ onBeforeMount(() => {
 </script>
 
 <template>
-  <UiPageContainer>
+  <PageContainer>
     <BrandLoading v-if="showLoader" class="mx-auto my-12 max-w-160px" />
     <UpdateOsStatus
       v-else
@@ -66,16 +65,14 @@ onBeforeMount(() => {
       :subtitle="subtitle"
       :t="t"
     />
-    <UpdateOsThirdPartyDrivers
-      v-if="rebootType === 'thirdPartyDriversDownloading'"
-      :t="t"
-    />
-  </UiPageContainer>
+    <UpdateOsThirdPartyDrivers v-if="rebootType === 'thirdPartyDriversDownloading'" :t="t" />
+  </PageContainer>
 </template>
 
 <style lang="postcss">
-@tailwind base;
-@tailwind components;
+/* Import unraid-ui globals first */
+@import '@unraid/ui/styles';
+@import '../assets/main.css';
 
 .unraid_mark_2,
 .unraid_mark_4 {
@@ -124,6 +121,4 @@ onBeforeMount(() => {
     transform: translateY(0);
   }
 }
-
-@tailwind utilities;
 </style>