Services Plugins FAQs

Air Calendar Full Border Styling

I cannot seem to change the color of the cell borders. The keep coming out black and when I try and change them in the css the #aircal style is dynamic and I’m unable to change them. I don’t see a setting in the panel for all the borders. Am I missing something? Thanks.

-Bob

Screenshot 2025-02-06 at 3.37.35 PM

Hey @bob.leland ,

Thanks for reaching out! :pray:

Could you confirm if you’ve tried adjusting the settings inside the plugin element? I’ve attached a screenshot for reference.

Regarding your CSS, it looks like you’re targeting the entire plugin element instead of individual rows. You can inspect and find the correct selectors using the browser console.

To help, you can place an HTML element on the page (visible on page load) and use the following CSS as an example:


<style>
  /* Add red outline to every time slot */
  .fc-timegrid-slot {
    outline: 2px solid red !important;
  }

  /* Add red outline to the lane slots */
  .fc-timegrid-slot-lane {
    outline: 2px solid red !important;
  }

  /* Outline all table cells inside the time grid */
  .fc-timegrid-slots td {
    outline: 2px solid red !important;
  }

  /* Outline all rows to see separation */
  .fc-timegrid-slots tr {
    outline: 2px solid red !important;
  }

  /* Outline the entire time grid table */
  .fc-timegrid-slots table {
    outline: 2px solid red !important;
  }

  /* Outline each time column */
  .fc-timegrid-cols {
    outline: 2px solid red !important;
  }

  /* Outline specific cells using their time attribute */
  td[data-time] {
    outline: 2px solid red !important;
  }
 
</style>

Looking forward to your feedback. :sparkles:

Best Regards,
Support Team
Browse all Zeroqode Plugins for Bubble
Banner_Last3

Thanks for the guidance. I do have some of these settings set in the panel. The CSS you provided did help. I was actually adding CSS to the main CSS in the Bubble settings so it most likely wasn’t taking. The issue is that it only fixes some things and I am attaching a few screenshots to show. The #aircal CSS is adding to the TD. When I hide the border styling it works great but by default it’s in the element so I can’t change it. Thanks for any help.

-Bob


I got it fixed. The border color setting in the panel doesn’t like transparency. I was using a dark color with opacity of 15. When I just put the gray color in it worked. Thanks again for your help.

Hi @bob.leland ,

I’m thrilled to hear everything is running smoothly now! :raised_hands: It’s always a pleasure to help, and we truly appreciate having you as part of our community.

If you’ve been enjoying our plugins, we’d love to hear your thoughts! Your feedback not only makes our day but also helps others in the Bubble community discover the best tools for their projects.

Leaving a quick 5-star review takes just a minute and makes a world of difference. Simply head to the Plugins tab in the Bubble editor, search for the plugin, and rate it! :star2:

Want to help even more? Share your experience on:
:link: Zeroqode Reviews
:link: G2
:link: Clutch
:link: Trustpilot

Your support means everything to us and helps us continue building awesome products for you! :rocket:

Thanks a ton, and have an amazing week ahead! :pray:

Best regards,
Support Team
Browse all Zeroqode Plugins for Bubble
Banner_Last3