booking 4.4.2 – Elementor – display price – unusable

Free and Premium WordPress Plugins & Themes Forums WordPress Plugins Hotel Booking booking 4.4.2 – Elementor – display price – unusable

  • This topic has 7 replies, 2 voices, and was last updated 2 weeks, 1 day ago by eric Brabants.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1370154
    eric Brabants
    Participant

    Displaying prices is interesting, but the results are unusable – at least on my website

    calendar - prices displayed

    #1373624
    J. Davis
    Keymaster

    He Eric,

    Thanks for your question. The Booklium theme has not been adapted to a new feature yet. Meanwhile, you may try adding the style below at Appearance > Customize > Additional CSS:

    .mphb-calendar span.mphb-price {
        z-index: 1;
    }
    
    .datepick .datepick-month td span{
        height:auto;
        line-height:1.75;
    }

    Let me know if it is helpful.

    best regards,
    John Davis

    #1373659
    eric Brabants
    Participant

    It works

    Not as pretty as I hoped, but functional and useful.

    Thanks
    Eric

    Calendar is working

    #1376348
    J. Davis
    Keymaster

    Hi Eric,

    You are welcome. I’d recommend you show the currency symbol next to the price. There is such an option at Accommodation > Settings.
    Could you specify how you’d like to show the price on the date cells? Perhaps I’ll be able to adjust it with CSS for you.

    best regards,
    John Davis

    #1376754
    eric Brabants
    Participant

    using the same method, I “customized” the code like so:

    .mphb-calendar .datepick-month td span .mphb-date-cell__price{
    color:#808080;
    }

    You can see the result : https://gite-la-croix-liaud.fr/gite-3/

    #1376884
    eric Brabants
    Participant

    I would have liked to change the hatching (linear gradient) to red for the reserved days (instead of the current grey).
    But for now, that seems much more complicated to me

    -:)

    #1378487
    J. Davis
    Keymaster

    Hi Eric,

    You may try to apply the following style:

    .datepick .datepick-month td span.mphb-past-date, .datepick .datepick-month td span.mphb-booked-date, .datepick .datepick-month td span.mphb-booked-date.mphb-date-check-in.mphb-date-check-out {
      color: #000;
      opacity: 1;
      border: 1px solid #fff;
      background: -webkit-repeating-linear-gradient(135deg, transparent, transparent 4px, #EE4B2B 5px, #EE4B2B 6px);
      background: -o-repeating-linear-gradient(135deg, transparent, transparent 4px, #EE4B2B 5px, #EE4B2B 6px);
      background: repeating-linear-gradient(-45deg, transparent, transparent 4px, #EE4B2B 5px, #EE4B2B 6px);
    }
    
    .datepick .datepick-month td span.mphb-date-check-in.mphb-booked-date, .datepick .datepick-month td span.mphb-available-date.mphb-date-check-out {
      background: -webkit-repeating-linear-gradient(135deg, transparent, transparent 4px, #EE4B2B 5px, #EE4B2B 6px);
      background: -o-repeating-linear-gradient(135deg, transparent, transparent 4px, #EE4B2B 5px, #EE4B2B 6px);
      background: repeating-linear-gradient(-45deg, transparent, transparent 4px, #EE4B2B 5px, #EE4B2B 6px);
    }

    best regards,
    John Davis

    #1378670
    eric Brabants
    Participant

    Hi john

    Thanks for the CSS

    I applied it by changing the value of red (a bit softer).
    Between the price display and the color management, I am fully satisfied with the calendar

    You can see the result on the website (bottom of the page): https://gite-la-croix-liaud.fr/le_studio/

    Once again, thank you very much for your involvement

    Sincerely

    Eric Brabants

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.