Your support team has really been helpful so far. I still

Your support team has really been helpful so far. I still have a couple questions regarding CSS tweaks on http://parlornewyork.com/wordpress/select-preview-time/

My Calendar Time Slot Picker:

- the border around the table appears incomplete. I like it, but it only appears on the top and left side. I would like it to appear on the bottom and tight side too.

In the same time slot table, in in the appointments-weekly-calendar-hours-mins <TD>'s, I added the bit of code to the function.php file in my theme. Worked great. Still have some

- I want to remove the " -" that appears after the displayed time.
- I want to changefont-weight:"normal". It seems bold and I can't find the control to turn it normal.
- I want the vertical alignment to = middle. Right now it's too high in the <TD>.

Lastly, in the confirmation display
- I want to remove the "Service name: blah blah blah" row. Changing it display nothing, both in terms of title and value is fine.
- I want to remove the "Lasts (approx):" row. Changing it display nothing, both in terms of title and value is fine.

  • Ash
    • WordPress Hacker

    Hello @Daniel

    Welcome to WPMU community!

    I hope you are well today and thanks for asking the question.

    - the border around the table appears incomplete. I like it, but it only appears on the top and left side. I would like it to appear on the bottom and tight side too.

    .appointments-list table{
    overflow: visible;
    }

    I want to changefont-weight:"normal".

    .appointments-weekly-calendar-hours-mins{
    font-weight: normal;
    }

    - I want the vertical alignment to = middle. Right now it's too high in the <TD>.

    .appointments-list table td{
    vertical-align: middle;
    }

    - I want to remove the "Service name: blah blah blah" row.

    .appointments-confirmation-service{
    display: none;
    }

    - I want to remove the "Lasts (approx):" row.

    .appointments-confirmation-end{
    display: none;
    }

    You can add this to a theme's stylesheet, in a child theme, or using a plugin like My Custom CSS

    - I want to remove the " -" that appears after the displayed time.

    jQuery(function( $ ) {
      $('.appointments-weekly-calendar-hours-mins').each(function() {
        var text = $(this).text();
        $(this).text(text.replace('-', ''));
      });
    });

    You need to add this code in your theme's footer.php just after wp_footer()

    Hope it helps :slight_smile: Please feel free to ask more question if you have.

    Cheers
    Ash

    • Daniel
      • Design Lord, Child of Thor

      Ash, the one thing that did not work is the last bit of code.

      Went into my WP dashboard and placed the code in my theme:ken: Footer (footer.php).

      I put this..

      jQuery(function( $ ) {
      $('.appointments-weekly-calendar-hours-mins').each(function() {
      var text = $(this).text();
      $(this).text(text.replace('-', ''));
      });
      });

      after this...

      <?php wp_footer(); ?>

      ...but nothing seemed to happen

  • Ash
    • WordPress Hacker

    You are most welcome! About that code, the correct code should be:

    <script type="text/javascript">
    jQuery(function( $ ) {
      $('.appointments-weekly-calendar-hours-mins').each(function() {
        var text = $(this).text();
        $(this).text(text.replace('-', ''));
      });
    });
    </script>

    Cheers
    Ash

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.