tsai
/
eventhub
mirror of https://github.com/abpframework/eventhub
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Use real data instead of dummy data in pricing table

pull/79/head
berkansasmaz 5 years ago
parent
6347a4d960
commit
2231add237
No known key found for this signature in database GPG Key ID: 884D815C3F32BE00
2 changed files with 53 additions and 63 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      src/EventHub.Web/Pages/Organizations/Profile.cshtml
  2. 115
      src/EventHub.Web/Pages/Pricing.cshtml

1
src/EventHub.Web/Pages/Organizations/Profile.cshtml
View File

@ -13,7 +13,6 @@
@model EventHub.Web.Pages.Organizations.ProfilePageModel @model EventHub.Web.Pages.Organizations.ProfilePageModel
@inject IClock Clock @inject IClock Clock
@inject IOptions<EventHubUrlOptions> UrlOptions @inject IOptions<EventHubUrlOptions> UrlOptions
@inject IOptionsSnapshot<PremiumPlanInfoOptions> PremiumPlanInfoOptionsSnapshot
@section scripts { @section scripts {
<abp-script type="@typeof(Sweetalert2ScriptContributor)"/> <abp-script type="@typeof(Sweetalert2ScriptContributor)"/>

115
src/EventHub.Web/Pages/Pricing.cshtml
View File

@ -1,33 +1,34 @@
@page "/pricing/{organizationName}" @page "/pricing/{organizationName}"
@using EventHub.Localization @using EventHub.Localization
@using EventHub.Web.PaymentRequests
@using Microsoft.AspNetCore.Mvc.Localization @using Microsoft.AspNetCore.Mvc.Localization
@using Microsoft.Extensions.Options
@model EventHub.Web.Pages.Pricing @model EventHub.Web.Pages.Pricing
@inject IHtmlLocalizer<EventHubResource> L @inject IHtmlLocalizer<EventHubResource> L
@inject IOptionsSnapshot<PremiumPlanInfoOptions> PremiumPlanInfoOptionsSnapshot
@section styles { @section styles {
<abp-style src="/Pages/Pricing.css" /> <abp-style src="/Pages/Pricing.css" />
} }
@* TODO(berkansasmaz): Use real words instead of dummy words.*@
<main class="static-page container mt-5"> <main class="static-page container mt-5">
<h1 class="text-center mb-3">Pricing</h1> <h1 class="text-center mb-3">Pricing</h1>
<p class="text-center mb-5">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam ut nulla consequat, tempus sapien in, <p class="text-center mb-5">Simple plans for everyone</p>
pellentesque nunc. Sed at nunc pellentesque, fermentum mi et, fermentum massa. </p>
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="col-md-6">
<div class="card"> <div class="card">
<div class="card-body px-4 py-4 text-center"> <div class="card-body px-4 py-4 text-center">
<h2 class="mt-4">Normal Account</h2> <h2 class="mt-4">Normal Account</h2>
<p class="my-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam utnulla consequat, tempus sapien in.</p> <p class="my-4">For individuals and small teams trying out EventHub for an unlimited period.</p>
<div class="price mb-4"> <div class="price mb-4">
<small>$</small> <small>$</small>
<span>0</span> <span>0</span>
</div> </div>
<ul class="list-check-icon mb-4 text-start"> <ul class="list-check-icon mb-4 text-start">
<li><i class="fa fa-check-circle"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li> <li><i class="fa fa-check-circle"></i> Unlimited event creation. </li>
<li><i class="fa fa-check-circle"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li> <li><i class="fa fa-check-circle"></i> Adding unlimited tracks and sessions to events. </li>
<li><i class="fa fa-check-circle"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li> <li><i class="fa fa-check-circle"></i> Unlimited participant capacity for events. </li>
</ul> </ul>
</div> </div>
</div> </div>
</div> </div>
@ -37,18 +38,17 @@
<div class="card"> <div class="card">
<div class="card-body px-4 py-4 text-center"> <div class="card-body px-4 py-4 text-center">
<h2 class="mt-4">Premium Account</h2> <h2 class="mt-4">Premium Account</h2>
<p class="my-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam utnulla consequat, tempus sapien in.</p> <p class="my-4">For medium teams and large teams who want to highlight their organization for a year.</p>
<div class="price mb-4"> <div class="price mb-4">
<small>$</small> <small>$</small>
<span>@Model.PremiumPlanInfo.Price</span> <span>@Model.PremiumPlanInfo.Price</span>
</div> </div>
<ul class="list-check-icon mb-4 text-start"> <ul class="list-check-icon mb-4 text-start">
<li><i class="fa fa-check-circle"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li> <li><i class="fa fa-check-circle"></i> Unlimited event creation. </li>
<li><i class="fa fa-check-circle"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li> <li><i class="fa fa-check-circle"></i> Adding unlimited tracks and sessions to events. </li>
<li><i class="fa fa-check-circle"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit adipiscing elit. </li> <li><i class="fa fa-check-circle"></i> Unlimited participant capacity for events. </li>
<li><i class="fa fa-check-circle"></i> Lorem ipsum adipiscing elit dolor sit amet, consectetur adipiscing elit. </li> <li><i class="fa fa-check-circle"></i> Be more prominent in the organization list. </li>
<li><i class="fa fa-check-circle"></i> Lorem adipiscing elit adipiscing elitipsum dolor sit amet, consectetur adipiscing elit. </li> <li><i class="fa fa-check-circle"></i> More coming soon. </li>
<li><i class="fa fa-check-circle"></i> Lorem ipsum dolor sit amet, consectetur adipiscing elit. </li>
</ul> </ul>
@if (Model.Organization.IsPremium) @if (Model.Organization.IsPremium)
{ {
@ -71,52 +71,43 @@
</div> </div>
} }
<h2 class="text-center mb-3">Frequently Asked Questions</h2> <h2 class="text-center mb-3">Frequently Asked Questions</h2>
<div id="accordion" class="mb-5 pb-5 faq-container">
<div id="accordion" class="mb-5 pb-5 faq-container"> <div class="faq" data-anchor-id="accordion124">
<div class="faq shown" data-anchor-id="accordion1"> <div class="faq-header">
<div class="faq-header"> <h5><button class="btn btn-faq collapsed" data-bs-toggle="collapse" data-bs-target="#accordion124" aria-expanded="false" aria-controls="accordion124">What is premium organization?<i class="fas fa-chevron-up"></i> </button></h5>
<h5><button class="btn btn-faq" data-bs-toggle="collapse" data-bs-target="#accordion1" aria-expanded="false" aria-controls="accordion1">Lorem ipsum dolor sit amet, consectetur adipiscing elit?<i class="fas fa-chevron-up"></i> </button></h5> </div>
</div> <div id="accordion124" class="collapse" data-bs-parent="#accordion" style="">
<div id="accordion1" class="collapse show" data-bs-parent="#accordion" style=""> <div class="faq-body">
<div class="faq-body"> <p>With Premium organization, you can reach more people by highlighting your organization. However, for now, it has no different from a normal organization in terms of feature set.
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
</p> </div>
</div> </div>
</div> </div>
</div> <div class="faq" data-anchor-id="accordion12">
<div class="faq" data-anchor-id="accordion12"> <div class="faq-header">
<div class="faq-header"> <h5><button class="btn btn-faq collapsed" data-bs-toggle="collapse" data-bs-target="#accordion12" aria-expanded="false" aria-controls="accordion12">How do I renew my plan?<i class="fas fa-chevron-up"></i> </button></h5>
<h5><button class="btn btn-faq collapsed" data-bs-toggle="collapse" data-bs-target="#accordion12" aria-expanded="false" aria-controls="accordion12">What onsectetur adipiscinglor sit amet?<i class="fas fa-chevron-up"></i> </button></h5> </div>
</div> <div id="accordion12" class="collapse" data-bs-parent="#accordion" style="">
<div id="accordion12" class="collapse" data-bs-parent="#accordion" style=""> <div class="faq-body">
<div class="faq-body"> @{
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. var canExtendBeforeHowManyMonths = PremiumPlanInfoOptionsSnapshot.Value.OnePremiumPeriodAsMonth - PremiumPlanInfoOptionsSnapshot.Value.CanBeExtendedAfterHowManyMonths;
</p> }
</div> <p>@(canExtendBeforeHowManyMonths == PremiumPlanInfoOptionsSnapshot.Value.OnePremiumPeriodAsMonth ? "You " : "In the last " + canExtendBeforeHowManyMonths + " months of your premium period, you") can renew your plan by going to the Organization detail page.
</div> </p>
</div> </div>
<div class="faq" data-anchor-id="accordion123"> </div>
<div class="faq-header"> </div>
<h5><button class="btn btn-faq collapsed" data-bs-toggle="collapse" data-bs-target="#accordion123" aria-expanded="false" aria-controls="accordion123">What onsectetur adipiscing elit. Lorem ipsum dolor sit amet?<i class="fas fa-chevron-up"></i> </button></h5> <div class="faq" data-anchor-id="accordion123">
</div> <div class="faq-header">
<div id="accordion123" class="collapse" data-bs-parent="#accordion" style=""> <h5><button class="btn btn-faq collapsed" data-bs-toggle="collapse" data-bs-target="#accordion123" aria-expanded="false" aria-controls="accordion123">What happens when my license period ends?<i class="fas fa-chevron-up"></i> </button></h5>
<div class="faq-body"> </div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. <div id="accordion123" class="collapse" data-bs-parent="#accordion" style="">
</p> <div class="faq-body">
</div> <p>Don't worry about even if your organization has run out of premium, you can upgrade back to the Premium plan at any time.
</div> </p>
</div> </div>
<div class="faq" data-anchor-id="accordion124"> </div>
<div class="faq-header"> </div>
<h5><button class="btn btn-faq collapsed" data-bs-toggle="collapse" data-bs-target="#accordion124" aria-expanded="false" aria-controls="accordion124">Asectetur adipiscing elorem ipsum dolor sit amet?<i class="fas fa-chevron-up"></i> </button></h5> </div>
</div>
<div id="accordion124" class="collapse" data-bs-parent="#accordion" style="">
<div class="faq-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
</div>
</div>
</div>
</div>
</div> </div>
</main> </main>

Write Preview
Loading…
Cancel
Save