Ghost/ghost/admin/app/templates/settings/membership.hbs

<section class="gh-canvas">
    <GhCanvasHeader class="gh-canvas-header">
        <h2 class="gh-canvas-title" data-test-screen-title>
            <LinkTo @route="settings">Settings</LinkTo>
            <span>{{svg-jar "arrow-right"}}</span>
            Membership
        </h2>
        <section class="view-actions">
            <GhTaskButton
                @buttonText="Save settings"
                @task={{this.saveSettingsTask}}
                @successText="Saved"
                @runningText="Saving"
                @class="gh-btn gh-btn-primary gh-btn-icon"
                data-test-button="save-settings"
            />
        </section>
    </GhCanvasHeader>

    <section class="view-container settings-debug">
        <div class="gh-main-section">
            <h4 class="gh-main-section-header small">Access and payments</h4>
        </div>
        <section class="gh-expandable">
            <div class="gh-expandable-block">
                <div class="gh-expandable-header">
                    <div>
                        <h4 class="gh-expandable-title">Subscription access</h4>
                        <p class="gh-expandable-description">Who should be able to subscribe to your site?</p>
                    </div>
                    <button type="button" class="gh-btn" {{on "click" this.toggleSignupAccess}} data-test-toggle="subscription-access"><span>{{if this.signupAccessOpen "Close" "Expand"}}</span></button>
                </div>
                <div class="gh-expandable-content">
                    {{#liquid-if this.signupAccessOpen}}
                        <div class="flex flex-column w-50">
                            <div
                                class="gh-radio {{if (eq this.settings.membersSignupAccess "all") "active"}}"
                                {{on "click" (fn this.setSignupAccess "all")}}
                            >
                                <div class="gh-radio-button"></div>
                                <div class="gh-radio-content">
                                    <div class="gh-radio-label">Anyone can sign up</div>
                                    <div class="gh-radio-desc">All visitors will be able to subscribe and sign in</div>
                                </div>
                            </div>

                            <div
                                class="gh-radio {{if (eq this.settings.membersSignupAccess "invite") "active"}}"
                                {{on "click" (fn this.setSignupAccess "invite")}}
                            >
                                <div class="gh-radio-button"></div>
                                <div class="gh-radio-content">
                                    <div class="gh-radio-label">Only people I invite</div>
                                    <div class="gh-radio-desc">People can sign in from your site but won't be able to sign up</div>
                                </div>
                            </div>

                            <div
                                class="gh-radio {{if (eq this.settings.membersSignupAccess "none") "active"}}"
                                {{on "click" (fn this.setSignupAccess "none")}}
                            >
                                <div class="gh-radio-button"></div>
                                <div class="gh-radio-content">
                                    <div class="gh-radio-label">Nobody</div>
                                    <div class="gh-radio-desc">No one will be able to subscribe or sign in</div>
                                </div>
                            </div>
                        </div>
                    {{/liquid-if}}
                </div>
            </div>

            <div class="gh-expandable-block">
                <h4 class="gh-expandable-header">
                    <div>
                        <h4 class="gh-expandable-title">Default post access</h4>
                        <p class="gh-expandable-description">When a new post is created, who should have access to it?</p>
                    </div>
                    <button type="button" class="gh-btn" {{on "click" this.togglePostAccess}} data-test-toggle="post-access"><span>{{if this.postAccessOpen "Close" "Expand"}}</span></button>
                </h4>
                <div class="gh-expandable-content">
                    {{#liquid-if this.postAccessOpen}}
                    <div class="flex flex-column w-50">
                        <div
                            class="gh-radio {{if (eq this.settings.defaultContentVisibility "public") "active"}}"
                            {{on "click" (fn this.setDefaultContentVisibility "public")}}
                        >
                            <div class="gh-radio-button"></div>
                            <div class="gh-radio-content">
                                <div class="gh-radio-label">Public<br>
                                <div class="gh-radio-desc">All site visitors to your site, no login required</div></div>
                            </div>
                        </div>
                        <div class="{{if (eq this.settings.membersSignupAccess "none") "disabled-overlay"}}">
                            <div
                                class="gh-radio {{if (eq this.settings.defaultContentVisibility "members") "active"}}"
                                {{on "click" (fn this.setDefaultContentVisibility "members")}}
                            >
                                <div class="gh-radio-button"></div>
                                <div class="gh-radio-content">
                                    <div class="gh-radio-label">Members only<br>
                                    <div class="gh-radio-desc">All logged-in members</div></div>
                                </div>
                            </div>
                            <div
                                class="gh-radio {{if (eq this.settings.defaultContentVisibility "paid") "active"}}"
                                {{on "click" (fn this.setDefaultContentVisibility "paid")}}
                            >
                                <div class="gh-radio-button"></div>
                                <div class="gh-radio-content">
                                    <div class="gh-radio-label">Paid-members only<br>
                                    <div class="gh-radio-desc">Only logged-in members with an active Stripe subscription</div></div>
                                </div>
                            </div>
                        </div>
                    </div>
                    {{/liquid-if}}
                </div>
            </div>
        </section>
    </section>

    {{#if this.showLeaveSettingsModal}}
        <GhFullscreenModal
            @modal="leave-settings"
            @confirm={{this.confirmLeave}}
            @close={{this.cancelLeave}}
            @modifier="action wide"
        />
    {{/if}}
</section>