vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Fix plans table on mobile

Browse source
This commit is contained in:
Joseph Schorr 2015-01-12 12:17:00 -05:00
parent 42ea3b835c
commit 5a0277b465
2 changed files with 50 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

16
static/css/quay.css
View file

@ -3547,6 +3547,22 @@ p.editable:hover i {
font-size: 16px; font-size: 16px;
} }
.plans-table ul {
margin-top: 10px;
padding: 0px;
}
.plans-table ul li {
padding: 4px;
margin: 0px;
}
.plans-table ul li .plan-info {
padding: 4px;
}
.repo-breadcrumb-element .crumb { .repo-breadcrumb-element .crumb {
cursor: pointer; cursor: pointer;
} }

50
static/directives/plans-table.html
View file

@ -1,23 +1,41 @@
<div class="plans-table-element"> <div class="plans-table-element">
<table class="table table-hover plans-table-table" ng-show="plans"> <ul class="plans-table-list visible-xs">
<thead> <li ng-repeat="plan in plans" ng-class="currentPlan == plan ? 'active' : ''">
<th>Plan</th>
<th>Private Repositories</th>
<th style="min-width: 85px">Price</th>
<th></th>
</thead>
<tr ng-repeat="plan in plans" ng-class="currentPlan == plan ? 'active' : ''">
<td>{{ plan.title }}</td>
<td>{{ plan.privateRepos }}</td>
<td><div class="plan-price">${{ plan.price / 100 }}</div></td>
<td class="controls">
<a class="btn" href="javascript:void(0)" <a class="btn" href="javascript:void(0)"
ng-class="currentPlan == plan ? 'btn-primary' : 'btn-default'" ng-class="currentPlan == plan ? 'btn-primary' : 'btn-default'"
ng-click="setPlan(plan)"> ng-click="setPlan(plan)">
{{ currentPlan == plan ? 'Selected' : 'Choose' }} {{ plan.title }}
</a> </a>
</td>
</tr> <div class="plan-info">
</table> ${{ plan.price / 100 }} / month -
{{ plan.privateRepos }} repositories
</div>
</li>
</ul>
<div class="hidden-xs">
<table class="table table-hover plans-table-table" ng-show="plans">
<thead>
<th>Plan</th>
<th>Private Repositories</th>
<th style="min-width: 85px">Price</th>
<th></th>
</thead>
<tr ng-repeat="plan in plans" ng-class="currentPlan == plan ? 'active' : ''">
<td>{{ plan.title }}</td>
<td>{{ plan.privateRepos }}</td>
<td><div class="plan-price">${{ plan.price / 100 }}</div></td>
<td class="controls">
<a class="btn" href="javascript:void(0)"
ng-class="currentPlan == plan ? 'btn-primary' : 'btn-default'"
ng-click="setPlan(plan)">
{{ currentPlan == plan ? 'Selected' : 'Choose' }}
</a>
</td>
</tr>
</table>
</div>
</div> </div>