Как установить основной цвет темы в шаблоне Primevue перед/в приложении.Javascript

Форум по Javascript
Ответить
Anonymous
 Как установить основной цвет темы в шаблоне Primevue перед/в приложении.

Сообщение Anonymous »

Я использую шаблон Sakai's Sakai's https://github.com/primefaces/sakai-vue и хотел бы установить то, что должен быть основной цвет темы Aura до того, как приложение будет загружено, например, использование значений в cookie. https://github.com/primefaces/sakai-vue ... urator.vue, но я бы предпочел установить эти значения до загрузки приложения. Я полагаю, что код должен идти в https://github.com/primefaces/sakai-vue ... rc/main.js

Код: Выделить всё

import { createApp } from 'vue';
import App from './App.vue';
import router from './router';

import Aura from '@primeuix/themes/aura';
import PrimeVue from 'primevue/config';
import ConfirmationService from 'primevue/confirmationservice';
import ToastService from 'primevue/toastservice';

import '@/assets/styles.scss';

const app = createApp(App);

app.use(router);
app.use(PrimeVue, {
theme: {
preset: Aura,
options: {
darkModeSelector: '.app-dark'
}
}
});
app.use(ToastService);
app.use(ConfirmationService);

app.mount('#app');
В качестве простого теста я попытался добавить следующее подарок, который я получил от https://github.com/primefaces/sakai-vue ... urator.vue
образно

Код: Выделить всё

const myPreset = {
semantic: {
primary: {
50: "#fff1f2",
100: "#ffe4e6",
200: "#fecdd3",
300: "#fda4af",
400: "#fb7185",
500: "#f43f5e",
600: "#e11d48",
700: "#be123c",
800: "#9f1239",
900: "#881337",
950: "#4c0519"
},
colorScheme: {
light: {
primary: {
color: "{primary.500}",
contrastColor: "#ffffff",
hoverColor: "{primary.600}",
activeColor: "{primary.700}"
},
highlight: {
background: "{primary.50}",
focusBackground: "{primary.100}",
color: "{primary.700}",
focusColor: "{primary.800}"
}
},
dark: {
primary: {
color: "{primary.400}",
contrastColor: "{surface.900}",
hoverColor: "{primary.300}",
activeColor: "{primary.200}"
},
highlight: {
background: "color-mix(in srgb, {primary.400}, transparent 84%)",
focusBackground:
"color-mix(in srgb, {primary.400}, transparent 76%)",
color: "rgba(255,255,255,.87)",
focusColor: "rgba(255,255,255,.87)"
}
}
}
}
};
< /code>
и изменил тему < /p>
app.use(PrimeVue, {
theme: {
preset: myPresent,
}
}
});
Цвет акцента правильно установлен, но цвет других элементов, таких как поверхности или тосты, полностью исчез.>

Подробнее здесь: https://stackoverflow.com/questions/797 ... n-app-load
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Javascript»