Skip to content

Commit 1ce8879

Browse files
committed
feat: load web-component styles as well
1 parent 903ac6e commit 1ce8879

27 files changed

+19
-479
lines changed

plugin/source/dynamix.unraid.net/usr/local/emhttp/plugins/dynamix.my.servers/include/web-components-extractor.php

Lines changed: 19 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,8 @@ public function getManifestContents(string $manifestPath): array
3939
return $contents ? json_decode($contents, true) : [];
4040
}
4141

42-
private function getRichComponentsFile(): string
42+
43+
private function getRichComponentsScript(): string
4344
{
4445
$manifestFiles = $this->findManifestFiles('manifest.json');
4546

@@ -58,20 +59,26 @@ private function getRichComponentsFile(): string
5859
$matchesJs = strpos($key, self::RICH_COMPONENTS_ENTRY_JS) !== false;
5960

6061
if (($matchesMjs || $matchesJs) && isset($value["file"])) {
61-
return ($subfolder ? $subfolder . '/' : '') . $value["file"];
62+
$jsFile = ($subfolder ? $subfolder . '/' : '') . $value["file"];
63+
$html = '';
64+
65+
// Add CSS files if they exist
66+
if (isset($value["css"]) && is_array($value["css"])) {
67+
foreach ($value["css"] as $cssFile) {
68+
$cssPath = ($subfolder ? $subfolder . '/' : '') . $cssFile;
69+
$html .= '<link rel="stylesheet" href="' . $this->getAssetPath($cssPath) . '">';
70+
}
71+
}
72+
73+
// Add JavaScript file
74+
$html .= '<script src="' . $this->getAssetPath($jsFile) . '"></script>';
75+
76+
return $html;
6277
}
6378
}
6479
}
65-
return '';
66-
}
67-
68-
private function getRichComponentsScript(): string
69-
{
70-
$jsFile = $this->getRichComponentsFile();
71-
if (empty($jsFile)) {
72-
return '<script>console.error("%cNo matching key containing \'' . self::RICH_COMPONENTS_ENTRY . '\' or \'' . self::RICH_COMPONENTS_ENTRY_JS . '\' found.", "font-weight: bold; color: white; background-color: red");</script>';
73-
}
74-
return '<script src="' . $this->getAssetPath($jsFile) . '"></script>';
80+
81+
return '<script>console.error("%cNo matching key containing \'' . self::RICH_COMPONENTS_ENTRY . '\' or \'' . self::RICH_COMPONENTS_ENTRY_JS . '\' found.", "font-weight: bold; color: white; background-color: red");</script>';
7582
}
7683

7784
private function getUnraidUiScriptHtml(): string

web/components/Activation/WelcomeModal.ce.vue

Lines changed: 0 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -101,57 +101,3 @@ watchEffect(() => {
101101
</Dialog>
102102
</div>
103103
</template>
104-
105-
<style>
106-
/* Import unraid-ui globals first */
107-
@import '@unraid/ui/styles';
108-
@import '~/assets/main.css';
109-
110-
.unraid_mark_2,
111-
.unraid_mark_4 {
112-
animation: mark_2 1.5s ease infinite;
113-
}
114-
.unraid_mark_3 {
115-
animation: mark_3 1.5s ease infinite;
116-
}
117-
.unraid_mark_6,
118-
.unraid_mark_8 {
119-
animation: mark_6 1.5s ease infinite;
120-
}
121-
.unraid_mark_7 {
122-
animation: mark_7 1.5s ease infinite;
123-
}
124-
125-
@keyframes mark_2 {
126-
50% {
127-
transform: translateY(-40px);
128-
}
129-
100% {
130-
transform: translateY(0);
131-
}
132-
}
133-
@keyframes mark_3 {
134-
50% {
135-
transform: translateY(-62px);
136-
}
137-
100% {
138-
transform: translateY(0);
139-
}
140-
}
141-
@keyframes mark_6 {
142-
50% {
143-
transform: translateY(40px);
144-
}
145-
100% {
146-
transform: translateY(0);
147-
}
148-
}
149-
@keyframes mark_7 {
150-
50% {
151-
transform: translateY(62px);
152-
}
153-
100% {
154-
transform: translateY(0);
155-
}
156-
}
157-
</style>

web/components/ApiKeyPage.ce.vue

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,3 @@ import ApiKeyManager from '~/components/ApiKey/ApiKeyManager.vue';
66
<ApiKeyManager />
77
</div>
88
</template>
9-
<style>
10-
/* Import unraid-ui globals first */
11-
@import '@unraid/ui/styles';
12-
@import '~/assets/main.css';
13-
</style>

web/components/Auth.ce.vue

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -30,9 +30,3 @@ const { authAction, stateData } = storeToRefs(serverStore);
3030
</span>
3131
</div>
3232
</template>
33-
34-
<style>
35-
/* Import unraid-ui globals first */
36-
@import '@unraid/ui/styles';
37-
@import '~/assets/main.css';
38-
</style>

web/components/CallbackHandler.ce.vue

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,9 +14,3 @@ onBeforeMount(() => {
1414
<slot />
1515
</div>
1616
</template>
17-
18-
<style >
19-
/* Import unraid-ui globals first */
20-
@import '@unraid/ui/styles';
21-
@import '~/assets/main.css';
22-
</style>

web/components/ColorSwitcher.ce.vue

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -74,9 +74,3 @@ const items = [
7474
<Switch id="banner" v-model:checked="form.banner" />
7575
</div>
7676
</template>
77-
78-
<style >
79-
/* Import unraid-ui globals first */
80-
@import '@unraid/ui/styles';
81-
@import '~/assets/main.css';
82-
</style>

web/components/ConnectSettings/ConnectSettings.ce.vue

Lines changed: 0 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -148,8 +148,3 @@ const onChange = ({ data }: { data: Record<string, unknown> }) => {
148148
</div>
149149
</div>
150150
</template>
151-
<style >
152-
/* Import unraid-ui globals first */
153-
@import '@unraid/ui/styles';
154-
@import '../../assets/main.css';
155-
</style>

web/components/DevSettings.vue

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,9 +23,3 @@ import { CogIcon } from '@heroicons/vue/24/solid';
2323

2424

2525
</template>
26-
27-
<style >
28-
/* Import unraid-ui globals first */
29-
@import '@unraid/ui/styles';
30-
@import '~/assets/main.css';
31-
</style>

web/components/DowngradeOs.ce.vue

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -77,9 +77,3 @@ onBeforeMount(() => {
7777
</PageContainer>
7878
</div>
7979
</template>
80-
81-
<style >
82-
/* Import unraid-ui globals first */
83-
@import '@unraid/ui/styles';
84-
@import '~/assets/main.css';
85-
</style>

web/components/DownloadApiLogs.ce.vue

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -71,9 +71,3 @@ const downloadUrl = computed(() => {
7171
</span>
7272
</div>
7373
</template>
74-
75-
<style >
76-
/* Import unraid-ui globals first */
77-
@import '@unraid/ui/styles';
78-
@import '~/assets/main.css';
79-
</style>

0 commit comments

Comments
 (0)