-{include file='documentHeader'}
-
-<head>
- <title>{lang}wcf.user.menu.settings.paidSubscription{/lang} - {lang}wcf.user.menu.settings{/lang} - {PAGE_TITLE|language}</title>
-
- {include file='headInclude'}
-
+{capture assign='headContent'}
{if PAID_SUBSCRIPTION_ENABLE_TOS_CONFIRMATION}
<script data-relocate="true">
$(function() {
</style>
</noscript>
{/if}
-</head>
-
-<body id="tpl{$templateName|ucfirst}" data-template="{$templateName}" data-application="{$templateNameApplication}">
+{/capture}
{include file='userMenuSidebar'}
-{include file='header' sidebarOrientation='left'}
-
-<header class="boxHeadline">
- <h1>{lang}wcf.user.menu.settings.paidSubscription{/lang}</h1>
-</header>
-
-{include file='userNotice'}
-
-<div class="contentNavigation">
- {hascontent}
- <nav>
- <ul>
- {content}
- {event name='contentNavigationButtonsTop'}
- {/content}
- </ul>
- </nav>
- {/hascontent}
-</div>
+{include file='header'}
{if $subscriptions|count}
- <header class="boxHeadline boxSubHeadline">
- <h2>{lang}wcf.paidSubscription.availableSubscriptions{/lang}</h2>
- </header>
-
- {if PAID_SUBSCRIPTION_ENABLE_TOS_CONFIRMATION}
- <div class="container containerPadding marginTop">
- <label><input type="checkbox" id="tosConfirmed" name="tosConfirmed" value="1" /> {lang}wcf.paidSubscription.confirmTOS{/lang}</label>
- </div>
- {/if}
+ <section class="section sectionContainerList paidSubscriptionList">
+ <header class="sectionHeader">
+ <h2 class="sectionTitle">{lang}wcf.paidSubscription.availableSubscriptions{/lang}</h2>
+ {if PAID_SUBSCRIPTION_ENABLE_TOS_CONFIRMATION}
+ <div class="sectionDescription"><label><input type="checkbox" id="tosConfirmed" name="tosConfirmed" value="1" /> {lang}wcf.paidSubscription.confirmTOS{/lang}</label></div>
+ {/if}
+ </header>
- <div class="container marginTop paidSubscriptionList">
<ul class="containerList">
{foreach from=$subscriptions item=subscription}
<li>
<div class="containerHeadline">
- <h3>{$subscription->title|language}</h3>
+ <h3>{$subscription->title|language} <span class="badge label">{lang}wcf.paidSubscription.formattedCost{/lang}</span></h3>
<p>{@$subscription->description|language|newlineToBreak}</p>
-
- <p class="marginTopTiny">{lang}wcf.paidSubscription.formattedCost{/lang}</p>
-
- <ul class="buttonList marginTopTiny">
+ </div>
+
+ <div class="containerContent">
+ <ul class="buttonList">
{foreach from=$subscription->getPurchaseButtons() item=button}
<li>{@$button}</li>
{/foreach}
</li>
{/foreach}
</ul>
- </div>
+ </section>
{/if}
{if $userSubscriptions|count}
- <header class="boxHeadline boxSubHeadline">
- <h2>{lang}wcf.paidSubscription.purchasedSubscriptions{/lang}</h2>
- </header>
+ <section class="section sectionContainerList">
+ <h2 class="sectionTitle">{lang}wcf.paidSubscription.purchasedSubscriptions{/lang}</h2>
- <div class="container marginTop">
<ul class="containerList">
{foreach from=$userSubscriptions item=userSubscription}
<li>
<div class="containerHeadline">
<h3>{$userSubscription->getSubscription()->title|language}</h3>
<p>{@$userSubscription->getSubscription()->description|language|newlineToBreak}</p>
-
- {if $userSubscription->endDate}
- <p>{lang}wcf.paidSubscription.expires{/lang}: {@$userSubscription->endDate|time}</p>
- {/if}
</div>
+
+ {if $userSubscription->endDate}
+ <div class="containerContent">
+ <dl class="plain inlineDataList">
+ <dt>{lang}wcf.paidSubscription.expires{/lang}</dt>
+ <dd>{@$userSubscription->endDate|time}</dd>
+ </dl>
+ </div>
+ {/if}
</li>
{/foreach}
</ul>
- </div>
+ </section>
{/if}
{if !$subscriptions|count && !$userSubscriptions|count}
<p class="info">{lang}wcf.global.noItems{/lang}</p>
{/if}
-<div class="contentNavigation">
+<footer class="contentFooter">
{hascontent}
- <nav>
+ <nav class="contentFooterNavigation">
<ul>
- {content}
- {event name='contentNavigationButtonsBottom'}
- {/content}
+ {content}{event name='contentFooterNavigation'}{/content}
</ul>
</nav>
{/hascontent}
-</div>
+</footer>
{include file='footer'}
-
-</body>
-</html>