Make the account settings view a tiny bit nicer looking

This commit is contained in:
Joseph Schorr 2013-10-02 14:50:02 -04:00
parent dc3ec72432
commit c2e9a766f7
4 changed files with 28 additions and 11 deletions

View file

@ -348,7 +348,7 @@ def delete_permissions(namespace, repository, username):
abort(403) # Permission denied
def subscription_view(stripe_subscription, used_repos):
def subscription_view(stripe_subscription, used_repos):
return {
'currentPeriodStart': stripe_subscription.current_period_start,
'currentPeriodEnd': stripe_subscription.current_period_end,
@ -401,8 +401,9 @@ def get_subscription():
if user.stripe_id:
private_repos = model.get_private_repo_count(user.username)
cus = stripe.Customer.retrieve(user.stripe_id)
return jsonify(subscription_view(cus.subscription, private_repos))
if cus.subscription:
return jsonify(subscription_view(cus.subscription, private_repos))
abort(404)
@ -418,4 +419,4 @@ def cancel_subscription():
cus.cancel_subscription()
return make_response('Deleted', 204)
abort(404)
abort(404)

View file

@ -638,6 +638,20 @@ p.editable:hover i {
border: inherit;
}
.user-admin .panel-plan {
text-align: center;
}
.user-admin .plan-description {
font-size: 1.2em;
margin-bottom: 10px;
}
.user-admin .used-description {
font-size: 1.2em;
margin-bottom: 10px;
}
/* Overrides for the markdown editor. */
.wmd-panel .btn-toolbar {

View file

@ -1,4 +1,4 @@
<div class="container">
<div class="container user-admin">
<div class="loading" ng-show="planLoading || planChanging">
<div class="spin"></div>
</div>
@ -17,8 +17,8 @@
Subscribed
</span>
</div>
<div class="panel-body">
{{ plan.privateRepos }} Private Repositories<br>
<div class="panel-body panel-plan">
<div class="plan-description"><b>{{ plan.privateRepos }}</b> Private Repositories</div>
<button class="btn btn-primary" ng-hide="subscription" ng-click="subscribe(plan.stripeId)">Subscribe</button>
<button class="btn" ng-show="subscription && (subscription.plan != plan.stripeId)" ng-click="changeSubscription(plan.stripeId)">Change</button>
<button class="btn btn-danger" ng-show="subscription.plan == plan.stripeId" ng-click="cancelSubscription()">Cancel</button>
@ -33,13 +33,15 @@
Plan Usage
</div>
<div class="panel-body">
<b>{{ subscription.usedPrivateRepos }}</b> of {{ subscribedPlan.privateRepos }} private repositories used
<div class="used-description">
<b>{{ subscription.usedPrivateRepos }}</b> of <b>{{ subscribedPlan.privateRepos }}</b> private repositories used
</div>
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="{{ subscription.usedPrivateRepos }}" aria-valuemin="0" aria-valuemax="{{ subscribedPlan.privateRepos }}" style="width: {{ planUsagePercent }}%;">
<div ng-class="'progress-bar ' + (planUsagePercent > 90 ? 'progress-bar-danger' : '')" role="progressbar" aria-valuenow="{{ subscription.usedPrivateRepos }}" aria-valuemin="0" aria-valuemax="{{ subscribedPlan.privateRepos }}" style="width: {{ planUsagePercent }}%;">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

View file

@ -70,7 +70,7 @@
<b class="caret"></b>
</a>
<ul class="dropdown-menu">
<li><a href="#/user">User Settings</a></li>
<li><a href="#/user">Account Settings</a></li>
<li><a href="/signout">Sign out</a></li>
</ul>
</li>