New plans page

This commit is contained in:
Joseph Schorr 2013-12-23 15:04:52 -05:00
parent 7e42915755
commit 06806c97dd
2 changed files with 229 additions and 35 deletions

View file

@ -662,42 +662,163 @@ i.toggle-icon:hover {
.plans-list .plan {
vertical-align: top;
padding: 10px;
border: 1px solid #eee;
border-top: 4px solid #94C9F7;
font-size: 1.4em;
margin-top: 5px;
}
.plans-list .plan.business-plan {
border: 1px solid #eee;
border-top: 4px solid #94F794;
}
.plans-list .plan.bus-small {
border: 1px solid #ddd;
border-top: 4px solid #47A447;
margin-top: 0px;
font-size: 1.6em;
border-top: 6px solid #46ac39;
margin-top: -10px;
}
.plans-list .plan.bus-small .plan-box {
background: black !important;
}
.plans-list .plan:last-child {
margin-right: 0px;
}
.plans-list .plan .plan-box {
background: #444;
padding: 10px;
color: white;
}
.plans-list .plan .plan-title {
text-transform: uppercase;
padding-top: 25px;
padding-bottom: 20px;
margin-bottom: 10px;
display: block;
font-weight: bold;
border-bottom: 1px solid #eee;
}
.visible-sm-inline {
display: none;
}
.hidden-sm-inline {
display: inline;
}
@media (max-width: 991px) and (min-width: 768px) {
.visible-sm-inline {
display: inline;
}
.hidden-sm-inline {
display: none;
}
}
.plans-list .plan-box .description {
color: white;
margin-top: 6px;
font-size: 12px !important;
}
.plans-list .plan button {
margin-top: 6px;
margin-bottom: 6px;
}
.plans-list .plan.bus-small button {
font-size: 1em;
}
.plans-list .features-bar {
padding-top: 248px;
}
.plans-list .features-bar .feature .count {
padding: 10px;
}
.plans-list .features-bar .feature {
height: 43px;
text-align: right;
white-space: nowrap;
}
.plans-list .features-bar .feature .feature-tooltip {
border-bottom: 1px dotted black;
cursor: default;
}
.plans-list .features-bar .feature i {
margin-left: 16px;
float: right;
width: 16px;
font-size: 16px;
text-align: center;
margin-top: 2px;
}
.plans-list .plan .features {
padding: 6px;
background: #eee;
padding-bottom: 0px;
}
.plans-list .plan .feature {
text-align: center;
padding: 10px;
border-bottom: 1px solid #ddd;
font-size: 14px;
}
.plans-list .plan .feature:after {
content: "";
border-radius: 50%;
display: inline-block;
width: 16px;
height: 16px;
}
.plans-list .plan .visible-xs .feature {
text-align: left;
}
.plans-list .plan .visible-xs .feature:after {
float: left;
margin-right: 10px;
}
.plans-list .plan .feature.notpresent {
color: #ccc;
}
.plans-list .plan .feature.present:after {
background: #428bca;
}
.plans-list .plan.business-plan .feature.present:after {
background: #46ac39;
}
.plans-list .plan .count, .plans-list .features-bar .count {
background: white;
border-bottom: 0px;
text-align: center !important;
}
.plans-list .plan .count b, .plans-list .features-bar .count b {
font-size: 1.5em;
display: block;
}
.plans-list .plan .feature:last-child {
border-bottom: 0px;
}
.plans-list .plan-price {
margin-bottom: 10px;
}
.plan-price {
margin-bottom: 10px;
display: block;
font-weight: bold;
font-size: 1.8em;
position: relative;
}