Started new theming for Aura
Cagatay Civici
parent
4457d080a3
commit
78c09c40d2
24
app.vue
24
app.vue
|
|
@ -8,7 +8,7 @@
|
||||||
import EventBus from '@/layouts/AppEventBus';
|
import EventBus from '@/layouts/AppEventBus';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
watch: {
|
/*watch: {
|
||||||
$route: {
|
$route: {
|
||||||
handler(to) {
|
handler(to) {
|
||||||
if (to.name === 'index') {
|
if (to.name === 'index') {
|
||||||
|
|
@ -16,23 +16,7 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},*/
|
||||||
created() {
|
|
||||||
useServerHead({
|
|
||||||
link: [
|
|
||||||
/*{
|
|
||||||
id: 'theme-link',
|
|
||||||
rel: 'stylesheet',
|
|
||||||
href: '/themes/lara-light-green/theme.css'
|
|
||||||
}*/
|
|
||||||
{
|
|
||||||
id: 'home-table-link',
|
|
||||||
rel: 'stylesheet',
|
|
||||||
href: '/styles/landing/themes/aura-light-green/theme.css'
|
|
||||||
}
|
|
||||||
]
|
|
||||||
});
|
|
||||||
},
|
|
||||||
mounted() {
|
mounted() {
|
||||||
/*const preferredColorScheme = localStorage.getItem(this.$appState.colorSchemeKey);
|
/*const preferredColorScheme = localStorage.getItem(this.$appState.colorSchemeKey);
|
||||||
const prefersDarkColorScheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
const prefersDarkColorScheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
|
||||||
|
|
@ -66,7 +50,9 @@ export default {
|
||||||
// @todo
|
// @todo
|
||||||
this.$appState.theme = event.theme;
|
this.$appState.theme = event.theme;
|
||||||
this.$appState.darkTheme = event.dark;
|
this.$appState.darkTheme = event.dark;
|
||||||
document.documentElement.className = this.$appState.darkTheme ? 'p-dark' : '';
|
|
||||||
|
if (event.dark) document.documentElement.classList.add('p-dark');
|
||||||
|
else document.documentElement.classList.remove('p-dark');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@ body {
|
||||||
min-height: 100%;
|
min-height: 100%;
|
||||||
overflow-x: hidden;
|
overflow-x: hidden;
|
||||||
overflow-y: auto;
|
overflow-y: auto;
|
||||||
background-color: var(--body-bg);
|
background-color: var(--p-surface-ground);
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
color: var(--text-color);
|
color: var(--text-color);
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
|
|
@ -15,7 +15,7 @@ body {
|
||||||
}
|
}
|
||||||
|
|
||||||
.layout-wrapper {
|
.layout-wrapper {
|
||||||
background-color: var(--body-bg);
|
background-color: var(--p-surface-ground);
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
|
|
|
||||||
|
|
@ -2,9 +2,8 @@
|
||||||
--primary-color-default:var(--primary-400);
|
--primary-color-default:var(--primary-400);
|
||||||
--primary-color-inverse-default:var(--gray-900);
|
--primary-color-inverse-default:var(--gray-900);
|
||||||
--topbar-sticky-bg:rgba(0,0,0,.3);
|
--topbar-sticky-bg:rgba(0,0,0,.3);
|
||||||
--body-bg: var(--p-surface-900);
|
|
||||||
--card-border: 1px solid transparent;
|
--card-border: 1px solid transparent;
|
||||||
--card-bg: var(--p-surface-800);
|
--card-bg: var(--p-surface-card);
|
||||||
--glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/pattern.png), radial-gradient(50% 50% at center -25px, var(--primary-color) 0%, #000000 100%);
|
--glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/pattern.png), radial-gradient(50% 50% at center -25px, var(--primary-color) 0%, #000000 100%);
|
||||||
--glow-blend: hard-light, color-dodge;
|
--glow-blend: hard-light, color-dodge;
|
||||||
--topbar-border: var(--surface-border);
|
--topbar-border: var(--surface-border);
|
||||||
|
|
|
||||||
|
|
@ -2,8 +2,8 @@
|
||||||
--primary-color-default:var(--primary-600);
|
--primary-color-default:var(--primary-600);
|
||||||
--primary-color-inverse-default:var(--surface-0);
|
--primary-color-inverse-default:var(--surface-0);
|
||||||
--topbar-sticky-bg:rgba(255,255,255,.7);
|
--topbar-sticky-bg:rgba(255,255,255,.7);
|
||||||
--card-border: 1px solid var(--surface-border);
|
--card-border: 1px solid var(--p-surface-border);
|
||||||
--card-bg: var(--surface-card);
|
--card-bg: var(--p-surface-card);
|
||||||
--glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/pattern.png);
|
--glow-image: url(https://www.primefaces.org/cdn/primevue/images/layout/pattern.png);
|
||||||
--glow-blend: hard-light, multiply;
|
--glow-blend: hard-light, multiply;
|
||||||
--topbar-border: rgba(0,0,0,.05);
|
--topbar-border: rgba(0,0,0,.05);
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
import { FilterMatchMode } from 'primevue/api';
|
import { FilterMatchMode } from 'primevue/api';
|
||||||
import Lara from 'primevue/theme/lara';
|
import Aura from 'primevue/theme/aura';
|
||||||
import { inject, reactive } from 'vue';
|
import { inject, reactive } from 'vue';
|
||||||
|
|
||||||
export const defaultOptions = {
|
export const defaultOptions = {
|
||||||
|
|
@ -135,7 +135,7 @@ export const defaultOptions = {
|
||||||
tooltip: 1100
|
tooltip: 1100
|
||||||
},
|
},
|
||||||
theme: {
|
theme: {
|
||||||
preset: Lara,
|
preset: Aura,
|
||||||
options: undefined
|
options: undefined
|
||||||
},
|
},
|
||||||
pt: undefined,
|
pt: undefined,
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,220 @@
|
||||||
|
export default {
|
||||||
|
css: `
|
||||||
|
@font-face {
|
||||||
|
font-family: "Inter var";
|
||||||
|
font-weight: 100 900;
|
||||||
|
font-display: swap;
|
||||||
|
font-style: normal;
|
||||||
|
font-named-instance: "Regular";
|
||||||
|
src: url("./fonts/Inter-roman.var.woff2?v=3.19") format("woff2");
|
||||||
|
}
|
||||||
|
@font-face {
|
||||||
|
font-family: "Inter var";
|
||||||
|
font-weight: 100 900;
|
||||||
|
font-display: swap;
|
||||||
|
font-style: italic;
|
||||||
|
font-named-instance: "Italic";
|
||||||
|
src: url("./fonts/Inter-italic.var.woff2?v=3.19") format("woff2");
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-component,
|
||||||
|
.p-component * {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-hidden-space {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-reset {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: 0;
|
||||||
|
outline: 0;
|
||||||
|
text-decoration: none;
|
||||||
|
font-size: 100%;
|
||||||
|
list-style: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-disabled,
|
||||||
|
.p-disabled * {
|
||||||
|
cursor: default;
|
||||||
|
pointer-events: none;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-component-overlay {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-unselectable-text {
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-sr-only {
|
||||||
|
border: 0;
|
||||||
|
clip: rect(1px, 1px, 1px, 1px);
|
||||||
|
clip-path: inset(50%);
|
||||||
|
height: 1px;
|
||||||
|
margin: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0;
|
||||||
|
position: absolute;
|
||||||
|
width: 1px;
|
||||||
|
word-wrap: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-link {
|
||||||
|
text-align: left;
|
||||||
|
background-color: transparent;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
border: none;
|
||||||
|
cursor: pointer;
|
||||||
|
user-select: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-link:disabled {
|
||||||
|
cursor: default;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Non vue overlay animations */
|
||||||
|
.p-connected-overlay {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scaleY(0.8);
|
||||||
|
transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1),
|
||||||
|
opacity 0.12s cubic-bezier(0, 0, 0.2, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-connected-overlay-visible {
|
||||||
|
opacity: 1;
|
||||||
|
transform: scaleY(1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-connected-overlay-hidden {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scaleY(1);
|
||||||
|
transition: opacity 0.1s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Vue based overlay animations */
|
||||||
|
.p-connected-overlay-enter-from {
|
||||||
|
opacity: 0;
|
||||||
|
transform: scaleY(0.8);
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-connected-overlay-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-connected-overlay-enter-active {
|
||||||
|
transition: transform 0.12s cubic-bezier(0, 0, 0.2, 1),
|
||||||
|
opacity 0.12s cubic-bezier(0, 0, 0.2, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-connected-overlay-leave-active {
|
||||||
|
transition: opacity 0.1s linear;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Toggleable Content */
|
||||||
|
.p-toggleable-content-enter-from,
|
||||||
|
.p-toggleable-content-leave-to {
|
||||||
|
max-height: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-toggleable-content-enter-to,
|
||||||
|
.p-toggleable-content-leave-from {
|
||||||
|
max-height: 1000px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-toggleable-content-leave-active {
|
||||||
|
overflow: hidden;
|
||||||
|
transition: max-height 0.45s cubic-bezier(0, 1, 0, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-toggleable-content-enter-active {
|
||||||
|
overflow: hidden;
|
||||||
|
transition: max-height 1s ease-in-out;
|
||||||
|
}
|
||||||
|
|
||||||
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-component {
|
||||||
|
font-family: var(--font-family);
|
||||||
|
font-feature-settings: var(--font-feature-settings, normal);
|
||||||
|
font-size: 1rem;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-component-overlay {
|
||||||
|
background-color: rgba(0, 0, 0, 0.4);
|
||||||
|
transition-duration: 0.2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-disabled,
|
||||||
|
.p-component:disabled {
|
||||||
|
opacity: 0.6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-error {
|
||||||
|
color: #f87171;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-text-secondary {
|
||||||
|
color: #64748b;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pi {
|
||||||
|
font-size: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-icon {
|
||||||
|
width: 1rem;
|
||||||
|
height: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-link {
|
||||||
|
font-family: var(--font-family);
|
||||||
|
font-feature-settings: var(--font-feature-settings, normal);
|
||||||
|
font-size: 1rem;
|
||||||
|
border-radius: 6px;
|
||||||
|
outline-color: transparent;
|
||||||
|
}
|
||||||
|
.p-link:focus-visible {
|
||||||
|
outline: 1px solid var(--p-focus-ring-color);
|
||||||
|
outline-offset: 2px;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-component-overlay-enter {
|
||||||
|
animation: p-component-overlay-enter-animation 150ms forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-component-overlay-leave {
|
||||||
|
animation: p-component-overlay-leave-animation 150ms forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes p-component-overlay-enter-animation {
|
||||||
|
from {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
background-color: var(--maskbg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
@keyframes p-component-overlay-leave-animation {
|
||||||
|
from {
|
||||||
|
background-color: var(--maskbg);
|
||||||
|
}
|
||||||
|
to {
|
||||||
|
background-color: transparent;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
};
|
||||||
|
|
@ -0,0 +1,132 @@
|
||||||
|
import global from 'primevue/theme/aura/global';
|
||||||
|
import panel from 'primevue/theme/aura/panel';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
primitive: {
|
||||||
|
emerald: {
|
||||||
|
50: '#ecfdf5',
|
||||||
|
100: '#d1fae5',
|
||||||
|
200: '#a7f3d0',
|
||||||
|
300: '#6ee7b7',
|
||||||
|
400: '#34d399',
|
||||||
|
500: '#10b981',
|
||||||
|
600: '#059669',
|
||||||
|
700: '#047857',
|
||||||
|
800: '#065f46',
|
||||||
|
900: '#064e3b',
|
||||||
|
950: '#022c22'
|
||||||
|
},
|
||||||
|
slate: {
|
||||||
|
50: '#f8fafc',
|
||||||
|
100: '#f1f5f9',
|
||||||
|
200: '#e2e8f0',
|
||||||
|
300: '#cbd5e1',
|
||||||
|
400: '#94a3b8',
|
||||||
|
500: '#64748b',
|
||||||
|
600: '#475569',
|
||||||
|
700: '#334155',
|
||||||
|
800: '#1e293b',
|
||||||
|
900: '#0f172a',
|
||||||
|
950: '#020617'
|
||||||
|
},
|
||||||
|
zinc: {
|
||||||
|
50: '#fafafa',
|
||||||
|
100: '#f4f4f5',
|
||||||
|
200: '#e4e4e7',
|
||||||
|
300: '#d4d4d8',
|
||||||
|
400: '#a1a1aa',
|
||||||
|
500: '#71717a',
|
||||||
|
600: '#52525b',
|
||||||
|
700: '#3f3f46',
|
||||||
|
800: '#27272a',
|
||||||
|
900: '#18181b',
|
||||||
|
950: '#09090b'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
semantic: {
|
||||||
|
colorScheme: {
|
||||||
|
light: {
|
||||||
|
primary: {
|
||||||
|
50: '{emerald.50}',
|
||||||
|
100: '{emerald.100}',
|
||||||
|
200: '{emerald.200}',
|
||||||
|
300: '{emerald.300}',
|
||||||
|
400: '{emerald.400}',
|
||||||
|
500: '{emerald.500}',
|
||||||
|
600: '{emerald.600}',
|
||||||
|
700: '{emerald.700}',
|
||||||
|
800: '{emerald.800}',
|
||||||
|
900: '{emerald.900}',
|
||||||
|
950: '{emerald.950}'
|
||||||
|
},
|
||||||
|
surface: {
|
||||||
|
0: '#ffffff',
|
||||||
|
50: '{slate.50}',
|
||||||
|
100: '{slate.100}',
|
||||||
|
200: '{slate.200}',
|
||||||
|
300: '{slate.300}',
|
||||||
|
400: '{slate.400}',
|
||||||
|
500: '{slate.500}',
|
||||||
|
600: '{slate.600}',
|
||||||
|
700: '{slate.700}',
|
||||||
|
800: '{slate.800}',
|
||||||
|
900: '{slate.900}',
|
||||||
|
950: '{slate.950}'
|
||||||
|
},
|
||||||
|
textColor: '{surface.700}',
|
||||||
|
textSecondaryColor: '{surface.500}'
|
||||||
|
},
|
||||||
|
dark: {
|
||||||
|
primary: {
|
||||||
|
50: '{emerald.50}',
|
||||||
|
100: '{emerald.100}',
|
||||||
|
200: '{emerald.200}',
|
||||||
|
300: '{emerald.300}',
|
||||||
|
400: '{emerald.400}',
|
||||||
|
500: '{emerald.500}',
|
||||||
|
600: '{emerald.600}',
|
||||||
|
700: '{emerald.700}',
|
||||||
|
800: '{emerald.800}',
|
||||||
|
900: '{emerald.900}',
|
||||||
|
950: '{emerald.950}'
|
||||||
|
},
|
||||||
|
surface: {
|
||||||
|
0: '#ffffff',
|
||||||
|
50: '{zinc.50}',
|
||||||
|
100: '{zinc.100}',
|
||||||
|
200: '{zinc.200}',
|
||||||
|
300: '{zinc.300}',
|
||||||
|
400: '{zinc.400}',
|
||||||
|
500: '{zinc.500}',
|
||||||
|
600: '{zinc.600}',
|
||||||
|
700: '{zinc.700}',
|
||||||
|
800: '{zinc.800}',
|
||||||
|
900: '{zinc.900}',
|
||||||
|
950: '{zinc.950}'
|
||||||
|
},
|
||||||
|
textColor: '{dark.surface.0}',
|
||||||
|
textSecondaryColor: '{dark.surface.400}'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
common: {
|
||||||
|
fontFamily: '"Inter var", sans-serif',
|
||||||
|
borderRadius: '6px',
|
||||||
|
transitionDuration: '.2s',
|
||||||
|
focusRing: {
|
||||||
|
width: '2px',
|
||||||
|
style: 'solid',
|
||||||
|
color: '{primary.500}',
|
||||||
|
offset: '2px'
|
||||||
|
},
|
||||||
|
surface: {
|
||||||
|
card: 'var(--p-dark-surface-900, var(--p-surface-0))',
|
||||||
|
border: 'var(--p-dark-surface-700, var(--p-surface-200))',
|
||||||
|
ground: 'var(--p-dark-surface-950, var(--p-surface-50))'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
global,
|
||||||
|
panel
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
@ -0,0 +1,31 @@
|
||||||
|
interface PanelThemeVariables {
|
||||||
|
panelHeaderBorder?: string | undefined;
|
||||||
|
panelHeaderPadding?: string | undefined;
|
||||||
|
panelHeaderBg?: string | undefined;
|
||||||
|
panelHeaderTextColor?: string | undefined;
|
||||||
|
panelHeaderFontWeight?: string | undefined;
|
||||||
|
panelHeaderIconWidth?: string | undefined;
|
||||||
|
panelHeaderIconHeight?: string | undefined;
|
||||||
|
panelHeaderIconColor?: string | undefined;
|
||||||
|
panelHeaderIconBorder?: string | undefined;
|
||||||
|
panelHeaderIconBg?: string | undefined;
|
||||||
|
panelHeaderIconBorderRadius?: string | undefined;
|
||||||
|
panelHeaderIconTransition?: string | undefined;
|
||||||
|
panelHeaderIconHoverColor?: string | undefined;
|
||||||
|
panelHeaderIconHoverBorderColor?: string | undefined;
|
||||||
|
panelHeaderIconHoverBg?: string | undefined;
|
||||||
|
panelHeaderIconFocusOutline?: string | undefined;
|
||||||
|
panelHeaderIconFocusOutlineOffset?: string | undefined;
|
||||||
|
panelHeaderIconFocusShadow?: string | undefined;
|
||||||
|
panelToggleableHeaderPadding?: string | undefined;
|
||||||
|
panelContentPadding?: string | undefined;
|
||||||
|
panelContentBorder?: string | undefined;
|
||||||
|
panelContentBg?: string | undefined;
|
||||||
|
panelContentTextColor?: string | undefined;
|
||||||
|
panelContentBorderTop?: string | undefined;
|
||||||
|
panelFooterPadding?: string | undefined;
|
||||||
|
panelFooterBorder?: string | undefined;
|
||||||
|
panelFooterBg?: string | undefined;
|
||||||
|
panelFooterTextColor?: string | undefined;
|
||||||
|
panelFooterBorderTop?: string | undefined;
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,84 @@
|
||||||
|
export default {
|
||||||
|
css: `
|
||||||
|
.p-panel-header {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.p-panel-title {
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
.p-panel-header-icon {
|
||||||
|
display: inline-flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
cursor: pointer;
|
||||||
|
text-decoration: none;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-header {
|
||||||
|
padding: 1.125rem;
|
||||||
|
color: var(--p-dark-surface-0, var(--p-surface-700));
|
||||||
|
border-top-right-radius: 6px;
|
||||||
|
border-top-left-radius: 6px;
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-header .p-panel-title {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-header .p-panel-header-icon {
|
||||||
|
width: 1.75rem;
|
||||||
|
height: 1.75rem;
|
||||||
|
color: #a1a1aa;
|
||||||
|
border: 0 none;
|
||||||
|
background: transparent;
|
||||||
|
border-radius: 50%;
|
||||||
|
transition: background-color 0.2s, color 0.2s, border-color 0.2s,
|
||||||
|
box-shadow 0.2s, outline-color 0.2s;
|
||||||
|
outline-color: transparent;
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-header .p-panel-header-icon:enabled:hover {
|
||||||
|
color: var(--p-dark-surface-0, var(--p-surface-700));
|
||||||
|
border-color: transparent;
|
||||||
|
background: rgba(255, 255, 255, 0.03);
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-header .p-panel-header-icon:focus-visible {
|
||||||
|
outline: 1px solid var(--p-focus-ring-color);
|
||||||
|
outline-offset: 2px;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
.p-panel.p-panel-toggleable .p-panel-header {
|
||||||
|
padding: 0.75rem 1.125rem;
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-content {
|
||||||
|
padding: 0 1.125rem 1.125rem 1.125rem;
|
||||||
|
color: var(--p-dark-surface-0, var(--p-surface-700));
|
||||||
|
border-top: 0 none;
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-content:last-child {
|
||||||
|
border-bottom-right-radius: 6px;
|
||||||
|
border-bottom-left-radius: 6px;
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-footer {
|
||||||
|
padding: 0 1.125rem 1.125rem 1.125rem;
|
||||||
|
color: var(--p-dark-surface-0, var(--p-surface-700));
|
||||||
|
border-bottom-right-radius: 6px;
|
||||||
|
border-bottom-left-radius: 6px;
|
||||||
|
border-top: 0 none;
|
||||||
|
}
|
||||||
|
.p-panel {
|
||||||
|
border: 1px solid var(--p-dark-surface-700, var(--p-surface-200));
|
||||||
|
border-radius: 6px;
|
||||||
|
background-color: var(--p-dark-surface-900, var(--p-surface-0));
|
||||||
|
}
|
||||||
|
.p-panel .p-panel-header,
|
||||||
|
.p-panel .p-panel-content,
|
||||||
|
.p-panel .p-panel-footer {
|
||||||
|
background: transparent;
|
||||||
|
border: 0 none;
|
||||||
|
}
|
||||||
|
.p-panel:has(.p-panel-footer) .p-panel-content {
|
||||||
|
padding-bottom: 0.875rem;
|
||||||
|
}
|
||||||
|
`
|
||||||
|
};
|
||||||
|
|
@ -0,0 +1,6 @@
|
||||||
|
{
|
||||||
|
"main": "./index.cjs.js",
|
||||||
|
"module": "./index.esm.js",
|
||||||
|
"unpkg": "./index.min.js",
|
||||||
|
"types": "./index.d.ts"
|
||||||
|
}
|
||||||
|
|
@ -99,7 +99,7 @@ export default {
|
||||||
this.appConfigActive = false;
|
this.appConfigActive = false;
|
||||||
},
|
},
|
||||||
onDarkModeToggle() {
|
onDarkModeToggle() {
|
||||||
let newTheme = null;
|
/*let newTheme = null;
|
||||||
let currentTheme = this.$appState.theme;
|
let currentTheme = this.$appState.theme;
|
||||||
|
|
||||||
if (this.$appState.darkTheme) {
|
if (this.$appState.darkTheme) {
|
||||||
|
|
@ -112,7 +112,8 @@ export default {
|
||||||
localStorage.setItem(this.$appState.colorSchemeKey, 'dark');
|
localStorage.setItem(this.$appState.colorSchemeKey, 'dark');
|
||||||
}
|
}
|
||||||
|
|
||||||
EventBus.emit('theme-change', { theme: newTheme, dark: !this.$appState.darkTheme });
|
EventBus.emit('theme-change', { theme: newTheme, dark: !this.$appState.darkTheme });*/
|
||||||
|
EventBus.emit('theme-change', { dark: !this.$appState.darkTheme });
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
|
||||||
|
|
@ -161,84 +161,84 @@ const ICON_ALIAS = {
|
||||||
};
|
};
|
||||||
|
|
||||||
const THEME_ALIAS = {
|
const THEME_ALIAS = {
|
||||||
'primevue/theme/lara/global': path.resolve(__dirname, './components/lib/theme/lara/global.js'),
|
'primevue/theme/aura/global': path.resolve(__dirname, './components/lib/theme/aura/global.js'),
|
||||||
'primevue/theme/lara/accordion': path.resolve(__dirname, './components/lib/theme/lara/accordion/index.js'),
|
'primevue/theme/aura/accordion': path.resolve(__dirname, './components/lib/theme/aura/accordion/index.js'),
|
||||||
'primevue/theme/lara/autocomplete': path.resolve(__dirname, './components/lib/theme/lara/autocomplete/index.js'),
|
'primevue/theme/aura/autocomplete': path.resolve(__dirname, './components/lib/theme/aura/autocomplete/index.js'),
|
||||||
'primevue/theme/lara/avatar': path.resolve(__dirname, './components/lib/theme/lara/avatar/index.js'),
|
'primevue/theme/aura/avatar': path.resolve(__dirname, './components/lib/theme/aura/avatar/index.js'),
|
||||||
'primevue/theme/lara/badge': path.resolve(__dirname, './components/lib/theme/lara/badge/index.js'),
|
'primevue/theme/aura/badge': path.resolve(__dirname, './components/lib/theme/aura/badge/index.js'),
|
||||||
'primevue/theme/lara/blockui': path.resolve(__dirname, './components/lib/theme/lara/blockui/index.js'),
|
'primevue/theme/aura/blockui': path.resolve(__dirname, './components/lib/theme/aura/blockui/index.js'),
|
||||||
'primevue/theme/lara/breadcrumb': path.resolve(__dirname, './components/lib/theme/lara/breadcrumb/index.js'),
|
'primevue/theme/aura/breadcrumb': path.resolve(__dirname, './components/lib/theme/aura/breadcrumb/index.js'),
|
||||||
'primevue/theme/lara/button': path.resolve(__dirname, './components/lib/theme/lara/button/index.js'),
|
'primevue/theme/aura/button': path.resolve(__dirname, './components/lib/theme/aura/button/index.js'),
|
||||||
'primevue/theme/lara/calendar': path.resolve(__dirname, './components/lib/theme/lara/calendar/index.js'),
|
'primevue/theme/aura/calendar': path.resolve(__dirname, './components/lib/theme/aura/calendar/index.js'),
|
||||||
'primevue/theme/lara/card': path.resolve(__dirname, './components/lib/theme/lara/card/index.js'),
|
'primevue/theme/aura/card': path.resolve(__dirname, './components/lib/theme/aura/card/index.js'),
|
||||||
'primevue/theme/lara/carousel': path.resolve(__dirname, './components/lib/theme/lara/carousel/index.js'),
|
'primevue/theme/aura/carousel': path.resolve(__dirname, './components/lib/theme/aura/carousel/index.js'),
|
||||||
'primevue/theme/lara/cascadeselect': path.resolve(__dirname, './components/lib/theme/lara/cascadeselect/index.js'),
|
'primevue/theme/aura/cascadeselect': path.resolve(__dirname, './components/lib/theme/aura/cascadeselect/index.js'),
|
||||||
'primevue/theme/lara/checkbox': path.resolve(__dirname, './components/lib/theme/lara/checkbox/index.js'),
|
'primevue/theme/aura/checkbox': path.resolve(__dirname, './components/lib/theme/aura/checkbox/index.js'),
|
||||||
'primevue/theme/lara/chip': path.resolve(__dirname, './components/lib/theme/lara/chip/index.js'),
|
'primevue/theme/aura/chip': path.resolve(__dirname, './components/lib/theme/aura/chip/index.js'),
|
||||||
'primevue/theme/lara/chips': path.resolve(__dirname, './components/lib/theme/lara/chips/index.js'),
|
'primevue/theme/aura/chips': path.resolve(__dirname, './components/lib/theme/aura/chips/index.js'),
|
||||||
'primevue/theme/lara/colorpicker': path.resolve(__dirname, './components/lib/theme/lara/colorpicker/index.js'),
|
'primevue/theme/aura/colorpicker': path.resolve(__dirname, './components/lib/theme/aura/colorpicker/index.js'),
|
||||||
'primevue/theme/lara/confirmdialog': path.resolve(__dirname, './components/lib/theme/lara/confirmdialog/index.js'),
|
'primevue/theme/aura/confirmdialog': path.resolve(__dirname, './components/lib/theme/aura/confirmdialog/index.js'),
|
||||||
'primevue/theme/lara/confirmpopup': path.resolve(__dirname, './components/lib/theme/lara/confirmpopup/index.js'),
|
'primevue/theme/aura/confirmpopup': path.resolve(__dirname, './components/lib/theme/aura/confirmpopup/index.js'),
|
||||||
'primevue/theme/lara/contextmenu': path.resolve(__dirname, './components/lib/theme/lara/contextmenu/index.js'),
|
'primevue/theme/aura/contextmenu': path.resolve(__dirname, './components/lib/theme/aura/contextmenu/index.js'),
|
||||||
'primevue/theme/lara/datatable': path.resolve(__dirname, './components/lib/theme/lara/datatable/index.js'),
|
'primevue/theme/aura/datatable': path.resolve(__dirname, './components/lib/theme/aura/datatable/index.js'),
|
||||||
'primevue/theme/lara/dataview': path.resolve(__dirname, './components/lib/theme/lara/dataview/index.js'),
|
'primevue/theme/aura/dataview': path.resolve(__dirname, './components/lib/theme/aura/dataview/index.js'),
|
||||||
'primevue/theme/lara/dialog': path.resolve(__dirname, './components/lib/theme/lara/dialog/index.js'),
|
'primevue/theme/aura/dialog': path.resolve(__dirname, './components/lib/theme/aura/dialog/index.js'),
|
||||||
'primevue/theme/lara/divider': path.resolve(__dirname, './components/lib/theme/lara/divider/index.js'),
|
'primevue/theme/aura/divider': path.resolve(__dirname, './components/lib/theme/aura/divider/index.js'),
|
||||||
'primevue/theme/lara/dock': path.resolve(__dirname, './components/lib/theme/lara/dock/index.js'),
|
'primevue/theme/aura/dock': path.resolve(__dirname, './components/lib/theme/aura/dock/index.js'),
|
||||||
'primevue/theme/lara/dropdown': path.resolve(__dirname, './components/lib/theme/lara/dropdown/index.js'),
|
'primevue/theme/aura/dropdown': path.resolve(__dirname, './components/lib/theme/aura/dropdown/index.js'),
|
||||||
'primevue/theme/lara/editor': path.resolve(__dirname, './components/lib/theme/lara/editor/index.js'),
|
'primevue/theme/aura/editor': path.resolve(__dirname, './components/lib/theme/aura/editor/index.js'),
|
||||||
'primevue/theme/lara/fieldset': path.resolve(__dirname, './components/lib/theme/lara/fieldset/index.js'),
|
'primevue/theme/aura/fieldset': path.resolve(__dirname, './components/lib/theme/aura/fieldset/index.js'),
|
||||||
'primevue/theme/lara/fileupload': path.resolve(__dirname, './components/lib/theme/lara/fileupload/index.js'),
|
'primevue/theme/aura/fileupload': path.resolve(__dirname, './components/lib/theme/aura/fileupload/index.js'),
|
||||||
'primevue/theme/lara/galleria': path.resolve(__dirname, './components/lib/theme/lara/galleria/index.js'),
|
'primevue/theme/aura/galleria': path.resolve(__dirname, './components/lib/theme/aura/galleria/index.js'),
|
||||||
'primevue/theme/lara/image': path.resolve(__dirname, './components/lib/theme/lara/image/index.js'),
|
'primevue/theme/aura/image': path.resolve(__dirname, './components/lib/theme/aura/image/index.js'),
|
||||||
'primevue/theme/lara/inlinemessage': path.resolve(__dirname, './components/lib/theme/lara/inlinemessage/index.js'),
|
'primevue/theme/aura/inlinemessage': path.resolve(__dirname, './components/lib/theme/aura/inlinemessage/index.js'),
|
||||||
'primevue/theme/lara/inplace': path.resolve(__dirname, './components/lib/theme/lara/inplace/index.js'),
|
'primevue/theme/aura/inplace': path.resolve(__dirname, './components/lib/theme/aura/inplace/index.js'),
|
||||||
'primevue/theme/lara/inputgroup': path.resolve(__dirname, './components/lib/theme/lara/inputgroup/index.js'),
|
'primevue/theme/aura/inputgroup': path.resolve(__dirname, './components/lib/theme/aura/inputgroup/index.js'),
|
||||||
'primevue/theme/lara/inputnumber': path.resolve(__dirname, './components/lib/theme/lara/inputnumber/index.js'),
|
'primevue/theme/aura/inputnumber': path.resolve(__dirname, './components/lib/theme/aura/inputnumber/index.js'),
|
||||||
'primevue/theme/lara/inputswitch': path.resolve(__dirname, './components/lib/theme/lara/inputswitch/index.js'),
|
'primevue/theme/aura/inputswitch': path.resolve(__dirname, './components/lib/theme/aura/inputswitch/index.js'),
|
||||||
'primevue/theme/lara/inputtext': path.resolve(__dirname, './components/lib/theme/lara/inputtext/index.js'),
|
'primevue/theme/aura/inputtext': path.resolve(__dirname, './components/lib/theme/aura/inputtext/index.js'),
|
||||||
'primevue/theme/lara/listbox': path.resolve(__dirname, './components/lib/theme/lara/listbox/index.js'),
|
'primevue/theme/aura/listbox': path.resolve(__dirname, './components/lib/theme/aura/listbox/index.js'),
|
||||||
'primevue/theme/lara/megamenu': path.resolve(__dirname, './components/lib/theme/lara/megamenu/index.js'),
|
'primevue/theme/aura/megamenu': path.resolve(__dirname, './components/lib/theme/aura/megamenu/index.js'),
|
||||||
'primevue/theme/lara/menu': path.resolve(__dirname, './components/lib/theme/lara/menu/index.js'),
|
'primevue/theme/aura/menu': path.resolve(__dirname, './components/lib/theme/aura/menu/index.js'),
|
||||||
'primevue/theme/lara/menubar': path.resolve(__dirname, './components/lib/theme/lara/menubar/index.js'),
|
'primevue/theme/aura/menubar': path.resolve(__dirname, './components/lib/theme/aura/menubar/index.js'),
|
||||||
'primevue/theme/lara/message': path.resolve(__dirname, './components/lib/theme/lara/message/index.js'),
|
'primevue/theme/aura/message': path.resolve(__dirname, './components/lib/theme/aura/message/index.js'),
|
||||||
'primevue/theme/lara/multiselect': path.resolve(__dirname, './components/lib/theme/lara/multiselect/index.js'),
|
'primevue/theme/aura/multiselect': path.resolve(__dirname, './components/lib/theme/aura/multiselect/index.js'),
|
||||||
'primevue/theme/lara/orderlist': path.resolve(__dirname, './components/lib/theme/lara/orderlist/index.js'),
|
'primevue/theme/aura/orderlist': path.resolve(__dirname, './components/lib/theme/aura/orderlist/index.js'),
|
||||||
'primevue/theme/lara/organizationchart': path.resolve(__dirname, './components/lib/theme/lara/organizationchart/index.js'),
|
'primevue/theme/aura/organizationchart': path.resolve(__dirname, './components/lib/theme/aura/organizationchart/index.js'),
|
||||||
'primevue/theme/lara/overlaypanel': path.resolve(__dirname, './components/lib/theme/lara/overlaypanel/index.js'),
|
'primevue/theme/aura/overlaypanel': path.resolve(__dirname, './components/lib/theme/aura/overlaypanel/index.js'),
|
||||||
'primevue/theme/lara/paginator': path.resolve(__dirname, './components/lib/theme/lara/paginator/index.js'),
|
'primevue/theme/aura/paginator': path.resolve(__dirname, './components/lib/theme/aura/paginator/index.js'),
|
||||||
'primevue/theme/lara/panel': path.resolve(__dirname, './components/lib/theme/lara/panel/index.js'),
|
'primevue/theme/aura/panel': path.resolve(__dirname, './components/lib/theme/aura/panel/index.js'),
|
||||||
'primevue/theme/lara/panelmenu': path.resolve(__dirname, './components/lib/theme/lara/panelmenu/index.js'),
|
'primevue/theme/aura/panelmenu': path.resolve(__dirname, './components/lib/theme/aura/panelmenu/index.js'),
|
||||||
'primevue/theme/lara/password': path.resolve(__dirname, './components/lib/theme/lara/password/index.js'),
|
'primevue/theme/aura/password': path.resolve(__dirname, './components/lib/theme/aura/password/index.js'),
|
||||||
'primevue/theme/lara/picklist': path.resolve(__dirname, './components/lib/theme/lara/picklist/index.js'),
|
'primevue/theme/aura/picklist': path.resolve(__dirname, './components/lib/theme/aura/picklist/index.js'),
|
||||||
'primevue/theme/lara/progressbar': path.resolve(__dirname, './components/lib/theme/lara/progressbar/index.js'),
|
'primevue/theme/aura/progressbar': path.resolve(__dirname, './components/lib/theme/aura/progressbar/index.js'),
|
||||||
'primevue/theme/lara/progressspinner': path.resolve(__dirname, './components/lib/theme/lara/progressspinner/index.js'),
|
'primevue/theme/aura/progressspinner': path.resolve(__dirname, './components/lib/theme/aura/progressspinner/index.js'),
|
||||||
'primevue/theme/lara/radiobutton': path.resolve(__dirname, './components/lib/theme/lara/radiobutton/index.js'),
|
'primevue/theme/aura/radiobutton': path.resolve(__dirname, './components/lib/theme/aura/radiobutton/index.js'),
|
||||||
'primevue/theme/lara/rating': path.resolve(__dirname, './components/lib/theme/lara/rating/index.js'),
|
'primevue/theme/aura/rating': path.resolve(__dirname, './components/lib/theme/aura/rating/index.js'),
|
||||||
'primevue/theme/lara/scrollpanel': path.resolve(__dirname, './components/lib/theme/lara/scrollpanel/index.js'),
|
'primevue/theme/aura/scrollpanel': path.resolve(__dirname, './components/lib/theme/aura/scrollpanel/index.js'),
|
||||||
'primevue/theme/lara/scrolltop': path.resolve(__dirname, './components/lib/theme/lara/scrolltop/index.js'),
|
'primevue/theme/aura/scrolltop': path.resolve(__dirname, './components/lib/theme/aura/scrolltop/index.js'),
|
||||||
'primevue/theme/lara/selectbutton': path.resolve(__dirname, './components/lib/theme/lara/selectbutton/index.js'),
|
'primevue/theme/aura/selectbutton': path.resolve(__dirname, './components/lib/theme/aura/selectbutton/index.js'),
|
||||||
'primevue/theme/lara/sidebar': path.resolve(__dirname, './components/lib/theme/lara/sidebar/index.js'),
|
'primevue/theme/aura/sidebar': path.resolve(__dirname, './components/lib/theme/aura/sidebar/index.js'),
|
||||||
'primevue/theme/lara/skeleton': path.resolve(__dirname, './components/lib/theme/lara/skeleton/index.js'),
|
'primevue/theme/aura/skeleton': path.resolve(__dirname, './components/lib/theme/aura/skeleton/index.js'),
|
||||||
'primevue/theme/lara/slider': path.resolve(__dirname, './components/lib/theme/lara/slider/index.js'),
|
'primevue/theme/aura/slider': path.resolve(__dirname, './components/lib/theme/aura/slider/index.js'),
|
||||||
'primevue/theme/lara/speeddial': path.resolve(__dirname, './components/lib/theme/lara/speeddial/index.js'),
|
'primevue/theme/aura/speeddial': path.resolve(__dirname, './components/lib/theme/aura/speeddial/index.js'),
|
||||||
'primevue/theme/lara/splitbutton': path.resolve(__dirname, './components/lib/theme/lara/splitbutton/index.js'),
|
'primevue/theme/aura/splitbutton': path.resolve(__dirname, './components/lib/theme/aura/splitbutton/index.js'),
|
||||||
'primevue/theme/lara/splitter': path.resolve(__dirname, './components/lib/theme/lara/splitter/index.js'),
|
'primevue/theme/aura/splitter': path.resolve(__dirname, './components/lib/theme/aura/splitter/index.js'),
|
||||||
'primevue/theme/lara/steps': path.resolve(__dirname, './components/lib/theme/lara/steps/index.js'),
|
'primevue/theme/aura/steps': path.resolve(__dirname, './components/lib/theme/aura/steps/index.js'),
|
||||||
'primevue/theme/lara/tabmenu': path.resolve(__dirname, './components/lib/theme/lara/tabmenu/index.js'),
|
'primevue/theme/aura/tabmenu': path.resolve(__dirname, './components/lib/theme/aura/tabmenu/index.js'),
|
||||||
'primevue/theme/lara/tabview': path.resolve(__dirname, './components/lib/theme/lara/tabview/index.js'),
|
'primevue/theme/aura/tabview': path.resolve(__dirname, './components/lib/theme/aura/tabview/index.js'),
|
||||||
'primevue/theme/lara/tag': path.resolve(__dirname, './components/lib/theme/lara/tag/index.js'),
|
'primevue/theme/aura/tag': path.resolve(__dirname, './components/lib/theme/aura/tag/index.js'),
|
||||||
'primevue/theme/lara/terminal': path.resolve(__dirname, './components/lib/theme/lara/terminal/index.js'),
|
'primevue/theme/aura/terminal': path.resolve(__dirname, './components/lib/theme/aura/terminal/index.js'),
|
||||||
'primevue/theme/lara/tieredmenu': path.resolve(__dirname, './components/lib/theme/lara/tieredmenu/index.js'),
|
'primevue/theme/aura/tieredmenu': path.resolve(__dirname, './components/lib/theme/aura/tieredmenu/index.js'),
|
||||||
'primevue/theme/lara/timeline': path.resolve(__dirname, './components/lib/theme/lara/timeline/index.js'),
|
'primevue/theme/aura/timeline': path.resolve(__dirname, './components/lib/theme/aura/timeline/index.js'),
|
||||||
'primevue/theme/lara/toast': path.resolve(__dirname, './components/lib/theme/lara/toast/index.js'),
|
'primevue/theme/aura/toast': path.resolve(__dirname, './components/lib/theme/aura/toast/index.js'),
|
||||||
'primevue/theme/lara/togglebutton': path.resolve(__dirname, './components/lib/theme/lara/togglebutton/index.js'),
|
'primevue/theme/aura/togglebutton': path.resolve(__dirname, './components/lib/theme/aura/togglebutton/index.js'),
|
||||||
'primevue/theme/lara/toolbar': path.resolve(__dirname, './components/lib/theme/lara/toolbar/index.js'),
|
'primevue/theme/aura/toolbar': path.resolve(__dirname, './components/lib/theme/aura/toolbar/index.js'),
|
||||||
'primevue/theme/lara/tooltip': path.resolve(__dirname, './components/lib/theme/lara/tooltip/index.js'),
|
'primevue/theme/aura/tooltip': path.resolve(__dirname, './components/lib/theme/aura/tooltip/index.js'),
|
||||||
'primevue/theme/lara/tree': path.resolve(__dirname, './components/lib/theme/lara/tree/index.js'),
|
'primevue/theme/aura/tree': path.resolve(__dirname, './components/lib/theme/aura/tree/index.js'),
|
||||||
'primevue/theme/lara/treeselect': path.resolve(__dirname, './components/lib/theme/lara/treeselect/index.js'),
|
'primevue/theme/aura/treeselect': path.resolve(__dirname, './components/lib/theme/aura/treeselect/index.js'),
|
||||||
'primevue/theme/lara/treetable': path.resolve(__dirname, './components/lib/theme/lara/treetable/index.js'),
|
'primevue/theme/aura/treetable': path.resolve(__dirname, './components/lib/theme/aura/treetable/index.js'),
|
||||||
'primevue/theme/lara': path.resolve(__dirname, './components/lib/theme/lara/index.js'),
|
'primevue/theme/aura': path.resolve(__dirname, './components/lib/theme/aura/index.js'),
|
||||||
'primevue/theme': path.resolve(__dirname, './components/lib/theme/index.js')
|
'primevue/theme': path.resolve(__dirname, './components/lib/theme/index.js')
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue