Need to remove collapsible for coupon code at cart page in magento 2

Question

In the cart page, I need to display a simple input box and Apply button for the coupon section. For this, I need to remove the collapsible element. We need to work around

<div class="block discount" id="block-discount" data-mage-init='{"collapsible":{"openedState": "active", "active": true, "saveState": false}}'>
    <div class="title" data-role="title">
        <strong id="block-discount-heading" role="heading" aria-level="2"><?php echo __('Discount Codes') ?></strong>
    </div> 

Please check the screenshot. I need to remove the "Discount Codes" collapsible tab.

Answer 1

Add below code into app/design/frontend/Vendor/Your_Theme/Magento_Checkout/frontend/templates/cart/coupon.phtml

<form id="discount-coupon-form"
      action="<?= $block->escapeUrl($block->getUrl('checkout/cart/couponPost')) ?>"
      method="post"
      data-mage-init='{"discountCode":{"couponCodeSelector": "#coupon_code",
                                       "removeCouponSelector": "#remove-coupon",
                                       "applyButton": "button.action.apply",
                                       "cancelButton": "button.action.cancel"}}'>
    <div class="fieldset coupon<?= strlen($block->getCouponCode()) ? ' applied' : '' ?>">
        <input type="hidden" name="remove" id="remove-coupon" value="0" />
        <div class="field">
            <label for="coupon_code" class="label"><span><?= $block->escapeHtml(__('Enter discount code')) ?></span></label>
            <div class="control">
                <input type="text"
                       class="input-text"
                       id="coupon_code"
                       name="coupon_code"
                       value="<?= $block->escapeHtmlAttr($block->getCouponCode()) ?>"
                       placeholder="<?= $block->escapeHtmlAttr(__('Enter discount code')) ?>"
                        <?php if (strlen($block->getCouponCode())) :?>
                           disabled="disabled"
                        <?php endif; ?>
                />
            </div>
        </div>
        <div class="actions-toolbar">
            <?php if (!strlen($block->getCouponCode())) :?>
            <div class="primary">
                <button class="action apply primary" type="button" value="<?= $block->escapeHtmlAttr(__('Apply Discount')) ?>">
                    <span><?= $block->escapeHtml(__('Apply Discount')) ?></span>
                </button>
            </div>
            <?php else :?>
                <div class="primary">
                    <button  type="button" class="action cancel primary" value="<?= $block->escapeHtmlAttr(__('Cancel Coupon')) ?>"><span><?= $block->escapeHtml(__('Cancel Coupon')) ?></span></button>
                </div>
            <?php endif; ?>
        </div>
    </div>
    <?php if (!strlen($block->getCouponCode())) : ?>
        <?= /* @noEscape */ $block->getChildHtml('captcha') ?>
    <?php endif; ?>
</form>

You can customize the html as per your need