2025-04-24 13:11:28 +08:00

87 lines
2.6 KiB
Plaintext

include ./_plans_faq_tabs
include ../../_mixins/eyebrow
- var managingYourSubscription = 'managingYourSubscription'
- var overleafIndividualPlans = 'overleafIndividualPlans'
- var overleafGroupPlans = 'overleafGroupPlans'
.plans-faq
.row.row-spaced-extra-large
.col-md-12.faq-heading-container
h2
+eyebrow(translate("frequently_asked_questions"))
| #{translate("your_questions_answered")}
.row
.col-xs-12
div(
class={
'plans-faq-tabs': bootstrapVersion === 5,
'ol-tabs': bootstrapVersion === 5,
'ol-tabs-scrollable': bootstrapVersion === 3
}
)
.nav-tabs-container
ul.nav.nav-tabs(role="tablist")
//- In the bs5 version of plans page, the `active` class need to be added to the `a` tag instead of the parent `li` tag
//- If the `plans-page-bs5` split test has been completed, remove the `active` class from the `li` tag since we're not using it anymore
//- If the `plans-page-bs5` split test has been completed, remove the `data-toggle` because it is not needed anymore (bs5 uses `data-bs-toggle`)
li(
role="presentation"
class={
active: bootstrapVersion === 3
}
)
a(
role="tab"
data-toggle="tab"
data-bs-toggle="tab"
href='#' + managingYourSubscription
aria-controls=managingYourSubscription
class={
active: bootstrapVersion === 5
}
)
| #{translate('managing_your_subscription')}
li(role="presentation")
a(
role="tab"
data-toggle="tab"
data-bs-toggle="tab"
href='#' + overleafIndividualPlans
aria-controls=overleafIndividualPlans
)
| #{translate('overleaf_individual_plans')}
li(role="presentation")
a(
role="tab"
data-toggle="tab"
data-bs-toggle="tab"
href='#' + overleafGroupPlans
aria-controls=overleafGroupPlans
)
| #{translate('overleaf_group_plans')}
.tab-content
.tab-pane.active(
role="tabpanel"
id=managingYourSubscription
)
+managingYourSubscription()
.tab-pane(
role="tabpanel"
id=overleafIndividualPlans
)
+overleafIndividualPlans()
.tab-pane(
role="tabpanel"
id=overleafGroupPlans
)
+overleafGroupPlans()
.row
.col-xs-12.plans-faq-support
span #{translate('still_have_questions')}
button(data-ol-open-contact-form-modal="general")
span(style="margin-right: 4px") #{translate('contact_support')}
i.icon-md.material-symbols.material-symbols-rounded.material-symbols-arrow-right(aria-hidden="true") arrow_right_alt