Hi all,
I'm still working on implementing an updated website using bootstrap template. I recently updated my BS version from 3.6 to 3.6.3 by updating the changed files in the readme docs. Using ZC 1.5.8a. In testing my site, I'm coming across a couple of minor issues I'm hoping someone can help me address:
1) In small screen media mode <576px the category column is limited to 32.5%. I think this is because I have columns per row set to 3. When I change to 1 the mobile display is fine, but the desktop display has more columns than I want. How can I have 1 column in mobile mode and 3 columns in desktop mode but still remain fluid based on screen width?
2) The back-to-top button continues to appear on top of other buttons, despite the fix that was supposed to be added to 3.6.3? Couldn't find where to disable the button or adjust settings. It's mainly affecting the checkout button and confirm order buttons. Maybe I missed something when updating the template?
Thank you in advance!
1) Did you try changing the columns-per-row to 0 (fluid)? If that doesn't do what you want, v3.6.3 adds a 'soft' configuration setting:
2) There's a 'soft' setting (see dist.site-specific-bootstrap-settings.php) that totally disabled the back-to-top button. If you still want it to show, but not overlay "important" buttons, here's what I added to my /css/site_specific_styles.php so it overlays the footer:Code:// ----- // Starting with v3.6.3, a categories' fluid layout can be identified. If predefined (like // in an /extra_datafiles .php module), that override is used. // if ($category_row_layout_style === 'fluid') { $grid_cards_classes = 'row-cols-1 row-cols-md-2 row-cols-lg-2 row-cols-xl-3'; if (!isset($grid_category_classes_matrix)) { // this array is intentionally in reverse order, with largest index first $grid_category_classes_matrix = [ '12' => 'row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-4 row-cols-xl-6', '10' => 'row-cols-1 row-cols-md-2 row-cols-lg-4 row-cols-xl-5', '9' => 'row-cols-1 row-cols-md-3 row-cols-lg-4 row-cols-xl-5', '8' => 'row-cols-1 row-cols-md-2 row-cols-lg-3 row-cols-xl-4', '6' => 'row-cols-1 row-cols-md-2 row-cols-lg-2 row-cols-xl-3', ]; }
Code:#back-to-top { bottom: 2.5vh; }
Thanks, Lat! I have a 3/9/0 column setup with the template, so I changed the 4,5 and 6 on the configuration all to 3 and now it displays correctly on the smaller screens and has a max of 3 columns on larger screens. Is there any way to get the categories to fill the width of the center box equally on the larger screens though? For example, when I have column count set at 3 and there is a row with only 2 categories, they auto adjust to 50%. When I change the column count to 0 for fluid, now each category only takes up 33%, even if there are only 2 categories on a row. Just a visual preference, not a dealbreaker, but wanted to check.
2) I added the code you provided to the css (as well as my separate css file called by the site-specific version) and no change on the back to top button--it still overlays checkout and confirm order. Anything else I can look at?
1) That's the way that Bootstrap card-deck elements work.
2) A link to the site?
Try this--hopefully it works. Still a work in progress: https://www.thecoinauthority.com/ind...=index&cPath=1
Thanks again!
I was having this same issue--I think the code is missing an else statement in the tpl_modules_shipping_estimator.php file. Here's what I added and for now seems to be working as intended:
Code:<?php if ($flag_show_pulldown_states === true) { ?> <label class="inputLabel" for="stateZone" id="zoneLabel"><?php echo ENTRY_STATE; ?></label> <?php echo zen_draw_pull_down_menu('zone_id', zen_prepare_country_zones_pull_down($selected_country), $state_zone_id, 'id="stateZone"'); ?> <div class="p-2" id="stBreak"></div> <?php } else { ?> <label class="inputLabel" for="state" id="stateLabel"><?php echo $state_field_label; ?></label> <?php echo zen_draw_input_field('state', $selectedState, zen_set_field_length(TABLE_ADDRESS_BOOK, 'entry_state', '40') . ' id="state"'); ?> <div class="p-2"></div> <?php } if (CART_SHIPPING_METHOD_ZIP_REQUIRED === 'true') {
Nope, that will make it so that any countries that don't have zones (e.g. France) won't have an entry for their province.
Bookmarks