sq: improve responsiveness

This commit is contained in:
Rob Szumski 2015-10-23 23:12:04 +00:00 committed by Joseph Schorr
parent 2122efe41e
commit a6b4e7a00a
2 changed files with 78 additions and 47 deletions

View file

@ -75,6 +75,7 @@
.plans-panel .tab-pane .plan-col {
padding-left: 12px;
padding-right: 12px;
margin-bottom: 30px;
}
.plans-panel .plan-col:before {
@ -162,15 +163,15 @@
}
.plans-panel .faq-features {
margin-top: 60px;
margin-top: 15px;
border-top: 1px solid #ddd;
}
.plans-panel .features-col {
background-color: #f9f9f9;
padding: 30px;
border: 1px solid #ddd;
border-top: 0px;
border-bottom: 1px solid #ddd;
border-top: none;
}
.plans-panel .row-container {
@ -184,7 +185,7 @@
}
.plans-panel .tab-content {
margin-bottom: 30px;
margin-bottom: 0px;
}
.plans-panel .features-col .features-title {
@ -220,15 +221,37 @@
margin-bottom: 12px;
}
.plans-panel .features-col .features-list li p {
display: none;
}
@media (min-width: 992px) {
.plans-panel .features-col .features-list li p {
display: block;
}
.plans-panel .features-col {
border-right: none;
border-left: 1px solid #ddd;
}
}
.plans-panel .faq-col {
padding: 50px;
padding-bottom: 0px;
padding-top: 30px;
padding-left: 30px;
padding-right: 30px;
margin-bottom: 20px
}
.plans-panel .faq-col h4 {
color: #2e79b9;
margin-top: 50px;
font-weight: 500;
margin-bottom: 23px;
}
.plans-panel .faq-col p+h4 {
margin-top: 40px;
}
.plans-panel .faq-col h4:first-child {

View file

@ -171,7 +171,7 @@
<div class="row-container">
<div class="row">
<!-- Personal Plan -->
<div class="col-md-3 plan-col">
<div class="col-md-3 col-sm-6 plan-col">
<div class="plan-box">
<div class="plan-header">
<span class="plan-box-price">$12/mo</span>
@ -194,7 +194,7 @@
</div>
<!-- Skiff Plan -->
<div class="col-md-3 plan-col">
<div class="col-md-3 col-sm-6 plan-col">
<div class="plan-box">
<div class="plan-header">
<span class="plan-box-price">$25/mo</span>
@ -218,7 +218,7 @@
</div>
<!-- Yacht Plan -->
<div class="col-md-3 plan-col popular">
<div class="col-md-3 col-sm-6 plan-col popular">
<div class="plan-box">
<div class="plan-header">
<span class="plan-box-price">$50/mo</span>
@ -242,7 +242,7 @@
</div>
<!-- Larger Plans -->
<div class="col-md-3 plan-col">
<div class="col-md-3 col-sm-6 plan-col">
<div class="plan-box">
<div class="plan-header">
<b>Larger Plans</b>
@ -278,65 +278,73 @@
<div class="row-container-no-margin">
<div class="row">
<!-- Features -->
<div class="col-md-3 col-md-push-9 features-col">
<div class="col-md-5 col-md-push-7 features-col">
<div class="features-title">All plans include:</div>
<div class="row">
<div class="col-lg-12 col-md-12 col-sm-6 col-xs-12">
<ul class="features-list">
<li><i class="fa fa-refresh"></i>
<b>Continuous Integration</b>
Build your containers in response to git pushes: GitHub, BitBucket, Gitlab and others
<p>Build your containers in response to git pushes: GitHub, BitBucket, Gitlab and others</p>
</li>
<li><i class="fa fa-clock-o"></i>
<b>30-Day Free Trial</b>
Your first 30 days are free on Quay.io. Test it out and start building containers!
<p>Your first 30 days are free on Quay.io. Test it out and start building containers!</p>
</li>
<li><i class="fa fa-hdd-o"></i>
<b>Public Repositories</b>
Provide a public download page for your container. The best part, theyre free!
<p>Provide a public download page for your container. The best part, they're free!</p>
</li>
<li><i class="fa ci-robot"></i>
<b>Robot Accounts</b>
Create credentials designed for deploying software automatically.
</li>
<li><i class="fa fa-group"></i>
<b>Teams</b>
Teams can collectively have access to manage specific repositories on your account.
</li>
<li><i class="fa fa-lock"></i>
<b>SSL Encryption</b>
Transit between Quay.io and your servers is secured automatically.
</li>
<li><i class="fa fa-bar-chart"></i>
<b>Logging &amp; Auditing</b>
Auditing is essential for everything in your CI pipeline. Actions via API and UI are tracked.
</li>
<li><i class="fa fa-calendar"></i>
<b>Invoice History</b>
Download past invoices for your billing team or purchasing departement.
<p>Create credentials designed for deploying software automatically.</p>
</li>
</ul>
</div>
<div class="col-lg-12 col-md-12 col-sm-6 col-xs-12">
<ul class="features-list">
<li><i class="fa fa-group"></i>
<b>Teams</b>
<p>Teams can collectively have access to manage specific repositories on your account.</p>
</li>
<li><i class="fa fa-lock"></i>
<b>SSL Encryption</b>
<p>Transit between Quay.io and your servers is secured automatically.</p>
</li>
<li><i class="fa fa-bar-chart"></i>
<b>Logging &amp; Auditing</b>
<p>Auditing is essential for everything in your CI pipeline. Actions via API and UI are tracked.</p>
</li>
<li><i class="fa fa-calendar"></i>
<b>Invoice History</b>
<p>Download past invoices for your billing team or purchasing departement.</p>
</li>
</ul>
</div>
</div>
</div>
<!-- FAQ -->
<div class="col-md-9 col-md-pull-3 faq-col">
<div class="col-md-7 col-md-pull-5 faq-col">
<h4>How do I use Quay with my servers and code?</h4>
<p>Using Quay with your infrastructure is separated into two main actions: <b>building containers</b> and <b>distributing them to your servers</b>.</p>
<p>You can configure Quay to automatically build containers of your code on each commit. Integrations with GitHub, Bitbucket, GitLab and self-hosted Git repositories are supported. Each built container is stored on Quay and is available to be pulled down onto your servers.</p>
<p>To distribute your private containers onto your servers, Docker or rkt must be configured with the correct credientials. Quay has sophisticated access controls organizations, teams, robot accounts, and more to give you full control over which servers can pull down your containers. An API can be used to automate the creation and management of these credentials.</p>
<p>To distribute your private containers onto your servers, Docker or rkt must be configured with the correct credientials. Quay has sophisticated access controls &mdash; organizations, teams, robot accounts, and more &mdash; to give you full control over which servers can pull down your containers. An API can be used to automate the creation and management of these credentials.</p>
<h4>How is Quay optimized for a team environment?</h4>
<p>Quays permission model is designed for teams. Each new user can be assigned to one or more teams, with specific permissions. Robot accounts, used for automated deployments, can be managed per team as well. This system allows for each development team to manage their own credentials.</p>
<p>Quay's permission model is designed for teams. Each new user can be assigned to one or more teams, with specific permissions. Robot accounts, used for automated deployments, can be managed per team as well. This system allows for each development team to manage their own credentials.</p>
<p>Full logging and auditing is integrated into every part of the application and API. Quay helps you dig into every action for more details.</p>