V-calendar: whare is theme guide?

[dunz]

I need style setting about warpper and other calendar container

but none guide anything about theme prop

https://vcalendar.io/api/defaults.html#theme

There are no links on this page.
https://vcalendar.io/guide/theming-guide.html

[rhinck]

I'm also very interested in using this plugin, everything looks top notch. The biggest functionality I need though is to be able to theme the calendar. Wonder if there would be anyone able to point me in the right direction

[louisluu]

I followed the code and found this https://github.com/nathanreyes/v-calendar/blob/master/src/utils/defaults/theme.js

Then I tried this but no hope (nothing changed):

import { setupCalendar} from 'v-calendar'

// main.js
setupCalendar({
  componentPrefix: 'vc',
  theme: {
    // Copy the entire object from theme.js and changing some css classes
  },
});

Not even sure if theme is supported or not.

[speyou]

I wondered the same and judging from the API page I managed to do this:

 <VDatePicker
      v-model="datesInternal"
      :theme="theme"
      mode="range"
      show-caps
    >

 data() {
    return {
      theme: {
        color: "secondary" // need to create  vc-text-{color}-xxx &  vc-bg-{color}-xxx classes
      }
    };
  },

Keep in mind you can either use the provided theme https://github.com/nathanreyes/v-calendar/blob/master/src/utils/defaults/theme.js or completely modify it and import it into this :theme props.

[rubenmeseguer7]

I followed the code and found this https://github.com/nathanreyes/v-calendar/blob/master/src/utils/defaults/theme.js

That page doesn't exist anymore 😕

[PhilippeVay]

@rubenmeseguer7 I'd to go back in time (thanks Git 😃) to read it again recently and it's there: https://github.com/nathanreyes/v-calendar/blob/07e676e0ee5e08f5c10addabd85decb7aaa3b313/src/utils/defaults/theme.js (thanks @speyou for the link to this file, it saved my project from a bunch of hacks, complicated CSS selectors, overriding utility classes in CSS instead of getting rid of some of them, etc 😉)