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

sq: tab and plan clean up

Browse source
This commit is contained in:
Rob Szumski 2015-10-23 01:12:24 +00:00 • committed by Joseph Schorr
parent bbffe66387
commit 8e44c7b280
2 changed files with 44 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

40
static/css/pages/plans.css
View file

@ -13,8 +13,8 @@
.plans-panel .plan-tabs { .plans-panel .plan-tabs {
text-align: center; text-align: center;
margin-left: 30px; padding-left: 30px;
margin-right: 30px; padding-right: 30px;
margin-bottom: 40px; margin-bottom: 40px;
} }
@ -24,10 +24,16 @@
width: 49%; width: 49%;
} }
.plans-panel .plans-tab a { .plans-panel .plan-tabs a {
padding-bottom: 25px; padding-bottom: 25px;
} }
.plans-panel .plan-tabs a:hover {
background-color: transparent;
border: 0px;
cursor: pointer;
}
.plans-panel .plan-tabs a .tab-logo { .plans-panel .plan-tabs a .tab-logo {
display: block; display: block;
margin-bottom: 25px; margin-bottom: 25px;
@ -43,7 +49,12 @@
display: block; display: block;
text-align: center; text-align: center;
font-size: 16px; font-size: 16px;
color: #888; color: #1D314F;
font-weight: 300;
}
.plans-panel .plan-tabs a:hover .tab-title {
color: #51A3D9;
} }
@media (max-width: 767px) { @media (max-width: 767px) {
@ -68,17 +79,20 @@
content: "-"; content: "-";
text-transform: uppercase; text-transform: uppercase;
color: white; color: white;
height: 25px;
} }
.plans-panel .plan-col.popular:before { .plans-panel .plan-col.popular:before {
content: "Most Popular"; content: "Most Popular";
color: #2276ad; color: #2276ad;
height: 25px;
line-height: 25px;
background-color: #c1dff3; background-color: #c1dff3;
} }
.plans-panel .plan-box { .plans-panel .plan-box {
background-color: #1d3447; background-color: #1d3447;
color: #ddd; color: #fff;
padding: 20px; padding: 20px;
} }
@ -106,7 +120,7 @@
.plans-panel .plan-box .plan-header .plan-box-price { .plans-panel .plan-box .plan-header .plan-box-price {
float: right; float: right;
width: 60px; width: 60px;
font-size: 22px; font-size: 18px;
position: relative; position: relative;
} }
@ -116,6 +130,10 @@
width: 100%; width: 100%;
} }
.plans-panel .plan-box .trial-button .fa {
padding-left: 5px;
}
.plans-panel .plan-box select { .plans-panel .plan-box select {
margin-bottom: 10px; margin-bottom: 10px;
} }
@ -123,15 +141,7 @@
.plans-panel .plan-box ul { .plans-panel .plan-box ul {
padding: 0px; padding: 0px;
padding-left: 16px; padding-left: 16px;
} list-style: square;
.plans-panel .plan-box .plan-header .plan-box-price:after {
content: "/ mo";
position: absolute;
top: 9px;
right: 0px;
font-size: 12px;
color: #aaa;
} }
.plans-panel .plan-features { .plans-panel .plan-features {

26
static/partials/plans.html
View file

@ -34,7 +34,7 @@
<div class="col-md-3 plan-col"> <div class="col-md-3 plan-col">
<div class="plan-box"> <div class="plan-box">
<div class="plan-header"> <div class="plan-header">
<span class="plan-box-price">$12</span> <span class="plan-box-price">$12/mo</span>
<b>Personal</b> <b>Personal</b>
</div> </div>
<ul> <ul>
@ -42,7 +42,10 @@
<li>Unlimited public repos</li> <li>Unlimited public repos</li>
</ul> </ul>
<div class="plan-description">Great for individuals</div> <div class="plan-description">Great for individuals</div>
<button class="btn btn-primary trial-button" ng-click="buyNow('personal-30')">Start Free Trial</button> <a href="javascript:void(0)" class="btn btn-primary trial-button" ng-click="buyNow('personal-30')">
Start Free Trial
<span class="fa fa-angle-double-right"></span>
</a>
</div> </div>
<ul class="plan-features"> <ul class="plan-features">
@ -54,7 +57,7 @@
<div class="col-md-3 plan-col"> <div class="col-md-3 plan-col">
<div class="plan-box"> <div class="plan-box">
<div class="plan-header"> <div class="plan-header">
<span class="plan-box-price">$25</span> <span class="plan-box-price">$25/mo</span>
<b>Skiff</b> <b>Skiff</b>
</div> </div>
<ul> <ul>
@ -63,7 +66,10 @@
<li>Team-based permissions</li> <li>Team-based permissions</li>
</ul> </ul>
<div class="plan-description">Great for startups</div> <div class="plan-description">Great for startups</div>
<button class="btn btn-primary trial-button" ng-click="buyNow('bus-micro-30')">Start Free Trial</button> <a href="javascript:void(0)" class="btn btn-primary trial-button" ng-click="buyNow('bus-micro-30')">
Start Free Trial
<span class="fa fa-angle-double-right"></span>
</a>
</div> </div>
<ul class="plan-features"> <ul class="plan-features">
@ -75,7 +81,7 @@
<div class="col-md-3 plan-col popular"> <div class="col-md-3 plan-col popular">
<div class="plan-box"> <div class="plan-box">
<div class="plan-header"> <div class="plan-header">
<span class="plan-box-price">$50</span> <span class="plan-box-price">$50/mo</span>
<b>Yacht</b> <b>Yacht</b>
</div> </div>
<ul> <ul>
@ -84,7 +90,10 @@
<li>Team-based permissions</li> <li>Team-based permissions</li>
</ul> </ul>
<div class="plan-description">Great for small businesses</div> <div class="plan-description">Great for small businesses</div>
<button class="btn btn-primary trial-button" ng-click="buyNow('bus-small-30')">Start Free Trial</button> <a href="javascript:void(0)" class="btn btn-primary trial-button" ng-click="buyNow('bus-small-30')">
Start Free Trial
<span class="fa fa-angle-double-right"></span>
</a>
</div> </div>
<ul class="plan-features"> <ul class="plan-features">
@ -111,7 +120,10 @@
<li>Team-based permissions</li> <li>Team-based permissions</li>
</ul> </ul>
<div class="plan-description">Great for enterprises</div> <div class="plan-description">Great for enterprises</div>
<button class="btn btn-primary trial-button" ng-click="buyNow(dropdownPlan)">Start Free Trial</button> <a href="javascript:void(0)" class="btn btn-primary trial-button" ng-click="buyNow(dropdownPlan)">
Start Free Trial
<span class="fa fa-angle-double-right"></span>
</a>
</div> </div>
<ul class="plan-features"> <ul class="plan-features">