Widget Inline {% include 'components/giving-widgets/widget-inline' %}
#
HTML
<div class="giving-widget giving-widget--inline">
    <div class="fund-selector">
        <!-- Can be a span or a label. Depends on whether or not there's a select -->
        <span class="fund-selector__title">DONATE NOW</span>

        <div class="fund-selector-field">
            <div class="option-selector">
                <div class="option-selector__item">
                    <input class="option-selector__input" id="radio17" name="radio6" type="radio" checked="checked" />
                    <label class="option-selector__label" for="radio17">&pound;10</label>
                </div>
                <div class="option-selector__item">
                    <input class="option-selector__input" id="radio18" name="radio6" type="radio" />
                    <label class="option-selector__label" for="radio18">&pound;20</label>
                </div>
                <div class="option-selector__item">
                    <input class="option-selector__input" id="radio19" name="radio6" type="radio" />
                    <label class="option-selector__label" for="radio19">&pound;50</label>
                </div>
                <div class="option-selector__item option-selector__item--with-input">
                    <input class="option-selector__input" id="radio20" name="radio6" type="radio" />
                    <div class="custom-input custom-input--currency">
                        <input class="custom-input__input" type="text" placeholder="other" />
                    </div>
                </div>
            </div>
        </div>

                <div class="fund-selector-field payment-methods">
            <div class="payment-methods__item payment-methods__item--once">
                <div class="payment-methods__button">
                    <button class="button pay-by-card"><span>Pay by card</span></button>
                </div>
                <div class="payment-methods__button">
                    <button class="button pay-by-paypal"><span>Pay by</span></button>
                </div>
            </div>
            <div class="payment-methods__item payment-methods__item--regularly">
                <div class="payment-methods__button">
                    <button class="button pay-by-direct-debit"><span>Pay by Direct Debit</span></button>
                </div>
            </div>
        </div>
    </div>
</div>
Twig
<div class="giving-widget giving-widget--inline">
    <div class="fund-selector">
        <!-- Can be a span or a label. Depends on whether or not there's a select -->
        <span class="fund-selector__title">DONATE NOW</span>

        <div class="fund-selector-field">
            <div class="option-selector">
                <div class="option-selector__item">
                    <input class="option-selector__input" id="radio17" name="radio6" type="radio" checked="checked" />
                    <label class="option-selector__label" for="radio17">&pound;10</label>
                </div>
                <div class="option-selector__item">
                    <input class="option-selector__input" id="radio18" name="radio6" type="radio" />
                    <label class="option-selector__label" for="radio18">&pound;20</label>
                </div>
                <div class="option-selector__item">
                    <input class="option-selector__input" id="radio19" name="radio6" type="radio" />
                    <label class="option-selector__label" for="radio19">&pound;50</label>
                </div>
                <div class="option-selector__item option-selector__item--with-input">
                    <input class="option-selector__input" id="radio20" name="radio6" type="radio" />
                    <div class="custom-input custom-input--currency">
                        <input class="custom-input__input" type="text" placeholder="other" />
                    </div>
                </div>
            </div>
        </div>

                <div class="fund-selector-field payment-methods">
            <div class="payment-methods__item payment-methods__item--once">
                <div class="payment-methods__button">
                    <button class="button pay-by-card"><span>Pay by card</span></button>
                </div>
                <div class="payment-methods__button">
                    <button class="button pay-by-paypal"><span>Pay by</span></button>
                </div>
            </div>
            <div class="payment-methods__item payment-methods__item--regularly">
                <div class="payment-methods__button">
                    <button class="button pay-by-direct-debit"><span>Pay by Direct Debit</span></button>
                </div>
            </div>
        </div>
    </div>
</div>
{}
DONATE NOW